MirrorHub/atlas
0
0
Fork 0
mirror of https://github.com/placeAtlas/atlas.git synced 2025-01-01 02:24:40 +01:00
Code Issues Projects Releases Wiki Activity

Contextual period range minimum

Browse source
This commit is contained in:
mxdanger 2022-05-10 17:36:24 -07:00
parent c6cb99d8b7
commit 55ce2de545
2 changed files with 108 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

127
web/_js/draw.js
View file

@ -788,6 +788,8 @@ function initPeriodGroups() {
periodGroups.replaceChildren() periodGroups.replaceChildren()
pathWithPeriods.forEach(([period, path], index) => { pathWithPeriods.forEach(([period, path], index) => {
let periodCenter
// Set element variables // Set element variables
const periodGroupEl = periodGroupTemplate.cloneNode(true) const periodGroupEl = periodGroupTemplate.cloneNode(true)
periodGroupEl.id = "periodGroup" + index periodGroupEl.id = "periodGroup" + index
@ -860,7 +862,19 @@ function initPeriodGroups() {
// If one period disable delete // If one period disable delete
if (pathWithPeriods.length === 1) periodDeleteEl.disabled = true if (pathWithPeriods.length === 1) periodDeleteEl.disabled = true
startPeriodEl.addEventListener('input', e => startPeriodUpdate(e.target.value)) startPeriodEl.addEventListener('input', () => {
if (path.length >= 3) {
periodCenter = calculateCenter(path)
if ((periodCenter[1] > 1000) && (startPeriodEl.valueAsNumber <= variationsConfig[variation].expansions[1])) {
// Second expansion
startPeriodEl.value = variationsConfig[variation].expansions[1];
} else if ((periodCenter[0] > 1000) && (startPeriodEl.valueAsNumber <= variationsConfig[variation].expansions[0])) {
// First expansion
startPeriodEl.value = variationsConfig[variation].expansions[0];
}
}
startPeriodUpdate(startPeriodEl.value)
})
startPeriodLeftEl.addEventListener('click', () => { startPeriodLeftEl.addEventListener('click', () => {
startPeriodEl.value = parseInt(startPeriodEl.value) - 1 startPeriodEl.value = parseInt(startPeriodEl.value) - 1
startPeriodUpdate(startPeriodEl.value) startPeriodUpdate(startPeriodEl.value)
@ -873,17 +887,21 @@ function initPeriodGroups() {
updateTime(parseInt(startPeriodEl.value), variation) updateTime(parseInt(startPeriodEl.value), variation)
// Set zoom view // Set zoom view
let activeCenter = calculateCenter(pathWithPeriods[index][1]) periodCenter = calculateCenter(path)
zoomOrigin = [innerContainer.clientWidth / 2 - activeCenter[0] * zoom, innerContainer.clientHeight / 2 - activeCenter[1] * zoom] zoomOrigin = [innerContainer.clientWidth / 2 - periodCenter[0] * zoom, innerContainer.clientHeight / 2 - periodCenter[1] * zoom]
scaleZoomOrigin = [2000 / 2 - activeCenter[0], 2000 / 2 - activeCenter[1]] scaleZoomOrigin = [2000 / 2 - periodCenter[0], 2000 / 2 - periodCenter[1]]
applyView() applyView()
}) })
function startPeriodUpdate(value) { function startPeriodUpdate(value) {
endPeriodListEl.innerHTML = '<option value="' + (parseInt(value) + 1) + '"></option>' endPeriodListEl.innerHTML = '<option value="' + (parseInt(value) + 1) + '"></option>'
timelineSlider.value = parseInt(value)
updateTime(parseInt(value), variation)
// Update time only when value changes
if (startPeriodEl.value != timelineSlider.value) {
timelineSlider.value = value
updateTime(parseInt(value), variation)
}
// Set start incremental button disabled states // Set start incremental button disabled states
if (startPeriodEl.value == startPeriodEl.min) { if (startPeriodEl.value == startPeriodEl.min) {
startPeriodLeftEl.disabled = true startPeriodLeftEl.disabled = true
@ -892,12 +910,38 @@ function initPeriodGroups() {
startPeriodLeftEl.disabled = false startPeriodLeftEl.disabled = false
startPeriodRightEl.disabled = true startPeriodRightEl.disabled = true
} else { } else {
startPeriodLeftEl.disabled = false if (path.length >= 3) {
startPeriodRightEl.disabled = false periodCenter = calculateCenter(path)
if ((periodCenter[1] > 1000) && (startPeriodEl.valueAsNumber <= variationsConfig[variation].expansions[1])) {
// Second expansion
startPeriodLeftEl.disabled = true
startPeriodRightEl.disabled = false
} else if ((periodCenter[0] > 1000) && (startPeriodEl.valueAsNumber <= variationsConfig[variation].expansions[0])) {
// First expansion
startPeriodLeftEl.disabled = true
startPeriodRightEl.disabled = false
} else {
// Starting area
startPeriodLeftEl.disabled = false
startPeriodRightEl.disabled = false
}
}
} }
} }
endPeriodEl.addEventListener('input', e => endPeriodUpdate(e.target.value)) endPeriodEl.addEventListener('input', () => {
if (path.length >= 3) {
periodCenter = calculateCenter(path)
if ((periodCenter[1] > 1000) && (endPeriodEl.valueAsNumber <= variationsConfig[variation].expansions[1])) {
// Second expansion
endPeriodEl.value = variationsConfig[variation].expansions[1];
} else if ((periodCenter[0] > 1000) && (endPeriodEl.valueAsNumber <= variationsConfig[variation].expansions[0])) {
// First expansion
endPeriodEl.value = variationsConfig[variation].expansions[0];
}
}
endPeriodUpdate(endPeriodEl.value)
})
endPeriodLeftEl.addEventListener('click', () => { endPeriodLeftEl.addEventListener('click', () => {
endPeriodEl.value = parseInt(endPeriodEl.value) - 1 endPeriodEl.value = parseInt(endPeriodEl.value) - 1
endPeriodUpdate(endPeriodEl.value) endPeriodUpdate(endPeriodEl.value)
@ -910,15 +954,19 @@ function initPeriodGroups() {
updateTime(parseInt(endPeriodEl.value), variation) updateTime(parseInt(endPeriodEl.value), variation)
// Set zoom view // Set zoom view
let activeCenter = calculateCenter(pathWithPeriods[index][1]) periodCenter = calculateCenter(path)
zoomOrigin = [innerContainer.clientWidth / 2 - activeCenter[0] * zoom, innerContainer.clientHeight / 2 - activeCenter[1] * zoom] zoomOrigin = [innerContainer.clientWidth / 2 - periodCenter[0] * zoom, innerContainer.clientHeight / 2 - periodCenter[1] * zoom]
scaleZoomOrigin = [2000 / 2 - activeCenter[0], 2000 / 2 - activeCenter[1]] scaleZoomOrigin = [2000 / 2 - periodCenter[0], 2000 / 2 - periodCenter[1]]
applyView() applyView()
}) })
function endPeriodUpdate(value) { function endPeriodUpdate(value) {
startPeriodListEl.innerHTML = '<option value="' + (parseInt(value) + 1) + '"></option>' startPeriodListEl.innerHTML = '<option value="' + (parseInt(value) + 1) + '"></option>'
timelineSlider.value = parseInt(value)
updateTime(parseInt(value), variation) // Update time only when value changes
if (endPeriodEl.value != timelineSlider.value) {
timelineSlider.value = value
updateTime(parseInt(value), variation)
}
// Set end incremental button disabled states // Set end incremental button disabled states
if (endPeriodEl.value == endPeriodEl.min) { if (endPeriodEl.value == endPeriodEl.min) {
@ -928,8 +976,22 @@ function initPeriodGroups() {
endPeriodLeftEl.disabled = false endPeriodLeftEl.disabled = false
endPeriodRightEl.disabled = true endPeriodRightEl.disabled = true
} else { } else {
endPeriodLeftEl.disabled = false if (path.length >= 3) {
endPeriodRightEl.disabled = false periodCenter = calculateCenter(path)
if (periodCenter && (periodCenter[1] > 1000) && (endPeriodEl.valueAsNumber <= variationsConfig[variation].expansions[1])) {
// Second expansion
endPeriodLeftEl.disabled = true
endPeriodRightEl.disabled = false
} else if (periodCenter && (periodCenter[0] > 1000) && (endPeriodEl.valueAsNumber <= variationsConfig[variation].expansions[0])) {
// First expansion
endPeriodLeftEl.disabled = true
endPeriodRightEl.disabled = false
} else {
// Starting area
endPeriodLeftEl.disabled = false
endPeriodRightEl.disabled = false
}
}
} }
} }
@ -1034,6 +1096,9 @@ function updatePeriodGroups() {
if (periodGroupEl.dataset.active === "true") lastActivePathIndex = index if (periodGroupEl.dataset.active === "true") lastActivePathIndex = index
periodGroupEl.dataset.active = "" periodGroupEl.dataset.active = ""
let periodCenter
if (pathWithPeriods[index][1].length >= 3) periodCenter = calculateCenter(pathWithPeriods[index][1])
if (isOnPeriod( if (isOnPeriod(
parseInt(startPeriodEl.value), parseInt(startPeriodEl.value),
parseInt(endPeriodEl.value), parseInt(endPeriodEl.value),
@ -1096,8 +1161,19 @@ function updatePeriodGroups() {
startPeriodLeftEl.disabled = false startPeriodLeftEl.disabled = false
startPeriodRightEl.disabled = true startPeriodRightEl.disabled = true
} else { } else {
startPeriodLeftEl.disabled = false if (periodCenter && (periodCenter[1] > 1000) && (startPeriodEl.valueAsNumber <= variationsConfig[periodVariationEl.value].expansions[1])) {
startPeriodRightEl.disabled = false // Second expansion
startPeriodLeftEl.disabled = true
startPeriodRightEl.disabled = false
} else if (periodCenter && (periodCenter[0] > 1000) && (startPeriodEl.valueAsNumber <= variationsConfig[periodVariationEl.value].expansions[0])) {
// First expansion
startPeriodLeftEl.disabled = true
startPeriodRightEl.disabled = false
} else {
// Starting area
startPeriodLeftEl.disabled = false
startPeriodRightEl.disabled = false
}
} }
// Set end incremental button disabled states // Set end incremental button disabled states
@ -1108,8 +1184,19 @@ function updatePeriodGroups() {
endPeriodLeftEl.disabled = false endPeriodLeftEl.disabled = false
endPeriodRightEl.disabled = true endPeriodRightEl.disabled = true
} else { } else {
endPeriodLeftEl.disabled = false if (periodCenter && (periodCenter[1] > 1000) && (endPeriodEl.valueAsNumber <= variationsConfig[periodVariationEl.value].expansions[1])) {
endPeriodRightEl.disabled = false // Second expansion
endPeriodLeftEl.disabled = true
endPeriodRightEl.disabled = false
} else if (periodCenter && (periodCenter[0] > 1000) && (endPeriodEl.valueAsNumber <= variationsConfig[periodVariationEl.value].expansions[0])) {
// First expansion
endPeriodLeftEl.disabled = true
endPeriodRightEl.disabled = false
} else {
// Starting area
endPeriodLeftEl.disabled = false
endPeriodRightEl.disabled = false
}
} }
} }
}) })

1
web/_js/time.js
View file

File diff suppressed because one or more lines are too long