1
0
mirror of https://github.com/MisskeyIO/misskey synced 2024-11-27 14:28:49 +09:00
This commit is contained in:
syuilo 2018-02-22 05:05:19 +09:00
parent 5daae05bcf
commit 0df6f5a253
6 changed files with 165 additions and 26 deletions

View File

@ -1,3 +1,3 @@
<template>
<router-view></router-view>
<router-view id="app"></router-view>
</template>

View File

@ -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();
});

View File

@ -41,8 +41,8 @@ export default Vue.extend({
return {
network: navigator.onLine,
end: false,
internet: false,
server: false
internet: null,
server: null
};
},
mounted() {

View File

@ -1,5 +1,146 @@
<template>
<div class="welcome">
<h1><b>Misskey</b>へようこそ</h1>
<p>Twitter風ミニブログSNSMisskeyへようこそ思ったことを投稿したりタイムラインでみんなの投稿を読むこともできます</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>

View File

@ -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');
}
}
});

View File

@ -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: {