[UI+Backend] Intergrate tracks menu into menubar.

src/MpvPlayerBackend.cpp

@@ -125,7 +125,7 @@ MpvPlayerBackend::MpvPlayerBackend(QQuickItem* parent)
 
   mpv_set_option_string(mpv, "config", "yes");
   // mpv_set_option_string(mpv, "sub-visibility", "no");
-
+  mpv_observe_property(mpv, 0, "tracks-menu", MPV_FORMAT_NONE);
   mpv_observe_property(mpv, 0, "playback-abort", MPV_FORMAT_NONE);
   mpv_observe_property(mpv, 0, "chapter-list", MPV_FORMAT_NODE);
   mpv_observe_property(mpv, 0, "track-list", MPV_FORMAT_NODE);
@@ -174,14 +174,12 @@ MpvPlayerBackend::doUpdate()
 QVariant
 MpvPlayerBackend::getProperty(const QString& name) const
 {
-  qDebug() << "Getting Property: " << name;
   return mpv::qt::get_property_variant(mpv, name);
 }
 
 void
 MpvPlayerBackend::command(const QVariant& params)
 {
-  qDebug() << "Running Command: " << params;
   mpv::qt::command_variant(mpv, params);
 }
 
@@ -194,7 +192,6 @@ MpvPlayerBackend::setProperty(const QString& name, const QVariant& value)
 void
 MpvPlayerBackend::setOption(const QString& name, const QVariant& value)
 {
-  qDebug() << "Setting Option '" << name << "' to '" << value << "'";
   mpv::qt::set_option_variant(mpv, name, value);
 }
 
@@ -376,6 +373,8 @@ MpvPlayerBackend::handle_mpv_event(mpv_event* event)
         }
       } else if (strcmp(prop->name, "pause") == 0) {
         QMetaObject::invokeMethod(this, "updatePlayPause");
+      } else if (strcmp(prop->name, "tracks-menu") == 0) {
+        QMetaObject::invokeMethod(this, "tracksUpdate");
       }
       break;
     }

src/qml/CustomMenu.qml

@@ -0,0 +1,14 @@
+import QtQuick 2.11
+import QtQuick.Controls 2.4
+
+Menu {
+    width: 300
+    background: Rectangle {
+        implicitWidth: parent.width
+        implicitHeight: 10
+        color: "black"
+        opacity: 0.6
+    }
+    delegate: CustomMenuItem {
+    }
+}

src/qml/CustomMenuItem.qml

@@ -12,8 +12,9 @@ MenuItem {
     implicitHeight: 20
 
     contentItem: Text {
-        rightPadding: menuItem.indicator.width
+        leftPadding: menuItem.indicator.width
         text: menuItem.text
+
         font.family: appearance.fontName
         font.bold: menuItem.highlighted
         opacity: 1

src/qml/main.qml

@@ -30,48 +30,6 @@ ApplicationWindow {
         }
     }
 
-    function tracksMenuUpdate() {
-        subModel.clear()
-        audioModel.clear()
-        vidModel.clear()
-        var newTracks = player.getTracks()
-
-        for (var i = 0, len = newTracks.length; i < len; i++) {
-            var track = newTracks[i]
-            var trackID = track["id"]
-            var trackType = track["type"]
-            var trackLang = LanguageCodes.localeCodeToEnglish(
-                        String(track["lang"]))
-            var trackTitle = track["title"]
-            if (trackType == "sub") {
-                subModel.append({
-                                    key: trackLang,
-                                    value: trackID
-                                })
-                if (track["selected"]) {
-                    subList.currentIndex = subList.count - 1
-                }
-            } else if (trackType == "audio") {
-                audioModel.append({
-                                      key: (trackTitle === undefined ? "" : trackTitle + " ")
-                                           + trackLang,
-                                      value: trackID
-                                  })
-                if (track["selected"]) {
-                    audioList.currentIndex = audioList.count - 1
-                }
-            } else if (trackType == "video") {
-                vidModel.append({
-                                    key: "Video " + trackID,
-                                    value: trackID
-                                })
-                if (track["selected"]) {
-                    vidList.currentIndex = vidList.count - 1
-                }
-            }
-        }
-    }
-
     PlayerBackend {
         id: player
         anchors.fill: parent
@@ -145,6 +103,48 @@ ApplicationWindow {
             }
         }
 
+        function tracksUpdate() {
+            subModel.clear()
+            audioModel.clear()
+            vidModel.clear()
+            var newTracks = player.getTracks()
+
+            for (var i = 0, len = newTracks.length; i < len; i++) {
+                var track = newTracks[i]
+                var trackID = track["id"]
+                var trackType = track["type"]
+                var trackLang = LanguageCodes.localeCodeToEnglish(
+                            String(track["lang"]))
+                var trackTitle = track["title"]
+                if (trackType == "sub") {
+                    subModel.append({
+                                        key: trackLang,
+                                        value: trackID
+                                    })
+                    if (track["selected"]) {
+                        subList.currentIndex = subList.count - 1
+                    }
+                } else if (trackType == "audio") {
+                    audioModel.append({
+                                          key: (trackTitle === undefined ? "" : trackTitle + " ")
+                                               + trackLang,
+                                          value: trackID
+                                      })
+                    if (track["selected"]) {
+                        audioList.currentIndex = audioList.count - 1
+                    }
+                } else if (trackType == "video") {
+                    vidModel.append({
+                                        key: "Video " + trackID,
+                                        value: trackID
+                                    })
+                    if (track["selected"]) {
+                        vidList.currentIndex = vidList.count - 1
+                    }
+                }
+            }
+        }
+
         function setProgressBarEnd(val) {
             progressBar.to = val
         }
@@ -212,11 +212,10 @@ ApplicationWindow {
         }
 
         function isAnyMenuOpen() {
-            return subtitlesMenu.visible || settingsMenu.visible
+            return settingsMenu.visible || fileMenuBarItem.opened
-                    || fileMenuBarItem.opened || playbackMenuBarItem.opened
+                    || playbackMenuBarItem.opened || viewMenuBarItem.opened
-                    || viewMenuBarItem.opened || audioMenuBarItem.opened
+                    || audioMenuBarItem.opened || videoMenuBarItem.opened
-                    || videoMenuBarItem.opened || subsMenuBarItem.opened
+                    || subsMenuBarItem.opened || aboutMenuBarItem.opened
-                    || aboutMenuBarItem.opened
         }
 
         function hideControls(force) {
@@ -433,19 +432,10 @@ ApplicationWindow {
                 opacity: 0.6
             }
 
-            Menu {
+            CustomMenu {
                 id: fileMenuBarItem
                 title: translate.getTranslation("FILE_MENU", i18n.language)
                 font.family: appearance.fontName
-                width: 300
-                background: Rectangle {
-                    implicitWidth: parent.width
-                    implicitHeight: 10
-                    color: "black"
-                    opacity: 0.6
-                }
-                delegate: CustomMenuItem {
-                }
 
                 Action {
                     text: translate.getTranslation("OPEN_FILE", i18n.language)
@@ -490,20 +480,9 @@ ApplicationWindow {
                 }
             }
 
-            Menu {
+            CustomMenu {
                 id: playbackMenuBarItem
                 title: translate.getTranslation("PLAYBACK", i18n.language)
-                width: 300
-                background: Rectangle {
-                    implicitWidth: parent.width
-                    implicitHeight: 10
-                    color: "black"
-                    opacity: 0.6
-                }
-                delegate: CustomMenuItem {
-                    width: parent.width
-                }
-
                 Action {
                     text: translate.getTranslation("PLAY_PAUSE", i18n.language)
                     onTriggered: {
@@ -588,19 +567,9 @@ ApplicationWindow {
                 }
             }
 
-            Menu {
+            CustomMenu {
                 id: audioMenuBarItem
                 title: translate.getTranslation("AUDIO", i18n.language)
-                width: 300
-                background: Rectangle {
-                    implicitWidth: parent.width
-                    implicitHeight: 10
-                    color: "black"
-                    opacity: 0.6
-                }
-                delegate: CustomMenuItem {
-                    width: parent.width
-                }
                 Action {
                     text: translate.getTranslation("CYCLE_AUDIO_TRACK",
                                                    i18n.language)
@@ -632,21 +601,37 @@ ApplicationWindow {
                     }
                     shortcut: keybinds.mute
                 }
+                MenuSeparator {
+                }
+
+                CustomMenu {
+                    title: translate.getTranslation("AUDIO", i18n.language)
+                    Rectangle {
+                        color: "white"
+                        opacity: 1
+                        width: parent.width
+                        height: 40
+
+                        ComboBox {
+                            anchors.fill: parent
+                            id: audioList
+                            textRole: "key"
+                            model: ListModel {
+                                id: audioModel
+                            }
+                            onActivated: {
+                                player.command(["set", "aid", String(
+                                                    subModel.get(index).value)])
+                            }
+                            opacity: 1
+                        }
+                    }
+                }
             }
 
-            Menu {
+            CustomMenu {
                 id: videoMenuBarItem
                 title: translate.getTranslation("VIDEO", i18n.language)
-                width: 300
-                background: Rectangle {
-                    implicitWidth: parent.width
-                    implicitHeight: 10
-                    color: "black"
-                    opacity: 0.6
-                }
-                delegate: CustomMenuItem {
-                    width: parent.width
-                }
                 Action {
                     text: translate.getTranslation("CYCLE_VIDEO", i18n.language)
                     onTriggered: {
@@ -654,20 +639,36 @@ ApplicationWindow {
                     }
                     shortcut: keybinds.cycleVideo
                 }
+                MenuSeparator {
+                }
+
+                CustomMenu {
+                    title: translate.getTranslation("VIDEO", i18n.language)
+                    Rectangle {
+                        color: "white"
+                        opacity: 1
+                        width: parent.width
+                        height: 40
+
+                        ComboBox {
+                            anchors.fill: parent
+                            id: vidList
+                            textRole: "key"
+                            model: ListModel {
+                                id: vidModel
+                            }
+                            onActivated: {
+                                player.command(["set", "vid", String(
+                                                    subModel.get(index).value)])
+                            }
+                            opacity: 1
+                        }
+                    }
+                }
             }
-            Menu {
+            CustomMenu {
                 id: subsMenuBarItem
                 title: translate.getTranslation("SUBTITLES", i18n.language)
-                width: 300
-                background: Rectangle {
-                    implicitWidth: parent.width
-                    implicitHeight: 10
-                    color: "black"
-                    opacity: 0.6
-                }
-                delegate: CustomMenuItem {
-                    width: parent.width
-                }
                 Action {
                     text: translate.getTranslation("CYCLE_SUB_TRACK",
                                                    i18n.language)
@@ -684,21 +685,37 @@ ApplicationWindow {
                     }
                     shortcut: keybinds.cycleSubBackwards
                 }
+                MenuSeparator {
+                }
+
+                CustomMenu {
+                    title: translate.getTranslation("SUBTITLES", i18n.language)
+                    Rectangle {
+                        color: "white"
+                        opacity: 1
+                        width: parent.width
+                        height: 40
+
+                        ComboBox {
+                            anchors.fill: parent
+                            id: subList
+                            textRole: "key"
+                            model: ListModel {
+                                id: subModel
+                            }
+                            onActivated: {
+                                player.command(["set", "sid", String(
+                                                    subModel.get(index).value)])
+                            }
+                            opacity: 1
+                        }
+                    }
+                }
             }
 
-            Menu {
+            CustomMenu {
                 id: viewMenuBarItem
                 title: translate.getTranslation("VIEW", i18n.language)
-                width: 300
-                background: Rectangle {
-                    implicitWidth: parent.width
-                    implicitHeight: 10
-                    color: "black"
-                    opacity: 0.6
-                }
-                delegate: CustomMenuItem {
-                    width: parent.width
-                }
 
                 Action {
                     text: translate.getTranslation("FULLSCREEN", i18n.language)
@@ -707,16 +724,6 @@ ApplicationWindow {
                     }
                     shortcut: keybinds.fullscreen
                 }
-                Action {
-                    text: translate.getTranslation("TRACK_MENU", i18n.language)
-                    onTriggered: {
-                        tracksMenuUpdate()
-                        subtitlesMenu.visible = !subtitlesMenu.visible
-                        subtitlesMenuBackground.visible = !subtitlesMenuBackground.visible
-                    }
-                    shortcut: keybinds.tracks
-                }
-
                 Action {
                     text: translate.getTranslation("STATS", i18n.language)
                     onTriggered: {
@@ -742,19 +749,9 @@ ApplicationWindow {
                     }
                 }
             }
-            Menu {
+            CustomMenu {
                 id: aboutMenuBarItem
                 title: translate.getTranslation("ABOUT", i18n.language)
-                width: 300
-                background: Rectangle {
-                    implicitWidth: parent.width
-                    implicitHeight: 10
-                    color: "black"
-                    opacity: 0.6
-                }
-                delegate: CustomMenuItem {
-                    width: parent.width
-                }
 
                 Action {
                     text: translate.getTranslation("ABOUT_QT", i18n.language)
@@ -847,106 +844,6 @@ ApplicationWindow {
             }
         }
 
-        Rectangle {
-            id: subtitlesMenuBackground
-            anchors.fill: subtitlesMenu
-            Layout.fillWidth: true
-            Layout.fillHeight: true
-            visible: false
-            color: "black"
-            opacity: 0.6
-        }
-
-        Rectangle {
-            id: subtitlesMenu
-            color: "transparent"
-            width: controlsBar.width / 2
-            height: childrenRect.height
-            visible: false
-            z: 90000
-            anchors.centerIn: player
-            border.color: "black"
-            border.width: 2
-
-            Text {
-                id: audioLabel
-                anchors.left: parent.left
-                anchors.right: parent.right
-                text: translate.getTranslation("AUDIO", i18n.language)
-                color: "white"
-                font.family: appearance.fontName
-                font.pixelSize: 14
-                horizontalAlignment: Text.AlignHCenter
-                opacity: 1
-            }
-            ComboBox {
-                id: audioList
-                textRole: "key"
-                width: parent.width
-                anchors.top: audioLabel.bottom
-                model: ListModel {
-                    id: audioModel
-                }
-                onActivated: {
-                    player.command(["set", "aid", String(audioModel.get(
-                                                             index).value)])
-                }
-                opacity: 1
-            }
-            Text {
-                id: subLabel
-                anchors.left: parent.left
-                anchors.right: parent.right
-                text: translate.getTranslation("SUBTITLES", i18n.language)
-                color: "white"
-                font.family: appearance.fontName
-                font.pixelSize: 14
-                anchors.top: audioList.bottom
-                horizontalAlignment: Text.AlignHCenter
-                opacity: 1
-            }
-            ComboBox {
-                id: subList
-                textRole: "key"
-                width: parent.width
-                anchors.top: subLabel.bottom
-                model: ListModel {
-                    id: subModel
-                }
-                onActivated: {
-                    player.command(["set", "sid", String(subModel.get(
-                                                             index).value)])
-                }
-                opacity: 1
-            }
-            Text {
-                id: vidLabel
-                anchors.left: parent.left
-                anchors.right: parent.right
-                text: translate.getTranslation("VIDEO", i18n.language)
-                color: "white"
-                font.family: appearance.fontName
-                font.pixelSize: 14
-                anchors.top: subList.bottom
-                horizontalAlignment: Text.AlignHCenter
-                opacity: 1
-            }
-            ComboBox {
-                id: vidList
-                textRole: "key"
-                width: parent.width
-                anchors.top: vidLabel.bottom
-                model: ListModel {
-                    id: vidModel
-                }
-                onActivated: {
-                    player.command(["set", "vid", String(vidModel.get(
-                                                             index).value)])
-                }
-                opacity: 1
-            }
-        }
-
         Rectangle {
             id: titleBackground
             height: titleBar.height
@@ -1325,25 +1222,6 @@ ApplicationWindow {
                 renderType: Text.NativeRendering
             }
 
-            Button {
-                id: subtitlesButton
-                //icon.name: "subtitles"
-                icon.source: "icons/subtitles.svg"
-                icon.color: "white"
-                anchors.right: settingsButton.left
-                anchors.top: parent.top
-                anchors.bottom: parent.bottom
-                display: AbstractButton.IconOnly
-                onClicked: {
-                    tracksMenuUpdate()
-                    subtitlesMenu.visible = !subtitlesMenu.visible
-                    subtitlesMenuBackground.visible = !subtitlesMenuBackground.visible
-                }
-                background: Rectangle {
-                    color: "transparent"
-                }
-            }
-
             Button {
                 id: settingsButton
                 //icon.name: "settings"

src/qml/qml.qrc

@@ -3,6 +3,7 @@
         <file>main.qml</file>
         <file>CustomComboBox.qml</file>
         <file>CustomMenuItem.qml</file>
+        <file>CustomMenu.qml</file>
         <file>Translator.qml</file>
         <file>translations.js</file>
         <file>icons/play.svg</file>

src/qml/translations.js

@@ -34,7 +34,6 @@ var translations = {
         TOGGLE_MPV_SUBS: "Toggle MPV Subtitles",
         VIEW: "View",
         FULLSCREEN: "Fullscreen",
-        TRACK_MENU: "Track Menu",
         STATS: "Statistics",
         TOGGLE_NYAN_CAT: "Toggle Nyan Cat",
         ABOUT: "About",
@@ -77,7 +76,6 @@ var translations = {
         TOGGLE_MPV_SUBS: "Activar subtítulos MPV",
         VIEW: "Ver",
         FULLSCREEN: "Pantalla completa",
-        TRACK_MENU: "Lista de reproducción",
         STATS: "Estadísticas",
         TOGGLE_NYAN_CAT: "Activar Nyan Cat",
         ABOUT: "Ayuda",
@@ -119,7 +117,6 @@ var translations = {
         TOGGLE_MPV_SUBS: "Schalte MPV Untertitel An/Aus",
         VIEW: "Ansicht",
         FULLSCREEN: "Vollbild",
-        TRACK_MENU: "Spur Menü",
         STATS: "Statistiken",
         TOGGLE_NYAN_CAT: "Schalte Nyan Cat An/Aus",
         ABOUT: "Über",
@@ -161,7 +158,6 @@ var translations = {
         TOGGLE_MPV_SUBS: "Basculer les sous-titres MPV",
         VIEW: "Voir",
         FULLSCREEN: "Plein écran",
-        TRACK_MENU: "Menu des pistes",
         STATS: "Statistiques",
         TOGGLE_NYAN_CAT: "basculer Nyan Cat",
         ABOUT: "A propos",
@@ -203,7 +199,6 @@ var translations = {
         TOGGLE_MPV_SUBS: "Attiva MPV Sottotitoli",
         VIEW: "Vedi",
         FULLSCREEN: "Schermo intero",
-        TRACK_MENU: "Traccia menù",
         STATS: "Statistiche",
         TOGGLE_NYAN_CAT: "Attiva Nyan Cat",
         ABOUT: "Info",
@@ -245,7 +240,6 @@ var translations = {
         TOGGLE_MPV_SUBS: "Переключить MPV-субтитры",
         VIEW: "Вид",
         FULLSCREEN: "Во весь экран",
-        TRACK_MENU: "Меню дорожек",
         STATS: "Статистика",
         TOGGLE_NYAN_CAT: "Нян-кот",
         ABOUT: "О программе",
@@ -287,7 +281,6 @@ var translations = {
         TOGGLE_MPV_SUBS: "Skru Av/På MPV Undertekster",
         VIEW: "Vis",
         FULLSCREEN: "Fullskjerm",
-        TRACK_MENU: "Spor Meny",
         STATS: "Statistikk",
         TOGGLE_NYAN_CAT: "Skru Av/På Nyan Cat",
         ABOUT: "Om",