Make page curl lift across full width
Replace localized spine curl with whole-page arc so the free edge rises highest, and float the topic label with the selected card.
This commit is contained in:
@@ -5,6 +5,9 @@ import { makeTextSprite } from '../utils/labels.js';
|
||||
|
||||
export const TIMELINE_SPREAD = 6.2; // 横轴范围 ±6.2(超出视口,可横向滚动)
|
||||
|
||||
const CARD_FLOAT = 0.14; // 选中时上浮高度
|
||||
const NAME_Y = 0.42; // 主题标签基准高度(活页上方)
|
||||
|
||||
function cardX(i, n) {
|
||||
return (i / (n - 1)) * 2 * TIMELINE_SPREAD - TIMELINE_SPREAD;
|
||||
}
|
||||
@@ -69,18 +72,18 @@ export class Timeline {
|
||||
outline.visible = false;
|
||||
card.add(outline);
|
||||
|
||||
// 活页上方:主题(常显)
|
||||
// 活页上方:主题(常显,随选中上浮)
|
||||
const name = makeTextSprite(entry.name, { fontSize: 30, color: '#e8d9b4' });
|
||||
name.scale.multiplyScalar(0.22);
|
||||
name.position.set(x, 0.42, 0);
|
||||
name.position.set(x, NAME_Y, 0);
|
||||
|
||||
// 轴下方:时间(常显)
|
||||
// 轴下方:时间(常显,固定不动)
|
||||
const time = makeTextSprite(entry.time, { fontSize: 22, color: '#c9a227' });
|
||||
time.scale.multiplyScalar(0.18);
|
||||
time.position.set(x, -1.06, 0);
|
||||
|
||||
this.group.add(card, name, time);
|
||||
this.cards.push({ card, outline, index: i });
|
||||
this.cards.push({ card, outline, name, nameBaseY: NAME_Y, index: i });
|
||||
});
|
||||
}
|
||||
|
||||
@@ -89,7 +92,8 @@ export class Timeline {
|
||||
this.cards.forEach((c) => {
|
||||
const on = c.index === index;
|
||||
c.outline.visible = on;
|
||||
c.card.position.y = on ? 0.14 : 0;
|
||||
c.card.position.y = on ? CARD_FLOAT : 0;
|
||||
c.name.position.y = c.nameBaseY + (on ? CARD_FLOAT : 0);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user