← Back to branch summary

~bfiller/gallery-app/silo-test

« back to all changes in this revision

Viewing changes to rc/qml/MediaViewer/VideoViewerDelegate.qml

  • Committer: Arthur Mello
  • Date: 2014-09-02 13:53:01 UTC
  • Revision ID: arthur.mello@canonical.com-20140902135301-jbc8c94gk3a5n543
Replace the old MediaViewer with cleaner code inspired by the camera-app photo roll
Prevent double clicks from firing a single click too, so the header doesn't appear when double clicking to zoom

Show diffs side-by-side

added added

removed removed

Lines of Context:
rc/qml/MediaViewer/VideoViewerDelegate.qml
1
 
/*
2
 
 * Copyright (C) 2013 Canonical Ltd
3
 
 *
4
 
 * This program is free software: you can redistribute it and/or modify
5
 
 * it under the terms of the GNU General Public License version 3 as
6
 
 * published by the Free Software Foundation.
7
 
 *
8
 
 * This program is distributed in the hope that it will be useful,
9
 
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
10
 
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
11
 
 * GNU General Public License for more details.
12
 
 *
13
 
 * You should have received a copy of the GNU General Public License
14
 
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
15
 
 */
16
 
 
17
 
import QtQuick 2.0
18
 
import QtMultimedia 5.0
19
 
import Gallery 1.0
20
 
 
21
 
/*!
22
 
VideoViewerDelegate is an item to show a vide thumbnail, and play the video
23
 
if requrested
24
 
*/
25
 
Item {
26
 
    id: videoViewerDelegate
27
 
 
28
 
    /// The video item that to be shown by this component
29
 
    property MediaSource mediaSource
30
 
    /// Is true, once this component is fully usable
31
 
    property bool isLoaded: thumbnail.status === Image.Ready
32
 
 
33
 
    /// Stops the video playback if running
34
 
    function reset() {
35
 
        state = "stopped";
36
 
    }
37
 
 
38
 
    /// Starts playing the video
39
 
    function playVideo() {
40
 
        if (!loader_video.item)
41
 
            loader_video.sourceComponent = component_video;
42
 
 
43
 
        if (loader_video.item.source !== mediaSource.path)
44
 
            loader_video.item.source = mediaSource.path;
45
 
        loader_video.item.play();
46
 
    }
47
 
 
48
 
    /// Toggles between playing and pausing the video playback
49
 
    function togglePlayPause() {
50
 
        if (!loader_video.item)
51
 
            loader_video.sourceComponent = component_video;
52
 
 
53
 
        if (videoViewerDelegate.state === "playing") {
54
 
            loader_video.item.pause();
55
 
        } else {
56
 
            videoViewerDelegate.playVideo();
57
 
        }
58
 
    }
59
 
 
60
 
    Image {
61
 
        id: thumbnail
62
 
 
63
 
        anchors.fill: parent
64
 
        fillMode: Image.PreserveAspectFit
65
 
        source: mediaSource.galleryPreviewPath
66
 
        asynchronous: true
67
 
    }
68
 
 
69
 
    Image {
70
 
        // Display a play icon if the media is a video
71
 
        source: "../../img/icon_play.png"
72
 
        anchors.centerIn: parent
73
 
    }
74
 
 
75
 
    MouseArea {
76
 
        anchors.fill: parent
77
 
        onClicked: {
78
 
            videoViewerDelegate.togglePlayPause();
79
 
        }
80
 
    }
81
 
 
82
 
    Component {
83
 
        id: component_video
84
 
        Video {
85
 
            id: video
86
 
            onStopped: {
87
 
                videoViewerDelegate.state = "stopped";
88
 
            }
89
 
            onPaused: {
90
 
                videoViewerDelegate.state = "paused"
91
 
            }
92
 
            onPlaying: {
93
 
                videoViewerDelegate.state = "playing"
94
 
            }
95
 
        }
96
 
    }
97
 
    Loader {
98
 
        id: loader_video
99
 
        anchors.fill: parent
100
 
    }
101
 
 
102
 
 
103
 
    state: "stopped"
104
 
    states: [
105
 
        State {
106
 
            name: "playing"
107
 
            PropertyChanges { target: thumbnail; visible: false }
108
 
        },
109
 
        State {
110
 
            name: "paused"
111
 
            PropertyChanges { target: thumbnail; visible: false }
112
 
        },
113
 
        State {
114
 
            name: "stopped"
115
 
            PropertyChanges { target: thumbnail; visible: true }
116
 
        }
117
 
    ]
118
 
    onStateChanged: {
119
 
        if (state === "stopped") {
120
 
            if (loader_video.item)
121
 
                loader_video.item.stop()
122
 
            loader_video.sourceComponent = null
123
 
        }
124
 
    }
125
 
}