161sh/iceshrimp-161sh
1
0
Fork 0
mirror of https://iceshrimp.dev/crimekillz/iceshrimp-161sh.git synced 2024-11-25 05:29:07 +01:00
Code Issues Packages Projects Releases Wiki Activity

OGP向けにインスタンスのバナー画像を提供するように

Browse Source
This commit is contained in:
syuilo 2018-12-15 23:19:04 +09:00
parent 2d62b5c02f
commit 300cbe6798
10 changed files with 28 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
gulpfile.ts
View File

@ -11,14 +11,12 @@ import tslint from 'gulp-tslint';
const cssnano = require('gulp-cssnano'); const cssnano = require('gulp-cssnano');
const stylus = require('gulp-stylus'); const stylus = require('gulp-stylus');
import * as uglifyComposer from 'gulp-uglify/composer'; import * as uglifyComposer from 'gulp-uglify/composer';
import pug = require('gulp-pug');
import * as rimraf from 'rimraf'; import * as rimraf from 'rimraf';
import chalk from 'chalk'; import chalk from 'chalk';
const imagemin = require('gulp-imagemin'); const imagemin = require('gulp-imagemin');
import * as rename from 'gulp-rename'; import * as rename from 'gulp-rename';
import * as mocha from 'gulp-mocha'; import * as mocha from 'gulp-mocha';
import * as replace from 'gulp-replace'; import * as replace from 'gulp-replace';
import * as htmlmin from 'gulp-htmlmin';
const uglifyes = require('uglify-es'); const uglifyes = require('uglify-es');
const locales = require('./locales'); const locales = require('./locales');
@ -34,8 +32,6 @@ if (isDebug) {
console.warn(chalk.yellow.bold(' built script will not be compressed.')); console.warn(chalk.yellow.bold(' built script will not be compressed.'));
} }
const constants = require('./src/const.json');
gulp.task('build', [ gulp.task('build', [
'build:ts', 'build:ts',
'build:copy', 'build:copy',
@ -109,7 +105,7 @@ gulp.task('default', ['build']);
gulp.task('build:client', [ gulp.task('build:client', [
'build:ts', 'build:ts',
'build:client:script', 'build:client:script',
'build:client:pug', 'build:client:styles',
'copy:client' 'copy:client'
]); ]);
@ -148,52 +144,6 @@ gulp.task('copy:client', [
.pipe(gulp.dest('./built/client/assets/')) .pipe(gulp.dest('./built/client/assets/'))
); );
gulp.task('build:client:pug', [
'copy:client',
'build:client:script',
'build:client:styles'
], () =>
gulp.src('./src/client/app/base.pug')
.pipe(pug({
locals: {
themeColor: constants.themeColor
}
}))
.pipe(htmlmin({
// 真理値属性の簡略化 e.g.
// <input value="foo" readonly="readonly"> to
// <input value="foo" readonly>
collapseBooleanAttributes: true,
// テキストの一部かもしれない空白も削除する e.g.
// <div> <p> foo </p> </div> to
// <div><p>foo</p></div>
collapseWhitespace: true,
// タグ間の改行を保持する
preserveLineBreaks: true,
// (できる場合は)属性のクォーテーション削除する e.g.
// <p class="foo-bar" id="moo" title="blah blah">foo</p> to
// <p class=foo-bar id=moo title="blah blah">foo</p>
removeAttributeQuotes: true,
// 省略可能なタグを省略する e.g.
// <html><p>yo</p></html> ro
// <p>yo</p>
removeOptionalTags: true,
// 属性の値がデフォルトと同じなら省略する e.g.
// <input type="text"> to
// <input>
removeRedundantAttributes: true,
// CSSも圧縮する
minifyCSS: true
}))
.pipe(gulp.dest('./built/client/app/'))
);
gulp.task('locales', () => gulp.task('locales', () =>
gulp.src('./locales/*.yml') gulp.src('./locales/*.yml')
.pipe(yaml({ schema: 'DEFAULT_SAFE_SCHEMA' })) .pipe(yaml({ schema: 'DEFAULT_SAFE_SCHEMA' }))

3
package.json
View File

@ -37,7 +37,6 @@
"@types/elasticsearch": "5.0.29", "@types/elasticsearch": "5.0.29",
"@types/file-type": "5.2.2", "@types/file-type": "5.2.2",
"@types/gulp": "3.8.36", "@types/gulp": "3.8.36",
"@types/gulp-htmlmin": "1.3.32",
"@types/gulp-mocha": "0.0.32", "@types/gulp-mocha": "0.0.32",
"@types/gulp-rename": "0.0.33", "@types/gulp-rename": "0.0.33",
"@types/gulp-replace": "0.0.31", "@types/gulp-replace": "0.0.31",
@ -120,10 +119,8 @@
"fuckadblock": "3.2.1", "fuckadblock": "3.2.1",
"gulp": "3.9.1", "gulp": "3.9.1",
"gulp-cssnano": "2.1.3", "gulp-cssnano": "2.1.3",
"gulp-htmlmin": "5.0.1",
"gulp-imagemin": "4.1.0", "gulp-imagemin": "4.1.0",
"gulp-mocha": "6.0.0", "gulp-mocha": "6.0.0",
"gulp-pug": "4.0.1",
"gulp-rename": "1.4.0", "gulp-rename": "1.4.0",
"gulp-replace": "1.0.0", "gulp-replace": "1.0.0",
"gulp-sourcemaps": "2.6.4", "gulp-sourcemaps": "2.6.4",

4
src/client/app/common/views/components/analog-clock.vue
View File

@ -32,7 +32,7 @@
<script lang="ts"> <script lang="ts">
import Vue from 'vue'; import Vue from 'vue';
import { themeColor } from '../../../config'; import * as tinycolor from 'tinycolor2';
export default Vue.extend({ export default Vue.extend({
props: { props: {
@ -75,7 +75,7 @@ export default Vue.extend({
return this.dark ? '#fff' : '#777'; return this.dark ? '#fff' : '#777';
}, },
hHandColor(): string { hHandColor(): string {
return themeColor; return tinycolor(getComputedStyle(document.documentElement).getPropertyValue('--text')).toHexString();
}, },
ms(): number { ms(): number {

1
src/client/app/config.ts
View File

@ -16,7 +16,6 @@ export const wsUrl = url.replace('http://', 'ws://').replace('https://', 'wss://
export const lang = window.lang; export const lang = window.lang;
export const langs = _LANGS_; export const langs = _LANGS_;
export const locale = JSON.parse(localStorage.getItem('locale')); export const locale = JSON.parse(localStorage.getItem('locale'));
export const themeColor = _THEME_COLOR_;
export const copyright = _COPYRIGHT_; export const copyright = _COPYRIGHT_;
export const version = _VERSION_; export const version = _VERSION_;
export const clientVersion = _CLIENT_VERSION_; export const clientVersion = _CLIENT_VERSION_;

4
src/const.json
View File

@ -1,5 +1,3 @@
{ {
"copyright": "Copyright (c) 2014-2018 syuilo", "copyright": "Copyright (c) 2014-2018 syuilo"
"themeColor": "#fb4e4e",
"themeColorForeground": "#fff"
} }

12
src/server/web/index.ts
View File

@ -15,7 +15,7 @@ import parseAcct from '../../misc/acct/parse';
import config from '../../config'; import config from '../../config';
import Note, { pack as packNote } from '../../models/note'; import Note, { pack as packNote } from '../../models/note';
import getNoteSummary from '../../misc/get-note-summary'; import getNoteSummary from '../../misc/get-note-summary';
const consts = require('../../const.json'); import fetchMeta from '../../misc/fetch-meta';
const client = `${__dirname}/../../client/`; const client = `${__dirname}/../../client/`;
@ -26,8 +26,7 @@ const app = new Koa();
app.use(views(__dirname + '/views', { app.use(views(__dirname + '/views', {
extension: 'pug', extension: 'pug',
options: { options: {
config, config
themeColor: consts.themeColor
} }
})); }));
@ -120,10 +119,11 @@ router.get('/notes/:note', async ctx => {
// Render base html for all requests // Render base html for all requests
router.get('*', async ctx => { router.get('*', async ctx => {
await send(ctx, `app/base.html`, { const meta = await fetchMeta();
root: client, await ctx.render('base', {
maxage: ms('5m') img: meta.bannerUrl
}); });
ctx.set('Cache-Control', 'public, max-age=86400');
}); });
// Register router // Register router

15
src/client/app/base.pug → src/server/web/views/base.pug
View File

@ -9,7 +9,6 @@ html
head head
meta(charset='utf-8') meta(charset='utf-8')
meta(name='application-name' content='Misskey') meta(name='application-name' content='Misskey')
meta(name='theme-color' content=themeColor)
meta(name='referrer' content='origin') meta(name='referrer' content='origin')
meta(property='og:site_name' content='Misskey') meta(property='og:site_name' content='Misskey')
link(rel='manifest' href='/manifest.json') link(rel='manifest' href='/manifest.json')
@ -23,16 +22,16 @@ html
block meta block meta
block og
meta(property='og:image' content=img)
style style
include ./../../../built/client/assets/init.css include ./../../../../built/client/assets/init.css
script script
include ./../../../built/client/assets/boot.js include ./../../../../built/client/assets/boot.js
script script
include ./../../../built/client/assets/safe.js include ./../../../../built/client/assets/safe.js
//- FontAwesome style
style #{facss}
body body
noscript: p noscript: p
@ -41,5 +40,5 @@ html
| Please turn on your JavaScript | Please turn on your JavaScript
div#ini. div#ini.
<svg viewBox="0 0 50 50"> <svg viewBox="0 0 50 50">
<path fill=#{themeColor} d="M25.251,6.461c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615V6.461z" /> <path fill=#fb4e4e d="M25.251,6.461c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615V6.461z" />
</svg> </svg>

8
src/server/web/views/note.pug
View File

@ -1,4 +1,4 @@
extends ../../../../src/client/app/base extends ./base
block vars block vars
- const user = note.user; - const user = note.user;
@ -11,14 +11,16 @@ block title
block desc block desc
meta(name='description' content= summary) meta(name='description' content= summary)
block meta block og
meta(name='twitter:card' content='summary')
meta(property='og:type' content='article') meta(property='og:type' content='article')
meta(property='og:title' content= title) meta(property='og:title' content= title)
meta(property='og:description' content= summary) meta(property='og:description' content= summary)
meta(property='og:url' content= url) meta(property='og:url' content= url)
meta(property='og:image' content= user.avatarUrl) meta(property='og:image' content= user.avatarUrl)
block meta
meta(name='twitter:card' content='summary')
if note.prev if note.prev
link(rel='prev' href=`${config.url}/notes/${note.prev}`) link(rel='prev' href=`${config.url}/notes/${note.prev}`)
if note.next if note.next

10
src/server/web/views/user.pug
View File

@ -1,4 +1,4 @@
extends ../../../../src/client/app/base extends ./base
block vars block vars
- const title = user.name ? `${user.name} (@${user.username})` : `@${user.username}`; - const title = user.name ? `${user.name} (@${user.username})` : `@${user.username}`;
@ -11,14 +11,16 @@ block title
block desc block desc
meta(name='description' content= user.description) meta(name='description' content= user.description)
block meta block og
meta(name='twitter:card' content='summary')
meta(property='og:type' content='blog') meta(property='og:type' content='blog')
meta(property='og:title' content= title) meta(property='og:title' content= title)
meta(property='og:description' content= user.description) meta(property='og:description' content= user.description)
meta(property='og:url' content= url) meta(property='og:url' content= url)
meta(property='og:image' content= img) meta(property='og:image' content= img)
block meta
meta(name='twitter:card' content='summary')
if !user.host if !user.host
link(rel='alternate' href=`${config.url}/users/${user._id}` type='application/activity+json') link(rel='alternate' href=`${config.url}/users/${user._id}` type='application/activity+json')
if user.uri if user.uri

1
webpack.config.ts
View File

@ -114,7 +114,6 @@ module.exports = {
clear: false clear: false
}), }),
new webpack.DefinePlugin({ new webpack.DefinePlugin({
_THEME_COLOR_: JSON.stringify(constants.themeColor),
_COPYRIGHT_: JSON.stringify(constants.copyright), _COPYRIGHT_: JSON.stringify(constants.copyright),
_VERSION_: JSON.stringify(meta.version), _VERSION_: JSON.stringify(meta.version),
_CLIENT_VERSION_: JSON.stringify(version), _CLIENT_VERSION_: JSON.stringify(version),