This commit is contained in:
syuilo 2017-08-28 19:43:24 +09:00
parent 09e443aeb3
commit 29ed58e4b3
7 changed files with 213 additions and 7 deletions

View file

@ -4,6 +4,7 @@ ChangeLog
unreleased unreleased
---------- ----------
* New: モバイル版からプロフィールを設定できるように
* Improve: 投稿ページに次の投稿/前の投稿リンクを作成 (#734) * Improve: 投稿ページに次の投稿/前の投稿リンクを作成 (#734)
* Improve: タイムラインの投稿をダブルクリックすることで詳細な情報が見れるように * Improve: タイムラインの投稿をダブルクリックすることで詳細な情報が見れるように
* Fix: モバイル版でおすすめユーザーをフォローしてもタイムラインが更新されない (#736) * Fix: モバイル版でおすすめユーザーをフォローしてもタイムラインが更新されない (#736)

View file

@ -336,12 +336,28 @@ mobile:
mk-search-page: mk-search-page:
search: "Search" search: "Search"
mk-settings:
signed-in-as: "Signed in as {}"
mk-settings-page: mk-settings-page:
profile: "Profile" profile: "Profile"
applications: "Applications" applications: "Applications"
twitter-integration: "Twitter integration" twitter-integration: "Twitter integration"
signin-history: "Sign in history" signin-history: "Sign in history"
api: "API"
settings: "Settings" settings: "Settings"
signout: "Sign out"
mk-profile-setting-page:
title: "Profile Settings"
mk-profile-setting:
name: "Name"
location: "Location"
description: "Description"
birthday: "Birthday"
save: "Save"
saved: "Profile updated successfully"
mk-user-followers-page: mk-user-followers-page:
followers-of: "Followers of {}" followers-of: "Followers of {}"

View file

@ -336,12 +336,28 @@ mobile:
mk-search-page: mk-search-page:
search: "検索" search: "検索"
mk-settings:
signed-in-as: "{}としてサインイン中"
mk-settings-page: mk-settings-page:
profile: "プロフィール" profile: "プロフィール"
applications: "アプリケーション" applications: "アプリケーション"
twitter-integration: "Twitter連携" twitter-integration: "Twitter連携"
signin-history: "ログイン履歴" signin-history: "ログイン履歴"
api: "API"
settings: "設定" settings: "設定"
signout: "サインアウト"
mk-profile-setting-page:
title: "プロフィール設定"
mk-profile-setting:
name: "名前"
location: "場所"
description: "自己紹介"
birthday: "誕生日"
save: "保存"
saved: "プロフィールを保存しました"
mk-user-followers-page: mk-user-followers-page:
followers-of: "{}のフォロワー" followers-of: "{}のフォロワー"

View file

@ -15,6 +15,7 @@ export default me => {
route('/i/drive/folder/:folder', drive); route('/i/drive/folder/:folder', drive);
route('/i/drive/file/:file', drive); route('/i/drive/file/:file', drive);
route('/i/settings', settings); route('/i/settings', settings);
route('/i/settings/profile', settingsProfile);
route('/i/settings/signin-history', settingsSignin); route('/i/settings/signin-history', settingsSignin);
route('/i/settings/api', settingsApi); route('/i/settings/api', settingsApi);
route('/i/settings/twitter', settingsTwitter); route('/i/settings/twitter', settingsTwitter);
@ -63,6 +64,10 @@ export default me => {
mount(document.createElement('mk-settings-page')); mount(document.createElement('mk-settings-page'));
} }
function settingsProfile() {
mount(document.createElement('mk-profile-setting-page'));
}
function settingsSignin() { function settingsSignin() {
mount(document.createElement('mk-signin-history-page')); mount(document.createElement('mk-signin-history-page'));
} }
@ -130,6 +135,7 @@ export default me => {
}; };
function mount(content) { function mount(content) {
document.documentElement.style.background = '#fff';
if (page) page.unmount(); if (page) page.unmount();
const body = document.getElementById('app'); const body = document.getElementById('app');
page = riot.mount(body.appendChild(content))[0]; page = riot.mount(body.appendChild(content))[0];

View file

@ -14,6 +14,7 @@ require('./page/post.tag');
require('./page/new-post.tag'); require('./page/new-post.tag');
require('./page/search.tag'); require('./page/search.tag');
require('./page/settings.tag'); require('./page/settings.tag');
require('./page/settings/profile.tag');
require('./page/settings/signin.tag'); require('./page/settings/signin.tag');
require('./page/settings/api.tag'); require('./page/settings/api.tag');
require('./page/settings/authorized-apps.tag'); require('./page/settings/authorized-apps.tag');

View file

@ -1,12 +1,6 @@
<mk-settings-page> <mk-settings-page>
<mk-ui ref="ui"> <mk-ui ref="ui">
<ul> <mk-settings />
<li><a><i class="fa fa-user"></i>%i18n:mobile.tags.mk-settings-page.profile%</a></li>
<li><a href="./settings/authorized-apps"><i class="fa fa-puzzle-piece"></i>%i18n:mobile.tags.mk-settings-page.applications%</a></li>
<li><a href="./settings/twitter"><i class="fa fa-twitter"></i>%i18n:mobile.tags.mk-settings-page.twitter-integration%</a></li>
<li><a href="./settings/signin-history"><i class="fa fa-sign-in"></i>%i18n:mobile.tags.mk-settings-page.signin-history%</a></li>
<li><a href="./settings/api"><i class="fa fa-key"></i>API</a></li>
</ul>
</mk-ui> </mk-ui>
<style> <style>
:scope :scope
@ -18,6 +12,72 @@
this.on('mount', () => { this.on('mount', () => {
document.title = 'Misskey | %i18n:mobile.tags.mk-settings-page.settings%'; document.title = 'Misskey | %i18n:mobile.tags.mk-settings-page.settings%';
ui.trigger('title', '<i class="fa fa-cog"></i>%i18n:mobile.tags.mk-settings-page.settings%'); ui.trigger('title', '<i class="fa fa-cog"></i>%i18n:mobile.tags.mk-settings-page.settings%');
document.documentElement.style.background = '#eee';
}); });
</script> </script>
</mk-settings-page> </mk-settings-page>
<mk-settings>
<p><mk-raw content={ '%i18n:mobile.tags.mk-settings.signed-in-as%'.replace('{}', '<b>' + I.name + '</b>') }/></p>
<ul>
<li><a href="./settings/profile"><i class="fa fa-user"></i>%i18n:mobile.tags.mk-settings-page.profile%<i class="fa fa-angle-right"></i></a></li>
<li><a href="./settings/authorized-apps"><i class="fa fa-puzzle-piece"></i>%i18n:mobile.tags.mk-settings-page.applications%<i class="fa fa-angle-right"></i></a></li>
<li><a href="./settings/twitter"><i class="fa fa-twitter"></i>%i18n:mobile.tags.mk-settings-page.twitter-integration%<i class="fa fa-angle-right"></i></a></li>
<li><a href="./settings/signin-history"><i class="fa fa-sign-in"></i>%i18n:mobile.tags.mk-settings-page.signin-history%<i class="fa fa-angle-right"></i></a></li>
<li><a href="./settings/api"><i class="fa fa-key"></i>%i18n:mobile.tags.mk-settings-page.api%<i class="fa fa-angle-right"></i></a></li>
</ul>
<ul>
<li><a onclick={ signout }><i class="fa fa-power-off"></i>%i18n:mobile.tags.mk-settings-page.signout%</a></li>
</ul>
<style>
:scope
display block
> p
display block
margin 24px
text-align center
color #555
> ul
display block
margin 16px 0
padding 0
list-style none
border-top solid 1px #aaa
> li
display block
background #fff
border-bottom solid 1px #aaa
> a
$height = 48px
display block
position relative
padding 0 16px
line-height $height
color #4d635e
> i:nth-of-type(1)
margin-right 4px
> i:nth-of-type(2)
display block
position absolute
top 0
right 8px
z-index 1
padding 0 20px
font-size 1.2em
line-height $height
</style>
<script>
import signout from '../../../common/scripts/signout';
this.signout = signout;
this.mixin('i');
</script>
</mk-settings>

View file

@ -0,0 +1,106 @@
<mk-profile-setting-page>
<mk-ui ref="ui">
<mk-profile-setting/>
</mk-ui>
<style>
:scope
display block
</style>
<script>
import ui from '../../../scripts/ui-event';
this.on('mount', () => {
document.title = 'Misskey | %i18n:mobile.tags.mk-profile-setting-page.title%';
ui.trigger('title', '<i class="fa fa-user"></i>%i18n:mobile.tags.mk-profile-setting-page.title%');
document.documentElement.style.background = '#eee';
});
</script>
</mk-profile-setting-page>
<mk-profile-setting>
<label>
<p>%i18n:mobile.tags.mk-profile-setting.name%</p>
<input ref="name" type="text" value={ I.name }/>
</label>
<label>
<p>%i18n:mobile.tags.mk-profile-setting.location%</p>
<input ref="location" type="text" value={ I.profile.location }/>
</label>
<label>
<p>%i18n:mobile.tags.mk-profile-setting.description%</p>
<textarea ref="description">{ I.description }</textarea>
</label>
<label>
<p>%i18n:mobile.tags.mk-profile-setting.birthday%</p>
<input ref="birthday" type="date" value={ I.profile.birthday }/>
</label>
<button class="save" onclick={ save } disabled={ saving }><i class="fa fa-check"></i>%i18n:mobile.tags.mk-profile-setting.save%</button>
<style>
:scope
display block
> label
display block
margin 0
padding 16px 0
> p:first-child
display block
margin 0
padding 0 0 4px 8px
font-weight bold
color #333
> input[type="text"]
> textarea
display block
width 100%
padding 12px
font-size 16px
border none
border-radius none
> textarea
min-height 80px
> .save
display block
margin 8px
padding 16px
width calc(100% - 16px)
font-size 16px
color $theme-color-foreground
background $theme-color
border-radius 4px
&:disabled
opacity 0.7
> i
margin-right 4px
</style>
<script>
this.mixin('i');
this.mixin('api');
this.save = () => {
this.update({
saving: true
});
this.api('i/update', {
name: this.refs.name.value,
location: this.refs.location.value || null,
description: this.refs.description.value || null,
birthday: this.refs.birthday.value || null
}).then(() => {
this.update({
saving: false
});
alert('%i18n:mobile.tags.mk-profile-setting.saved%');
});
};
</script>
</mk-profile-setting>