Only do final for TFC, hide sliders when only one version is on the variation

This commit is contained in:
Hans5958 2022-04-23 20:49:22 +07:00
parent 3069717da9
commit 7196e47b0e
6 changed files with 19 additions and 21 deletions

View file

@ -57,7 +57,7 @@ def per_line_entries(entries: list):
else:
time_range = INIT_CANVAS_RANGE
time_key = '%d-%d, T:0-2' % time_range
time_key = '%d-%d, T:0' % time_range
new_entry = {
**new_entry,

View file

@ -866,6 +866,7 @@ #zoomControls {
width: 90px;
display: flex;
align-self: flex-end;
margin-right: auto;
}
#zoomControls button {
@ -1382,4 +1383,11 @@ #variantControls {
#variantControls select {
height: 30px !important;
}
}
#timeControls.no-time-slider,
.period-group.no-time-slider input,
.period-group.no-time-slider label {
display: none;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 913 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 912 KiB

View file

@ -522,6 +522,8 @@ function initPeriodGroups() {
endPeriodEl.max = variationsConfig[variation].versions.length - 1
startPeriodEl.value = start
endPeriodEl.value = end
if (startPeriodEl.max == 0) periodGroupEl.classList.add('no-time-slider')
else periodGroupEl.classList.remove('no-time-slider')
startPeriodEl.addEventListener('input', event => {
timelineSlider.value = parseInt(event.target.value)
@ -547,6 +549,8 @@ function initPeriodGroups() {
startPeriodEl.max = newVariationConfig.versions.length - 1
endPeriodEl.value = newVariationConfig.default
endPeriodEl.max = newVariationConfig.versions.length - 1
if (startPeriodEl.max == 0) periodGroupEl.classList.add('no-time-slider')
else periodGroupEl.classList.remove('no-time-slider')
updateTime(newVariationConfig.default, newVariation)
})

View file

@ -23,16 +23,8 @@ const variationsConfig = {
tfc: {
name: "The Final Clean",
code: "T",
default: 2,
default: 0,
versions: [
{
timestamp: "Draft 1",
url: "./_img/canvas/tfc/draft1.png",
},
{
timestamp: "Draft 2",
url: "./_img/canvas/tfc/draft2.png",
},
{
timestamp: "Final",
url: "./_img/canvas/tfc/final.png",
@ -88,16 +80,6 @@ variantsEl.addEventListener("input", (event) => {
updateTime(currentPeriod, event.target.value)
})
// document.querySelector('#period-group .period-start').oninput = (event) => {
// slider.value = parseInt(event.target.value)
// updateTime(parseInt(event.target.value))
// };
// document.querySelector('#period-group .period-end').oninput = (event) => {
// slider.value = parseInt(event.target.value)
// updateTime(parseInt(event.target.value))
// };
const dispatchTimeUpdateEvent = (period = timelineSlider.value, atlas = atlas) => {
const timeUpdateEvent = new CustomEvent('timeupdate', {
detail: {
@ -120,6 +102,9 @@ async function updateBackground(newPeriod = currentPeriod, newVariation = curren
timelineSlider.max = variationConfig.versions.length - 1;
currentPeriod = variationConfig.default;
newPeriod = currentPeriod
if (variationConfig.versions.length === 1) timelineSlider.parentElement.classList.add('no-time-slider')
else timelineSlider.parentElement.classList.remove('no-time-slider')
}
timelineSlider.value = currentPeriod
variantsEl.value = currentVariation
@ -208,6 +193,7 @@ async function updateTime(newPeriod = currentPeriod, newVariation = currentVaria
center: centerChosen,
})
}
dispatchTimeUpdateEvent(newPeriod, atlas)
document.body.dataset.canvasLoading = false
}