No more semicolons; tons of improvements

This commit is contained in:
Zach Fox 2016-12-21 12:45:44 -08:00
parent 630fb8696f
commit 1eea3ed27d
6 changed files with 164 additions and 137 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 49 KiB

After

Width:  |  Height:  |  Size: 3.2 KiB

View file

@ -52,7 +52,7 @@ TableView {
size: hifi.fontSizes.tableHeadingIcon size: hifi.fontSizes.tableHeadingIcon
anchors { anchors {
left: titleText.right left: titleText.right
leftMargin: -hifi.fontSizes.tableHeadingIcon / 3 leftMargin: -hifi.fontSizes.tableHeadingIcon / 3 - (centerHeaderText ? 3 : 0)
right: parent.right right: parent.right
rightMargin: hifi.dimensions.tablePadding rightMargin: hifi.dimensions.tablePadding
verticalCenter: titleText.verticalCenter verticalCenter: titleText.verticalCenter

View file

@ -103,7 +103,7 @@ Row {
// Anchors // Anchors
anchors.fill: parent anchors.fill: parent
// Style // Style
color: "#eeeeee" color: "#dbdbdb" // Very appropriate hex value here
radius: parent.radius radius: parent.radius
} }
// Rectangle for the VU meter audio level // Rectangle for the VU meter audio level
@ -112,7 +112,7 @@ Row {
// Size // Size
width: (nameCardVUMeter.audioLevel) * parent.width width: (nameCardVUMeter.audioLevel) * parent.width
// Style // Style
color: "#E3E3E3" color: "#dbdbdb" // Very appropriate hex value here
radius: parent.radius radius: parent.radius
// Anchors // Anchors
anchors.bottom: parent.bottom anchors.bottom: parent.bottom

View file

@ -32,116 +32,144 @@ import "../styles-uit"
import "../controls-uit" as HifiControls import "../controls-uit" as HifiControls
Item { Item {
id: pal; id: pal
// Size // Size
width: parent.width; width: parent.width
height: parent.height; height: parent.height
// Properties // Properties
property int myCardHeight: 70; property int myCardHeight: 70
property int rowHeight: 70; property int rowHeight: 70
property int separatorColWidth: 10; property int separatorColWidth: 10
property int actionButtonWidth: 70; property int actionButtonWidth: 75
property int nameCardWidth: width - (iAmAdmin ? separatorColWidth : 0) - actionButtonWidth*(iAmAdmin ? 4 : 2); property int nameCardWidth: width - (iAmAdmin ? separatorColWidth : 0) - actionButtonWidth*(iAmAdmin ? 4 : 2)
// This contains the current user's NameCard and will contain other information in the future // This contains the current user's NameCard and will contain other information in the future
Rectangle { Rectangle {
id: myInfo; id: myInfo
// Size // Size
width: pal.width; width: pal.width
height: myCardHeight; height: myCardHeight
// Anchors // Anchors
anchors.top: pal.top; anchors.top: pal.top
// Properties // Properties
radius: hifi.dimensions.borderRadius; radius: hifi.dimensions.borderRadius
// This NameCard refers to the current user's NameCard (the one above the table) // This NameCard refers to the current user's NameCard (the one above the table)
NameCard { NameCard {
id: myCard; id: myCard
// Properties // Properties
displayName: myData.displayName; displayName: myData.displayName
userName: myData.userName; userName: myData.userName
// Size // Size
width: nameCardWidth; width: nameCardWidth
height: parent.height; height: parent.height
// Anchors // Anchors
anchors.left: parent.left; anchors.left: parent.left
} }
} }
// Rectangles used to cover up rounded edges on bottom of MyInfo Rectangle // Rectangles used to cover up rounded edges on bottom of MyInfo Rectangle
Rectangle { Rectangle {
color: "#FFFFFF"; color: "#FFFFFF"
width: pal.width; width: pal.width
height: 10; height: 10
anchors.top: myInfo.bottom; anchors.top: myInfo.bottom
anchors.left: parent.left; anchors.left: parent.left
} }
Rectangle { Rectangle {
color: "#FFFFFF"; color: "#FFFFFF"
width: pal.width; width: pal.width
height: 10; height: 10
anchors.bottom: table.top; anchors.bottom: table.top
anchors.left: parent.left; anchors.left: parent.left
}
// Rectangle that houses "Global Actions" string
Rectangle {
visible: iAmAdmin
color: hifi.colors.tableRowLightEven
width: actionButtonWidth * 2 + separatorColWidth - 2
height: 40
anchors.bottom: myInfo.bottom
anchors.bottomMargin: -10
anchors.right: myInfo.right
radius: hifi.dimensions.borderRadius
RalewaySemiBold {
text: "ADMIN"
size: hifi.fontSizes.tableHeading + 2
font.capitalization: Font.AllUppercase
color: hifi.colors.redHighlight
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignTop
anchors.top: parent.top
anchors.topMargin: 8
anchors.left: parent.left
anchors.right: parent.right
}
} }
// This TableView refers to the table (below the current user's NameCard) // This TableView refers to the table (below the current user's NameCard)
HifiControls.Table { HifiControls.Table {
id: table; id: table
// Size // Size
height: pal.height - myInfo.height - 4; height: pal.height - myInfo.height - 4
width: pal.width - 4; width: pal.width - 4
// Anchors // Anchors
anchors.left: parent.left; anchors.left: parent.left
anchors.top: myInfo.bottom; anchors.top: myInfo.bottom
// Properties // Properties
centerHeaderText: true; centerHeaderText: true
sortIndicatorVisible: true; sortIndicatorVisible: true
headerVisible: true; headerVisible: true
onSortIndicatorColumnChanged: sortModel(); onSortIndicatorColumnChanged: sortModel()
onSortIndicatorOrderChanged: sortModel(); onSortIndicatorOrderChanged: sortModel()
TableViewColumn { TableViewColumn {
role: "displayName"; role: "displayName"
title: "NAMES"; title: "NAMES"
width: nameCardWidth; width: nameCardWidth
movable: false; movable: false
resizable: false
} }
TableViewColumn { TableViewColumn {
role: "personalMute"; role: "personalMute"
title: "MUTE" title: "MUTE"
width: actionButtonWidth; width: actionButtonWidth
movable: false; movable: false
resizable: false
} }
TableViewColumn { TableViewColumn {
role: "ignore"; role: "ignore"
title: "IGNORE"; title: "IGNORE"
width: actionButtonWidth; width: actionButtonWidth
movable: false; movable: false
resizable: false
} }
TableViewColumn { TableViewColumn {
visible: iAmAdmin; visible: iAmAdmin
title: ""; title: ""
width: separatorColWidth; width: separatorColWidth
resizable: false; resizable: false
movable: false; movable: false
} }
TableViewColumn { TableViewColumn {
visible: iAmAdmin; visible: iAmAdmin
role: "mute"; role: "mute"
title: "SILENCE"; title: "SILENCE"
width: actionButtonWidth; width: actionButtonWidth
movable: false; movable: false
resizable: false
} }
TableViewColumn { TableViewColumn {
visible: iAmAdmin; visible: iAmAdmin
role: "kick"; role: "kick"
title: "BAN" title: "BAN"
width: actionButtonWidth; width: actionButtonWidth
movable: false; movable: false
resizable: false
} }
model: userModel; model: userModel
// This Rectangle refers to each Row in the table. // This Rectangle refers to each Row in the table.
rowDelegate: Rectangle { // The only way I know to specify a row height. rowDelegate: Rectangle { // The only way I know to specify a row height.
// Size // Size
height: rowHeight; height: rowHeight
color: styleData.selected color: styleData.selected
? "#afafaf" ? "#afafaf"
: styleData.alternate ? hifi.colors.tableRowLightEven : hifi.colors.tableRowLightOdd : styleData.alternate ? hifi.colors.tableRowLightEven : hifi.colors.tableRowLightOdd
@ -149,108 +177,108 @@ Item {
// This Item refers to the contents of each Cell // This Item refers to the contents of each Cell
itemDelegate: Item { itemDelegate: Item {
id: itemCell; id: itemCell
property bool isCheckBox: typeof(styleData.value) === 'boolean'; property bool isCheckBox: typeof(styleData.value) === 'boolean'
property bool isSeparator: styleData.value === ''; property bool isSeparator: styleData.value === ''
// This NameCard refers to the cell that contains an avatar's // This NameCard refers to the cell that contains an avatar's
// DisplayName and UserName // DisplayName and UserName
NameCard { NameCard {
id: nameCard; id: nameCard
// Properties // Properties
displayName: styleData.value; displayName: styleData.value
userName: model.userName; userName: model.userName
visible: !isCheckBox && !isSeparator; visible: !isCheckBox && !isSeparator
// Size // Size
width: nameCardWidth; width: nameCardWidth
height: parent.height; height: parent.height
// Anchors // Anchors
anchors.left: parent.left; anchors.left: parent.left
} }
// This CheckBox belongs in the columns that contain the action buttons ("Mute", "Ban", etc) // This CheckBox belongs in the columns that contain the action buttons ("Mute", "Ban", etc)
HifiControls.CheckBox { HifiControls.CheckBox {
visible: isCheckBox && !isSeparator; visible: isCheckBox && !isSeparator
anchors.centerIn: parent; anchors.centerIn: parent
boxSize: 22; boxSize: 24
onClicked: { onClicked: {
var newValue = !model[styleData.role]; var newValue = !model[styleData.role]
var datum = userData[model.userIndex]; var datum = userData[model.userIndex]
datum[styleData.role] = model[styleData.role] = newValue; datum[styleData.role] = model[styleData.role] = newValue
Users[styleData.role](model.sessionId); Users[styleData.role](model.sessionId)
// Just for now, while we cannot undo things: // Just for now, while we cannot undo things:
userData.splice(model.userIndex, 1); userData.splice(model.userIndex, 1)
sortModel(); sortModel()
} }
} }
} }
} }
// This Rectangle refers to the [?] popup button // This Rectangle refers to the [?] popup button
Rectangle { Rectangle {
color: hifi.colors.tableBackgroundLight; color: hifi.colors.tableBackgroundLight
width: 18; width: 20
height: hifi.dimensions.tableHeaderHeight - 2; height: hifi.dimensions.tableHeaderHeight - 2
anchors.left: table.left; anchors.left: table.left
anchors.top: table.top; anchors.top: table.top
anchors.topMargin: 1; anchors.topMargin: 1
anchors.leftMargin: nameCardWidth/2 + 23; anchors.leftMargin: nameCardWidth/2 + 24
RalewayRegular { RalewayRegular {
id: helpText; id: helpText
text: "[?]"; text: "[?]"
size: hifi.fontSizes.tableHeading; size: hifi.fontSizes.tableHeading + 2
font.capitalization: Font.AllUppercase; font.capitalization: Font.AllUppercase
color: hifi.colors.darkGray; color: hifi.colors.darkGray
horizontalAlignment: Text.AlignHCenter; horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter; verticalAlignment: Text.AlignVCenter
anchors.fill: parent; anchors.fill: parent
} }
MouseArea { MouseArea {
anchors.fill: parent; anchors.fill: parent
acceptedButtons: Qt.LeftButton; acceptedButtons: Qt.LeftButton
hoverEnabled: true; hoverEnabled: true
onClicked: namesPopup.visible = true; onClicked: namesPopup.visible = true
onEntered: helpText.color = hifi.colors.baseGrayHighlight; onEntered: helpText.color = hifi.colors.baseGrayHighlight
onExited: helpText.color = hifi.colors.darkGray; onExited: helpText.color = hifi.colors.darkGray
} }
} }
// Explanitory popup upon clicking "[?]" // Explanitory popup upon clicking "[?]"
Item { Item {
visible: false; visible: false
id: namesPopup; id: namesPopup
anchors.fill: pal; anchors.fill: pal
Rectangle { Rectangle {
anchors.fill: parent; anchors.fill: parent
color: "black"; color: "black"
opacity: 0.5; opacity: 0.5
radius: hifi.dimensions.borderRadius; radius: hifi.dimensions.borderRadius
} }
Rectangle { Rectangle {
width: Math.min(parent.width * 0.75, 400); width: Math.min(parent.width * 0.75, 400)
height: popupText.contentHeight*2; height: popupText.contentHeight*2
anchors.centerIn: parent; anchors.centerIn: parent
radius: hifi.dimensions.borderRadius; radius: hifi.dimensions.borderRadius
color: "white"; color: "white"
FiraSansSemiBold { FiraSansSemiBold {
id: popupText; id: popupText
text: "This is temporary text. It will eventually be used to explain what 'Names' means."; text: "This is temporary text. It will eventually be used to explain what 'Names' means."
size: hifi.fontSizes.textFieldInput; size: hifi.fontSizes.textFieldInput
color: hifi.colors.darkGray; color: hifi.colors.darkGray
horizontalAlignment: Text.AlignHCenter; horizontalAlignment: Text.AlignHCenter
anchors.fill: parent; anchors.fill: parent
wrapMode: Text.WordWrap; wrapMode: Text.WordWrap
} }
} }
MouseArea { MouseArea {
anchors.fill: parent; anchors.fill: parent
acceptedButtons: Qt.LeftButton; acceptedButtons: Qt.LeftButton
onClicked: { onClicked: {
namesPopup.visible = false; namesPopup.visible = false
} }
} }
} }
property var userData: []; property var userData: []
property var myData: ({displayName: "", userName: ""}); // valid dummy until set property var myData: ({displayName: "", userName: ""}) // valid dummy until set
property bool iAmAdmin: false; property bool iAmAdmin: false
function findSessionIndex(sessionId, optionalData) { // no findIndex in .qml function findSessionIndex(sessionId, optionalData) { // no findIndex in .qml
var i, data = optionalData || userData, length = data.length; var i, data = optionalData || userData, length = data.length;
for (var i = 0; i < length; i++) { for (var i = 0; i < length; i++) {

View file

@ -89,8 +89,8 @@ Item {
readonly property color transparent: "#00ffffff" readonly property color transparent: "#00ffffff"
// Control specific colors // Control specific colors
readonly property color tableRowLightOdd: "#eaeaea" // Equivalent to white50 over #e3e3e3 background readonly property color tableRowLightOdd: "#fafafa"
readonly property color tableRowLightEven: "#c6c6c6" // Equivavlent to "#1a575757" over #e3e3e3 background readonly property color tableRowLightEven: "#eeeeee" // Equivavlent to "#1a575757" over #e3e3e3 background
readonly property color tableRowDarkOdd: "#2e2e2e" // Equivalent to "#80393939" over #404040 background readonly property color tableRowDarkOdd: "#2e2e2e" // Equivalent to "#80393939" over #404040 background
readonly property color tableRowDarkEven: "#1c1c1c" // Equivalent to "#a6181818" over #404040 background readonly property color tableRowDarkEven: "#1c1c1c" // Equivalent to "#a6181818" over #404040 background
readonly property color tableBackgroundLight: tableRowLightEven readonly property color tableBackgroundLight: tableRowLightEven

View file

@ -17,7 +17,6 @@
#include "Menu.h" #include "Menu.h"
HIFI_QML_DEF(AvatarInputs) HIFI_QML_DEF(AvatarInputs)
HIFI_QML_DEF(AvatarInputs2)
static AvatarInputs* INSTANCE{ nullptr }; static AvatarInputs* INSTANCE{ nullptr };