refactoring

Resolve #7779

11 files changed, 405 insertions, 0 deletions

diff --git a/packages/backend/src/server/web/views/base.pug b/packages/backend/src/server/web/views/base.pug
new file mode 100644
index 0000000000..42c068c403
--- /dev/null
+++ b/packages/backend/src/server/web/views/base.pug
@@ -0,0 +1,60 @@
+block vars
+
+doctype html
+
+!= '<!--\n'
+!= '  _____ _         _           \n'
+!= ' |     |_|___ ___| |_ ___ _ _ \n'
+!= ' | | | | |_ -|_ -| \'_| -_| | |\n'
+!= ' |_|_|_|_|___|___|_,_|___|_  |\n'
+!= '                         |___|\n'
+!= ' Thank you for using Misskey!\n'
+!= ' If you are reading this message... how about joining the development?\n'
+!= ' https://github.com/misskey-dev/misskey'
+!= '\n-->\n'
+
+html
+
+	head
+		meta(charset='utf-8')
+		meta(name='application-name' content='Misskey')
+		meta(name='referrer' content='origin')
+		meta(name='theme-color' content='#86b300')
+		meta(name='theme-color-orig' content='#86b300')
+		meta(property='og:site_name' content= instanceName || 'Misskey')
+		meta(name='viewport' content='width=device-width, initial-scale=1')
+		link(rel='icon' href= icon || '/favicon.ico')
+		link(rel='apple-touch-icon' href= icon || '/apple-touch-icon.png')
+		link(rel='manifest' href='/manifest.json')
+		link(rel='prefetch' href='https://xn--931a.moe/assets/info.jpg')
+		link(rel='prefetch' href='https://xn--931a.moe/assets/not-found.jpg')
+		link(rel='prefetch' href='https://xn--931a.moe/assets/error.jpg')
+		link(rel='preload' href='https://use.fontawesome.com/releases/v5.15.3/css/all.css' as='style')
+		link(rel='stylesheet' href='https://use.fontawesome.com/releases/v5.15.3/css/all.css')
+
+		title
+			block title
+				= title || 'Misskey'
+
+		block desc
+			meta(name='description' content= desc || '✨🌎✨ A interplanetary communication platform ✨🚀✨')
+
+		block meta
+
+		block og
+			meta(property='og:image' content=img)
+
+		style
+			include ../style.css
+
+		script
+			include ../boot.js
+
+	body
+		noscript: p
+			| JavaScriptを有効にしてください
+			br
+			| Please turn on your JavaScript
+		div#splash
+			img(src='/favicon.ico')
+		block content
diff --git a/packages/backend/src/server/web/views/bios.pug b/packages/backend/src/server/web/views/bios.pug
new file mode 100644
index 0000000000..d81a3ee67f
--- /dev/null
+++ b/packages/backend/src/server/web/views/bios.pug
@@ -0,0 +1,20 @@
+doctype html
+
+html
+
+	head
+		meta(charset='utf-8')
+		meta(name='application-name' content='Misskey')
+		title Misskey BIOS
+		style
+			include ../bios.css
+		script
+			include ../bios.js
+
+	body
+		header
+			h1 Misskey BIOS #{version}
+		main
+			div.tabs
+				button#ls edit local storage
+			div#content
diff --git a/packages/backend/src/server/web/views/channel.pug b/packages/backend/src/server/web/views/channel.pug
new file mode 100644
index 0000000000..273632f0e0
--- /dev/null
+++ b/packages/backend/src/server/web/views/channel.pug
@@ -0,0 +1,21 @@
+extends ./base
+
+block vars
+	- const title = channel.name;
+	- const url = `${config.url}/channels/${channel.id}`;
+
+block title
+	= `${title} | ${instanceName}`
+
+block desc
+	meta(name='description' content= channel.description)
+
+block og
+	meta(property='og:type'        content='article')
+	meta(property='og:title'       content= title)
+	meta(property='og:description' content= channel.description)
+	meta(property='og:url'         content= url)
+	meta(property='og:image'       content= channel.bannerUrl)
+
+block meta
+	meta(name='twitter:card' content='summary')
diff --git a/packages/backend/src/server/web/views/cli.pug b/packages/backend/src/server/web/views/cli.pug
new file mode 100644
index 0000000000..d2cf7c4335
--- /dev/null
+++ b/packages/backend/src/server/web/views/cli.pug
@@ -0,0 +1,21 @@
+doctype html
+
+html
+
+	head
+		meta(charset='utf-8')
+		meta(name='application-name' content='Misskey')
+		title Misskey Cli
+		style
+			include ../cli.css
+		script
+			include ../cli.js
+
+	body
+		header
+			h1 Misskey Cli #{version}
+		main
+			div#form
+				textarea#text
+				button#submit submit
+			div#tl
diff --git a/packages/backend/src/server/web/views/clip.pug b/packages/backend/src/server/web/views/clip.pug
new file mode 100644
index 0000000000..8de53f19d6
--- /dev/null
+++ b/packages/backend/src/server/web/views/clip.pug
@@ -0,0 +1,33 @@
+extends ./base
+
+block vars
+	- const user = clip.user;
+	- const title = clip.name;
+	- const url = `${config.url}/clips/${clip.id}`;
+
+block title
+	= `${title} | ${instanceName}`
+
+block desc
+	meta(name='description' content= clip.description)
+
+block og
+	meta(property='og:type'        content='article')
+	meta(property='og:title'       content= title)
+	meta(property='og:description' content= clip.description)
+	meta(property='og:url'         content= url)
+	meta(property='og:image'       content= user.avatarUrl)
+
+block meta
+	if profile.noCrawle
+		meta(name='robots' content='noindex')
+
+	meta(name='misskey:user-username' content=user.username)
+	meta(name='misskey:user-id' content=user.id)
+	meta(name='misskey:clip-id' content=clip.id)
+
+	meta(name='twitter:card' content='summary')
+
+	// todo
+	if user.twitter
+		meta(name='twitter:creator' content=`@${user.twitter.screenName}`)
diff --git a/packages/backend/src/server/web/views/flush.pug b/packages/backend/src/server/web/views/flush.pug
new file mode 100644
index 0000000000..ec585a34db
--- /dev/null
+++ b/packages/backend/src/server/web/views/flush.pug
@@ -0,0 +1,47 @@
+doctype html
+
+html
+	#msg
+	script.
+		const msg = document.getElementById('msg');
+		const successText = `\nSuccess Flush! <a href="/">Back to Misskey</a>\n成功しました。<a href="/">Misskeyを開き直してください。</a>`;
+
+		message('Start flushing.');
+
+		(async function() {
+			try {
+				localStorage.clear();
+				message('localStorage cleared.');
+
+				const idbPromises = ['MisskeyClient', 'keyval-store'].map((name, i, arr) => new Promise((res, rej) => {
+					const delidb = indexedDB.deleteDatabase(name);
+					delidb.onsuccess = () => res(message(`indexedDB "${name}" cleared. (${i + 1}/${arr.length})`));
+					delidb.onerror = e => rej(e)
+				}));
+
+				await Promise.all(idbPromises);
+
+				if (navigator.serviceWorker.controller) {
+					navigator.serviceWorker.controller.postMessage('clear');
+					await navigator.serviceWorker.getRegistrations()
+						.then(registrations => {
+							return Promise.all(registrations.map(registration => registration.unregister()));
+						})
+						.catch(e => { throw Error(e) });
+				}
+
+				message(successText);
+			} catch (e) {
+				message(`\n${e}\n\nFlush Failed. <a href="/flush">Please retry.</a>\n失敗しました。<a href="/flush">もう一度試してみてください。</a>`);
+				message(`\nIf you retry more than 3 times, clear the browser cache or contact to instance admin.\n3回以上試しても失敗する場合、ブラウザのキャッシュを消去し、それでもだめならインスタンス管理者に連絡してみてください。\n`)
+
+				console.error(e);
+				setTimeout(() => {
+					location = '/';
+				}, 10000)
+			}
+		})();
+
+		function message(text) {
+			msg.insertAdjacentHTML('beforeend', `<p>[${(new Date()).toString()}] ${text.replace(/\n/g,'<br>')}</p>`)
+		}
diff --git a/packages/backend/src/server/web/views/gallery-post.pug b/packages/backend/src/server/web/views/gallery-post.pug
new file mode 100644
index 0000000000..95bbb2437c
--- /dev/null
+++ b/packages/backend/src/server/web/views/gallery-post.pug
@@ -0,0 +1,35 @@
+extends ./base
+
+block vars
+	- const user = post.user;
+	- const title = post.title;
+	- const url = `${config.url}/gallery/${post.id}`;
+
+block title
+	= `${title} | ${instanceName}`
+
+block desc
+	meta(name='description' content= post.description)
+
+block og
+	meta(property='og:type'        content='article')
+	meta(property='og:title'       content= title)
+	meta(property='og:description' content= post.description)
+	meta(property='og:url'         content= url)
+	meta(property='og:image'       content= post.files[0].thumbnailUrl)
+
+block meta
+	if user.host || profile.noCrawle
+		meta(name='robots' content='noindex')
+
+	meta(name='misskey:user-username' content=user.username)
+	meta(name='misskey:user-id' content=user.id)
+
+	meta(name='twitter:card' content='summary')
+
+	// todo
+	if user.twitter
+		meta(name='twitter:creator' content=`@${user.twitter.screenName}`)
+
+	if !user.host
+		link(rel='alternate' href=url type='application/activity+json')
diff --git a/packages/backend/src/server/web/views/info-card.pug b/packages/backend/src/server/web/views/info-card.pug
new file mode 100644
index 0000000000..1d62778ce1
--- /dev/null
+++ b/packages/backend/src/server/web/views/info-card.pug
@@ -0,0 +1,50 @@
+doctype html
+
+html
+
+	head
+		meta(charset='utf-8')
+		meta(name='application-name' content='Misskey')
+		title= meta.name || host
+		style.
+			html, body {
+				margin: 0;
+				padding: 0;
+				min-height: 100vh;
+				background: #fff;
+			}
+
+			#a {
+				display: block;
+			}
+
+			#banner {
+				background-size: cover;
+				background-position: center center;
+			}
+
+			#title {
+				display: inline-block;
+				margin: 24px;
+				padding: 0.5em 0.8em;
+				color: #fff;
+				background: rgba(0, 0, 0, 0.5);
+				font-weight: bold;
+				font-size: 1.3em;
+			}
+
+			#content {
+				overflow: auto;
+				color: #353c3e;
+			}
+
+			#description {
+				margin: 24px;
+			}
+
+	body
+		a#a(href=`https://${host}` target="_blank")
+			header#banner(style=`background-image: url(${meta.bannerUrl})`)
+				div#title= meta.name || host
+		div#content
+			div#description= meta.description
diff --git a/packages/backend/src/server/web/views/note.pug b/packages/backend/src/server/web/views/note.pug
new file mode 100644
index 0000000000..7030936975
--- /dev/null
+++ b/packages/backend/src/server/web/views/note.pug
@@ -0,0 +1,43 @@
+extends ./base
+
+block vars
+	- const user = note.user;
+	- const title = user.name ? `${user.name} (@${user.username})` : `@${user.username}`;
+	- const url = `${config.url}/notes/${note.id}`;
+
+block title
+	= `${title} | ${instanceName}`
+
+block desc
+	meta(name='description' content= summary)
+
+block og
+	meta(property='og:type'        content='article')
+	meta(property='og:title'       content= title)
+	meta(property='og:description' content= summary)
+	meta(property='og:url'         content= url)
+	meta(property='og:image'       content= user.avatarUrl)
+
+block meta
+	if user.host || profile.noCrawle
+		meta(name='robots' content='noindex')
+
+	meta(name='misskey:user-username' content=user.username)
+	meta(name='misskey:user-id' content=user.id)
+	meta(name='misskey:note-id' content=note.id)
+
+	meta(name='twitter:card' content='summary')
+
+	// todo
+	if user.twitter
+		meta(name='twitter:creator' content=`@${user.twitter.screenName}`)
+
+	if note.prev
+		link(rel='prev' href=`${config.url}/notes/${note.prev}`)
+	if note.next
+		link(rel='next' href=`${config.url}/notes/${note.next}`)
+
+	if !user.host
+		link(rel='alternate' href=url type='application/activity+json')
+	if note.uri
+		link(rel='alternate' href=note.uri type='application/activity+json')
diff --git a/packages/backend/src/server/web/views/page.pug b/packages/backend/src/server/web/views/page.pug
new file mode 100644
index 0000000000..cb9e1039e1
--- /dev/null
+++ b/packages/backend/src/server/web/views/page.pug
@@ -0,0 +1,33 @@
+extends ./base
+
+block vars
+	- const user = page.user;
+	- const title = page.title;
+	- const url = `${config.url}/@${user.username}/${page.name}`;
+
+block title
+	= `${title} | ${instanceName}`
+
+block desc
+	meta(name='description' content= page.summary)
+
+block og
+	meta(property='og:type'        content='article')
+	meta(property='og:title'       content= title)
+	meta(property='og:description' content= page.summary)
+	meta(property='og:url'         content= url)
+	meta(property='og:image'       content= page.eyeCatchingImage ? page.eyeCatchingImage.thumbnailUrl : user.avatarUrl)
+
+block meta
+	if profile.noCrawle
+		meta(name='robots' content='noindex')
+
+	meta(name='misskey:user-username' content=user.username)
+	meta(name='misskey:user-id' content=user.id)
+	meta(name='misskey:page-id' content=page.id)
+
+	meta(name='twitter:card' content='summary')
+
+	// todo
+	if user.twitter
+		meta(name='twitter:creator' content=`@${user.twitter.screenName}`)
diff --git a/packages/backend/src/server/web/views/user.pug b/packages/backend/src/server/web/views/user.pug
new file mode 100644
index 0000000000..1a8a6b4413
--- /dev/null
+++ b/packages/backend/src/server/web/views/user.pug
@@ -0,0 +1,42 @@
+extends ./base
+
+block vars
+	- const title = user.name ? `${user.name} (@${user.username})` : `@${user.username}`;
+	- const url = `${config.url}/@${(user.host ? `${user.username}@${user.host}` : user.username)}`;
+	- const img = user.avatarUrl || null;
+
+block title
+	= `${title} | ${instanceName}`
+
+block desc
+	meta(name='description' content= profile.description)
+
+block og
+	meta(property='og:type'        content='blog')
+	meta(property='og:title'       content= title)
+	meta(property='og:description' content= profile.description)
+	meta(property='og:url'         content= url)
+	meta(property='og:image'       content= img)
+
+block meta
+	if user.host || profile.noCrawle
+		meta(name='robots' content='noindex')
+
+	meta(name='misskey:user-username' content=user.username)
+	meta(name='misskey:user-id' content=user.id)
+
+	meta(name='twitter:card' content='summary')
+
+	if profile.twitter
+		meta(name='twitter:creator' content=`@${profile.twitter.screenName}`)
+
+	if !sub
+		if !user.host
+			link(rel='alternate' href=`${config.url}/users/${user.id}` type='application/activity+json')
+		if user.uri
+			link(rel='alternate' href=user.uri type='application/activity+json')
+		if profile.url
+			link(rel='alternate' href=profile.url type='text/html')
+
+	each m in me
+		link(rel='me' href=`${m}`)