mirror of
https://github.com/overte-org/overte.git
synced 2025-04-16 21:02:17 +02:00
Add compact slider and full settings persistence.
This commit is contained in:
parent
1bea2870f0
commit
30b8497430
2 changed files with 88 additions and 14 deletions
|
@ -40,18 +40,18 @@
|
|||
>
|
||||
<v-list
|
||||
nav
|
||||
class="pt-5"
|
||||
>
|
||||
<v-list-item-group>
|
||||
|
||||
<v-list-item @click="compactToggle = !compactToggle">
|
||||
|
||||
<v-switch
|
||||
@click="compactToggle = !compactToggle"
|
||||
v-model="compactToggle"
|
||||
:label="`Compact`"
|
||||
></v-switch>
|
||||
|
||||
</v-list-item>
|
||||
<v-slider
|
||||
v-model="settings.displayDensity.size"
|
||||
:tick-labels="settings.displayDensity.labels"
|
||||
:max="2"
|
||||
step="1"
|
||||
ticks="always"
|
||||
tick-size="3"
|
||||
></v-slider>
|
||||
|
||||
<v-list-item @click="addDialog.show = true">
|
||||
<v-list-item-icon>
|
||||
|
@ -78,6 +78,7 @@
|
|||
sm="6"
|
||||
md="4"
|
||||
lg="3"
|
||||
class="py-1"
|
||||
>
|
||||
<v-card
|
||||
class="mx-auto"
|
||||
|
@ -87,17 +88,30 @@
|
|||
<v-list-item one-line>
|
||||
|
||||
<v-list-item-content class="pb-1 pt-2">
|
||||
<div class="overline" style="font-size: 0.825rem !important;">{{item.type}}</div>
|
||||
<div v-show="settings.displayDensity.size > 0" class="overline" style="font-size: 0.825rem !important;">{{item.type}}</div>
|
||||
<v-list-item-title class="subtitle-1 mb-1">{{item.name}}</v-list-item-title>
|
||||
<v-list-item-subtitle v-show="!compactToggle">{{item.url}}</v-list-item-subtitle>
|
||||
<v-list-item-subtitle v-show="settings.displayDensity.size == 2">{{item.url}}</v-list-item-subtitle>
|
||||
</v-list-item-content>
|
||||
|
||||
<v-menu bottom left>
|
||||
<template v-slot:activator="{ on }">
|
||||
<!-- settings.displayDensity.size >= 1 -->
|
||||
<v-btn
|
||||
:style="{backgroundColor: (getIconColor(item.type)) }"
|
||||
:style="{backgroundColor: (getIconColor(item.type)) }"
|
||||
v-show="settings.displayDensity.size >= 1"
|
||||
medium
|
||||
fab
|
||||
x-large
|
||||
dark
|
||||
v-on="on"
|
||||
>
|
||||
<v-icon>{{displayIcon(item.type)}}</v-icon>
|
||||
</v-btn>
|
||||
<!-- settings.displayDensity.size < 1 -->
|
||||
<v-btn
|
||||
:style="{backgroundColor: (getIconColor(item.type)) }"
|
||||
v-show="settings.displayDensity.size < 1"
|
||||
small
|
||||
fab
|
||||
dark
|
||||
v-on="on"
|
||||
>
|
||||
|
@ -508,6 +522,11 @@ if (!browserDevelopment()) {
|
|||
// alert("RECEIVING NEARBY USERS:" + JSON.stringify(receivedCommand.data));
|
||||
vue_this.receiveNearbyUsers(receivedCommand.data);
|
||||
}
|
||||
|
||||
if (receivedCommand.command == 'script-to-web-settings') {
|
||||
// alert("RECEIVING SETTINGS:" + JSON.stringify(receivedCommand.data));
|
||||
vue_this.receiveSettings(receivedCommand.data);
|
||||
}
|
||||
|
||||
}
|
||||
});
|
||||
|
@ -635,7 +654,16 @@ new Vue({
|
|||
},
|
||||
],
|
||||
sortBy: "alphabetical",
|
||||
compactToggle: true,
|
||||
settings: {
|
||||
displayDensity: {
|
||||
"size": 1,
|
||||
"labels": [
|
||||
"List",
|
||||
"Compact",
|
||||
"Large",
|
||||
],
|
||||
},
|
||||
},
|
||||
darkTheme: true,
|
||||
drawer: false,
|
||||
}),
|
||||
|
@ -802,6 +830,16 @@ new Vue({
|
|||
this.items = receivedInventory;
|
||||
}
|
||||
},
|
||||
sendSettings: function() {
|
||||
this.sendAppMessage("web-to-script-settings", this.settings );
|
||||
},
|
||||
receiveSettings: function(receivedSettings) {
|
||||
if (!receivedSettings) {
|
||||
// Don't do anything, let the defaults stand. Otherwise, it will break the app.
|
||||
} else {
|
||||
this.settings = receivedSettings;
|
||||
}
|
||||
},
|
||||
displayIcon: function(itemType) {
|
||||
return this.iconType[itemType].icon;
|
||||
},
|
||||
|
@ -836,6 +874,12 @@ new Vue({
|
|||
handler() {
|
||||
this.sendInventory();
|
||||
}
|
||||
}, // Whenever the settings change, we want to save that state.
|
||||
settings: {
|
||||
deep: true,
|
||||
handler() {
|
||||
this.sendSettings();
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
|
|
@ -16,6 +16,9 @@ var tablet = Tablet.getTablet("com.highfidelity.interface.tablet.system");
|
|||
var inventoryDataSettingString = "inventoryApp.data";
|
||||
var inventoryData;
|
||||
|
||||
var inventorySettingsString = "inventoryApp.settings";
|
||||
var inventorySettings;
|
||||
|
||||
// APP EVENT AND MESSAGING ROUTING
|
||||
|
||||
function onWebAppEventReceived(event) {
|
||||
|
@ -31,6 +34,10 @@ function onWebAppEventReceived(event) {
|
|||
receiveInventory(eventJSON.data);
|
||||
}
|
||||
|
||||
if (eventJSON.command == "web-to-script-settings") {
|
||||
receiveSettings(eventJSON.data);
|
||||
}
|
||||
|
||||
if (eventJSON.command == "use-item") {
|
||||
useItem(eventJSON.data);
|
||||
}
|
||||
|
@ -95,6 +102,19 @@ function sendInventory() {
|
|||
|
||||
// END SEND AND RECEIVE INVENTORY STATE
|
||||
|
||||
// SEND AND RECEIVE SETTINGS STATE
|
||||
|
||||
function receiveSettings(receivedSettingsData) {
|
||||
inventorySettings = receivedSettingsData;
|
||||
saveSettings();
|
||||
}
|
||||
|
||||
function sendSettings() {
|
||||
sendToWeb("script-to-web-settings", inventorySettings);
|
||||
}
|
||||
|
||||
// END SEND AND RECEIVE SETTINGS STATE
|
||||
|
||||
function saveInventory() {
|
||||
Settings.setValue(inventoryDataSettingString, inventoryData);
|
||||
}
|
||||
|
@ -103,6 +123,14 @@ function loadInventory() {
|
|||
inventoryData = Settings.getValue(inventoryDataSettingString);
|
||||
}
|
||||
|
||||
function saveSettings() {
|
||||
Settings.setValue(inventorySettingsString, inventorySettings);
|
||||
}
|
||||
|
||||
function loadSettings() {
|
||||
inventorySettings = Settings.getValue(inventorySettingsString);
|
||||
}
|
||||
|
||||
function receivingItem(sender, type, name, url) {
|
||||
var packageRequest = {
|
||||
"sender": sender,
|
||||
|
@ -168,6 +196,7 @@ function shareItem(data) {
|
|||
}
|
||||
|
||||
function initializeInventoryApp() {
|
||||
sendSettings();
|
||||
sendInventory();
|
||||
}
|
||||
|
||||
|
@ -182,6 +211,7 @@ function onClosed() {
|
|||
function startup() {
|
||||
|
||||
loadInventory();
|
||||
loadSettings();
|
||||
|
||||
Messages.messageReceived.connect(onMessageReceived);
|
||||
Messages.subscribe(inventoryMessagesChannel);
|
||||
|
|
Loading…
Reference in a new issue