開発モードで警告を表示するようにするなど

This commit is contained in:
syuilo 2018-08-30 22:10:29 +09:00
parent 9fd4f5ee0a
commit f0abc46429
6 changed files with 46 additions and 5 deletions

View file

@ -94,6 +94,8 @@ common:
verified-user: "公式アカウント" verified-user: "公式アカウント"
disable-animated-mfm: "投稿内の動きのあるテキストを無効にする" disable-animated-mfm: "投稿内の動きのあるテキストを無効にする"
do-not-use-in-production: 'これは開発ビルドです。本番環境で使用しないでください。'
reversi: reversi:
drawn: "引き分け" drawn: "引き分け"
my-turn: "あなたのターンです" my-turn: "あなたのターンです"

View file

@ -4,6 +4,7 @@ declare const _THEME_COLOR_: string;
declare const _COPYRIGHT_: string; declare const _COPYRIGHT_: string;
declare const _VERSION_: string; declare const _VERSION_: string;
declare const _CODENAME_: string; declare const _CODENAME_: string;
declare const _ENV_: string;
const address = new URL(location.href); const address = new URL(location.href);
@ -18,3 +19,4 @@ export const themeColor = _THEME_COLOR_;
export const copyright = _COPYRIGHT_; export const copyright = _COPYRIGHT_;
export const version = _VERSION_; export const version = _VERSION_;
export const codename = _CODENAME_; export const codename = _CODENAME_;
export const env = _ENV_;

View file

@ -1,5 +1,6 @@
<template> <template>
<div class="header"> <div class="header">
<p class="warn" v-if="env != 'production'">%i18n:common.do-not-use-in-production%</p>
<mk-special-message/> <mk-special-message/>
<div class="main" ref="main"> <div class="main" ref="main">
<div class="backdrop"></div> <div class="backdrop"></div>
@ -28,6 +29,7 @@
<script lang="ts"> <script lang="ts">
import Vue from 'vue'; import Vue from 'vue';
import * as anime from 'animejs'; import * as anime from 'animejs';
import { env } from '../../../config';
import XNav from './ui.header.nav.vue'; import XNav from './ui.header.nav.vue';
import XSearch from './ui.header.search.vue'; import XSearch from './ui.header.search.vue';
@ -43,7 +45,13 @@ export default Vue.extend({
XAccount, XAccount,
XNotifications, XNotifications,
XPost, XPost,
XClock, XClock
},
data() {
return {
env: env
};
}, },
mounted() { mounted() {
@ -119,6 +127,15 @@ root(isDark)
width 100% width 100%
box-shadow 0 1px 1px rgba(#000, 0.075) box-shadow 0 1px 1px rgba(#000, 0.075)
> .warn
display block
margin 0
padding 4px
text-align center
font-size 12px
background #f00
color #fff
> .main > .main
height 48px height 48px

View file

@ -1,5 +1,6 @@
<template> <template>
<div class="header"> <div class="header" ref="root">
<p class="warn" v-if="env != 'production'">%i18n:common.do-not-use-in-production%</p>
<mk-special-message/> <mk-special-message/>
<div class="main" ref="main"> <div class="main" ref="main">
<div class="backdrop"></div> <div class="backdrop"></div>
@ -20,6 +21,7 @@
<script lang="ts"> <script lang="ts">
import Vue from 'vue'; import Vue from 'vue';
import * as anime from 'animejs'; import * as anime from 'animejs';
import { env } from '../../../config';
export default Vue.extend({ export default Vue.extend({
props: ['func'], props: ['func'],
@ -27,7 +29,8 @@ export default Vue.extend({
return { return {
hasGameInvitation: false, hasGameInvitation: false,
connection: null, connection: null,
connectionId: null connectionId: null,
env: env
}; };
}, },
computed: { computed: {
@ -39,7 +42,7 @@ export default Vue.extend({
} }
}, },
mounted() { mounted() {
this.$store.commit('setUiHeaderHeight', 48); this.$store.commit('setUiHeaderHeight', this.$refs.root.offsetHeight);
if (this.$store.getters.isSignedIn) { if (this.$store.getters.isSignedIn) {
this.connection = (this as any).os.stream.getConnection(); this.connection = (this as any).os.stream.getConnection();
@ -133,6 +136,15 @@ root(isDark)
height 3px height 3px
background $theme-color background $theme-color
> .warn
display block
margin 0
padding 4px
text-align center
font-size 12px
background #f00
color #fff
> .main > .main
color rgba(#fff, 0.9) color rgba(#fff, 0.9)

View file

@ -31,7 +31,14 @@ export default Vue.extend({
connectionId: null connectionId: null
}; };
}, },
watch: {
'$store.state.uiHeaderHeight'() {
this.$el.style.paddingTop = this.$store.state.uiHeaderHeight + 'px';
}
},
mounted() { mounted() {
this.$el.style.paddingTop = this.$store.state.uiHeaderHeight + 'px';
if (this.$store.getters.isSignedIn) { if (this.$store.getters.isSignedIn) {
this.connection = (this as any).os.stream.getConnection(); this.connection = (this as any).os.stream.getConnection();
this.connectionId = (this as any).os.stream.use(); this.connectionId = (this as any).os.stream.use();

View file

@ -73,7 +73,8 @@ const consts = {
_VERSION_: version, _VERSION_: version,
_CODENAME_: codename, _CODENAME_: codename,
_LANG_: '%lang%', _LANG_: '%lang%',
_LANGS_: Object.keys(locales).map(l => [l, locales[l].meta.lang]) _LANGS_: Object.keys(locales).map(l => [l, locales[l].meta.lang]),
_ENV_: process.env.NODE_ENV
}; };
const _consts: { [ key: string ]: any } = {}; const _consts: { [ key: string ]: any } = {};