From da464b2f40ccceebd9d46284a20f2f075857edc0 Mon Sep 17 00:00:00 2001 From: Kalila L Date: Sun, 5 Sep 2021 21:21:16 -0400 Subject: [PATCH] Got login working. --- .../resources/web/web-new/.eslintrc.js | 3 +- .../resources/web/web-new/quasar.conf.js | 78 +++++----- .../resources/web/web-new/src/App.vue | 4 +- .../resources/web/web-new/src/boot/axios.ts | 8 +- .../components/login/MetaverseLogin.vue | 139 ++++++++++++++++++ .../components/dialogs/ConnectMetaverse.vue | 44 ++++++ .../resources/web/web-new/src/env.d.ts | 2 +- .../web-new/src/layouts/FirstTimeWizard.vue | 12 +- .../web/web-new/src/modules/utilities/log.ts | 60 ++++++++ .../web/web-new/src/pages/Error404.vue | 4 +- .../src/pages/FirstTimeWizard/Index.vue | 45 +++--- .../resources/web/web-new/src/pages/Index.vue | 4 +- .../resources/web/web-new/src/router/index.ts | 12 +- .../web/web-new/src/router/routes.ts | 18 +-- .../resources/web/web-new/src/shims-vue.d.ts | 4 +- .../resources/web/web-new/src/store/index.ts | 40 ++--- .../src/store/module-example/actions.ts | 11 -- .../src/store/module-example/getters.ts | 11 -- .../web-new/src/store/module-example/index.ts | 16 -- .../src/store/module-example/mutations.ts | 10 -- .../web-new/src/store/module-example/state.ts | 11 -- .../web/web-new/src/store/modules/actions.ts | 11 ++ .../web/web-new/src/store/modules/getters.ts | 11 ++ .../web/web-new/src/store/modules/index.ts | 16 ++ .../web-new/src/store/modules/mutations.ts | 10 ++ .../web/web-new/src/store/modules/state.ts | 11 ++ 26 files changed, 427 insertions(+), 168 deletions(-) create mode 100644 domain-server/resources/web/web-new/src/components/components/login/MetaverseLogin.vue create mode 100644 domain-server/resources/web/web-new/src/components/dialogs/ConnectMetaverse.vue create mode 100644 domain-server/resources/web/web-new/src/modules/utilities/log.ts delete mode 100644 domain-server/resources/web/web-new/src/store/module-example/actions.ts delete mode 100644 domain-server/resources/web/web-new/src/store/module-example/getters.ts delete mode 100644 domain-server/resources/web/web-new/src/store/module-example/index.ts delete mode 100644 domain-server/resources/web/web-new/src/store/module-example/mutations.ts delete mode 100644 domain-server/resources/web/web-new/src/store/module-example/state.ts create mode 100644 domain-server/resources/web/web-new/src/store/modules/actions.ts create mode 100644 domain-server/resources/web/web-new/src/store/modules/getters.ts create mode 100644 domain-server/resources/web/web-new/src/store/modules/index.ts create mode 100644 domain-server/resources/web/web-new/src/store/modules/mutations.ts create mode 100644 domain-server/resources/web/web-new/src/store/modules/state.ts diff --git a/domain-server/resources/web/web-new/.eslintrc.js b/domain-server/resources/web/web-new/.eslintrc.js index e767e0d16c..feae4d56de 100644 --- a/domain-server/resources/web/web-new/.eslintrc.js +++ b/domain-server/resources/web/web-new/.eslintrc.js @@ -91,7 +91,7 @@ module.exports = { 'semi': ["error", "always"], // TypeScript - quotes: ['warn', 'single', { avoidEscape: true }], + quotes: ['warn', 'double', { avoidEscape: true }], '@typescript-eslint/explicit-function-return-type': 'off', '@typescript-eslint/explicit-module-boundary-types': 'off', @@ -101,6 +101,7 @@ module.exports = { '@typescript-eslint/unbound-method': 'off', '@typescript-eslint/no-unsafe-member-access': 'off', '@typescript-eslint/no-floating-promises': 'off', + '@typescript-eslint/restrict-template-expressions': 'off', // allow debugger during development only 'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off' diff --git a/domain-server/resources/web/web-new/quasar.conf.js b/domain-server/resources/web/web-new/quasar.conf.js index 5d710be10b..c572b7bdca 100644 --- a/domain-server/resources/web/web-new/quasar.conf.js +++ b/domain-server/resources/web/web-new/quasar.conf.js @@ -8,7 +8,7 @@ /* eslint-env node */ /* eslint-disable @typescript-eslint/no-var-requires */ -const { configure } = require('quasar/wrappers'); +const { configure } = require("quasar/wrappers"); module.exports = configure(function (ctx) { return { @@ -17,7 +17,7 @@ module.exports = configure(function (ctx) { tsCheckerConfig: { eslint: { enabled: true, - files: './src/**/*.{ts,tsx,js,jsx,vue}' + files: "./src/**/*.{ts,tsx,js,jsx,vue}" } } }, @@ -29,12 +29,12 @@ module.exports = configure(function (ctx) { // --> boot files are part of "main.js" // https://v2.quasar.dev/quasar-cli/boot-files boot: [ - 'axios' + "axios" ], // https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css css: [ - 'app.scss' + "app.scss" ], // https://github.com/quasarframework/quasar/tree/dev/extras @@ -47,13 +47,13 @@ module.exports = configure(function (ctx) { // 'line-awesome', // 'roboto-font-latin-ext', // this or either 'roboto-font', NEVER both! - 'roboto-font', // optional, you are not bound to it - 'material-icons' // optional, you are not bound to it + "roboto-font", // optional, you are not bound to it + "material-icons" // optional, you are not bound to it ], // Full list of options: https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-build build: { - vueRouterMode: 'hash', // available values: 'hash', 'history' + vueRouterMode: "hash", // available values: 'hash', 'history' // transpile: false, @@ -87,7 +87,9 @@ module.exports = configure(function (ctx) { // https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-framework framework: { - config: {}, + config: { + dark: 'auto' + }, // iconSet: 'material-icons', // Quasar icon set // lang: 'en-US', // Quasar language pack @@ -100,12 +102,14 @@ module.exports = configure(function (ctx) { // directives: [], // Quasar plugins - plugins: [] + plugins: [ + 'Notify' + ] }, // animations: 'all', // --- includes all animations // https://v2.quasar.dev/options/animations - animations: 'all', + animations: "all", // https://v2.quasar.dev/quasar-cli/developing-ssr/configuring-ssr ssr: { @@ -125,14 +129,14 @@ module.exports = configure(function (ctx) { }, middlewares: [ - ctx.prod ? 'compression' : '', - 'render' // keep this as last one + ctx.prod ? "compression" : "", + "render" // keep this as last one ] }, // https://v2.quasar.dev/quasar-cli/developing-pwa/configuring-pwa pwa: { - workboxPluginMode: 'GenerateSW', // 'GenerateSW' or 'InjectManifest' + workboxPluginMode: "GenerateSW", // 'GenerateSW' or 'InjectManifest' workboxOptions: {}, // only for GenerateSW // for the custom service worker ONLY (/src-pwa/custom-service-worker.[js|ts]) @@ -142,38 +146,38 @@ module.exports = configure(function (ctx) { }, manifest: { - name: 'Vircadia Domain Dashboard', - short_name: 'Vircadia Domain Dashboard', - description: 'The Domain dashboard for Vircadia virtual worlds.', - display: 'standalone', - orientation: 'portrait', - background_color: '#ffffff', - theme_color: '#027be3', + name: "Vircadia Domain Dashboard", + short_name: "Vircadia Domain Dashboard", + description: "The Domain dashboard for Vircadia virtual worlds.", + display: "standalone", + orientation: "portrait", + background_color: "#ffffff", + theme_color: "#027be3", icons: [ { - src: 'icons/icon-128x128.png', - sizes: '128x128', - type: 'image/png' + src: "icons/icon-128x128.png", + sizes: "128x128", + type: "image/png" }, { - src: 'icons/icon-192x192.png', - sizes: '192x192', - type: 'image/png' + src: "icons/icon-192x192.png", + sizes: "192x192", + type: "image/png" }, { - src: 'icons/icon-256x256.png', - sizes: '256x256', - type: 'image/png' + src: "icons/icon-256x256.png", + sizes: "256x256", + type: "image/png" }, { - src: 'icons/icon-384x384.png', - sizes: '384x384', - type: 'image/png' + src: "icons/icon-384x384.png", + sizes: "384x384", + type: "image/png" }, { - src: 'icons/icon-512x512.png', - sizes: '512x512', - type: 'image/png' + src: "icons/icon-512x512.png", + sizes: "512x512", + type: "image/png" } ] } @@ -191,7 +195,7 @@ module.exports = configure(function (ctx) { // Full list of options: https://v2.quasar.dev/quasar-cli/developing-electron-apps/configuring-electron electron: { - bundler: 'packager', // 'packager' or 'builder' + bundler: "packager", // 'packager' or 'builder' packager: { // https://github.com/electron-userland/electron-packager/blob/master/docs/api.md#options @@ -209,7 +213,7 @@ module.exports = configure(function (ctx) { builder: { // https://www.electron.build/configuration/configuration - appId: 'vircadia-domain-dashboard' + appId: "vircadia-domain-dashboard" }, // "chain" is a webpack-chain object https://github.com/neutrinojs/webpack-chain diff --git a/domain-server/resources/web/web-new/src/App.vue b/domain-server/resources/web/web-new/src/App.vue index 1918a1bc81..6258269c4b 100644 --- a/domain-server/resources/web/web-new/src/App.vue +++ b/domain-server/resources/web/web-new/src/App.vue @@ -2,9 +2,9 @@ diff --git a/domain-server/resources/web/web-new/src/boot/axios.ts b/domain-server/resources/web/web-new/src/boot/axios.ts index 29a45500fc..6572173f84 100644 --- a/domain-server/resources/web/web-new/src/boot/axios.ts +++ b/domain-server/resources/web/web-new/src/boot/axios.ts @@ -1,7 +1,7 @@ -import { boot } from 'quasar/wrappers'; -import axios, { AxiosInstance } from 'axios'; +import { boot } from "quasar/wrappers"; +import axios, { AxiosInstance } from "axios"; -declare module '@vue/runtime-core' { +declare module "@vue/runtime-core" { interface ComponentCustomProperties { $axios: AxiosInstance; } @@ -13,7 +13,7 @@ declare module '@vue/runtime-core' { // good idea to move this instance creation inside of the // "export default () => {}" function below (which runs individually // for each client) -const api = axios.create({ baseURL: 'https://api.example.com' }); +const api = axios.create({ baseURL: "https://api.example.com" }); export default boot(({ app }) => { // for use inside Vue files (Options API) through this.$axios and this.$api diff --git a/domain-server/resources/web/web-new/src/components/components/login/MetaverseLogin.vue b/domain-server/resources/web/web-new/src/components/components/login/MetaverseLogin.vue new file mode 100644 index 0000000000..65eb3c539c --- /dev/null +++ b/domain-server/resources/web/web-new/src/components/components/login/MetaverseLogin.vue @@ -0,0 +1,139 @@ + + + + + diff --git a/domain-server/resources/web/web-new/src/components/dialogs/ConnectMetaverse.vue b/domain-server/resources/web/web-new/src/components/dialogs/ConnectMetaverse.vue new file mode 100644 index 0000000000..ce545cccc5 --- /dev/null +++ b/domain-server/resources/web/web-new/src/components/dialogs/ConnectMetaverse.vue @@ -0,0 +1,44 @@ + + + + + diff --git a/domain-server/resources/web/web-new/src/env.d.ts b/domain-server/resources/web/web-new/src/env.d.ts index 12dcd189fe..0f5c68a130 100644 --- a/domain-server/resources/web/web-new/src/env.d.ts +++ b/domain-server/resources/web/web-new/src/env.d.ts @@ -1,7 +1,7 @@ declare namespace NodeJS { interface ProcessEnv { NODE_ENV: string; - VUE_ROUTER_MODE: 'hash' | 'history' | 'abstract' | undefined; + VUE_ROUTER_MODE: "hash" | "history" | "abstract" | undefined; VUE_ROUTER_BASE: string | undefined; } } diff --git a/domain-server/resources/web/web-new/src/layouts/FirstTimeWizard.vue b/domain-server/resources/web/web-new/src/layouts/FirstTimeWizard.vue index 7fca47dd85..664e66a9e5 100644 --- a/domain-server/resources/web/web-new/src/layouts/FirstTimeWizard.vue +++ b/domain-server/resources/web/web-new/src/layouts/FirstTimeWizard.vue @@ -9,12 +9,12 @@ diff --git a/domain-server/resources/web/web-new/src/pages/FirstTimeWizard/Index.vue b/domain-server/resources/web/web-new/src/pages/FirstTimeWizard/Index.vue index 7ba0a2ac45..3cd793b1f0 100644 --- a/domain-server/resources/web/web-new/src/pages/FirstTimeWizard/Index.vue +++ b/domain-server/resources/web/web-new/src/pages/FirstTimeWizard/Index.vue @@ -63,6 +63,10 @@ .q-dialog__inner div { box-shadow: none !important; } + + .q-dialog__inner div { + border: none !important; + } diff --git a/domain-server/resources/web/web-new/src/router/index.ts b/domain-server/resources/web/web-new/src/router/index.ts index b6a4bba0ed..c34151b382 100644 --- a/domain-server/resources/web/web-new/src/router/index.ts +++ b/domain-server/resources/web/web-new/src/router/index.ts @@ -1,12 +1,12 @@ -import { route } from 'quasar/wrappers'; +import { route } from "quasar/wrappers"; import { createMemoryHistory, createRouter, createWebHashHistory, createWebHistory -} from 'vue-router'; -import { StateInterface } from '../store'; -import routes from './routes'; +} from "vue-router"; +import { StateInterface } from "../store"; +import routes from "./routes"; /* * If not building with SSR mode, you can @@ -20,7 +20,7 @@ import routes from './routes'; export default route(function (/* { store, ssrContext } */) { const createHistory = process.env.SERVER ? createMemoryHistory - : (process.env.VUE_ROUTER_MODE === 'history' ? createWebHistory : createWebHashHistory); + : (process.env.VUE_ROUTER_MODE === "history" ? createWebHistory : createWebHashHistory); const Router = createRouter({ scrollBehavior: () => ({ left: 0, top: 0 }), @@ -30,7 +30,7 @@ export default route(function (/* { store, ssrContext } */) { // quasar.conf.js -> build -> vueRouterMode // quasar.conf.js -> build -> publicPath history: createHistory( - process.env.MODE === 'ssr' ? void 0 : process.env.VUE_ROUTER_BASE + process.env.MODE === "ssr" ? void 0 : process.env.VUE_ROUTER_BASE ) }); diff --git a/domain-server/resources/web/web-new/src/router/routes.ts b/domain-server/resources/web/web-new/src/router/routes.ts index c12e0b8674..4b0cdd6380 100644 --- a/domain-server/resources/web/web-new/src/router/routes.ts +++ b/domain-server/resources/web/web-new/src/router/routes.ts @@ -1,22 +1,22 @@ -import { RouteRecordRaw } from 'vue-router'; +import { RouteRecordRaw } from "vue-router"; const routes: RouteRecordRaw[] = [ { - path: '/', - component: () => import('pages/Index.vue'), - children: [{ path: '', component: () => import('pages/Index.vue') }] + path: "/", + component: () => import("pages/Index.vue"), + children: [{ path: "", component: () => import("pages/Index.vue") }] }, { - path: '/wizard', - component: () => import('layouts/FirstTimeWizard.vue'), - children: [{ path: '', component: () => import('pages/FirstTimeWizard/Index.vue') }] + path: "/wizard", + component: () => import("layouts/FirstTimeWizard.vue"), + children: [{ path: "", component: () => import("pages/FirstTimeWizard/Index.vue") }] }, // Always leave this as last one, // but you can also remove it { - path: '/:catchAll(.*)*', - component: () => import('pages/Error404.vue') + path: "/:catchAll(.*)*", + component: () => import("pages/Error404.vue") } ]; diff --git a/domain-server/resources/web/web-new/src/shims-vue.d.ts b/domain-server/resources/web/web-new/src/shims-vue.d.ts index 194793619c..67e0a928c2 100644 --- a/domain-server/resources/web/web-new/src/shims-vue.d.ts +++ b/domain-server/resources/web/web-new/src/shims-vue.d.ts @@ -1,6 +1,6 @@ // Mocks all files ending in `.vue` showing them as plain Vue instances -declare module '*.vue' { - import { ComponentOptions } from 'vue'; +declare module "*.vue" { + import { ComponentOptions } from "vue"; const component: ComponentOptions; export default component; } diff --git a/domain-server/resources/web/web-new/src/store/index.ts b/domain-server/resources/web/web-new/src/store/index.ts index 95352cdc04..2bd16bf3c4 100644 --- a/domain-server/resources/web/web-new/src/store/index.ts +++ b/domain-server/resources/web/web-new/src/store/index.ts @@ -1,39 +1,39 @@ -import { store } from 'quasar/wrappers'; -import { InjectionKey } from 'vue'; +import { store } from "quasar/wrappers"; +import { InjectionKey } from "vue"; import { createStore, Store as VuexStore, useStore as vuexUseStore -} from 'vuex'; +} from "vuex"; // import example from './module-example' -// import { ExampleStateInterface } from './module-example/state'; +import { MainState } from "./modules/state"; /* - * If not building with SSR mode, you can - * directly export the Store instantiation; - * - * The function below can be async too; either use - * async/await or return a Promise which resolves - * with the Store instance. - */ +* If not building with SSR mode, you can +* directly export the Store instantiation; +* +* The function below can be async too; either use +* async/await or return a Promise which resolves +* with the Store instance. +*/ export interface StateInterface { - // Define your own store structure, using submodules if needed - // example: ExampleStateInterface; - // Declared as unknown to avoid linting issue. Best to strongly type as per the line above. - example: unknown + // Define your own store structure, using submodules if needed + // example: ExampleStateInterface; + // Declared as unknown to avoid linting issue. Best to strongly type as per the line above. + MainState: MainState } // provide typings for `this.$store` -declare module '@vue/runtime-core' { - interface ComponentCustomProperties { - $store: VuexStore - } +declare module "@vue/runtime-core" { + interface ComponentCustomProperties { + $store: VuexStore + } } // provide typings for `useStore` helper -export const storeKey: InjectionKey> = Symbol('vuex-key'); +export const storeKey: InjectionKey> = Symbol("vuex-key"); export default store(function (/* { ssrContext } */) { const Store = createStore({ diff --git a/domain-server/resources/web/web-new/src/store/module-example/actions.ts b/domain-server/resources/web/web-new/src/store/module-example/actions.ts deleted file mode 100644 index 20c77c84c6..0000000000 --- a/domain-server/resources/web/web-new/src/store/module-example/actions.ts +++ /dev/null @@ -1,11 +0,0 @@ -import { ActionTree } from 'vuex'; -import { StateInterface } from '../index'; -import { ExampleStateInterface } from './state'; - -const actions: ActionTree = { - someAction (/* context */) { - // your code - } -}; - -export default actions; diff --git a/domain-server/resources/web/web-new/src/store/module-example/getters.ts b/domain-server/resources/web/web-new/src/store/module-example/getters.ts deleted file mode 100644 index 30c8f3dca1..0000000000 --- a/domain-server/resources/web/web-new/src/store/module-example/getters.ts +++ /dev/null @@ -1,11 +0,0 @@ -import { GetterTree } from 'vuex'; -import { StateInterface } from '../index'; -import { ExampleStateInterface } from './state'; - -const getters: GetterTree = { - someAction (/* context */) { - // your code - } -}; - -export default getters; diff --git a/domain-server/resources/web/web-new/src/store/module-example/index.ts b/domain-server/resources/web/web-new/src/store/module-example/index.ts deleted file mode 100644 index 4a81f2502a..0000000000 --- a/domain-server/resources/web/web-new/src/store/module-example/index.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { Module } from 'vuex'; -import { StateInterface } from '../index'; -import state, { ExampleStateInterface } from './state'; -import actions from './actions'; -import getters from './getters'; -import mutations from './mutations'; - -const exampleModule: Module = { - namespaced: true, - actions, - getters, - mutations, - state -}; - -export default exampleModule; diff --git a/domain-server/resources/web/web-new/src/store/module-example/mutations.ts b/domain-server/resources/web/web-new/src/store/module-example/mutations.ts deleted file mode 100644 index db1fd6c262..0000000000 --- a/domain-server/resources/web/web-new/src/store/module-example/mutations.ts +++ /dev/null @@ -1,10 +0,0 @@ -import { MutationTree } from 'vuex'; -import { ExampleStateInterface } from './state'; - -const mutation: MutationTree = { - someMutation (/* state: ExampleStateInterface */) { - // your code - } -}; - -export default mutation; diff --git a/domain-server/resources/web/web-new/src/store/module-example/state.ts b/domain-server/resources/web/web-new/src/store/module-example/state.ts deleted file mode 100644 index c3c67ad7d2..0000000000 --- a/domain-server/resources/web/web-new/src/store/module-example/state.ts +++ /dev/null @@ -1,11 +0,0 @@ -export interface ExampleStateInterface { - prop: boolean; -} - -function state (): ExampleStateInterface { - return { - prop: false - }; -} - -export default state; diff --git a/domain-server/resources/web/web-new/src/store/modules/actions.ts b/domain-server/resources/web/web-new/src/store/modules/actions.ts new file mode 100644 index 0000000000..8db54a9ba5 --- /dev/null +++ b/domain-server/resources/web/web-new/src/store/modules/actions.ts @@ -0,0 +1,11 @@ +import { ActionTree } from "vuex"; +import { StateInterface } from "../index"; +import { MainState } from "./state"; + +const actions: ActionTree = { + someAction (/* context */) { + // your code + } +}; + +export default actions; diff --git a/domain-server/resources/web/web-new/src/store/modules/getters.ts b/domain-server/resources/web/web-new/src/store/modules/getters.ts new file mode 100644 index 0000000000..a3a411a706 --- /dev/null +++ b/domain-server/resources/web/web-new/src/store/modules/getters.ts @@ -0,0 +1,11 @@ +import { GetterTree } from "vuex"; +import { StateInterface } from "../index"; +import { MainState } from "./state"; + +const getters: GetterTree = { + someAction (/* context */) { + // your code + } +}; + +export default getters; diff --git a/domain-server/resources/web/web-new/src/store/modules/index.ts b/domain-server/resources/web/web-new/src/store/modules/index.ts new file mode 100644 index 0000000000..639672a577 --- /dev/null +++ b/domain-server/resources/web/web-new/src/store/modules/index.ts @@ -0,0 +1,16 @@ +import { Module } from "vuex"; +import { StateInterface } from "../index"; +import state, { MainState } from "./state"; +import actions from "./actions"; +import getters from "./getters"; +import mutations from "./mutations"; + +const exampleModule: Module = { + namespaced: true, + actions, + getters, + mutations, + state +}; + +export default exampleModule; diff --git a/domain-server/resources/web/web-new/src/store/modules/mutations.ts b/domain-server/resources/web/web-new/src/store/modules/mutations.ts new file mode 100644 index 0000000000..99586510d3 --- /dev/null +++ b/domain-server/resources/web/web-new/src/store/modules/mutations.ts @@ -0,0 +1,10 @@ +import { MutationTree } from "vuex"; +import { MainState } from "./state"; + +const mutation: MutationTree = { + someMutation (/* state: ExampleStateInterface */) { + // your code + } +}; + +export default mutation; diff --git a/domain-server/resources/web/web-new/src/store/modules/state.ts b/domain-server/resources/web/web-new/src/store/modules/state.ts new file mode 100644 index 0000000000..c0b924ebcd --- /dev/null +++ b/domain-server/resources/web/web-new/src/store/modules/state.ts @@ -0,0 +1,11 @@ +export interface MainState { + prop: boolean; +} + +function state (): MainState { + return { + prop: false + }; +} + +export default state;