summaryrefslogtreecommitdiff
path: root/src/client/components
diff options
context:
space:
mode:
authorsyuilo <Syuilotan@yahoo.co.jp>2020-02-06 17:02:32 +0900
committersyuilo <Syuilotan@yahoo.co.jp>2020-02-06 17:02:32 +0900
commit6857153367231c893c81bf6c053dc4bee0d0a8d4 (patch)
treed35db06ac5617b047d66e9d2e782ab4f0f005cae /src/client/components
parentUpdate sequential-entrance.vue (diff)
downloadmisskey-6857153367231c893c81bf6c053dc4bee0d0a8d4.tar.gz
misskey-6857153367231c893c81bf6c053dc4bee0d0a8d4.tar.bz2
misskey-6857153367231c893c81bf6c053dc4bee0d0a8d4.zip
Fix bug
Diffstat (limited to 'src/client/components')
-rw-r--r--src/client/components/sequential-entrance.vue32
1 files changed, 11 insertions, 21 deletions
diff --git a/src/client/components/sequential-entrance.vue b/src/client/components/sequential-entrance.vue
index 786ff0c874..bf2c2f38f3 100644
--- a/src/client/components/sequential-entrance.vue
+++ b/src/client/components/sequential-entrance.vue
@@ -34,40 +34,30 @@ export default Vue.extend({
default: false
}
},
- data() {
- return {
- currentChildren: [] as Node[],
- index: 0
- };
- },
+ i: 0,
methods: {
- updateChildren() {
- this.currentChildren = this.$slots.default!.filter(n => n.elm != null).map(n => n.elm!);
- },
beforeEnter(el) {
el.style.opacity = 0;
el.style.transform = this.direction === 'down' ? 'translateY(-64px)' : 'translateY(64px)';
+ let index = this.$options.i;
+ const delay = this.delay * index;
+ el.style.transition = [getComputedStyle(el).transition, `transform 0.7s cubic-bezier(0.23, 1, 0.32, 1) ${delay}ms`, `opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) ${delay}ms`].filter(x => x != '').join(',');
+ this.$options.i++;
},
enter(el, done) {
- let index = this.index;
- // TODO
- //if (this.reversed) index = ...;
- //console.log(index);
- el.style.transition = [getComputedStyle(el).transition, 'transform 0.7s cubic-bezier(0.23, 1, 0.32, 1)', 'opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1)'].filter(x => x != '').join(',');
setTimeout(() => {
el.style.opacity = 1;
el.style.transform = 'translateY(0px)';
- setTimeout(() => {
+ el.addEventListener('transitionend', () => {
+ el.style.transition = '';
+ this.$options.i--;
done();
- this.index--;
- }, 700);
- }, this.delay * index)
- this.index++;
+ }, { once: true });
+ });
},
- leave(el, done) {
+ leave(el) {
el.style.opacity = 0;
el.style.transform = this.direction === 'down' ? 'translateY(64px)' : 'translateY(-64px)';
- setTimeout(done, 700);
},
focus() {
this.$slots.default[0].elm.focus();