Fix issues; checkpoint on new ComboDialog

interface/resources/qml/hifi/ComboDialog.qml

@@ -0,0 +1,154 @@
+//
+//  ComboDialog.qml
+//  qml/hifi
+//
+//  Created by Zach Fox on 3/31/2017
+//  Copyright 2017 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import "../styles-uit"
+
+Item {
+    property var dialogTitleText;
+    property var optionTitleText;
+    property var optionBodyText;
+    property var optionValues;
+    property var selectedOptionIndex;
+    property int dialogWidth;
+    property int dialogHeight;
+    property int comboOptionTextSize: 18;
+    FontLoader { id: ralewayRegular; source: "../../fonts/Raleway-Regular.ttf"; }
+    FontLoader { id: ralewaySemiBold; source: "../../fonts/Raleway-SemiBold.ttf"; }
+    visible: false;
+    id: combo;
+    anchors.fill: parent;
+    onVisibleChanged: {
+        populateComboListViewModel();
+    }
+
+    Rectangle {
+        id: dialogBackground;
+        anchors.fill: parent;
+        color: "black";
+        opacity: 0.5;
+    }
+
+    Rectangle {
+        id: dialogContainer;
+        color: "white";
+        anchors.centerIn: dialogBackground;
+        width: dialogWidth;
+        height: dialogHeight;
+
+        RalewayRegular {
+            id: dialogTitle;
+            text: dialogTitleText;
+            anchors.top: parent.top;
+            anchors.topMargin: 20;
+            anchors.left: parent.left;
+            anchors.leftMargin: 20;
+            size: 24;
+            color: 'black';
+            horizontalAlignment: Text.AlignLeft;
+            verticalAlignment: Text.AlignTop;
+        }
+
+        ListModel {
+            id: comboListViewModel;
+        }
+
+        ListView {
+            id: comboListView;
+            anchors.top: dialogTitle.bottom;
+            anchors.topMargin: 20;
+            anchors.bottom: parent.bottom;
+            anchors.left: parent.left;
+            anchors.right: parent.right;
+            model: comboListViewModel;
+            delegate: comboListViewDelegate;
+
+            Component {
+                id: comboListViewDelegate;
+                Rectangle {
+                    id: comboListViewItemContainer;
+                    // Size
+                    height: childrenRect.height + 10;
+                    width: dialogContainer.width;
+                    color: selectedOptionIndex === index ? '#cee6ff' : 'white';
+                    Rectangle {
+                        id: comboOptionSelected;
+                        visible: selectedOptionIndex === index ? true : false;
+                        color: hifi.colors.blueAccent;
+                        anchors.left: parent.left;
+                        anchors.leftMargin: 20;
+                        anchors.top: parent.top;
+                        anchors.topMargin: 20;
+                        width: 25;
+                        height: width;
+                        radius: width;
+                        border.width: 3;
+                        border.color: hifi.colors.blueHighlight;
+                    }
+
+
+                    RalewaySemiBold {
+                        id: optionTitle;
+                        text: titleText;
+                        anchors.top: parent.top;
+                        anchors.left: comboOptionSelected.right;
+                        anchors.leftMargin: 20;
+                        anchors.right: parent.right;
+                        height: 30;
+                        size: comboOptionTextSize;
+                        wrapMode: Text.WordWrap;
+                    }
+
+                    RalewayRegular {
+                        id: optionBody;
+                        text: bodyText;
+                        anchors.top: optionTitle.bottom;
+                        anchors.bottom: parent.bottom;
+                        anchors.left: comboOptionSelected.right;
+                        anchors.leftMargin: 25;
+                        anchors.right: parent.right;
+                        size: comboOptionTextSize;
+                        wrapMode: Text.WordWrap;
+                    }
+
+                    MouseArea {
+                        anchors.fill: parent
+                        acceptedButtons: Qt.LeftButton
+                        hoverEnabled: true;
+                        onEntered: comboListViewItemContainer.color = hifi.colors.blueHighlight
+                        onExited: comboListViewItemContainer.color = selectedOptionIndex === index ? '#cee6ff' : 'white';
+                        onClicked: {
+                            GlobalServices.findableBy = optionValue;
+                            UserActivityLogger.palAction("set_availability", optionValue);
+                            print('Setting availability:', optionValue);
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    MouseArea {
+        anchors.fill: parent
+        acceptedButtons: Qt.LeftButton
+        onClicked: {
+            combo.visible = false;
+        }
+    }
+
+    function populateComboListViewModel() {
+        comboListViewModel.clear();
+        optionTitleText.forEach(function(titleText, index) {
+            comboListViewModel.insert(index, {"titleText": titleText, "bodyText": optionBodyText[index], "optionValue": optionValues[index]});
+        });
+    }
+}

interface/resources/qml/hifi/Pal.qml

@@ -49,10 +49,16 @@ Rectangle {
 
     // The letterbox used for popup messages
     LetterboxMessage {
-
         id: letterboxMessage;
         z: 999; // Force the popup on top of everything else
     }
+    // The ComboDialog used for setting availability
+    ComboDialog {
+        id: comboDialog;
+        z: 999; // Force the ComboDialog on top of everything else
+        dialogWidth: parent.width - 100;
+        dialogHeight: parent.height - 100;
+    }
     function letterbox(headerGlyph, headerText, message) {
         letterboxMessage.headerGlyph = headerGlyph;
         letterboxMessage.headerText = headerText;
@@ -60,6 +66,15 @@ Rectangle {
         letterboxMessage.visible = true;
         letterboxMessage.popupRadius = 0;
     }
+    function popupComboDialog(dialogTitleText, optionTitleText, optionBodyText, optionValues) {
+        comboDialog.dialogTitleText = dialogTitleText;
+        comboDialog.optionTitleText = optionTitleText;
+        comboDialog.optionBodyText = optionBodyText;
+        comboDialog.optionValues = optionValues;
+        comboDialog.selectedOptionIndex = ['all', 'connections', 'friends', 'none'].indexOf(GlobalServices.findableBy);
+        comboDialog.populateComboListViewModel();
+        comboDialog.visible = true;
+    }
     Settings {
         id: settings;
         category: "pal";
@@ -241,7 +256,7 @@ Rectangle {
                     // "CONNECTIONS" text
                     RalewaySemiBold {
                         id: connectionsTabSelectorText;
-                        text: "CONNECTIONS";
+                        text: "PEOPLE";
                         // Text size
                         size: hifi.fontSizes.tabularData;
                         // Anchors
@@ -266,7 +281,7 @@ Rectangle {
                         anchors.left: connectionsTabSelectorTextContainer.left;
                         anchors.top: connectionsTabSelectorTextContainer.top;
                         anchors.topMargin: 1;
-                        anchors.leftMargin: connectionsTabSelectorTextMetrics.width + 42;
+                        anchors.leftMargin: connectionsTabSelectorTextMetrics.width + 25;
                         RalewayRegular {
                             id: connectionsHelpText;
                             text: "[?]";
@@ -350,6 +365,7 @@ Rectangle {
         // This TableView refers to the Nearby Table (on the "Nearby" tab below the current user's NameCard)
         HifiControlsUit.Table {
             id: nearbyTable;
+            flickableItem.interactive: true;
             // Anchors
             anchors.fill: parent;
             // Properties
@@ -653,7 +669,9 @@ Rectangle {
             source: "../../icons/profilePicLoading.gif"
             width: 120;
             height: width;
-            anchors.centerIn: parent;
+            anchors.top: parent.top;
+            anchors.topMargin: 185;
+            anchors.horizontalCenter: parent.horizontalCenter;
             visible: true;
             onVisibleChanged: {
                 if (visible) {
@@ -689,6 +707,7 @@ Rectangle {
         // This TableView refers to the Connections Table (on the "Connections" tab below the current user's NameCard)
         HifiControlsUit.Table {
             id: connectionsTable;
+            flickableItem.interactive: true;
             visible: !connectionsLoading.visible;
             // Anchors
             anchors.fill: parent;
@@ -943,6 +962,28 @@ Rectangle {
                 horizontalAlignment: Text.AlignHCenter;
                 verticalAlignment: Text.AlignTop;
             }
+            /*Rectangle {
+                id: availabilityComboBox;
+                // Anchors
+                anchors.top: parent.top;
+                anchors.horizontalCenter: parent.horizontalCenter;
+                // Size
+                width: parent.width;
+                height: 40;
+                MouseArea {
+                    anchors.fill: parent
+                    onClicked: {
+                        popupComboDialog("Set your list visibility",
+                        ["Everyone", "Friends and Connections", "Friends Only", "Appear Offline"],
+                        ["You will be invisible in everyone's 'People' list.\nAnyone will be able to jump to your location if the domain allows.",
+                        "You will be visible in the 'People' list only for those with whom you are connected or friends.\nThey will be able to jump to your location if the domain allows.",
+                        "You will be visible in the 'People' list only for those with whom you are friends.\nThey will be able to jump to your location if the domain allows.",
+                        "You will not be visible in the 'People' list of any other users."],
+                        ["all", "connections", "friends", "none"]);
+                    }
+                }
+            }*/
+            
             HifiControlsUit.ComboBox {
                 function determineAvailabilityIndex() {
                     return ['all', 'connections', 'friends', 'none'].indexOf(GlobalServices.findableBy)
@@ -1219,12 +1260,12 @@ Rectangle {
             break;
         // Received an "updateUsername()" request from the JS
         case 'updateUsername':
-            // The User ID (UUID) is the first parameter in the message.
-            var userId = message.params.sessionId;
-            // If the userId is empty, we're probably updating "myData".
-            if (userId) {
+            // Get the connection status
+            var connectionStatus = message.params.connection;
+            // If the connection status isn't "self"...
+            if (connectionStatus !== "self") {
                 // Get the index in nearbyUserModel and nearbyUserModelData associated with the passed UUID
-                var userIndex = findNearbySessionIndex(userId);
+                var userIndex = findNearbySessionIndex(message.params.sessionId);
                 if (userIndex !== -1) {
                     ['userName', 'admin', 'connection', 'profileUrl', 'placeName'].forEach(function (name) {
                         var value = message.params[name];
@@ -1235,7 +1276,6 @@ Rectangle {
                         nearbyUserModelData[userIndex][name] = value; // for refill after sort
                     });
                 }
-            // In this "else if" case, the only param of the message is the profile pic URL.
             } else if (message.params.profileUrl) {
                 myData.profileUrl = message.params.profileUrl;
                 myCard.profileUrl = message.params.profileUrl;

scripts/system/pal.js

@@ -361,8 +361,12 @@ function getAvailableConnections(domain, callback) { // callback([{usename, loca
 
 function getConnectionData(domain) { // Update all the usernames that I am entitled to see, using my login but not dependent on canKick.
     function frob(user) { // get into the right format
+        var formattedSessionId = user.location.node_id || '';
+        if (formattedSessionId !== '' && formattedSessionId.indexOf("{") != 0) {
+            formattedSessionId = "{" + formattedSessionId + "}";
+        }
         return {
-            sessionId: user.location.node_id || '',
+            sessionId: formattedSessionId,
             userName: user.username,
             connection: user.connection,
             profileUrl: user.profileUrl,
@@ -450,9 +454,6 @@ function populateNearbyUserList(selectData, oldAudioData) {
         } else {
             // Return our username from the Account API
             avatarPalDatum.userName = Account.username;
-            getProfilePicture(avatarPalDatum.userName, function (url) {
-                sendToQml({ method: 'updateUsername', params: { profileUrl: url } });
-            });
         }
         data.push(avatarPalDatum);
         print('PAL data:', JSON.stringify(avatarPalDatum));