Mastodon
/
Whalebird-desktop-client-mac-linux-windows
mirror of https://github.com/h3poteto/whalebird-desktop
1
0
Fork 0
Code Issues Releases Wiki Activity

refs #1766 Introduce vue-virtual-scroll in Local

This commit is contained in:
AkiraFukushima 2020-10-16 00:06:26 +09:00
parent 3fbd04bf6c
commit b673e4df95
2 changed files with 20 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/renderer/components/TimelineSpace/Contents/Home.vue
View File

@ -2,7 +2,7 @@
<div id="home" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey"> <div id="home" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey">
<div class="unread">{{ unread.length > 0 ? unread.length : '' }}</div> <div class="unread">{{ unread.length > 0 ? unread.length : '' }}</div>
<div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div> <div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div>
<DynamicScroller :items="filteredTimeline" :min-item-size="10" class="scroller" page-mode> <DynamicScroller :items="filteredTimeline" :min-item-size="60" class="scroller" page-mode>
<template v-slot="{ item, index, active }"> <template v-slot="{ item, index, active }">
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index"> <DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index">
<toot <toot

36
src/renderer/components/TimelineSpace/Contents/Local.vue
View File

@ -2,23 +2,25 @@
<div id="local" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey"> <div id="local" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey">
<div class="unread">{{ unread.length > 0 ? unread.length : '' }}</div> <div class="unread">{{ unread.length > 0 ? unread.length : '' }}</div>
<div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div> <div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div>
<transition-group name="timeline" tag="div"> <DynamicScroller :items="timeline" :min-item-size="60" class="scroller" page-mode>
<div class="local-timeline" v-for="message in timeline" :key="message.uri + message.id"> <template v-slot="{ item, index, active }">
<toot <DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index">
:message="message" <toot
:filter="filter" :message="item"
:focused="message.uri + message.id === focusedId" :filter="filter"
:overlaid="modalOpened" :focused="item.uri + item.id === focusedId"
v-on:update="updateToot" :overlaid="modalOpened"
v-on:delete="deleteToot" v-on:update="updateToot"
@focusNext="focusNext" v-on:delete="deleteToot"
@focusPrev="focusPrev" @focusNext="focusNext"
@focusRight="focusSidebar" @focusPrev="focusPrev"
@selectToot="focusToot(message)" @focusRight="focusSidebar"
> @selectToot="focusToot(item)"
</toot> >
</div> </toot>
</transition-group> </DynamicScrollerItem>
</template>
</DynamicScroller>
<div class="loading-card" v-loading="lazyLoading" :element-loading-background="backgroundColor"></div> <div class="loading-card" v-loading="lazyLoading" :element-loading-background="backgroundColor"></div>
<div :class="openSideBar ? 'upper-with-side-bar' : 'upper'" v-show="!heading"> <div :class="openSideBar ? 'upper-with-side-bar' : 'upper'" v-show="!heading">
<el-button type="primary" icon="el-icon-arrow-up" @click="upper" circle> </el-button> <el-button type="primary" icon="el-icon-arrow-up" @click="upper" circle> </el-button>