diff --git a/src/models/page.ts b/src/models/page.ts index 6c12fac..d9eedcf 100644 --- a/src/models/page.ts +++ b/src/models/page.ts @@ -6,6 +6,7 @@ export interface InteractiveBlock { openAfterDestroy?: InteractiveBlockIds[]; closeBeforeMount?: InteractiveBlockIds[]; callbackBeforeClose?: Array<() => boolean>; + mayOpen?: () => boolean; } export interface PageTimestamp { diff --git a/src/store/app.ts b/src/store/app.ts index e06e028..01ed04a 100644 --- a/src/store/app.ts +++ b/src/store/app.ts @@ -31,8 +31,6 @@ export interface AppState extends AppSettings { users: LightdmUsers[]; } -let inputErrorTimer: null | any - @Module({ dynamic: true, store, name: 'app' }) class App extends VuexModule implements AppState { version = '2.0.0' diff --git a/src/store/page.ts b/src/store/page.ts index 8308651..f040a3d 100644 --- a/src/store/page.ts +++ b/src/store/page.ts @@ -6,25 +6,18 @@ import { Action } from 'vuex-module-decorators' import store from '@/store/index' -import { InteractiveBlock, InteractiveBlockIds, AppMenu, LoginPosition, AppMenuMain } from '@/models/page' +import { InteractiveBlock, InteractiveBlockIds, AppMenu, LoginPosition, AppMenuMain, DialogInterface } from '@/models/page' import { AppModule } from './app' -export interface PageState { - menu: AppMenuMain | AppMenu; - language: string; - languages: string[]; - loginPosition: LoginPosition; - activeBlocks: InteractiveBlock[]; - interactiveBlocks: InteractiveBlock[]; -} - @Module({ dynamic: true, store, name: 'page' }) -class Page extends VuexModule implements PageState { +class Page extends VuexModule { menu: AppMenuMain | AppMenu = { view: false, items: [] } + dialog: DialogInterface | null = null + mainTabIndex = 0 language = '' loginPosition: LoginPosition = 'center' @@ -33,7 +26,8 @@ class Page extends VuexModule implements PageState { interactiveBlocks: InteractiveBlock[] = [ { id: 'login', - closeBeforeMount: ['settings'] + closeBeforeMount: ['settings'], + mayOpen: () => !AppModule.viewThemeOnly }, { id: 'settings', @@ -79,9 +73,12 @@ class Page extends VuexModule implements PageState { @Mutation OPEN_ACTIVE_BLOCK(id: InteractiveBlockIds) { const activeBlock = this.interactiveBlocks.find((block) => block.id === id) - if (activeBlock) { - this.activeBlocks.push(activeBlock) - } + if (!activeBlock) { return } + + const canOpen = activeBlock?.mayOpen ? activeBlock?.mayOpen() : true + if (!canOpen) { return } + + this.activeBlocks.push(activeBlock) } @Mutation @@ -127,6 +124,19 @@ class Page extends VuexModule implements PageState { this.SET_STATE_PAGE({ key: 'mainTabIndex', value: updatedTabIndex }) } + @Action + openFirstBlock() { + for (let i = 0; i < this.interactiveBlocks.length; i++) { + const block = this.interactiveBlocks[i] + const open = block.mayOpen ? block.mayOpen() : true + + if (open) { + this.OPEN_ACTIVE_BLOCK(block.id) + break + } + } + } + @Action async openBlock(settings: { id: InteractiveBlockIds }) { settings = settings || {} @@ -158,6 +168,7 @@ class Page extends VuexModule implements PageState { if (!block) { return } const openBlocks = block.openAfterDestroy + if (openBlocks) { openBlocks.forEach((id) => this.OPEN_ACTIVE_BLOCK(id)) } @@ -171,6 +182,16 @@ class Page extends VuexModule implements PageState { this.CLOSE_ACTIVE_BLOCK(id) } } + + @Action + openDialog(dialog: DialogInterface) { + this.SET_STATE_PAGE({ key: 'dialog', value: dialog }) + } + + @Action + closeDialog() { + this.SET_STATE_PAGE({ key: 'dialog', value: null }) + } } export const PageModule = getModule(Page) diff --git a/src/views/Home.tsx b/src/views/Home.tsx index 94fd283..9b1edab 100644 --- a/src/views/Home.tsx +++ b/src/views/Home.tsx @@ -5,6 +5,7 @@ import { AppModule } from '@/store/app' import { PageModule } from '@/store/page' import AppMenu from '@/components/app/AppMenu' +import AppDialog from '@/components/app/AppDialog' import SettingsComponent from '@/components/base/SettingsComponent' import LoginComponent from '@/components/base/LoginComponent' import FrameRateBlock from '@/components/base/FrameRateBlock' @@ -40,6 +41,10 @@ export default class HomePage extends Vue { return PageModule.isOpenBlock('login') } + get isOpenBlock() { + return !!PageModule.activeBlock + } + get isOpenSettings() { return PageModule.isOpenBlock('settings') } @@ -48,6 +53,14 @@ export default class HomePage extends Vue { return AppModule.viewThemeOnly } + get isGithubMode() { + return AppModule.isGithubMode + } + + get showGithubButton() { + return this.isGithubMode && this.isOpenBlock + } + get showLogin() { return !this.isViewThemeOnly && this.isOpenLogin } @@ -71,7 +84,7 @@ export default class HomePage extends Vue { handleClick(event: MouseEvent) { if (!this.activeBlock) { - return PageModule.openBlock({ id: 'login' }) + return PageModule.openFirstBlock() } const target = event.target as Node @@ -98,7 +111,7 @@ export default class HomePage extends Vue { { !this.isViewThemeOnly && } - { !this.isViewThemeOnly && } + { this.showGithubButton && } }