@uimaxbai/am-lyrics 1.2.3 → 1.2.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/demo/index.html +2 -2
- package/dist/src/AmLyrics.d.ts.map +1 -1
- package/dist/src/am-lyrics.js +54 -63
- package/dist/src/am-lyrics.js.map +1 -1
- package/dist/src/react.js +54 -63
- package/dist/src/react.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/src/AmLyrics.ts +75 -67
package/demo/index.html
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AmLyrics.d.ts","sourceRoot":"","sources":["../../src/AmLyrics.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAO,MAAM,KAAK,CAAC;AAsHjD,qBAAa,QAAS,SAAQ,UAAU;IACtC,MAAM,CAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"AmLyrics.d.ts","sourceRoot":"","sources":["../../src/AmLyrics.ts"],"names":[],"mappings":"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"}
|
package/dist/src/am-lyrics.js
CHANGED
|
@@ -319,7 +319,7 @@ class GoogleService {
|
|
|
319
319
|
}
|
|
320
320
|
}
|
|
321
321
|
|
|
322
|
-
const VERSION = '1.2.
|
|
322
|
+
const VERSION = '1.2.5';
|
|
323
323
|
const INSTRUMENTAL_THRESHOLD_MS = 7000; // Show dots for gaps >= 7s
|
|
324
324
|
const FETCH_TIMEOUT_MS = 8000; // Timeout for all lyrics fetch requests
|
|
325
325
|
const SEEK_THRESHOLD_MS = 500;
|
|
@@ -1894,28 +1894,25 @@ class AmLyrics extends i {
|
|
|
1894
1894
|
!this.isUserScrolling &&
|
|
1895
1895
|
!this.isClickSeeking &&
|
|
1896
1896
|
this.lyrics) {
|
|
1897
|
-
|
|
1898
|
-
|
|
1899
|
-
|
|
1900
|
-
|
|
1901
|
-
|
|
1902
|
-
|
|
1903
|
-
|
|
1904
|
-
|
|
1905
|
-
|
|
1906
|
-
|
|
1907
|
-
|
|
1908
|
-
|
|
1909
|
-
|
|
1910
|
-
|
|
1911
|
-
this.clearPreActiveClasses(i);
|
|
1912
|
-
this.focusLine(nextLineEl);
|
|
1913
|
-
}
|
|
1914
|
-
break;
|
|
1897
|
+
let preActiveLineIndex = null;
|
|
1898
|
+
for (let i = 0; i < this.lyrics.length; i += 1) {
|
|
1899
|
+
const line = this.lyrics[i];
|
|
1900
|
+
const timeUntilStart = line.timestamp - newTime;
|
|
1901
|
+
const nextLineEl = this.lyricsContainer.querySelector(`#lyrics-line-${i}`);
|
|
1902
|
+
if (timeUntilStart > 0 && timeUntilStart <= PRE_SCROLL_LEAD_MS) {
|
|
1903
|
+
// Time to pre-scroll and pre-activate!
|
|
1904
|
+
if (nextLineEl) {
|
|
1905
|
+
// Apply unblur & zoom effect ahead of lyric start
|
|
1906
|
+
preActiveLineIndex = i;
|
|
1907
|
+
nextLineEl.classList.add('pre-active');
|
|
1908
|
+
this.clearPreActiveClasses(i);
|
|
1909
|
+
const slowScrollDuration = Math.max(SCROLL_ANIMATION_DURATION_MS, timeUntilStart);
|
|
1910
|
+
this.focusLine(nextLineEl, false, slowScrollDuration, !!currentGap);
|
|
1915
1911
|
}
|
|
1912
|
+
break;
|
|
1916
1913
|
}
|
|
1917
|
-
this.clearPreActiveClasses(preActiveLineIndex);
|
|
1918
1914
|
}
|
|
1915
|
+
this.clearPreActiveClasses(preActiveLineIndex);
|
|
1919
1916
|
}
|
|
1920
1917
|
}
|
|
1921
1918
|
}
|
|
@@ -2103,18 +2100,19 @@ class AmLyrics extends i {
|
|
|
2103
2100
|
}
|
|
2104
2101
|
return candidateIndex;
|
|
2105
2102
|
}
|
|
2106
|
-
focusLine(lineElement, forceScroll = false) {
|
|
2103
|
+
focusLine(lineElement, forceScroll = false, scrollDuration = undefined, skipScroll = false) {
|
|
2107
2104
|
const primaryChanged = lineElement !== this.currentPrimaryActiveLine;
|
|
2108
2105
|
if (primaryChanged) {
|
|
2109
2106
|
this.lastPrimaryActiveLine = this.currentPrimaryActiveLine;
|
|
2110
2107
|
this.currentPrimaryActiveLine = lineElement;
|
|
2111
2108
|
}
|
|
2112
2109
|
this.updatePositionClasses(lineElement);
|
|
2113
|
-
if (
|
|
2110
|
+
if (!skipScroll &&
|
|
2111
|
+
(forceScroll || primaryChanged) &&
|
|
2114
2112
|
this.autoScroll &&
|
|
2115
2113
|
!this.isUserScrolling &&
|
|
2116
2114
|
!this.isClickSeeking) {
|
|
2117
|
-
this.scrollToActiveLineYouLy(lineElement, forceScroll);
|
|
2115
|
+
this.scrollToActiveLineYouLy(lineElement, forceScroll, scrollDuration);
|
|
2118
2116
|
}
|
|
2119
2117
|
}
|
|
2120
2118
|
handleUserScroll() {
|
|
@@ -2487,7 +2485,7 @@ class AmLyrics extends i {
|
|
|
2487
2485
|
/**
|
|
2488
2486
|
* Animate scroll with staggered delay for smooth YouLyPlus-style scrolling
|
|
2489
2487
|
*/
|
|
2490
|
-
animateScrollYouLy(newTranslateY, forceScroll = false) {
|
|
2488
|
+
animateScrollYouLy(newTranslateY, forceScroll = false, scrollDuration = undefined) {
|
|
2491
2489
|
if (!this.lyricsContainer)
|
|
2492
2490
|
return;
|
|
2493
2491
|
const parent = this.lyricsContainer;
|
|
@@ -2568,11 +2566,12 @@ class AmLyrics extends i {
|
|
|
2568
2566
|
if (i >= referenceIndex)
|
|
2569
2567
|
delayCounter += 1;
|
|
2570
2568
|
const delay = i >= referenceIndex ? (delayCounter - 1) * delayIncrement : 0;
|
|
2569
|
+
const duration = scrollDuration ?? SCROLL_ANIMATION_DURATION_MS;
|
|
2571
2570
|
line.style.setProperty('--scroll-delta', `${delta}px`);
|
|
2572
2571
|
line.style.setProperty('--lyrics-line-delay', `${delay}ms`);
|
|
2573
|
-
line.style.setProperty('--scroll-duration', `${
|
|
2572
|
+
line.style.setProperty('--scroll-duration', `${duration}ms`);
|
|
2574
2573
|
newAnimatingLines.push(line);
|
|
2575
|
-
const lineDuration =
|
|
2574
|
+
const lineDuration = duration + delay;
|
|
2576
2575
|
if (lineDuration > maxAnimationDuration) {
|
|
2577
2576
|
maxAnimationDuration = lineDuration;
|
|
2578
2577
|
}
|
|
@@ -2587,13 +2586,13 @@ class AmLyrics extends i {
|
|
|
2587
2586
|
animatingLines.push(line);
|
|
2588
2587
|
}
|
|
2589
2588
|
animState.isAnimating = true;
|
|
2590
|
-
const BASE_DURATION = SCROLL_ANIMATION_DURATION_MS;
|
|
2589
|
+
const BASE_DURATION = scrollDuration ?? SCROLL_ANIMATION_DURATION_MS;
|
|
2591
2590
|
this.scrollUnlockTimeout = setTimeout(() => {
|
|
2592
2591
|
animState.isAnimating = false;
|
|
2593
2592
|
if (animState.pendingUpdate !== null) {
|
|
2594
2593
|
const pendingValue = animState.pendingUpdate;
|
|
2595
2594
|
animState.pendingUpdate = null;
|
|
2596
|
-
this.animateScrollYouLy(pendingValue, false);
|
|
2595
|
+
this.animateScrollYouLy(pendingValue, false, scrollDuration);
|
|
2597
2596
|
}
|
|
2598
2597
|
}, BASE_DURATION);
|
|
2599
2598
|
this.scrollAnimationTimeout = setTimeout(() => {
|
|
@@ -2654,7 +2653,7 @@ class AmLyrics extends i {
|
|
|
2654
2653
|
/**
|
|
2655
2654
|
* Scroll to active line with YouLyPlus-style animation
|
|
2656
2655
|
*/
|
|
2657
|
-
scrollToActiveLineYouLy(activeLine, forceScroll = false) {
|
|
2656
|
+
scrollToActiveLineYouLy(activeLine, forceScroll = false, scrollDuration = undefined) {
|
|
2658
2657
|
if (!activeLine || !this.lyricsContainer)
|
|
2659
2658
|
return;
|
|
2660
2659
|
const paddingTop = this.getScrollPaddingTop();
|
|
@@ -2682,10 +2681,11 @@ class AmLyrics extends i {
|
|
|
2682
2681
|
clearTimeout(this.userScrollTimeoutId);
|
|
2683
2682
|
this.userScrollTimeoutId = undefined;
|
|
2684
2683
|
}
|
|
2684
|
+
const duration = scrollDuration ?? SCROLL_ANIMATION_DURATION_MS;
|
|
2685
2685
|
setTimeout(() => {
|
|
2686
2686
|
this.isProgrammaticScroll = false;
|
|
2687
|
-
},
|
|
2688
|
-
this.animateScrollYouLy(targetTranslateY, forceScroll);
|
|
2687
|
+
}, duration + 160);
|
|
2688
|
+
this.animateScrollYouLy(targetTranslateY, forceScroll, scrollDuration);
|
|
2689
2689
|
}
|
|
2690
2690
|
/**
|
|
2691
2691
|
* Update syllable highlight animation - apply CSS wipe animation
|
|
@@ -3321,13 +3321,13 @@ class AmLyrics extends i {
|
|
|
3321
3321
|
}
|
|
3322
3322
|
else {
|
|
3323
3323
|
isGrowableVW =
|
|
3324
|
-
combinedDuration >=
|
|
3324
|
+
combinedDuration >= 850 && combinedDuration >= wordLen * 200;
|
|
3325
3325
|
}
|
|
3326
3326
|
}
|
|
3327
3327
|
// Glow requirement (more strict)
|
|
3328
3328
|
const isGlowingVW = isGrowableVW &&
|
|
3329
|
-
combinedDuration >=
|
|
3330
|
-
combinedDuration >= combinedText.length *
|
|
3329
|
+
combinedDuration >= 1000 &&
|
|
3330
|
+
combinedDuration >= combinedText.length * 250;
|
|
3331
3331
|
let charOff = 0;
|
|
3332
3332
|
for (let gi = vwStart; gi <= vwEnd; gi += 1) {
|
|
3333
3333
|
groupGrowable[gi] = isGrowableVW;
|
|
@@ -3897,14 +3897,16 @@ AmLyrics.styles = i$3 `
|
|
|
3897
3897
|
|
|
3898
3898
|
.background-vocal-container {
|
|
3899
3899
|
max-height: 0;
|
|
3900
|
-
padding-top: 0
|
|
3900
|
+
padding-top: 0;
|
|
3901
|
+
transform: translateY(-0.5em) scale(0.95);
|
|
3901
3902
|
overflow: visible;
|
|
3902
3903
|
opacity: 0;
|
|
3903
3904
|
font-size: var(--lyplus-font-size-subtext);
|
|
3904
3905
|
transition:
|
|
3905
|
-
max-height
|
|
3906
|
-
opacity
|
|
3907
|
-
|
|
3906
|
+
max-height 450ms cubic-bezier(0.33, 1, 0.68, 1),
|
|
3907
|
+
opacity 400ms ease-out,
|
|
3908
|
+
transform 450ms cubic-bezier(0.33, 1, 0.68, 1),
|
|
3909
|
+
padding 450ms cubic-bezier(0.33, 1, 0.68, 1);
|
|
3908
3910
|
margin: 0;
|
|
3909
3911
|
}
|
|
3910
3912
|
|
|
@@ -3912,11 +3914,14 @@ AmLyrics.styles = i$3 `
|
|
|
3912
3914
|
.lyrics-line.pre-active .background-vocal-container {
|
|
3913
3915
|
max-height: 4em;
|
|
3914
3916
|
opacity: 1;
|
|
3917
|
+
padding-top: 0.2em;
|
|
3918
|
+
transform: translateY(0) scale(1);
|
|
3915
3919
|
transition:
|
|
3916
|
-
max-height
|
|
3917
|
-
opacity
|
|
3918
|
-
|
|
3919
|
-
|
|
3920
|
+
max-height 450ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
3921
|
+
opacity 400ms ease-out,
|
|
3922
|
+
transform 450ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
3923
|
+
padding 450ms cubic-bezier(0.22, 1, 0.36, 1);
|
|
3924
|
+
will-change: max-height, opacity, padding, transform;
|
|
3920
3925
|
}
|
|
3921
3926
|
|
|
3922
3927
|
/* --- Line States & Modifiers --- */
|
|
@@ -4248,49 +4253,35 @@ AmLyrics.styles = i$3 `
|
|
|
4248
4253
|
INSTRUMENTAL GAP STYLES
|
|
4249
4254
|
========================================================================== */
|
|
4250
4255
|
.lyrics-gap {
|
|
4251
|
-
max-height:
|
|
4252
|
-
padding:
|
|
4253
|
-
overflow:
|
|
4256
|
+
max-height: 1.6em;
|
|
4257
|
+
padding: var(--lyplus-padding-gap);
|
|
4258
|
+
overflow: visible;
|
|
4254
4259
|
opacity: 0;
|
|
4255
4260
|
box-sizing: content-box;
|
|
4256
4261
|
background-clip: unset;
|
|
4257
4262
|
transform-origin: top;
|
|
4258
4263
|
transition:
|
|
4259
|
-
padding 220ms cubic-bezier(0.33, 1, 0.68, 1),
|
|
4260
|
-
max-height 220ms cubic-bezier(0.33, 1, 0.68, 1),
|
|
4261
4264
|
opacity 160ms ease-out,
|
|
4262
4265
|
transform var(--scroll-duration, 280ms) var(--lyrics-line-delay, 0ms);
|
|
4263
4266
|
}
|
|
4264
4267
|
|
|
4265
4268
|
.lyrics-gap.active {
|
|
4266
|
-
max-height: 1.6em;
|
|
4267
|
-
padding: var(--lyplus-padding-gap);
|
|
4268
4269
|
opacity: 1;
|
|
4269
|
-
overflow: visible;
|
|
4270
4270
|
transition:
|
|
4271
|
-
padding 220ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
4272
|
-
max-height 220ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
4273
4271
|
opacity 160ms ease-out,
|
|
4274
4272
|
transform var(--scroll-duration, 280ms);
|
|
4275
|
-
will-change:
|
|
4273
|
+
will-change: opacity;
|
|
4276
4274
|
}
|
|
4277
4275
|
|
|
4278
4276
|
/* Exiting state: quickly collapse width and height so dots don't distort page, or remove max-height transition */
|
|
4279
4277
|
.lyrics-gap.gap-exiting {
|
|
4280
|
-
|
|
4281
|
-
|
|
4282
|
-
opacity: 0;
|
|
4283
|
-
overflow: visible;
|
|
4284
|
-
transition:
|
|
4285
|
-
padding var(--gap-exit-duration, 360ms) cubic-bezier(0.33, 1, 0.68, 1),
|
|
4286
|
-
max-height var(--gap-exit-duration, 360ms)
|
|
4287
|
-
cubic-bezier(0.33, 1, 0.68, 1),
|
|
4288
|
-
opacity 160ms ease-out,
|
|
4289
|
-
transform var(--scroll-duration, 280ms);
|
|
4278
|
+
opacity: 1;
|
|
4279
|
+
transition: transform var(--scroll-duration, 280ms);
|
|
4290
4280
|
}
|
|
4291
4281
|
|
|
4292
4282
|
.lyrics-gap .main-vocal-container {
|
|
4293
4283
|
transform: translateY(-25%) scale(1) translateZ(0);
|
|
4284
|
+
transition: transform 400ms cubic-bezier(0.22, 1, 0.36, 1);
|
|
4294
4285
|
}
|
|
4295
4286
|
|
|
4296
4287
|
/* Jump animation plays during exit */
|