✌️

locales/en.yml

@@ -183,6 +183,24 @@ common:
     mk-uploader:
       waiting: "Waiting"
 
+docs:
+  edit-this-page-on-github: "Caught a mistake or want to contribute to the documentation? "
+  edit-this-page-on-github-link: "Edit this page on Github!"
+
+  api:
+    entities:
+      properties: "Properties"
+    endpoints:
+      params: "Parameters"
+      res: "Response"
+    props:
+      name: "Name"
+      type: "Type"
+      optional: "Optional"
+      description: "Description"
+      yes: "Yes"
+      no: "No"
+
 ch:
   tags:
     mk-index:

locales/index.ts

@@ -10,12 +10,12 @@ const loadLang = lang => yaml.safeLoad(
 
 const native = loadLang('ja');
 
-const langs = Object.entries({
+const langs = {
 	'en': loadLang('en'),
 	'ja': native
-});
+};
 
-langs.map(([, locale]) => {
+Object.entries(langs).map(([, locale]) => {
 	// Extend native language (Japanese)
 	locale = Object.assign({}, native, locale);
 });

locales/ja.yml

@@ -183,6 +183,24 @@ common:
     mk-uploader:
       waiting: "待機中"
 
+docs:
+  edit-this-page-on-github: "間違いや改善点を見つけましたか？"
+  edit-this-page-on-github-link: "このページをGitHubで編集"
+
+  api:
+    entities:
+      properties: "プロパティ"
+    endpoints:
+      params: "パラメータ"
+      res: "レスポンス"
+    props:
+      name: "名前"
+      type: "型"
+      optional: "オプション"
+      description: "説明"
+      yes: "はい"
+      no: "いいえ"
+
 ch:
   tags:
     mk-index:

src/web/docs/api/endpoints/style.styl

@@ -1,8 +1,21 @@
 @import "../style"
 
 #url
-	padding 8px 12px
+	padding 8px 12px 8px 8px
 	font-family Consolas, 'Courier New', Courier, Monaco, monospace
 	color #fff
 	background #222e40
 	border-radius 4px
+
+	> .method
+		display inline-block
+		margin 0 8px 0 0
+		padding 0 6px
+		color #f4fcff
+		background #17afc7
+		border-radius 4px
+		user-select none
+		pointer-events none
+
+	> .host
+		opacity 0.7

src/web/docs/api/endpoints/view.pug

@@ -7,12 +7,17 @@ block meta
 block main
 	h1= endpoint
 
-	p#url= url
+	p#url
+		span.method POST
+		span.host
+			= url.host
+			| /
+		span.path= url.path
 
 	p#desc= desc[lang] || desc['ja']
 
 	section
-		h2 Params
+		h2= common.i18n[lang]['docs']['api']['endpoints']['params']
 		+propTable(params)
 
 		if paramDefs
@@ -23,5 +28,5 @@ block main
 
 	if res
 		section
-			h2 Response
+			h2= common.i18n[lang]['docs']['api']['endpoints']['res']
 			+propTable(res)

src/web/docs/api/entities/view.pug

@@ -10,7 +10,7 @@ block main
 	p#desc= desc[lang] || desc['ja']
 
 	section
-		h2 Properties
+		h2= common.i18n[lang]['docs']['api']['entities']['properties']
 		+propTable(props)
 
 		if propDefs

src/web/docs/api/gulpfile.ts

@@ -16,7 +16,7 @@ import generateVars from '../vars';
 
 const commonVars = generateVars();
 
-const langs = ['ja', 'en'];
+const langs = Object.keys(commonVars.i18n);
 
 const kebab = string => string.replace(/([a-z])([A-Z])/g, '$1-$2').replace(/\s+/g, '-').toLowerCase();
 
@@ -102,7 +102,10 @@ gulp.task('doc:api:endpoints', () => {
 			const ep = yaml.safeLoad(fs.readFileSync(file, 'utf-8'));
 			const vars = {
 				endpoint: ep.endpoint,
-				url: `${config.api_url}/${ep.endpoint}`,
+				url: {
+					host: config.api_url,
+					path: ep.endpoint
+				},
 				desc: ep.desc,
 				params: sortParams(ep.params.map(p => parseParam(p))),
 				paramDefs: extractDefs(ep.params),
@@ -113,6 +116,7 @@ gulp.task('doc:api:endpoints', () => {
 				pug.renderFile('./src/web/docs/api/endpoints/view.pug', Object.assign({}, vars, {
 					lang,
 					title: ep.endpoint,
+					src: `https://github.com/syuilo/misskey/tree/master/src/web/docs/api/endpoints/${ep.endpoint}.yaml`,
 					kebab,
 					common: commonVars
 				}), (renderErr, html) => {
@@ -152,6 +156,7 @@ gulp.task('doc:api:entities', () => {
 				pug.renderFile('./src/web/docs/api/entities/view.pug', Object.assign({}, vars, {
 					lang,
 					title: entity.name,
+					src: `https://github.com/syuilo/misskey/tree/master/src/web/docs/api/entities/${kebab(entity.name)}.yaml`,
 					kebab,
 					common: commonVars
 				}), (renderErr, html) => {

src/web/docs/api/mixins.pug

@@ -1,10 +1,10 @@
 mixin propTable(props)
 	table.props
 		thead: tr
-			th Name
-			th Type
-			th Optional
-			th Description
+			th= common.i18n[lang]['docs']['api']['props']['name']
+			th= common.i18n[lang]['docs']['api']['props']['type']
+			th= common.i18n[lang]['docs']['api']['props']['optional']
+			th= common.i18n[lang]['docs']['api']['props']['description']
 		tbody
 			each prop in props
 				tr
@@ -29,5 +29,9 @@ mixin propTable(props)
 								| )
 						else if prop.kind == 'date'
 							|  (Date)
-					td.optional= prop.optional.toString()
+					td.optional
+						if prop.optional
+							= common.i18n[lang]['docs']['api']['props']['yes']
+						else
+							= common.i18n[lang]['docs']['api']['props']['no']
 					td.desc!= prop.desc[lang] || prop.desc['ja']

src/web/docs/gulpfile.ts

@@ -37,7 +37,8 @@ gulp.task('doc:docs', () => {
 			const vars = {
 				common: commonVars,
 				lang: lang,
-				title: fs.readFileSync(file, 'utf-8').match(/^h1 (.+?)\r?\n/)[1]
+				title: fs.readFileSync(file, 'utf-8').match(/^h1 (.+?)\r?\n/)[1],
+				src: `https://github.com/syuilo/misskey/tree/master/src/web/docs/${name}.${lang}.pug`,
 			};
 			pug.renderFile(file, vars, (renderErr, content) => {
 				if (renderErr) {

src/web/docs/layout.pug

@@ -27,6 +27,12 @@ html(lang= lang)
 							each endpoint in common.endpoints
 								li: a(href=`./api/endpoints/${common.kebab(endpoint)}`)= endpoint
 		main
+			article
 				block main
 				if content
 					| !{content}
+
+			footer
+				p
+					= common.i18n[lang]['docs']['edit-this-page-on-github']
+					a(href=src target="_blank")= common.i18n[lang]['docs']['edit-this-page-on-github-link']

src/web/docs/style.styl

@@ -37,6 +37,14 @@ main
 		margin 1em 0
 		line-height 1.6em
 
+	footer
+		margin 32px 0 0 0
+		border-top solid 2px #eee
+
+		.copyright
+			margin 16px 0 0 0
+			color #aaa
+
 nav
 	display block
 	position fixed
@@ -48,15 +56,6 @@ nav
 	padding 32px
 	border-right solid 2px #eee
 
-footer
-	padding:32px 0 0 0
-	margin 32px 0 0 0
-	border-top solid 1px #eee
-
-	.copyright
-		margin 16px 0 0 0
-		color #aaa
-
 table
 	width 100%
 	border-spacing 0

src/web/docs/vars.ts

@@ -1,10 +1,11 @@
 import * as fs from 'fs';
 import * as glob from 'glob';
 import * as yaml from 'js-yaml';
+import langs from '../../../locales';
 import config from '../../conf';
 
-export default function() {
-	const vars = {};
+export default function(): { [key: string]: any } {
+	const vars = {} as { [key: string]: any };
 
 	const endpoints = glob.sync('./src/web/docs/api/endpoints/**/*.yaml');
 	vars['endpoints'] = endpoints.map(ep => {
@@ -35,5 +36,7 @@ export default function() {
 
 	vars['config'] = config;
 
+	vars['i18n'] = langs;
+
 	return vars;
 }

webpack/webpack.config.ts

@@ -5,10 +5,10 @@
 import module_ from './module';
 import plugins from './plugins';
 
-import langs from './langs';
+import langs from '../locales';
 import version from '../src/version';
 
-module.exports = langs.map(([lang, locale]) => {
+module.exports = Object.entries(langs).map(([lang, locale]) => {
 	// Chunk name
 	const name = lang;