wip

gulpfile.ts

@@ -56,7 +56,7 @@ gulp.task('build:js', () =>
 );
 
 gulp.task('build:ts', () => {
-	const tsProject = ts.createProject('./src/tsconfig.json');
+	const tsProject = ts.createProject('./tsconfig.json');
 
 	return tsProject
 		.src()

package.json

@@ -81,7 +81,6 @@
 		"accesses": "2.5.0",
 		"animejs": "2.2.0",
 		"autwh": "0.0.1",
-		"awesome-typescript-loader": "3.4.1",
 		"bcryptjs": "2.4.3",
 		"body-parser": "1.18.2",
 		"cafy": "3.2.1",
@@ -165,6 +164,7 @@
 		"tcp-port-used": "0.1.2",
 		"textarea-caret": "3.0.2",
 		"tmp": "0.0.33",
+		"ts-loader": "^3.5.0",
 		"ts-node": "4.1.0",
 		"tslint": "5.9.1",
 		"typescript": "2.7.1",
@@ -173,7 +173,9 @@
 		"uuid": "3.2.1",
 		"vhost": "3.0.2",
 		"vue": "^2.5.13",
+		"vue-loader": "^14.1.1",
 		"vue-router": "^3.0.1",
+		"vue-template-compiler": "^2.5.13",
 		"web-push": "3.2.5",
 		"webpack": "3.10.0",
 		"websocket": "1.0.25",

src/api/bot/core.ts

@@ -305,7 +305,7 @@ class TlContext extends Context {
 	private async getTl() {
 		const tl = await require('../endpoints/posts/timeline')({
 			limit: 5,
-			max_id: this.next ? this.next : undefined
+			until_id: this.next ? this.next : undefined
 		}, this.bot.user);
 
 		if (tl.length > 0) {
@@ -357,7 +357,7 @@ class NotificationsContext extends Context {
 	private async getNotifications() {
 		const notifications = await require('../endpoints/i/notifications')({
 			limit: 5,
-			max_id: this.next ? this.next : undefined
+			until_id: this.next ? this.next : undefined
 		}, this.bot.user);
 
 		if (notifications.length > 0) {

src/common/build/i18n.ts

@@ -17,12 +17,19 @@ export default class Replacer {
 	}
 
 	private get(key: string) {
-		let text = locale[this.lang];
+		const texts = locale[this.lang];
+
+		if (texts == null) {
+			console.warn(`lang '${this.lang}' is not supported`);
+			return key; // Fallback
+		}
+
+		let text;
 
 		// Check the key existance
 		const error = key.split('.').some(k => {
-			if (text.hasOwnProperty(k)) {
+			if (texts.hasOwnProperty(k)) {
-				text = text[k];
+				text = texts[k];
 				return false;
 			} else {
 				return true;

src/web/app/desktop/mixins/index.ts

@@ -1,2 +0,0 @@
-require('./user-preview');
-require('./widget');

src/web/app/desktop/mixins/user-preview.ts

@@ -1,66 +0,0 @@
-import * as riot from 'riot';
-
-riot.mixin('user-preview', {
-	init: function() {
-		const scan = () => {
-			this.root.querySelectorAll('[data-user-preview]:not([data-user-preview-attached])')
-				.forEach(attach.bind(this));
-		};
-		this.on('mount', scan);
-		this.on('updated', scan);
-	}
-});
-
-function attach(el) {
-	el.setAttribute('data-user-preview-attached', true);
-
-	const user = el.getAttribute('data-user-preview');
-	let tag = null;
-	let showTimer = null;
-	let hideTimer = null;
-
-	el.addEventListener('mouseover', () => {
-		clearTimeout(showTimer);
-		clearTimeout(hideTimer);
-		showTimer = setTimeout(show, 500);
-	});
-
-	el.addEventListener('mouseleave', () => {
-		clearTimeout(showTimer);
-		clearTimeout(hideTimer);
-		hideTimer = setTimeout(close, 500);
-	});
-
-	this.on('unmount', () => {
-		clearTimeout(showTimer);
-		clearTimeout(hideTimer);
-		close();
-	});
-
-	const show = () => {
-		if (tag) return;
-		const preview = document.createElement('mk-user-preview');
-		const rect = el.getBoundingClientRect();
-		const x = rect.left + el.offsetWidth + window.pageXOffset;
-		const y = rect.top + window.pageYOffset;
-		preview.style.top = y + 'px';
-		preview.style.left = x + 'px';
-		preview.addEventListener('mouseover', () => {
-			clearTimeout(hideTimer);
-		});
-		preview.addEventListener('mouseleave', () => {
-			clearTimeout(showTimer);
-			hideTimer = setTimeout(close, 500);
-		});
-		tag = (riot as any).mount(document.body.appendChild(preview), {
-			user: user
-		})[0];
-	};
-
-	const close = () => {
-		if (tag) {
-			tag.close();
-			tag = null;
-		}
-	};
-}

src/web/app/desktop/mixins/widget.ts

@@ -1,31 +0,0 @@
-import * as riot from 'riot';
-
-// ミックスインにオプションを渡せないのアレ
-// SEE: https://github.com/riot/riot/issues/2434
-
-(riot as any).mixin('widget', {
-	init: function() {
-		this.mixin('i');
-		this.mixin('api');
-
-		this.id = this.opts.id;
-		this.place = this.opts.place;
-
-		if (this.data) {
-			Object.keys(this.data).forEach(prop => {
-				this.data[prop] = this.opts.data.hasOwnProperty(prop) ? this.opts.data[prop] : this.data[prop];
-			});
-		}
-	},
-
-	save: function() {
-		this.update();
-		this.api('i/update_home', {
-			id: this.id,
-			data: this.data
-		}).then(() => {
-			this.I.client_settings.home.find(w => w.id == this.id).data = this.data;
-			this.I.update();
-		});
-	}
-});

src/web/app/desktop/script.ts

@@ -7,12 +7,13 @@ import './style.styl';
 
 import Vue from 'vue';
 import init from '../init';
-import route from './router';
 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';
+
 /**
  * init
  */
@@ -36,8 +37,9 @@ init(async (mios: MiOS, app: Vue) => {
 		}
 	}
 
-	// Start routing
+	app.$router.addRoutes([{
-	route(mios);
+		path: '/', component: MkIndex, props: { os: mios }
+	}]);
 }, true);
 
 function registerNotifications(stream: HomeStreamManager) {
@@ -96,9 +98,9 @@ function registerNotifications(stream: HomeStreamManager) {
 			});
 			n.onclick = () => {
 				n.close();
-				(riot as any).mount(document.body.appendChild(document.createElement('mk-messaging-room-window')), {
+				/*(riot as any).mount(document.body.appendChild(document.createElement('mk-messaging-room-window')), {
 					user: message.user
-				});
+				});*/
 			};
 			setTimeout(n.close.bind(n), 7000);
 		});

src/web/app/desktop/scripts/autocomplete.ts

@@ -1,4 +1,4 @@
-import getCaretCoordinates = require('textarea-caret');
+import getCaretCoordinates from 'textarea-caret';
 import * as riot from 'riot';
 
 /**

src/web/app/desktop/tags/pages/index.vue

@@ -0,0 +1,3 @@
+<template>
+	<h1>hi</h1>
+</template>

src/web/app/init.ts

@@ -5,7 +5,7 @@
 declare const _VERSION_: string;
 declare const _LANG_: string;
 declare const _HOST_: string;
-declare const __CONSTS__: any;
+//declare const __CONSTS__: any;
 
 import Vue from 'vue';
 import VueRouter from 'vue-router';

src/web/app/tsconfig.json

@@ -19,8 +19,5 @@
   "compileOnSave": false,
   "include": [
     "./**/*.ts"
-  ],
-  "exclude": [
-    "./web/app/**/*.ts"
   ]
 }

src/web/app/v.d.ts

@@ -0,0 +1,4 @@
+declare module "*.vue" {
+	import Vue from 'vue';
+	export default Vue;
+}

tsconfig.json

@@ -18,6 +18,9 @@
   },
   "compileOnSave": false,
   "include": [
-    "./gulpfile.ts"
+    "./src/**/*.ts"
+  ],
+  "exclude": [
+    "./src/web/app/**/*.ts"
   ]
 }

webpack/module/rules/index.ts

@@ -3,7 +3,7 @@ import license from './license';
 import fa from './fa';
 import base64 from './base64';
 import themeColor from './theme-color';
-import tag from './tag';
+import vue from './vue';
 import stylus from './stylus';
 import typescript from './typescript';
 
@@ -13,7 +13,7 @@ export default lang => [
 	fa(),
 	base64(),
 	themeColor(),
-	tag(),
+	vue(),
 	stylus(),
 	typescript()
 ];

webpack/module/rules/tag.ts

@@ -1,20 +0,0 @@
-/**
- * Riot tags
- */
-
-export default () => ({
-	test: /\.tag$/,
-	exclude: /node_modules/,
-	loader: 'riot-tag-loader',
-	query: {
-		hot: false,
-		style: 'stylus',
-		expr: false,
-		compact: true,
-		parserOptions: {
-			style: {
-				compress: true
-			}
-		}
-	}
-});

webpack/module/rules/typescript.ts

@@ -4,5 +4,9 @@
 
 export default () => ({
 	test: /\.ts$/,
-	use: 'awesome-typescript-loader'
+	loader: 'ts-loader',
+	options: {
+		configFile: __dirname + '/../../../src/web/app/tsconfig.json',
+		appendTsSuffixTo: [/\.vue$/]
+	}
 });

webpack/module/rules/vue.ts

@@ -0,0 +1,9 @@
+/**
+ * Vue
+ */
+
+export default () => ({
+	test: /\.vue$/,
+	exclude: /node_modules/,
+	loader: 'vue-loader'
+});

webpack/webpack.config.ts

@@ -15,12 +15,12 @@ module.exports = Object.keys(langs).map(lang => {
 	// Entries
 	const entry = {
 		desktop: './src/web/app/desktop/script.ts',
-		mobile: './src/web/app/mobile/script.ts',
+		//mobile: './src/web/app/mobile/script.ts',
-		ch: './src/web/app/ch/script.ts',
+		//ch: './src/web/app/ch/script.ts',
-		stats: './src/web/app/stats/script.ts',
+		//stats: './src/web/app/stats/script.ts',
-		status: './src/web/app/status/script.ts',
+		//status: './src/web/app/status/script.ts',
-		dev: './src/web/app/dev/script.ts',
+		//dev: './src/web/app/dev/script.ts',
-		auth: './src/web/app/auth/script.ts',
+		//auth: './src/web/app/auth/script.ts',
 		sw: './src/web/app/sw.js'
 	};