From 08ee9e4eaffa4b6809440ec2cbe4daad084c00df Mon Sep 17 00:00:00 2001 From: syuilo Date: Sat, 10 Feb 2018 14:56:33 +0900 Subject: [PATCH] wip --- src/web/app/common/mios.ts | 4 +- src/web/app/desktop/router.ts | 2 +- src/web/app/desktop/script.ts | 15 ++- src/web/app/desktop/style.styl | 10 +- src/web/app/desktop/tags/pages/index.vue | 3 - src/web/app/desktop/views/components/index.ts | 5 + src/web/app/desktop/views/components/ui.vue | 6 + src/web/app/desktop/{tags => views}/home.vue | 2 - src/web/app/desktop/views/pages/home.vue | 17 +++ src/web/app/desktop/views/pages/index.vue | 17 +++ src/web/app/desktop/views/pages/welcome.vue | 119 ++++++++++++++++++ src/web/app/init.ts | 18 +-- src/web/app/mobile/router.ts | 2 +- webpack/module/rules/theme-color.ts | 2 +- 14 files changed, 193 insertions(+), 29 deletions(-) delete mode 100644 src/web/app/desktop/tags/pages/index.vue create mode 100644 src/web/app/desktop/views/components/index.ts create mode 100644 src/web/app/desktop/views/components/ui.vue rename src/web/app/desktop/{tags => views}/home.vue (99%) create mode 100644 src/web/app/desktop/views/pages/home.vue create mode 100644 src/web/app/desktop/views/pages/index.vue create mode 100644 src/web/app/desktop/views/pages/welcome.vue diff --git a/src/web/app/common/mios.ts b/src/web/app/common/mios.ts index 4ff2333e8a..e91def521b 100644 --- a/src/web/app/common/mios.ts +++ b/src/web/app/common/mios.ts @@ -38,7 +38,7 @@ export default class MiOS extends EventEmitter { /** * Whether signed in */ - public get isSignedin() { + public get isSignedIn() { return this.i != null; } @@ -251,7 +251,7 @@ export default class MiOS extends EventEmitter { if (!isSwSupported) return; // Reject when not signed in to Misskey - if (!this.isSignedin) return; + if (!this.isSignedIn) return; // When service worker activated navigator.serviceWorker.ready.then(registration => { diff --git a/src/web/app/desktop/router.ts b/src/web/app/desktop/router.ts index ce68c4f2d1..6ba8bda124 100644 --- a/src/web/app/desktop/router.ts +++ b/src/web/app/desktop/router.ts @@ -23,7 +23,7 @@ export default (mios: MiOS) => { route('*', notFound); function index() { - mios.isSignedin ? home() : entrance(); + mios.isSignedIn ? home() : entrance(); } function home() { diff --git a/src/web/app/desktop/script.ts b/src/web/app/desktop/script.ts index 4aef69b077..e4e5f19140 100644 --- a/src/web/app/desktop/script.ts +++ b/src/web/app/desktop/script.ts @@ -5,19 +5,17 @@ // Style import './style.styl'; -import Vue from 'vue'; import init from '../init'; import fuckAdBlock from './scripts/fuck-ad-block'; -import MiOS from '../common/mios'; import HomeStreamManager from '../common/scripts/streaming/home-stream-manager'; import composeNotification from '../common/scripts/compose-notification'; -import MkIndex from './tags/pages/index.vue'; +import MkIndex from './views/pages/index.vue'; /** * init */ -init(async (mios: MiOS, app: Vue) => { +init(async (os, launch) => { /** * Fuck AD Block */ @@ -33,12 +31,17 @@ init(async (mios: MiOS, app: Vue) => { } if ((Notification as any).permission == 'granted') { - registerNotifications(mios.stream); + registerNotifications(os.stream); } } + // Register components + require('./views/components'); + + const app = launch(); + app.$router.addRoutes([{ - path: '/', component: MkIndex, props: { os: mios } + path: '/', component: MkIndex, props: { os } }]); }, true); diff --git a/src/web/app/desktop/style.styl b/src/web/app/desktop/style.styl index c893e2ed67..4d295035f7 100644 --- a/src/web/app/desktop/style.styl +++ b/src/web/app/desktop/style.styl @@ -42,10 +42,10 @@ background rgba(0, 0, 0, 0.2) html + height 100% background #f7f7f7 - // ↓ workaround of https://github.com/riot/riot/issues/2134 - &[data-page='entrance'] - #wait - right auto - left 15px +body + display flex + flex-direction column + min-height 100% diff --git a/src/web/app/desktop/tags/pages/index.vue b/src/web/app/desktop/tags/pages/index.vue deleted file mode 100644 index 6bd036fc22..0000000000 --- a/src/web/app/desktop/tags/pages/index.vue +++ /dev/null @@ -1,3 +0,0 @@ - diff --git a/src/web/app/desktop/views/components/index.ts b/src/web/app/desktop/views/components/index.ts new file mode 100644 index 0000000000..f628dee883 --- /dev/null +++ b/src/web/app/desktop/views/components/index.ts @@ -0,0 +1,5 @@ +import Vue from 'vue'; + +import ui from './ui.vue'; + +Vue.component('mk-ui', ui); diff --git a/src/web/app/desktop/views/components/ui.vue b/src/web/app/desktop/views/components/ui.vue new file mode 100644 index 0000000000..34ac86f70c --- /dev/null +++ b/src/web/app/desktop/views/components/ui.vue @@ -0,0 +1,6 @@ + diff --git a/src/web/app/desktop/tags/home.vue b/src/web/app/desktop/views/home.vue similarity index 99% rename from src/web/app/desktop/tags/home.vue rename to src/web/app/desktop/views/home.vue index 981123c56a..d054127daf 100644 --- a/src/web/app/desktop/tags/home.vue +++ b/src/web/app/desktop/views/home.vue @@ -82,8 +82,6 @@ diff --git a/src/web/app/desktop/views/pages/index.vue b/src/web/app/desktop/views/pages/index.vue new file mode 100644 index 0000000000..dbe77e081b --- /dev/null +++ b/src/web/app/desktop/views/pages/index.vue @@ -0,0 +1,17 @@ + + + diff --git a/src/web/app/desktop/views/pages/welcome.vue b/src/web/app/desktop/views/pages/welcome.vue new file mode 100644 index 0000000000..a99a31d6b1 --- /dev/null +++ b/src/web/app/desktop/views/pages/welcome.vue @@ -0,0 +1,119 @@ + + + + + + + diff --git a/src/web/app/init.ts b/src/web/app/init.ts index 91797a95ac..796a966940 100644 --- a/src/web/app/init.ts +++ b/src/web/app/init.ts @@ -61,22 +61,24 @@ if (localStorage.getItem('should-refresh') == 'true') { } // MiOSを初期化してコールバックする -export default (callback, sw = false) => { +export default (callback: (os: MiOS, launch: () => Vue) => void, sw = false) => { const mios = new MiOS(sw); mios.init(() => { // アプリ基底要素マウント document.body.innerHTML = '
'; - const app = new Vue({ - router: new VueRouter({ - mode: 'history' - }), - render: createEl => createEl(App) - }).$mount('#app'); + const launch = () => { + return new Vue({ + router: new VueRouter({ + mode: 'history' + }), + render: createEl => createEl(App) + }).$mount('#app'); + }; try { - callback(mios, app); + callback(mios, launch); } catch (e) { panic(e); } diff --git a/src/web/app/mobile/router.ts b/src/web/app/mobile/router.ts index afb9aa6201..050fa7fc2b 100644 --- a/src/web/app/mobile/router.ts +++ b/src/web/app/mobile/router.ts @@ -32,7 +32,7 @@ export default (mios: MiOS) => { route('*', notFound); function index() { - mios.isSignedin ? home() : entrance(); + mios.isSignedIn ? home() : entrance(); } function home() { diff --git a/webpack/module/rules/theme-color.ts b/webpack/module/rules/theme-color.ts index 7ee545191c..a65338465a 100644 --- a/webpack/module/rules/theme-color.ts +++ b/webpack/module/rules/theme-color.ts @@ -8,7 +8,7 @@ const constants = require('../../../src/const.json'); export default () => ({ enforce: 'pre', - test: /\.tag$/, + test: /\.vue$/, exclude: /node_modules/, loader: StringReplacePlugin.replace({ replacements: [