From 64397708fdd706d28918cee8859c68ab8ed925c8 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Sat, 6 Jul 2019 18:14:50 +0900
Subject: MisskeyPagesにイベント送信ボタンを追加
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/server/api/endpoints/page-push.ts | 44 +++++++++++++++++++++++++++++++++++
 1 file changed, 44 insertions(+)
 create mode 100644 src/server/api/endpoints/page-push.ts

(limited to 'src/server/api')

diff --git a/src/server/api/endpoints/page-push.ts b/src/server/api/endpoints/page-push.ts
new file mode 100644
index 0000000000..300df7c250
--- /dev/null
+++ b/src/server/api/endpoints/page-push.ts
@@ -0,0 +1,44 @@
+import $ from 'cafy';
+import define from '../define';
+import { ID } from '../../../misc/cafy-id';
+import { publishMainStream } from '../../../services/stream';
+import { Users, Pages } from '../../../models';
+import { ApiError } from '../error';
+
+export const meta = {
+	requireCredential: true,
+	secure: true,
+
+	params: {
+		pageId: {
+			validator: $.type(ID)
+		},
+
+		event: {
+			validator: $.str
+		}
+	},
+
+	errors: {
+		noSuchPage: {
+			message: 'No such page.',
+			code: 'NO_SUCH_PAGE',
+			id: '4a13ad31-6729-46b4-b9af-e86b265c2e74'
+		}
+	}
+};
+
+export default define(meta, async (ps, user) => {
+	const page = await Pages.findOne(ps.pageId);
+	if (page == null) {
+		throw new ApiError(meta.errors.noSuchPage);
+	}
+
+	publishMainStream(user.id, 'pageEvent', {
+		pageId: ps.pageId,
+		event: ps.event,
+		user: await Users.pack(user, page.userId, {
+			detail: true
+		})
+	});
+});
-- 
cgit v1.2.3-freya


From 047a46d96689a97bee4c843fcd86e63b816846f1 Mon Sep 17 00:00:00 2001
From: Satsuki Yanagi <17376330+u1-liquid@users.noreply.github.com>
Date: Sun, 7 Jul 2019 01:38:36 +0900
Subject: Support password-less login with WebAuthn (#5112)

* Support password-less login with WebAuthn

* Fix initial value of usePasswordLessLogin
---
 locales/ja-JP.yml                                  |  1 +
 migration/1562422242907-PasswordLessLogin.ts       | 13 ++++++++
 .../app/common/views/components/settings/2fa.vue   | 16 ++++++++++
 src/client/app/common/views/components/signin.vue  |  6 +++-
 src/models/entities/user-profile.ts                |  5 +++
 src/models/repositories/user.ts                    |  2 +-
 src/server/api/endpoints/i/2fa/password-less.ts    | 21 +++++++++++++
 src/server/api/private/signin.ts                   | 36 +++++++++++++++++-----
 8 files changed, 90 insertions(+), 10 deletions(-)
 create mode 100644 migration/1562422242907-PasswordLessLogin.ts
 create mode 100644 src/server/api/endpoints/i/2fa/password-less.ts

(limited to 'src/server/api')

diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index 6666e630a3..5daf7e7e3a 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -1112,6 +1112,7 @@ desktop/views/components/settings.2fa.vue:
   register-security-key: "キーの登録を完了"
   something-went-wrong: "わー！ キーを登録する際に問題が発生しました:"
   key-unregistered: "キーが削除されました"
+  use-password-less-login: "パスワードなしのログインを使用"
 
 common/views/components/media-image.vue:
   sensitive: "閲覧注意"
diff --git a/migration/1562422242907-PasswordLessLogin.ts b/migration/1562422242907-PasswordLessLogin.ts
new file mode 100644
index 0000000000..e789a34334
--- /dev/null
+++ b/migration/1562422242907-PasswordLessLogin.ts
@@ -0,0 +1,13 @@
+import {MigrationInterface, QueryRunner} from "typeorm";
+
+export class PasswordLessLogin1562422242907 implements MigrationInterface {
+
+	public async up(queryRunner: QueryRunner): Promise<any> {
+		await queryRunner.query(`ALTER TABLE "user_profile" ADD COLUMN "usePasswordLessLogin" boolean DEFAULT false NOT NULL`);
+	}
+
+	public async down(queryRunner: QueryRunner): Promise<any> {
+		await queryRunner.query(`ALTER TABLE "user_profile" DROP COLUMN "usePasswordLessLogin"`);
+	}
+
+}
diff --git a/src/client/app/common/views/components/settings/2fa.vue b/src/client/app/common/views/components/settings/2fa.vue
index eb645898e2..813a91b5c0 100644
--- a/src/client/app/common/views/components/settings/2fa.vue
+++ b/src/client/app/common/views/components/settings/2fa.vue
@@ -28,6 +28,10 @@
 				</div>
 			</div>
 
+			<ui-switch v-model="usePasswordLessLogin" @change="updatePasswordLessLogin" v-if="$store.state.i.securityKeysList.length > 0">
+				{{ $t('use-password-less-login') }}
+			</ui-switch>
+
 			<ui-info warn v-if="registration && registration.error">{{ $t('something-went-wrong') }} {{ registration.error }}</ui-info>
 			<ui-button v-if="!registration || registration.error" @click="addSecurityKey">{{ $t('register') }}</ui-button>
 
@@ -80,6 +84,7 @@ export default Vue.extend({
 		return {
 			data: null,
 			supportsCredentials: !!navigator.credentials,
+			usePasswordLessLogin: this.$store.state.i.usePasswordLessLogin,
 			registration: null,
 			keyName: '',
 			token: null
@@ -112,6 +117,9 @@ export default Vue.extend({
 				if (canceled) return;
 				this.$root.api('i/2fa/unregister', {
 					password: password
+				}).then(() => {
+					this.usePasswordLessLogin = false;
+					this.updatePasswordLessLogin();
 				}).then(() => {
 					this.$notify(this.$t('unregistered'));
 					this.$store.state.i.twoFactorEnabled = false;
@@ -157,6 +165,9 @@ export default Vue.extend({
 				return this.$root.api('i/2fa/remove-key', {
 					password,
 					credentialId: key.id
+				}).then(() => {
+					this.usePasswordLessLogin = false;
+					this.updatePasswordLessLogin();
 				}).then(() => {
 					this.$notify(this.$t('key-unregistered'));
 				});
@@ -213,6 +224,11 @@ export default Vue.extend({
 					this.registration.stage = -1;
 				});
 			});
+		},
+		updatePasswordLessLogin() {
+			this.$root.api('i/2fa/password-less', {
+				value: !!this.usePasswordLessLogin
+			});
 		}
 	}
 });
diff --git a/src/client/app/common/views/components/signin.vue b/src/client/app/common/views/components/signin.vue
index 8498a1dc3e..f76f989d6d 100644
--- a/src/client/app/common/views/components/signin.vue
+++ b/src/client/app/common/views/components/signin.vue
@@ -7,7 +7,7 @@
 			<template #prefix>@</template>
 			<template #suffix>@{{ host }}</template>
 		</ui-input>
-		<ui-input v-model="password" type="password" :with-password-toggle="true" required>
+		<ui-input v-model="password" type="password" :with-password-toggle="true" v-if="!user || user && !user.usePasswordLessLogin" required>
 			<span>{{ $t('password') }}</span>
 			<template #prefix><fa icon="lock"/></template>
 		</ui-input>
@@ -28,6 +28,10 @@
 		</div>
 		<div class="twofa-group totp-group">
 			<p style="margin-bottom:0;">{{ $t('enter-2fa-code') }}</p>
+			<ui-input v-model="password" type="password" :with-password-toggle="true" v-if="user && user.usePasswordLessLogin" required>
+				<span>{{ $t('password') }}</span>
+				<template #prefix><fa icon="lock"/></template>
+			</ui-input>
 			<ui-input v-model="token" type="text" pattern="^[0-9]{6}$" autocomplete="off" spellcheck="false" required>
 				<span>{{ $t('@.2fa') }}</span>
 				<template #prefix><fa icon="gavel"/></template>
diff --git a/src/models/entities/user-profile.ts b/src/models/entities/user-profile.ts
index 6f960f1b7b..4a588ebfbf 100644
--- a/src/models/entities/user-profile.ts
+++ b/src/models/entities/user-profile.ts
@@ -81,6 +81,11 @@ export class UserProfile {
 	})
 	public securityKeysAvailable: boolean;
 
+	@Column('boolean', {
+		default: false,
+	})
+	public usePasswordLessLogin: boolean;
+
 	@Column('varchar', {
 		length: 128, nullable: true,
 		comment: 'The password hash of the User. It will be null if the origin of the user is local.'
diff --git a/src/models/repositories/user.ts b/src/models/repositories/user.ts
index cc89b674c5..06da74197f 100644
--- a/src/models/repositories/user.ts
+++ b/src/models/repositories/user.ts
@@ -156,6 +156,7 @@ export class UserRepository extends Repository<User> {
 					detail: true
 				}),
 				twoFactorEnabled: profile!.twoFactorEnabled,
+				usePasswordLessLogin: profile!.usePasswordLessLogin,
 				securityKeys: profile!.twoFactorEnabled
 					? UserSecurityKeys.count({
 						userId: user.id
@@ -208,7 +209,6 @@ export class UserRepository extends Repository<User> {
 						select: ['id', 'name', 'lastUsed']
 					})
 					: []
-
 			} : {}),
 
 			...(relation ? {
diff --git a/src/server/api/endpoints/i/2fa/password-less.ts b/src/server/api/endpoints/i/2fa/password-less.ts
new file mode 100644
index 0000000000..19e75ca1c5
--- /dev/null
+++ b/src/server/api/endpoints/i/2fa/password-less.ts
@@ -0,0 +1,21 @@
+import $ from 'cafy';
+import define from '../../../define';
+import { UserProfiles } from '../../../../../models';
+
+export const meta = {
+	requireCredential: true,
+
+	secure: true,
+
+	params: {
+		value: {
+			validator: $.boolean
+		}
+	}
+};
+
+export default define(meta, async (ps, user) => {
+	await UserProfiles.update(user.id, {
+		usePasswordLessLogin: ps.value
+	});
+});
diff --git a/src/server/api/private/signin.ts b/src/server/api/private/signin.ts
index bc9346d088..67afed760b 100644
--- a/src/server/api/private/signin.ts
+++ b/src/server/api/private/signin.ts
@@ -72,19 +72,25 @@ export default async (ctx: Koa.BaseContext) => {
 		}
 	}
 
-	if (!same) {
-		await fail(403, {
-			error: 'incorrect password'
-		});
-		return;
-	}
-
 	if (!profile.twoFactorEnabled) {
-		signin(ctx, user);
+		if (same) {
+			signin(ctx, user);
+		} else {
+			await fail(403, {
+				error: 'incorrect password'
+			});
+		}
 		return;
 	}
 
 	if (token) {
+		if (!same) {
+			await fail(403, {
+				error: 'incorrect password'
+			});
+			return;
+		}
+
 		const verified = (speakeasy as any).totp.verify({
 			secret: profile.twoFactorSecret,
 			encoding: 'base32',
@@ -101,6 +107,13 @@ export default async (ctx: Koa.BaseContext) => {
 			return;
 		}
 	} else if (body.credentialId) {
+		if (!same && !profile.usePasswordLessLogin) {
+			await fail(403, {
+				error: 'incorrect password'
+			});
+			return;
+		}
+
 		const clientDataJSON = Buffer.from(body.clientDataJSON, 'hex');
 		const clientData = JSON.parse(clientDataJSON.toString('utf-8'));
 		const challenge = await AttestationChallenges.findOne({
@@ -163,6 +176,13 @@ export default async (ctx: Koa.BaseContext) => {
 			return;
 		}
 	} else {
+		if (!same && !profile.usePasswordLessLogin) {
+			await fail(403, {
+				error: 'incorrect password'
+			});
+			return;
+		}
+
 		const keys = await UserSecurityKeys.find({
 			userId: user.id
 		});
-- 
cgit v1.2.3-freya


From e9251debe067077c91b7505d310f53388ed4944d Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Sun, 7 Jul 2019 05:12:31 +0900
Subject: イベント送信時に指定の変数の値を添付出来るように
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 locales/ja-JP.yml                                       |  2 ++
 .../pages/page-editor/els/page-editor.el.button.vue     | 17 ++++++++++++++++-
 src/client/app/common/views/pages/page/page.button.vue  |  5 ++++-
 src/server/api/endpoints/page-push.ts                   |  5 +++++
 4 files changed, 27 insertions(+), 2 deletions(-)

(limited to 'src/server/api')

diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index 6666e630a3..e63d501651 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -2035,6 +2035,8 @@ pages:
         _pushEvent:
           event: "イベント名"
           message: "押したときに表示するメッセージ"
+          variable: "送信する変数"
+          no-variable: "なし"
 
   script:
     categories:
diff --git a/src/client/app/common/views/pages/page-editor/els/page-editor.el.button.vue b/src/client/app/common/views/pages/page-editor/els/page-editor.el.button.vue
index 04001d8560..6a82b0eec9 100644
--- a/src/client/app/common/views/pages/page-editor/els/page-editor.el.button.vue
+++ b/src/client/app/common/views/pages/page-editor/els/page-editor.el.button.vue
@@ -17,6 +17,17 @@
 		<template v-else-if="value.action === 'pushEvent'">
 			<ui-input v-model="value.event"><span>{{ $t('blocks._button._action._pushEvent.event') }}</span></ui-input>
 			<ui-input v-model="value.message"><span>{{ $t('blocks._button._action._pushEvent.message') }}</span></ui-input>
+			<ui-select v-model="value.var">
+				<template #label>{{ $t('blocks._button._action._pushEvent.variable') }}</template>
+				<option :value="null">{{ $t('blocks._button._action._pushEvent.no-variable') }}</option>
+				<option v-for="v in aiScript.getVarsByType()" :value="v.name">{{ v.name }}</option>
+				<optgroup :label="$t('script.pageVariables')">
+					<option v-for="v in aiScript.getPageVarsByType()" :value="v">{{ v }}</option>
+				</optgroup>
+				<optgroup :label="$t('script.enviromentVariables')">
+					<option v-for="v in aiScript.getEnvVarsByType()" :value="v">{{ v }}</option>
+				</optgroup>
+			</ui-select>
 		</template>
 	</section>
 </x-container>
@@ -39,6 +50,9 @@ export default Vue.extend({
 		value: {
 			required: true
 		},
+		aiScript: {
+			required: true,
+		},
 	},
 
 	data() {
@@ -53,7 +67,8 @@ export default Vue.extend({
 		if (this.value.content == null) Vue.set(this.value, 'content', null);
 		if (this.value.event == null) Vue.set(this.value, 'event', null);
 		if (this.value.message == null) Vue.set(this.value, 'message', null);
-		if (this.value.message == null) Vue.set(this.value, 'primary', false);
+		if (this.value.primary == null) Vue.set(this.value, 'primary', false);
+		if (this.value.var == null) Vue.set(this.value, 'var', null);
 	},
 });
 </script>
diff --git a/src/client/app/common/views/pages/page/page.button.vue b/src/client/app/common/views/pages/page/page.button.vue
index d3f0307625..4dc6570019 100644
--- a/src/client/app/common/views/pages/page/page.button.vue
+++ b/src/client/app/common/views/pages/page/page.button.vue
@@ -30,7 +30,10 @@ export default Vue.extend({
 			} else if (this.value.action === 'pushEvent') {
 				this.$root.api('page-push', {
 					pageId: this.script.page.id,
-					event: this.value.event
+					event: this.value.event,
+					...(this.value.var ? {
+						var: this.script.vars[this.value.var]
+					} : {})
 				});
 
 				this.$root.dialog({
diff --git a/src/server/api/endpoints/page-push.ts b/src/server/api/endpoints/page-push.ts
index 300df7c250..f5e1a4d1eb 100644
--- a/src/server/api/endpoints/page-push.ts
+++ b/src/server/api/endpoints/page-push.ts
@@ -16,6 +16,10 @@ export const meta = {
 
 		event: {
 			validator: $.str
+		},
+
+		var: {
+			validator: $.optional.nullable.any
 		}
 	},
 
@@ -37,6 +41,7 @@ export default define(meta, async (ps, user) => {
 	publishMainStream(user.id, 'pageEvent', {
 		pageId: ps.pageId,
 		event: ps.event,
+		var: ps.var,
 		user: await Users.pack(user, page.userId, {
 			detail: true
 		})
-- 
cgit v1.2.3-freya


From bd8d7c3d0f1bb831f26a75a6107e34a85a1bc804 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Sun, 7 Jul 2019 06:56:13 +0900
Subject: Improve Page
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* ページをピン留めできるように
* デッキでカラム内でページを見れるように
---
 locales/ja-JP.yml                                  |   4 +
 migration/1562444565093-PinnedPage.ts              |  17 ++
 migration/1562448332510-PageTitleHideOption.ts     |  13 ++
 .../common/views/components/page/page.block.vue    |  40 ++++
 .../common/views/components/page/page.button.vue   |  55 +++++
 .../common/views/components/page/page.counter.vue  |  47 +++++
 .../app/common/views/components/page/page.if.vue   |  30 +++
 .../common/views/components/page/page.image.vue    |  36 ++++
 .../views/components/page/page.number-input.vue    |  41 ++++
 .../app/common/views/components/page/page.post.vue |  68 +++++++
 .../common/views/components/page/page.section.vue  |  55 +++++
 .../common/views/components/page/page.switch.vue   |  43 ++++
 .../views/components/page/page.text-input.vue      |  41 ++++
 .../app/common/views/components/page/page.text.vue |  62 ++++++
 .../views/components/page/page.textarea-input.vue  |  36 ++++
 .../common/views/components/page/page.textarea.vue |  33 +++
 .../app/common/views/components/page/page.vue      | 218 ++++++++++++++++++++
 .../app/common/views/deck/deck.page-column.vue     |  69 +++++++
 .../common/views/deck/deck.user-column.home.vue    |   7 +
 .../common/views/pages/page-editor/page-editor.vue |   6 +
 src/client/app/common/views/pages/page.vue         |  63 ++++++
 .../app/common/views/pages/page/page.block.vue     |  40 ----
 .../app/common/views/pages/page/page.button.vue    |  55 -----
 .../app/common/views/pages/page/page.counter.vue   |  47 -----
 src/client/app/common/views/pages/page/page.if.vue |  30 ---
 .../app/common/views/pages/page/page.image.vue     |  36 ----
 .../common/views/pages/page/page.number-input.vue  |  41 ----
 .../app/common/views/pages/page/page.post.vue      |  68 -------
 .../app/common/views/pages/page/page.section.vue   |  55 -----
 .../app/common/views/pages/page/page.switch.vue    |  43 ----
 .../common/views/pages/page/page.text-input.vue    |  41 ----
 .../app/common/views/pages/page/page.text.vue      |  62 ------
 .../views/pages/page/page.textarea-input.vue       |  36 ----
 .../app/common/views/pages/page/page.textarea.vue  |  33 ---
 src/client/app/common/views/pages/page/page.vue    | 224 ---------------------
 src/client/app/desktop/script.ts                   |   4 +-
 .../app/desktop/views/home/user/user.home.vue      |   5 +-
 src/client/app/mobile/script.ts                    |   3 +-
 src/client/app/mobile/views/pages/user/home.vue    |   8 +
 src/models/entities/page.ts                        |   5 +
 src/models/entities/user-profile.ts                |  13 ++
 src/models/repositories/page.ts                    |   1 +
 src/models/repositories/user.ts                    |   4 +-
 src/server/api/endpoints/i/update.ts               |  27 ++-
 src/server/api/endpoints/pages/create.ts           |   6 +
 src/server/api/endpoints/pages/update.ts           |   5 +
 46 files changed, 1058 insertions(+), 818 deletions(-)
 create mode 100644 migration/1562444565093-PinnedPage.ts
 create mode 100644 migration/1562448332510-PageTitleHideOption.ts
 create mode 100644 src/client/app/common/views/components/page/page.block.vue
 create mode 100644 src/client/app/common/views/components/page/page.button.vue
 create mode 100644 src/client/app/common/views/components/page/page.counter.vue
 create mode 100644 src/client/app/common/views/components/page/page.if.vue
 create mode 100644 src/client/app/common/views/components/page/page.image.vue
 create mode 100644 src/client/app/common/views/components/page/page.number-input.vue
 create mode 100644 src/client/app/common/views/components/page/page.post.vue
 create mode 100644 src/client/app/common/views/components/page/page.section.vue
 create mode 100644 src/client/app/common/views/components/page/page.switch.vue
 create mode 100644 src/client/app/common/views/components/page/page.text-input.vue
 create mode 100644 src/client/app/common/views/components/page/page.text.vue
 create mode 100644 src/client/app/common/views/components/page/page.textarea-input.vue
 create mode 100644 src/client/app/common/views/components/page/page.textarea.vue
 create mode 100644 src/client/app/common/views/components/page/page.vue
 create mode 100644 src/client/app/common/views/deck/deck.page-column.vue
 create mode 100644 src/client/app/common/views/pages/page.vue
 delete mode 100644 src/client/app/common/views/pages/page/page.block.vue
 delete mode 100644 src/client/app/common/views/pages/page/page.button.vue
 delete mode 100644 src/client/app/common/views/pages/page/page.counter.vue
 delete mode 100644 src/client/app/common/views/pages/page/page.if.vue
 delete mode 100644 src/client/app/common/views/pages/page/page.image.vue
 delete mode 100644 src/client/app/common/views/pages/page/page.number-input.vue
 delete mode 100644 src/client/app/common/views/pages/page/page.post.vue
 delete mode 100644 src/client/app/common/views/pages/page/page.section.vue
 delete mode 100644 src/client/app/common/views/pages/page/page.switch.vue
 delete mode 100644 src/client/app/common/views/pages/page/page.text-input.vue
 delete mode 100644 src/client/app/common/views/pages/page/page.text.vue
 delete mode 100644 src/client/app/common/views/pages/page/page.textarea-input.vue
 delete mode 100644 src/client/app/common/views/pages/page/page.textarea.vue
 delete mode 100644 src/client/app/common/views/pages/page/page.vue

(limited to 'src/server/api')

diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index d29b96af1d..32a7fad398 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -1907,6 +1907,7 @@ deck/deck.user-column.vue:
   activity: "アクティビティ"
   timeline: "タイムライン"
   pinned-notes: "ピン留めされた投稿"
+  pinned-page: "ピン留めされたページ"
 
 docs:
   edit-this-page-on-github: "間違いや改善点を見つけましたか？"
@@ -1946,6 +1947,8 @@ pages:
   are-you-sure-delete: "このページを削除しますか？"
   page-deleted: "ページを削除しました"
   edit-this-page: "このページを編集"
+  pin-this-page: "ピン留め"
+  unpin-this-page: "ピン留め解除"
   view-source: "ソースを表示"
   view-page: "ページを見る"
   like: "いいね"
@@ -1964,6 +1967,7 @@ pages:
   url: "ページURL"
   summary: "ページの要約"
   align-center: "中央寄せ"
+  hide-title-when-pinned: "ピン留めされているときにタイトルを非表示"
   font: "フォント"
   fontSerif: "セリフ"
   fontSansSerif: "サンセリフ"
diff --git a/migration/1562444565093-PinnedPage.ts b/migration/1562444565093-PinnedPage.ts
new file mode 100644
index 0000000000..4bdee22748
--- /dev/null
+++ b/migration/1562444565093-PinnedPage.ts
@@ -0,0 +1,17 @@
+import {MigrationInterface, QueryRunner} from "typeorm";
+
+export class PinnedPage1562444565093 implements MigrationInterface {
+
+    public async up(queryRunner: QueryRunner): Promise<any> {
+        await queryRunner.query(`ALTER TABLE "user_profile" ADD "pinnedPageId" character varying(32)`);
+        await queryRunner.query(`ALTER TABLE "user_profile" ADD CONSTRAINT "UQ_6dc44f1ceb65b1e72bacef2ca27" UNIQUE ("pinnedPageId")`);
+        await queryRunner.query(`ALTER TABLE "user_profile" ADD CONSTRAINT "FK_6dc44f1ceb65b1e72bacef2ca27" FOREIGN KEY ("pinnedPageId") REFERENCES "page"("id") ON DELETE SET NULL ON UPDATE NO ACTION`);
+    }
+
+    public async down(queryRunner: QueryRunner): Promise<any> {
+        await queryRunner.query(`ALTER TABLE "user_profile" DROP CONSTRAINT "FK_6dc44f1ceb65b1e72bacef2ca27"`);
+        await queryRunner.query(`ALTER TABLE "user_profile" DROP CONSTRAINT "UQ_6dc44f1ceb65b1e72bacef2ca27"`);
+        await queryRunner.query(`ALTER TABLE "user_profile" DROP COLUMN "pinnedPageId"`);
+    }
+
+}
diff --git a/migration/1562448332510-PageTitleHideOption.ts b/migration/1562448332510-PageTitleHideOption.ts
new file mode 100644
index 0000000000..acc9b7e26f
--- /dev/null
+++ b/migration/1562448332510-PageTitleHideOption.ts
@@ -0,0 +1,13 @@
+import {MigrationInterface, QueryRunner} from "typeorm";
+
+export class PageTitleHideOption1562448332510 implements MigrationInterface {
+
+    public async up(queryRunner: QueryRunner): Promise<any> {
+        await queryRunner.query(`ALTER TABLE "page" ADD "hideTitleWhenPinned" boolean NOT NULL DEFAULT false`);
+    }
+
+    public async down(queryRunner: QueryRunner): Promise<any> {
+        await queryRunner.query(`ALTER TABLE "page" DROP COLUMN "hideTitleWhenPinned"`);
+    }
+
+}
diff --git a/src/client/app/common/views/components/page/page.block.vue b/src/client/app/common/views/components/page/page.block.vue
new file mode 100644
index 0000000000..1c421fc2c0
--- /dev/null
+++ b/src/client/app/common/views/components/page/page.block.vue
@@ -0,0 +1,40 @@
+<template>
+<component :is="'x-' + value.type" :value="value" :page="page" :script="script" :key="value.id" :h="h"/>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import XText from './page.text.vue';
+import XSection from './page.section.vue';
+import XImage from './page.image.vue';
+import XButton from './page.button.vue';
+import XNumberInput from './page.number-input.vue';
+import XTextInput from './page.text-input.vue';
+import XTextareaInput from './page.textarea-input.vue';
+import XSwitch from './page.switch.vue';
+import XIf from './page.if.vue';
+import XTextarea from './page.textarea.vue';
+import XPost from './page.post.vue';
+import XCounter from './page.counter.vue';
+
+export default Vue.extend({
+	components: {
+		XText, XSection, XImage, XButton, XNumberInput, XTextInput, XTextareaInput, XTextarea, XPost, XSwitch, XIf, XCounter
+	},
+
+	props: {
+		value: {
+			required: true
+		},
+		script: {
+			required: true
+		},
+		page: {
+			required: true
+		},
+		h: {
+			required: true
+		}
+	},
+});
+</script>
diff --git a/src/client/app/common/views/components/page/page.button.vue b/src/client/app/common/views/components/page/page.button.vue
new file mode 100644
index 0000000000..87112aca0d
--- /dev/null
+++ b/src/client/app/common/views/components/page/page.button.vue
@@ -0,0 +1,55 @@
+<template>
+<div>
+	<ui-button class="kudkigyw" @click="click()" :primary="value.primary">{{ script.interpolate(value.text) }}</ui-button>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+
+export default Vue.extend({
+	props: {
+		value: {
+			required: true
+		},
+		script: {
+			required: true
+		}
+	},
+
+	methods: {
+		click() {
+			if (this.value.action === 'dialog') {
+				this.script.eval();
+				this.$root.dialog({
+					text: this.script.interpolate(this.value.content)
+				});
+			} else if (this.value.action === 'resetRandom') {
+				this.script.aiScript.updateRandomSeed(Math.random());
+				this.script.eval();
+			} else if (this.value.action === 'pushEvent') {
+				this.$root.api('page-push', {
+					pageId: this.script.page.id,
+					event: this.value.event,
+					...(this.value.var ? {
+						var: this.script.vars[this.value.var]
+					} : {})
+				});
+
+				this.$root.dialog({
+					type: 'success',
+					text: this.script.interpolate(this.value.message)
+				});
+			}
+		}
+	}
+});
+</script>
+
+<style lang="stylus" scoped>
+.kudkigyw
+	display inline-block
+	min-width 200px
+	max-width 450px
+	margin 8px 0
+</style>
diff --git a/src/client/app/common/views/components/page/page.counter.vue b/src/client/app/common/views/components/page/page.counter.vue
new file mode 100644
index 0000000000..8d55319fe9
--- /dev/null
+++ b/src/client/app/common/views/components/page/page.counter.vue
@@ -0,0 +1,47 @@
+<template>
+<div>
+	<ui-button class="llumlmnx" @click="click()">{{ script.interpolate(value.text) }}</ui-button>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+
+export default Vue.extend({
+	props: {
+		value: {
+			required: true
+		},
+		script: {
+			required: true
+		}
+	},
+
+	data() {
+		return {
+			v: 0,
+		};
+	},
+
+	watch: {
+		v() {
+			this.script.aiScript.updatePageVar(this.value.name, this.v);
+			this.script.eval();
+		}
+	},
+
+	methods: {
+		click() {
+			this.v = this.v + (this.value.inc || 1);
+		}
+	}
+});
+</script>
+
+<style lang="stylus" scoped>
+.llumlmnx
+	display inline-block
+	min-width 300px
+	max-width 450px
+	margin 8px 0
+</style>
diff --git a/src/client/app/common/views/components/page/page.if.vue b/src/client/app/common/views/components/page/page.if.vue
new file mode 100644
index 0000000000..417ef0c553
--- /dev/null
+++ b/src/client/app/common/views/components/page/page.if.vue
@@ -0,0 +1,30 @@
+<template>
+<div v-show="script.vars[value.var]">
+	<x-block v-for="child in value.children" :value="child" :page="page" :script="script" :key="child.id" :h="h"/>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+
+export default Vue.extend({
+	props: {
+		value: {
+			required: true
+		},
+		script: {
+			required: true
+		},
+		page: {
+			required: true
+		},
+		h: {
+			required: true
+		}
+	},
+
+	beforeCreate() {
+		this.$options.components.XBlock = require('./page.block.vue').default
+	},
+});
+</script>
diff --git a/src/client/app/common/views/components/page/page.image.vue b/src/client/app/common/views/components/page/page.image.vue
new file mode 100644
index 0000000000..1285445eb0
--- /dev/null
+++ b/src/client/app/common/views/components/page/page.image.vue
@@ -0,0 +1,36 @@
+<template>
+<div class="lzyxtsnt">
+	<img v-if="image" :src="image.url"/>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+
+export default Vue.extend({
+	props: {
+		value: {
+			required: true
+		},
+		page: {
+			required: true
+		},
+	},
+
+	data() {
+		return {
+			image: null,
+		};
+	},
+
+	created() {
+		this.image = this.page.attachedFiles.find(x => x.id === this.value.fileId);
+	}
+});
+</script>
+
+<style lang="stylus" scoped>
+.lzyxtsnt
+	> img
+		max-width 100%
+</style>
diff --git a/src/client/app/common/views/components/page/page.number-input.vue b/src/client/app/common/views/components/page/page.number-input.vue
new file mode 100644
index 0000000000..31da37330a
--- /dev/null
+++ b/src/client/app/common/views/components/page/page.number-input.vue
@@ -0,0 +1,41 @@
+<template>
+<div>
+	<ui-input class="kudkigyw" v-model="v" type="number">{{ script.interpolate(value.text) }}</ui-input>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+
+export default Vue.extend({
+	props: {
+		value: {
+			required: true
+		},
+		script: {
+			required: true
+		}
+	},
+
+	data() {
+		return {
+			v: this.value.default,
+		};
+	},
+
+	watch: {
+		v() {
+			this.script.aiScript.updatePageVar(this.value.name, this.v);
+			this.script.eval();
+		}
+	}
+});
+</script>
+
+<style lang="stylus" scoped>
+.kudkigyw
+	display inline-block
+	min-width 300px
+	max-width 450px
+	margin 8px 0
+</style>
diff --git a/src/client/app/common/views/components/page/page.post.vue b/src/client/app/common/views/components/page/page.post.vue
new file mode 100644
index 0000000000..cb695e21e9
--- /dev/null
+++ b/src/client/app/common/views/components/page/page.post.vue
@@ -0,0 +1,68 @@
+<template>
+<div class="ngbfujlo">
+	<ui-textarea class="textarea" :value="text" readonly></ui-textarea>
+	<ui-button primary @click="post()" :disabled="posting || posted">{{ posted ? $t('posted-from-post-form') : $t('post-from-post-form') }}</ui-button>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import i18n from '../../../../i18n';
+
+export default Vue.extend({
+	i18n: i18n('pages'),
+
+	props: {
+		value: {
+			required: true
+		},
+		script: {
+			required: true
+		}
+	},
+
+	data() {
+		return {
+			text: this.script.interpolate(this.value.text),
+			posted: false,
+			posting: false,
+		};
+	},
+
+	created() {
+		this.$watch('script.vars', () => {
+			this.text = this.script.interpolate(this.value.text);
+		}, { deep: true });
+	},
+
+	methods: {
+		post() {
+			this.posting = true;
+			this.$root.api('notes/create', {
+				text: this.text,
+			}).then(() => {
+				this.posted = true;
+				this.$root.dialog({
+					type: 'success',
+					splash: true
+				});
+			});
+		}
+	}
+});
+</script>
+
+<style lang="stylus" scoped>
+.ngbfujlo
+	padding 0 32px 32px 32px
+	border solid 2px var(--pageBlockBorder)
+	border-radius 6px
+
+	@media (max-width 600px)
+		padding 0 16px 16px 16px
+
+		> .textarea
+			margin-top 16px
+			margin-bottom 16px
+
+</style>
diff --git a/src/client/app/common/views/components/page/page.section.vue b/src/client/app/common/views/components/page/page.section.vue
new file mode 100644
index 0000000000..03c009d9c3
--- /dev/null
+++ b/src/client/app/common/views/components/page/page.section.vue
@@ -0,0 +1,55 @@
+<template>
+<section class="sdgxphyu">
+	<component :is="'h' + h">{{ value.title }}</component>
+
+	<div class="children">
+		<x-block v-for="child in value.children" :value="child" :page="page" :script="script" :key="child.id" :h="h + 1"/>
+	</div>
+</section>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+
+export default Vue.extend({
+	props: {
+		value: {
+			required: true
+		},
+		script: {
+			required: true
+		},
+		page: {
+			required: true
+		},
+		h: {
+			required: true
+		}
+	},
+
+	beforeCreate() {
+		this.$options.components.XBlock = require('./page.block.vue').default
+	},
+});
+</script>
+
+<style lang="stylus" scoped>
+.sdgxphyu
+	margin 1.5em 0
+
+	> h2
+		font-size 1.35em
+		margin 0 0 0.5em 0
+
+	> h3
+		font-size 1em
+		margin 0 0 0.5em 0
+
+	> h4
+		font-size 1em
+		margin 0 0 0.5em 0
+
+	> .children
+		//padding 16px
+
+</style>
diff --git a/src/client/app/common/views/components/page/page.switch.vue b/src/client/app/common/views/components/page/page.switch.vue
new file mode 100644
index 0000000000..53695f1b36
--- /dev/null
+++ b/src/client/app/common/views/components/page/page.switch.vue
@@ -0,0 +1,43 @@
+<template>
+<div class="hkcxmtwj">
+	<ui-switch v-model="v">{{ script.interpolate(value.text) }}</ui-switch>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+
+export default Vue.extend({
+	props: {
+		value: {
+			required: true
+		},
+		script: {
+			required: true
+		}
+	},
+
+	data() {
+		return {
+			v: this.value.default,
+		};
+	},
+
+	watch: {
+		v() {
+			this.script.aiScript.updatePageVar(this.value.name, this.v);
+			this.script.eval();
+		}
+	}
+});
+</script>
+
+<style lang="stylus" scoped>
+.hkcxmtwj
+	display inline-block
+	margin 16px auto
+
+	& + .hkcxmtwj
+		margin-left 16px
+
+</style>
diff --git a/src/client/app/common/views/components/page/page.text-input.vue b/src/client/app/common/views/components/page/page.text-input.vue
new file mode 100644
index 0000000000..cf917dd5a8
--- /dev/null
+++ b/src/client/app/common/views/components/page/page.text-input.vue
@@ -0,0 +1,41 @@
+<template>
+<div>
+	<ui-input class="kudkigyw" v-model="v" type="text">{{ script.interpolate(value.text) }}</ui-input>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+
+export default Vue.extend({
+	props: {
+		value: {
+			required: true
+		},
+		script: {
+			required: true
+		}
+	},
+
+	data() {
+		return {
+			v: this.value.default,
+		};
+	},
+
+	watch: {
+		v() {
+			this.script.aiScript.updatePageVar(this.value.name, this.v);
+			this.script.eval();
+		}
+	}
+});
+</script>
+
+<style lang="stylus" scoped>
+.kudkigyw
+	display inline-block
+	min-width 300px
+	max-width 450px
+	margin 8px 0
+</style>
diff --git a/src/client/app/common/views/components/page/page.text.vue b/src/client/app/common/views/components/page/page.text.vue
new file mode 100644
index 0000000000..326fd39050
--- /dev/null
+++ b/src/client/app/common/views/components/page/page.text.vue
@@ -0,0 +1,62 @@
+<template>
+<div class="mrdgzndn">
+	<mfm :text="text" :is-note="false" :i="$store.state.i" :key="text"/>
+
+	<mk-url-preview v-for="url in urls" :url="url" :key="url" class="url"/>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import { parse } from '../../../../../../mfm/parse';
+import { unique } from '../../../../../../prelude/array';
+
+export default Vue.extend({
+	props: {
+		value: {
+			required: true
+		},
+		script: {
+			required: true
+		}
+	},
+
+	data() {
+		return {
+			text: this.script.interpolate(this.value.text),
+		};
+	},
+
+	computed: {
+		urls(): string[] {
+			if (this.text) {
+				const ast = parse(this.text);
+				// TODO: 再帰的にURL要素がないか調べる
+				return unique(ast
+					.filter(t => ((t.node.type == 'url' || t.node.type == 'link') && t.node.props.url && !t.node.props.silent))
+					.map(t => t.node.props.url));
+			} else {
+				return [];
+			}
+		}
+	},
+
+	created() {
+		this.$watch('script.vars', () => {
+			this.text = this.script.interpolate(this.value.text);
+		}, { deep: true });
+	}
+});
+</script>
+
+<style lang="stylus" scoped>
+.mrdgzndn
+	&:not(:first-child)
+		margin-top 0.5em
+
+	&:not(:last-child)
+		margin-bottom 0.5em
+
+	> .url
+		margin 0.5em 0
+</style>
diff --git a/src/client/app/common/views/components/page/page.textarea-input.vue b/src/client/app/common/views/components/page/page.textarea-input.vue
new file mode 100644
index 0000000000..eece59fefb
--- /dev/null
+++ b/src/client/app/common/views/components/page/page.textarea-input.vue
@@ -0,0 +1,36 @@
+<template>
+<div>
+	<ui-textarea class="" v-model="v">{{ script.interpolate(value.text) }}</ui-textarea>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+
+export default Vue.extend({
+	props: {
+		value: {
+			required: true
+		},
+		script: {
+			required: true
+		}
+	},
+
+	data() {
+		return {
+			v: this.value.default,
+		};
+	},
+
+	watch: {
+		v() {
+			this.script.aiScript.updatePageVar(this.value.name, this.v);
+			this.script.eval();
+		}
+	}
+});
+</script>
+
+<style lang="stylus" scoped>
+</style>
diff --git a/src/client/app/common/views/components/page/page.textarea.vue b/src/client/app/common/views/components/page/page.textarea.vue
new file mode 100644
index 0000000000..03c8542cb0
--- /dev/null
+++ b/src/client/app/common/views/components/page/page.textarea.vue
@@ -0,0 +1,33 @@
+<template>
+<ui-textarea class="" :value="text" readonly></ui-textarea>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+
+export default Vue.extend({
+	props: {
+		value: {
+			required: true
+		},
+		script: {
+			required: true
+		}
+	},
+
+	data() {
+		return {
+			text: this.script.interpolate(this.value.text),
+		};
+	},
+
+	created() {
+		this.$watch('script.vars', () => {
+			this.text = this.script.interpolate(this.value.text);
+		}, { deep: true });
+	}
+});
+</script>
+
+<style lang="stylus" scoped>
+</style>
diff --git a/src/client/app/common/views/components/page/page.vue b/src/client/app/common/views/components/page/page.vue
new file mode 100644
index 0000000000..99e627fd89
--- /dev/null
+++ b/src/client/app/common/views/components/page/page.vue
@@ -0,0 +1,218 @@
+<template>
+<div class="iroscrza" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners, center: page.alignCenter }" :style="{ fontFamily: page.font }">
+	<header v-if="showTitle">
+		<div class="title">{{ page.title }}</div>
+	</header>
+
+	<div v-if="script">
+		<x-block v-for="child in page.content" :value="child" @input="v => updateBlock(v)" :page="page" :script="script" :key="child.id" :h="2"/>
+	</div>
+
+	<footer v-if="showFooter">
+		<small>@{{ page.user.username }}</small>
+		<template v-if="$store.getters.isSignedIn && $store.state.i.id === page.userId">
+			<router-link :to="`/i/pages/edit/${page.id}`">{{ $t('edit-this-page') }}</router-link>
+			<a v-if="$store.state.i.pinnedPageId === page.id" @click="pin(false)">{{ $t('unpin-this-page') }}</a>
+			<a v-else @click="pin(true)">{{ $t('pin-this-page') }}</a>
+		</template>
+		<router-link :to="`./${page.name}/view-source`">{{ $t('view-source') }}</router-link>
+		<div class="like">
+			<button @click="unlike()" v-if="page.isLiked" :title="$t('unlike')"><fa :icon="faHeartS"/></button>
+			<button @click="like()" v-else :title="$t('like')"><fa :icon="faHeart"/></button>
+			<span class="count" v-if="page.likedCount > 0">{{ page.likedCount }}</span>
+		</div>
+	</footer>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import i18n from '../../../../i18n';
+import { faHeart as faHeartS } from '@fortawesome/free-solid-svg-icons';
+import { faHeart } from '@fortawesome/free-regular-svg-icons';
+import XBlock from './page.block.vue';
+import { ASEvaluator } from '../../../../../../misc/aiscript/evaluator';
+import { collectPageVars } from '../../../scripts/collect-page-vars';
+import { url } from '../../../../config';
+
+class Script {
+	public aiScript: ASEvaluator;
+	private onError: any;
+	public vars: Record<string, any>;
+	public page: Record<string, any>;
+
+	constructor(page, aiScript, onError) {
+		this.page = page;
+		this.aiScript = aiScript;
+		this.onError = onError;
+		this.eval();
+	}
+
+	public eval() {
+		try {
+			this.vars = this.aiScript.evaluateVars();
+		} catch (e) {
+			this.onError(e);
+		}
+	}
+
+	public interpolate(str: string) {
+		if (str == null) return null;
+		return str.replace(/{(.+?)}/g, match => {
+			const v = this.vars[match.slice(1, -1).trim()];
+			return v == null ? 'NULL' : v.toString();
+		});
+	}
+}
+
+export default Vue.extend({
+	i18n: i18n('pages'),
+
+	components: {
+		XBlock
+	},
+
+	props: {
+		page: {
+			type: Object,
+			required: true
+		},
+		showTitle: {
+			type: Boolean,
+			required: false,
+			default: true
+		},
+		showFooter: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+	},
+
+	data() {
+		return {
+			script: null,
+			faHeartS, faHeart
+		};
+	},
+
+	created() {
+		const pageVars = this.getPageVars();
+		this.script = new Script(this.page, new ASEvaluator(this.page.variables, pageVars, {
+			randomSeed: Math.random(),
+			user: this.page.user,
+			visitor: this.$store.state.i,
+			page: this.page,
+			url: url
+		}), e => {
+			console.dir(e);
+		});
+	},
+
+	methods: {
+		getPageVars() {
+			return collectPageVars(this.page.content);
+		},
+
+		like() {
+			this.$root.api('pages/like', {
+				pageId: this.page.id,
+			}).then(() => {
+				this.page.isLiked = true;
+				this.page.likedCount++;
+			});
+		},
+
+		unlike() {
+			this.$root.api('pages/unlike', {
+				pageId: this.page.id,
+			}).then(() => {
+				this.page.isLiked = false;
+				this.page.likedCount--;
+			});
+		},
+
+		pin(pin) {
+			this.$root.api('i/update', {
+				pinnedPageId: pin ? this.page.id : null,
+			}).then(() => {
+				this.$root.dialog({
+					type: 'success',
+					splash: true
+				});
+			});
+		}
+	}
+});
+</script>
+
+<style lang="stylus" scoped>
+.iroscrza
+	overflow hidden
+	background var(--face)
+
+	&.center
+		text-align center
+
+	&.round
+		border-radius 6px
+
+	&.shadow
+		box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
+
+	> header
+		> .title
+			z-index 1
+			margin 0
+			padding 16px 32px
+			font-size 20px
+			font-weight bold
+			color var(--text)
+			box-shadow 0 var(--lineWidth) rgba(#000, 0.07)
+
+			@media (max-width 600px)
+				padding 16px 32px
+				font-size 20px
+
+			@media (max-width 400px)
+				padding 10px 20px
+				font-size 16px
+
+	> div
+		color var(--text)
+		padding 24px 32px
+		font-size 16px
+
+		@media (max-width 600px)
+			padding 24px 32px
+			font-size 16px
+
+		@media (max-width 400px)
+			padding 20px 20px
+			font-size 15px
+
+	> footer
+		color var(--text)
+		padding 0 32px 28px 32px
+
+		@media (max-width 600px)
+			padding 0 32px 28px 32px
+
+		@media (max-width 400px)
+			padding 0 20px 20px 20px
+			font-size 14px
+
+		> small
+			display block
+			opacity 0.5
+
+		> a
+			font-size 90%
+
+		> a + a
+			margin-left 8px
+
+		> .like
+			margin-top 16px
+
+</style>
diff --git a/src/client/app/common/views/deck/deck.page-column.vue b/src/client/app/common/views/deck/deck.page-column.vue
new file mode 100644
index 0000000000..0ef391a51d
--- /dev/null
+++ b/src/client/app/common/views/deck/deck.page-column.vue
@@ -0,0 +1,69 @@
+<template>
+<x-column>
+	<template #header>
+		<fa :icon="faStickyNote"/>{{ page ? page.name : '' }}
+	</template>
+
+	<div v-if="page">
+		<x-page :page="page" :key="page.id"/>
+	</div>
+</x-column>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import { faStickyNote } from '@fortawesome/free-regular-svg-icons';
+import i18n from '../../../i18n';
+import XColumn from './deck.column.vue';
+import XPage from '../../../common/views/components/page/page.vue';
+
+export default Vue.extend({
+	i18n: i18n(),
+
+	components: {
+		XColumn,
+		XPage
+	},
+
+	props: {
+		pageName: {
+			type: String,
+			required: true
+		},
+		username: {
+			type: String,
+			required: true
+		},
+	},
+
+	data() {
+		return {
+			page: null,
+			faStickyNote
+		};
+	},
+
+	watch: {
+		$route: 'fetch'
+	},
+
+	created() {
+		this.fetch();
+	},
+
+	methods: {
+		fetch() {
+			this.$root.api('pages/show', {
+				name: this.pageName,
+				username: this.username,
+			}).then(page => {
+				this.page = page;
+				this.$emit('init', {
+					title: this.page.title,
+					icon: faStickyNote
+				});
+			});
+		}
+	}
+});
+</script>
diff --git a/src/client/app/common/views/deck/deck.user-column.home.vue b/src/client/app/common/views/deck/deck.user-column.home.vue
index 56b117a7dd..9fb50a6672 100644
--- a/src/client/app/common/views/deck/deck.user-column.home.vue
+++ b/src/client/app/common/views/deck/deck.user-column.home.vue
@@ -1,5 +1,11 @@
 <template>
 <div>
+	<ui-container v-if="user.pinnedPage" :body-togglable="true">
+		<template #header><fa icon="thumbtack"/> {{ $t('pinned-page') }}</template>
+		<div>
+			<x-page :page="user.pinnedPage" :key="user.pinnedPage.id" :show-title="!user.pinnedPage.hideTitleWhenPinned"/>
+		</div>
+	</ui-container>
 	<ui-container v-if="user.pinnedNotes && user.pinnedNotes.length > 0" :body-togglable="true">
 		<template #header><fa icon="thumbtack"/> {{ $t('pinned-notes') }}</template>
 		<div>
@@ -48,6 +54,7 @@ export default Vue.extend({
 
 	components: {
 		XNotes,
+		XPage: () => import('../../../common/views/components/page/page.vue').then(m => m.default),
 	},
 
 	props: {
diff --git a/src/client/app/common/views/pages/page-editor/page-editor.vue b/src/client/app/common/views/pages/page-editor/page-editor.vue
index ebe0f4688d..ade7d86991 100644
--- a/src/client/app/common/views/pages/page-editor/page-editor.vue
+++ b/src/client/app/common/views/pages/page-editor/page-editor.vue
@@ -35,6 +35,8 @@
 					<option value="sans-serif">{{ $t('fontSansSerif') }}</option>
 				</ui-select>
 
+				<ui-switch v-model="hideTitleWhenPinned">{{ $t('hide-title-when-pinned') }}</ui-switch>
+
 				<div class="eyeCatch">
 					<ui-button v-if="eyeCatchingImageId == null && !readonly" @click="setEyeCatchingImage()"><fa :icon="faPlus"/> {{ $t('set-eye-catching-image') }}</ui-button>
 					<div v-else-if="eyeCatchingImage">
@@ -140,6 +142,7 @@ export default Vue.extend({
 			font: 'sans-serif',
 			content: [],
 			alignCenter: false,
+			hideTitleWhenPinned: false,
 			variables: [],
 			aiScript: null,
 			showOptions: false,
@@ -192,6 +195,7 @@ export default Vue.extend({
 			this.currentName = this.page.name;
 			this.summary = this.page.summary;
 			this.font = this.page.font;
+			this.hideTitleWhenPinned = this.page.hideTitleWhenPinned;
 			this.alignCenter = this.page.alignCenter;
 			this.content = this.page.content;
 			this.variables = this.page.variables;
@@ -223,6 +227,7 @@ export default Vue.extend({
 					name: this.name.trim(),
 					summary: this.summary,
 					font: this.font,
+					hideTitleWhenPinned: this.hideTitleWhenPinned,
 					alignCenter: this.alignCenter,
 					content: this.content,
 					variables: this.variables,
@@ -240,6 +245,7 @@ export default Vue.extend({
 					name: this.name.trim(),
 					summary: this.summary,
 					font: this.font,
+					hideTitleWhenPinned: this.hideTitleWhenPinned,
 					alignCenter: this.alignCenter,
 					content: this.content,
 					variables: this.variables,
diff --git a/src/client/app/common/views/pages/page.vue b/src/client/app/common/views/pages/page.vue
new file mode 100644
index 0000000000..d1c4c2be43
--- /dev/null
+++ b/src/client/app/common/views/pages/page.vue
@@ -0,0 +1,63 @@
+<template>
+<x-page v-if="page" :page="page" :key="page.id" :show-footer="true"/>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import { faStickyNote } from '@fortawesome/free-regular-svg-icons';
+import XPage from '../components/page/page.vue';
+
+export default Vue.extend({
+	components: {
+		XPage
+	},
+
+	props: {
+		pageName: {
+			type: String,
+			required: true
+		},
+		username: {
+			type: String,
+			required: true
+		},
+	},
+
+	data() {
+		return {
+			page: null,
+		};
+	},
+
+	computed: {
+		path(): string {
+			return this.username + '/' + this.pageName;
+		}
+	},
+
+	watch: {
+		path() {
+			this.fetch();
+		}
+	},
+
+	created() {
+		this.fetch();
+	},
+
+	methods: {
+		fetch() {
+			this.$root.api('pages/show', {
+				name: this.pageName,
+				username: this.username,
+			}).then(page => {
+				this.page = page;
+				this.$emit('init', {
+					title: this.page.title,
+					icon: faStickyNote
+				});
+			});
+		},
+	}
+});
+</script>
diff --git a/src/client/app/common/views/pages/page/page.block.vue b/src/client/app/common/views/pages/page/page.block.vue
deleted file mode 100644
index 1c421fc2c0..0000000000
--- a/src/client/app/common/views/pages/page/page.block.vue
+++ /dev/null
@@ -1,40 +0,0 @@
-<template>
-<component :is="'x-' + value.type" :value="value" :page="page" :script="script" :key="value.id" :h="h"/>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-import XText from './page.text.vue';
-import XSection from './page.section.vue';
-import XImage from './page.image.vue';
-import XButton from './page.button.vue';
-import XNumberInput from './page.number-input.vue';
-import XTextInput from './page.text-input.vue';
-import XTextareaInput from './page.textarea-input.vue';
-import XSwitch from './page.switch.vue';
-import XIf from './page.if.vue';
-import XTextarea from './page.textarea.vue';
-import XPost from './page.post.vue';
-import XCounter from './page.counter.vue';
-
-export default Vue.extend({
-	components: {
-		XText, XSection, XImage, XButton, XNumberInput, XTextInput, XTextareaInput, XTextarea, XPost, XSwitch, XIf, XCounter
-	},
-
-	props: {
-		value: {
-			required: true
-		},
-		script: {
-			required: true
-		},
-		page: {
-			required: true
-		},
-		h: {
-			required: true
-		}
-	},
-});
-</script>
diff --git a/src/client/app/common/views/pages/page/page.button.vue b/src/client/app/common/views/pages/page/page.button.vue
deleted file mode 100644
index 4dc6570019..0000000000
--- a/src/client/app/common/views/pages/page/page.button.vue
+++ /dev/null
@@ -1,55 +0,0 @@
-<template>
-<div>
-	<ui-button class="kudkigyw" @click="click()" :primary="value.primary">{{ script.interpolate(value.text) }}</ui-button>
-</div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-
-export default Vue.extend({
-	props: {
-		value: {
-			required: true
-		},
-		script: {
-			required: true
-		}
-	},
-
-	methods: {
-		click() {
-			if (this.value.action === 'dialog') {
-				this.script.eval();
-				this.$root.dialog({
-					text: this.script.interpolate(this.value.content)
-				});
-			} else if (this.value.action === 'resetRandom') {
-				this.script.aiScript.updateRandomSeed(Math.random());
-				this.script.eval();
-			} else if (this.value.action === 'pushEvent') {
-				this.$root.api('page-push', {
-					pageId: this.script.page.id,
-					event: this.value.event,
-					...(this.value.var ? {
-						var: this.script.vars[this.value.var]
-					} : {})
-				});
-
-				this.$root.dialog({
-					type: 'success',
-					text: this.script.interpolate(this.value.message)
-				});
-			}
-		}
-	}
-});
-</script>
-
-<style lang="stylus" scoped>
-.kudkigyw
-	display inline-block
-	min-width 300px
-	max-width 450px
-	margin 8px 0
-</style>
diff --git a/src/client/app/common/views/pages/page/page.counter.vue b/src/client/app/common/views/pages/page/page.counter.vue
deleted file mode 100644
index 8d55319fe9..0000000000
--- a/src/client/app/common/views/pages/page/page.counter.vue
+++ /dev/null
@@ -1,47 +0,0 @@
-<template>
-<div>
-	<ui-button class="llumlmnx" @click="click()">{{ script.interpolate(value.text) }}</ui-button>
-</div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-
-export default Vue.extend({
-	props: {
-		value: {
-			required: true
-		},
-		script: {
-			required: true
-		}
-	},
-
-	data() {
-		return {
-			v: 0,
-		};
-	},
-
-	watch: {
-		v() {
-			this.script.aiScript.updatePageVar(this.value.name, this.v);
-			this.script.eval();
-		}
-	},
-
-	methods: {
-		click() {
-			this.v = this.v + (this.value.inc || 1);
-		}
-	}
-});
-</script>
-
-<style lang="stylus" scoped>
-.llumlmnx
-	display inline-block
-	min-width 300px
-	max-width 450px
-	margin 8px 0
-</style>
diff --git a/src/client/app/common/views/pages/page/page.if.vue b/src/client/app/common/views/pages/page/page.if.vue
deleted file mode 100644
index 417ef0c553..0000000000
--- a/src/client/app/common/views/pages/page/page.if.vue
+++ /dev/null
@@ -1,30 +0,0 @@
-<template>
-<div v-show="script.vars[value.var]">
-	<x-block v-for="child in value.children" :value="child" :page="page" :script="script" :key="child.id" :h="h"/>
-</div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-
-export default Vue.extend({
-	props: {
-		value: {
-			required: true
-		},
-		script: {
-			required: true
-		},
-		page: {
-			required: true
-		},
-		h: {
-			required: true
-		}
-	},
-
-	beforeCreate() {
-		this.$options.components.XBlock = require('./page.block.vue').default
-	},
-});
-</script>
diff --git a/src/client/app/common/views/pages/page/page.image.vue b/src/client/app/common/views/pages/page/page.image.vue
deleted file mode 100644
index 1285445eb0..0000000000
--- a/src/client/app/common/views/pages/page/page.image.vue
+++ /dev/null
@@ -1,36 +0,0 @@
-<template>
-<div class="lzyxtsnt">
-	<img v-if="image" :src="image.url"/>
-</div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-
-export default Vue.extend({
-	props: {
-		value: {
-			required: true
-		},
-		page: {
-			required: true
-		},
-	},
-
-	data() {
-		return {
-			image: null,
-		};
-	},
-
-	created() {
-		this.image = this.page.attachedFiles.find(x => x.id === this.value.fileId);
-	}
-});
-</script>
-
-<style lang="stylus" scoped>
-.lzyxtsnt
-	> img
-		max-width 100%
-</style>
diff --git a/src/client/app/common/views/pages/page/page.number-input.vue b/src/client/app/common/views/pages/page/page.number-input.vue
deleted file mode 100644
index 31da37330a..0000000000
--- a/src/client/app/common/views/pages/page/page.number-input.vue
+++ /dev/null
@@ -1,41 +0,0 @@
-<template>
-<div>
-	<ui-input class="kudkigyw" v-model="v" type="number">{{ script.interpolate(value.text) }}</ui-input>
-</div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-
-export default Vue.extend({
-	props: {
-		value: {
-			required: true
-		},
-		script: {
-			required: true
-		}
-	},
-
-	data() {
-		return {
-			v: this.value.default,
-		};
-	},
-
-	watch: {
-		v() {
-			this.script.aiScript.updatePageVar(this.value.name, this.v);
-			this.script.eval();
-		}
-	}
-});
-</script>
-
-<style lang="stylus" scoped>
-.kudkigyw
-	display inline-block
-	min-width 300px
-	max-width 450px
-	margin 8px 0
-</style>
diff --git a/src/client/app/common/views/pages/page/page.post.vue b/src/client/app/common/views/pages/page/page.post.vue
deleted file mode 100644
index cb695e21e9..0000000000
--- a/src/client/app/common/views/pages/page/page.post.vue
+++ /dev/null
@@ -1,68 +0,0 @@
-<template>
-<div class="ngbfujlo">
-	<ui-textarea class="textarea" :value="text" readonly></ui-textarea>
-	<ui-button primary @click="post()" :disabled="posting || posted">{{ posted ? $t('posted-from-post-form') : $t('post-from-post-form') }}</ui-button>
-</div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-import i18n from '../../../../i18n';
-
-export default Vue.extend({
-	i18n: i18n('pages'),
-
-	props: {
-		value: {
-			required: true
-		},
-		script: {
-			required: true
-		}
-	},
-
-	data() {
-		return {
-			text: this.script.interpolate(this.value.text),
-			posted: false,
-			posting: false,
-		};
-	},
-
-	created() {
-		this.$watch('script.vars', () => {
-			this.text = this.script.interpolate(this.value.text);
-		}, { deep: true });
-	},
-
-	methods: {
-		post() {
-			this.posting = true;
-			this.$root.api('notes/create', {
-				text: this.text,
-			}).then(() => {
-				this.posted = true;
-				this.$root.dialog({
-					type: 'success',
-					splash: true
-				});
-			});
-		}
-	}
-});
-</script>
-
-<style lang="stylus" scoped>
-.ngbfujlo
-	padding 0 32px 32px 32px
-	border solid 2px var(--pageBlockBorder)
-	border-radius 6px
-
-	@media (max-width 600px)
-		padding 0 16px 16px 16px
-
-		> .textarea
-			margin-top 16px
-			margin-bottom 16px
-
-</style>
diff --git a/src/client/app/common/views/pages/page/page.section.vue b/src/client/app/common/views/pages/page/page.section.vue
deleted file mode 100644
index 03c009d9c3..0000000000
--- a/src/client/app/common/views/pages/page/page.section.vue
+++ /dev/null
@@ -1,55 +0,0 @@
-<template>
-<section class="sdgxphyu">
-	<component :is="'h' + h">{{ value.title }}</component>
-
-	<div class="children">
-		<x-block v-for="child in value.children" :value="child" :page="page" :script="script" :key="child.id" :h="h + 1"/>
-	</div>
-</section>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-
-export default Vue.extend({
-	props: {
-		value: {
-			required: true
-		},
-		script: {
-			required: true
-		},
-		page: {
-			required: true
-		},
-		h: {
-			required: true
-		}
-	},
-
-	beforeCreate() {
-		this.$options.components.XBlock = require('./page.block.vue').default
-	},
-});
-</script>
-
-<style lang="stylus" scoped>
-.sdgxphyu
-	margin 1.5em 0
-
-	> h2
-		font-size 1.35em
-		margin 0 0 0.5em 0
-
-	> h3
-		font-size 1em
-		margin 0 0 0.5em 0
-
-	> h4
-		font-size 1em
-		margin 0 0 0.5em 0
-
-	> .children
-		//padding 16px
-
-</style>
diff --git a/src/client/app/common/views/pages/page/page.switch.vue b/src/client/app/common/views/pages/page/page.switch.vue
deleted file mode 100644
index 53695f1b36..0000000000
--- a/src/client/app/common/views/pages/page/page.switch.vue
+++ /dev/null
@@ -1,43 +0,0 @@
-<template>
-<div class="hkcxmtwj">
-	<ui-switch v-model="v">{{ script.interpolate(value.text) }}</ui-switch>
-</div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-
-export default Vue.extend({
-	props: {
-		value: {
-			required: true
-		},
-		script: {
-			required: true
-		}
-	},
-
-	data() {
-		return {
-			v: this.value.default,
-		};
-	},
-
-	watch: {
-		v() {
-			this.script.aiScript.updatePageVar(this.value.name, this.v);
-			this.script.eval();
-		}
-	}
-});
-</script>
-
-<style lang="stylus" scoped>
-.hkcxmtwj
-	display inline-block
-	margin 16px auto
-
-	& + .hkcxmtwj
-		margin-left 16px
-
-</style>
diff --git a/src/client/app/common/views/pages/page/page.text-input.vue b/src/client/app/common/views/pages/page/page.text-input.vue
deleted file mode 100644
index cf917dd5a8..0000000000
--- a/src/client/app/common/views/pages/page/page.text-input.vue
+++ /dev/null
@@ -1,41 +0,0 @@
-<template>
-<div>
-	<ui-input class="kudkigyw" v-model="v" type="text">{{ script.interpolate(value.text) }}</ui-input>
-</div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-
-export default Vue.extend({
-	props: {
-		value: {
-			required: true
-		},
-		script: {
-			required: true
-		}
-	},
-
-	data() {
-		return {
-			v: this.value.default,
-		};
-	},
-
-	watch: {
-		v() {
-			this.script.aiScript.updatePageVar(this.value.name, this.v);
-			this.script.eval();
-		}
-	}
-});
-</script>
-
-<style lang="stylus" scoped>
-.kudkigyw
-	display inline-block
-	min-width 300px
-	max-width 450px
-	margin 8px 0
-</style>
diff --git a/src/client/app/common/views/pages/page/page.text.vue b/src/client/app/common/views/pages/page/page.text.vue
deleted file mode 100644
index 326fd39050..0000000000
--- a/src/client/app/common/views/pages/page/page.text.vue
+++ /dev/null
@@ -1,62 +0,0 @@
-<template>
-<div class="mrdgzndn">
-	<mfm :text="text" :is-note="false" :i="$store.state.i" :key="text"/>
-
-	<mk-url-preview v-for="url in urls" :url="url" :key="url" class="url"/>
-</div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-import { parse } from '../../../../../../mfm/parse';
-import { unique } from '../../../../../../prelude/array';
-
-export default Vue.extend({
-	props: {
-		value: {
-			required: true
-		},
-		script: {
-			required: true
-		}
-	},
-
-	data() {
-		return {
-			text: this.script.interpolate(this.value.text),
-		};
-	},
-
-	computed: {
-		urls(): string[] {
-			if (this.text) {
-				const ast = parse(this.text);
-				// TODO: 再帰的にURL要素がないか調べる
-				return unique(ast
-					.filter(t => ((t.node.type == 'url' || t.node.type == 'link') && t.node.props.url && !t.node.props.silent))
-					.map(t => t.node.props.url));
-			} else {
-				return [];
-			}
-		}
-	},
-
-	created() {
-		this.$watch('script.vars', () => {
-			this.text = this.script.interpolate(this.value.text);
-		}, { deep: true });
-	}
-});
-</script>
-
-<style lang="stylus" scoped>
-.mrdgzndn
-	&:not(:first-child)
-		margin-top 0.5em
-
-	&:not(:last-child)
-		margin-bottom 0.5em
-
-	> .url
-		margin 0.5em 0
-</style>
diff --git a/src/client/app/common/views/pages/page/page.textarea-input.vue b/src/client/app/common/views/pages/page/page.textarea-input.vue
deleted file mode 100644
index eece59fefb..0000000000
--- a/src/client/app/common/views/pages/page/page.textarea-input.vue
+++ /dev/null
@@ -1,36 +0,0 @@
-<template>
-<div>
-	<ui-textarea class="" v-model="v">{{ script.interpolate(value.text) }}</ui-textarea>
-</div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-
-export default Vue.extend({
-	props: {
-		value: {
-			required: true
-		},
-		script: {
-			required: true
-		}
-	},
-
-	data() {
-		return {
-			v: this.value.default,
-		};
-	},
-
-	watch: {
-		v() {
-			this.script.aiScript.updatePageVar(this.value.name, this.v);
-			this.script.eval();
-		}
-	}
-});
-</script>
-
-<style lang="stylus" scoped>
-</style>
diff --git a/src/client/app/common/views/pages/page/page.textarea.vue b/src/client/app/common/views/pages/page/page.textarea.vue
deleted file mode 100644
index 03c8542cb0..0000000000
--- a/src/client/app/common/views/pages/page/page.textarea.vue
+++ /dev/null
@@ -1,33 +0,0 @@
-<template>
-<ui-textarea class="" :value="text" readonly></ui-textarea>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-
-export default Vue.extend({
-	props: {
-		value: {
-			required: true
-		},
-		script: {
-			required: true
-		}
-	},
-
-	data() {
-		return {
-			text: this.script.interpolate(this.value.text),
-		};
-	},
-
-	created() {
-		this.$watch('script.vars', () => {
-			this.text = this.script.interpolate(this.value.text);
-		}, { deep: true });
-	}
-});
-</script>
-
-<style lang="stylus" scoped>
-</style>
diff --git a/src/client/app/common/views/pages/page/page.vue b/src/client/app/common/views/pages/page/page.vue
deleted file mode 100644
index a93d5316d5..0000000000
--- a/src/client/app/common/views/pages/page/page.vue
+++ /dev/null
@@ -1,224 +0,0 @@
-<template>
-<div v-if="page" class="iroscrza" :class="{ shadow: $store.state.device.useShadow, round: $store.state.device.roundedCorners, center: page.alignCenter }" :style="{ fontFamily: page.font }" :key="path">
-	<header>
-		<div class="title">{{ page.title }}</div>
-	</header>
-
-	<div v-if="script">
-		<x-block v-for="child in page.content" :value="child" @input="v => updateBlock(v)" :page="page" :script="script" :key="child.id" :h="2"/>
-	</div>
-
-	<footer>
-		<small>@{{ page.user.username }}</small>
-		<router-link v-if="$store.getters.isSignedIn && $store.state.i.id === page.userId" :to="`/i/pages/edit/${page.id}`">{{ $t('edit-this-page') }}</router-link>
-		<router-link :to="`./${page.name}/view-source`">{{ $t('view-source') }}</router-link>
-		<div class="like">
-			<button @click="unlike()" v-if="page.isLiked" :title="$t('unlike')"><fa :icon="faHeartS"/></button>
-			<button @click="like()" v-else :title="$t('like')"><fa :icon="faHeart"/></button>
-			<span class="count" v-if="page.likedCount > 0">{{ page.likedCount }}</span>
-		</div>
-	</footer>
-</div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-import i18n from '../../../../i18n';
-import { faHeart as faHeartS } from '@fortawesome/free-solid-svg-icons';
-import { faHeart, faStickyNote } from '@fortawesome/free-regular-svg-icons';
-import XBlock from './page.block.vue';
-import { ASEvaluator } from '../../../../../../misc/aiscript/evaluator';
-import { collectPageVars } from '../../../scripts/collect-page-vars';
-import { url } from '../../../../config';
-
-class Script {
-	public aiScript: ASEvaluator;
-	private onError: any;
-	public vars: Record<string, any>;
-	public page: Record<string, any>;
-
-	constructor(page, aiScript, onError) {
-		this.page = page;
-		this.aiScript = aiScript;
-		this.onError = onError;
-		this.eval();
-	}
-
-	public eval() {
-		try {
-			this.vars = this.aiScript.evaluateVars();
-		} catch (e) {
-			this.onError(e);
-		}
-	}
-
-	public interpolate(str: string) {
-		if (str == null) return null;
-		return str.replace(/{(.+?)}/g, match => {
-			const v = this.vars[match.slice(1, -1).trim()];
-			return v == null ? 'NULL' : v.toString();
-		});
-	}
-}
-
-export default Vue.extend({
-	i18n: i18n('pages'),
-
-	components: {
-		XBlock
-	},
-
-	props: {
-		pageName: {
-			type: String,
-			required: true
-		},
-		username: {
-			type: String,
-			required: true
-		},
-	},
-
-	data() {
-		return {
-			page: null,
-			script: null,
-			faHeartS, faHeart
-		};
-	},
-
-	computed: {
-		path(): string {
-			return this.username + '/' + this.pageName;
-		}
-	},
-
-	watch: {
-		path() {
-			this.fetch();
-		}
-	},
-
-	created() {
-		this.fetch();
-	},
-
-	methods: {
-		fetch() {
-			this.$root.api('pages/show', {
-				name: this.pageName,
-				username: this.username,
-			}).then(page => {
-				this.page = page;
-				this.$emit('init', {
-					title: this.page.title,
-					icon: faStickyNote
-				});
-				const pageVars = this.getPageVars();
-				this.script = new Script(this.page, new ASEvaluator(this.page.variables, pageVars, {
-					randomSeed: Math.random(),
-					user: page.user,
-					visitor: this.$store.state.i,
-					page: page,
-					url: url
-				}), e => {
-					console.dir(e);
-				});
-			});
-		},
-
-		getPageVars() {
-			return collectPageVars(this.page.content);
-		},
-
-		like() {
-			this.$root.api('pages/like', {
-				pageId: this.page.id,
-			}).then(() => {
-				this.page.isLiked = true;
-				this.page.likedCount++;
-			});
-		},
-
-		unlike() {
-			this.$root.api('pages/unlike', {
-				pageId: this.page.id,
-			}).then(() => {
-				this.page.isLiked = false;
-				this.page.likedCount--;
-			});
-		}
-	}
-});
-</script>
-
-<style lang="stylus" scoped>
-.iroscrza
-	overflow hidden
-	background var(--face)
-
-	&.center
-		text-align center
-
-	&.round
-		border-radius 6px
-
-	&.shadow
-		box-shadow 0 3px 8px rgba(0, 0, 0, 0.2)
-
-	> header
-		> .title
-			z-index 1
-			margin 0
-			padding 16px 32px
-			font-size 20px
-			font-weight bold
-			color var(--text)
-			box-shadow 0 var(--lineWidth) rgba(#000, 0.07)
-
-			@media (max-width 600px)
-				padding 16px 32px
-				font-size 20px
-
-			@media (max-width 400px)
-				padding 10px 20px
-				font-size 16px
-
-	> div
-		color var(--text)
-		padding 24px 32px
-		font-size 16px
-
-		@media (max-width 600px)
-			padding 24px 32px
-			font-size 16px
-
-		@media (max-width 400px)
-			padding 20px 20px
-			font-size 15px
-
-	> footer
-		color var(--text)
-		padding 0 32px 28px 32px
-
-		@media (max-width 600px)
-			padding 0 32px 28px 32px
-
-		@media (max-width 400px)
-			padding 0 20px 20px 20px
-			font-size 14px
-
-		> small
-			display block
-			opacity 0.5
-
-		> a
-			font-size 90%
-
-		> a + a
-			margin-left 8px
-
-		> .like
-			margin-top 16px
-
-</style>
diff --git a/src/client/app/desktop/script.ts b/src/client/app/desktop/script.ts
index 8065241714..1a4be33020 100644
--- a/src/client/app/desktop/script.ts
+++ b/src/client/app/desktop/script.ts
@@ -148,6 +148,7 @@ init(async (launch, os) => {
 					{ path: '/i/groups', component: DeckColumn, props: route => ({ component: () => import('../common/views/pages/user-groups.vue').then(m => m.default) }) },
 					{ path: '/i/groups/:groupId', component: DeckColumn, props: route => ({ component: () => import('../common/views/pages/user-group-editor.vue').then(m => m.default), groupId: route.params.groupId }) },
 					{ path: '/i/follow-requests', component: DeckColumn, props: route => ({ component: () => import('../common/views/pages/follow-requests.vue').then(m => m.default) }) },
+					{ path: '/@:username/pages/:pageName', name: 'page', props: true, component: () => import('../common/views/deck/deck.page-column.vue').then(m => m.default) },
 				]}
 				: { path: '/', component: MkHome, children: [
 					{ path: '', name: 'index', component: MkHomeTimeline },
@@ -171,12 +172,11 @@ init(async (launch, os) => {
 					{ path: '/i/follow-requests', component: () => import('../common/views/pages/follow-requests.vue').then(m => m.default) },
 					{ path: '/i/pages/new', component: () => import('../common/views/pages/page-editor/page-editor.vue').then(m => m.default) },
 					{ path: '/i/pages/edit/:pageId', component: () => import('../common/views/pages/page-editor/page-editor.vue').then(m => m.default), props: route => ({ initPageId: route.params.pageId }) },
-					{ path: '/@:user/pages/:page', component: () => import('../common/views/pages/page/page.vue').then(m => m.default), props: route => ({ pageName: route.params.page, username: route.params.user }) },
+					{ path: '/@:user/pages/:page', component: () => import('../common/views/pages/page.vue').then(m => m.default), props: route => ({ pageName: route.params.page, username: route.params.user }) },
 					{ path: '/@:user/pages/:pageName/view-source', component: () => import('../common/views/pages/page-editor/page-editor.vue').then(m => m.default), props: route => ({ initUser: route.params.user, initPageName: route.params.pageName }) },
 				]},
 			{ path: '/i/pages/new', component: () => import('../common/views/pages/page-editor/page-editor.vue').then(m => m.default) },
 			{ path: '/i/pages/edit/:pageId', component: () => import('../common/views/pages/page-editor/page-editor.vue').then(m => m.default), props: route => ({ initPageId: route.params.pageId }) },
-			{ path: '/@:user/pages/:page', component: () => import('../common/views/pages/page/page.vue').then(m => m.default), props: route => ({ pageName: route.params.page, username: route.params.user }) },
 			{ path: '/@:user/pages/:pageName/view-source', component: () => import('../common/views/pages/page-editor/page-editor.vue').then(m => m.default), props: route => ({ initUser: route.params.user, initPageName: route.params.pageName }) },
 			{ path: '/i/messaging/group/:group', component: MkMessagingRoom },
 			{ path: '/i/messaging/:user', component: MkMessagingRoom },
diff --git a/src/client/app/desktop/views/home/user/user.home.vue b/src/client/app/desktop/views/home/user/user.home.vue
index ec533efd3e..c47e0a0771 100644
--- a/src/client/app/desktop/views/home/user/user.home.vue
+++ b/src/client/app/desktop/views/home/user/user.home.vue
@@ -1,5 +1,6 @@
 <template>
 <div class="lnctpgve">
+	<x-page v-if="user.pinnedPage" :page="user.pinnedPage" :key="user.pinnedPage.id" :show-title="!user.pinnedPage.hideTitleWhenPinned"/>
 	<mk-note-detail v-for="n in user.pinnedNotes" :key="n.id" :note="n" :compact="true"/>
 	<!--<mk-calendar @chosen="warp" :start="new Date(user.createdAt)"/>-->
 	<div class="activity">
@@ -21,13 +22,15 @@ import i18n from '../../../../i18n';
 import XTimeline from './user.timeline.vue';
 import XPhotos from './user.photos.vue';
 import XActivity from '../../../../common/views/components/activity.vue';
+import XPage from '../../../../common/views/components/page/page.vue';
 
 export default Vue.extend({
 	i18n: i18n(),
 	components: {
 		XTimeline,
 		XPhotos,
-		XActivity
+		XActivity,
+		XPage,
 	},
 	props: {
 		user: {
diff --git a/src/client/app/mobile/script.ts b/src/client/app/mobile/script.ts
index d04662cc1f..6222409931 100644
--- a/src/client/app/mobile/script.ts
+++ b/src/client/app/mobile/script.ts
@@ -129,6 +129,7 @@ init((launch, os) => {
 					{ path: '/i/groups', component: DeckColumn, props: route => ({ component: () => import('../common/views/pages/user-groups.vue').then(m => m.default) }) },
 					{ path: '/i/groups/:groupId', component: DeckColumn, props: route => ({ component: () => import('../common/views/pages/user-group-editor.vue').then(m => m.default), groupId: route.params.groupId }) },
 					{ path: '/i/follow-requests', component: DeckColumn, props: route => ({ component: () => import('../common/views/pages/follow-requests.vue').then(m => m.default) }) },
+					{ path: '/@:username/pages/:pageName', name: 'page', props: true, component: () => import('../common/views/deck/deck.page-column.vue').then(m => m.default) },
 				]}]
 			: [
 				{ path: '/', name: 'index', component: MkIndex },
@@ -163,7 +164,7 @@ init((launch, os) => {
 				{ path: 'following', component: () => import('../common/views/pages/following.vue').then(m => m.default) },
 				{ path: 'followers', component: () => import('../common/views/pages/followers.vue').then(m => m.default) },
 			]},
-			{ path: '/@:user/pages/:page', component: UI, props: route => ({ component: () => import('../common/views/pages/page/page.vue').then(m => m.default), pageName: route.params.page, username: route.params.user }) },
+			{ path: '/@:user/pages/:page', component: UI, props: route => ({ component: () => import('../common/views/pages/page.vue').then(m => m.default), pageName: route.params.page, username: route.params.user }) },
 			{ path: '/@:user/pages/:pageName/view-source', component: UI, props: route => ({ component: () => import('../common/views/pages/page-editor/page-editor.vue').then(m => m.default), initUser: route.params.user, initPageName: route.params.pageName }) },
 			{ path: '/notes/:note', component: MkNote },
 			{ path: '/authorize-follow', component: MkFollow },
diff --git a/src/client/app/mobile/views/pages/user/home.vue b/src/client/app/mobile/views/pages/user/home.vue
index 1d7b0a4e6d..316b2a12fe 100644
--- a/src/client/app/mobile/views/pages/user/home.vue
+++ b/src/client/app/mobile/views/pages/user/home.vue
@@ -1,5 +1,6 @@
 <template>
 <div class="wojmldye">
+	<x-page class="page" v-if="user.pinnedPage" :page="user.pinnedPage" :key="user.pinnedPage.id" :show-title="!user.pinnedPage.hideTitleWhenPinned"/>
 	<mk-note-detail class="note" v-for="n in user.pinnedNotes" :key="n.id" :note="n" :compact="true"/>
 	<ui-container :body-togglable="true">
 		<template #header><fa :icon="['far', 'comments']"/>{{ $t('recent-notes') }}</template>
@@ -33,6 +34,7 @@ export default Vue.extend({
 	components: {
 		XNotes,
 		XPhotos,
+		XPage: () => import('../../../../common/views/components/page/page.vue').then(m => m.default),
 		XActivity: () => import('../../../../common/views/components/activity.vue').then(m => m.default)
 	},
 	props: ['user'],
@@ -53,6 +55,12 @@ export default Vue.extend({
 
 <style lang="stylus" scoped>
 .wojmldye
+	> .page
+		margin 0 0 8px 0
+
+		@media (min-width 500px)
+			margin 0 0 16px 0
+	
 	> .note
 		margin 0 0 8px 0
 
diff --git a/src/models/entities/page.ts b/src/models/entities/page.ts
index 05015ba175..2163f9997f 100644
--- a/src/models/entities/page.ts
+++ b/src/models/entities/page.ts
@@ -40,6 +40,11 @@ export class Page {
 	@Column('boolean')
 	public alignCenter: boolean;
 
+	@Column('boolean', {
+		default: false
+	})
+	public hideTitleWhenPinned: boolean;
+
 	@Column('varchar', {
 		length: 32,
 	})
diff --git a/src/models/entities/user-profile.ts b/src/models/entities/user-profile.ts
index 4a588ebfbf..61e80049c3 100644
--- a/src/models/entities/user-profile.ts
+++ b/src/models/entities/user-profile.ts
@@ -1,6 +1,7 @@
 import { Entity, Column, Index, OneToOne, JoinColumn, PrimaryColumn } from 'typeorm';
 import { id } from '../id';
 import { User } from './user';
+import { Page } from './page';
 
 @Entity()
 export class UserProfile {
@@ -118,6 +119,18 @@ export class UserProfile {
 	})
 	public carefulBot: boolean;
 
+	@Column({
+		...id(),
+		nullable: true
+	})
+	public pinnedPageId: Page['id'] | null;
+
+	@OneToOne(type => Page, {
+		onDelete: 'SET NULL'
+	})
+	@JoinColumn()
+	public pinnedPage: Page | null;
+
 	//#region Linking
 	@Column('boolean', {
 		default: false,
diff --git a/src/models/repositories/page.ts b/src/models/repositories/page.ts
index 33126274a1..1335ada73f 100644
--- a/src/models/repositories/page.ts
+++ b/src/models/repositories/page.ts
@@ -71,6 +71,7 @@ export class PageRepository extends Repository<Page> {
 			title: page.title,
 			name: page.name,
 			summary: page.summary,
+			hideTitleWhenPinned: page.hideTitleWhenPinned,
 			alignCenter: page.alignCenter,
 			font: page.font,
 			eyeCatchingImageId: page.eyeCatchingImageId,
diff --git a/src/models/repositories/user.ts b/src/models/repositories/user.ts
index 06da74197f..4e85fd7b93 100644
--- a/src/models/repositories/user.ts
+++ b/src/models/repositories/user.ts
@@ -1,7 +1,7 @@
 import $ from 'cafy';
 import { EntityRepository, Repository, In } from 'typeorm';
 import { User, ILocalUser, IRemoteUser } from '../entities/user';
-import { Emojis, Notes, NoteUnreads, FollowRequests, Notifications, MessagingMessages, UserNotePinings, Followings, Blockings, Mutings, UserProfiles, UserSecurityKeys, UserGroupJoinings } from '..';
+import { Emojis, Notes, NoteUnreads, FollowRequests, Notifications, MessagingMessages, UserNotePinings, Followings, Blockings, Mutings, UserProfiles, UserSecurityKeys, UserGroupJoinings, Pages } from '..';
 import { ensure } from '../../prelude/ensure';
 import config from '../../config';
 import { SchemaType } from '../../misc/schema';
@@ -155,6 +155,8 @@ export class UserRepository extends Repository<User> {
 				pinnedNotes: Notes.packMany(pins.map(pin => pin.noteId), meId, {
 					detail: true
 				}),
+				pinnedPageId: profile!.pinnedPageId,
+				pinnedPage: profile!.pinnedPageId ? Pages.pack(profile!.pinnedPageId, meId) : null,
 				twoFactorEnabled: profile!.twoFactorEnabled,
 				usePasswordLessLogin: profile!.usePasswordLessLogin,
 				securityKeys: profile!.twoFactorEnabled
diff --git a/src/server/api/endpoints/i/update.ts b/src/server/api/endpoints/i/update.ts
index 10521d12d8..a454cdb940 100644
--- a/src/server/api/endpoints/i/update.ts
+++ b/src/server/api/endpoints/i/update.ts
@@ -10,7 +10,7 @@ import extractHashtags from '../../../../misc/extract-hashtags';
 import * as langmap from 'langmap';
 import { updateHashtag } from '../../../../services/update-hashtag';
 import { ApiError } from '../../error';
-import { Users, DriveFiles, UserProfiles } from '../../../../models';
+import { Users, DriveFiles, UserProfiles, Pages } from '../../../../models';
 import { User } from '../../../../models/entities/user';
 import { UserProfile } from '../../../../models/entities/user-profile';
 import { ensure } from '../../../../prelude/ensure';
@@ -125,6 +125,13 @@ export const meta = {
 				'ja-JP': 'アップロードするメディアをデフォルトで「閲覧注意」として設定するか'
 			}
 		},
+
+		pinnedPageId: {
+			validator: $.optional.nullable.type(ID),
+			desc: {
+				'ja-JP': 'ピン留めするページID'
+			}
+		}
 	},
 
 	errors: {
@@ -150,7 +157,13 @@ export const meta = {
 			message: 'The file specified as a banner is not an image.',
 			code: 'BANNER_NOT_AN_IMAGE',
 			id: '75aedb19-2afd-4e6d-87fc-67941256fa60'
-		}
+		},
+
+		noSuchPage: {
+			message: 'No such page.',
+			code: 'NO_SUCH_PAGE',
+			id: '8e01b590-7eb9-431b-a239-860e086c408e'
+		},
 	}
 };
 
@@ -203,6 +216,16 @@ export default define(meta, async (ps, user, app) => {
 		}
 	}
 
+	if (ps.pinnedPageId) {
+		const page = await Pages.findOne(ps.pinnedPageId);
+
+		if (page == null || page.userId !== user.id) throw new ApiError(meta.errors.noSuchPage);
+
+		profileUpdates.pinnedPageId = page.id;
+	} else if (ps.pinnedPageId === null) {
+		profileUpdates.pinnedPageId = null;
+	}
+
 	//#region emojis/tags
 
 	let emojis = [] as string[];
diff --git a/src/server/api/endpoints/pages/create.ts b/src/server/api/endpoints/pages/create.ts
index ffe0d38ea6..a49a5d37b8 100644
--- a/src/server/api/endpoints/pages/create.ts
+++ b/src/server/api/endpoints/pages/create.ts
@@ -57,6 +57,11 @@ export const meta = {
 			validator: $.optional.bool,
 			default: false
 		},
+
+		hideTitleWhenPinned: {
+			validator: $.optional.bool,
+			default: false
+		},
 	},
 
 	res: {
@@ -100,6 +105,7 @@ export default define(meta, async (ps, user) => {
 		userId: user.id,
 		visibility: 'public',
 		alignCenter: ps.alignCenter,
+		hideTitleWhenPinned: ps.hideTitleWhenPinned,
 		font: ps.font
 	}));
 
diff --git a/src/server/api/endpoints/pages/update.ts b/src/server/api/endpoints/pages/update.ts
index 8ee34fc3ba..9daf5e9cae 100644
--- a/src/server/api/endpoints/pages/update.ts
+++ b/src/server/api/endpoints/pages/update.ts
@@ -61,6 +61,10 @@ export const meta = {
 		alignCenter: {
 			validator: $.optional.bool,
 		},
+
+		hideTitleWhenPinned: {
+			validator: $.optional.bool,
+		},
 	},
 
 	errors: {
@@ -113,6 +117,7 @@ export default define(meta, async (ps, user) => {
 		content: ps.content,
 		variables: ps.variables,
 		alignCenter: ps.alignCenter === undefined ? page.alignCenter : ps.alignCenter,
+		hideTitleWhenPinned: ps.hideTitleWhenPinned === undefined ? page.hideTitleWhenPinned : ps.hideTitleWhenPinned,
 		font: ps.font === undefined ? page.font : ps.font,
 		eyeCatchingImageId: ps.eyeCatchingImageId === null
 			? null
-- 
cgit v1.2.3-freya


From 8b05816860ad9feb48e0575469f47607b85631af Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Sun, 7 Jul 2019 15:29:08 +0900
Subject: Refactor: Remove needless return

---
 src/server/api/private/signin.ts | 1 -
 1 file changed, 1 deletion(-)

(limited to 'src/server/api')

diff --git a/src/server/api/private/signin.ts b/src/server/api/private/signin.ts
index 67afed760b..eb267aa604 100644
--- a/src/server/api/private/signin.ts
+++ b/src/server/api/private/signin.ts
@@ -221,5 +221,4 @@ export default async (ctx: Koa.BaseContext) => {
 	}
 
 	await fail();
-	return;
 };
-- 
cgit v1.2.3-freya


From 5343b005df9446c3cc13bdfb419db9b8720e5946 Mon Sep 17 00:00:00 2001
From: tamaina <tamaina@hotmail.co.jp>
Date: Mon, 8 Jul 2019 13:46:31 +0900
Subject: Improve paste uploading Resolve #3023 (#4542)

* resolve #3023

* fix

* fix

* better description

* widget

* fix text

* Update post-form.vue

* Fix enter-file-name dialog title text

* Fix type

* On messaging room

* Replace moment.js to original one

* Fix formatDateTimeString
---
 locales/ja-JP.yml                                  |  6 +++
 src/client/app/common/scripts/post-form.ts         | 24 ++++++++---
 .../views/components/messaging-room.form.vue       | 22 ++++++++--
 .../common/views/components/settings/settings.vue  | 24 ++++++++++-
 .../app/common/views/components/uploader.vue       |  5 ++-
 src/client/app/common/views/widgets/post-form.vue  | 24 ++++++++---
 src/client/app/store.ts                            |  2 +
 src/misc/format-time-string.ts                     | 50 ++++++++++++++++++++++
 src/server/api/endpoints/drive/files/create.ts     | 10 ++++-
 test/api.ts                                        | 14 ++++++
 10 files changed, 163 insertions(+), 18 deletions(-)
 create mode 100644 src/misc/format-time-string.ts

(limited to 'src/server/api')

diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index bf23e44705..d2776c45b1 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -129,6 +129,7 @@ common:
     add-visible-user: "ユーザーを追加"
     cw-placeholder: "内容への注釈 (オプション)"
     username-prompt: "ユーザー名を入力してください"
+    enter-file-name: "ファイル名を編集"
 
   weekday-short:
     sunday: "日"
@@ -201,6 +202,11 @@ common:
     remember-note-visibility: "投稿の公開範囲を記憶する"
     web-search-engine: "ウェブ検索エンジン"
     web-search-engine-desc: "例: https://www.google.com/?#q={{query}}"
+    paste: "ペースト"
+    pasted-file-name: "ペーストされたファイル名のテンプレート"
+    pasted-file-name-desc: "例: \"yyyy-MM-dd HH-mm-ss [{{number}}]\" → \"2018-03-20 21-30-24 1\""
+    paste-dialog: "ペースト時にファイル名を編集"
+    paste-dialog-desc: "ペースト時にファイル名を編集するダイアログを表示するようにします。"
     keep-cw: "CW保持"
     keep-cw-desc: "投稿にリプライする際、リプライ元の投稿にCWが設定されていたとき、デフォルトで同じCWを設定するようにします。"
     i-like-sushi: "私は(プリンよりむしろ)寿司が好き"
diff --git a/src/client/app/common/scripts/post-form.ts b/src/client/app/common/scripts/post-form.ts
index 1d93b4c268..7cf26f65bf 100644
--- a/src/client/app/common/scripts/post-form.ts
+++ b/src/client/app/common/scripts/post-form.ts
@@ -8,6 +8,7 @@ import { host, url } from '../../config';
 import i18n from '../../i18n';
 import { erase, unique } from '../../../../prelude/array';
 import extractMentions from '../../../../misc/extract-mentions';
+import { formatTimeString } from '../../../../misc/format-time-string';
 
 export default (opts) => ({
 	i18n: i18n(),
@@ -244,8 +245,8 @@ export default (opts) => ({
 			for (const x of Array.from((this.$refs.file as any).files)) this.upload(x);
 		},
 
-		upload(file) {
-			(this.$refs.uploader as any).upload(file, this.$store.state.settings.uploadFolder);
+		upload(file: File, name?: string) {
+			(this.$refs.uploader as any).upload(file, this.$store.state.settings.uploadFolder, name);
 		},
 
 		onChangeUploadings(uploads) {
@@ -334,10 +335,23 @@ export default (opts) => ({
 			if ((e.which == 10 || e.which == 13) && (e.ctrlKey || e.metaKey) && this.canPost) this.post();
 		},
 
-		async onPaste(e) {
-			for (const item of Array.from(e.clipboardData.items)) {
+		async onPaste(e: ClipboardEvent) {
+			for (const { item, i } of Array.from(e.clipboardData.items).map((item, i) => ({item, i}))) {
 				if (item.kind == 'file') {
-					this.upload(item.getAsFile());
+					const file = item.getAsFile();
+					const lio = file.name.lastIndexOf('.');
+					const ext = lio >= 0 ? file.name.slice(lio) : '';
+					const formatted = `${formatTimeString(new Date(file.lastModified), this.$store.state.settings.pastedFileName).replace(/{{number}}/g, `${i + 1}`)}${ext}`;
+					const name = this.$store.state.settings.pasteDialog
+						? await this.$root.dialog({
+								title: this.$t('@.post-form.enter-file-name'),
+								input: {
+									default: formatted
+								},
+								allowEmpty: false
+							}).then(({ canceled, result }) => canceled ? false : result)
+						: formatted;
+					if (name) this.upload(file, name);
 				}
 			}
 
diff --git a/src/client/app/common/views/components/messaging-room.form.vue b/src/client/app/common/views/components/messaging-room.form.vue
index 74e30d29e8..bd63bab2c1 100644
--- a/src/client/app/common/views/components/messaging-room.form.vue
+++ b/src/client/app/common/views/components/messaging-room.form.vue
@@ -30,6 +30,7 @@
 import Vue from 'vue';
 import i18n from '../../../i18n';
 import * as autosize from 'autosize';
+import { formatTimeString } from '../../../../../misc/format-time-string';
 
 export default Vue.extend({
 	i18n: i18n('common/views/components/messaging-room.form.vue'),
@@ -84,13 +85,26 @@ export default Vue.extend({
 		}
 	},
 	methods: {
-		onPaste(e) {
+		async onPaste(e: ClipboardEvent) {
 			const data = e.clipboardData;
 			const items = data.items;
 
 			if (items.length == 1) {
 				if (items[0].kind == 'file') {
-					this.upload(items[0].getAsFile());
+					const file = items[0].getAsFile();
+					const lio = file.name.lastIndexOf('.');
+					const ext = lio >= 0 ? file.name.slice(lio) : '';
+					const formatted = `${formatTimeString(new Date(file.lastModified), this.$store.state.settings.pastedFileName).replace(/{{number}}/g, '1')}${ext}`;
+					const name = this.$store.state.settings.pasteDialog
+						? await this.$root.dialog({
+							title: this.$t('@.post-form.enter-file-name'),
+							input: {
+								default: formatted
+							},
+							allowEmpty: false
+						}).then(({ canceled, result }) => canceled ? false : result)
+						: formatted;
+					if (name) this.upload(file, name);
 				}
 			} else {
 				if (items[0].kind == 'file') {
@@ -157,8 +171,8 @@ export default Vue.extend({
 			this.upload((this.$refs.file as any).files[0]);
 		},
 
-		upload(file) {
-			(this.$refs.uploader as any).upload(file, this.$store.state.settings.uploadFolder);
+		upload(file: File, name?: string) {
+			(this.$refs.uploader as any).upload(file, this.$store.state.settings.uploadFolder, name);
 		},
 
 		onUploaded(file) {
diff --git a/src/client/app/common/views/components/settings/settings.vue b/src/client/app/common/views/components/settings/settings.vue
index 5f370c8be7..281524979e 100644
--- a/src/client/app/common/views/components/settings/settings.vue
+++ b/src/client/app/common/views/components/settings/settings.vue
@@ -140,7 +140,19 @@
 
 			<section>
 				<header>{{ $t('@._settings.web-search-engine') }}</header>
-				<ui-input v-model="webSearchEngine">{{ $t('@._settings.web-search-engine') }}<template #desc>{{ $t('@._settings.web-search-engine-desc') }}</template></ui-input>
+				<ui-input v-model="webSearchEngine">{{ $t('@._settings.web-search-engine') }}
+					<template #desc>{{ $t('@._settings.web-search-engine-desc') }}</template>
+				</ui-input>
+			</section>
+
+			<section v-if="!$root.isMobile">
+				<header>{{ $t('@._settings.paste') }}</header>
+				<ui-input v-model="pastedFileName">{{ $t('@._settings.pasted-file-name') }}
+					<template #desc>{{ $t('@._settings.pasted-file-name-desc') }}</template>
+				</ui-input>
+				<ui-switch v-model="pasteDialog">{{ $t('@._settings.paste-dialog') }}
+					<template #desc>{{ $t('@._settings.paste-dialog-desc') }}</template>
+				</ui-switch>
 			</section>
 		</ui-card>
 
@@ -412,6 +424,16 @@ export default Vue.extend({
 			set(value) { this.$store.dispatch('settings/set', { key: 'webSearchEngine', value }); }
 		},
 
+		pastedFileName: {
+			get() { return this.$store.state.settings.pastedFileName; },
+			set(value) { this.$store.dispatch('settings/set', { key: 'pastedFileName', value }); }
+		},
+
+		pasteDialog: {
+			get() { return this.$store.state.settings.pasteDialog; },
+			set(value) { this.$store.dispatch('settings/set', { key: 'pasteDialog', value }); }
+		},
+
 		showReplyTarget: {
 			get() { return this.$store.state.settings.showReplyTarget; },
 			set(value) { this.$store.dispatch('settings/set', { key: 'showReplyTarget', value }); }
diff --git a/src/client/app/common/views/components/uploader.vue b/src/client/app/common/views/components/uploader.vue
index 78fbcbf6b8..9f02da6c1e 100644
--- a/src/client/app/common/views/components/uploader.vue
+++ b/src/client/app/common/views/components/uploader.vue
@@ -46,7 +46,7 @@ export default Vue.extend({
 			});
 		},
 
-		upload(file: File, folder: any) {
+		upload(file: File, folder: any, name?: string) {
 			if (folder && typeof folder == 'object') folder = folder.id;
 
 			const id = Math.random();
@@ -61,7 +61,7 @@ export default Vue.extend({
 
 					const ctx = {
 						id: id,
-						name: file.name || 'untitled',
+						name: name || file.name || 'untitled',
 						progress: undefined,
 						img: window.URL.createObjectURL(file)
 					};
@@ -75,6 +75,7 @@ export default Vue.extend({
 					data.append('file', file);
 
 					if (folder) data.append('folderId', folder);
+					if (name) data.append('name', name);
 
 					const xhr = new XMLHttpRequest();
 					xhr.open('POST', apiUrl + '/drive/files/create', true);
diff --git a/src/client/app/common/views/widgets/post-form.vue b/src/client/app/common/views/widgets/post-form.vue
index 5e577c9a43..6680a11435 100644
--- a/src/client/app/common/views/widgets/post-form.vue
+++ b/src/client/app/common/views/widgets/post-form.vue
@@ -38,6 +38,7 @@
 import define from '../../../common/define-widget';
 import i18n from '../../../i18n';
 import insertTextAtCursor from 'insert-text-at-cursor';
+import { formatTimeString } from '../../../../../misc/format-time-string';
 
 export default define({
 	name: 'post-form',
@@ -109,10 +110,23 @@ export default define({
 			if ((e.which == 10 || e.which == 13) && (e.ctrlKey || e.metaKey) && !this.posting && this.text) this.post();
 		},
 
-		onPaste(e) {
-			for (const item of Array.from(e.clipboardData.items)) {
+		async onPaste(e: ClipboardEvent) {
+			for (const { item, i } of Array.from(e.clipboardData.items).map((item, i) => ({item, i}))) {
 				if (item.kind == 'file') {
-					this.upload(item.getAsFile());
+					const file = item.getAsFile();
+					const lio = file.name.lastIndexOf('.');
+					const ext = lio >= 0 ? file.name.slice(lio) : '';
+					const formatted = `${formatTimeString(new Date(file.lastModified), this.$store.state.settings.pastedFileName).replace(/{{number}}/g, `${i + 1}`)}${ext}`;
+					const name = this.$store.state.settings.pasteDialog
+						? await this.$root.dialog({
+								title: this.$t('@.post-form.enter-file-name'),
+								input: {
+									default: formatted
+								},
+								allowEmpty: false
+							}).then(({ canceled, result }) => canceled ? false : result)
+						: formatted;
+					if (name) this.upload(file, name);
 				}
 			}
 		},
@@ -121,8 +135,8 @@ export default define({
 			for (const x of Array.from((this.$refs.file as any).files)) this.upload(x);
 		},
 
-		upload(file) {
-			(this.$refs.uploader as any).upload(file, this.$store.state.settings.uploadFolder);
+		upload(file: File, name?: string) {
+			(this.$refs.uploader as any).upload(file, this.$store.state.settings.uploadFolder, name);
 		},
 
 		onDragover(e) {
diff --git a/src/client/app/store.ts b/src/client/app/store.ts
index 252feb3982..18137c1ca9 100644
--- a/src/client/app/store.ts
+++ b/src/client/app/store.ts
@@ -39,6 +39,8 @@ const defaultSettings = {
 	mobileHomeProfiles: {},
 	deckProfiles: {},
 	uploadFolder: null,
+	pastedFileName: 'yyyy-MM-dd HH-mm-ss [{{number}}]',
+	pasteDialog: false,
 };
 
 const defaultDeviceSettings = {
diff --git a/src/misc/format-time-string.ts b/src/misc/format-time-string.ts
new file mode 100644
index 0000000000..4729036e5b
--- /dev/null
+++ b/src/misc/format-time-string.ts
@@ -0,0 +1,50 @@
+const defaultLocaleStringFormats: {[index: string]: string} = {
+	'weekday': 'narrow',
+	'era': 'narrow',
+	'year': 'numeric',
+	'month': 'numeric',
+	'day': 'numeric',
+	'hour': 'numeric',
+	'minute': 'numeric',
+	'second': 'numeric',
+	'timeZoneName': 'short'
+};
+
+function formatLocaleString(date: Date, format: string): string {
+	return format.replace(/\{\{(\w+)(:(\w+))?\}\}/g, (match: string, kind: string, unused?, option?: string) => {
+		if (['weekday', 'era', 'year', 'month', 'day', 'hour', 'minute', 'second', 'timeZoneName'].includes(kind)) {
+			return date.toLocaleString(window.navigator.language, {[kind]: option ? option : defaultLocaleStringFormats[kind]});
+		} else {
+			return match;
+		}
+	});
+}
+
+function formatDateTimeString(date: Date, format: string): string {
+	return format
+		.replace(/yyyy/g, date.getFullYear().toString())
+		.replace(/yy/g, date.getFullYear().toString().slice(-2))
+		.replace(/MMMM/g, date.toLocaleString(window.navigator.language, { month: 'long'}))
+		.replace(/MMM/g, date.toLocaleString(window.navigator.language, { month: 'short'}))
+		.replace(/MM/g, (`0${date.getMonth() + 1}`).slice(-2))
+		.replace(/M/g, (date.getMonth() + 1).toString())
+		.replace(/dd/g, (`0${date.getDate()}`).slice(-2))
+		.replace(/d/g, date.getDate().toString())
+		.replace(/HH/g, (`0${date.getHours()}`).slice(-2))
+		.replace(/H/g, date.getHours().toString())
+		.replace(/hh/g, (`0${(date.getHours() % 12) || 12}`).slice(-2))
+		.replace(/h/g, ((date.getHours() % 12) || 12).toString())
+		.replace(/mm/g, (`0${date.getMinutes()}`).slice(-2))
+		.replace(/m/g, date.getMinutes().toString())
+		.replace(/ss/g, (`0${date.getSeconds()}`).slice(-2))
+		.replace(/s/g, date.getSeconds().toString())
+		.replace(/tt/g, date.getHours() >= 12 ? 'PM' : 'AM');
+}
+
+export function formatTimeString(date: Date, format: string): string {
+	return format.replace(/\[(([^\[]|\[\])*)\]|([yMdHhmst]{1,4})/g, (match: string, localeformat?: string, unused?, datetimeformat?: string) => {
+		if (localeformat) return formatLocaleString(date, localeformat);
+		if (datetimeformat) return formatDateTimeString(date, datetimeformat);
+		return match;
+	});
+}
diff --git a/src/server/api/endpoints/drive/files/create.ts b/src/server/api/endpoints/drive/files/create.ts
index 664a2b87b2..61055c5d18 100644
--- a/src/server/api/endpoints/drive/files/create.ts
+++ b/src/server/api/endpoints/drive/files/create.ts
@@ -35,6 +35,14 @@ export const meta = {
 			}
 		},
 
+		name: {
+			validator: $.optional.nullable.str,
+			default: null as any,
+			desc: {
+				'ja-JP': 'ファイル名（拡張子があるなら含めて）'
+			}
+		},
+
 		isSensitive: {
 			validator: $.optional.either($.bool, $.str),
 			default: false,
@@ -72,7 +80,7 @@ export const meta = {
 
 export default define(meta, async (ps, user, app, file, cleanup) => {
 	// Get 'name' parameter
-	let name = file.originalname;
+	let name = ps.name || file.originalname;
 	if (name !== undefined && name !== null) {
 		name = name.trim();
 		if (name.length === 0) {
diff --git a/test/api.ts b/test/api.ts
index 570ab6833d..343112b4aa 100644
--- a/test/api.ts
+++ b/test/api.ts
@@ -474,6 +474,20 @@ describe('API', () => {
 			assert.strictEqual(res.body.name, 'Lenna.png');
 		}));
 
+		it('ファイルに名前を付けられる', async(async () => {
+			const alice = await signup({ username: 'alice' });
+
+			const res = await assert.request(server)
+				.post('/drive/files/create')
+				.field('i', alice.token)
+				.field('name', 'Belmond.png')
+				.attach('file', fs.readFileSync(__dirname + '/resources/Lenna.png'), 'Lenna.png');
+
+			expect(res).have.status(200);
+			expect(res.body).be.a('object');
+			expect(res.body).have.property('name').eql('Belmond.png');
+		}));
+
 		it('ファイル無しで怒られる', async(async () => {
 			const alice = await signup({ username: 'alice' });
 
-- 
cgit v1.2.3-freya