diff --git a/index.css b/index.css index e715cdb6..68755497 100644 --- a/index.css +++ b/index.css @@ -904,6 +904,26 @@ div.slider .ui-slider-handle { color: white; } +#loadDropdown { + display: none; + position: absolute; + left: 54%; + top: 100%; + border: 1px solid #5e4fa2; + background-color: #a4879b; + width: 44px; +} + +#loadDropdown>div { + padding: 2px 4px; + cursor: pointer; +} + +#loadDropdown>div:hover { + color: white; +} + + #brushPower, #brushRadius { width: 88px; diff --git a/index.html b/index.html index 299ad0fa..a410ddd4 100644 --- a/index.html +++ b/index.html @@ -1090,7 +1090,12 @@
.svg
.png
- + +
+
local
+
url
+
+ @@ -1970,6 +1975,14 @@ + + diff --git a/main.js b/main.js index ae8c2bb5..0216241d 100644 --- a/main.js +++ b/main.js @@ -542,7 +542,7 @@ function addDragToUpload() { function postload() { let success = false; - if(params.get("from")==="GIST"){ + if(params.get("from")==="url"){ console.time("loadURL"); console.log("Loading URL"); fetch(params.get("url")) diff --git a/modules/ui/options.js b/modules/ui/options.js index fd96ba6e..97f16fd2 100644 --- a/modules/ui/options.js +++ b/modules/ui/options.js @@ -901,7 +901,9 @@ document.getElementById("sticked").addEventListener("click", function(event) { const id = event.target.id; if (id === "newMapButton") regeneratePrompt(); else if (id === "saveButton") toggleSavePane(); + else if (id === "loadButton") toggleLoadPane(); else if (id === "loadMap") mapToLoad.click(); + else if (id === "loadURL") loadURL(); else if (id === "zoomReset") resetZoom(1000); else if (id === "saveMap") saveMap(); else if (id === "saveSVG") saveAsImage("svg"); @@ -946,10 +948,58 @@ function toggleSavePane() { } +function toggleLoadPane() { + if (loadDropdown.style.display === "block") { loadDropdown.style.display = "none"; return; } + loadDropdown.style.display = "block"; +} + // load map document.getElementById("mapToLoad").addEventListener("change", function() { closeDialogs(); const fileToLoad = this.files[0]; this.value = ""; uploadFile(fileToLoad); -}); \ No newline at end of file +}); +// load url +function loadURL() { + let urlLoad = ""; + // update list of objects + let urlObj = document.getElementById("loadURLText"); + urlLoad = urlObj.value; + + + // open a dialog + $("#loadURLDialog").dialog({ + title: "Legends Editor", minWidth: Math.min(svgWidth, 400), + position: {my: "center", at: "center", of: "svg"} + }); + + // add listeners + urlObj.addEventListener("input", changedText); + document.getElementById("loadURLConfirm").addEventListener("click", triggerURLConfirm); + + function changedText() { + urlObj = this.value; + } + + function triggerURLConfirm() { + urlLoad = document.getElementById("loadURLText").value; + if (urlLoad !== "" && urlLoad !== undefined) { + console.log (urlLoad); + var url = new URL(window.location.href); + url.searchParams.set('from', 'url'); + url.searchParams.set('url', urlLoad); + window.location = url; + } else { + alertMessage.innerHTML = 'Invalid URL.'; + $("#alert").dialog({title: "Invalid URL", resizable: false, position: {my: "center", at: "center", of: "svg"}, + buttons: { + OK: function() { + localStorage.setItem("dns_allow_popup_message", true); + $(this).dialog("close"); + } + } + }); + } + } +} \ No newline at end of file