Refactor client (#3178)

* wip

* wip

* wip

* wip

* wip

* wip

* wip

* wip

* wip

* wip

9 files changed, 24 insertions, 154 deletions

diff --git a/src/client/app/desktop/api/choose-drive-file.ts b/src/client/app/desktop/api/choose-drive-file.ts
deleted file mode 100644
index a362a1289b..0000000000
--- a/src/client/app/desktop/api/choose-drive-file.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-import OS from '../../mios';
-import { url } from '../../config';
-import MkChooseFileFromDriveWindow from '../views/components/choose-file-from-drive-window.vue';
-
-export default (os: OS) => opts => {
-	return new Promise((res, rej) => {
-		const o = opts || {};
-
-		if (document.body.clientWidth > 800) {
-			const w = os.new(MkChooseFileFromDriveWindow, {
-				title: o.title,
-				multiple: o.multiple,
-				initFolder: o.currentFolder
-			});
-			w.$once('selected', file => {
-				res(file);
-			});
-			document.body.appendChild(w.$el);
-		} else {
-			window['cb'] = file => {
-				res(file);
-			};
-
-			window.open(url + `/selectdrive?multiple=${o.multiple}`,
-				'choose_drive_window',
-				'height=500, width=800');
-		}
-	});
-};
diff --git a/src/client/app/desktop/api/choose-drive-folder.ts b/src/client/app/desktop/api/choose-drive-folder.ts
deleted file mode 100644
index 68dc7988b5..0000000000
--- a/src/client/app/desktop/api/choose-drive-folder.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import OS from '../../mios';
-import MkChooseFolderFromDriveWindow from '../views/components/choose-folder-from-drive-window.vue';
-
-export default (os: OS) => opts => {
-	return new Promise((res, rej) => {
-		const o = opts || {};
-		const w = os.new(MkChooseFolderFromDriveWindow, {
-			title: o.title,
-			initFolder: o.currentFolder
-		});
-		w.$once('selected', folder => {
-			res(folder);
-		});
-		document.body.appendChild(w.$el);
-	});
-};
diff --git a/src/client/app/desktop/api/contextmenu.ts b/src/client/app/desktop/api/contextmenu.ts
deleted file mode 100644
index c92f087551..0000000000
--- a/src/client/app/desktop/api/contextmenu.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import OS from '../../mios';
-import Ctx from '../views/components/context-menu.vue';
-
-export default (os: OS) => (e, menu, opts?) => {
-	const o = opts || {};
-	const vm = os.new(Ctx, {
-		menu,
-		x: e.pageX - window.pageXOffset,
-		y: e.pageY - window.pageYOffset,
-	});
-	vm.$once('closed', () => {
-		if (o.closed) o.closed();
-	});
-	document.body.appendChild(vm.$el);
-};
diff --git a/src/client/app/desktop/api/dialog.ts b/src/client/app/desktop/api/dialog.ts
deleted file mode 100644
index 23f35b7aa9..0000000000
--- a/src/client/app/desktop/api/dialog.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-import OS from '../../mios';
-import Dialog from '../views/components/dialog.vue';
-
-export default (os: OS) => opts => {
-	return new Promise<string>((res, rej) => {
-		const o = opts || {};
-		const d = os.new(Dialog, {
-			title: o.title,
-			text: o.text,
-			modal: o.modal,
-			buttons: o.actions
-		});
-		d.$once('clicked', id => {
-			res(id);
-		});
-		document.body.appendChild(d.$el);
-	});
-};
diff --git a/src/client/app/desktop/api/input.ts b/src/client/app/desktop/api/input.ts
deleted file mode 100644
index bd7bfa0129..0000000000
--- a/src/client/app/desktop/api/input.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import OS from '../../mios';
-import InputDialog from '../views/components/input-dialog.vue';
-
-export default (os: OS) => opts => {
-	return new Promise<string>((res, rej) => {
-		const o = opts || {};
-		const d = os.new(InputDialog, {
-			title: o.title,
-			placeholder: o.placeholder,
-			default: o.default,
-			type: o.type || 'text',
-			allowEmpty: o.allowEmpty
-		});
-		d.$once('done', text => {
-			res(text);
-		});
-		document.body.appendChild(d.$el);
-	});
-};
diff --git a/src/client/app/desktop/api/notify.ts b/src/client/app/desktop/api/notify.ts
deleted file mode 100644
index 72e5827607..0000000000
--- a/src/client/app/desktop/api/notify.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import OS from '../../mios';
-import Notification from '../views/components/ui-notification.vue';
-
-export default (os: OS) => message => {
-	const vm = os.new(Notification, {
-		message
-	});
-	document.body.appendChild(vm.$el);
-};
diff --git a/src/client/app/desktop/api/post.ts b/src/client/app/desktop/api/post.ts
deleted file mode 100644
index 3ff9c5bb8c..0000000000
--- a/src/client/app/desktop/api/post.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import OS from '../../mios';
-import PostFormWindow from '../views/components/post-form-window.vue';
-import RenoteFormWindow from '../views/components/renote-form-window.vue';
-
-export default (os: OS) => opts => {
-	const o = opts || {};
-	if (o.renote) {
-		const vm = os.new(RenoteFormWindow, {
-			note: o.renote,
-			animation: o.animation == null ? true : o.animation
-		});
-		if (o.cb) vm.$once('closed', o.cb);
-		document.body.appendChild(vm.$el);
-	} else {
-		const vm = os.new(PostFormWindow, {
-			reply: o.reply,
-			animation: o.animation == null ? true : o.animation
-		});
-		if (o.cb) vm.$once('closed', o.cb);
-		document.body.appendChild(vm.$el);
-	}
-};
diff --git a/src/client/app/desktop/api/update-avatar.ts b/src/client/app/desktop/api/update-avatar.ts
index f08e8a2b4e..ae8b723ea6 100644
--- a/src/client/app/desktop/api/update-avatar.ts
+++ b/src/client/app/desktop/api/update-avatar.ts
@@ -1,15 +1,14 @@
-import OS from '../../mios';
 import { apiUrl } from '../../config';
 import CropWindow from '../views/components/crop-window.vue';
 import ProgressDialog from '../views/components/progress-dialog.vue';
 
-export default (os: OS) => {
+export default ($root: any) => {
 
 	const cropImage = file => new Promise((resolve, reject) => {
 
 		const regex = RegExp('\.(jpg|jpeg|png|gif|webp|bmp|tiff)$');
 		if (!regex.test(file.name) ) {
-			os.apis.dialog({
+			$root.$dialog({
 				title: '%fa:info-circle% %i18n:desktop.invalid-filetype%',
 				text: null,
 				actions: [{
@@ -19,7 +18,7 @@ export default (os: OS) => {
 			return reject('invalid-filetype');
 		}
 
-		const w = os.new(CropWindow, {
+		const w = $root.new(CropWindow, {
 			image: file,
 			title: '%i18n:desktop.avatar-crop-title%',
 			aspectRatio: 1 / 1
@@ -27,14 +26,14 @@ export default (os: OS) => {
 
 		w.$once('cropped', blob => {
 			const data = new FormData();
-			data.append('i', os.store.state.i.token);
+			data.append('i', $root.$store.state.i.token);
 			data.append('file', blob, file.name + '.cropped.png');
 
-			os.api('drive/folders/find', {
+			$root.api('drive/folders/find', {
 				name: '%i18n:desktop.avatar%'
 			}).then(avatarFolder => {
 				if (avatarFolder.length === 0) {
-					os.api('drive/folders/create', {
+					$root.api('drive/folders/create', {
 						name: '%i18n:desktop.avatar%'
 					}).then(iconFolder => {
 						resolve(upload(data, iconFolder));
@@ -55,7 +54,7 @@ export default (os: OS) => {
 	});
 
 	const upload = (data, folder) => new Promise((resolve, reject) => {
-		const dialog = os.new(ProgressDialog, {
+		const dialog = $root.new(ProgressDialog, {
 			title: '%i18n:desktop.uploading-avatar%'
 		});
 		document.body.appendChild(dialog.$el);
@@ -79,19 +78,19 @@ export default (os: OS) => {
 	});
 
 	const setAvatar = file => {
-		return os.api('i/update', {
+		return $root.api('i/update', {
 			avatarId: file.id
 		}).then(i => {
-			os.store.commit('updateIKeyValue', {
+			$root.$store.commit('updateIKeyValue', {
 				key: 'avatarId',
 				value: i.avatarId
 			});
-			os.store.commit('updateIKeyValue', {
+			$root.$store.commit('updateIKeyValue', {
 				key: 'avatarUrl',
 				value: i.avatarUrl
 			});
 
-			os.apis.dialog({
+			$root.$dialog({
 				title: '%fa:info-circle% %i18n:desktop.avatar-updated%',
 				text: null,
 				actions: [{
@@ -106,7 +105,7 @@ export default (os: OS) => {
 	return (file = null) => {
 		const selectedFile = file
 			? Promise.resolve(file)
-			: os.apis.chooseDriveFile({
+			: $root.$chooseDriveFile({
 				multiple: false,
 				title: '%fa:image% %i18n:desktop.choose-avatar%'
 			});
diff --git a/src/client/app/desktop/api/update-banner.ts b/src/client/app/desktop/api/update-banner.ts
index 42c9d69349..c338d4e95c 100644
--- a/src/client/app/desktop/api/update-banner.ts
+++ b/src/client/app/desktop/api/update-banner.ts
@@ -1,15 +1,14 @@
-import OS from '../../mios';
 import { apiUrl } from '../../config';
 import CropWindow from '../views/components/crop-window.vue';
 import ProgressDialog from '../views/components/progress-dialog.vue';
 
-export default (os: OS) => {
+export default ($root: any) => {
 
 	const cropImage = file => new Promise((resolve, reject) => {
 
 		const regex = RegExp('\.(jpg|jpeg|png|gif|webp|bmp|tiff)$');
 		if (!regex.test(file.name) ) {
-			os.apis.dialog({
+			$root.dialog({
 				title: '%fa:info-circle% %i18n:desktop.invalid-filetype%',
 				text: null,
 				actions: [{
@@ -19,7 +18,7 @@ export default (os: OS) => {
 			return reject('invalid-filetype');
 		}
 
-		const w = os.new(CropWindow, {
+		const w = $root.new(CropWindow, {
 			image: file,
 			title: '%i18n:desktop.banner-crop-title%',
 			aspectRatio: 16 / 9
@@ -27,14 +26,14 @@ export default (os: OS) => {
 
 		w.$once('cropped', blob => {
 			const data = new FormData();
-			data.append('i', os.store.state.i.token);
+			data.append('i', $root.$store.state.i.token);
 			data.append('file', blob, file.name + '.cropped.png');
 
-			os.api('drive/folders/find', {
+			$root.api('drive/folders/find', {
 				name: '%i18n:desktop.banner%'
 			}).then(bannerFolder => {
 				if (bannerFolder.length === 0) {
-					os.api('drive/folders/create', {
+					$root.api('drive/folders/create', {
 						name: '%i18n:desktop.banner%'
 					}).then(iconFolder => {
 						resolve(upload(data, iconFolder));
@@ -55,7 +54,7 @@ export default (os: OS) => {
 	});
 
 	const upload = (data, folder) => new Promise((resolve, reject) => {
-		const dialog = os.new(ProgressDialog, {
+		const dialog = $root.new(ProgressDialog, {
 			title: '%i18n:desktop.uploading-banner%'
 		});
 		document.body.appendChild(dialog.$el);
@@ -79,19 +78,19 @@ export default (os: OS) => {
 	});
 
 	const setBanner = file => {
-		return os.api('i/update', {
+		return $root.api('i/update', {
 			bannerId: file.id
 		}).then(i => {
-			os.store.commit('updateIKeyValue', {
+			$root.$store.commit('updateIKeyValue', {
 				key: 'bannerId',
 				value: i.bannerId
 			});
-			os.store.commit('updateIKeyValue', {
+			$root.$store.commit('updateIKeyValue', {
 				key: 'bannerUrl',
 				value: i.bannerUrl
 			});
 
-			os.apis.dialog({
+			$root.$dialog({
 				title: '%fa:info-circle% %i18n:desktop.banner-updated%',
 				text: null,
 				actions: [{
@@ -106,7 +105,7 @@ export default (os: OS) => {
 	return (file = null) => {
 		const selectedFile = file
 			? Promise.resolve(file)
-			: os.apis.chooseDriveFile({
+			: $root.$chooseDriveFile({
 				multiple: false,
 				title: '%fa:image% %i18n:desktop.choose-banner%'
 			});