mirror of
https://github.com/Azgaar/Fantasy-Map-Generator.git
synced 2025-12-16 17:31:24 +01:00
Fully load river from save files
Correctly Load from save file now
This commit is contained in:
parent
ad11a632c4
commit
03ed19b030
3 changed files with 134 additions and 45 deletions
52
index.html
52
index.html
|
|
@ -5462,7 +5462,7 @@
|
|||
class="icon-plus"
|
||||
></button>
|
||||
<button id="riverCreateNew" data-tip="Create a new river selecting river cells" class="icon-map-pin"></button>
|
||||
<button id="loadriverfromcsv" data-tip="Generate river from saved map" class="icon-upload"></button>
|
||||
<button id="loadriverfromSavedMap" data-tip="Generate river from saved map" class="icon-upload"></button>
|
||||
<button id="riversBasinHighlight" data-tip="Toggle basin highlight mode" class="icon-sitemap"></button>
|
||||
<button
|
||||
id="riversExport"
|
||||
|
|
@ -6143,6 +6143,55 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div id="loadRiverMapData" style="display: none" class="dialog">
|
||||
<div>
|
||||
<strong>Load River map from</strong>
|
||||
<button onclick="mapRiverToLoad.click()" data-tip="Load map file (.map or .gz) from your local disk">
|
||||
machine
|
||||
</button>
|
||||
<button
|
||||
onclick="loadRiverURL()"
|
||||
data-tip="Load map file (.map or .gz) file from URL. Note that the server should allow CORS"
|
||||
>
|
||||
URL
|
||||
</button>
|
||||
<button onclick="quickLoad()" data-tip="Load map from browser storage (if saved before)">storage</button>
|
||||
</div>
|
||||
|
||||
<p>Click on <i>storage</i> to open the last saved map.</p>
|
||||
|
||||
<div id="loadRiverFromDropbox">
|
||||
<p style="margin-bottom: 0.3em">
|
||||
Or load from your Dropbox account
|
||||
<button
|
||||
id="dropboxConnectButton"
|
||||
onclick="connectToDropbox()"
|
||||
data-tip="Connect your Dropbox account to be able to load maps from it"
|
||||
>
|
||||
Connect
|
||||
</button>
|
||||
</p>
|
||||
|
||||
<select id="loadRiverFromDropboxSelect" style="width: 22em"></select>
|
||||
<div id="loadRiverFromDropboxButtons" style="margin-bottom: 0.6em">
|
||||
<button onclick="loadRiverFromDropbox()" data-tip="Load map file (.map or .gz) from your Dropbox">Load</button>
|
||||
<button
|
||||
onclick="createSharableRiverDropboxLink()"
|
||||
data-tip="Select file and create a link to share with your friends"
|
||||
>
|
||||
Share
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div style="margin-top: 0.3em">
|
||||
<div id="sharableLinkContainer" style="display: none">
|
||||
<a id="sharableLink" target="_blank"></a>
|
||||
<i data-tip="Copy link to the clipboard" onclick="copyLinkToClickboard()" class="icon-clone pointer"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="exportToPngTilesScreen" style="display: none" class="dialog">
|
||||
<p>Map will be split into tiles and downloaded as a single zip file. Avoid saving too large images</p>
|
||||
<div data-tip="Number of columns" style="margin-bottom: 0.3em">
|
||||
|
|
@ -6220,6 +6269,7 @@
|
|||
|
||||
<div id="fileInputs" style="display: none">
|
||||
<input type="file" accept=".map,.gz" id="mapToLoad" />
|
||||
<input type="file" accept=".map,.gz" id="mapRiverToLoad" />
|
||||
<input type="file" accept=".txt,.csv" id="burgsListToLoad" />
|
||||
<input type="file" accept=".txt" id="legendsToLoad" />
|
||||
<input type="file" accept="image/*" id="imageToLoad" />
|
||||
|
|
|
|||
|
|
@ -770,10 +770,27 @@ async function parseLoadedData(data, mapVersion) {
|
|||
}
|
||||
}
|
||||
|
||||
async function createSharableRiverDropboxLink() {
|
||||
const mapFile = document.querySelector("#loadRiverFromDropbox select").value;
|
||||
const sharableLink = byId("sharableLink");
|
||||
const sharableLinkContainer = byId("sharableLinkContainer");
|
||||
|
||||
try {
|
||||
const previewLink = await Cloud.providers.dropbox.getLink(mapFile);
|
||||
const directLink = previewLink.replace("www.dropbox.com", "dl.dropboxusercontent.com"); // DL allows CORS
|
||||
const finalLink = `${location.origin}${location.pathname}?maplink=${directLink}`;
|
||||
|
||||
async function loadRiversFromDropbox() {
|
||||
const mapPath = byId("loadFromDropboxSelect")?.value;
|
||||
sharableLink.innerText = finalLink.slice(0, 45) + "...";
|
||||
sharableLink.setAttribute("href", finalLink);
|
||||
sharableLinkContainer.style.display = "block";
|
||||
} catch (error) {
|
||||
ERROR && console.error(error);
|
||||
return tip("Dropbox API error. Can not create link.", true, "error", 2000);
|
||||
}
|
||||
}
|
||||
|
||||
async function loadRiverFromDropbox() {
|
||||
const mapPath = byId("loadRiverFromDropboxSelect")?.value;
|
||||
|
||||
DEBUG && console.log("Loading map from Dropbox:", mapPath);
|
||||
const blob = await Cloud.providers.dropbox.load(mapPath);
|
||||
|
|
@ -846,21 +863,66 @@ async function parseLoadedDataOnlyRivers(data) {
|
|||
customization = 0;
|
||||
if (customizationMenu.offsetParent) styleTab.click();
|
||||
|
||||
const params = data[0].split("|");
|
||||
|
||||
|
||||
INFO && console.group("Loaded Map " + seed);
|
||||
|
||||
|
||||
void (function parsePackData() {
|
||||
reGraph();
|
||||
reMarkFeatures();
|
||||
|
||||
pack.rivers = data[32] ? JSON.parse(data[32]) : [];
|
||||
|
||||
const cells = pack.cells;
|
||||
cells.r = Uint16Array.from(data[22].split(","));
|
||||
|
||||
pack.cells.r = Uint16Array.from(data[22].split(","));
|
||||
|
||||
})();
|
||||
|
||||
void (function restoreLayersState() {
|
||||
const isVisible = selection => selection.node() && selection.style("display") !== "none";
|
||||
const isVisibleNode = node => node && node.style.display !== "none";
|
||||
const hasChildren = selection => selection.node()?.hasChildNodes();
|
||||
const hasChild = (selection, selector) => selection.node()?.querySelector(selector);
|
||||
const turnOn = el => byId(el).classList.remove("buttonoff");
|
||||
|
||||
toggleRivers();
|
||||
toggleRivers();
|
||||
// turn all layers off
|
||||
byId("mapLayers")
|
||||
.querySelectorAll("li")
|
||||
.forEach(el => el.classList.add("buttonoff"));
|
||||
|
||||
// turn on active layers
|
||||
if (hasChild(texture, "image")) turnOn("toggleTexture");
|
||||
if (hasChildren(terrs)) turnOn("toggleHeight");
|
||||
if (hasChildren(biomes)) turnOn("toggleBiomes");
|
||||
if (hasChildren(cells)) turnOn("toggleCells");
|
||||
if (hasChildren(gridOverlay)) turnOn("toggleGrid");
|
||||
if (hasChildren(coordinates)) turnOn("toggleCoordinates");
|
||||
if (isVisible(compass) && hasChild(compass, "use")) turnOn("toggleCompass");
|
||||
if (hasChildren(rivers)) turnOn("toggleRivers");
|
||||
if (isVisible(terrain) && hasChildren(terrain)) turnOn("toggleRelief");
|
||||
if (hasChildren(relig)) turnOn("toggleReligions");
|
||||
if (hasChildren(cults)) turnOn("toggleCultures");
|
||||
if (hasChildren(statesBody)) turnOn("toggleStates");
|
||||
if (hasChildren(provs)) turnOn("toggleProvinces");
|
||||
if (hasChildren(zones) && isVisible(zones)) turnOn("toggleZones");
|
||||
if (isVisible(borders) && hasChild(borders, "path")) turnOn("toggleBorders");
|
||||
if (isVisible(routes) && hasChild(routes, "path")) turnOn("toggleRoutes");
|
||||
if (hasChildren(temperature)) turnOn("toggleTemp");
|
||||
if (hasChild(population, "line")) turnOn("togglePopulation");
|
||||
if (hasChildren(ice)) turnOn("toggleIce");
|
||||
if (hasChild(prec, "circle")) turnOn("togglePrec");
|
||||
if (isVisible(emblems) && hasChild(emblems, "use")) turnOn("toggleEmblems");
|
||||
if (isVisible(labels)) turnOn("toggleLabels");
|
||||
if (isVisible(icons)) turnOn("toggleIcons");
|
||||
if (hasChildren(armies) && isVisible(armies)) turnOn("toggleMilitary");
|
||||
if (hasChildren(markers)) turnOn("toggleMarkers");
|
||||
if (isVisible(ruler)) turnOn("toggleRulers");
|
||||
if (isVisible(scaleBar)) turnOn("toggleScaleBar");
|
||||
if (isVisibleNode(byId("vignette"))) turnOn("toggleVignette");
|
||||
|
||||
getCurrentPreset();
|
||||
})();
|
||||
{
|
||||
// dynamically import and run auto-update script
|
||||
const versionNumber = parseFloat(params[0]);
|
||||
|
|
@ -876,11 +938,7 @@ async function parseLoadedDataOnlyRivers(data) {
|
|||
}
|
||||
}
|
||||
|
||||
{
|
||||
// add custom texture if any
|
||||
const textureHref = texture.attr("data-href");
|
||||
if (textureHref) updateTextureSelectValue(textureHref);
|
||||
}
|
||||
fitMapToScreen();
|
||||
|
||||
void (function checkDataIntegrity() {
|
||||
const cells = pack.cells;
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@ function overviewRivers() {
|
|||
document.getElementById("riversBasinHighlight").addEventListener("click", toggleBasinsHightlight);
|
||||
document.getElementById("riversExport").addEventListener("click", downloadRiversData);
|
||||
document.getElementById("riversRemoveAll").addEventListener("click", triggerAllRiversRemove);
|
||||
document.getElementById("loadriverfromcsv").addEventListener("click", showLoadRiverPane);
|
||||
document.getElementById("loadriverfromSavedMap").addEventListener("click", showLoadRiverPane);
|
||||
|
||||
// add line for each river
|
||||
function riversOverviewAddLines() {
|
||||
|
|
@ -203,25 +203,9 @@ function overviewRivers() {
|
|||
riversOverviewAddLines();
|
||||
}
|
||||
|
||||
function loadriverfromcsvfunction() {
|
||||
alertMessage.innerHTML = /* html */ `Are you sure you want to add river from file?`;
|
||||
$("#alert").dialog({
|
||||
resizable: false,
|
||||
title: "Import rivers",
|
||||
buttons: {
|
||||
Import: function() {
|
||||
$(this).dialog("load");
|
||||
showLoadRiverPane();
|
||||
},
|
||||
Cancel: function() {
|
||||
$(this).dialog("close");
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
async function showLoadRiverPane() {
|
||||
$("#loadMapData").dialog({
|
||||
$("#loadRiverMapData").dialog({
|
||||
title: "Load River from saved map",
|
||||
resizable: false,
|
||||
width: "auto",
|
||||
|
|
@ -236,20 +220,20 @@ async function showLoadRiverPane() {
|
|||
// already connected to Dropbox: list saved maps
|
||||
if (Cloud.providers.dropbox.api) {
|
||||
byId("dropboxConnectButton").style.display = "none";
|
||||
byId("loadFromDropboxSelect").style.display = "block";
|
||||
const loadFromDropboxButtons = byId("loadFromDropboxButtons");
|
||||
const fileSelect = byId("loadFromDropboxSelect");
|
||||
byId("loadRiverFromDropboxSelect").style.display = "block";
|
||||
const loadRiverFromDropboxButtons = byId("loadRiverFromDropboxButtons");
|
||||
const fileSelect = byId("loadRiverFromDropboxSelect");
|
||||
fileSelect.innerHTML = /* html */ `<option value="" disabled selected>Loading...</option>`;
|
||||
|
||||
const files = await Cloud.providers.dropbox.list();
|
||||
|
||||
if (!files) {
|
||||
loadFromDropboxButtons.style.display = "none";
|
||||
loadRiverFromDropboxButtons.style.display = "none";
|
||||
fileSelect.innerHTML = /* html */ `<option value="" disabled selected>Save files to Dropbox first</option>`;
|
||||
return;
|
||||
}
|
||||
|
||||
loadFromDropboxButtons.style.display = "block";
|
||||
loadRiverFromDropboxButtons.style.display = "block";
|
||||
fileSelect.innerHTML = "";
|
||||
files.forEach(({name, updated, size, path}) => {
|
||||
const sizeMB = rn(size / 1024 / 1024, 2) + " MB";
|
||||
|
|
@ -264,16 +248,13 @@ async function showLoadRiverPane() {
|
|||
|
||||
// not connected to Dropbox: show connect button
|
||||
byId("dropboxConnectButton").style.display = "inline-block";
|
||||
byId("loadFromDropboxButtons").style.display = "none";
|
||||
byId("loadFromDropboxSelect").style.display = "none";
|
||||
byId("loadRiverFromDropboxButtons").style.display = "none";
|
||||
byId("loadRiverFromDropboxSelect").style.display = "none";
|
||||
}
|
||||
|
||||
async function connectToDropbox() {
|
||||
await Cloud.providers.dropbox.initialize();
|
||||
if (Cloud.providers.dropbox.api) showLoadPane();
|
||||
}
|
||||
|
||||
function loadURL() {
|
||||
|
||||
function loadRiverURL() {
|
||||
const pattern = /(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/;
|
||||
const inner = `Provide URL to map file:
|
||||
<input id="mapURL" type="url" style="width: 24em" placeholder="https://e-cloud.com/test.map">
|
||||
|
|
@ -301,7 +282,7 @@ function loadURL() {
|
|||
}
|
||||
|
||||
// load map
|
||||
byId("mapToLoad").addEventListener("change", function () {
|
||||
byId("mapRiverToLoad").addEventListener("change", function () {
|
||||
const fileToLoad = this.files[0];
|
||||
this.value = "";
|
||||
closeDialogs();
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue