Prevent deletion glitches
parent
208797dd11
commit
4ca809d7b2
|
@ -639,8 +639,9 @@ export default class Timeline extends Mixins(GlobalMixin, UserConfig) {
|
||||||
*
|
*
|
||||||
* @param dayId id of day
|
* @param dayId id of day
|
||||||
* @param data photos
|
* @param data photos
|
||||||
|
* @param isAnimating prevents glitches due to height changes
|
||||||
*/
|
*/
|
||||||
processDay(dayId: number, data: IPhoto[]) {
|
processDay(dayId: number, data: IPhoto[], isAnimating=false) {
|
||||||
const head = this.heads[dayId];
|
const head = this.heads[dayId];
|
||||||
const day = head.day;
|
const day = head.day;
|
||||||
this.loadedDays.add(dayId);
|
this.loadedDays.add(dayId);
|
||||||
|
@ -717,8 +718,8 @@ export default class Timeline extends Mixins(GlobalMixin, UserConfig) {
|
||||||
const jH = Math.round(jbox.height);
|
const jH = Math.round(jbox.height);
|
||||||
const delta = jH - row.size;
|
const delta = jH - row.size;
|
||||||
// If the difference is too small, it's not worth risking an adjustment
|
// If the difference is too small, it's not worth risking an adjustment
|
||||||
// especially on square layouts on mobile
|
// especially on square layouts on mobile. Also don't do this if animating.
|
||||||
if (Math.abs(delta) > 5) {
|
if (Math.abs(delta) > 5 && !isAnimating) {
|
||||||
rowSizeDelta += delta;
|
rowSizeDelta += delta;
|
||||||
row.size = jH;
|
row.size = jH;
|
||||||
}
|
}
|
||||||
|
@ -785,7 +786,8 @@ export default class Timeline extends Mixins(GlobalMixin, UserConfig) {
|
||||||
}
|
}
|
||||||
|
|
||||||
// Scroll to the same actual position if the added rows
|
// Scroll to the same actual position if the added rows
|
||||||
// were above the current scroll position
|
// were above the current scroll position, unless animating
|
||||||
|
if (!isAnimating) {
|
||||||
const recycler: any = this.$refs.recycler;
|
const recycler: any = this.$refs.recycler;
|
||||||
const midIndex = (recycler.$_startIndex + recycler.$_endIndex) / 2;
|
const midIndex = (recycler.$_startIndex + recycler.$_endIndex) / 2;
|
||||||
if (midIndex > headIdx) {
|
if (midIndex > headIdx) {
|
||||||
|
@ -793,6 +795,7 @@ export default class Timeline extends Mixins(GlobalMixin, UserConfig) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/** Add and get a new blank photos row */
|
/** Add and get a new blank photos row */
|
||||||
addRow(day: IDay): IRow {
|
addRow(day: IDay): IRow {
|
||||||
|
@ -878,7 +881,8 @@ export default class Timeline extends Mixins(GlobalMixin, UserConfig) {
|
||||||
|
|
||||||
// Reflow all touched days
|
// Reflow all touched days
|
||||||
for (const day of updatedDays) {
|
for (const day of updatedDays) {
|
||||||
this.processDay(day.dayid, day.detail.filter(p => !delPhotosSet.has(p)));
|
const newDetail = day.detail.filter(p => !delPhotosSet.has(p));
|
||||||
|
this.processDay(day.dayid, newDetail, true);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Enter from right all photos that exited left
|
// Enter from right all photos that exited left
|
||||||
|
@ -927,6 +931,7 @@ export default class Timeline extends Mixins(GlobalMixin, UserConfig) {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
transition: width 0.2s ease-in-out; // reflow justification
|
||||||
}
|
}
|
||||||
|
|
||||||
.head-row {
|
.head-row {
|
||||||
|
|
Loading…
Reference in New Issue