diff options
| -rw-r--r-- | locales/ja-JP.yml | 1 | ||||
| -rw-r--r-- | src/client/components/timeline.vue | 2 | ||||
| -rw-r--r-- | src/client/pages/index.home.vue | 27 | ||||
| -rw-r--r-- | src/client/scripts/paging.ts | 4 |
4 files changed, 32 insertions, 2 deletions
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index a03f928e99..117a8f997b 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -422,6 +422,7 @@ useObjectStorage: "オブジェクトストレージを使用" serverLogs: "サーバーログ" deleteAll: "全て削除" showFixedPostForm: "タイムライン上部に投稿フォームを表示する" +newNoteRecived: "新しいノートがあります" _ago: unknown: "謎" diff --git a/src/client/components/timeline.vue b/src/client/components/timeline.vue index 15d0dab99d..407aeb2161 100644 --- a/src/client/components/timeline.vue +++ b/src/client/components/timeline.vue @@ -1,5 +1,5 @@ <template> -<x-notes ref="tl" :pagination="pagination" @before="$emit('before')" @after="e => $emit('after', e)"/> +<x-notes ref="tl" :pagination="pagination" @before="$emit('before')" @after="e => $emit('after', e)" @queue="$emit('queue', $event)"/> </template> <script lang="ts"> diff --git a/src/client/pages/index.home.vue b/src/client/pages/index.home.vue index 136e40e55b..1005d4add2 100644 --- a/src/client/pages/index.home.vue +++ b/src/client/pages/index.home.vue @@ -14,10 +14,12 @@ </button> </portal> + <div class="new" v-if="queue > 0" :style="{ width: width + 'px' }"><button class="_buttonPrimary" @click="top()">{{ $t('newNoteRecived') }}</button></div> + <x-tutorial class="tutorial" v-if="$store.state.settings.tutorial != -1"/> <x-post-form class="post-form _panel" fixed v-if="$store.state.device.showFixedPostForm"/> - <x-timeline ref="tl" :key="src === 'list' ? `list:${list.id}` : src === 'antenna' ? `antenna:${antenna.id}` : src" :src="src" :list="list" :antenna="antenna" @before="before()" @after="after()"/> + <x-timeline ref="tl" :key="src === 'list' ? `list:${list.id}` : src === 'antenna' ? `antenna:${antenna.id}` : src" :src="src" :list="list" :antenna="antenna" @before="before()" @after="after()" @queue="queueUpdated"/> </div> </template> @@ -56,6 +58,8 @@ export default Vue.extend({ list: null, antenna: null, menuOpened: false, + queue: 0, + width: 0, faAngleDown, faAngleUp, faHome, faShareAlt, faGlobe, faComments, faListUl, faSatellite, faCircle }; }, @@ -103,6 +107,15 @@ export default Vue.extend({ Progress.done(); }, + queueUpdated(q) { + this.width = this.$el.offsetWidth; + this.queue = q; + }, + + top() { + window.scroll({ top: 0, behavior: 'instant' }); + }, + async choose(ev) { this.menuOpened = true; const [antennas, lists] = await Promise.all([ @@ -172,6 +185,18 @@ export default Vue.extend({ <style lang="scss" scoped> .mk-home { + > .new { + position: fixed; + z-index: 1000; + + > button { + display: block; + margin: 0 auto; + padding: 8px 12px; + border-radius: 32px; + } + } + > .tutorial { margin-bottom: var(--margin); } diff --git a/src/client/scripts/paging.ts b/src/client/scripts/paging.ts index 3406f233c2..d75c968b8f 100644 --- a/src/client/scripts/paging.ts +++ b/src/client/scripts/paging.ts @@ -31,6 +31,10 @@ export default (opts) => ({ watch: { pagination() { this.init(); + }, + + queue() { + this.$emit('queue', this.queue.length); } }, |