Warning, /plasma-bigscreen/peertube-voice-application/ui/SeekControl.qml is written in an unsupported language. File is not indexed.
0001 import QtMultimedia 5.12 0002 import QtQuick.Layouts 1.4 0003 import QtQuick 2.9 0004 import QtQuick.Controls 2.12 as Controls 0005 import org.kde.kirigami 2.10 as Kirigami 0006 import QtQuick.Templates 2.2 as Templates 0007 import QtGraphicalEffects 1.0 0008 0009 import Mycroft 1.0 as Mycroft 0010 0011 Item { 0012 id: seekControl 0013 property bool opened: false 0014 property int duration: 0 0015 property int playPosition: 0 0016 property int seekPosition: 0 0017 property bool enabled: true 0018 property bool seeking: false 0019 property bool backRequested: false 0020 property var videoControl 0021 property string title 0022 0023 property bool smallMode: root.height > root.width ? 1 : 0 0024 0025 clip: true 0026 implicitHeight: mainLayout.implicitHeight + Kirigami.Units.largeSpacing * 2 0027 opacity: opened 0028 0029 Behavior on opacity { 0030 OpacityAnimator { 0031 duration: Kirigami.Units.longDuration 0032 easing.type: Easing.InOutCubic 0033 } 0034 } 0035 0036 onOpenedChanged: { 0037 if (opened) { 0038 seekControl.backRequested = false; 0039 hideTimer.restart(); 0040 } 0041 } 0042 0043 onFocusChanged: { 0044 if(focus) { 0045 backButton.forceActiveFocus() 0046 } 0047 } 0048 0049 Timer { 0050 id: hideTimer 0051 interval: 5000 0052 onTriggered: { 0053 console.log("hide timer triggered") 0054 if(!seekControl.backRequested) { 0055 seekControl.opened = false; 0056 videoRoot.forceActiveFocus(); 0057 } 0058 } 0059 } 0060 0061 Rectangle { 0062 anchors { 0063 left: parent.left 0064 right: parent.right 0065 } 0066 height: parent.height 0067 color: Qt.rgba(Kirigami.Theme.backgroundColor.r, Kirigami.Theme.backgroundColor.g, Kirigami.Theme.backgroundColor.b, 0.6) 0068 y: opened ? 0 : parent.height 0069 0070 Behavior on y { 0071 YAnimator { 0072 duration: Kirigami.Units.longDuration 0073 easing.type: Easing.OutCubic 0074 } 0075 } 0076 0077 ColumnLayout { 0078 id: mainLayout 0079 anchors { 0080 fill: parent 0081 margins: Kirigami.Units.largeSpacing 0082 } 0083 0084 Item { 0085 Layout.fillWidth: true 0086 Layout.minimumHeight: infoLayout.implicitHeight 0087 0088 GridLayout { 0089 id: infoLayout 0090 anchors.fill: parent 0091 columns: smallMode ? 1 : 2 0092 0093 Kirigami.Heading { 0094 id: vidTitle 0095 level: smallMode ? 3 : 2 0096 Layout.minimumWidth: parent.width / 2 0097 Layout.preferredHeight: Kirigami.Units.gridUnit * 2 0098 visible: true 0099 text: "Title: " + videoTitle 0100 z: 100 0101 } 0102 0103 Kirigami.Heading { 0104 id: vidCount 0105 level: smallMode ? 3 : 2 0106 Layout.minimumWidth: parent.width / 2 0107 Layout.preferredHeight: Kirigami.Units.gridUnit * 2 0108 visible: true 0109 Layout.alignment: smallMode ? Qt.AlignLeft : Qt.AlignRight 0110 horizontalAlignment: smallMode ? Qt.AlignLeft : Qt.AlignRight 0111 text: "Views: " + getViewCount(videoViewCount) 0112 z: 100 0113 } 0114 0115 Kirigami.Heading { 0116 id: vidAuthor 0117 level: smallMode ? 3 : 2 0118 Layout.minimumWidth: parent.width / 2 0119 Layout.preferredHeight: Kirigami.Units.gridUnit * 2 0120 visible: true 0121 text: "Published By: " + videoAuthor 0122 z: 100 0123 } 0124 0125 Kirigami.Heading { 0126 id: vidPublishDate 0127 level: smallMode ? 3 : 2 0128 Layout.minimumWidth: parent.width / 2 0129 Layout.preferredHeight: Kirigami.Units.gridUnit * 2 0130 visible: true 0131 Layout.alignment: smallMode ? Qt.AlignLeft : Qt.AlignRight 0132 horizontalAlignment: smallMode ? Qt.AlignLeft : Qt.AlignRight 0133 text: "Published: " + setPublishedDate(videoPublishDate) 0134 z: 100 0135 } 0136 } 0137 } 0138 0139 Kirigami.Separator { 0140 Layout.fillWidth: true 0141 height: 1 0142 } 0143 0144 RowLayout { 0145 id: mainLayout2 0146 Layout.fillWidth: true 0147 Layout.fillHeight: true 0148 Controls.RoundButton { 0149 id: backButton 0150 Layout.preferredWidth: Kirigami.Units.iconSizes.large 0151 Layout.preferredHeight: Layout.preferredWidth 0152 highlighted: focus ? 1 : 0 0153 0154 background: Rectangle { 0155 Kirigami.Theme.colorSet: Kirigami.Theme.Button 0156 color: backButton.activeFocus ? Kirigami.Theme.highlightColor : Kirigami.Theme.backgroundColor 0157 radius: width / 2 0158 border.color: Kirigami.Theme.textColor 0159 border.width: 1 0160 0161 Image { 0162 source: "images/simple-previous.svg" 0163 width: Kirigami.Units.iconSizes.medium 0164 height: Kirigami.Units.iconSizes.medium 0165 anchors.centerIn: parent 0166 } 0167 } 0168 z: 1000 0169 onClicked: { 0170 seekControl.backRequested = true; 0171 root.parent.backRequested(); 0172 video.stop(); 0173 } 0174 KeyNavigation.up: video 0175 KeyNavigation.right: button 0176 Keys.onReturnPressed: { 0177 clicked() 0178 } 0179 onFocusChanged: { 0180 if(!seekControl.backRequested){ 0181 hideTimer.restart(); 0182 } 0183 } 0184 } 0185 Controls.RoundButton { 0186 id: button 0187 Layout.preferredWidth: Kirigami.Units.iconSizes.large 0188 Layout.preferredHeight: Layout.preferredWidth 0189 highlighted: focus ? 1 : 0 0190 0191 background: Rectangle { 0192 Kirigami.Theme.colorSet: Kirigami.Theme.Button 0193 color: button.activeFocus ? Kirigami.Theme.highlightColor : Kirigami.Theme.backgroundColor 0194 radius: width / 2 0195 border.color: Kirigami.Theme.textColor 0196 border.width: 1 0197 0198 Image { 0199 source: videoControl.playbackState === MediaPlayer.PlayingState ? "images/simple-pause.svg" : "images/simple-play.svg" 0200 width: Kirigami.Units.iconSizes.medium 0201 height: Kirigami.Units.iconSizes.medium 0202 anchors.centerIn: parent 0203 } 0204 } 0205 0206 z: 1000 0207 onClicked: { 0208 seekControl.backRequested = false; 0209 video.playbackState === MediaPlayer.PlayingState ? video.pause() : video.play(); 0210 hideTimer.restart(); 0211 } 0212 KeyNavigation.up: video 0213 KeyNavigation.left: backButton 0214 KeyNavigation.right: slider 0215 Keys.onReturnPressed: { 0216 clicked() 0217 } 0218 onFocusChanged: { 0219 if(!backRequested){ 0220 hideTimer.restart(); 0221 } 0222 } 0223 } 0224 0225 Templates.Slider { 0226 id: slider 0227 Layout.fillWidth: true 0228 Layout.alignment: Qt.AlignVCenter 0229 implicitHeight: Kirigami.Units.gridUnit 0230 value: seekControl.playPosition 0231 from: 0 0232 to: seekControl.duration 0233 z: 1000 0234 property bool navSliderItem 0235 property int minimumValue: 0 0236 property int maximumValue: 20 0237 onMoved: { 0238 seekControl.seekPosition = value; 0239 hideTimer.restart(); 0240 } 0241 0242 onNavSliderItemChanged: { 0243 if(slider.navSliderItem){ 0244 recthandler.color = "red" 0245 } else if (slider.focus) { 0246 recthandler.color = Kirigami.Theme.linkColor 0247 } 0248 } 0249 0250 onFocusChanged: { 0251 if(!slider.focus){ 0252 recthandler.color = Kirigami.Theme.textColor 0253 } else { 0254 recthandler.color = Kirigami.Theme.linkColor 0255 } 0256 } 0257 0258 handle: Rectangle { 0259 id: recthandler 0260 x: slider.position * (parent.width - width) 0261 implicitWidth: Kirigami.Units.gridUnit 0262 implicitHeight: implicitWidth 0263 radius: width 0264 color: Kirigami.Theme.textColor 0265 } 0266 background: Item { 0267 Rectangle { 0268 id: groove 0269 anchors { 0270 verticalCenter: parent.verticalCenter 0271 left: parent.left 0272 right: parent.right 0273 } 0274 radius: height 0275 height: Math.round(Kirigami.Units.gridUnit/3) 0276 color: Qt.rgba(Kirigami.Theme.textColor.r, Kirigami.Theme.textColor.g, Kirigami.Theme.textColor.b, 0.3) 0277 Rectangle { 0278 anchors { 0279 left: parent.left 0280 top: parent.top 0281 bottom: parent.bottom 0282 } 0283 radius: height 0284 color: Kirigami.Theme.highlightColor 0285 width: slider.position * (parent.width - slider.handle.width/2) + slider.handle.width/2 0286 } 0287 } 0288 0289 Controls.Label { 0290 anchors { 0291 left: parent.left 0292 top: groove.bottom 0293 topMargin: Kirigami.Units.smallSpacing 0294 } 0295 horizontalAlignment: Text.AlignLeft 0296 verticalAlignment: Text.AlignVCenter 0297 text: formatTime(playPosition) 0298 color: "white" 0299 } 0300 0301 Controls.Label { 0302 anchors { 0303 right: parent.right 0304 top: groove.bottom 0305 topMargin: Kirigami.Units.smallSpacing 0306 } 0307 horizontalAlignment: Text.AlignRight 0308 verticalAlignment: Text.AlignVCenter 0309 text: formatTime(duration) 0310 } 0311 } 0312 KeyNavigation.up: video 0313 KeyNavigation.left: button 0314 Keys.onReturnPressed: { 0315 hideTimer.restart(); 0316 if(!navSliderItem){ 0317 navSliderItem = true 0318 } else { 0319 navSliderItem = false 0320 } 0321 } 0322 0323 Keys.onLeftPressed: { 0324 console.log("leftPressedonSlider") 0325 hideTimer.restart(); 0326 if(navSliderItem) { 0327 video.seek(video.position - 5000) 0328 } else { 0329 button.forceActiveFocus() 0330 } 0331 } 0332 0333 Keys.onRightPressed: { 0334 hideTimer.restart(); 0335 if(navSliderItem) { 0336 video.seek(video.position + 5000) 0337 } 0338 } 0339 } 0340 } 0341 } 0342 } 0343 0344 function formatTime(timeInMs) { 0345 if (!timeInMs || timeInMs <= 0) return "0:00" 0346 var seconds = timeInMs / 1000; 0347 var minutes = Math.floor(seconds / 60) 0348 seconds = Math.floor(seconds % 60) 0349 if (seconds < 10) seconds = "0" + seconds; 0350 return minutes + ":" + seconds 0351 } 0352 }