mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

Pass slider value to bubble text generators

Browse source
This commit is contained in:
Dmitry Lyzo 2023-08-24 00:48:47 +03:00
parent 9e8c7d788a
commit 111958e2a5
1 changed files with 15 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/elements/emby-slider/emby-slider.js
View file

@ -146,12 +146,12 @@ function updateValues(isValueSet) {
}); });
} }
function updateBubble(range, value, bubble) { function updateBubble(range, percent, value, bubble) {
requestAnimationFrame(function () { requestAnimationFrame(function () {
const bubbleTrackRect = range.sliderBubbleTrack.getBoundingClientRect(); const bubbleTrackRect = range.sliderBubbleTrack.getBoundingClientRect();
const bubbleRect = bubble.getBoundingClientRect(); const bubbleRect = bubble.getBoundingClientRect();
let bubblePos = bubbleTrackRect.width * value / 100; let bubblePos = bubbleTrackRect.width * percent / 100;
if (globalize.getIsElementRTL(range)) { if (globalize.getIsElementRTL(range)) {
bubblePos = bubbleTrackRect.width - bubblePos; bubblePos = bubbleTrackRect.width - bubblePos;
} }
@ -159,18 +159,20 @@ function updateBubble(range, value, bubble) {
bubble.style.left = bubblePos + 'px'; bubble.style.left = bubblePos + 'px';
let html;
if (range.getBubbleHtml) { if (range.getBubbleHtml) {
value = range.getBubbleHtml(value); html = range.getBubbleHtml(percent, value);
} else { } else {
if (range.getBubbleText) { if (range.getBubbleText) {
value = range.getBubbleText(value); html = range.getBubbleText(percent, value);
} else { } else {
value = mapFractionToValue(range, value / 100).toLocaleString(); html = value.toLocaleString();
} }
value = '<h1 class="sliderBubbleText">' + value + '</h1>'; html = '<h1 class="sliderBubbleText">' + html + '</h1>';
} }
bubble.innerHTML = value; bubble.innerHTML = html;
}); });
} }
@ -306,8 +308,8 @@ EmbySliderPrototype.attachedCallback = function () {
updateValues.call(this); updateValues.call(this);
} }
const bubbleValue = mapValueToFraction(this, this.value) * 100; const percent = mapValueToFraction(this, this.value) * 100;
updateBubble(this, bubbleValue, sliderBubble); updateBubble(this, percent, parseFloat(this.value), sliderBubble);
if (hasHideBubbleClass) { if (hasHideBubbleClass) {
sliderBubble.classList.remove('hide'); sliderBubble.classList.remove('hide');
@ -333,9 +335,11 @@ EmbySliderPrototype.attachedCallback = function () {
/* eslint-disable-next-line compat/compat */ /* eslint-disable-next-line compat/compat */
dom.addEventListener(this, (window.PointerEvent ? 'pointermove' : 'mousemove'), function (e) { dom.addEventListener(this, (window.PointerEvent ? 'pointermove' : 'mousemove'), function (e) {
if (!this.dragging) { if (!this.dragging) {
const bubbleValue = mapClientToFraction(this, e.clientX) * 100; const fraction = mapClientToFraction(this, e.clientX);
const percent = fraction * 100;
const value = mapFractionToValue(this, fraction);
updateBubble(this, bubbleValue, sliderBubble); updateBubble(this, percent, value, sliderBubble);
if (hasHideBubbleClass) { if (hasHideBubbleClass) {
sliderBubble.classList.remove('hide'); sliderBubble.classList.remove('hide');