From 53422ffcb296be404c0f3ef7e175bedecca4fb4d Mon Sep 17 00:00:00 2001 From: syuilo Date: Fri, 15 Feb 2019 05:08:59 +0900 Subject: [PATCH] Improve desktop UX (#4262) * wip * wip * wip * wip * wip * wip * Merge * wip * wip * wip * wip * wip * wip --- locales/ja-JP.yml | 14 +- .../views/components/activity.vue | 25 +- .../app/common/views/components/dummy.vue | 11 + .../common/views/components/follow-button.vue | 11 +- .../app/common/views/components/index.ts | 2 + src/client/app/common/views/widgets/index.ts | 2 + .../app/common/views/widgets/instance.vue | 14 + src/client/app/desktop/script.ts | 37 +- .../app/desktop/views/components/home.vue | 396 ----------------- .../app/desktop/views/components/index.ts | 4 - .../app/desktop/views/components/settings.vue | 19 +- .../views/components/ui.header.account.vue | 7 - .../views/components/ui.header.nav.vue | 19 +- .../desktop/views/components/ui.sidebar.vue | 2 +- .../{pages => }/deck/deck.column-core.vue | 0 .../views/{pages => }/deck/deck.column.vue | 11 +- .../{pages => }/deck/deck.direct-column.vue | 2 +- .../views/{pages => }/deck/deck.direct.vue | 0 .../views/deck/deck.favorites-column.vue | 88 ++++ .../views/deck/deck.hashtag-column.vue | 119 ++++++ .../{pages => }/deck/deck.hashtag-tl.vue | 0 .../views/{pages => }/deck/deck.list-tl.vue | 0 .../{pages => }/deck/deck.mentions-column.vue | 2 +- .../views/{pages => }/deck/deck.mentions.vue | 0 .../{pages => }/deck/deck.note-column.vue | 33 +- .../views/{pages => }/deck/deck.notes.vue | 6 +- .../{pages => }/deck/deck.notification.vue | 4 +- .../deck/deck.notifications-column.vue | 2 +- .../{pages => }/deck/deck.notifications.vue | 2 +- .../views/{pages => }/deck/deck.tl-column.vue | 2 +- .../views/{pages => }/deck/deck.tl.vue | 0 .../{pages => }/deck/deck.user-column.vue | 244 +++++------ .../desktop/views/{pages => }/deck/deck.vue | 62 +-- .../{pages => }/deck/deck.widgets-column.vue | 2 +- .../views/{pages => home}/favorites.vue | 26 +- src/client/app/desktop/views/home/home.vue | 400 ++++++++++++++++++ .../desktop/views/{pages => home}/note.vue | 19 +- .../app/desktop/views/{pages => home}/tag.vue | 21 +- .../{components => home}/timeline.core.vue | 0 .../views/{components => home}/timeline.vue | 171 ++++---- .../user/user.followers-you-know.vue | 0 .../{pages => home}/user/user.friends.vue | 0 .../{pages => home}/user/user.header.vue | 19 + .../user/user.integrations.integration.vue | 0 .../user/user.integrations.vue | 0 .../{pages => home}/user/user.photos.vue | 2 +- .../{pages => home}/user/user.timeline.vue | 0 .../app/desktop/views/home/user/user.vue | 109 +++++ .../views/pages/deck/deck.hashtag-column.vue | 112 ----- .../desktop/views/pages/home-customize.vue | 3 - src/client/app/desktop/views/pages/home.vue | 39 -- src/client/app/desktop/views/pages/index.vue | 25 -- .../desktop/views/pages/user/user.profile.vue | 66 --- .../app/desktop/views/pages/user/user.vue | 155 ------- .../app/desktop/views/widgets/customize.vue | 21 + src/client/app/desktop/views/widgets/index.ts | 2 + src/client/app/init.ts | 9 +- .../app/mobile/views/pages/user/home.vue | 2 +- .../app/mobile/views/widgets/activity.vue | 2 +- src/client/app/store.ts | 9 +- 60 files changed, 1132 insertions(+), 1222 deletions(-) rename src/client/app/{mobile => common}/views/components/activity.vue (88%) create mode 100644 src/client/app/common/views/components/dummy.vue create mode 100644 src/client/app/common/views/widgets/instance.vue delete mode 100644 src/client/app/desktop/views/components/home.vue rename src/client/app/desktop/views/{pages => }/deck/deck.column-core.vue (100%) rename src/client/app/desktop/views/{pages => }/deck/deck.column.vue (97%) rename src/client/app/desktop/views/{pages => }/deck/deck.direct-column.vue (95%) rename src/client/app/desktop/views/{pages => }/deck/deck.direct.vue (100%) create mode 100644 src/client/app/desktop/views/deck/deck.favorites-column.vue create mode 100644 src/client/app/desktop/views/deck/deck.hashtag-column.vue rename src/client/app/desktop/views/{pages => }/deck/deck.hashtag-tl.vue (100%) rename src/client/app/desktop/views/{pages => }/deck/deck.list-tl.vue (100%) rename src/client/app/desktop/views/{pages => }/deck/deck.mentions-column.vue (95%) rename src/client/app/desktop/views/{pages => }/deck/deck.mentions.vue (100%) rename src/client/app/desktop/views/{pages => }/deck/deck.note-column.vue (77%) rename src/client/app/desktop/views/{pages => }/deck/deck.notes.vue (97%) rename src/client/app/desktop/views/{pages => }/deck/deck.notification.vue (97%) rename src/client/app/desktop/views/{pages => }/deck/deck.notifications-column.vue (94%) rename src/client/app/desktop/views/{pages => }/deck/deck.notifications.vue (99%) rename src/client/app/desktop/views/{pages => }/deck/deck.tl-column.vue (98%) rename src/client/app/desktop/views/{pages => }/deck/deck.tl.vue (100%) rename src/client/app/desktop/views/{pages => }/deck/deck.user-column.vue (78%) rename src/client/app/desktop/views/{pages => }/deck/deck.vue (83%) rename src/client/app/desktop/views/{pages => }/deck/deck.widgets-column.vue (99%) rename src/client/app/desktop/views/{pages => home}/favorites.vue (74%) create mode 100644 src/client/app/desktop/views/home/home.vue rename src/client/app/desktop/views/{pages => home}/note.vue (70%) rename src/client/app/desktop/views/{pages => home}/tag.vue (90%) rename src/client/app/desktop/views/{components => home}/timeline.core.vue (100%) rename src/client/app/desktop/views/{components => home}/timeline.vue (50%) rename src/client/app/desktop/views/{pages => home}/user/user.followers-you-know.vue (100%) rename src/client/app/desktop/views/{pages => home}/user/user.friends.vue (100%) rename src/client/app/desktop/views/{pages => home}/user/user.header.vue (91%) rename src/client/app/desktop/views/{pages => home}/user/user.integrations.integration.vue (100%) rename src/client/app/desktop/views/{pages => home}/user/user.integrations.vue (100%) rename src/client/app/desktop/views/{pages => home}/user/user.photos.vue (99%) rename src/client/app/desktop/views/{pages => home}/user/user.timeline.vue (100%) create mode 100644 src/client/app/desktop/views/home/user/user.vue delete mode 100644 src/client/app/desktop/views/pages/deck/deck.hashtag-column.vue delete mode 100644 src/client/app/desktop/views/pages/home-customize.vue delete mode 100644 src/client/app/desktop/views/pages/home.vue delete mode 100644 src/client/app/desktop/views/pages/index.vue delete mode 100644 src/client/app/desktop/views/pages/user/user.profile.vue delete mode 100644 src/client/app/desktop/views/pages/user/user.vue create mode 100644 src/client/app/desktop/views/widgets/customize.vue diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 27542dd96..7df81de90 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -28,6 +28,7 @@ common: load-more: "もっと読み込む" enter-password: "パスワードを入力してください" 2fa: "二段階認証" + customize-home: "ホームをカスタマイズ" got-it: "わかった" customization-tips: @@ -893,14 +894,10 @@ desktop/views/components/settings.vue: web-search-engine-desc: "例: https://www.google.com/?#q={{query}}" auto-popout: "ウィンドウの自動ポップアウト" auto-popout-desc: "ウィンドウが開かれるとき、ポップアウト(ブラウザ外に切り離す)可能なら自動でポップアウトします。この設定はブラウザに記憶されます。" - deck-nav: "デッキ内ナビゲーション" - deck-nav-desc: "デッキを使用しているとき、ナビゲーションが発生する際にページ遷移を行わずに一時的なカラムで受けるようにします。" keep-cw: "CW保持" keep-cw-desc: "投稿にリプライする際、リプライ元の投稿にCWが設定されていたとき、デフォルトで同じCWを設定するようにします。" - deck-default: "デッキをデフォルトのUIにする" display: "デザインと表示" - customize: "ホームをカスタマイズ" wallpaper: "壁紙" choose-wallpaper: "壁紙を選択" delete-wallpaper: "壁紙を削除" @@ -1076,7 +1073,6 @@ desktop/views/components/ui.header.account.vue: favorites: "お気に入り" lists: "リスト" follow-requests: "フォロー申請" - customize: "ホームのカスタマイズ" admin: "管理" settings: "設定" signout: "サインアウト" @@ -1447,9 +1443,6 @@ desktop/views/pages/welcome.vue: desktop/views/pages/drive.vue: title: "Misskey Drive" -desktop/views/pages/home-customize.vue: - title: "ホームのカスタマイズ" - desktop/views/pages/note.vue: prev: "前の投稿" next: "次の投稿" @@ -1490,10 +1483,6 @@ desktop/views/pages/user/user.photos.vue: loading: "読み込み中" no-photos: "写真はありません" -desktop/views/pages/user/user.profile.vue: - follows-you: "フォローされています" - menu: "メニュー" - desktop/views/pages/user/user.header.vue: posts: "投稿" following: "フォロー" @@ -1503,6 +1492,7 @@ desktop/views/pages/user/user.header.vue: year: "年" month: "月" day: "日" + follows-you: "フォローされています" desktop/views/pages/user/user.timeline.vue: default: "投稿" diff --git a/src/client/app/mobile/views/components/activity.vue b/src/client/app/common/views/components/activity.vue similarity index 88% rename from src/client/app/mobile/views/components/activity.vue rename to src/client/app/common/views/components/activity.vue index f06dddfc4..1e9f87cf0 100644 --- a/src/client/app/mobile/views/components/activity.vue +++ b/src/client/app/common/views/components/activity.vue @@ -1,5 +1,5 @@ @@ -9,7 +9,17 @@ import Vue from 'vue'; import ApexCharts from 'apexcharts'; export default Vue.extend({ - props: ['user'], + props: { + user: { + type: Object, + required: true + }, + limit: { + type: Number, + required: false, + default: 21 + } + }, data() { return { fetching: true, @@ -21,7 +31,7 @@ export default Vue.extend({ this.$root.api('charts/user/notes', { userId: this.user.id, span: 'day', - limit: 21 + limit: this.limit }).then(stats => { const normal = []; const reply = []; @@ -32,7 +42,7 @@ export default Vue.extend({ const m = now.getMonth(); const d = now.getDate(); - for (let i = 0; i < 21; i++) { + for (let i = 0; i < this.limit; i++) { const x = new Date(y, m, d - i); normal.push([ x, @@ -99,10 +109,3 @@ export default Vue.extend({ } }); - - diff --git a/src/client/app/common/views/components/dummy.vue b/src/client/app/common/views/components/dummy.vue new file mode 100644 index 000000000..5634efc50 --- /dev/null +++ b/src/client/app/common/views/components/dummy.vue @@ -0,0 +1,11 @@ + + + diff --git a/src/client/app/common/views/components/follow-button.vue b/src/client/app/common/views/components/follow-button.vue index 6d120f52b..71d3a63e4 100644 --- a/src/client/app/common/views/components/follow-button.vue +++ b/src/client/app/common/views/components/follow-button.vue @@ -1,8 +1,9 @@