From 55ff5a92bfe2a7409026e69810e6b549a377acc6 Mon Sep 17 00:00:00 2001 From: Kasen IO Date: Thu, 16 Apr 2020 02:17:21 -0400 Subject: [PATCH] Further conversion state, functions not fully transferred/synced. --- scripts/system/inventory/package-lock.json | 5 + scripts/system/inventory/package.json | 3 +- scripts/system/inventory/public/inventory.js | 2 +- scripts/system/inventory/src/App.vue | 348 +++++++++++++++--- .../inventory/src/components/ItemIterator.vue | 331 +++++++++++++++++ .../system/inventory/src/components/Root.vue | 286 -------------- scripts/system/inventory/src/main.js | 2 + scripts/system/inventory/src/plugins/store.js | 70 ++++ 8 files changed, 699 insertions(+), 348 deletions(-) create mode 100644 scripts/system/inventory/src/components/ItemIterator.vue delete mode 100644 scripts/system/inventory/src/components/Root.vue create mode 100644 scripts/system/inventory/src/plugins/store.js diff --git a/scripts/system/inventory/package-lock.json b/scripts/system/inventory/package-lock.json index 504255ad26..56278096ed 100644 --- a/scripts/system/inventory/package-lock.json +++ b/scripts/system/inventory/package-lock.json @@ -11301,6 +11301,11 @@ "loader-utils": "^1.2.0" } }, + "vuex": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/vuex/-/vuex-3.1.3.tgz", + "integrity": "sha512-k8vZqNMSNMgKelVZAPYw5MNb2xWSmVgCKtYKAptvm9YtZiOXnRXFWu//Y9zQNORTrm3dNj1n/WaZZI26tIX6Mw==" + }, "watchpack": { "version": "1.6.1", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.6.1.tgz", diff --git a/scripts/system/inventory/package.json b/scripts/system/inventory/package.json index e0dd3d2b12..dfc4806f5b 100644 --- a/scripts/system/inventory/package.json +++ b/scripts/system/inventory/package.json @@ -11,7 +11,8 @@ "core-js": "^3.6.4", "vue": "^2.6.11", "vuedraggable": "^2.23.2", - "vuetify": "^2.2.11" + "vuetify": "^2.2.11", + "vuex": "^3.1.3" }, "devDependencies": { "@vue/cli-plugin-babel": "~4.3.0", diff --git a/scripts/system/inventory/public/inventory.js b/scripts/system/inventory/public/inventory.js index 3e877ec309..336d92e705 100644 --- a/scripts/system/inventory/public/inventory.js +++ b/scripts/system/inventory/public/inventory.js @@ -2,7 +2,7 @@ // inventory.js // // Created by kasenvr@gmail.com on 2 Apr 2020 -// Copyright 2020 Vircadia Contributors +// Copyright 2020 Vircadia and contributors. // // Distributed under the Apache License, Version 2.0. // See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html diff --git a/scripts/system/inventory/src/App.vue b/scripts/system/inventory/src/App.vue index ee47cca917..dee109f9e0 100644 --- a/scripts/system/inventory/src/App.vue +++ b/scripts/system/inventory/src/App.vue @@ -3,7 +3,7 @@ // App.vue // // Created by kasenvr@gmail.com on 7 Apr 2020 -// Copyright 2020 Vircadia Contributors +// Copyright 2020 Vircadia and contributors. // // Distributed under the Apache License, Version 2.0. // See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html @@ -75,7 +75,270 @@ - + + + @@ -165,7 +428,7 @@ > ({ items: [ @@ -751,40 +1014,6 @@ export default { "uuid": "542543sg45s4gg54353", }, ], - iconType: { - "SCRIPT": { - "icon": "mdi-code-tags", - "color": "red", - }, - "MODEL": { - "icon": "mdi-video-3d", - "color": "green", - }, - "AVATAR": { - "icon": "mdi-account-convert", - "color": "purple", - }, - "PLACE": { - "icon": "mdi-earth", - "color": "#0097A7", // cyan darken-2 - }, - "JSON": { - "icon": "mdi-inbox-multiple", - "color": "#37474F", // blue-grey darken-3 - }, - "UNKNOWN": { - "icon": "mdi-help", - "color": "grey", - } - }, - supportedItemTypes: [ - "SCRIPT", - "MODEL", - "AVATAR", - "PLACE", - "JSON", - "UNKNOWN", - ], removeDialog: { show: false, uuid: null, @@ -877,6 +1106,7 @@ export default { appVersion: "1.2.1", darkTheme: true, drawer: false, + disabledProp: true, }), created: function () { vue_this = this; @@ -971,7 +1201,7 @@ export default { var detectedItemType = null; itemType = itemType.toUpperCase(); - this.supportedItemTypes.forEach(function(itemTypeInList) { + this.$store.state.supportedItemTypes.forEach(function (itemTypeInList) { if (itemTypeInList == itemType) { detectedItemType = itemTypeInList; } @@ -1274,7 +1504,7 @@ export default { } }, sendSettings: function() { - this.sendAppMessage("web-to-script-settings", this.settings ); + this.sendAppMessage("web-to-script-settings", this.$store.state.settings ); }, receiveSettings: function(receivedSettings) { if (!receivedSettings) { @@ -1287,10 +1517,10 @@ export default { itemType = itemType.toUpperCase(); var returnedItemIcon; - if (this.iconType[itemType]) { - returnedItemIcon = this.iconType[itemType].icon; + if (this.$store.state.iconType[itemType]) { + returnedItemIcon = this.$store.state.iconType[itemType].icon; } else { - returnedItemIcon = this.iconType.UNKNOWN.icon; + returnedItemIcon = this.$store.state.iconType.UNKNOWN.icon; } return returnedItemIcon; @@ -1299,10 +1529,10 @@ export default { itemType = itemType.toUpperCase(); var returnedItemIconColor; - if (this.iconType[itemType]) { - returnedItemIconColor = this.iconType[itemType].color; + if (this.$store.state.iconType[itemType]) { + returnedItemIconColor = this.$store.state.iconType[itemType].color; } else { - returnedItemIconColor = this.iconType.UNKNOWN.color; + returnedItemIconColor = this.$store.state.iconType.UNKNOWN.color; } return returnedItemIconColor; @@ -1328,6 +1558,9 @@ export default { // alert(JSON.stringify(JSONtoSend)); } }, + }, + computed: { + }, watch: { // Whenever the item list changes, this will notice and then send it to the script to be saved. @@ -1339,20 +1572,15 @@ export default { }, // Whenever the settings change, we want to save that state. settings: { deep: true, - handler() { + handler: function(newVal) { + this.$store.commit('mutate', { + property: 'settings', + with: newVal + }); this.sendSettings(); } - } + }, }, - computed: { - options : function (){ - return { - name: 'column-item', - pull: true, - put: true - } - } - } }; diff --git a/scripts/system/inventory/src/components/ItemIterator.vue b/scripts/system/inventory/src/components/ItemIterator.vue new file mode 100644 index 0000000000..4608f08825 --- /dev/null +++ b/scripts/system/inventory/src/components/ItemIterator.vue @@ -0,0 +1,331 @@ + + + + + + \ No newline at end of file diff --git a/scripts/system/inventory/src/components/Root.vue b/scripts/system/inventory/src/components/Root.vue deleted file mode 100644 index ea3b96d5b7..0000000000 --- a/scripts/system/inventory/src/components/Root.vue +++ /dev/null @@ -1,286 +0,0 @@ - - - - - - \ No newline at end of file diff --git a/scripts/system/inventory/src/main.js b/scripts/system/inventory/src/main.js index a21e528394..343617ff6d 100644 --- a/scripts/system/inventory/src/main.js +++ b/scripts/system/inventory/src/main.js @@ -1,10 +1,12 @@ import Vue from 'vue' import App from './App.vue' import vuetify from './plugins/vuetify'; +import { store } from './plugins/store'; Vue.config.productionTip = false new Vue({ vuetify, + store, render: h => h(App) }).$mount('#app') diff --git a/scripts/system/inventory/src/plugins/store.js b/scripts/system/inventory/src/plugins/store.js new file mode 100644 index 0000000000..a87d752588 --- /dev/null +++ b/scripts/system/inventory/src/plugins/store.js @@ -0,0 +1,70 @@ +/* + store.js + + Created by Kalila L. on 16 Apr 2020. + Copyright 2020 Vircadia and contributors. + + Distributed under the Apache License, Version 2.0. + See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html +*/ + +import Vue from 'vue'; +import Vuex from 'vuex'; + +Vue.use(Vuex); + +export const store = new Vuex.Store({ + devtools: true, + state: { + settings: { + "displayDensity": { + "size": 1, + "labels": [ + "List", + "Compact", + "Large", + ], + }, + }, + iconType: { + "SCRIPT": { + "icon": "mdi-code-tags", + "color": "red", + }, + "MODEL": { + "icon": "mdi-video-3d", + "color": "green", + }, + "AVATAR": { + "icon": "mdi-account-convert", + "color": "purple", + }, + "PLACE": { + "icon": "mdi-earth", + "color": "#0097A7", // cyan darken-2 + }, + "JSON": { + "icon": "mdi-inbox-multiple", + "color": "#37474F", // blue-grey darken-3 + }, + "UNKNOWN": { + "icon": "mdi-help", + "color": "grey", + } + }, + supportedItemTypes: [ + "SCRIPT", + "MODEL", + "AVATAR", + "PLACE", + "JSON", + "UNKNOWN", + ], + }, + mutations: { + mutate(state, payload) { + state[payload.property] = payload.with; + console.info("Payload:", payload.property, "with:", payload.with, "state is now:", this.state); + } + } +}) \ No newline at end of file