Tablet and desktop versions of attachment model browser dialog

interface/resources/qml/hifi/dialogs/ModelBrowserDialog.qml

@@ -0,0 +1,36 @@
+//
+//  ModelBrowserDialog.qml
+//
+//  Created by David Rowe on 11 Mar 2017.
+//  Copyright 2017 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or https://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+
+import "../../windows"
+import "content"
+
+ScrollingWindow {
+    id: root
+    objectName: "ModelBrowserDialog"
+    title: "Attachment Model"
+    resizable: true
+    width: 600
+    height: 480
+    closable: false
+
+    //HifiConstants { id: hifi }
+
+    property var result
+
+    signal selected(var modelUrl)
+    signal canceled()
+
+    ModelBrowserContent {
+        id: modelBrowserContent
+    }
+}

interface/resources/qml/hifi/dialogs/attachments/Attachment.qml

@@ -6,6 +6,7 @@ import Qt.labs.settings 1.0
 
 import "."
 import ".."
+import "../../tablet"
 import "../../../styles-uit"
 import "../../../controls-uit" as HifiControls
 import "../../../windows"
@@ -76,12 +77,24 @@ Item {
                     id: modelBrowserBuilder;
                     ModelBrowserDialog {}
                 }
+                Component {
+                    id: tabletModelBrowserBuilder;
+                    TabletModelBrowserDialog {}
+                }
 
                 onClicked: {
-                    var browser = modelBrowserBuilder.createObject(desktop);
+                    var browser;
-                    browser.selected.connect(function(newModelUrl){
+                    if (typeof desktop !== "undefined") {
-                        modelUrl.text = newModelUrl;
+                        browser = modelBrowserBuilder.createObject(desktop);
-                    })
+                        browser.selected.connect(function(newModelUrl){
+                            modelUrl.text = newModelUrl;
+                        });
+                    } else {
+                        browser = tabletModelBrowserBuilder.createObject(tabletRoot);
+                        browser.selected.connect(function(newModelUrl){
+                            modelUrl.text = newModelUrl;
+                        });
+                    }
                 }
             }
         }

interface/resources/qml/hifi/dialogs/content/ModelBrowserContent.qml

@@ -1,92 +1,64 @@
 import QtQuick 2.5
 import QtQuick.Controls 1.4
-import QtQuick.XmlListModel 2.0
-import QtQuick.Controls.Styles 1.4
 
-import "../../windows"
+import "../../../controls-uit" as HifiControls
-import "../../js/Utils.js" as Utils
-import "../models"
 
-import "../../styles-uit"
+Column {
-import "../../controls-uit" as HifiControls
+    width: pane.contentWidth
-import "../../windows"
 
-ScrollingWindow {
+    Rectangle {
-    id: root
+        width: parent.width
-    resizable: true
+        height: root.height  - (keyboardEnabled && keyboardRaised ? 200 : 0)
-    width: 600
+        color: hifi.colors.baseGray
-    height: 480
-    closable: false
 
-    property var result;
+        HifiControls.TextField {
+            id: filterEdit
+            anchors { left: parent.left; right: parent.right; top: parent.top ; margins: 8}
+            placeholderText: "filter"
+            onTextChanged: tableView.model.filter = text
+            colorScheme: hifi.colorSchemes.dark
+        }
 
-    signal selected(var modelUrl);
+        HifiControls.AttachmentsTable {
-    signal canceled();
+            id: tableView
-
+            anchors { left: parent.left; right: parent.right; top: filterEdit.bottom; bottom: buttonRow.top; margins: 8; }
-    HifiConstants {id: hifi}
+            colorScheme: hifi.colorSchemes.dark
-
+            onCurrentRowChanged: {
-    Column {
+                if (currentRow == -1) {
-        width: pane.contentWidth
+                    root.result = null;
-
+                    return;
-        Rectangle {
-            width: parent.width
-            height: root.height  - (keyboardEnabled && keyboardRaised ? 200 : 0)
-            radius: 4
-            color: hifi.colors.baseGray
-
-            HifiControls.TextField {
-                id: filterEdit
-                anchors { left: parent.left; right: parent.right; top: parent.top ; margins: 8}
-                placeholderText: "filter"
-                onTextChanged: tableView.model.filter = text
-                colorScheme: hifi.colorSchemes.dark
-            }
-
-            HifiControls.AttachmentsTable {
-                id: tableView
-                anchors { left: parent.left; right: parent.right; top: filterEdit.bottom; bottom: buttonRow.top; margins: 8; }
-                colorScheme: hifi.colorSchemes.dark
-                onCurrentRowChanged: {
-                    if (currentRow == -1) {
-                        root.result = null;
-                        return;
-                    }
-                    result = model.baseUrl + "/" + model.get(tableView.currentRow).key;
                 }
+                result = model.baseUrl + "/" + model.get(tableView.currentRow).key;
             }
+        }
 
-            Row {
+        Row {
-                id: buttonRow
+            id: buttonRow
-                spacing: 8
+            spacing: 8
-                anchors { right: parent.right; rightMargin: 8; bottom: parent.bottom; bottomMargin: 8; }
+            anchors { right: parent.right; rightMargin: 8; bottom: parent.bottom; bottomMargin: 8; }
-                HifiControls.Button { action: acceptAction ;  color: hifi.buttons.black; colorScheme: hifi.colorSchemes.dark }
+            HifiControls.Button { action: acceptAction ;  color: hifi.buttons.black; colorScheme: hifi.colorSchemes.dark }
-                HifiControls.Button { action: cancelAction ;  color: hifi.buttons.black; colorScheme: hifi.colorSchemes.dark }
+            HifiControls.Button { action: cancelAction ;  color: hifi.buttons.black; colorScheme: hifi.colorSchemes.dark }
+        }
+
+        Action {
+            id: acceptAction
+            text: qsTr("OK")
+            enabled: root.result ? true : false
+            shortcut: Qt.Key_Return
+            onTriggered: {
+                root.selected(root.result);
+                root.destroy();
             }
+        }
 
-            Action {
+        Action {
-                id: acceptAction
+            id: cancelAction
-                text: qsTr("OK")
+            text: qsTr("Cancel")
-                enabled: root.result ? true : false
+            shortcut: Qt.Key_Escape
-                shortcut: Qt.Key_Return
+            onTriggered: {
-                onTriggered: {
+                root.canceled();
-                    root.selected(root.result);
+                root.destroy();
-                    root.destroy();
-                }
-            }
-
-            Action {
-                id: cancelAction
-                text: qsTr("Cancel")
-                shortcut: Qt.Key_Escape
-                onTriggered: {
-                    root.canceled();
-                    root.destroy();
-                }
             }
         }
     }
 }
-
-
-
-

interface/resources/qml/hifi/tablet/TabletModelBrowserDialog.qml

@@ -0,0 +1,78 @@
+//
+//  TabletModelBrowserDialog.qml
+//
+//  Created by David Rowe on 11 Mar 2017.
+//  Copyright 2017 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or https://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+
+import "../../styles-uit"
+import "../dialogs/content"
+
+Item {
+    id: root
+    objectName: "ModelBrowserDialog"
+
+    property string title: "Attachment Model"
+
+    property var result
+
+    signal selected(var modelUrl)
+    signal canceled()
+
+    anchors.fill: parent
+
+    Rectangle {
+        id: pane  // Surrogate for ScrollingWindow's pane.
+        anchors.fill: parent
+    }
+
+    anchors.topMargin: 90  // Space for header.
+
+    // FIXME: Refactor with other tablet headers.
+    Rectangle {
+        id: header
+        height: 90
+        anchors {
+            left: parent.left
+            right: parent.right
+            bottom: parent.top
+        }
+        z: 100
+
+        gradient: Gradient {
+            GradientStop {
+                position: 0
+                color: "#2b2b2b"
+            }
+
+            GradientStop {
+                position: 1
+                color: "#1e1e1e"
+            }
+        }
+
+        RalewayBold {
+            text: title
+            size: 26
+            color: "#34a2c7"
+            anchors.verticalCenter: parent.verticalCenter
+            anchors.left: parent.left
+            anchors.leftMargin: hifi.dimensions.contentMargin.x
+        }
+    }
+
+    ModelBrowserContent {
+        anchors {
+            top: header.bottom
+            left: parent.left
+            right: parent.right
+            bottom: parent.top
+        }
+    }
+}