wip
This commit is contained in:
syuilo
parent
5daae05bcf
commit
0df6f5a253
|
|
@ -1,3 +1,3 @@
|
|||
<template>
|
||||
<router-view></router-view>
|
||||
<router-view id="app"></router-view>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
import Vue from 'vue';
|
||||
import { EventEmitter } from 'eventemitter3';
|
||||
import api from './scripts/api';
|
||||
import signout from './scripts/signout';
|
||||
|
|
@ -8,6 +9,8 @@ import ServerStreamManager from './scripts/streaming/server-stream-manager';
|
|||
import RequestsStreamManager from './scripts/streaming/requests-stream-manager';
|
||||
import MessagingIndexStreamManager from './scripts/streaming/messaging-index-stream-manager';
|
||||
|
||||
import Err from '../common/views/components/connect-failed.vue';
|
||||
|
||||
//#region environment variables
|
||||
declare const _VERSION_: string;
|
||||
declare const _LANG_: string;
|
||||
|
|
@ -214,8 +217,10 @@ export default class MiOS extends EventEmitter {
|
|||
// When failure
|
||||
.catch(() => {
|
||||
// Render the error screen
|
||||
//document.body.innerHTML = '<mk-error />';
|
||||
//riot.mount('*');
|
||||
document.body.innerHTML = '<div id="err"></div>';
|
||||
new Vue({
|
||||
render: createEl => createEl(Err)
|
||||
}).$mount('#err');
|
||||
|
||||
Progress.done();
|
||||
});
|
||||
|
|
|
|||
|
|
@ -41,8 +41,8 @@ export default Vue.extend({
|
|||
return {
|
||||
network: navigator.onLine,
|
||||
end: false,
|
||||
internet: false,
|
||||
server: false
|
||||
internet: null,
|
||||
server: null
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,146 @@
|
|||
<template>
|
||||
<div class="welcome">
|
||||
<h1><b>Misskey</b>へようこそ</h1>
|
||||
<p>Twitter風ミニブログSNS、Misskeyへようこそ。思ったことを投稿したり、タイムラインでみんなの投稿を読むこともできます。</p>
|
||||
<div class="form">
|
||||
<p>ログイン</p>
|
||||
<div>
|
||||
<mk-signin/>
|
||||
<form @submit.prevent="onSubmit">
|
||||
<input v-model="username" type="text" pattern="^[a-zA-Z0-9-]+$" placeholder="ユーザー名" autofocus required @change="onUsernameChange"/>
|
||||
<input v-model="password" type="password" placeholder="パスワード" required/>
|
||||
<input v-if="user && user.two_factor_enabled" v-model="token" type="number" placeholder="トークン" required/>
|
||||
<button type="submit" :disabled="signing">{{ signing ? 'ログインしています' : 'ログイン' }}</button>
|
||||
</form>
|
||||
<div>
|
||||
<a :href="`${apiUrl}/signin/twitter`">Twitterでログイン</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a href="/signup">アカウントを作成する</a>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import { apiUrl } from '../../../config';
|
||||
|
||||
export default Vue.extend({
|
||||
data() {
|
||||
return {
|
||||
signing: false,
|
||||
user: null,
|
||||
username: '',
|
||||
password: '',
|
||||
token: '',
|
||||
apiUrl
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
document.documentElement.style.background = '#293946';
|
||||
},
|
||||
methods: {
|
||||
onUsernameChange() {
|
||||
(this as any).api('users/show', {
|
||||
username: this.username
|
||||
}).then(user => {
|
||||
this.user = user;
|
||||
});
|
||||
},
|
||||
onSubmit() {
|
||||
this.signing = true;
|
||||
|
||||
(this as any).api('signin', {
|
||||
username: this.username,
|
||||
password: this.password,
|
||||
token: this.user && this.user.two_factor_enabled ? this.token : undefined
|
||||
}).then(() => {
|
||||
location.reload();
|
||||
}).catch(() => {
|
||||
alert('something happened');
|
||||
this.signing = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.welcome
|
||||
padding 16px
|
||||
margin 0 auto
|
||||
max-width 500px
|
||||
|
||||
h1
|
||||
margin 0
|
||||
padding 8px
|
||||
font-size 1.5em
|
||||
font-weight normal
|
||||
color #c3c6ca
|
||||
|
||||
& + p
|
||||
margin 0 0 16px 0
|
||||
padding 0 8px 0 8px
|
||||
color #949fa9
|
||||
|
||||
.form
|
||||
background #fff
|
||||
border solid 1px rgba(0, 0, 0, 0.2)
|
||||
border-radius 8px
|
||||
overflow hidden
|
||||
|
||||
& + a
|
||||
display block
|
||||
margin-top 16px
|
||||
text-align center
|
||||
|
||||
> p
|
||||
margin 0
|
||||
padding 12px 20px
|
||||
color #555
|
||||
background #f5f5f5
|
||||
border-bottom solid 1px #ddd
|
||||
|
||||
> div
|
||||
|
||||
> form
|
||||
padding 16px
|
||||
border-bottom solid 1px #ddd
|
||||
|
||||
input
|
||||
display block
|
||||
padding 12px
|
||||
margin 0 0 16px 0
|
||||
width 100%
|
||||
font-size 1em
|
||||
color rgba(0, 0, 0, 0.7)
|
||||
background #fff
|
||||
outline none
|
||||
border solid 1px #ddd
|
||||
border-radius 4px
|
||||
|
||||
button
|
||||
display block
|
||||
width 100%
|
||||
padding 10px
|
||||
margin 0
|
||||
color #333
|
||||
font-size 1em
|
||||
text-align center
|
||||
text-decoration none
|
||||
text-shadow 0 1px 0 rgba(255, 255, 255, 0.9)
|
||||
background-image linear-gradient(#fafafa, #eaeaea)
|
||||
border 1px solid #ddd
|
||||
border-bottom-color #cecece
|
||||
border-radius 4px
|
||||
|
||||
&:active
|
||||
background-color #767676
|
||||
background-image none
|
||||
border-color #444
|
||||
box-shadow 0 1px 3px rgba(0, 0, 0, 0.075), inset 0 0 5px rgba(0, 0, 0, 0.2)
|
||||
|
||||
> div
|
||||
padding 16px
|
||||
text-align center
|
||||
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,18 +0,0 @@
|
|||
/**
|
||||
* Replace base64 symbols
|
||||
*/
|
||||
|
||||
import * as fs from 'fs';
|
||||
|
||||
export default () => ({
|
||||
enforce: 'pre',
|
||||
test: /\.(vue|js)$/,
|
||||
exclude: /node_modules/,
|
||||
loader: 'string-replace-loader',
|
||||
query: {
|
||||
search: /%base64:(.+?)%/g,
|
||||
replace: (_, key) => {
|
||||
return fs.readFileSync(__dirname + '/../../../src/web/' + key, 'base64');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
@ -2,6 +2,7 @@
|
|||
* webpack configuration
|
||||
*/
|
||||
|
||||
import * as fs from 'fs';
|
||||
const minify = require('html-minifier').minify;
|
||||
import I18nReplacer from '../src/common/build/i18n';
|
||||
import { pattern as faPattern, replacement as faReplacement } from '../src/common/build/fa';
|
||||
|
|
@ -19,7 +20,11 @@ global['collapseSpacesReplacement'] = html => {
|
|||
collapseWhitespace: true,
|
||||
collapseInlineTagWhitespace: true,
|
||||
keepClosingSlash: true
|
||||
});
|
||||
}).replace(/\t/g, '');
|
||||
};
|
||||
|
||||
global['base64replacement'] = (_, key) => {
|
||||
return fs.readFileSync(__dirname + '/../src/web/' + key, 'base64');
|
||||
};
|
||||
|
||||
module.exports = Object.keys(langs).map(lang => {
|
||||
|
|
@ -59,6 +64,12 @@ module.exports = Object.keys(langs).map(lang => {
|
|||
cssSourceMap: false,
|
||||
preserveWhitespace: false
|
||||
}
|
||||
}, {
|
||||
loader: 'replace',
|
||||
query: {
|
||||
search: /%base64:(.+?)%/g.toString(),
|
||||
replace: 'base64replacement'
|
||||
}
|
||||
}, {
|
||||
loader: 'webpack-replace-loader',
|
||||
options: {
|
||||
|
|
|
|||
Loading…
Reference in New Issue