feat: ai-chan widget

Co-authored-by: atsuchan <83960488+atsu1125@users.noreply.github.com>

.gitmodules

@@ -0,0 +1,3 @@
+[submodule "misskey-assets"]
+	path = misskey-assets
+	url = https://github.com/misskey-dev/assets.git

Dockerfile

@@ -6,6 +6,8 @@ WORKDIR /misskey
 RUN apt-get update \
  && apt-get install -y --no-install-recommends build-essential
 
+RUN git init
+RUN git submodule update --init
 COPY package.json yarn.lock ./
 RUN yarn install
 COPY . ./

locales/en-US.yml

@@ -433,6 +433,7 @@ common:
     words: "Trend words"
     queue: "Queue"
     sunmoon: "Sun and moon"
+    aichan: "Ai-chan"
   dev: "Failed to create the application. Please try again."
   ai-chan-kawaii: "Ai-chan kawaii!"
   you: "You"

locales/ja-JP.yml

@@ -458,6 +458,7 @@ common:
     words: "トレンドワード"
     queue: "キュー"
     sunmoon: "太陽と月"
+    aichan: "藍"
 
   dev: "アプリの作成に失敗しました。再度お試しください。"
   ai-chan-kawaii: "藍ちゃかわいい"

src/client/app/common/views/deck/deck.widgets-column.vue

@@ -30,6 +30,7 @@
 					<option value="nav">{{ $t('@.widgets.nav') }}</option>
 					<option value="tips">{{ $t('@.widgets.tips') }}</option>
 					<option value="sunmoon">{{ $t('@.widgets.sunmoon') }}</option>
+					<option value="aichan">{{ $t('@.widgets.aichan') }}</option>
 				</select>
 			</header>
 			<x-draggable

src/client/app/desktop/views/home/home.vue

@@ -31,6 +31,7 @@
 						<option value="nav">{{ $t('@.widgets.nav') }}</option>
 						<option value="tips">{{ $t('@.widgets.tips') }}</option>
 						<option value="sunmoon">{{ $t('@.widgets.sunmoon') }}</option>
+						<option value="aichan">{{ $t('@.widgets.aichan') }}</option>
 					</select>
 					<button @click="addWidget">{{ $t('add') }}</button>
 					<button @click="restoreDefault">{{ $t('restore-default') }}</button>

src/client/app/desktop/views/widgets/aichan.vue

@@ -0,0 +1,35 @@
+<template>
+<div class="mkw-aichan">
+  <iframe class="dedjhjmo" ref="live2d" @click="touched" src="https://misskey-dev.github.io/mascot-web/?scale=1.5&y=1.1&eyeY=100"></iframe>
+</div>
+</template>
+
+<script lang="ts">
+import define from '../../../common/define-widget';
+import i18n from '../../../i18n';
+export default define({
+	name: 'aichan',
+}).extend({
+	i18n: i18n(),
+  mounted() {
+		window.addEventListener('mousemove', ev => {
+			let iframeRect = this.$refs.live2d.getBoundingClientRect();
+			this.$refs.live2d.contentWindow.postMessage({
+				type: 'moveCursor',
+				body: {
+					x: ev.clientX - iframeRect.left,
+					y: ev.clientY - iframeRect.top,
+				}
+			}, '*');
+		}, { passive: true });
+	},
+});
+</script>
+
+<style lang="stylus" scoped>
+.dedjhjmo
+	width 100%
+	height 300px
+	border none
+	pointer-events none
+</style>

src/client/app/desktop/views/widgets/index.ts

@@ -9,3 +9,4 @@ Vue.component('mkw-polls', () => import('./polls.vue').then(m => m.default));
 Vue.component('mkw-messaging', () => import('./messaging.vue').then(m => m.default));
 Vue.component('mkw-profile', () => import('./profile.vue').then(m => m.default));
 Vue.component('mkw-customize', () => import('./customize.vue').then(m => m.default));
+Vue.component('mkw-aichan', () => import('./aichan.vue').then(m => m.default));

src/client/app/mobile/views/pages/widgets.vue

@@ -25,6 +25,7 @@
 					<option value="nav">{{ $t('@.widgets.nav') }}</option>
 					<option value="tips">{{ $t('@.widgets.tips') }}</option>
 					<option value="sunmoon">{{ $t('@.widgets.sunmoon') }}</option>
+					<option value="aichan">{{ $t('@.widgets.aichan') }}</option>
 				</select>
 				<button @click="addWidget">{{ $t('add-widget') }}</button>
 				<p><a @click="hint">{{ $t('customization-tips') }}</a></p>