mirror of
https://github.com/lubosz/overte.git
synced 2025-04-26 12:55:27 +02:00
Merge pull request #7642 from ctrlaltdavid/20872
Further restyling of edit.js
This commit is contained in:
Brad Hefta-Gaub
commit
f4e4f217e8
20 changed files with 835 additions and 382 deletions
examples
interface/resources
|
|
@ -404,6 +404,10 @@ var toolBar = (function() {
|
|||
Window.alert("Can't create " + properties.type + ": " + properties.type + " would be out of bounds.");
|
||||
}
|
||||
|
||||
selectionManager.clearSelections();
|
||||
entityListTool.sendUpdate();
|
||||
selectionManager.setSelections([entityID]);
|
||||
|
||||
return entityID;
|
||||
}
|
||||
|
||||
|
|
@ -1194,6 +1198,30 @@ function deleteSelectedEntities() {
|
|||
}
|
||||
}
|
||||
|
||||
function toggleSelectedEntitiesLocked() {
|
||||
if (SelectionManager.hasSelection()) {
|
||||
var locked = !Entities.getEntityProperties(SelectionManager.selections[0], ["locked"]).locked;
|
||||
for (var i = 0; i < selectionManager.selections.length; i++) {
|
||||
var entityID = SelectionManager.selections[i];
|
||||
Entities.editEntity(entityID, { locked: locked });
|
||||
}
|
||||
entityListTool.sendUpdate();
|
||||
selectionManager._update();
|
||||
}
|
||||
}
|
||||
|
||||
function toggleSelectedEntitiesVisible() {
|
||||
if (SelectionManager.hasSelection()) {
|
||||
var visible = !Entities.getEntityProperties(SelectionManager.selections[0], ["visible"]).visible;
|
||||
for (var i = 0; i < selectionManager.selections.length; i++) {
|
||||
var entityID = SelectionManager.selections[i];
|
||||
Entities.editEntity(entityID, { visible: visible });
|
||||
}
|
||||
entityListTool.sendUpdate();
|
||||
selectionManager._update();
|
||||
}
|
||||
}
|
||||
|
||||
function handeMenuEvent(menuItem) {
|
||||
if (menuItem == "Allow Selecting of Small Models") {
|
||||
allowSmallModels = Menu.isOptionChecked("Allow Selecting of Small Models");
|
||||
|
|
@ -1522,7 +1550,8 @@ PropertiesTool = function(opts) {
|
|||
data.properties.keyLight.direction.x * DEGREES_TO_RADIANS, data.properties.keyLight.direction.y * DEGREES_TO_RADIANS);
|
||||
}
|
||||
Entities.editEntity(selectionManager.selections[0], data.properties);
|
||||
if (data.properties.name != undefined) {
|
||||
if (data.properties.name !== undefined || data.properties.modelURL !== undefined
|
||||
|| data.properties.visible !== undefined || data.properties.locked !== undefined) {
|
||||
entityListTool.sendUpdate();
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -63,7 +63,7 @@
|
|||
}
|
||||
|
||||
body {
|
||||
padding: 24px 12px 24px 12px;
|
||||
padding: 21px 21px 21px 21px;
|
||||
|
||||
color: #afafaf;
|
||||
background-color: #404040;
|
||||
|
|
@ -164,6 +164,10 @@ tr.selected {
|
|||
background-color: #00b4ef;
|
||||
}
|
||||
|
||||
tr.selected + tr.selected {
|
||||
border-top: 1px solid #2e2e2e;
|
||||
}
|
||||
|
||||
th {
|
||||
text-align: center;
|
||||
word-wrap: nowrap;
|
||||
|
|
@ -227,6 +231,15 @@ input.search {
|
|||
border-radius: 14px;
|
||||
}
|
||||
|
||||
input.search:focus {
|
||||
outline: none;
|
||||
box-sizing: border-box;
|
||||
height: 26px;
|
||||
margin-top: 1px;
|
||||
margin-bottom: 1px;
|
||||
box-shadow: 0 0 0px 1px #00b4ef;
|
||||
}
|
||||
|
||||
input:disabled, textarea:disabled {
|
||||
background-color: #383838;
|
||||
color: #afafaf;
|
||||
|
|
@ -275,7 +288,9 @@ input[type=number]::-webkit-inner-spin-button:after {
|
|||
content: "5";
|
||||
bottom: 6px;
|
||||
}
|
||||
input[type="number"]::-webkit-inner-spin-button:hover {
|
||||
|
||||
input[type=number].hover-up::-webkit-inner-spin-button:before,
|
||||
input[type=number].hover-down::-webkit-inner-spin-button:after {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
|
|
@ -294,8 +309,8 @@ input[type=button] {
|
|||
vertical-align: top;
|
||||
height: 28px;
|
||||
min-width: 120px;
|
||||
padding: 0px 12px;
|
||||
margin-right: 8px;
|
||||
padding: 0px 18px;
|
||||
margin-right: 6px;
|
||||
border-radius: 5px;
|
||||
border: none;
|
||||
color: #fff;
|
||||
|
|
@ -370,6 +385,22 @@ input[type=checkbox]:checked + label:hover {
|
|||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAEySURBVDhPnZLPSsNAEMa/XVPBCE0RhNy0OarP4Av4AD6JB0GwVBA8efBBxHsgh4CQswcRoUIpiIpVAm3zZ5M4szFSbQPBH3xkJvNNZskOer2eLIriKM/ze1JOcS1UHmdZduF5ngEKjr/fN4Z6+oKerwA2gxC4HAFPEWVLsAzgZAvYt3Q6Enw6jg7uBAaTFMNwhpnKdbXCkAJdy8ROu4XrXW2HTJIErHcFDD6nC02Mom8PwymeE2gvS0ZRBBaTlsOXEmdlrfLLOI7Bakrl/zWxCT8T/904f9QW/b06qtrCUdtFCqdjYs2Q2jAPX8c2XQd7Kr/wfV8vwIPs4Ga1ixe5Xrr/YFLTYfKIvWzM6ZtwXZdX7lxXG0L+sxXHcW5t254opRzawQ0S72+dPmjTroIgOP0CQSMt5LDn1T8AAAAASUVORK5CYII=);
|
||||
}
|
||||
|
||||
.icon-input input {
|
||||
position: relative;
|
||||
padding-left: 36px;
|
||||
}
|
||||
.icon-input span {
|
||||
position: absolute;
|
||||
left: 6px;
|
||||
top: -2px;
|
||||
font-family: hifi-glyphs;
|
||||
font-size: 30px;
|
||||
color: #afafaf;
|
||||
}
|
||||
.icon-input input:focus + span {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.selectable {
|
||||
-webkit-touch-callout: text;
|
||||
-webkit-user-select: text;
|
||||
|
|
@ -396,11 +427,11 @@ input[type=checkbox]:checked + label:hover {
|
|||
}
|
||||
|
||||
|
||||
.section-header, .sub-section-header {
|
||||
.section-header, .sub-section-header, hr {
|
||||
display: table;
|
||||
width: 100%;
|
||||
margin: 22px -12px 0 -12px;
|
||||
padding: 14px 12px 0 12px;
|
||||
margin: 21px -21px 0 -21px;
|
||||
padding: 14px 21px 0 21px;
|
||||
font-family: Raleway-Regular;
|
||||
font-size: 12px;
|
||||
color: #afafaf;
|
||||
|
|
@ -414,12 +445,12 @@ input[type=checkbox]:checked + label:hover {
|
|||
background: #404040 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAqCAIAAAAbNW1vAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAmSURBVChTY1BFAgzhSIDBAQmMcoYHRwIJMCgjAQZ9JMBgBQdWVgBh5XmBV5A2FQAAAABJRU5ErkJggg==) repeat-x top left;
|
||||
}
|
||||
|
||||
.sub-section-header, .no-collapse {
|
||||
.sub-section-header, .no-collapse, hr {
|
||||
background: #404040 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAAjSURBVBhXY1RVVf3PgARYjIyMoEwIYHRwcEBRwQSloYCBAQCwjgPMiI7W2QAAAABJRU5ErkJggg==) repeat-x top left;
|
||||
}
|
||||
|
||||
.section-header:first-child {
|
||||
margin-top: 0;
|
||||
margin-top: -2px;
|
||||
padding-top: 0;
|
||||
background: none;
|
||||
height: auto;
|
||||
|
|
@ -435,11 +466,16 @@ input[type=checkbox]:checked + label:hover {
|
|||
float: right;
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 6px;
|
||||
right: 13px;
|
||||
}
|
||||
|
||||
.section-header[collapsed="true"] {
|
||||
margin-bottom: -22px;
|
||||
margin-bottom: -21px;
|
||||
}
|
||||
|
||||
hr {
|
||||
border: none;
|
||||
padding-top: 2px;
|
||||
}
|
||||
|
||||
.text-group[collapsed="true"] ~ .text-group,
|
||||
|
|
@ -458,20 +494,25 @@ input[type=checkbox]:checked + label:hover {
|
|||
.property {
|
||||
display: table;
|
||||
width: 100%;
|
||||
margin-top: 22px;
|
||||
min-height: 29px;
|
||||
margin-top: 21px;
|
||||
min-height: 28px;
|
||||
}
|
||||
|
||||
.property.checkbox {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.property label {
|
||||
.property label, .number label {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
font-family: Raleway-SemiBold;
|
||||
font-size: 14px;
|
||||
}
|
||||
.property label .unit, .number label .unit {
|
||||
margin-left: 8px;
|
||||
font-family: Raleway-Light;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.value {
|
||||
display: block;
|
||||
|
|
@ -499,12 +540,14 @@ input[type=checkbox]:checked + label:hover {
|
|||
float: left;
|
||||
}
|
||||
.property .number + .number {
|
||||
margin-left: 12px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.text label, .url label, .number label, .textarea label, .rgb label, .xyz label, .pyr label, .dropdown label, .gen label {
|
||||
float: left;
|
||||
margin-bottom: 4px;
|
||||
margin-left: 1px;
|
||||
margin-bottom: 3px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
|
||||
.number > input {
|
||||
|
|
@ -519,13 +562,6 @@ input[type=checkbox]:checked + label:hover {
|
|||
clear: both;
|
||||
}
|
||||
|
||||
.unit {
|
||||
padding-left: 4px;
|
||||
vertical-align: top;
|
||||
position: relative;
|
||||
top: 5px;
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
position: relative;
|
||||
margin-bottom: -17px;
|
||||
|
|
@ -544,10 +580,8 @@ input[type=checkbox]:checked + label:hover {
|
|||
width: 172px;
|
||||
height: 28px;
|
||||
padding: 0 28px 0 12px;
|
||||
|
||||
color: #afafaf;
|
||||
background: linear-gradient(#7d7d7d 20%, #686a68 100%);
|
||||
|
||||
position: relative;
|
||||
}
|
||||
.dropdown dl[dropped="true"] {
|
||||
|
|
@ -606,6 +640,17 @@ input[type=checkbox]:checked + label:hover {
|
|||
background-color: #00b4ef;
|
||||
}
|
||||
|
||||
.dropdown dl[disabled="disabled"], .dropdown dl[disabled="disabled"][dropped="true"] {
|
||||
color: #252525;
|
||||
background: linear-gradient(#575757 20%, #252525 100%);
|
||||
}
|
||||
.dropdown dl[disabled="disabled"] dd {
|
||||
display: none;
|
||||
}
|
||||
.dropdown dl[disabled="disabled"] dt:hover {
|
||||
color: #252525;
|
||||
}
|
||||
|
||||
|
||||
div.refresh {
|
||||
box-sizing: border-box;
|
||||
|
|
@ -619,7 +664,7 @@ div.refresh input[type="button"] {
|
|||
.color-picker {
|
||||
box-sizing: border-box;
|
||||
float: left;
|
||||
margin-bottom: 12px;
|
||||
margin-bottom: 21px;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border: 4px solid #afafaf;
|
||||
|
|
@ -636,32 +681,36 @@ div.refresh input[type="button"] {
|
|||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAABDSURBVChTjcoLCkAhCETRNq0tf97Y5xGZ1gVJ45TH6njThIO+xk2UwhWFcEdH6JCqOuiQiMDi/hcii3crRRb/7ggAPvIMVihQwvSXAAAAAElFTkSuQmCC);
|
||||
}
|
||||
|
||||
.color-picker[disabled="disabled"] {
|
||||
border-color: #afafaf;
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAABTSURBVChTjcxBDoAwCETRwTs33sFjwB6uaCE1Ggvav5qQF7CSqu40dllHjYiOT3gh3yV8Ii+Fb+RNMEP9hm3sKENmBhG5P1aImWMH/EMerSAAOAFgTC/R8ZXSXAAAAABJRU5ErkJggg==);
|
||||
}
|
||||
|
||||
.colpick[disabled="disabled"] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
|
||||
.rgb label {
|
||||
float: left;
|
||||
margin-top: 10px;
|
||||
margin-left: 12px;
|
||||
margin-left: 21px;
|
||||
}
|
||||
.rgb label + * {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.tuple {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
.tuple div {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
min-width: 120px;
|
||||
min-height: 1px;
|
||||
margin-right: 6px;
|
||||
}
|
||||
.tuple div:nth-child(1) {
|
||||
float: left;
|
||||
.tuple div:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
.tuple div:nth-child(2) {
|
||||
}
|
||||
.tuple div:nth-child(3) {
|
||||
float: right;
|
||||
|
||||
.tuple label {
|
||||
margin-right: -6px;
|
||||
}
|
||||
|
||||
.rgb .tuple input {
|
||||
|
|
@ -712,31 +761,49 @@ tuple, .blue:focus, .tuple .z:focus, .tuple .roll:focus {
|
|||
}
|
||||
|
||||
.xyz .buttons input {
|
||||
margin-top: 12px;
|
||||
margin-top: 14px;
|
||||
}
|
||||
.xyz .buttons span {
|
||||
word-wrap: nowrap;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.row input {
|
||||
float: left;
|
||||
.row .property {
|
||||
width: auto;
|
||||
display: inline-block;
|
||||
margin-right: 6px;
|
||||
}
|
||||
.row input[type=button] {
|
||||
margin-left: 8px;
|
||||
.row .property:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
.row .property input {
|
||||
clear: both;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.two-column {
|
||||
display: table;
|
||||
width: 100%;
|
||||
}
|
||||
.two-column > div {
|
||||
display: table-cell;
|
||||
width: 50%;
|
||||
}
|
||||
.column {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.indent {
|
||||
margin-left: 24px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: #2e2e2e;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #696969;
|
||||
border: 2px solid #2e2e2e;
|
||||
|
|
@ -760,7 +827,28 @@ textarea:enabled[scrolling="true"]::-webkit-resizer {
|
|||
|
||||
|
||||
#entity-list-header {
|
||||
margin-bottom: 24px;
|
||||
margin-bottom: 36px;
|
||||
}
|
||||
|
||||
#entity-list-header div {
|
||||
display: inline-block;
|
||||
width: 65px;
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
#entity-list-header div input:first-child {
|
||||
margin-right: 0;
|
||||
float: left;
|
||||
width: 33px;
|
||||
border-right: 1px solid #808080;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
#entity-list-header div input:last-child {
|
||||
margin-right: 0;
|
||||
float: right;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
#delete {
|
||||
|
|
@ -773,6 +861,11 @@ textarea:enabled[scrolling="true"]::-webkit-resizer {
|
|||
position: relative; /* New positioning context. */
|
||||
}
|
||||
|
||||
#entity-list .glyph {
|
||||
font-family: HiFi-Glyphs;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#search-area {
|
||||
padding-right: 148px;
|
||||
padding-bottom: 24px;
|
||||
|
|
@ -785,6 +878,8 @@ textarea:enabled[scrolling="true"]::-webkit-resizer {
|
|||
#radius-and-unit {
|
||||
float: right;
|
||||
margin-right: -148px;
|
||||
position: relative;
|
||||
top: -17px;
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -798,17 +893,39 @@ textarea:enabled[scrolling="true"]::-webkit-resizer {
|
|||
margin-top: 28px;
|
||||
border-left: 2px solid #575757;
|
||||
border-right: 2px solid #575757;
|
||||
}
|
||||
|
||||
#entity-table-scroll, #entity-table {
|
||||
background-color: #1c1c1c;
|
||||
}
|
||||
|
||||
|
||||
#entity-table {
|
||||
margin-top: -28px;
|
||||
margin-bottom: -18px;
|
||||
table-layout: fixed;
|
||||
border: none;
|
||||
background-color: #1c1c1c;
|
||||
}
|
||||
|
||||
#col-type {
|
||||
width: 16%;
|
||||
}
|
||||
#col-name {
|
||||
width: 34%;
|
||||
}
|
||||
#col-url {
|
||||
width: 34%;
|
||||
}
|
||||
#col-locked, #col-visible {
|
||||
width: 8%;
|
||||
}
|
||||
|
||||
#entity-table thead tr, #entity-table thead tr th,
|
||||
#entity-table tfoot tr, #entity-table tfoot tr td {
|
||||
background: none;
|
||||
}
|
||||
|
||||
#entity-table .glyph {
|
||||
margin: 0 -2px 0 -2px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#entity-table thead {
|
||||
|
|
@ -817,6 +934,42 @@ textarea:enabled[scrolling="true"]::-webkit-resizer {
|
|||
border-top-left-radius: 7px;
|
||||
border-top-right-radius: 7px;
|
||||
border-bottom: 1px solid #575757;
|
||||
position: absolute;
|
||||
top: 49px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#entity-table thead th {
|
||||
box-sizing: border-box;
|
||||
padding: 0 0 0 8px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#entity-table th:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
#entity-table th .glyph {
|
||||
position: relative;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
#entity-table thead .sort-order {
|
||||
display: inline-block;
|
||||
width: 8px;
|
||||
margin: -5px 0 -3px 0;
|
||||
text-align: right;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#entity-table td {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#entity-table td.glyph {
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#entity-table tfoot {
|
||||
|
|
@ -825,39 +978,6 @@ textarea:enabled[scrolling="true"]::-webkit-resizer {
|
|||
border-bottom-left-radius: 7px;
|
||||
border-bottom-right-radius: 7px;
|
||||
border-top: 1px solid #575757;
|
||||
}
|
||||
|
||||
#entity-table thead tr, #entity-table thead tr th,
|
||||
#entity-table tfoot tr, #entity-table tfoot tr td {
|
||||
background: none;
|
||||
}
|
||||
|
||||
#entity-table th:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
#col-type {
|
||||
width: 16%;
|
||||
}
|
||||
#col-name {
|
||||
width: 42%;
|
||||
}
|
||||
#col-url {
|
||||
width: 42%;
|
||||
}
|
||||
|
||||
#entity-table thead {
|
||||
position: absolute;
|
||||
top: 49px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#entity-table thead th {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#entity-table tfoot {
|
||||
position: absolute;
|
||||
bottom: -21px;
|
||||
left: 0;
|
||||
|
|
@ -876,25 +996,92 @@ textarea:enabled[scrolling="true"]::-webkit-resizer {
|
|||
}
|
||||
|
||||
|
||||
#properties-list .property:first-child {
|
||||
margin-top: 0;
|
||||
#properties-header {
|
||||
display: table-row;
|
||||
height: 28px;
|
||||
}
|
||||
|
||||
#properties-header .property {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
}
|
||||
#properties-header .checkbox {
|
||||
position: relative;
|
||||
top: -1px;
|
||||
}
|
||||
|
||||
#properties-header #type-icon {
|
||||
font-family: hifi-glyphs;
|
||||
font-size: 31px;
|
||||
color: #00b4ef;
|
||||
margin: -4px 12px -4px -2px;
|
||||
width: auto;
|
||||
display: none;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#properties-header #property-type {
|
||||
padding: 5px 24px 5px 0;
|
||||
border-right: 1px solid #808080;
|
||||
height: 100%;
|
||||
width: auto;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#properties-header .checkbox:last-child {
|
||||
padding-left: 24px;
|
||||
}
|
||||
|
||||
#properties-header .checkbox label {
|
||||
background-position-y: 1px;
|
||||
}
|
||||
|
||||
#properties-header .checkbox label span {
|
||||
font-family: HiFi-Glyphs;
|
||||
font-size: 20px;
|
||||
padding-right: 6px;
|
||||
vertical-align: top;
|
||||
position: relative;
|
||||
top: -4px;
|
||||
}
|
||||
|
||||
#properties-header input[type=checkbox]:checked + label span {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
#properties-header + hr {
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
|
||||
#id label {
|
||||
width: 24px;
|
||||
}
|
||||
#property-id {
|
||||
display: inline-block;
|
||||
}
|
||||
#property-id::selection {
|
||||
color: #000000;
|
||||
background-color: #00b4ef;
|
||||
}
|
||||
|
||||
input#property-parent-id {
|
||||
width: 340px;
|
||||
}
|
||||
|
||||
input#dimension-rescale-button {
|
||||
min-width: 50px;
|
||||
margin-left: 6px;
|
||||
}
|
||||
|
||||
|
||||
.color-set label, .color-set span {
|
||||
display: block;
|
||||
input#reset-to-natural-dimensions {
|
||||
margin-right: 0;
|
||||
}
|
||||
.color-set span {
|
||||
padding-top: 2px;
|
||||
input#preview-camera-button {
|
||||
margin-left: 1px;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
#animation-fps {
|
||||
margin-top: 48px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -14,25 +14,34 @@
|
|||
<script src="list.min.js"></script>
|
||||
<script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
|
||||
<script type="text/javascript" src="eventBridgeLoader.js"></script>
|
||||
<script type="text/javascript" src="spinButtons.js"></script>
|
||||
<script>
|
||||
var entities = {};
|
||||
var selectedEntities = [];
|
||||
var currentSortColumn = 'type';
|
||||
var currentSortOrder = 'asc';
|
||||
var currentSortOrder = 'des';
|
||||
var entityList = null;
|
||||
var refreshEntityListTimer = null;
|
||||
const ASCENDING_STRING = ' ▾';
|
||||
const DESCENDING_STRING = ' ▴';
|
||||
const ASCENDING_STRING = '▾';
|
||||
const DESCENDING_STRING = '▴';
|
||||
const LOCKED_GLYPH = "";
|
||||
const VISIBLE_GLYPH = "";
|
||||
const DELETE = 46; // Key code for the delete key.
|
||||
const MAX_ITEMS = Number.MAX_VALUE; // Used to set the max length of the list of discovered entities.
|
||||
|
||||
debugPrint = function (message) {
|
||||
console.log(message);
|
||||
};
|
||||
|
||||
function loaded() {
|
||||
openEventBridge(function() {
|
||||
entityList = new List('entity-list', { valueNames: ['name', 'type', 'url'], page: MAX_ITEMS});
|
||||
entityList = new List('entity-list', { valueNames: ['name', 'type', 'url', 'locked', 'visible'], page: MAX_ITEMS});
|
||||
entityList.clear();
|
||||
elEntityTable = document.getElementById("entity-table");
|
||||
elEntityTableBody = document.getElementById("entity-table-body");
|
||||
elRefresh = document.getElementById("refresh");
|
||||
elToggleLocked = document.getElementById("locked");
|
||||
elToggleVisible = document.getElementById("visible");
|
||||
elDelete = document.getElementById("delete");
|
||||
elTeleport = document.getElementById("teleport");
|
||||
elRadius = document.getElementById("radius");
|
||||
|
|
@ -50,6 +59,12 @@
|
|||
document.getElementById("entity-url").onclick = function() {
|
||||
setSortColumn('url');
|
||||
};
|
||||
document.getElementById("entity-locked").onclick = function () {
|
||||
setSortColumn('locked');
|
||||
};
|
||||
document.getElementById("entity-visible").onclick = function () {
|
||||
setSortColumn('visible');
|
||||
};
|
||||
|
||||
function onRowClicked(clickEvent) {
|
||||
var id = this.dataset.entityId;
|
||||
|
|
@ -101,19 +116,20 @@
|
|||
}));
|
||||
}
|
||||
|
||||
function addEntity(id, name, type, url) {
|
||||
function addEntity(id, name, type, url, locked, visible) {
|
||||
var urlParts = url.split('/');
|
||||
var filename = urlParts[urlParts.length - 1];
|
||||
|
||||
if (entities[id] === undefined) {
|
||||
var urlParts = url.split('/');
|
||||
var filename = urlParts[urlParts.length - 1];
|
||||
|
||||
entityList.add([{ id: id, name: name, type: type, url: filename }], function(items) {
|
||||
entityList.add([{ id: id, name: name, type: type, url: filename, locked: locked, visible: visible }],
|
||||
function (items) {
|
||||
var currentElement = items[0].elm;
|
||||
var id = items[0]._values.id;
|
||||
entities[id] = {
|
||||
id: id,
|
||||
name: name,
|
||||
el: currentElement,
|
||||
item: items[0],
|
||||
item: items[0]
|
||||
};
|
||||
currentElement.setAttribute('id', 'entity_' + id);
|
||||
currentElement.setAttribute('title', url);
|
||||
|
|
@ -128,7 +144,7 @@
|
|||
refreshEntityListTimer = setTimeout(refreshEntityListObject, 50);
|
||||
} else {
|
||||
var item = entities[id].item;
|
||||
item.values({ name: name, url: url });
|
||||
item.values({ name: name, url: filename, locked: locked, visible: visible });
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -141,19 +157,21 @@
|
|||
name: document.querySelector('#entity-name .sort-order'),
|
||||
type: document.querySelector('#entity-type .sort-order'),
|
||||
url: document.querySelector('#entity-url .sort-order'),
|
||||
locked: document.querySelector('#entity-locked .sort-order'),
|
||||
visible: document.querySelector('#entity-visible .sort-order')
|
||||
}
|
||||
function setSortColumn(column) {
|
||||
if (currentSortColumn == column) {
|
||||
currentSortOrder = currentSortOrder == "asc" ? "desc" : "asc";
|
||||
} else {
|
||||
elSortOrder[currentSortColumn].style.display = 'none';
|
||||
elSortOrder[column].style.display = 'inline';
|
||||
elSortOrder[currentSortColumn].innerHTML = "";
|
||||
currentSortColumn = column;
|
||||
currentSortOrder = "asc";
|
||||
}
|
||||
elSortOrder[column].innerHTML = currentSortOrder == "asc" ? ASCENDING_STRING : DESCENDING_STRING;
|
||||
entityList.sort(currentSortColumn, { order: currentSortOrder });
|
||||
}
|
||||
setSortColumn('type');
|
||||
|
||||
function refreshEntities() {
|
||||
clearEntities();
|
||||
|
|
@ -191,13 +209,24 @@
|
|||
elFooter.firstChild.nodeValue = entityList.visibleItems.length + " entities found";
|
||||
}
|
||||
|
||||
// HACK: Fixes the footer and header text sometimes not displaying after adding or deleting entities.
|
||||
// The problem appears to be a bug in the Qt HTML/CSS rendering (Qt 5.5).
|
||||
document.getElementById("radius").focus();
|
||||
document.getElementById("radius").blur();
|
||||
|
||||
return notFound;
|
||||
}
|
||||
|
||||
elRefresh.onclick = function() {
|
||||
refreshEntities();
|
||||
}
|
||||
elTeleport.onclick = function() {
|
||||
elToggleLocked.onclick = function () {
|
||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'toggleLocked' }));
|
||||
}
|
||||
elToggleVisible.onclick = function () {
|
||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'toggleVisible' }));
|
||||
}
|
||||
elTeleport.onclick = function () {
|
||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'teleport' }));
|
||||
}
|
||||
elDelete.onclick = function() {
|
||||
|
|
@ -238,11 +267,14 @@
|
|||
var newEntities = data.entities;
|
||||
if (newEntities.length == 0) {
|
||||
elNoEntitiesMessage.style.display = "block";
|
||||
elFooter.firstChild.nodeValue = "0 entities found";
|
||||
} else {
|
||||
elNoEntitiesMessage.style.display = "none";
|
||||
for (var i = 0; i < newEntities.length; i++) {
|
||||
var id = newEntities[i].id;
|
||||
addEntity(id, newEntities[i].name, newEntities[i].type, newEntities[i].url);
|
||||
addEntity(id, newEntities[i].name, newEntities[i].type, newEntities[i].url,
|
||||
newEntities[i].locked ? LOCKED_GLYPH : null,
|
||||
newEntities[i].visible ? VISIBLE_GLYPH : null);
|
||||
}
|
||||
updateSelectedEntities(data.selectedIDs);
|
||||
resize();
|
||||
|
|
@ -254,15 +286,23 @@
|
|||
|
||||
function resize() {
|
||||
// Take up available window space
|
||||
elEntityTableScroll.style.height = window.innerHeight - 200;
|
||||
elEntityTableScroll.style.height = window.innerHeight - 207;
|
||||
|
||||
// Update the widths of the header cells to match the body
|
||||
var tds = document.querySelectorAll("#entity-table-body tr:first-child td");
|
||||
var ths = document.querySelectorAll("#entity-table thead th");
|
||||
if (tds.length >= ths.length) {
|
||||
// Update the widths of the header cells to match the body
|
||||
for (var i = 0; i < ths.length; i++) {
|
||||
ths[i].style.width = tds[i].offsetWidth;
|
||||
ths[i].width = tds[i].offsetWidth;
|
||||
}
|
||||
} else {
|
||||
// Reasonable widths if nothing is displayed
|
||||
var tableWidth = document.getElementById("entity-table").offsetWidth;
|
||||
ths[0].width = 0.16 * tableWidth;
|
||||
ths[1].width = 0.34 * tableWidth;
|
||||
ths[2].width = 0.34 * tableWidth;
|
||||
ths[3].width = 0.08 * tableWidth;
|
||||
ths[4].width = 0.08 * tableWidth;
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -270,6 +310,8 @@
|
|||
resize();
|
||||
});
|
||||
|
||||
augmentSpinButtons();
|
||||
|
||||
// Disable right-click context menu which is not visible in the HMD and makes it seem like the app has locked
|
||||
document.addEventListener("contextmenu", function (event) {
|
||||
event.preventDefault();
|
||||
|
|
@ -280,14 +322,21 @@
|
|||
<body onload='loaded();'>
|
||||
<div id="entity-list-header">
|
||||
<input type="button" class="glyph" id="refresh" value="F" />
|
||||
<div>
|
||||
<input type="button" id="locked" class="glyph" value="" />
|
||||
<input type="button" id="visible" class="glyph" value="" />
|
||||
</div>
|
||||
<input type="button" id="teleport" value="Jump To Selection" />
|
||||
<input type="button" class="red" id="delete" value="Delete" />
|
||||
</div>
|
||||
|
||||
<div id="entity-list">
|
||||
<div id="search-area">
|
||||
<input type="text" class="search" id="filter" placeholder="Filter" />
|
||||
<span id="radius-and-unit"><input type="number" id="radius" value="100" /><span class="unit">m</span></span>
|
||||
<span class="icon-input"><input type="text" class="search" id="filter" placeholder="Filter" /><span>Y</span></span>
|
||||
<div id="radius-and-unit" class="number">
|
||||
<label for="radius">Search radius <span class="unit">m</span></label>
|
||||
<input type="number" id="radius" value="100" />
|
||||
</div>
|
||||
</div>
|
||||
<div id="entity-table-scroll">
|
||||
<table id="entity-table">
|
||||
|
|
@ -295,12 +344,16 @@
|
|||
<col span="1" id="col-type" />
|
||||
<col span="1" id="col-name" />
|
||||
<col span="1" id="col-url" />
|
||||
<col span="1" id="col-locked" />
|
||||
<col span="1" id="col-visible" />
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th id="entity-type" data-sort="type">Type <span class="sort-order" style="display: inline"> ▾</span></th>
|
||||
<th id="entity-name" data-sort="type">Name <span class="sort-order" style="display: none"> ▾</span></th>
|
||||
<th id="entity-url" data-sort="url">File <span class="sort-order" style="display: none"> ▾</span></th>
|
||||
<th id="entity-type" data-sort="type">Type<span class="sort-order"></span></th>
|
||||
<th id="entity-name" data-sort="type">Name<span class="sort-order"></span></th>
|
||||
<th id="entity-url" data-sort="url">File<span class="sort-order"></span></th>
|
||||
<th id="entity-locked" data-sort="locked"><span class="glyph"></span><span class="sort-order"></span></th>
|
||||
<th colspan="2" id="entity-visible" data-sort="visible"><span class="glyph"></span><span class="sort-order"></span></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="list" id="entity-table-body">
|
||||
|
|
@ -308,12 +361,14 @@
|
|||
<td class="type">Type</td>
|
||||
<td class="name">Name</td>
|
||||
<td class="url"><div class='outer'><div class='inner'>URL</div></div></td>
|
||||
<td class="id" style="display: none">Type</td>
|
||||
<td class="locked glyph">?</td>
|
||||
<td class="visible glyph">?</td>
|
||||
<td class="id" style="display: none">ID</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<td id="footer-text" colspan="3">Footer text</td>
|
||||
<td id="footer-text" colspan="5"> </td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
|
|
|
|||
|
|
@ -17,10 +17,25 @@
|
|||
<script src="colpick.js"></script>
|
||||
<script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
|
||||
<script type="text/javascript" src="eventBridgeLoader.js"></script>
|
||||
<script type="text/javascript" src="spinButtons.js"></script>
|
||||
<script>
|
||||
var PI = 3.14159265358979;
|
||||
var DEGREES_TO_RADIANS = PI / 180.0;
|
||||
var RADIANS_TO_DEGREES = 180.0 / PI;
|
||||
var ICON_FOR_TYPE = {
|
||||
Box: "V",
|
||||
Sphere: "n",
|
||||
ParticleEffect: "",
|
||||
Model: "",
|
||||
Web: "q",
|
||||
Text: "l",
|
||||
Light: "p",
|
||||
Zone: "o",
|
||||
PolyVox: "",
|
||||
Multiple: ""
|
||||
}
|
||||
|
||||
var colorPickers = [];
|
||||
|
||||
debugPrint = function(message) {
|
||||
EventBridge.emitWebEvent(
|
||||
|
|
@ -44,6 +59,19 @@
|
|||
}
|
||||
}
|
||||
|
||||
function enableProperties() {
|
||||
enableChildren(document.getElementById("properties-list"), "input, textarea, checkbox, .dropdown dl, .color-picker");
|
||||
enableChildren(document, ".colpick");
|
||||
}
|
||||
|
||||
function disableProperties() {
|
||||
disableChildren(document.getElementById("properties-list"), "input, textarea, checkbox, .dropdown dl, .color-picker");
|
||||
disableChildren(document, ".colpick");
|
||||
for (var i = 0; i < colorPickers.length; i++) {
|
||||
colorPickers[i].colpickHide();
|
||||
}
|
||||
}
|
||||
|
||||
function showElements(els, show) {
|
||||
for (var i = 0; i < els.length; i++) {
|
||||
els[i].style.display = (show) ? 'table' : 'none';
|
||||
|
|
@ -297,6 +325,7 @@
|
|||
var allSections = [];
|
||||
var elID = document.getElementById("property-id");
|
||||
var elType = document.getElementById("property-type");
|
||||
var elTypeIcon = document.getElementById("type-icon");
|
||||
var elName = document.getElementById("property-name");
|
||||
var elLocked = document.getElementById("property-locked");
|
||||
var elVisible = document.getElementById("property-visible");
|
||||
|
|
@ -368,7 +397,7 @@
|
|||
var elReloadScriptButton = document.getElementById("reload-script-button");
|
||||
var elUserData = document.getElementById("property-user-data");
|
||||
|
||||
var elColorSection = document.getElementById("color-section");
|
||||
var elColorSections = document.querySelectorAll(".color-section");
|
||||
var elColor = document.getElementById("property-color");
|
||||
var elColorRed = document.getElementById("property-color-red");
|
||||
var elColorGreen = document.getElementById("property-color-green");
|
||||
|
|
@ -474,32 +503,40 @@
|
|||
data = JSON.parse(data);
|
||||
if (data.type == "update") {
|
||||
if (data.selections.length == 0) {
|
||||
elType.innerHTML = "<i>No Selection</i>";
|
||||
elTypeIcon.style.display = "none";
|
||||
elType.innerHTML = "<i>No selection</i>";
|
||||
elID.innerHTML = "";
|
||||
disableChildren(document.getElementById("properties-list"), 'input, textarea, checkbox');
|
||||
disableProperties();
|
||||
} else if (data.selections.length > 1) {
|
||||
var selections = data.selections;
|
||||
|
||||
var ids = [];
|
||||
var types = {};
|
||||
var numTypes = 0;
|
||||
|
||||
for (var i = 0; i < selections.length; i++) {
|
||||
ids.push(selections[i].id);
|
||||
var type = selections[i].properties.type;
|
||||
if (types[type] === undefined) {
|
||||
types[type] = 0;
|
||||
numTypes += 1;
|
||||
}
|
||||
types[type]++;
|
||||
}
|
||||
elID.innerHTML = ids.join("<br>");
|
||||
|
||||
var typeStrs = [];
|
||||
for (type in types) {
|
||||
typeStrs.push(type + " (" + types[type] + ")");
|
||||
|
||||
var type;
|
||||
if (numTypes === 1) {
|
||||
type = selections[0].properties.type;
|
||||
} else {
|
||||
type = "Multiple";
|
||||
}
|
||||
elType.innerHTML = typeStrs.join(", ");
|
||||
|
||||
disableChildren(document.getElementById("properties-list"), 'input, textarea, checkbox');
|
||||
elType.innerHTML = type + " (" + data.selections.length + ")";
|
||||
elTypeIcon.innerHTML = ICON_FOR_TYPE[type];
|
||||
elTypeIcon.style.display = "inline-block";
|
||||
|
||||
elID.innerHTML = ids.join("<br>");
|
||||
|
||||
disableProperties();
|
||||
} else {
|
||||
var activeElement = document.activeElement;
|
||||
|
||||
|
|
@ -516,14 +553,16 @@
|
|||
elID.innerHTML = properties.id;
|
||||
|
||||
elType.innerHTML = properties.type;
|
||||
|
||||
elTypeIcon.innerHTML = ICON_FOR_TYPE[properties.type];
|
||||
elTypeIcon.style.display = "inline-block";
|
||||
|
||||
elLocked.checked = properties.locked;
|
||||
|
||||
if (properties.locked) {
|
||||
disableChildren(document.getElementById("properties-list"), 'input, textarea, checkbox');
|
||||
disableProperties();
|
||||
elLocked.removeAttribute('disabled');
|
||||
} else {
|
||||
enableChildren(document.getElementById("properties-list"), 'input, textarea, checkbox');
|
||||
enableProperties();
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -624,13 +663,17 @@
|
|||
}
|
||||
|
||||
if (properties.type == "Box" || properties.type == "Sphere" || properties.type == "ParticleEffect") {
|
||||
elColorSection.style.display = 'table';
|
||||
for (var i = 0; i < elColorSections.length; i++) {
|
||||
elColorSections[i].style.display = 'table';
|
||||
}
|
||||
elColorRed.value = properties.color.red;
|
||||
elColorGreen.value = properties.color.green;
|
||||
elColorBlue.value = properties.color.blue;
|
||||
elColor.style.backgroundColor = "rgb(" + properties.color.red + "," + properties.color.green + "," + properties.color.blue + ")";
|
||||
} else {
|
||||
elColorSection.style.display = 'none';
|
||||
for (var i = 0; i < elColorSections.length; i++) {
|
||||
elColorSections[i].style.display = 'none';
|
||||
}
|
||||
}
|
||||
|
||||
if (properties.type == "Model") {
|
||||
|
|
@ -862,10 +905,10 @@
|
|||
elColorRed.addEventListener('change', colorChangeFunction);
|
||||
elColorGreen.addEventListener('change', colorChangeFunction);
|
||||
elColorBlue.addEventListener('change', colorChangeFunction);
|
||||
$('#property-color').colpick({
|
||||
colorScheme:'dark',
|
||||
layout:'hex',
|
||||
color:'000000',
|
||||
colorPickers.push($('#property-color').colpick({
|
||||
colorScheme: 'dark',
|
||||
layout: 'hex',
|
||||
color: '000000',
|
||||
onShow: function (colpick) {
|
||||
$('#property-color').attr('active', 'true');
|
||||
},
|
||||
|
|
@ -873,12 +916,12 @@
|
|||
$('#property-color').attr('active', 'false');
|
||||
},
|
||||
onSubmit: function (hsb, hex, rgb, el) {
|
||||
$(el).css('background-color', '#'+hex);
|
||||
$(el).css('background-color', '#' + hex);
|
||||
$(el).colpickHide();
|
||||
emitColorPropertyUpdate('color', rgb.r, rgb.g, rgb.b);
|
||||
}
|
||||
})
|
||||
|
||||
}));
|
||||
|
||||
elLightSpotLight.addEventListener('change', createEmitCheckedPropertyUpdateFunction('isSpotlight'));
|
||||
|
||||
var lightColorChangeFunction = createEmitColorPropertyUpdateFunction(
|
||||
|
|
@ -886,10 +929,10 @@
|
|||
elLightColorRed.addEventListener('change', lightColorChangeFunction);
|
||||
elLightColorGreen.addEventListener('change', lightColorChangeFunction);
|
||||
elLightColorBlue.addEventListener('change', lightColorChangeFunction);
|
||||
$('#property-light-color').colpick({
|
||||
colorScheme:'dark',
|
||||
layout:'hex',
|
||||
color:'000000',
|
||||
colorPickers.push($('#property-light-color').colpick({
|
||||
colorScheme: 'dark',
|
||||
layout: 'hex',
|
||||
color: '000000',
|
||||
onShow: function (colpick) {
|
||||
$('#property-light-color').attr('active', 'true');
|
||||
},
|
||||
|
|
@ -897,11 +940,11 @@
|
|||
$('#property-light-color').attr('active', 'false');
|
||||
},
|
||||
onSubmit: function (hsb, hex, rgb, el) {
|
||||
$(el).css('background-color', '#'+hex);
|
||||
$(el).css('background-color', '#' + hex);
|
||||
$(el).colpickHide();
|
||||
emitColorPropertyUpdate('color', rgb.r, rgb.g, rgb.b);
|
||||
}
|
||||
})
|
||||
}));
|
||||
|
||||
elLightIntensity.addEventListener('change', createEmitNumberPropertyUpdateFunction('intensity', 1));
|
||||
elLightFalloffRadius.addEventListener('change', createEmitNumberPropertyUpdateFunction('falloffRadius', 1));
|
||||
|
|
@ -933,7 +976,7 @@
|
|||
elTextTextColorRed.addEventListener('change', textTextColorChangeFunction);
|
||||
elTextTextColorGreen.addEventListener('change', textTextColorChangeFunction);
|
||||
elTextTextColorBlue.addEventListener('change', textTextColorChangeFunction);
|
||||
$('#property-text-text-color').colpick({
|
||||
colorPickers.push($('#property-text-text-color').colpick({
|
||||
colorScheme:'dark',
|
||||
layout:'hex',
|
||||
color: '000000',
|
||||
|
|
@ -949,14 +992,14 @@
|
|||
$(el).attr('active', 'false');
|
||||
emitColorPropertyUpdate('textColor', rgb.r, rgb.g, rgb.b);
|
||||
}
|
||||
});
|
||||
}));
|
||||
|
||||
var textBackgroundColorChangeFunction = createEmitColorPropertyUpdateFunction(
|
||||
'backgroundColor', elTextBackgroundColorRed, elTextBackgroundColorGreen, elTextBackgroundColorBlue);
|
||||
elTextBackgroundColorRed.addEventListener('change', textBackgroundColorChangeFunction);
|
||||
elTextBackgroundColorGreen.addEventListener('change', textBackgroundColorChangeFunction);
|
||||
elTextBackgroundColorBlue.addEventListener('change', textBackgroundColorChangeFunction);
|
||||
$('#property-text-background-color').colpick({
|
||||
colorPickers.push($('#property-text-background-color').colpick({
|
||||
colorScheme:'dark',
|
||||
layout:'hex',
|
||||
color:'000000',
|
||||
|
|
@ -971,10 +1014,10 @@
|
|||
$(el).colpickHide();
|
||||
emitColorPropertyUpdate('backgroundColor', rgb.r, rgb.g, rgb.b);
|
||||
}
|
||||
});
|
||||
}));
|
||||
|
||||
elZoneStageSunModelEnabled.addEventListener('change', createEmitGroupCheckedPropertyUpdateFunction('stage','sunModelEnabled'));
|
||||
$('#property-zone-key-light-color').colpick({
|
||||
colorPickers.push($('#property-zone-key-light-color').colpick({
|
||||
colorScheme:'dark',
|
||||
layout:'hex',
|
||||
color:'000000',
|
||||
|
|
@ -989,7 +1032,7 @@
|
|||
$(el).colpickHide();
|
||||
emitColorPropertyUpdate('color', rgb.r, rgb.g, rgb.b, 'keyLight');
|
||||
}
|
||||
});
|
||||
}));
|
||||
var zoneKeyLightColorChangeFunction = createEmitGroupColorPropertyUpdateFunction('keyLight','color', elZoneKeyLightColorRed, elZoneKeyLightColorGreen, elZoneKeyLightColorBlue);
|
||||
elZoneKeyLightColorRed.addEventListener('change', zoneKeyLightColorChangeFunction);
|
||||
elZoneKeyLightColorGreen.addEventListener('change', zoneKeyLightColorChangeFunction);
|
||||
|
|
@ -1015,7 +1058,7 @@
|
|||
elZoneSkyboxColorRed.addEventListener('change', zoneSkyboxColorChangeFunction);
|
||||
elZoneSkyboxColorGreen.addEventListener('change', zoneSkyboxColorChangeFunction);
|
||||
elZoneSkyboxColorBlue.addEventListener('change', zoneSkyboxColorChangeFunction);
|
||||
$('#property-zone-skybox-color').colpick({
|
||||
colorPickers.push($('#property-zone-skybox-color').colpick({
|
||||
colorScheme:'dark',
|
||||
layout:'hex',
|
||||
color:'000000',
|
||||
|
|
@ -1030,7 +1073,7 @@
|
|||
$(el).colpickHide();
|
||||
emitColorPropertyUpdate('color', rgb.r, rgb.g, rgb.b, 'skybox');
|
||||
}
|
||||
});
|
||||
}));
|
||||
|
||||
elZoneSkyboxURL.addEventListener('change', createEmitGroupTextPropertyUpdateFunction('skybox','url'));
|
||||
|
||||
|
|
@ -1138,7 +1181,7 @@
|
|||
};
|
||||
|
||||
|
||||
// Textarea scollbars
|
||||
// Textarea scrollbars
|
||||
var elTextareas = document.getElementsByTagName("TEXTAREA");
|
||||
|
||||
var textareaOnChangeEvent = function (event) {
|
||||
|
|
@ -1252,6 +1295,8 @@
|
|||
elDropdowns = document.getElementsByTagName("select");
|
||||
}
|
||||
|
||||
augmentSpinButtons();
|
||||
|
||||
// Disable right-click context menu which is not visible in the HMD and makes it seem like the app has locked
|
||||
document.addEventListener("contextmenu", function (event) {
|
||||
event.preventDefault();
|
||||
|
|
@ -1262,30 +1307,32 @@
|
|||
|
||||
<body onload='loaded();'>
|
||||
<div id="properties-list">
|
||||
<div id="type" class="property value">
|
||||
<label>Type:</label>
|
||||
<span id="property-type"></span>
|
||||
</div>
|
||||
<div id="id" class="property value">
|
||||
<label>ID:</label>
|
||||
<span id="property-id" class="selectable"></span>
|
||||
<div id="properties-header">
|
||||
<div id="type" class="property value">
|
||||
<span id="type-icon"></span><label id="property-type"><i>No selection</i></label>
|
||||
</div>
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-locked">
|
||||
<label for="property-locked"><span></span> Locked</label>
|
||||
</div>
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-visible">
|
||||
<label for="property-visible"><span></span> Visible</label>
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
<div class="property text">
|
||||
<label for="property-name">Name</label>
|
||||
<input type="text" id="property-name">
|
||||
</div>
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-locked">
|
||||
<label for="property-locked">Locked</label>
|
||||
</div>
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-visible">
|
||||
<label for="property-visible">Visible</label>
|
||||
</div>
|
||||
<div class="property textarea">
|
||||
<label for="property-user-data">User data</label>
|
||||
<textarea id="property-user-data"></textarea>
|
||||
</div>
|
||||
<div id="id" class="property value">
|
||||
<label>ID:</label>
|
||||
<span id="property-id" class="selectable"></span>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="section-header hyperlink-group hyperlink-section">
|
||||
|
|
@ -1305,7 +1352,35 @@
|
|||
<label>Spatial</label><span>M</span>
|
||||
</div>
|
||||
<div class="spatial-group property xyz">
|
||||
<label>Position</label>
|
||||
<label>Dimensions <span class="unit">m</span></label>
|
||||
<div class="tuple">
|
||||
<div><input type="number" class="x" id="property-dim-x" step="0.1"><label for="property-dim-x">X:</label></div>
|
||||
<div><input type="number" class="y" id="property-dim-y" step="0.1"><label for="property-dim-y">Y:</label></div>
|
||||
<div><input type="number" class="z" id="property-dim-z" step="0.1"><label for="property-dim-z">Z:</label></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="spatial-group property gen">
|
||||
<label>Scale <span class="unit">%</span></label>
|
||||
<div class="row">
|
||||
<input type="number" id="dimension-rescale-pct" value=100>
|
||||
<input type="button" class="blue" id="dimension-rescale-button" value="Rescale">
|
||||
<input type="button" class="red" id="reset-to-natural-dimensions" value="Reset Dimensions">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="spatial-group" />
|
||||
<div class="spatial-group property pyr">
|
||||
<label>Rotation <span class="unit">deg</span></label>
|
||||
<div class="tuple">
|
||||
<div><input type="number" class="pitch" id="property-rot-x" step="0.1"><label for="property-rot-x">Pitch:</label></div>
|
||||
<div><input type="number" class="yaw" id="property-rot-y" step="0.1"><label for="property-rot-y">Yaw:</label></div>
|
||||
<div><input type="number" class="roll" id="property-rot-z" step="0.1"><label for="property-rot-z">Roll:</label></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="spatial-group" />
|
||||
<div class="spatial-group property xyz">
|
||||
<label>Position <span class="unit">m</span></label>
|
||||
<div class="tuple">
|
||||
<div><input type="number" class="x" id="property-pos-x"><label for="property-pos-x">X:</label></div>
|
||||
<div><input type="number" class="y" id="property-pos-y"><label for="property-pos-y">Y:</label></div>
|
||||
|
|
@ -1317,40 +1392,28 @@
|
|||
<input type="button" id="preview-camera-button" value="Preview Camera">
|
||||
</div>
|
||||
</div>
|
||||
<div class="spatial-group property text">
|
||||
<label for="property-parent-id">Parent ID</label>
|
||||
<input type="text" id="property-parent-id">
|
||||
</div>
|
||||
<div class="spatial-group property number">
|
||||
<label for="property-parent-joint-index">Parent joint index</label>
|
||||
<input type="number" id="property-parent-joint-index">
|
||||
<div class="spatial-group row">
|
||||
<div class="property text">
|
||||
<label for="property-parent-id">Parent ID</label>
|
||||
<input type="text" id="property-parent-id">
|
||||
</div>
|
||||
<div class="property number">
|
||||
<label for="property-parent-joint-index">Parent joint index</label>
|
||||
<input type="number" id="property-parent-joint-index">
|
||||
</div>
|
||||
</div>
|
||||
<div class="spatial-group property xyz">
|
||||
<label>Registration</label>
|
||||
<label>Registration <span class="unit">(pivot offset as ratio of dimension)</span></label>
|
||||
<div class="tuple">
|
||||
<div><input type="number" class="x" id="property-reg-x" step="0.1"><label for="property-reg-x">X:</label></div>
|
||||
<div><input type="number" class="y" id="property-reg-y" step="0.1"><label for="property-reg-y">Y:</label></div>
|
||||
<div><input type="number" class="z" id="property-reg-z" step="0.1"><label for="property-reg-z">Z:</label></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="spatial-group property xyz">
|
||||
<label>Dimensions</label>
|
||||
<div class="tuple">
|
||||
<div><input type="number" class="x" id="property-dim-x" step="0.1"><label for="property-dim-x">X:</label></div>
|
||||
<div><input type="number" class="y" id="property-dim-y" step="0.1"><label for="property-dim-y">Y:</label></div>
|
||||
<div><input type="number" class="z" id="property-dim-z" step="0.1"><label for="property-dim-z">Z:</label></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="spatial-group property gen">
|
||||
<label>Scale</label>
|
||||
<div class="row">
|
||||
<input type="number" id="dimension-rescale-pct" value=100>
|
||||
<input type="button" class="blue" id="dimension-rescale-button" value="Rescale">
|
||||
<input type="button" class="red" id="reset-to-natural-dimensions" value="Reset Dimensions">
|
||||
</div>
|
||||
</div>
|
||||
<div class="spatial-group poly-vox-section property XYZ">
|
||||
<label>Voxel volume size</label>
|
||||
|
||||
<hr class="spatial-group poly-vox-section" />
|
||||
<div class="spatial-group poly-vox-section property xyz">
|
||||
<label>Voxel volume size <span class="unit">m</span></label>
|
||||
<div class="tuple">
|
||||
<div><input type="number" class="x" id="property-voxel-volume-size-x"><label for="property-voxel-volume-size-x">X:</label></div>
|
||||
<div><input type="number" class="y" id="property-voxel-volume-size-y"><label for="property-voxel-volume-size-y">Y:</label></div>
|
||||
|
|
@ -1378,21 +1441,13 @@
|
|||
<label for="property-z-texture-url">Z-axis texture URL</label>
|
||||
<input type="text" id="property-z-texture-url">
|
||||
</div>
|
||||
<div class="spatial-group property pyr">
|
||||
<label>Rotation</label>
|
||||
<div class="tuple">
|
||||
<div><input type="number" class="pitch" id="property-rot-x" step="0.1"><label for="property-rot-x">Pitch:</label></div>
|
||||
<div><input type="number" class="yaw" id="property-rot-y" step="0.1"><label for="property-rot-y">Yaw:</label></div>
|
||||
<div><input type="number" class="roll" id="property-rot-z" step="0.1"><label for="property-rot-z">Roll:</label></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="section-header physical-group">
|
||||
<label>Physical</label><span>M</span>
|
||||
</div>
|
||||
<div class="physical-group property xyz">
|
||||
<label>Linear velocity</label>
|
||||
<label>Linear velocity <span class="unit">m/s</span></label>
|
||||
<div class="tuple">
|
||||
<div><input type="number" class="x" id="property-lvel-x"><label for="property-lvel-x">X:</label></div>
|
||||
<div><input type="number" class="y" id="property-lvel-y"><label for="property-lvel-y">Y:</label></div>
|
||||
|
|
@ -1403,8 +1458,9 @@
|
|||
<label>Linear damping</label>
|
||||
<input type="number" id="property-ldamping">
|
||||
</div>
|
||||
<hr class="physical-group" />
|
||||
<div class="physical-group property pyr">
|
||||
<label>Angular velocity</label>
|
||||
<label>Angular velocity <span class="unit">deg/s</span></label>
|
||||
<div class="tuple">
|
||||
<div><input type="number" class="pitch" id="property-avel-x"><label for="property-avel-x">Pitch:</label></div>
|
||||
<div><input type="number" class="yaw" id="property-avel-y"><label for="property-avel-y">Yaw:</label></div>
|
||||
|
|
@ -1415,6 +1471,7 @@
|
|||
<label>Angular damping</label>
|
||||
<input type="number" id="property-adamping">
|
||||
</div>
|
||||
<hr class="physical-group" />
|
||||
<div class="physical-group property gen">
|
||||
<div class="tuple">
|
||||
<div><label>Restitution</label><input type="number" id="property-restitution"></div>
|
||||
|
|
@ -1422,8 +1479,9 @@
|
|||
<div><label>Density</label><input type="number" id="property-density"></div>
|
||||
</div>
|
||||
</div>
|
||||
<hr class="physical-group" />
|
||||
<div class="physical-group property xyz">
|
||||
<label>Gravity</label>
|
||||
<label>Gravity <span class="unit">m/s<sup>2</sup></span></label>
|
||||
<div class="tuple">
|
||||
<div><input type="number" class="x" id="property-grav-x"><label for="property-grav-x">X:</label></div>
|
||||
<div><input type="number" class="y" id="property-grav-y"><label for="property-grav-y">Y:</label></div>
|
||||
|
|
@ -1431,14 +1489,15 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="physical-group property xyz">
|
||||
<label>Acceleration</label>
|
||||
<label>Acceleration <span class="unit">m/s<sup>2</sup></span></label>
|
||||
<div class="tuple">
|
||||
<div><input type="number" class="x" id="property-lacc-x"><label for="property-lacc-x">X:</label></div>
|
||||
<div><input type="number" class="y" id="property-lacc-y"><label for="property-lacc-y">Y:</label></div>
|
||||
<div><input type="number" class="z" id="property-lacc-z"><label for="property-lacc-z">Z:</label></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="color-section" class="physical-group property rgb">
|
||||
<hr class="physical-group color-section" />
|
||||
<div class="physical-group color-section property rgb">
|
||||
<div id="property-color" class="color-picker"></div>
|
||||
<label>Entity color</label>
|
||||
<div class="tuple">
|
||||
|
|
@ -1461,64 +1520,72 @@
|
|||
<label for="property-dynamic">Dynamic</label>
|
||||
</div>
|
||||
|
||||
<div class="behavior-group sub-section-header">
|
||||
<span>Collides With</span>
|
||||
</div>
|
||||
<div class="behavior-group checkbox-sub-props">
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-collide-static">
|
||||
<label for="property-collide-static">Static entities</label>
|
||||
<div class="behavior-group two-column">
|
||||
<div class="column">
|
||||
<div class="sub-section-header">
|
||||
<span>Collides With</span>
|
||||
</div>
|
||||
<div class="checkbox-sub-props">
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-collide-static">
|
||||
<label for="property-collide-static">Static entities</label>
|
||||
</div>
|
||||
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-collide-dynamic">
|
||||
<label for="property-collide-dynamic">Dynamic entities</label>
|
||||
</div>
|
||||
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-collide-kinematic">
|
||||
<label for="property-collide-kinematic">Kinematic entities</label>
|
||||
</div>
|
||||
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-collide-myAvatar">
|
||||
<label for="property-collide-myAvatar">My avatar</label>
|
||||
</div>
|
||||
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-collide-otherAvatar">
|
||||
<label for="property-collide-otherAvatar">Other avatars</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<div class="sub-section-header">
|
||||
<span>Grabbing</span>
|
||||
</div>
|
||||
<div class="checkbox-sub-props">
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-grabbable">
|
||||
<label for="property-grabbable">Grabbable</label>
|
||||
</div>
|
||||
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-wants-trigger">
|
||||
<label for="property-wants-trigger">Triggerable</label>
|
||||
</div>
|
||||
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-ignore-ik">
|
||||
<label for="property-ignore-ik">Ignore inverse kinematics</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-collide-dynamic">
|
||||
<label for="property-collide-dynamic">Dynamic entities</label>
|
||||
</div>
|
||||
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-collide-kinematic">
|
||||
<label for="property-collide-kinematic">Kinematic entities</label>
|
||||
</div>
|
||||
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-collide-myAvatar">
|
||||
<label for="property-collide-myAvatar">My avatar</label>
|
||||
</div>
|
||||
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-collide-otherAvatar">
|
||||
<label for="property-collide-otherAvatar">Other avatars</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="behavior-group sub-section-header">
|
||||
<span>Grabbing</span>
|
||||
</div>
|
||||
<div class="behavior-group checkbox-sub-props">
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-grabbable">
|
||||
<label for="property-grabbable">Grabbable</label>
|
||||
</div>
|
||||
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-wants-trigger">
|
||||
<label for="property-wants-trigger">Triggerable</label>
|
||||
</div>
|
||||
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-ignore-ik">
|
||||
<label for="property-ignore-ik">Ignore inverse kinematics</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="behavior-group" />
|
||||
<div class="behavior-group property url ">
|
||||
<label for="property-collision-sound-url">Collision sound URL</label>
|
||||
<input type="text" id="property-collision-sound-url">
|
||||
</div>
|
||||
<div class="behavior-group property number">
|
||||
<label>Lifetime</label>
|
||||
<label>Lifetime <span class="unit">s</span></label>
|
||||
<input type="number" id="property-lifetime">
|
||||
</div>
|
||||
<hr class="behavior-group" />
|
||||
<div class="behavior-group property url ">
|
||||
<!--
|
||||
FIXME: If reload buttons at the end of each URL continue to work OK during beta, this reload button and associated
|
||||
|
|
@ -1551,33 +1618,47 @@
|
|||
<label for="property-compound-shape-url">Compound shape URL</label>
|
||||
<input type="text" id="property-compound-shape-url">
|
||||
</div>
|
||||
<hr class="model-group model-section" />
|
||||
<div class="model-group model-section property url ">
|
||||
<label for="property-model-animation-url">Animation URL</label>
|
||||
<input type="text" id="property-model-animation-url">
|
||||
</div>
|
||||
<div class="model-group model-section property checkbox">
|
||||
<input type="checkbox" id="property-model-animation-playing">
|
||||
<label for="property-model-animation-playing">Animation playing</label>
|
||||
</div>
|
||||
<div class="model-group model-section property number">
|
||||
<label>Animation FPS</label>
|
||||
<input type="number" id="property-model-animation-fps">
|
||||
</div>
|
||||
<div class="model-group model-section property number">
|
||||
<div class="tuple">
|
||||
<div><label>Animation frame</label><input type="number" id="property-model-animation-frame"></div>
|
||||
<div><label>First frame</label><input type="number" id="property-model-animation-first-frame"></div>
|
||||
<div><label>Last frame</label><input type="number" id="property-model-animation-last-frame"></div>
|
||||
|
||||
<div class="model-group model-section two-column">
|
||||
<div class="column">
|
||||
<div class="property checkbox">
|
||||
<input type="checkbox" id="property-model-animation-playing">
|
||||
<label for="property-model-animation-playing">Animation playing</label>
|
||||
</div>
|
||||
<div class="property checkbox indent">
|
||||
<input type="checkbox" id="property-model-animation-loop">
|
||||
<label for="property-model-animation-loop">Animation loop</label>
|
||||
</div>
|
||||
<div class="property checkbox indent">
|
||||
<input type="checkbox" id="property-model-animation-hold">
|
||||
<label for="property-model-animation-hold">Animation hold</label>
|
||||
</div>
|
||||
<div id="animation-fps" class="property number">
|
||||
<label>Animation FPS</label>
|
||||
<input type="number" id="property-model-animation-fps">
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<div class="property number">
|
||||
<label>Animation frame</label>
|
||||
<input type="number" id="property-model-animation-frame">
|
||||
</div>
|
||||
<div class="property number">
|
||||
<label>First frame</label>
|
||||
<input type="number" id="property-model-animation-first-frame">
|
||||
</div>
|
||||
<div class="property number">
|
||||
<label>Last frame</label>
|
||||
<input type="number" id="property-model-animation-last-frame">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="model-group model-section property checkbox">
|
||||
<input type="checkbox" id="property-model-animation-loop">
|
||||
<label for="property-model-animation-loop">Animation loop</label>
|
||||
</div>
|
||||
<div class="model-group model-section property checkbox">
|
||||
<input type="checkbox" id="property-model-animation-hold">
|
||||
<label for="property-model-animation-hold">Animation hold</label>
|
||||
</div>
|
||||
<hr class="model-group model-section" />
|
||||
<div class="model-group model-section property textarea">
|
||||
<label for="property-model-textures">Textures</label>
|
||||
<textarea id="property-model-textures"></textarea>
|
||||
|
|
@ -1596,7 +1677,7 @@
|
|||
<input type="text" id="property-text-text">
|
||||
</div>
|
||||
<div class="text-group text-section property number">
|
||||
<label>Line height</label>
|
||||
<label>Line height <span class="unit">m</span></label>
|
||||
<input type="number" id="property-text-line-height" min="0" step="0.005">
|
||||
</div>
|
||||
<div class="text-group text-section property rgb">
|
||||
|
|
@ -1645,8 +1726,8 @@
|
|||
</div>
|
||||
<div class="zone-group zone-section keylight-section property gen">
|
||||
<div class="tuple">
|
||||
<div><label>Light altitude</label><input type="number" id="property-zone-key-light-direction-x"></div>
|
||||
<div><label>Light azimuth</label><input type="number" id="property-zone-key-light-direction-y"></div>
|
||||
<div><label>Light altitude <span class="unit">deg</span></label><input type="number" id="property-zone-key-light-direction-x"></div>
|
||||
<div><label>Light azimuth <span class="unit">deg</span></label><input type="number" id="property-zone-key-light-direction-y"></div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1664,9 +1745,9 @@
|
|||
</div>
|
||||
<div class="zone-group zone-section stage-section property gen">
|
||||
<div class="tuple">
|
||||
<div><label>Stage latitude</label><input type="number" id="property-zone-stage-latitude" min="-90" max="90" step="1"></div>
|
||||
<div><label>Stage longitude</label><input type="number" id="property-zone-stage-longitude" min="-180" max="180" step="1"></div>
|
||||
<div><label>Stage altitude</label><input type="number" id="property-zone-stage-altitude" step="1"></div>
|
||||
<div><label>Latitude <span class="unit">deg</span></label><input type="number" id="property-zone-stage-latitude" min="-90" max="90" step="1"></div>
|
||||
<div><label>Longitude <span class="unit">deg</span></label><input type="number" id="property-zone-stage-longitude" min="-180" max="180" step="1"></div>
|
||||
<div><label>Altitude <span class="unit">m</span></label><input type="number" id="property-zone-stage-altitude" step="1"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="zone-group zone-section stage-section property checkbox">
|
||||
|
|
@ -1676,8 +1757,8 @@
|
|||
|
||||
<div class="zone-group zone-section stage-section property gen">
|
||||
<div class="tuple">
|
||||
<div><label>Stage day of year</label><input type="number" id="property-zone-stage-day" min="0" max="365" step="1"></div>
|
||||
<div><label>Stage hour</label><input type="number" id="property-zone-stage-hour" min="0" max="24" step="0.5"></div>
|
||||
<div><label>Day of year</label><input type="number" id="property-zone-stage-day" min="0" max="365" step="1"></div>
|
||||
<div><label>Hour</label><input type="number" id="property-zone-stage-hour" min="0" max="24" step="0.5"></div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1735,7 +1816,7 @@
|
|||
<div class="light-group light-section property gen">
|
||||
<div class="tuple">
|
||||
<div><label>Intensity</label><input type="number" id="property-light-intensity" min="0" step="0.1"></div>
|
||||
<div><label>Fall-off radius</label><input type="number" id="property-light-falloff-radius" min="0" step="0.1"></div>
|
||||
<div><label>Fall-off radius <span class="unit">m</span></label><input type="number" id="property-light-falloff-radius" min="0" step="0.1"></div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -11,21 +11,15 @@
|
|||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" type="text/css" href="edit-style.css">
|
||||
<link rel="stylesheet" type="text/css" href="css/colpick.css">
|
||||
<script src="jquery-2.1.4.min.js"></script>
|
||||
<script src="colpick.js"></script>
|
||||
<script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
|
||||
<script type="text/javascript" src="eventBridgeLoader.js"></script>
|
||||
<script type="text/javascript" src="spinButtons.js"></script>
|
||||
<script>
|
||||
function loaded() {
|
||||
openEventBridge(function() {
|
||||
var gridColor = { red: 0, green: 0, blue: 0 };
|
||||
var gridColors = [
|
||||
{ red: 0, green: 0, blue: 0 },
|
||||
{ red: 255, green: 255, blue: 255 },
|
||||
{ red: 255, green: 0, blue: 0 },
|
||||
{ red: 0, green: 255, blue: 0},
|
||||
{ red: 0, green: 0, blue: 255 },
|
||||
];
|
||||
var gridColorIndex = 0;
|
||||
|
||||
elPosY = document.getElementById("horiz-y");
|
||||
elMinorSpacing = document.getElementById("minor-spacing");
|
||||
elMajorSpacing = document.getElementById("major-spacing");
|
||||
|
|
@ -37,12 +31,12 @@
|
|||
if (window.EventBridge !== undefined) {
|
||||
EventBridge.scriptEventReceived.connect(function(data) {
|
||||
data = JSON.parse(data);
|
||||
|
||||
|
||||
if (data.origin) {
|
||||
var origin = data.origin;
|
||||
elPosY.value = origin.y.toFixed(2);
|
||||
elPosY.value = origin.y;
|
||||
}
|
||||
|
||||
|
||||
if (data.minorGridEvery !== undefined) {
|
||||
elMinorSpacing.value = data.minorGridEvery;
|
||||
}
|
||||
|
|
@ -73,7 +67,6 @@
|
|||
minorGridEvery: elMinorSpacing.value,
|
||||
majorGridEvery: elMajorSpacing.value,
|
||||
gridColor: gridColor,
|
||||
colorIndex: gridColorIndex,
|
||||
snapToGrid: elSnapToGrid.checked,
|
||||
visible: elHorizontalGridVisible.checked,
|
||||
}));
|
||||
|
|
@ -100,23 +93,52 @@
|
|||
}));
|
||||
});
|
||||
|
||||
var gridColorBox = document.getElementById('grid-color');
|
||||
|
||||
for (var i = 0; i < gridColors.length; i++) {
|
||||
var colors = gridColors[i];
|
||||
var box = document.createElement('div');
|
||||
box.setAttribute('class', 'color-box');
|
||||
box.style.background = 'rgb(' + colors.red + ', ' + colors.green + ', ' + colors.blue + ')';
|
||||
document.getElementById("grid-colors").appendChild(box);
|
||||
box.addEventListener("click", function(color, index) {
|
||||
return function() {
|
||||
gridColor = color;
|
||||
gridColorIndex = index;
|
||||
emitUpdate();
|
||||
}
|
||||
}({ red: colors.red, green: colors.green, blue: colors.blue }, i));
|
||||
var gridColor = { red: 255, green: 255, blue: 255 };
|
||||
var elColor = document.getElementById("grid-color");
|
||||
var elColorRed = document.getElementById("grid-color-red");
|
||||
var elColorGreen = document.getElementById("grid-color-green");
|
||||
var elColorBlue = document.getElementById("grid-color-blue");
|
||||
elColor.style.backgroundColor = "rgb(" + gridColor.red + "," + gridColor.green + "," + gridColor.blue + ")";
|
||||
elColorRed.value = gridColor.red;
|
||||
elColorGreen.value = gridColor.green;
|
||||
elColorBlue.value = gridColor.blue;
|
||||
|
||||
var colorChangeFunction = function () {
|
||||
gridColor = { red: elColorRed.value, green: elColorGreen.value, blue: elColorBlue.value };
|
||||
elColor.style.backgroundColor = "rgb(" + gridColor.red + "," + gridColor.green + "," + gridColor.blue + ")";
|
||||
emitUpdate();
|
||||
};
|
||||
|
||||
var colorPickFunction = function (red, green, blue) {
|
||||
elColorRed.value = red;
|
||||
elColorGreen.value = green;
|
||||
elColorBlue.value = blue;
|
||||
gridColor = { red: red, green: green, blue: blue };
|
||||
emitUpdate();
|
||||
}
|
||||
|
||||
|
||||
elColorRed.addEventListener('change', colorChangeFunction);
|
||||
elColorGreen.addEventListener('change', colorChangeFunction);
|
||||
elColorBlue.addEventListener('change', colorChangeFunction);
|
||||
$('#grid-color').colpick({
|
||||
colorScheme: 'dark',
|
||||
layout: 'hex',
|
||||
color: { r: gridColor.red, g: gridColor.green, b: gridColor.blue },
|
||||
onShow: function (colpick) {
|
||||
$('#grid-color').attr('active', 'true');
|
||||
},
|
||||
onHide: function (colpick) {
|
||||
$('#grid-color').attr('active', 'false');
|
||||
},
|
||||
onSubmit: function (hsb, hex, rgb, el) {
|
||||
$(el).css('background-color', '#' + hex);
|
||||
$(el).colpickHide();
|
||||
colorPickFunction(rgb.r, rgb.g, rgb.b);
|
||||
}
|
||||
});
|
||||
|
||||
augmentSpinButtons();
|
||||
|
||||
EventBridge.emitWebEvent(JSON.stringify({ type: 'init' }));
|
||||
});
|
||||
|
||||
|
|
@ -146,29 +168,28 @@
|
|||
|
||||
<div class="property">
|
||||
<div class="number">
|
||||
<label>Major grid size</label>
|
||||
<span>
|
||||
<input type="number" id="major-spacing" min="1" step="1" /><span class="unit">m</span>
|
||||
</span>
|
||||
<label for="major-spacing">Major grid size <span class="unit">m</span></label>
|
||||
<input type="number" id="major-spacing" min="1" step="1" />
|
||||
</div>
|
||||
<div class="number">
|
||||
<label>Minor grid size</label>
|
||||
<span>
|
||||
<input type="number" id="minor-spacing" min="0.2" step="0.2" /><span class="unit">m</span>
|
||||
</span>
|
||||
<label for="minor-spacing">Minor grid size <span class="unit">m</span></label>
|
||||
<input type="number" id="minor-spacing" min="0.2" step="0.2" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="property number">
|
||||
<label>Position (Y axis)</label>
|
||||
<span>
|
||||
<input type="number" id="horiz-y" step="0.1" /><span class="unit">m</span>
|
||||
</span>
|
||||
<label for="horiz-y">Position (Y axis) <span class="unit">m</span></label>
|
||||
<input type="number" id="horiz-y" step="0.1" />
|
||||
</div>
|
||||
|
||||
<div class="property color-set">
|
||||
<div class="property rgb">
|
||||
<div id="grid-color" class="color-picker"></div>
|
||||
<label>Grid line color</label>
|
||||
<span id="grid-colors"></span>
|
||||
<div class="tuple">
|
||||
<div><input type="number" class="red" id="grid-color-red"><label for="grid-color-red">Red:</label></div>
|
||||
<div><input type="number" class="green" id="grid-color-green"><label for="grid-color-green">Green:</label></div>
|
||||
<div><input type="number" class="blue" id="grid-color-blue"><label for="grid-color-blue">Blue:</label></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="property">
|
||||
|
|
|
|||
51
examples/html/spinButtons.js
Normal file
51
examples/html/spinButtons.js
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
//
|
||||
// spinButtons.js
|
||||
//
|
||||
// Created by David Rowe on 20 Apr 2016
|
||||
// Copyright 2016 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
|
||||
//
|
||||
|
||||
function hoverSpinButtons(event) {
|
||||
var input = event.target,
|
||||
x = event.offsetX,
|
||||
y = event.offsetY,
|
||||
width = input.offsetWidth,
|
||||
height = input.offsetHeight,
|
||||
SPIN_WIDTH = 11,
|
||||
SPIN_MARGIN = 2,
|
||||
maxX = width - SPIN_MARGIN,
|
||||
minX = maxX - SPIN_WIDTH;
|
||||
|
||||
if (minX <= x && x <= maxX) {
|
||||
if (y < height / 2) {
|
||||
input.classList.remove("hover-down");
|
||||
input.classList.add("hover-up");
|
||||
} else {
|
||||
input.classList.remove("hover-up");
|
||||
input.classList.add("hover-down");
|
||||
}
|
||||
} else {
|
||||
input.classList.remove("hover-up");
|
||||
input.classList.remove("hover-down");
|
||||
}
|
||||
}
|
||||
|
||||
function unhoverSpinButtons(event) {
|
||||
event.target.classList.remove("hover-up");
|
||||
event.target.classList.remove("hover-down");
|
||||
}
|
||||
|
||||
function augmentSpinButtons() {
|
||||
var inputs, i, length;
|
||||
|
||||
inputs = document.getElementsByTagName("INPUT");
|
||||
for (i = 0, length = inputs.length; i < length; i += 1) {
|
||||
if (inputs[i].type === "number") {
|
||||
inputs[i].addEventListener("mousemove", hoverSpinButtons);
|
||||
inputs[i].addEventListener("mouseout", unhoverSpinButtons);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -59,6 +59,8 @@ EntityListTool = function(opts) {
|
|||
name: properties.name,
|
||||
type: properties.type,
|
||||
url: properties.type == "Model" ? properties.modelURL : "",
|
||||
locked: properties.locked,
|
||||
visible: properties.visible
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -99,6 +101,10 @@ EntityListTool = function(opts) {
|
|||
}
|
||||
} else if (data.type == "delete") {
|
||||
deleteSelectedEntities();
|
||||
} else if (data.type == "toggleLocked") {
|
||||
toggleSelectedEntitiesLocked();
|
||||
} else if (data.type == "toggleVisible") {
|
||||
toggleSelectedEntitiesVisible();
|
||||
} else if (data.type === "radius") {
|
||||
searchRadius = data.radius;
|
||||
that.sendUpdate();
|
||||
|
|
|
|||
|
|
@ -3,14 +3,7 @@ var GRID_CONTROLS_HTML_URL = Script.resolvePath('../html/gridControls.html');
|
|||
Grid = function(opts) {
|
||||
var that = {};
|
||||
|
||||
var colors = [
|
||||
{ red: 0, green: 0, blue: 0 },
|
||||
{ red: 255, green: 255, blue: 255 },
|
||||
{ red: 255, green: 0, blue: 0 },
|
||||
{ red: 0, green: 255, blue: 0 },
|
||||
{ red: 0, green: 0, blue: 255 },
|
||||
];
|
||||
var colorIndex = 0;
|
||||
var gridColor = { red: 255, green: 255, blue: 255 };
|
||||
var gridAlpha = 0.6;
|
||||
var origin = { x: 0, y: +MyAvatar.getJointPosition('LeftToeBase').y.toFixed(1) + 0.1, z: 0 };
|
||||
var scale = 500;
|
||||
|
|
@ -28,7 +21,7 @@ Grid = function(opts) {
|
|||
position: origin,
|
||||
visible: false,
|
||||
drawInFront: false,
|
||||
color: colors[0],
|
||||
color: gridColor,
|
||||
alpha: gridAlpha,
|
||||
minorGridEvery: minorGridEvery,
|
||||
majorGridEvery: majorGridEvery,
|
||||
|
|
@ -52,12 +45,6 @@ Grid = function(opts) {
|
|||
updateGrid();
|
||||
};
|
||||
|
||||
that.getColorIndex = function() { return colorIndex; };
|
||||
that.setColorIndex = function(value) {
|
||||
colorIndex = value;
|
||||
updateGrid();
|
||||
};
|
||||
|
||||
that.getSnapToGrid = function() { return snapToGrid; };
|
||||
that.setSnapToGrid = function(value) {
|
||||
snapToGrid = value;
|
||||
|
|
@ -175,8 +162,8 @@ Grid = function(opts) {
|
|||
majorGridEvery = data.majorGridEvery;
|
||||
}
|
||||
|
||||
if (data.colorIndex !== undefined) {
|
||||
colorIndex = data.colorIndex;
|
||||
if (data.gridColor !== undefined) {
|
||||
gridColor = data.gridColor;
|
||||
}
|
||||
|
||||
if (data.gridSize) {
|
||||
|
|
@ -196,7 +183,7 @@ Grid = function(opts) {
|
|||
visible: that.visible && that.enabled,
|
||||
minorGridEvery: minorGridEvery,
|
||||
majorGridEvery: majorGridEvery,
|
||||
color: colors[colorIndex],
|
||||
color: gridColor,
|
||||
alpha: gridAlpha,
|
||||
});
|
||||
|
||||
|
|
|
|||
Binary file not shown.
|
|
@ -330,9 +330,10 @@ Window {
|
|||
HifiControls.ContentSection {
|
||||
id: assetDirectory
|
||||
name: "Asset Directory"
|
||||
spacing: hifi.dimensions.contentSpacing.y
|
||||
isFirst: true
|
||||
|
||||
HifiControls.VerticalSpacer {}
|
||||
|
||||
Row {
|
||||
id: buttonRow
|
||||
anchors.left: parent.left
|
||||
|
|
@ -343,8 +344,7 @@ Window {
|
|||
glyph: hifi.glyphs.reload
|
||||
color: hifi.buttons.white
|
||||
colorScheme: root.colorScheme
|
||||
height: 26
|
||||
width: 26
|
||||
width: hifi.dimensions.controlLineHeight
|
||||
|
||||
onClicked: root.reload()
|
||||
}
|
||||
|
|
@ -353,7 +353,6 @@ Window {
|
|||
text: "ADD TO WORLD"
|
||||
color: hifi.buttons.white
|
||||
colorScheme: root.colorScheme
|
||||
height: 26
|
||||
width: 120
|
||||
|
||||
enabled: canAddToWorld(assetProxyModel.data(treeView.selection.currentIndex, 0x100))
|
||||
|
|
@ -365,7 +364,6 @@ Window {
|
|||
text: "RENAME"
|
||||
color: hifi.buttons.white
|
||||
colorScheme: root.colorScheme
|
||||
height: 26
|
||||
width: 80
|
||||
|
||||
onClicked: root.renameFile()
|
||||
|
|
@ -378,7 +376,6 @@ Window {
|
|||
text: "DELETE"
|
||||
color: hifi.buttons.red
|
||||
colorScheme: root.colorScheme
|
||||
height: 26
|
||||
width: 80
|
||||
|
||||
onClicked: root.deleteFile()
|
||||
|
|
@ -419,7 +416,7 @@ Window {
|
|||
id: treeView
|
||||
anchors.top: assetDirectory.bottom
|
||||
anchors.bottom: uploadSection.top
|
||||
anchors.margins: 12
|
||||
anchors.margins: hifi.dimensions.contentMargin.x + 2 // Extra for border
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
|
||||
|
|
@ -448,7 +445,7 @@ Window {
|
|||
name: "Upload A File"
|
||||
spacing: hifi.dimensions.contentSpacing.y
|
||||
anchors.bottom: parent.bottom
|
||||
height: 92
|
||||
height: 95
|
||||
|
||||
Item {
|
||||
height: parent.height
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ Window {
|
|||
title: "Edit"
|
||||
property alias tabView: tabView
|
||||
implicitWidth: 520; implicitHeight: 695
|
||||
minSize: Qt.vector2d(412, 500)
|
||||
minSize: Qt.vector2d(456, 500)
|
||||
|
||||
HifiConstants { id: hifi }
|
||||
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ Original.Button {
|
|||
property int colorScheme: hifi.colorSchemes.light
|
||||
|
||||
width: 120
|
||||
height: 28
|
||||
height: hifi.dimensions.controlLineHeight
|
||||
|
||||
style: ButtonStyle {
|
||||
|
||||
|
|
|
|||
|
|
@ -59,7 +59,7 @@ FocusScope {
|
|||
id: comboBox
|
||||
anchors.fill: parent
|
||||
visible: false
|
||||
height: hifi.fontSizes.textFieldInput + 14 // Match height of TextField control.
|
||||
height: hifi.fontSizes.textFieldInput + 13 // Match height of TextField control.
|
||||
}
|
||||
|
||||
FiraSansSemiBold {
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@ Column {
|
|||
Item {
|
||||
id: leadingSpace
|
||||
width: 1
|
||||
height: isFirst ? hifi.dimensions.contentSpacing.y : 0
|
||||
height: isFirst ? 7 : 0
|
||||
anchors.top: parent.top
|
||||
}
|
||||
|
||||
|
|
@ -80,14 +80,14 @@ Column {
|
|||
right: parent.right
|
||||
top: topBar.bottom
|
||||
}
|
||||
height: (isCollapsible ? 3 : 2) * hifi.dimensions.contentSpacing.y
|
||||
height: isCollapsible ? 36 : 28
|
||||
|
||||
RalewayRegular {
|
||||
id: title
|
||||
anchors {
|
||||
left: parent.left
|
||||
top: parent.top
|
||||
topMargin: hifi.dimensions.contentSpacing.y
|
||||
topMargin: 12
|
||||
}
|
||||
size: hifi.fontSizes.sectionName
|
||||
font.capitalization: Font.AllUppercase
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ SpinBox {
|
|||
FontLoader { id: firaSansSemiBold; source: "../../fonts/FiraSans-SemiBold.ttf"; }
|
||||
font.family: firaSansSemiBold.name
|
||||
font.pixelSize: hifi.fontSizes.textFieldInput
|
||||
height: hifi.fontSizes.textFieldInput + 14 // Match height of TextField control.
|
||||
height: hifi.fontSizes.textFieldInput + 13 // Match height of TextField control.
|
||||
|
||||
y: spinBoxLabel.visible ? spinBoxLabel.height + spinBoxLabel.anchors.bottomMargin : 0
|
||||
|
||||
|
|
@ -51,12 +51,13 @@ SpinBox {
|
|||
horizontalAlignment: Qt.AlignLeft
|
||||
padding.left: spinBoxLabelInside.visible ? 30 : hifi.dimensions.textPadding
|
||||
padding.right: hifi.dimensions.spinnerSize
|
||||
padding.top: 0
|
||||
|
||||
incrementControl: HiFiGlyphs {
|
||||
id: incrementButton
|
||||
text: hifi.glyphs.caratUp
|
||||
x: 6
|
||||
y: 2
|
||||
y: 1
|
||||
size: hifi.dimensions.spinnerSize
|
||||
color: styleData.upPressed ? (isLightColorScheme ? hifi.colors.black : hifi.colors.white) : hifi.colors.gray
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,15 +20,17 @@ TextField {
|
|||
|
||||
property int colorScheme: hifi.colorSchemes.light
|
||||
readonly property bool isLightColorScheme: colorScheme == hifi.colorSchemes.light
|
||||
property bool isSearchField: false
|
||||
property string label: ""
|
||||
property real controlHeight: height + (textFieldLabel.visible ? textFieldLabel.height : 0)
|
||||
property real controlHeight: height + (textFieldLabel.visible ? textFieldLabel.height + 1 : 0)
|
||||
|
||||
placeholderText: textField.placeholderText
|
||||
|
||||
FontLoader { id: firaSansSemiBold; source: "../../fonts/FiraSans-SemiBold.ttf"; }
|
||||
font.family: firaSansSemiBold.name
|
||||
font.pixelSize: hifi.fontSizes.textFieldInput
|
||||
height: implicitHeight + 4 // Make surrounding box higher so that highlight is vertically centered.
|
||||
font.italic: textField.text == ""
|
||||
height: implicitHeight + 3 // Make surrounding box higher so that highlight is vertically centered.
|
||||
|
||||
y: textFieldLabel.visible ? textFieldLabel.height + textFieldLabel.anchors.bottomMargin : 0
|
||||
|
||||
|
|
@ -42,11 +44,22 @@ TextField {
|
|||
: (textField.focus ? hifi.colors.black : hifi.colors.baseGrayShadow)
|
||||
border.color: hifi.colors.primaryHighlight
|
||||
border.width: textField.focus ? 1 : 0
|
||||
radius: isSearchField ? textField.height / 2 : 0
|
||||
|
||||
HiFiGlyphs {
|
||||
text: hifi.glyphs.search
|
||||
color: textColor
|
||||
size: hifi.fontSizes.textFieldSearchIcon
|
||||
anchors.left: parent.left
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.leftMargin: hifi.dimensions.textPadding - 2
|
||||
visible: isSearchField
|
||||
}
|
||||
}
|
||||
placeholderTextColor: hifi.colors.lightGray
|
||||
selectedTextColor: hifi.colors.black
|
||||
selectionColor: hifi.colors.primaryHighlight
|
||||
padding.left: hifi.dimensions.textPadding
|
||||
padding.left: (isSearchField ? textField.height - 2 : 0) + hifi.dimensions.textPadding
|
||||
padding.right: hifi.dimensions.textPadding
|
||||
}
|
||||
|
||||
|
|
@ -56,7 +69,7 @@ TextField {
|
|||
colorScheme: textField.colorScheme
|
||||
anchors.left: parent.left
|
||||
anchors.bottom: parent.top
|
||||
anchors.bottomMargin: 4
|
||||
anchors.bottomMargin: 3
|
||||
visible: label != ""
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -51,7 +51,11 @@ Window {
|
|||
|
||||
Rectangle {
|
||||
id: attachmentsBackground
|
||||
anchors { left: parent.left; right: parent.right; top: parent.top; bottom: newAttachmentButton.top; margins: 8 }
|
||||
anchors {
|
||||
left: parent.left; right: parent.right; top: parent.top; bottom: newAttachmentButton.top;
|
||||
margins: hifi.dimensions.contentMargin.x
|
||||
bottomMargin: hifi.dimensions.contentSpacing.y
|
||||
}
|
||||
color: hifi.colors.baseGrayShadow
|
||||
radius: 4
|
||||
|
||||
|
|
@ -129,7 +133,14 @@ Window {
|
|||
|
||||
HifiControls.Button {
|
||||
id: newAttachmentButton
|
||||
anchors { left: parent.left; right: parent.right; bottom: buttonRow.top; margins: 8 }
|
||||
anchors {
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
bottom: buttonRow.top
|
||||
margins: hifi.dimensions.contentMargin.x;
|
||||
topMargin: hifi.dimensions.contentSpacing.y
|
||||
bottomMargin: hifi.dimensions.contentSpacing.y
|
||||
}
|
||||
text: "New Attachment"
|
||||
color: hifi.buttons.black
|
||||
colorScheme: hifi.colorSchemes.dark
|
||||
|
|
@ -151,7 +162,13 @@ Window {
|
|||
Row {
|
||||
id: buttonRow
|
||||
spacing: 8
|
||||
anchors { right: parent.right; bottom: parent.bottom; margins: 8 }
|
||||
anchors {
|
||||
right: parent.right
|
||||
bottom: parent.bottom
|
||||
margins: hifi.dimensions.contentMargin.x
|
||||
topMargin: hifi.dimensions.contentSpacing.y
|
||||
bottomMargin: hifi.dimensions.contentSpacing.y
|
||||
}
|
||||
HifiControls.Button {
|
||||
action: okAction
|
||||
color: hifi.buttons.black
|
||||
|
|
|
|||
|
|
@ -114,7 +114,9 @@ Window {
|
|||
}
|
||||
}
|
||||
|
||||
HifiControls.VerticalSpacer {}
|
||||
HifiControls.VerticalSpacer {
|
||||
height: hifi.dimensions.controlInterlineHeight + 2 // Add space for border
|
||||
}
|
||||
|
||||
HifiControls.Table {
|
||||
tableModel: runningScriptsModel
|
||||
|
|
@ -125,7 +127,7 @@ Window {
|
|||
}
|
||||
|
||||
HifiControls.VerticalSpacer {
|
||||
height: hifi.dimensions.controlInterlineHeight + 2 // Table view draws a little taller than it's height.
|
||||
height: hifi.dimensions.controlInterlineHeight + 2 // Add space for border
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -180,16 +182,19 @@ Window {
|
|||
|
||||
HifiControls.TextField {
|
||||
id: filterEdit
|
||||
isSearchField: true
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
focus: true
|
||||
colorScheme: hifi.colorSchemes.dark
|
||||
placeholderText: "filter"
|
||||
placeholderText: "Filter"
|
||||
onTextChanged: scriptsModel.filterRegExp = new RegExp("^.*" + text + ".*$", "i")
|
||||
Component.onCompleted: scriptsModel.filterRegExp = new RegExp("^.*$", "i")
|
||||
}
|
||||
|
||||
HifiControls.VerticalSpacer {}
|
||||
HifiControls.VerticalSpacer {
|
||||
height: hifi.dimensions.controlInterlineHeight + 2 // Add space for border
|
||||
}
|
||||
|
||||
HifiControls.Tree {
|
||||
id: treeView
|
||||
|
|
@ -200,7 +205,9 @@ Window {
|
|||
anchors.right: parent.right
|
||||
}
|
||||
|
||||
HifiControls.VerticalSpacer {}
|
||||
HifiControls.VerticalSpacer {
|
||||
height: hifi.dimensions.controlInterlineHeight + 2 // Add space for border
|
||||
}
|
||||
|
||||
HifiControls.TextField {
|
||||
id: selectedScript
|
||||
|
|
|
|||
|
|
@ -131,8 +131,8 @@ Item {
|
|||
readonly property bool largeScreen: Screen.width >= 1920 && Screen.height >= 1080
|
||||
readonly property real borderRadius: largeScreen ? 7.5 : 5.0
|
||||
readonly property real borderWidth: largeScreen ? 2 : 1
|
||||
readonly property vector2d contentMargin: Qt.vector2d(12, 24)
|
||||
readonly property vector2d contentSpacing: Qt.vector2d(8, 12)
|
||||
readonly property vector2d contentMargin: Qt.vector2d(21, 21)
|
||||
readonly property vector2d contentSpacing: Qt.vector2d(11, 14)
|
||||
readonly property real labelPadding: 40
|
||||
readonly property real textPadding: 8
|
||||
readonly property real sliderHandleSize: 18
|
||||
|
|
@ -143,8 +143,8 @@ Item {
|
|||
readonly property real tableHeaderHeight: 40
|
||||
readonly property vector2d modalDialogMargin: Qt.vector2d(50, 30)
|
||||
readonly property real modalDialogTitleHeight: 40
|
||||
readonly property real controlLineHeight: 29 // Height of spinbox control on 1920 x 1080 monitor
|
||||
readonly property real controlInterlineHeight: 22 // 75% of controlLineHeight
|
||||
readonly property real controlLineHeight: 28 // Height of spinbox control on 1920 x 1080 monitor
|
||||
readonly property real controlInterlineHeight: 21 // 75% of controlLineHeight
|
||||
readonly property vector2d menuPadding: Qt.vector2d(14, 12)
|
||||
}
|
||||
|
||||
|
|
@ -156,6 +156,7 @@ Item {
|
|||
readonly property real inputLabel: dimensions.largeScreen ? 14 : 10
|
||||
readonly property real textFieldInput: dimensions.largeScreen ? 15 : 12
|
||||
readonly property real textFieldInputLabel: dimensions.largeScreen ? 13 : 9
|
||||
readonly property real textFieldSearchIcon: dimensions.largeScreen ? 30 : 24
|
||||
readonly property real tableText: dimensions.largeScreen ? 15 : 12
|
||||
readonly property real buttonLabel: dimensions.largeScreen ? 13 : 9
|
||||
readonly property real iconButton: dimensions.largeScreen ? 13 : 9
|
||||
|
|
|
|||
|
|
@ -215,7 +215,7 @@ Fadable {
|
|||
bottom: parent.bottom
|
||||
}
|
||||
width: parent.contentWidth
|
||||
height: footer.height + 2 * hifi.dimensions.contentSpacing.y
|
||||
height: footer.height + 2 * hifi.dimensions.contentSpacing.y + 3
|
||||
color: hifi.colors.baseGray
|
||||
visible: footer.height > 0
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue