55 lines
1.5 KiB
HTML
55 lines
1.5 KiB
HTML
<!--
|
|
Same as TimelinePage.html, but needs to manage visibility of ComposeBox itself
|
|
without a div wrapper due to sticky-positioned compose button.
|
|
TODO: this is a bit hacky due to code duplication
|
|
-->
|
|
<div class="timeline-home-page" aria-busy={hideTimeline}>
|
|
{#if hidePage}
|
|
<LoadingPage />
|
|
{/if}
|
|
{#if $currentVerifyCredentials }
|
|
<ComposeBox realm="home" hidden={hidePage}/>
|
|
{/if}
|
|
<div class="timeline-home-anchor-container">
|
|
{#if !hidePage && hideTimeline}
|
|
<LoadingPage />
|
|
{/if}
|
|
<div class="timeline-home-reveal-container {hideTimeline ? 'hidden' : ''}">
|
|
<LazyTimeline timeline="home" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<style>
|
|
.timeline-home-page, .timeline-home-anchor-container {
|
|
position: relative;
|
|
}
|
|
.timeline-home-reveal-container {
|
|
transition: opacity 0.2s linear; /* main page reveal */
|
|
}
|
|
</style>
|
|
<script>
|
|
import LazyTimeline from './timeline/LazyTimeline.html'
|
|
import { store } from '../_store/store.js'
|
|
import LoadingPage from './LoadingPage.html'
|
|
import ComposeBox from './compose/ComposeBox.html'
|
|
|
|
export default {
|
|
oncreate () {
|
|
this.store.set({
|
|
timelineInitialized: false,
|
|
timelinePreinitialized: false
|
|
})
|
|
},
|
|
computed: {
|
|
hidePage: ({ $timelineInitialized, $timelinePreinitialized }) => !$timelineInitialized && !$timelinePreinitialized,
|
|
hideTimeline: ({ $timelineInitialized }) => !$timelineInitialized
|
|
},
|
|
store: () => store,
|
|
components: {
|
|
LazyTimeline,
|
|
LoadingPage,
|
|
ComposeBox
|
|
}
|
|
}
|
|
</script>
|