diff --git a/src/api/endpoints.ts b/src/api/endpoints.ts
index e846381578..ff214c3004 100644
--- a/src/api/endpoints.ts
+++ b/src/api/endpoints.ts
@@ -194,6 +194,11 @@ const endpoints: Endpoint[] = [
withCredential: true,
secure: true
},
+ {
+ name: 'i/update_client_setting',
+ withCredential: true,
+ secure: true
+ },
{
name: 'i/pin',
kind: 'account-write'
diff --git a/src/api/endpoints/i/update.ts b/src/api/endpoints/i/update.ts
index 7bbbf95900..43c5245044 100644
--- a/src/api/endpoints/i/update.ts
+++ b/src/api/endpoints/i/update.ts
@@ -46,19 +46,13 @@ module.exports = async (params, user, _, isSecure) => new Promise(async (res, re
if (bannerIdErr) return rej('invalid banner_id param');
if (bannerId) user.banner_id = bannerId;
- // Get 'show_donation' parameter
- const [showDonation, showDonationErr] = $(params.show_donation).optional.boolean().$;
- if (showDonationErr) return rej('invalid show_donation param');
- if (showDonation) user.client_settings.show_donation = showDonation;
-
await User.update(user._id, {
$set: {
name: user.name,
description: user.description,
avatar_id: user.avatar_id,
banner_id: user.banner_id,
- profile: user.profile,
- 'client_settings.show_donation': user.client_settings.show_donation
+ profile: user.profile
}
});
diff --git a/src/api/endpoints/i/update_client_setting.ts b/src/api/endpoints/i/update_client_setting.ts
new file mode 100644
index 0000000000..b817ff354c
--- /dev/null
+++ b/src/api/endpoints/i/update_client_setting.ts
@@ -0,0 +1,43 @@
+/**
+ * Module dependencies
+ */
+import $ from 'cafy';
+import User, { pack } from '../../models/user';
+import event from '../../event';
+
+/**
+ * Update myself
+ *
+ * @param {any} params
+ * @param {any} user
+ * @return {Promise<any>}
+ */
+module.exports = async (params, user) => new Promise(async (res, rej) => {
+ // Get 'name' parameter
+ const [name, nameErr] = $(params.name).string().$;
+ if (nameErr) return rej('invalid name param');
+
+ // Get 'value' parameter
+ const [value, valueErr] = $(params.value).nullable.any().$;
+ if (valueErr) return rej('invalid value param');
+
+ const x = {};
+ x[`client_settings.${name}`] = value;
+
+ await User.update(user._id, {
+ $set: x
+ });
+
+ // Serialize
+ user.client_settings[name] = value;
+ const iObj = await pack(user, user, {
+ detail: true,
+ includeSecrets: true
+ });
+
+ // Send response
+ res(iObj);
+
+ // Publish i updated event
+ event(user._id, 'i_updated', iObj);
+});
diff --git a/src/web/app/common/views/components/post-html.ts b/src/web/app/common/views/components/post-html.ts
index afd95f8e38..16d670e851 100644
--- a/src/web/app/common/views/components/post-html.ts
+++ b/src/web/app/common/views/components/post-html.ts
@@ -33,7 +33,11 @@ export default Vue.component('mk-post-html', {
.replace(/(\r\n|\n|\r)/g, '\n');
if ((this as any).shouldBreak) {
- return text.split('\n').map(t => [createElement('span', t), createElement('br')]);
+ if (text.indexOf('\n') != -1) {
+ return text.split('\n').map(t => [createElement('span', t), createElement('br')]);
+ } else {
+ return createElement('span', text);
+ }
} else {
return createElement('span', text.replace(/\n/g, ' '));
}
diff --git a/src/web/app/desktop/views/components/home.vue b/src/web/app/desktop/views/components/home.vue
index eabcc485dd..8a61c378ed 100644
--- a/src/web/app/desktop/views/components/home.vue
+++ b/src/web/app/desktop/views/components/home.vue
@@ -1,7 +1,7 @@
<template>
<div class="mk-home" :data-customize="customize">
<div class="customize" v-if="customize">
- <a href="/">%fa:check%完了</a>
+ <router-link to="/">%fa:check%完了</router-link>
<div>
<div class="adder">
<p>ウィジェットを追加:</p>
@@ -51,7 +51,11 @@
</div>
</x-draggable>
<div class="main">
- <mk-timeline ref="tl" @loaded="onTlLoaded"/>
+ <a @click="hint">カスタマイズのヒント</a>
+ <div>
+ <mk-post-form v-if="os.i.client_settings.showPostFormOnTopOfTl"/>
+ <mk-timeline ref="tl" @loaded="onTlLoaded"/>
+ </div>
</div>
</template>
<template v-else>
@@ -59,6 +63,7 @@
<component v-for="widget in widgets[place]" :is="`mkw-${widget.name}`" :key="widget.id" :widget="widget" @chosen="warp"/>
</div>
<div class="main">
+ <mk-post-form v-if="os.i.client_settings.showPostFormOnTopOfTl"/>
<mk-timeline ref="tl" @loaded="onTlLoaded" v-if="mode == 'timeline'"/>
<mk-mentions @loaded="onTlLoaded" v-if="mode == 'mentions'"/>
</div>
@@ -126,23 +131,19 @@ export default Vue.extend({
deep: true
});
},
- mounted() {
- this.$nextTick(() => {
- if (this.customize) {
- (this as any).apis.dialog({
- title: '%fa:info-circle%カスタマイズのヒント',
- text: '<p>ホームのカスタマイズでは、ウィジェットを追加/削除したり、ドラッグ&ドロップして並べ替えたりすることができます。</p>' +
- '<p>一部のウィジェットは、<strong><strong>右</strong>クリック</strong>することで表示を変更することができます。</p>' +
- '<p>ウィジェットを削除するには、ヘッダーの<strong>「ゴミ箱」</strong>と書かれたエリアにウィジェットをドラッグ&ドロップします。</p>' +
- '<p>カスタマイズを終了するには、右上の「完了」をクリックします。</p>',
- actions: [{
- text: 'Got it!'
- }]
- });
- }
- });
- },
methods: {
+ hint() {
+ (this as any).apis.dialog({
+ title: '%fa:info-circle%カスタマイズのヒント',
+ text: '<p>ホームのカスタマイズでは、ウィジェットを追加/削除したり、ドラッグ&ドロップして並べ替えたりすることができます。</p>' +
+ '<p>一部のウィジェットは、<strong><strong>右</strong>クリック</strong>することで表示を変更することができます。</p>' +
+ '<p>ウィジェットを削除するには、ヘッダーの<strong>「ゴミ箱」</strong>と書かれたエリアにウィジェットをドラッグ&ドロップします。</p>' +
+ '<p>カスタマイズを終了するには、右上の「完了」をクリックします。</p>',
+ actions: [{
+ text: 'Got it!'
+ }]
+ });
+ },
onTlLoaded() {
this.$emit('loaded');
},
@@ -193,10 +194,16 @@ export default Vue.extend({
background-image url('/assets/desktop/grid.svg')
> .main > .main
- cursor not-allowed !important
+ > a
+ display block
+ margin-bottom 8px
+ text-align center
- > *
- pointer-events none
+ > div
+ cursor not-allowed !important
+
+ > *
+ pointer-events none
&:not([data-customize])
> .main > *:empty
@@ -287,6 +294,11 @@ export default Vue.extend({
width calc(100% - 275px * 2)
order 2
+ .mk-post-form
+ margin-bottom 16px
+ border solid 1px #e5e5e5
+ border-radius 4px
+
> *:not(.main)
width 275px
padding 16px 0 16px 0
diff --git a/src/web/app/desktop/views/components/settings-window.vue b/src/web/app/desktop/views/components/settings-window.vue
index c4e1d6a0af..d5be177dcc 100644
--- a/src/web/app/desktop/views/components/settings-window.vue
+++ b/src/web/app/desktop/views/components/settings-window.vue
@@ -1,13 +1,19 @@
<template>
-<mk-window is-modal width='700px' height='550px' @closed="$destroy">
+<mk-window ref="window" is-modal width="700px" height="550px" @closed="$destroy">
<span slot="header" :class="$style.header">%fa:cog%設定</span>
- <mk-settings/>
+ <mk-settings @done="close"/>
</mk-window>
</template>
<script lang="ts">
import Vue from 'vue';
-export default Vue.extend({});
+export default Vue.extend({
+ methods: {
+ close() {
+ (this as any).$refs.window.close();
+ }
+ }
+});
</script>
<style lang="stylus" module>
diff --git a/src/web/app/desktop/views/components/settings.vue b/src/web/app/desktop/views/components/settings.vue
index 767ec3f962..c210997c38 100644
--- a/src/web/app/desktop/views/components/settings.vue
+++ b/src/web/app/desktop/views/components/settings.vue
@@ -20,7 +20,13 @@
<section class="web" v-show="page == 'web'">
<h1>デザイン</h1>
- <a href="/i/customize-home" class="ui button">ホームをカスタマイズ</a>
+ <div>
+ <button class="ui button" @click="customizeHome">ホームをカスタマイズ</button>
+ </div>
+ <label>
+ <input type="checkbox" v-model="showPostFormOnTopOfTl" @change="onChangeShowPostFormOnTopOfTl">
+ <span>タイムライン上部に投稿フォームを表示する</span>
+ </label>
</section>
<section class="drive" v-show="page == 'drive'">
@@ -89,8 +95,25 @@ export default Vue.extend({
},
data() {
return {
- page: 'profile'
+ page: 'profile',
+
+ showPostFormOnTopOfTl: false
};
+ },
+ created() {
+ this.showPostFormOnTopOfTl = (this as any).os.i.client_settings.showPostFormOnTopOfTl;
+ },
+ methods: {
+ customizeHome() {
+ this.$router.push('/i/customize-home');
+ this.$emit('done');
+ },
+ onChangeShowPostFormOnTopOfTl() {
+ (this as any).api('i/update_client_setting', {
+ name: 'showPostFormOnTopOfTl',
+ value: this.showPostFormOnTopOfTl
+ });
+ }
}
});
</script>
@@ -146,4 +169,10 @@ export default Vue.extend({
color #555
border-bottom solid 1px #eee
+ > .web
+ > div
+ border-bottom solid 1px #eee
+ padding 0 0 16px 0
+ margin 0 0 16px 0
+
</style>