[vlc-devel] [PATCH 10/16] qml: use colDelegate for MCVideoListDisplay

[Abel Tesfaye]

From: Abel Tesfaye <Abeltesfaye45 at gmail.com>

---
 .../gui/qt/qml/mediacenter/MCVideoDisplay.qml |  2 +-
 .../qt/qml/mediacenter/MCVideoListDisplay.qml | 97 +++++++++++++++++++
 2 files changed, 98 insertions(+), 1 deletion(-)

diff --git a/modules/gui/qt/qml/mediacenter/MCVideoDisplay.qml b/modules/gui/qt/qml/mediacenter/MCVideoDisplay.qml
index 62cb23b218..ad5adaeaac 100644
--- a/modules/gui/qt/qml/mediacenter/MCVideoDisplay.qml
+++ b/modules/gui/qt/qml/mediacenter/MCVideoDisplay.qml
@@ -389,7 +389,7 @@ Utils.NavigableFocusScope {
             width: view.width
             onContextMenuButtonClicked:{
                 contextMenu.model = menuModel
-                contextMenu.popup(menuParent)
+                contextMenu.popup(menuParent,contextMenu.width,0)
             }
             onRightClick:{
                 contextMenu.model = menuModel
diff --git a/modules/gui/qt/qml/mediacenter/MCVideoListDisplay.qml b/modules/gui/qt/qml/mediacenter/MCVideoListDisplay.qml
index 28c81f1b1f..6094419403 100644
--- a/modules/gui/qt/qml/mediacenter/MCVideoListDisplay.qml
+++ b/modules/gui/qt/qml/mediacenter/MCVideoListDisplay.qml
@@ -39,6 +39,98 @@ Utils.KeyNavigableTableView {
 
     rowHeight: VLCStyle.video_small_height + VLCStyle.margin_normal
 
+    property bool isFocusOnContextButton: false
+    colDelegate: Item {
+        id: colDel
+        anchors.fill: parent
+        anchors.leftMargin: VLCStyle.margin_normal
+        anchors.rightMargin: VLCStyle.margin_normal
+
+        property var rowModel: parent.rowModel
+        property var model: parent.colModel
+        FocusScope{
+            anchors.fill: parent
+            focus: isFocusOnContextButton && rowModel.index === currentIndex
+            onFocusChanged: focus && contextButtonLoader.forceActiveFocus()
+
+            Loader{
+                anchors.top: parent.top
+                anchors.bottom: parent.bottom
+                anchors.left: parent.left
+                active: model.type === "image"
+                sourceComponent: Utils.RoundImage{
+                    id: cover
+                    height: VLCStyle.video_small_height
+                    width: VLCStyle.video_small_width
+                    source: !rowModel ? "" : rowModel[model.criteria]
+
+                    Utils.VideoQualityLabel {
+                        id: resolutionLabel
+                        anchors {
+                            top: cover.top
+                            left: cover.left
+                            topMargin: VLCStyle.margin_xxsmall
+                            leftMargin: VLCStyle.margin_xxsmall
+                        }
+                        text: !rowModel ? "" : rowModel.resolution_name
+                    }
+                    Utils.VideoQualityLabel {
+                        anchors {
+                            top: cover.top
+                            left: resolutionLabel.right
+                            topMargin: VLCStyle.margin_xxsmall
+                            leftMargin: VLCStyle.margin_xxxsmall
+                        }
+                        visible: !rowModel ? "" : rowModel.channel.length > 0
+                        text: !rowModel ? "" : rowModel.channel
+                        color: "limegreen"
+                    }
+                    Utils.VideoProgressBar {
+                        value: !rowModel ? "" : rowModel.saved_position
+                        anchors {
+                            bottom: parent.bottom
+                            left: parent.left
+                            right: parent.right
+                        }
+                    }
+
+                }
+            }
+            Loader{
+                id: contextButtonLoader
+                anchors.verticalCenter: parent.verticalCenter
+                anchors.right: parent.right
+                anchors.rightMargin: VLCStyle.margin_xxsmall
+                active: model.type === "contextButton"
+                sourceComponent: Utils.ContextButton{
+                    backgroundColor: hovered || activeFocus ?
+                                         VLCStyle.colors.getBgColor( root.isSelected, hovered,
+                                                                    root.activeFocus) : "transparent"
+                    focus: contextButtonLoader.focus
+                    onClicked: listView_id.contextMenuButtonClicked(this,rowModel)
+                }
+            }
+            Loader{
+                anchors.fill:parent
+                active: model.type !== "image"
+                sourceComponent: Text {
+                    text: !rowModel ? "" : rowModel[model.criteria] || ""
+                    elide: Text.ElideRight
+                    font.pixelSize: VLCStyle.fontSize_normal
+                    color: (model.isPrimary)? VLCStyle.colors.text : VLCStyle.colors.textInactive
+
+                    anchors {
+                        fill: parent
+                        leftMargin: VLCStyle.margin_xsmall
+                        rightMargin: VLCStyle.margin_xsmall
+                    }
+                    verticalAlignment: Text.AlignVCenter
+                    horizontalAlignment: Text.AlignLeft
+                }
+            }
+        }
+    }
+
     headerColor: VLCStyle.colors.bg
     spacing: VLCStyle.margin_small
 
@@ -49,5 +141,10 @@ Utils.KeyNavigableTableView {
         }
         medialib.addAndPlay(list)
     }
+    onActionLeft:  isFocusOnContextButton ? isFocusOnContextButton = false : root.actionLeft(index)
+    onActionRight: !isFocusOnContextButton ? isFocusOnContextButton = true : root.actionRight(index)
+    onActionDown:   root.actionDown(index)
+    onActionUp:     root.actionUp(index)
+    onActionCancel: root.actionCancel(index)
 
 }
-- 
2.21.0