CreatBot/CreatBotMainsail
11
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: init interface before display panels (#961)

Browse Source
This commit is contained in:
Stefan Dej 2022-07-15 00:24:39 +02:00 committed by GitHub
parent 7536bce10d
commit 1f9d8e86be
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
29 changed files with 350 additions and 248 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@ -21,7 +21,7 @@
<script type="module" src="/src/main.ts"></script> <script type="module" src="/src/main.ts"></script>
</head> </head>
<body> <body style="background-color: #121212">
<noscript> <noscript>
<strong> <strong>
We're sorry but Mainsail doesn't work properly without JavaScript enabled. Please enable it to continue. We're sorry but Mainsail doesn't work properly without JavaScript enabled. Please enable it to continue.

16
package-lock.json generated
View File

@ -1,12 +1,12 @@
{ {
"name": "mainsail", "name": "mainsail",
"version": "2.2.1", "version": "2.3.0-alpha",
"lockfileVersion": 2, "lockfileVersion": 2,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "mainsail", "name": "mainsail",
"version": "2.2.1", "version": "2.3.0-alpha",
"dependencies": { "dependencies": {
"@codemirror/basic-setup": "^0.19.1", "@codemirror/basic-setup": "^0.19.1",
"@codemirror/highlight": "^0.19.7", "@codemirror/highlight": "^0.19.7",
@ -3804,9 +3804,9 @@
} }
}, },
"node_modules/caniuse-lite": { "node_modules/caniuse-lite": {
"version": "1.0.30001363", "version": "1.0.30001364",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001363.tgz", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001364.tgz",
"integrity": "sha512-HpQhpzTGGPVMnCjIomjt+jvyUu8vNFo3TaDiZ/RcoTrlOq/5+tC8zHdsbgFB6MxmaY+jCpsH09aD80Bb4Ow3Sg==", "integrity": "sha512-9O0xzV3wVyX0SlegIQ6knz+okhBB5pE0PC40MNdwcipjwpxoUEHL24uJ+gG42cgklPjfO5ZjZPme9FTSN3QT2Q==",
"dev": true, "dev": true,
"funding": [ "funding": [
{ {
@ -12341,9 +12341,9 @@
"dev": true "dev": true
}, },
"caniuse-lite": { "caniuse-lite": {
"version": "1.0.30001363", "version": "1.0.30001364",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001363.tgz", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001364.tgz",
"integrity": "sha512-HpQhpzTGGPVMnCjIomjt+jvyUu8vNFo3TaDiZ/RcoTrlOq/5+tC8zHdsbgFB6MxmaY+jCpsH09aD80Bb4Ow3Sg==", "integrity": "sha512-9O0xzV3wVyX0SlegIQ6knz+okhBB5pE0PC40MNdwcipjwpxoUEHL24uJ+gG42cgklPjfO5ZjZPme9FTSN3QT2Q==",
"dev": true "dev": true
}, },
"caseless": { "caseless": {

2
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "mainsail", "name": "mainsail",
"version": "2.2.1", "version": "2.3.0-alpha",
"private": true, "private": true,
"decription": "a klipper web interface", "decription": "a klipper web interface",
"author": { "author": {

5
public/config.json
View File

@ -1,3 +1,8 @@
{ {
"hostname": null,
"port": null,
"remoteMode": false,
"instances": [
]
} }

7
src/App.vue
View File

@ -29,8 +29,10 @@
<template> <template>
<v-app dark :style="cssVars"> <v-app dark :style="cssVars">
<template v-if="socketIsConnected && guiIsReady">
<the-sidebar></the-sidebar> <the-sidebar></the-sidebar>
<the-topbar></the-topbar> <the-topbar></the-topbar>
<v-main id="content" :style="mainStyle"> <v-main id="content" :style="mainStyle">
<overlay-scrollbars class="main-content-scrollbar"> <overlay-scrollbars class="main-content-scrollbar">
<v-container id="page-container" fluid class="container px-3 px-sm-6 py-sm-6 mx-auto"> <v-container id="page-container" fluid class="container px-3 px-sm-6 py-sm-6 mx-auto">
@ -38,13 +40,14 @@
</v-container> </v-container>
</overlay-scrollbars> </overlay-scrollbars>
</v-main> </v-main>
<the-select-printer-dialog v-if="remoteMode"></the-select-printer-dialog>
<the-connecting-dialog v-else></the-connecting-dialog>
<the-update-dialog></the-update-dialog> <the-update-dialog></the-update-dialog>
<the-editor></the-editor> <the-editor></the-editor>
<the-timelapse-rendering-snackbar></the-timelapse-rendering-snackbar> <the-timelapse-rendering-snackbar></the-timelapse-rendering-snackbar>
<the-fullscreen-upload></the-fullscreen-upload> <the-fullscreen-upload></the-fullscreen-upload>
<the-upload-snackbar></the-upload-snackbar> <the-upload-snackbar></the-upload-snackbar>
</template>
<the-select-printer-dialog v-else-if="remoteMode"></the-select-printer-dialog>
<the-connecting-dialog v-else></the-connecting-dialog>
</v-app> </v-app>
</template> </template>

30
src/components/TheConnectingDialog.vue
View File

@ -7,20 +7,11 @@
<v-toolbar-title> <v-toolbar-title>
<span class="subheading"> <span class="subheading">
<v-icon left>{{ mdiConnection }}</v-icon> <v-icon left>{{ mdiConnection }}</v-icon>
<template v-if="connectingFailed"> {{ titleText }}
{{ $t('ConnectionDialog.Failed', { host: formatHostname }) }}
</template>
<template v-else-if="isConnecting">
{{ $t('ConnectionDialog.Connecting', { host: formatHostname }) }}
</template>
<template v-else>{{ formatHostname }}</template>
</span> </span>
</v-toolbar-title> </v-toolbar-title>
</v-toolbar> </v-toolbar>
<v-card-text v-if="isConnecting" class="pt-5"> <v-card-text v-if="connectingFailed" class="pt-5">
<v-progress-linear color="white" indeterminate></v-progress-linear>
</v-card-text>
<v-card-text v-if="!isConnecting && connectingFailed" class="pt-5">
<connection-status :moonraker="false"></connection-status> <connection-status :moonraker="false"></connection-status>
<p class="text-center mt-3">{{ $t('ConnectionDialog.CannotConnectTo', { host: formatHostname }) }}</p> <p class="text-center mt-3">{{ $t('ConnectionDialog.CannotConnectTo', { host: formatHostname }) }}</p>
<template v-if="counter > 2"> <template v-if="counter > 2">
@ -36,6 +27,9 @@
<v-btn class="primary--text" @click="reconnect">{{ $t('ConnectionDialog.TryAgain') }}</v-btn> <v-btn class="primary--text" @click="reconnect">{{ $t('ConnectionDialog.TryAgain') }}</v-btn>
</div> </div>
</v-card-text> </v-card-text>
<v-card-text v-else class="pt-5">
<v-progress-linear color="white" indeterminate></v-progress-linear>
</v-card-text>
</v-card> </v-card>
</v-dialog> </v-dialog>
</template> </template>
@ -73,10 +67,6 @@ export default class TheConnectingDialog extends Mixins(BaseMixin) {
return parseInt(this.port) !== 80 && this.port !== '' ? this.hostname + ':' + this.port : this.hostname return parseInt(this.port) !== 80 && this.port !== '' ? this.hostname + ':' + this.port : this.hostname
} }
get isConnected() {
return this.$store.state.socket.isConnected
}
get isConnecting() { get isConnecting() {
return this.$store.state.socket.isConnecting return this.$store.state.socket.isConnecting
} }
@ -86,7 +76,15 @@ export default class TheConnectingDialog extends Mixins(BaseMixin) {
} }
get showDialog() { get showDialog() {
return !this.isConnected return true
}
get titleText() {
if (this.connectingFailed) return this.$t('ConnectionDialog.Failed', { host: this.formatHostname })
if (this.isConnecting) return this.$t('ConnectionDialog.Connecting', { host: this.formatHostname })
if (!this.guiIsReady) return this.$t('ConnectionDialog.Initializing')
return this.formatHostname
} }
reconnect() { reconnect() {

11
src/components/TheSelectPrinterDialog.vue
View File

@ -32,12 +32,12 @@
</template> </template>
</template> </template>
</template> </template>
<template v-if="isConnecting"> <template v-if="isConnecting || (isConnected && !guiIsReady)">
<v-card-text> <v-card-text>
<v-progress-linear color="primary" indeterminate></v-progress-linear> <v-progress-linear color="primary" indeterminate></v-progress-linear>
</v-card-text> </v-card-text>
</template> </template>
<template v-else-if="!isConnecting && connectingFailed"> <template v-else-if="connectingFailed">
<v-card-text> <v-card-text>
<p> <p>
{{ {{
@ -54,7 +54,7 @@
</div> </div>
</v-card-text> </v-card-text>
</template> </template>
<template v-else-if="!isConnecting && dialogAddPrinter.bool"> <template v-else-if="dialogAddPrinter.bool">
<v-form v-model="addPrinterValid" @submit.prevent="addPrinter"> <v-form v-model="addPrinterValid" @submit.prevent="addPrinter">
<v-card-text> <v-card-text>
<v-row> <v-row>
@ -92,7 +92,7 @@
</v-card-actions> </v-card-actions>
</v-form> </v-form>
</template> </template>
<template v-else-if="!isConnecting && dialogEditPrinter.bool"> <template v-else-if="dialogEditPrinter.bool">
<v-form v-model="editPrinterValid" @submit.prevent="updatePrinter"> <v-form v-model="editPrinterValid" @submit.prevent="updatePrinter">
<v-card-text> <v-card-text>
<v-row> <v-row>
@ -290,7 +290,7 @@ export default class TheSelectPrinterDialog extends Mixins(BaseMixin) {
} }
get showDialog() { get showDialog() {
return !this.isConnected return !this.isConnected || (this.isConnected && !this.guiIsReady)
} }
get currentUrl() { get currentUrl() {
@ -316,6 +316,7 @@ export default class TheSelectPrinterDialog extends Mixins(BaseMixin) {
if (this.dialogAddPrinter.bool) return this.$t('SelectPrinterDialog.AddPrinter') if (this.dialogAddPrinter.bool) return this.$t('SelectPrinterDialog.AddPrinter')
else if (this.dialogEditPrinter.bool) return this.$t('SelectPrinterDialog.EditPrinter') else if (this.dialogEditPrinter.bool) return this.$t('SelectPrinterDialog.EditPrinter')
else if (this.isConnecting) return this.$t('SelectPrinterDialog.Connecting', { host: this.formatHostname }) else if (this.isConnecting) return this.$t('SelectPrinterDialog.Connecting', { host: this.formatHostname })
else if (this.isConnected && !this.guiIsReady) return this.$t('ConnectionDialog.Initializing')
else if (this.connectingFailed) else if (this.connectingFailed)
return this.$t('SelectPrinterDialog.ConnectionFailed', { host: this.formatHostname }) return this.$t('SelectPrinterDialog.ConnectionFailed', { host: this.formatHostname })
else return this.$t('SelectPrinterDialog.SelectPrinter') else return this.$t('SelectPrinterDialog.SelectPrinter')

4
src/components/mixins/base.ts
View File

@ -19,6 +19,10 @@ export default class BaseMixin extends Vue {
return this.$store.state.socket.isConnected ?? false return this.$store.state.socket.isConnected ?? false
} }
get guiIsReady() {
return this.$store.state.socket.initializationList.length === 0
}
get klippyIsConnected(): boolean { get klippyIsConnected(): boolean {
return this.$store.state.server.klippy_connected ?? false return this.$store.state.server.klippy_connected ?? false
} }

1
src/locales/en.json
View File

@ -110,6 +110,7 @@
"CannotConnectTo": "Cannot connect to Moonraker ({host}).", "CannotConnectTo": "Cannot connect to Moonraker ({host}).",
"CheckMoonrakerLog": "If this message appears repeatedly, please have a look in the log file located at:", "CheckMoonrakerLog": "If this message appears repeatedly, please have a look in the log file located at:",
"Connecting": "Connecting to {host}", "Connecting": "Connecting to {host}",
"Initializing": "Initializing",
"Failed": "Connection failed", "Failed": "Connection failed",
"TryAgain": "try again" "TryAgain": "try again"
}, },

28
src/main.ts
View File

@ -74,19 +74,25 @@ import 'vue-resize/dist/vue-resize.css'
import VueResize from 'vue-resize' import VueResize from 'vue-resize'
Vue.use(VueResize) Vue.use(VueResize)
//load config.json and init vue const initLoad = async () => {
fetch('/config.json') //load config.json
await fetch('/config.json')
.then((res) => res.json()) .then((res) => res.json())
.then(async (file) => { .then(async (file) => {
await store.dispatch('importConfigJson', file) window.console.debug('Loaded config.json')
const url = store.getters['socket/getWebsocketUrl'] await store.dispatch('importConfigJson', file)
Vue.use(WebSocketPlugin, { })
url: url, .catch((_) => {
store: store, window.console.error('config.json not found or cannot be decoded!')
}) })
const url = store.getters['socket/getWebsocketUrl']
Vue.use(WebSocketPlugin, { url, store })
if (!store?.state?.remoteMode) Vue.$socket.connect() if (!store?.state?.remoteMode) Vue.$socket.connect()
}
initLoad()
new Vue({ new Vue({
vuetify, vuetify,
@ -95,11 +101,3 @@ fetch('/config.json')
i18n, i18n,
render: (h) => h(App), render: (h) => h(App),
}).$mount('#app') }).$mount('#app')
})
.catch((error) => {
const p = document.createElement('p')
const content = document.createTextNode('config.json not found or cannot be decoded!')
p.appendChild(content)
document.getElementById('app')?.append(p)
window.console.error('Error:', error)
})

81
src/plugins/webSocketClient.ts
View File

@ -24,23 +24,12 @@ export class WebSocketClient {
this.url = url this.url = url
} }
// eslint-disable-next-line
passToStore(eventName: string, event: any): void {
if (!eventName.startsWith('socket/')) {
return
}
this.store?.dispatch(eventName, event)
}
async connect() { async connect() {
this.store?.dispatch('socket/setData', { this.store?.dispatch('socket/setData', {
isConnecting: true, isConnecting: true,
}) })
if (this.instance) { await this.instance?.close()
this.instance.close()
}
this.instance = new WebSocket(this.url) this.instance = new WebSocket(this.url)
this.instance.onopen = () => { this.instance.onopen = () => {
@ -48,28 +37,46 @@ export class WebSocketClient {
this.store?.dispatch('socket/onOpen', event) this.store?.dispatch('socket/onOpen', event)
} }
this.instance.onclose = async (e) => { this.instance.onclose = (e) => {
if (!e.wasClean && this.reconnects < this.maxReconnects) { if (e.wasClean || this.reconnects >= this.maxReconnects) {
this.store?.dispatch('socket/onClose', e)
return
}
this.reconnects++ this.reconnects++
setTimeout(() => { setTimeout(() => {
this.connect() this.connect()
}, this.reconnectInterval) }, this.reconnectInterval)
} else await this.store?.dispatch('socket/onClose', e)
} }
this.instance.onerror = () => { this.instance.onerror = () => {
if (this.instance) this.instance.close() this.instance?.close()
} }
this.instance.onmessage = (msg) => { this.instance.onmessage = (msg) => {
if (this.store === null) return
const data = JSON.parse(msg.data) const data = JSON.parse(msg.data)
if (this.store) {
const wait = this.getWaitById(data.id) const wait = this.getWaitById(data.id)
if (wait && wait.action !== '') {
// report error messages
if (data.error?.message) { if (data.error?.message) {
if (data.error?.message !== 'Klippy Disconnected') if (data.error?.message !== 'Klippy Disconnected')
window.console.error('Response Error: ' + wait.action + ' > ' + data.error.message) window.console.error(`Response Error: ${data.error.message} (${wait?.action ?? 'no action'})`)
} else if (wait.action) {
if (wait?.id) this.removeWaitById(wait.id)
return
}
// pass it to socket/onMessage, if no wait exists
if (!wait) {
this.store?.dispatch('socket/onMessage', data)
return
}
// pass result to action
if (wait?.action) {
let result = data.result let result = data.result
if (result === 'ok') result = { result: result } if (result === 'ok') result = { result: result }
if (typeof result === 'string') result = { result: result } if (typeof result === 'string') result = { result: result }
@ -80,34 +87,31 @@ export class WebSocketClient {
Object.assign(preload, result) Object.assign(preload, result)
this.store?.dispatch(wait.action, preload) this.store?.dispatch(wait.action, preload)
} }
} else this.store?.dispatch('socket/onMessage', data)
if (wait) this.removeWaitById(wait.id) this.removeWaitById(wait.id)
}
} }
} }
async close() { close(): void {
if (this.instance) await this.instance.close() this.instance?.close()
} }
getWaitById(id: number): Wait | null { getWaitById(id: number): Wait | null {
return this.waits.find((wait: Wait) => wait.id === id) ?? null return this.waits.find((wait: Wait) => wait.id === id) ?? null
} }
removeWaitById(id: number): void { removeWaitById(id: number | null): void {
const index = this.waits.findIndex((wait: Wait) => wait.id === id) const index = this.waits.findIndex((wait: Wait) => wait.id === id)
if (index) { if (index) {
const wait = this.waits[index] const wait = this.waits[index]
if (wait.loading && this.store) { if (wait.loading) this.store?.dispatch('socket/removeLoading', { name: wait.loading })
this.store.dispatch('socket/removeLoading', { name: wait.loading })
}
this.waits.splice(index, 1) this.waits.splice(index, 1)
} }
} }
emit(method: string, params: Params, options: emitOptions = {}): void { emit(method: string, params: Params, options: emitOptions = {}): void {
if (this.instance?.readyState === WebSocket.OPEN) { if (this.instance?.readyState !== WebSocket.OPEN) return
const id = Math.floor(Math.random() * 10000) + 1 const id = Math.floor(Math.random() * 10000) + 1
this.waits.push({ this.waits.push({
id: id, id: id,
@ -117,19 +121,16 @@ export class WebSocketClient {
loading: options.loading ?? null, loading: options.loading ?? null,
}) })
if (options.loading && this.store) { if (options.loading) this.store?.dispatch('socket/addLoading', { name: options.loading })
this.store.dispatch('socket/addLoading', { name: options.loading })
}
const msg = JSON.stringify({ this.instance.send(
JSON.stringify({
jsonrpc: '2.0', jsonrpc: '2.0',
method: method, method,
params: params, params,
id: id, id,
}) })
)
this.instance.send(msg)
}
} }
} }

11
src/store/actions.ts
View File

@ -1,7 +1,6 @@
import router from '@/plugins/router' import router from '@/plugins/router'
import { ActionTree } from 'vuex' import { ActionTree } from 'vuex'
import { ConfigJson, RootState } from './types' import { ConfigJson, RootState } from './types'
import { v4 as uuidv4 } from 'uuid'
export const actions: ActionTree<RootState, RootState> = { export const actions: ActionTree<RootState, RootState> = {
switchToDashboard() { switchToDashboard() {
@ -31,18 +30,20 @@ export const actions: ActionTree<RootState, RootState> = {
/** /**
* This function will parse the config.json content and config mainsail * This function will parse the config.json content and config mainsail
* @param commit - vuex commit
* @param dispatch - vuex dispatch
* @param payload - content of config.json as a object
*/ */
importConfigJson({ commit, dispatch }, payload: ConfigJson) { importConfigJson({ commit, dispatch }, payload: ConfigJson) {
const remoteMode = 'remoteMode' in payload ? payload.remoteMode : false const remoteMode = payload.remoteMode ?? false
if (remoteMode) { if (remoteMode) {
commit('setRemoteMode', true) commit('setRemoteMode', true)
if ('instances' in payload && Array.isArray(payload.instances) && payload.instances.length) { if ('instances' in payload && Array.isArray(payload.instances) && payload.instances.length) {
commit('setConfigInstances', payload.instances) commit('setConfigInstances', payload.instances)
} }
return
} }
if (payload.hostname) commit('socket/setData', { hostname: payload.hostname })
if (payload.port) commit('socket/setData', { port: parseInt(payload.port.toString()) })
}, },
} }

3
src/store/gui/actions.ts
View File

@ -113,7 +113,8 @@ export const actions: ActionTree<GuiState, RootState> = {
}) })
} }
commit('setData', payload.value) await commit('setData', payload.value)
await dispatch('socket/removeInitModule', 'gui/init', { root: true })
}, },
/* /*

7
src/store/gui/webcams/actions.ts
View File

@ -14,9 +14,10 @@ export const actions: ActionTree<GuiWebcamState, RootState> = {
Vue.$socket.emit('server.database.get_item', { namespace: 'webcams' }, { action: 'gui/webcams/initStore' }) Vue.$socket.emit('server.database.get_item', { namespace: 'webcams' }, { action: 'gui/webcams/initStore' })
}, },
initStore({ commit }, payload) { async initStore({ commit, dispatch }, payload) {
commit('reset') await commit('reset')
commit('initStore', payload) await commit('initStore', payload)
await dispatch('socket/removeInitModule', 'gui/webcam/init', { root: true })
}, },
upload(_, payload) { upload(_, payload) {

21
src/store/printer/actions.ts
View File

@ -10,8 +10,15 @@ export const actions: ActionTree<PrinterState, RootState> = {
commit('socket/clearLoadings', null, { root: true }) commit('socket/clearLoadings', null, { root: true })
}, },
init() { init({ dispatch }) {
window.console.debug('init printer') window.console.debug('init printer')
dispatch('reset')
dispatch('socket/addInitModule', 'printer/info', { root: true })
dispatch('socket/addInitModule', 'printer/initSubscripts', { root: true })
dispatch('socket/addInitModule', 'printer/initHelpList', { root: true })
dispatch('socket/addInitModule', 'printer/initTempHistory', { root: true })
dispatch('socket/addInitModule', 'server/gcode_store', { root: true })
Vue.$socket.emit('printer.info', {}, { action: 'printer/getInfo' }) Vue.$socket.emit('printer.info', {}, { action: 'printer/getInfo' })
Vue.$socket.emit('printer.objects.list', {}, { action: 'printer/initSubscripts' }) Vue.$socket.emit('printer.objects.list', {}, { action: 'printer/initSubscripts' })
@ -19,7 +26,7 @@ export const actions: ActionTree<PrinterState, RootState> = {
Vue.$socket.emit('server.gcode_store', {}, { action: 'server/getGcodeStore' }) Vue.$socket.emit('server.gcode_store', {}, { action: 'server/getGcodeStore' })
}, },
getInfo({ commit }, payload) { getInfo({ commit, dispatch }, payload) {
commit( commit(
'server/setData', 'server/setData',
{ {
@ -34,9 +41,11 @@ export const actions: ActionTree<PrinterState, RootState> = {
software_version: payload.software_version, software_version: payload.software_version,
cpu_info: payload.cpu_info, cpu_info: payload.cpu_info,
}) })
dispatch('socket/removeInitModule', 'printer/info', { root: true })
}, },
initSubscripts(_, payload) { initSubscripts({ dispatch }, payload) {
let subscripts = {} let subscripts = {}
const blocklist = ['menu'] const blocklist = ['menu']
@ -49,6 +58,8 @@ export const actions: ActionTree<PrinterState, RootState> = {
if (Object.keys(subscripts).length > 0) if (Object.keys(subscripts).length > 0)
Vue.$socket.emit('printer.objects.subscribe', { objects: subscripts }, { action: 'printer/getInitData' }) Vue.$socket.emit('printer.objects.subscribe', { objects: subscripts }, { action: 'printer/getInitData' })
else Vue.$socket.emit('server.temperature_store', {}, { action: 'printer/tempHistory/init' }) else Vue.$socket.emit('server.temperature_store', {}, { action: 'printer/tempHistory/init' })
dispatch('socket/removeInitModule', 'printer/initSubscripts', { root: true })
}, },
getInitData({ dispatch }, payload) { getInitData({ dispatch }, payload) {
@ -109,8 +120,10 @@ export const actions: ActionTree<PrinterState, RootState> = {
commit('setData', payload) commit('setData', payload)
}, },
initHelpList({ commit }, payload) { initHelpList({ commit, dispatch }, payload) {
commit('setHelplist', payload) commit('setHelplist', payload)
dispatch('socket/removeInitModule', 'printer/initHelpList', { root: true })
}, },
getEndstopStatus({ commit }, payload) { getEndstopStatus({ commit }, payload) {

12
src/store/printer/getters.ts
View File

@ -357,7 +357,7 @@ export const getters: GetterTree<PrinterState, RootState> = {
let controllable = controllableFans.includes(nameSplit[0].toLowerCase()) let controllable = controllableFans.includes(nameSplit[0].toLowerCase())
const settings = state.configfile?.settings[key.toLowerCase()] ?? {} const settings = state.configfile?.settings[key.toLowerCase()] ?? {}
const power = 'speed' in value ? value.speed : 'value' in value ? value.value : 0 const power = 'speed' in value ? value.speed : 'value' in value ? value.value : 0
const rpm = 'rpm' in value ? value.rpm : false const rpm = 'rpm' in value ? value.rpm : null
let pwm = controllable let pwm = controllable
let scale = 1 let scale = 1
@ -373,11 +373,11 @@ export const getters: GetterTree<PrinterState, RootState> = {
const tmp = { const tmp = {
name: name, name: name,
type: nameSplit[0], type: nameSplit[0],
power: power, power,
controllable: controllable, controllable,
pwm: pwm, pwm,
rpm: rpm, rpm,
scale: scale, scale,
object: value, object: value,
config: settings, config: settings,
off_below: undefined, off_below: undefined,

2
src/store/printer/tempHistory/actions.ts
View File

@ -227,6 +227,8 @@ export const actions: ActionTree<PrinterTempHistoryState, RootState> = {
commit('setUpdateSourceInterval', updateSourceInterval) commit('setUpdateSourceInterval', updateSourceInterval)
} }
dispatch('socket/removeInitModule', 'printer/initTempHistory', { root: true })
}, },
async updateSource({ commit, rootState, rootGetters, state }) { async updateSource({ commit, rootState, rootGetters, state }) {

142
src/store/server/actions.ts
View File

@ -8,6 +8,9 @@ import { initableServerComponents } from '@/store/variables'
export const actions: ActionTree<ServerState, RootState> = { export const actions: ActionTree<ServerState, RootState> = {
reset({ commit, dispatch }) { reset({ commit, dispatch }) {
dispatch('stopKlippyConnectedInterval')
dispatch('stopKlippyStateInterval')
commit('reset') commit('reset')
dispatch('power/reset') dispatch('power/reset')
dispatch('updateManager/reset') dispatch('updateManager/reset')
@ -16,15 +19,24 @@ export const actions: ActionTree<ServerState, RootState> = {
async init({ dispatch }) { async init({ dispatch }) {
window.console.debug('init Server') window.console.debug('init Server')
await dispatch('identify') dispatch('socket/addInitModule', 'server/info', { root: true })
await Vue.$socket.emit('server.info', {}, { action: 'server/initServerInfo' }) dispatch('socket/addInitModule', 'server/config', { root: true })
await Vue.$socket.emit('server.config', {}, { action: 'server/initServerConfig' }) dispatch('socket/addInitModule', 'server/systemInfo', { root: true })
await Vue.$socket.emit('machine.system_info', {}, { action: 'server/initSystemInfo' }) dispatch('socket/addInitModule', 'server/procStats', { root: true })
await Vue.$socket.emit('machine.proc_stats', {}, { action: 'server/initProcStats' }) dispatch('socket/addInitModule', 'server/databaseList', { root: true })
await Vue.$socket.emit('server.database.list', { root: 'config' }, { action: 'server/checkDatabases' })
dispatch('identify')
Vue.$socket.emit('server.info', {}, { action: 'server/initServerInfo' })
Vue.$socket.emit('server.config', {}, { action: 'server/initServerConfig' })
Vue.$socket.emit('machine.system_info', {}, { action: 'server/initSystemInfo' })
Vue.$socket.emit('machine.proc_stats', {}, { action: 'server/initProcStats' })
Vue.$socket.emit('server.database.list', { root: 'config' }, { action: 'server/checkDatabases' })
await dispatch('socket/removeInitModule', 'server', { root: true })
}, },
identify({ rootState }) { identify({ dispatch, rootState }): void {
dispatch('socket/addInitModule', 'server/identify', { root: true })
Vue.$socket.emit( Vue.$socket.emit(
'server.connection.identify', 'server.connection.identify',
{ {
@ -37,19 +49,25 @@ export const actions: ActionTree<ServerState, RootState> = {
) )
}, },
setConnectionId({ commit }, payload) { setConnectionId({ commit, dispatch }, payload) {
commit('setConnectionId', payload.connection_id) commit('setConnectionId', payload.connection_id)
dispatch('socket/removeInitModule', 'server/identify', { root: true })
}, },
checkDatabases({ dispatch, commit, rootState }, payload) { checkDatabases({ dispatch, commit, rootState }, payload) {
if (payload.namespaces?.includes('mainsail')) dispatch('gui/init', null, { root: true }) if (payload.namespaces?.includes('mainsail')) {
else dispatch('gui/initDb', null, { root: true }) dispatch('socket/addInitModule', 'gui/init', { root: true })
if (payload.namespaces?.includes('webcams')) dispatch('gui/webcams/init', null, { root: true }) dispatch('gui/init', null, { root: true })
} else dispatch('gui/initDb', null, { root: true })
if (payload.namespaces?.includes('webcams')) {
dispatch('socket/addInitModule', 'gui/webcam/init', { root: true })
dispatch('gui/webcams/init', null, { root: true })
}
commit('saveDbNamespaces', payload.namespaces) commit('saveDbNamespaces', payload.namespaces)
Vue.$socket.emit('server.info', {}, { action: 'server/checkKlippyConnected' }) Vue.$socket.emit('server.info', {}, { action: 'server/checkKlippyConnected' })
//dispatch('printer/init', null, { root: true }) dispatch('socket/removeInitModule', 'server/databaseList', { root: true })
}, },
initServerInfo({ dispatch, commit }, payload) { initServerInfo({ dispatch, commit }, payload) {
@ -58,13 +76,14 @@ export const actions: ActionTree<ServerState, RootState> = {
if ('failed_plugins' in payload) delete payload.failed_plugins if ('failed_plugins' in payload) delete payload.failed_plugins
if (payload.components?.length) { if (payload.components?.length) {
payload.components.forEach((component: string) => { for (let component of payload.components) {
component = camelize(component) component = camelize(component)
if (initableServerComponents.includes(component)) { if (initableServerComponents.includes(component)) {
window.console.debug('init server component: ' + component) window.console.debug('init server component: ' + component)
dispatch('socket/addInitModule', 'server/' + component + '/init', { root: true })
dispatch('server/' + component + '/init', {}, { root: true }) dispatch('server/' + component + '/init', {}, { root: true })
} }
}) }
} }
if (payload.registered_directories?.length) { if (payload.registered_directories?.length) {
@ -72,22 +91,30 @@ export const actions: ActionTree<ServerState, RootState> = {
} }
commit('setData', payload) commit('setData', payload)
dispatch('socket/removeInitModule', 'server/info', { root: true })
}, },
initServerConfig({ commit }, payload) { initServerConfig({ commit, dispatch }, payload) {
commit('setConfig', payload) commit('setConfig', payload)
dispatch('socket/removeInitModule', 'server/config', { root: true })
}, },
initSystemInfo({ commit }, payload) { initSystemInfo({ commit, dispatch }, payload) {
commit('setSystemInfo', payload.system_info) commit('setSystemInfo', payload.system_info)
dispatch('socket/removeInitModule', 'server/systemInfo', { root: true })
}, },
initProcStats({ commit }, payload) { initProcStats({ commit, dispatch }, payload) {
if (payload.throttled_state !== null) commit('setThrottledState', payload.throttled_state) if (payload.throttled_state !== null) {
commit('setThrottledState', payload.throttled_state)
}
if (payload.system_uptime) { if (payload.system_uptime) {
const system_boot_at = new Date(new Date().getTime() - payload.system_uptime * 1000) const system_boot_at = new Date(new Date().getTime() - payload.system_uptime * 1000)
commit('setSystemBootAt', system_boot_at) commit('setSystemBootAt', system_boot_at)
} }
dispatch('socket/removeInitModule', 'server/procStats', { root: true })
}, },
updateProcStats({ commit }, payload) { updateProcStats({ commit }, payload) {
@ -97,84 +124,88 @@ export const actions: ActionTree<ServerState, RootState> = {
if ('system_cpu_usage' in payload) commit('setCpuStats', payload.system_cpu_usage) if ('system_cpu_usage' in payload) commit('setCpuStats', payload.system_cpu_usage)
}, },
setKlippyReady({ dispatch, state }) { setKlippyReady({ dispatch }) {
if (state.klippy_connected_timer !== null) dispatch('stopKlippyConnectedInterval') dispatch('stopKlippyConnectedInterval')
if (state.klippy_state_timer !== null) dispatch('stopKlippyStateInterval') dispatch('stopKlippyStateInterval')
dispatch('printer/reset', null, { root: true }) dispatch('printer/reset', null, { root: true })
dispatch('printer/init', null, { root: true }) dispatch('printer/init', null, { root: true })
}, },
async setKlippyDisconnected({ commit, dispatch, state }) { setKlippyDisconnected({ commit, dispatch }) {
await commit('setKlippyDisconnected', null) commit('setKlippyDisconnected', null)
if (state.klippy_state_timer !== null) await dispatch('stopKlippyStateInterval') dispatch('stopKlippyStateInterval')
await dispatch('startKlippyConnectedInterval') dispatch('startKlippyConnectedInterval')
}, },
async setKlippyShutdown({ commit, dispatch, state }) { setKlippyShutdown({ commit, dispatch }) {
await commit('setKlippyShutdown', null) commit('setKlippyShutdown', null)
if (state.klippy_state_timer !== null) await dispatch('stopKlippyStateInterval') dispatch('stopKlippyStateInterval')
await dispatch('startKlippyConnectedInterval') dispatch('startKlippyConnectedInterval')
}, },
startKlippyConnectedInterval({ commit, state }) { startKlippyConnectedInterval({ commit, state }) {
if (state.klippy_connected_timer === null) { if (state.klippy_connected_timer) return
const timer = setInterval(() => { const timer = setInterval(() => {
Vue.$socket.emit('server.info', {}, { action: 'server/checkKlippyConnected' }) Vue.$socket.emit('server.info', {}, { action: 'server/checkKlippyConnected' })
}, 2000) }, 2000)
commit('setKlippyConnectedTimer', timer) commit('setKlippyConnectedTimer', timer)
}
}, },
stopKlippyConnectedInterval({ commit, state }) { stopKlippyConnectedInterval({ commit, state }) {
if (state.klippy_connected_timer !== null) { if (state.klippy_connected_timer === null) return
clearInterval(state.klippy_connected_timer) clearInterval(state.klippy_connected_timer)
commit('setKlippyConnectedTimer', null) commit('setKlippyConnectedTimer', null)
}
}, },
async checkKlippyConnected({ commit, dispatch, state }, payload) { checkKlippyConnected({ commit, dispatch, state }, payload) {
if (payload.klippy_connected) { if (!payload.klippy_connected) {
await dispatch('stopKlippyConnectedInterval')
await commit('setKlippyConnected')
dispatch('checkKlippyState', { state: payload.klippy_state, state_message: null })
} else if (!payload.klippy_connected && state.klippy_connected_timer === null)
dispatch('startKlippyConnectedInterval') dispatch('startKlippyConnectedInterval')
return
}
dispatch('stopKlippyConnectedInterval')
commit('setKlippyConnected')
dispatch('checkKlippyState', { state: payload.klippy_state, state_message: null })
}, },
startKlippyStateInterval({ commit, state }) { startKlippyStateInterval({ commit, state }) {
if (state.klippy_state_timer === null) { if (state.klippy_state_timer) return
const timer = setInterval(() => { const timer = setInterval(() => {
Vue.$socket.emit('printer.info', {}, { action: 'server/checkKlippyState' }) Vue.$socket.emit('printer.info', {}, { action: 'server/checkKlippyState' })
}, 2000) }, 2000)
commit('setKlippyStateTimer', timer) commit('setKlippyStateTimer', timer)
}
}, },
stopKlippyStateInterval({ commit, state }) { stopKlippyStateInterval({ commit, state }) {
if (state.klippy_state_timer !== null) { if (state.klippy_state_timer === null) return
clearInterval(state.klippy_state_timer) clearInterval(state.klippy_state_timer)
commit('setKlippyStateTimer', null) commit('setKlippyStateTimer', null)
}
}, },
checkKlippyState({ commit, dispatch, state }, payload: { state: string; state_message: string | null }) { checkKlippyState({ commit, dispatch, state }, payload: { state: string; state_message: string | null }) {
commit('setKlippyState', payload.state) commit('setKlippyState', payload.state)
commit('setKlippyMessage', payload.state_message) commit('setKlippyMessage', payload.state_message)
if (payload.state !== 'ready' && state.klippy_connected && state.klippy_state_timer === null) { if (payload.state !== 'ready') {
dispatch('startKlippyStateInterval') dispatch('startKlippyStateInterval')
} else if (payload.state === 'ready' && state.klippy_state_timer !== null) { return
dispatch('stopKlippyStateInterval')
} else if (payload.state === 'ready' && state.klippy_state_timer === null) {
dispatch('printer/init', null, { root: true })
} }
dispatch('stopKlippyConnectedInterval')
dispatch('stopKlippyStateInterval')
dispatch('printer/init', null, { root: true })
}, },
getData({ commit }, payload) { getData({ commit }, payload) {
commit('setData', payload) commit('setData', payload)
}, },
getGcodeStore({ commit, rootGetters }, payload) { getGcodeStore({ commit, dispatch, rootGetters }, payload) {
commit('clearGcodeStore') commit('clearGcodeStore')
let events: ServerStateEvent[] = payload.gcode_store let events: ServerStateEvent[] = payload.gcode_store
@ -199,14 +230,11 @@ export const actions: ActionTree<ServerState, RootState> = {
return false return false
} }
if (event.date && new Date(event.date).valueOf() < cleared_since) { return !(event.date && new Date(event.date).valueOf() < cleared_since)
return false
}
return true
}) })
commit('setGcodeStore', events) commit('setGcodeStore', events)
dispatch('socket/removeInitModule', 'server/gcode_store', { root: true })
}, },
addRootDirectory({ commit, state }, data) { addRootDirectory({ commit, state }, data) {
@ -215,7 +243,7 @@ export const actions: ActionTree<ServerState, RootState> = {
} }
}, },
async addEvent({ commit, rootGetters }, payload) { addEvent({ commit, rootGetters }, payload) {
let message = payload let message = payload
let type = 'response' let type = 'response'
@ -234,7 +262,7 @@ export const actions: ActionTree<ServerState, RootState> = {
const regex = new RegExp(filter) const regex = new RegExp(filter)
if (regex.test(formatMessage)) boolImport = false if (regex.test(formatMessage)) boolImport = false
} catch { } catch {
window.console.error("Custom console filter '" + filter + "' doesn't work") window.console.error("Custom console filter '" + filter + "' doesn't work!")
} }
return boolImport return boolImport
@ -243,7 +271,7 @@ export const actions: ActionTree<ServerState, RootState> = {
if (boolImport) { if (boolImport) {
if (payload.type === 'command') formatMessage = '<a class="command text--blue">' + formatMessage + '</a>' if (payload.type === 'command') formatMessage = '<a class="command text--blue">' + formatMessage + '</a>'
await commit('addEvent', { commit('addEvent', {
date: new Date(), date: new Date(),
message: message, message: message,
formatMessage: formatMessage, formatMessage: formatMessage,

8
src/store/server/announcements/actions.ts
View File

@ -12,7 +12,7 @@ export const actions: ActionTree<ServerAnnouncementsState, RootState> = {
Vue.$socket.emit('server.announcements.list', {}, { action: 'server/announcements/getList' }) Vue.$socket.emit('server.announcements.list', {}, { action: 'server/announcements/getList' })
}, },
getList({ commit }, payload) { async getList({ commit, dispatch }, payload) {
if ('entries' in payload) { if ('entries' in payload) {
const entries = payload.entries.map((entry: any) => { const entries = payload.entries.map((entry: any) => {
const date = new Date(entry.date * 1000) const date = new Date(entry.date * 1000)
@ -22,9 +22,11 @@ export const actions: ActionTree<ServerAnnouncementsState, RootState> = {
return { ...entry, date, date_dismissed, dismiss_wake } return { ...entry, date, date_dismissed, dismiss_wake }
}) })
commit('setEntries', entries) await commit('setEntries', entries)
} }
if ('feeds' in payload) commit('setFeeds', payload.feeds) if ('feeds' in payload) await commit('setFeeds', payload.feeds)
await dispatch('socket/removeInitModule', 'server/announcements/init', { root: true })
}, },
getDismissed({ commit }, payload) { getDismissed({ commit }, payload) {

19
src/store/server/history/actions.ts
View File

@ -17,9 +17,9 @@ export const actions: ActionTree<ServerHistoryState, RootState> = {
commit('setTotals', payload.job_totals) commit('setTotals', payload.job_totals)
}, },
getHistory({ commit, dispatch, state }, payload) { async getHistory({ commit, dispatch, state }, payload) {
if ('requestParams' in payload && 'start' in payload.requestParams && payload.requestParams.start === 0) if ('requestParams' in payload && 'start' in payload.requestParams && payload.requestParams.start === 0)
commit('resetJobs') await commit('resetJobs')
payload.jobs?.forEach((job: ServerHistoryStateJob) => { payload.jobs?.forEach((job: ServerHistoryStateJob) => {
if (state.jobs.findIndex((stateJob) => stateJob.job_id === job.job_id) === -1) commit('addJob', job) if (state.jobs.findIndex((stateJob) => stateJob.job_id === job.job_id) === -1) commit('addJob', job)
@ -34,28 +34,31 @@ export const actions: ActionTree<ServerHistoryState, RootState> = {
}, },
{ action: 'server/history/getHistory' } { action: 'server/history/getHistory' }
) )
else dispatch('loadHistoryNotes') else await dispatch('loadHistoryNotes')
}, },
loadHistoryNotes({ rootState }) { loadHistoryNotes({ dispatch, rootState }) {
if (rootState.server?.dbNamespaces.includes('history_notes')) if (rootState.server?.dbNamespaces.includes('history_notes'))
Vue.$socket.emit( Vue.$socket.emit(
'server.database.get_item', 'server.database.get_item',
{ namespace: 'history_notes' }, { namespace: 'history_notes' },
{ action: 'server/history/initHistoryNotes' } { action: 'server/history/initHistoryNotes' }
) )
else dispatch('socket/removeInitModule', 'server/history/init', { root: true })
}, },
initHistoryNotes({ commit, state }, payload) { async initHistoryNotes({ commit, dispatch, state }, payload) {
const job_ids = Object.keys(payload.value) const job_ids = Object.keys(payload.value)
job_ids.forEach((job_id: string) => { for (const job_id of job_ids) {
const noteObject: { text: string } = payload.value[job_id] const noteObject: { text: string } = payload.value[job_id]
commit('setHistoryNotes', { await commit('setHistoryNotes', {
job_id, job_id,
text: noteObject.text, text: noteObject.text,
}) })
}) }
await dispatch('socket/removeInitModule', 'server/history/init', { root: true })
}, },
getChanged({ commit }, payload) { getChanged({ commit }, payload) {

8
src/store/server/jobQueue/actions.ts
View File

@ -17,9 +17,11 @@ export const actions: ActionTree<ServerJobQueueState, RootState> = {
if ('queue_state' in payload) commit('setQueueState', payload.queue_state) if ('queue_state' in payload) commit('setQueueState', payload.queue_state)
}, },
getStatus({ commit }, payload) { async getStatus({ commit, dispatch }, payload) {
if ('queued_jobs' in payload) commit('setQueuedJobs', payload.queued_jobs) if ('queued_jobs' in payload) await commit('setQueuedJobs', payload.queued_jobs)
if ('queue_state' in payload) commit('setQueueState', payload.queue_state) if ('queue_state' in payload) await commit('setQueueState', payload.queue_state)
await dispatch('socket/removeInitModule', 'server/jobQueue/init', { root: true })
}, },
async addToQueue({ state }, filenames: string[]) { async addToQueue({ state }, filenames: string[]) {

6
src/store/server/power/actions.ts
View File

@ -12,8 +12,10 @@ export const actions: ActionTree<ServerPowerState, RootState> = {
Vue.$socket.emit('machine.device_power.devices', {}, { action: 'server/power/getDevices' }) Vue.$socket.emit('machine.device_power.devices', {}, { action: 'server/power/getDevices' })
}, },
getDevices({ commit }, payload) { async getDevices({ commit, dispatch }, payload) {
if (!payload.error) commit('setDevices', payload.devices) if (!payload.error) await commit('setDevices', payload.devices)
await dispatch('socket/removeInitModule', 'server/power/init', { root: true })
}, },
getStatus({ commit }, payload) { getStatus({ commit }, payload) {

5
src/store/server/timelapse/actions.ts
View File

@ -13,10 +13,11 @@ export const actions: ActionTree<ServerTimelapseState, RootState> = {
Vue.$socket.emit('machine.timelapse.lastframeinfo', {}, { action: 'server/timelapse/initLastFrameinfo' }) Vue.$socket.emit('machine.timelapse.lastframeinfo', {}, { action: 'server/timelapse/initLastFrameinfo' })
}, },
initSettings({ commit }, payload) { async initSettings({ commit, dispatch }, payload) {
if ('requestParams' in payload) delete payload.requestParams if ('requestParams' in payload) delete payload.requestParams
commit('setSettings', payload) await commit('setSettings', payload)
await dispatch('socket/removeInitModule', 'server/timelapse/init', { root: true })
}, },
initLastFrameinfo({ commit }, payload) { initLastFrameinfo({ commit }, payload) {

5
src/store/server/updateManager/actions.ts
View File

@ -12,7 +12,8 @@ export const actions: ActionTree<ServerUpdateMangerState, RootState> = {
Vue.$socket.emit('machine.update.status', {}, { action: 'server/updateManager/getStatus' }) Vue.$socket.emit('machine.update.status', {}, { action: 'server/updateManager/getStatus' })
}, },
getStatus({ commit }, payload) { async getStatus({ commit, dispatch }, payload) {
commit('setStatus', payload) await commit('setStatus', payload)
await dispatch('socket/removeInitModule', 'server/updateManager/init', { root: true })
}, },
} }

17
src/store/socket/actions.ts
View File

@ -6,6 +6,8 @@ import { v4 as uuidv4 } from 'uuid'
export const actions: ActionTree<SocketState, RootState> = { export const actions: ActionTree<SocketState, RootState> = {
reset({ commit }) { reset({ commit }) {
commit('setDisconnected')
commit('clearLoadings')
commit('reset') commit('reset')
}, },
@ -54,7 +56,8 @@ export const actions: ActionTree<SocketState, RootState> = {
case 'notify_klippy_ready': case 'notify_klippy_ready':
commit('server/setKlippyConnected', null, { root: true }) commit('server/setKlippyConnected', null, { root: true })
dispatch('printer/reset', null, { root: true }) dispatch('server/stopKlippyConnectedInterval', null, { root: true })
dispatch('server/stopKlippyStateInterval', null, { root: true })
dispatch('printer/init', null, { root: true }) dispatch('printer/init', null, { root: true })
break break
@ -123,9 +126,7 @@ export const actions: ActionTree<SocketState, RootState> = {
break break
default: default:
if (payload.result !== 'ok' && payload.error?.message) window.console.debug(payload)
window.console.error('JSON-RPC: ' + payload.error.message)
else window.console.debug(payload)
} }
}, },
@ -141,6 +142,14 @@ export const actions: ActionTree<SocketState, RootState> = {
commit('clearLoadings') commit('clearLoadings')
}, },
addInitModule({ commit }, payload: string) {
commit('addInitModule', payload)
},
removeInitModule({ commit }, payload: string) {
commit('removeInitModule', payload)
},
reportDebug(_, payload) { reportDebug(_, payload) {
window.console.log(payload) window.console.log(payload)
}, },

1
src/store/socket/index.ts
View File

@ -19,6 +19,7 @@ export const getDefaultState = (): SocketState => {
isConnecting: false, isConnecting: false,
connectingFailed: false, connectingFailed: false,
loadings: [], loadings: [],
initializationList: ['server'],
connection_id: null, connection_id: null,
} }
} }

25
src/store/socket/mutations.ts
View File

@ -5,7 +5,9 @@ import { SocketState } from '@/store/socket/types'
export const mutations: MutationTree<SocketState> = { export const mutations: MutationTree<SocketState> = {
reset(state) { reset(state) {
Object.assign(state, getDefaultState()) const defaults = getDefaultState()
Vue.set(state, 'initializationList', defaults.initializationList)
}, },
setConnected(state) { setConnected(state) {
@ -18,6 +20,7 @@ export const mutations: MutationTree<SocketState> = {
Vue.set(state, 'isConnected', false) Vue.set(state, 'isConnected', false)
Vue.set(state, 'isConnecting', false) Vue.set(state, 'isConnecting', false)
Vue.set(state, 'connectingFailed', true) Vue.set(state, 'connectingFailed', true)
Vue.set(state, 'connection_id', null)
}, },
setData(state, payload) { setData(state, payload) {
@ -38,6 +41,24 @@ export const mutations: MutationTree<SocketState> = {
}, },
clearLoadings(state) { clearLoadings(state) {
if (state.loadings.length) state.loadings.splice(0, state.loadings.length) if (state.loadings.length) Vue.set(state, 'loadings', [])
},
addInitModule(state, payload) {
const list = [...state.initializationList]
const index = list.indexOf(payload)
if (index > -1) return
list.push(payload)
Vue.set(state, 'initializationList', list)
},
removeInitModule(state, payload) {
const list = [...state.initializationList]
const index = list.indexOf(payload)
if (index === -1) return
list.splice(index, 1)
Vue.set(state, 'initializationList', list)
}, },
} }

1
src/store/socket/types.ts
View File

@ -7,5 +7,6 @@ export interface SocketState {
isConnecting: boolean isConnecting: boolean
connectingFailed: boolean connectingFailed: boolean
loadings: string[] loadings: string[]
initializationList: string[]
connection_id: number | null connection_id: number | null
} }

2
src/store/types.ts
View File

@ -25,6 +25,8 @@ export interface RootStateDependency {
} }
export interface ConfigJson { export interface ConfigJson {
hostname?: string | null
port?: string | number | null
remoteMode?: boolean remoteMode?: boolean
instances?: ConfigJsonInstance[] instances?: ConfigJsonInstance[]
} }