diff --git a/src/web/app/desktop/views/components/drive-window.vue b/src/web/app/desktop/views/components/drive-window.vue index 8ae48cf39f..3a072f4794 100644 --- a/src/web/app/desktop/views/components/drive-window.vue +++ b/src/web/app/desktop/views/components/drive-window.vue @@ -26,7 +26,7 @@ export default Vue.extend({ }, methods: { popout() { - const folder = (this.$refs.browser as any).folder; + const folder = (this.$refs.browser as any) ? (this.$refs.browser as any).folder : null; if (folder) { return `${url}/i/drive/folder/${folder.id}`; } else { diff --git a/src/web/app/desktop/views/components/settings.vue b/src/web/app/desktop/views/components/settings.vue index 01c41194e1..39d9be01da 100644 --- a/src/web/app/desktop/views/components/settings.vue +++ b/src/web/app/desktop/views/components/settings.vue @@ -23,6 +23,9 @@ ページを下までスクロールしたときに自動で追加のコンテンツを読み込みます。 + + ウィンドウが開かれるとき、ポップアウト(ブラウザ外に切り離す)可能なら自動でポップアウトします。この設定はブラウザに記憶されます。 +
@@ -206,6 +209,7 @@ export default Vue.extend({ latestVersion: undefined, checkingForUpdate: false, enableSounds: localStorage.getItem('enableSounds') == 'true', + autoPopout: localStorage.getItem('autoPopout') == 'true', soundVolume: localStorage.getItem('soundVolume') ? parseInt(localStorage.getItem('soundVolume'), 10) : 100, lang: localStorage.getItem('lang') || '', preventUpdate: localStorage.getItem('preventUpdate') == 'true', @@ -214,6 +218,9 @@ export default Vue.extend({ }; }, watch: { + autoPopout() { + localStorage.setItem('autoPopout', this.autoPopout ? 'true' : 'false'); + }, enableSounds() { localStorage.setItem('enableSounds', this.enableSounds ? 'true' : 'false'); }, diff --git a/src/web/app/desktop/views/components/window.vue b/src/web/app/desktop/views/components/window.vue index f525d6962c..42b2600dc4 100644 --- a/src/web/app/desktop/views/components/window.vue +++ b/src/web/app/desktop/views/components/window.vue @@ -72,6 +72,12 @@ export default Vue.extend({ } }, + data() { + return { + preventMount: false + }; + }, + computed: { isFlexible(): boolean { return this.height == null; @@ -89,11 +95,21 @@ export default Vue.extend({ }, created() { - // ウィンドウをウィンドウシステムに登録 - (this as any).os.windows.add(this); + if (localStorage.getItem('autoPopout') == 'true' && this.popoutUrl) { + this.popout(); + this.preventMount = true; + } else { + // ウィンドウをウィンドウシステムに登録 + (this as any).os.windows.add(this); + } }, mounted() { + if (this.preventMount) { + this.$destroy(); + return; + } + this.$nextTick(() => { const main = this.$refs.main as any; main.style.top = '15%'; @@ -180,21 +196,28 @@ export default Vue.extend({ }, popout() { - const main = this.$refs.main as any; - - const position = main.getBoundingClientRect(); - - const width = parseInt(getComputedStyle(main, '').width, 10); - const height = parseInt(getComputedStyle(main, '').height, 10); - const x = window.screenX + position.left; - const y = window.screenY + position.top; - const url = typeof this.popoutUrl == 'function' ? this.popoutUrl() : this.popoutUrl; - window.open(url, url, - `height=${height}, width=${width}, left=${x}, top=${y}`); + const main = this.$refs.main as any; - this.close(); + if (main) { + const position = main.getBoundingClientRect(); + + const width = parseInt(getComputedStyle(main, '').width, 10); + const height = parseInt(getComputedStyle(main, '').height, 10); + const x = window.screenX + position.left; + const y = window.screenY + position.top; + + window.open(url, url, + `width=${width}, height=${height}, top=${y}, left=${x}`); + + this.close(); + } else { + const x = window.top.outerHeight / 2 + window.top.screenY - (parseInt(this.height, 10) / 2); + const y = window.top.outerWidth / 2 + window.top.screenX - (parseInt(this.width, 10) / 2); + window.open(url, url, + `width=${this.width}, height=${this.height}, top=${x}, left=${y}`); + } }, // 最前面へ移動