mirror of
https://github.com/placeAtlas/atlas.git
synced 2024-12-25 19:04:09 +01:00
Add multiline timestamp tooltip
Backport from place-catalog
This commit is contained in:
parent
fa326a423d
commit
c91551c956
2 changed files with 11 additions and 4 deletions
|
@ -94,7 +94,7 @@ const variationsConfig = {
|
|||
{ "timestamp": 1648911600, "url": ["./_img/canvas/place30/049.png", "./_img/canvas/place30/051_049.png"] },
|
||||
{ "timestamp": 1648913400, "url": ["./_img/canvas/place30/049.png", "./_img/canvas/place30/052_049.png"] },
|
||||
{ "timestamp": 1648915200, "url": ["./_img/canvas/place30/049.png", "./_img/canvas/place30/053_049.png"] },
|
||||
{ "timestamp": 1648917000, "url": ["./_img/canvas/place30/049.png", "./_img/canvas/place30/054_049.png"] },
|
||||
{ "timestamp": ["First Expansion", 1648917000], "url": ["./_img/canvas/place30/049.png", "./_img/canvas/place30/054_049.png"] },
|
||||
{ "timestamp": 1648918800, "url": ["./_img/canvas/place30/060.png", "./_img/canvas/place30/055_060.png"] },
|
||||
{ "timestamp": 1648920600, "url": ["./_img/canvas/place30/060.png", "./_img/canvas/place30/056_060.png"] },
|
||||
{ "timestamp": 1648922400, "url": ["./_img/canvas/place30/060.png", "./_img/canvas/place30/057_060.png"] },
|
||||
|
@ -148,7 +148,7 @@ const variationsConfig = {
|
|||
{ "timestamp": 1649008800, "url": ["./_img/canvas/place30/104.png", "./_img/canvas/place30/105_104.png"] },
|
||||
{ "timestamp": 1649010600, "url": ["./_img/canvas/place30/104.png", "./_img/canvas/place30/106_104.png"] },
|
||||
{ "timestamp": 1649012400, "url": ["./_img/canvas/place30/104.png", "./_img/canvas/place30/107_104.png"] },
|
||||
{ "timestamp": 1649014200, "url": ["./_img/canvas/place30/104.png", "./_img/canvas/place30/108_104.png"] },
|
||||
{ "timestamp": ["Second Expansion", 1649014200], "url": ["./_img/canvas/place30/104.png", "./_img/canvas/place30/108_104.png"] },
|
||||
{ "timestamp": 1649016000, "url": ["./_img/canvas/place30/104.png", "./_img/canvas/place30/109_104.png"] },
|
||||
{ "timestamp": 1649017800, "url": ["./_img/canvas/place30/115.png", "./_img/canvas/place30/110_115.png"] },
|
||||
{ "timestamp": 1649019600, "url": ["./_img/canvas/place30/115.png", "./_img/canvas/place30/111_115.png"] },
|
||||
|
@ -203,7 +203,7 @@ const variationsConfig = {
|
|||
{ "timestamp": 1649107800, "url": ["./_img/canvas/place30/159.png", "./_img/canvas/place30/160_159.png"] },
|
||||
{ "timestamp": 1649109600, "url": ["./_img/canvas/place30/159.png", "./_img/canvas/place30/161_159.png"] },
|
||||
{ "timestamp": 1649111400, "url": ["./_img/canvas/place30/159.png", "./_img/canvas/place30/162_159.png"] },
|
||||
{ "timestamp": 1649112460, "url": ["./_img/canvas/place30ex/final.png"] },
|
||||
{ "timestamp": ["Final Canvas", 1649112460], "url": ["./_img/canvas/place30ex/final.png"] },
|
||||
{ "timestamp": 1649113200, "url": ["./_img/canvas/place30/159.png", "./_img/canvas/place30/163_159.png"] },
|
||||
{ "timestamp": 1649115000, "url": ["./_img/canvas/place30/159.png", "./_img/canvas/place30/164_159.png"] },
|
||||
{ "timestamp": 1649116800, "url": ["./_img/canvas/place30/159.png", "./_img/canvas/place30/165_159.png"] },
|
||||
|
|
|
@ -207,7 +207,14 @@ function updateTooltip(period, variation) {
|
|||
const configObject = variationsConfig[variation].versions[period]
|
||||
|
||||
// If timestap is a number return a UTC formatted date otherwise use exact timestap label
|
||||
if (typeof configObject.timestamp === "number") tooltip.querySelector('div').textContent = new Date(configObject.timestamp * 1000).toUTCString()
|
||||
if (Array.isArray(configObject.timestamp)) {
|
||||
tooltip.querySelector('div').textContent = ""
|
||||
configObject.timestamp.forEach(timestamp => {
|
||||
if (tooltip.querySelector('div').textContent) tooltip.querySelector('div').innerHTML += "<br />"
|
||||
if (typeof timestamp === "number") tooltip.querySelector('div').innerHTML += new Date(timestamp * 1000).toUTCString()
|
||||
else tooltip.querySelector('div').innerHTML += timestamp
|
||||
})
|
||||
} else if (typeof configObject.timestamp === "number") tooltip.querySelector('div').textContent = new Date(configObject.timestamp * 1000).toUTCString()
|
||||
else tooltip.querySelector('div').textContent = configObject.timestamp
|
||||
|
||||
// Clamps position of tooltip to prevent from going off screen
|
||||
|
|
Loading…
Reference in a new issue