forked from cybrespace/pinafore
57 lines
1.7 KiB
HTML
57 lines
1.7 KiB
HTML
|
<div class="status-article-compose-box">
|
||
|
<ComposeBox realm="{{originalStatusId}}"
|
||
|
size="slim"
|
||
|
autoFocus="true"
|
||
|
hideBottomBorder="true"
|
||
|
on:postedStatus="onPostedStatus()"
|
||
|
/>
|
||
|
</div>
|
||
|
<style>
|
||
|
.status-article-compose-box {
|
||
|
grid-area: compose;
|
||
|
}
|
||
|
</style>
|
||
|
<script>
|
||
|
import ComposeBox from '../../_components/compose/ComposeBox.html'
|
||
|
import { store } from '../../_store/store'
|
||
|
import { doubleRAF } from '../../_utils/doubleRAF'
|
||
|
|
||
|
export default {
|
||
|
oncreate() {
|
||
|
let lastContentWarningShown = false
|
||
|
this.observe('composeData', composeData => {
|
||
|
doubleRAF(() => {
|
||
|
this.fire('recalculateHeight')
|
||
|
let contentWarningShown = !!composeData.contentWarningShown
|
||
|
if (contentWarningShown !== lastContentWarningShown) {
|
||
|
// TODO: this animation lasts 333ms, hence need to recalculate again
|
||
|
setTimeout(() => {
|
||
|
requestAnimationFrame(() => {
|
||
|
this.fire('recalculateHeight')
|
||
|
})
|
||
|
}, 350)
|
||
|
}
|
||
|
lastContentWarningShown = contentWarningShown
|
||
|
})
|
||
|
}, {init: false})
|
||
|
},
|
||
|
components: {
|
||
|
ComposeBox
|
||
|
},
|
||
|
store: () => store,
|
||
|
computed: {
|
||
|
composeData: ($currentComposeData, originalStatusId) => $currentComposeData[originalStatusId] || {},
|
||
|
},
|
||
|
methods: {
|
||
|
onPostedStatus() {
|
||
|
requestAnimationFrame(() => {
|
||
|
let uuid = this.get('uuid')
|
||
|
let $repliesShown = this.store.get('repliesShown')
|
||
|
$repliesShown[uuid] = false
|
||
|
this.store.set({'repliesShown': $repliesShown})
|
||
|
this.fire('recalculateHeight')
|
||
|
})
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
</script>
|