wip

14 files changed, 102 insertions, 126 deletions

diff --git a/src/web/app/common/mios.ts b/src/web/app/common/mios.ts
index e3a66f5b11..e20f4bfe4e 100644
--- a/src/web/app/common/mios.ts
+++ b/src/web/app/common/mios.ts
@@ -67,6 +67,16 @@ export default class MiOS extends EventEmitter {
 
 	private isMetaFetching = false;
 
+	public app: Vue;
+
+	public new(vm, props) {
+		const w = new vm({
+			parent: this.app,
+			propsData: props
+		}).$mount();
+		document.body.appendChild(w.$el);
+	}
+
 	/**
 	 * A signing user
 	 */
diff --git a/src/web/app/desktop/views/components/drive.vue b/src/web/app/desktop/views/components/drive.vue
index e256bc6af2..0dcf077017 100644
--- a/src/web/app/desktop/views/components/drive.vue
+++ b/src/web/app/desktop/views/components/drive.vue
@@ -376,11 +376,9 @@ export default Vue.extend({
 		},
 
 		newWindow(folder) {
-			document.body.appendChild(new MkDriveWindow({
-				propsData: {
-					folder: folder
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkDriveWindow, {
+				folder: folder
+			});
 		},
 
 		move(target) {
diff --git a/src/web/app/desktop/views/components/images-image.vue b/src/web/app/desktop/views/components/images-image.vue
index cb6c529f79..5b7dc41739 100644
--- a/src/web/app/desktop/views/components/images-image.vue
+++ b/src/web/app/desktop/views/components/images-image.vue
@@ -39,11 +39,9 @@ export default Vue.extend({
 		},
 
 		onClick() {
-			document.body.appendChild(new MkImagesImageDialog({
-				propsData: {
-					image: this.image
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkImagesImageDialog, {
+				image: this.image
+			});
 		}
 	}
 });
diff --git a/src/web/app/desktop/views/components/messaging-window.vue b/src/web/app/desktop/views/components/messaging-window.vue
index eeeb97e345..ac27465987 100644
--- a/src/web/app/desktop/views/components/messaging-window.vue
+++ b/src/web/app/desktop/views/components/messaging-window.vue
@@ -12,11 +12,9 @@ import MkMessagingRoomWindow from './messaging-room-window.vue';
 export default Vue.extend({
 	methods: {
 		navigate(user) {
-			document.body.appendChild(new MkMessagingRoomWindow({
-				propsData: {
-					user: user
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkMessagingRoomWindow, {
+				user: user
+			});
 		}
 	}
 });
diff --git a/src/web/app/desktop/views/components/post-detail.vue b/src/web/app/desktop/views/components/post-detail.vue
index cac4671c54..c453867dfb 100644
--- a/src/web/app/desktop/views/components/post-detail.vue
+++ b/src/web/app/desktop/views/components/post-detail.vue
@@ -148,34 +148,26 @@ export default Vue.extend({
 			});
 		},
 		reply() {
-			document.body.appendChild(new MkPostFormWindow({
-				propsData: {
-					reply: this.p
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkPostFormWindow, {
+				reply: this.p
+			});
 		},
 		repost() {
-			document.body.appendChild(new MkRepostFormWindow({
-				propsData: {
-					post: this.p
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkRepostFormWindow, {
+				post: this.p
+			});
 		},
 		react() {
-			document.body.appendChild(new MkReactionPicker({
-				propsData: {
-					source: this.$refs.reactButton,
-					post: this.p
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkReactionPicker, {
+				source: this.$refs.reactButton,
+				post: this.p
+			});
 		},
 		menu() {
-			document.body.appendChild(new MkPostMenu({
-				propsData: {
-					source: this.$refs.menuButton,
-					post: this.p
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkPostMenu, {
+				source: this.$refs.menuButton,
+				post: this.p
+			});
 		}
 	}
 });
diff --git a/src/web/app/desktop/views/components/posts.post.vue b/src/web/app/desktop/views/components/posts.post.vue
index 24f7b5e123..6fe097909b 100644
--- a/src/web/app/desktop/views/components/posts.post.vue
+++ b/src/web/app/desktop/views/components/posts.post.vue
@@ -186,34 +186,26 @@ export default Vue.extend({
 			}
 		},
 		reply() {
-			document.body.appendChild(new MkPostFormWindow({
-				propsData: {
-					reply: this.p
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkPostFormWindow, {
+				reply: this.p
+			});
 		},
 		repost() {
-			document.body.appendChild(new MkRepostFormWindow({
-				propsData: {
-					post: this.p
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkRepostFormWindow, {
+				post: this.p
+			});
 		},
 		react() {
-			document.body.appendChild(new MkReactionPicker({
-				propsData: {
-					source: this.$refs.reactButton,
-					post: this.p
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkReactionPicker, {
+				source: this.$refs.reactButton,
+				post: this.p
+			});
 		},
 		menu() {
-			document.body.appendChild(new MkPostMenu({
-				propsData: {
-					source: this.$refs.menuButton,
-					post: this.p
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkPostMenu, {
+				source: this.$refs.menuButton,
+				post: this.p
+			});
 		},
 		onKeydown(e) {
 			let shouldBeCancel = true;
diff --git a/src/web/app/desktop/views/components/ui.header.account.vue b/src/web/app/desktop/views/components/ui.header.account.vue
index 3728f94be8..af58e81a04 100644
--- a/src/web/app/desktop/views/components/ui.header.account.vue
+++ b/src/web/app/desktop/views/components/ui.header.account.vue
@@ -70,11 +70,11 @@ export default Vue.extend({
 		},
 		drive() {
 			this.close();
-			document.body.appendChild(new MkDriveWindow().$mount().$el);
+			(this as any).os.new(MkDriveWindow);
 		},
 		settings() {
 			this.close();
-			document.body.appendChild(new MkSettingsWindow().$mount().$el);
+			(this as any).os.new(MkSettingsWindow);
 		}
 	}
 });
diff --git a/src/web/app/desktop/views/components/ui.header.nav.vue b/src/web/app/desktop/views/components/ui.header.nav.vue
index 70c616d9c7..c102d5b3f5 100644
--- a/src/web/app/desktop/views/components/ui.header.nav.vue
+++ b/src/web/app/desktop/views/components/ui.header.nav.vue
@@ -79,7 +79,7 @@ export default Vue.extend({
 		},
 
 		messaging() {
-			document.body.appendChild(new MkMessagingWindow().$mount().$el);
+			(this as any).os.new(MkMessagingWindow);
 		}
 	}
 });
diff --git a/src/web/app/desktop/views/components/widgets/messaging.vue b/src/web/app/desktop/views/components/widgets/messaging.vue
index e510a07dc4..ae7d6934af 100644
--- a/src/web/app/desktop/views/components/widgets/messaging.vue
+++ b/src/web/app/desktop/views/components/widgets/messaging.vue
@@ -17,11 +17,9 @@ export default define({
 }).extend({
 	methods: {
 		navigate(user) {
-			document.body.appendChild(new MkMessagingRoomWindow({
-				propsData: {
-					user: user
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkMessagingRoomWindow, {
+				user: user
+			});
 		},
 		func() {
 			if (this.props.design == 1) {
diff --git a/src/web/app/desktop/views/pages/user/user.profile.vue b/src/web/app/desktop/views/pages/user/user.profile.vue
index b55787c95c..ceca829ace 100644
--- a/src/web/app/desktop/views/pages/user/user.profile.vue
+++ b/src/web/app/desktop/views/pages/user/user.profile.vue
@@ -36,21 +36,15 @@ export default Vue.extend({
 	},
 	methods: {
 		showFollowing() {
-			document.body.appendChild(new MkFollowingWindow({
-				parent: this,
-				propsData: {
-					user: this.user
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkFollowingWindow, {
+				user: this.user
+			});
 		},
 
 		showFollowers() {
-			document.body.appendChild(new MkFollowersWindow({
-				parent: this,
-				propsData: {
-					user: this.user
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkFollowersWindow, {
+				user: this.user
+			});
 		},
 
 		mute() {
diff --git a/src/web/app/init.ts b/src/web/app/init.ts
index e4cb8f8bc0..ac567c5023 100644
--- a/src/web/app/init.ts
+++ b/src/web/app/init.ts
@@ -87,8 +87,26 @@ export default (callback: (launch: (api: (os: MiOS) => API) => [Vue, MiOS]) => v
 		// アプリ基底要素マウント
 		document.body.innerHTML = '<div id="app"></div>';
 
+		const app = new Vue({
+			router: new VueRouter({
+				mode: 'history'
+			}),
+			created() {
+				this.$watch('os.i', i => {
+					// キャッシュ更新
+					localStorage.setItem('me', JSON.stringify(i));
+				}, {
+					deep: true
+				});
+			},
+			render: createEl => createEl(App)
+		});
+
+		os.app = app;
+
 		const launch = (api: (os: MiOS) => API) => {
 			os.apis = api(os);
+
 			Vue.mixin({
 				data() {
 					return {
@@ -99,20 +117,8 @@ export default (callback: (launch: (api: (os: MiOS) => API) => [Vue, MiOS]) => v
 				}
 			});
 
-			const app = new Vue({
-				router: new VueRouter({
-					mode: 'history'
-				}),
-				created() {
-					this.$watch('os.i', i => {
-						// キャッシュ更新
-						localStorage.setItem('me', JSON.stringify(i));
-					}, {
-						deep: true
-					});
-				},
-				render: createEl => createEl(App)
-			}).$mount('#app');
+			// マウント
+			app.$mount('#app');
 
 			return [app, os] as [Vue, MiOS];
 		};
diff --git a/src/web/app/mobile/views/components/post-detail.vue b/src/web/app/mobile/views/components/post-detail.vue
index 76057525f0..e7c08df7e9 100644
--- a/src/web/app/mobile/views/components/post-detail.vue
+++ b/src/web/app/mobile/views/components/post-detail.vue
@@ -154,22 +154,18 @@ export default Vue.extend({
 			});
 		},
 		react() {
-			document.body.appendChild(new MkReactionPicker({
-				propsData: {
-					source: this.$refs.reactButton,
-					post: this.p,
-					compact: true
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkReactionPicker, {
+				source: this.$refs.reactButton,
+				post: this.p,
+				compact: true
+			});
 		},
 		menu() {
-			document.body.appendChild(new MkPostMenu({
-				propsData: {
-					source: this.$refs.menuButton,
-					post: this.p,
-					compact: true
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkPostMenu, {
+				source: this.$refs.menuButton,
+				post: this.p,
+				compact: true
+			});
 		}
 	}
 });
diff --git a/src/web/app/mobile/views/components/posts.post.vue b/src/web/app/mobile/views/components/posts.post.vue
index 9a7d633d44..43d8d4a89b 100644
--- a/src/web/app/mobile/views/components/posts.post.vue
+++ b/src/web/app/mobile/views/components/posts.post.vue
@@ -169,22 +169,18 @@ export default Vue.extend({
 			});
 		},
 		react() {
-			document.body.appendChild(new MkReactionPicker({
-				propsData: {
-					source: this.$refs.reactButton,
-					post: this.p,
-					compact: true
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkReactionPicker, {
+				source: this.$refs.reactButton,
+				post: this.p,
+				compact: true
+			});
 		},
 		menu() {
-			document.body.appendChild(new MkPostMenu({
-				propsData: {
-					source: this.$refs.menuButton,
-					post: this.p,
-					compact: true
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkPostMenu, {
+				source: this.$refs.menuButton,
+				post: this.p,
+				compact: true
+			});
 		}
 	}
 });
diff --git a/src/web/app/mobile/views/components/ui.vue b/src/web/app/mobile/views/components/ui.vue
index 1e34c84e62..54b8a2d0d3 100644
--- a/src/web/app/mobile/views/components/ui.vue
+++ b/src/web/app/mobile/views/components/ui.vue
@@ -53,11 +53,9 @@ export default Vue.extend({
 				id: notification.id
 			});
 
-			document.body.appendChild(new MkNotify({
-				propsData: {
-					notification
-				}
-			}).$mount().$el);
+			(this as any).os.new(MkNotify, {
+				notification
+			});
 		}
 	}
 });