CIMEngine/map
1
0
Fork 0
mirror of https://github.com/CIMEngine/map.git synced 2024-11-21 18:36:22 +03:00
Code Issues Projects Releases Packages Wiki Activity

refactor: formatting

Browse source
This commit is contained in:
Artemy 2024-01-23 18:55:28 +03:00
parent 6439516bff
commit 98daedc9c2
1 changed files with 48 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

89
src/index.js
View file

@ -10,7 +10,7 @@ function loginfo(...str) {
console.log( console.log(
`%c ${info} `, `%c ${info} `,
"color:white; background-color: #78d6fa; border-radius:10px;", "color:white; background-color: #78d6fa; border-radius:10px;",
...str, ...str
); );
} }
window.onload = async () => { window.onload = async () => {
@ -24,7 +24,7 @@ window.onload = async () => {
let mapDataFromId = ( let mapDataFromId = (
await ( await (
await fetch( await fetch(
`https://raw.githubusercontent.com/CIMEngine/MapList/main/index.json`, `https://raw.githubusercontent.com/CIMEngine/MapList/main/index.json`
) )
).json() ).json()
)[mapId]; )[mapId];
@ -60,7 +60,7 @@ window.onload = async () => {
}, },
], ],
}), }),
"top-left", "top-left"
); );
map.addControl(new ZoomControl(), "top-right"); map.addControl(new ZoomControl(), "top-right");
@ -74,7 +74,7 @@ window.onload = async () => {
Crosshair: true, Crosshair: true,
PrintableArea: true, PrintableArea: true,
}), }),
"top-right", "top-right"
); );
if (debug) { if (debug) {
@ -89,7 +89,7 @@ window.onload = async () => {
(error, image) => { (error, image) => {
if (error) throw error; if (error) throw error;
map.addImage("city", image); map.addImage("city", image);
}, }
); );
map.loadImage( map.loadImage(
@ -98,7 +98,7 @@ window.onload = async () => {
if (error) throw error; if (error) throw error;
map.addImage("capital-city", image); map.addImage("capital-city", image);
map.addImage("capital", image); map.addImage("capital", image);
}, }
); );
map.loadImage( map.loadImage(
@ -106,7 +106,7 @@ window.onload = async () => {
(error, image) => { (error, image) => {
if (error) throw error; if (error) throw error;
map.addImage("landmark-0", image); map.addImage("landmark-0", image);
}, }
); );
let lasticocords; let lasticocords;
@ -180,31 +180,35 @@ window.onload = async () => {
.setLngLat(coordinates) .setLngLat(coordinates)
.setHTML( .setHTML(
` `
${feature?.properties?.amount ${
? `<div class="row glass" style="color: "white";"><div class="col">Population - ${feature.properties.amount} people.</div></div>` feature?.properties?.amount
: "" ? `<div class="row glass" style="color: "white";"><div class="col">Population - ${feature.properties.amount} people.</div></div>`
} : ""
}
<div class="row" style="padding: 5px;"> <div class="row" style="padding: 5px;">
${feature?.properties?.img ${
? `<div class="col-md-12 col-sm-12" style="padding: 0px;"><img class="w-100 about-img" src="${feature.properties.img}" alt="${feature.properties.name} img"></div>` feature?.properties?.img
: "" ? `<div class="col-md-12 col-sm-12" style="padding: 0px;"><img class="w-100 about-img" src="${feature.properties.img}" alt="${feature.properties.name} img"></div>`
} : ""
}
<div class="col-md-12 col-sm-12 text-center glass mb-2"> <div class="col-md-12 col-sm-12 text-center glass mb-2">
<h5 className="card-title">${feature.properties.name} <h5 className="card-title">${feature.properties.name}
${feature.properties.name_ru ${
? ` - ${feature.properties.name_ru}` feature.properties.name_ru
: "" ? ` - ${feature.properties.name_ru}`
} : ""
}
</h5> </h5>
</div> </div>
${feature.properties.description ${
? `<div class="col-md-12 col-sm-12 text-center glass"><div>${converter.makeHtml( feature.properties.description
feature.properties.description, ? `<div class="col-md-12 col-sm-12 text-center glass"><div>${converter.makeHtml(
)}</div></div>` feature.properties.description
: "" )}</div></div>`
} : ""
}
</div> </div>
`, `
) )
.addTo(map); .addTo(map);
} else if ( } else if (
@ -223,8 +227,9 @@ window.onload = async () => {
` `
<div class="row" style="padding: 5px;"> <div class="row" style="padding: 5px;">
<div class="col-12 col-sm-12" style="padding: 0px;"> <div class="col-12 col-sm-12" style="padding: 0px;">
<img class="w-100 about-img" src="${country.img <img class="w-100 about-img" src="${
}"> country.img
}">
</div> </div>
<div class="col-12 text-center glass"> <div class="col-12 text-center glass">
<h5> <h5>
@ -233,30 +238,32 @@ window.onload = async () => {
</div> </div>
<div class="col-12 text-center glass"> <div class="col-12 text-center glass">
${JSON.parse( ${JSON.parse(
feature.properties.tags || "[]", feature.properties.tags || "[]"
).join(", ")} ).join(", ")}
</div> </div>
<div class="col-12 text-center glass"> <div class="col-12 text-center glass">
Founding date: ${country.date} Founding date: ${country.date}
</div> </div>
<div class="col-md-12 col-sm-12 text-center glass"> <div class="col-md-12 col-sm-12 text-center glass">
${country.description ${
? `<div>${converter.makeHtml( country.description
country.description, ? `<div>${converter.makeHtml(
)}</div>` country.description
: "" )}</div>`
} : ""
}
</div> </div>
<div class="col-12 text-center glass"> <div class="col-12 text-center glass">
Area: ${feature.properties.area} km² Area: ${feature.properties.area} km²
</div> </div>
<div class="col-12 text-center mt-2"> <div class="col-12 text-center mt-2">
${country.about ${
? `<a href="${country.about}" class="about">About</a>` country.about
: "" ? `<a href="${country.about}" class="about">About</a>`
} : ""
}
</div> </div>
</div>`, </div>`
) )
.addTo(map); .addTo(map);
}, 1); }, 1);