v. 0.5598b

This commit is contained in:
Azgaar 2018-04-13 23:30:02 +03:00
parent 74dc6a9a78
commit e812bba4cc
3 changed files with 95 additions and 65 deletions

View file

@ -361,14 +361,10 @@ button.options {
color: grey; color: grey;
} }
#sticked {
padding: 0 5px;
}
#sticked button { #sticked button {
background-color: rgba(153, 124, 137, 0); background-color: rgba(153, 124, 137, 0);
padding: 0; padding: 0;
margin: 1px 10px; margin: 1px 17px;
} }
#collapsible { #collapsible {
@ -474,21 +470,28 @@ p {
font-size: 1.2vw; font-size: 1.2vw;
} }
table { #optionsContent table td:nth-of-type(1) {
table-layout: fixed;
width: 288px;
}
table td:nth-of-type(1) {
text-decoration: underline dotted gray; text-decoration: underline dotted gray;
cursor: help; cursor: help;
width: 126px; width: 126px;
} }
table td:nth-of-type(3) { #optionsContent table td:nth-of-type(3) {
text-align: right; text-align: right;
} }
.overflow-div {
height: 300px;
overflow-y: auto;
user-select: text;
}
.overflow-table {
width: 100%;
font-size: smaller;
text-align: center;
}
#icons { #icons {
stroke: #0d0d0d; stroke: #0d0d0d;
fill: grey; fill: grey;
@ -774,7 +777,7 @@ div.slider .ui-slider-handle {
#saveDropdown { #saveDropdown {
display: none; display: none;
position: absolute; position: absolute;
left: 25%; left: 29%;
top: 100%; top: 100%;
border: 1px solid #5e4fa2; border: 1px solid #5e4fa2;
background-color: #a4879b; background-color: #a4879b;

View file

@ -31,8 +31,8 @@
<script src="libs/polylabel.min.js"></script> <script src="libs/polylabel.min.js"></script>
<script src="libs/quantize.min.js" defer></script> <script src="libs/quantize.min.js" defer></script>
<script src="libs/d3-hexbin.v0.2.min.js" defer></script> <script src="libs/d3-hexbin.v0.2.min.js" defer></script>
<link rel="stylesheet" type="text/css" href="index.css?version=0.5597b"/> <link rel="stylesheet" type="text/css" href="index.css?version=0.5598b"/>
<link rel="stylesheet" type="text/css" href="icons.css?version=0.5597b"/> <link rel="stylesheet" type="text/css" href="icons.css?version=0.5598b"/>
<link rel="stylesheet" type="text/css" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"/> <link rel="stylesheet" type="text/css" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"/>
</head> </head>
<body class="fullscreen"> <body class="fullscreen">
@ -185,6 +185,7 @@
<a id="restoreStyle" title="Restore initial style" class="icon-ccw"></a> <a id="restoreStyle" title="Restore initial style" class="icon-ccw"></a>
<div id="styleInputs"> <div id="styleInputs">
<div id="styleOverlay"> <div id="styleOverlay">
<br><span>Ensure Overlay layer is active (see Layout tab)</span><br>
<br>Overlay type: <select id="styleOverlayType" class="pureInput"> <br>Overlay type: <select id="styleOverlayType" class="pureInput">
<option value="hex" selected>Hex grid</option> <option value="hex" selected>Hex grid</option>
<option value="square">Square grid</option> <option value="square">Square grid</option>
@ -447,12 +448,7 @@
</div> </div>
<button id="loadMap" title="Load fully functional map in a .map format" class="options">Load</button> <button id="loadMap" title="Load fully functional map in a .map format" class="options">Load</button>
<input type="file" accept=".map" id="fileToLoad"> <input type="file" accept=".map" id="fileToLoad">
<button id="printMap" title="Print visible part of the map" class="options">Print</button>
<button id="zoomReset" title="Reset map zoom to default" class="options">Reset Zoom</button> <button id="zoomReset" title="Reset map zoom to default" class="options">Reset Zoom</button>
<!-- Zoom should be smooth and centrified, to be fixed later
<button id="zoomMinus" title="Zoom out" class="options">-</button>
<button id="zoomPlus" title="Zoom in" class="options">+</button>
-->
</div> </div>
</div> </div>
</div> </div>
@ -669,6 +665,8 @@
</div> </div>
<button id="countriesAddG" title="Add country" class="icon-plus"></button> <button id="countriesAddG" title="Add country" class="icon-plus"></button>
<button id="countriesExport" title="Save country-related data as a text file (.csv)" class="icon-download"></button> <button id="countriesExport" title="Save country-related data as a text file (.csv)" class="icon-download"></button>
<input type="file" accept=".txt,.csv" id="burgsListToLoad" style="display: none;">
<button id="burgNamesImport" title="Load burg names from a text file. Each name should be on a new line!" class="icon-upload"></button>
<button id="removeCountries" title="Remove all countries" class="icon-trash"></button> <button id="removeCountries" title="Remove all countries" class="icon-trash"></button>
</div> </div>
</div> </div>
@ -765,5 +763,5 @@
Type: <span id="feature">no</span> Type: <span id="feature">no</span>
</div> </div>
<script src="script.js?version=0.5597b"></script> <script src="script.js?version=0.5598b"></script>
</body> </body>

113
script.js
View file

@ -3624,12 +3624,6 @@ function fantasyMap() {
}); });
} }
// print displayed map segment
function printMap() {
var popUpAndPrint = function() {window.print(); window.close();};
setTimeout(popUpAndPrint, 500);
}
// Save in .map format, based on FileSystem API // Save in .map format, based on FileSystem API
function saveMap() { function saveMap() {
console.time("saveMap"); console.time("saveMap");
@ -4193,6 +4187,7 @@ function fantasyMap() {
link.href = url; link.href = url;
link.click(); link.click();
} }
if (id === "burgNamesImport") {burgsListToLoad.click();}
if (id === "removeCountries") { if (id === "removeCountries") {
alertMessage.innerHTML = `Are you sure you want to remove all countries?`; alertMessage.innerHTML = `Are you sure you want to remove all countries?`;
$(function() {$("#alert").dialog({resizable: false, title: "Remove countries", $(function() {$("#alert").dialog({resizable: false, title: "Remove countries",
@ -4511,7 +4506,6 @@ function fantasyMap() {
} }
if (id === "saveButton") {$("#saveDropdown").slideToggle();} if (id === "saveButton") {$("#saveDropdown").slideToggle();}
if (id === "loadMap") {fileToLoad.click();} if (id === "loadMap") {fileToLoad.click();}
if (id === "printMap") {printMap();}
if (id === "zoomReset") {resetZoom(1000);} if (id === "zoomReset") {resetZoom(1000);}
if (id === "zoomPlus") { if (id === "zoomPlus") {
scale += 1; scale += 1;
@ -5330,42 +5324,38 @@ function fantasyMap() {
alertMessage.innerHTML = `Are you sure you want to remove the country?`; alertMessage.innerHTML = `Are you sure you want to remove the country?`;
var s = +(this.parentNode.id).slice(5); var s = +(this.parentNode.id).slice(5);
var capital = states[s].capital; var capital = states[s].capital;
if (capital === "select") { if (capital === "select" && s === states.length - 1) {
states.splice(s, 1); editCountries();
states.map(function(s, i) {s.i = i;});
$("#state"+s).remove();
return; return;
} }
$(function() {$("#alert").dialog({resizable: false, title: "Remove country", $("#alert").dialog({resizable: false, title: "Remove country", buttons: {
buttons: { "Remove": function() {
"Remove": function() { states.splice(s, 1);
$(this).dialog("close"); states.map(function(s, i) {s.i = i;});
states.splice(s, 1); $("#manorLabel"+capital).detach().appendTo($("#towns")).attr("dy", -0.7); // change capital label to burg
states.map(function(s, i) {s.i = i;}); $("#manorIcon"+capital).attr("r", .5).attr("stroke-width", .12);
$("#manorLabel"+capital).detach().appendTo($("#towns")).attr("dy", -0.7); // change capital label to burg var burgs = $.grep(manors, function(e) {return (e.region === s);});
$("#manorIcon"+capital).attr("r", .5).attr("stroke-width", .12); var urbanFactor = 0.9;
var burgs = $.grep(manors, function(e) {return (e.region === s);}); burgs.map(function(b) {
var urbanFactor = 0.9; if (b.i === capital) {b.population *= 0.5;}
burgs.map(function(b) { b.population *= urbanFactor;
if (b.i === capital) {b.population *= 0.5;} b.region = "neutral";
b.population *= urbanFactor; });
b.region = "neutral"; cells.map(function(c) {
}); if (c.region === s) {c.region = "neutral";}
cells.map(function(c) { else if (c.region > s) {c.region -= 1;}
if (c.region === s) {c.region = "neutral";} });
else if (c.region > s) {c.region -= 1;} // re-calculate neutral data
}); if (states[states.length-1].capital !== "neutral") {
// re-calculate neutral data states.push({i: states.length, color: "neutral", name: "Neutrals", capital: "neutral"});
if (states[states.length-1].capital !== "neutral") { }
states.push({i: states.length, color: "neutral", name: "Neutrals", capital: "neutral"}); $(this).dialog("close");
} redrawRegions();
redrawRegions(); recalculateStateData(states.length - 1); // re-calc data for neutrals
recalculateStateData(states.length - 1); // re-calc data for neutrals editCountries();
editCountries(); },
}, Cancel: function() {$(this).dialog("close");}
Cancel: function() {$(this).dialog("close");} }});
}})
});
}); });
$("#countriesNeutral").on("change", function() {regenerateCountries();}); $("#countriesNeutral").on("change", function() {regenerateCountries();});
} }
@ -5619,7 +5609,7 @@ function fantasyMap() {
var state = "neutral", closest = neutral; var state = "neutral", closest = neutral;
var x = m.x, y = m.y; var x = m.x, y = m.y;
states.map(function(s) { states.map(function(s) {
if (s.capital === "neutral") {return;} if (s.capital === "neutral" || s.capital === "select") {return;}
var c = manors[s.capital]; var c = manors[s.capital];
var dist = Math.hypot(c.x - x, c.y - y) / s.power; var dist = Math.hypot(c.x - x, c.y - y) / s.power;
if (cells[m.cell].fn !== cells[c.cell].fn) {dist *= 3;} if (cells[m.cell].fn !== cells[c.cell].fn) {dist *= 3;}
@ -5721,6 +5711,45 @@ function fantasyMap() {
lines.detach().appendTo(list); lines.detach().appendTo(list);
}); });
// load text file with new burg names
$("#burgsListToLoad").change(function() {
var fileToLoad = this.files[0];
this.value = "";
var fileReader = new FileReader();
fileReader.onload = function(fileLoadedEvent) {
var dataLoaded = fileLoadedEvent.target.result;
var data = dataLoaded.split("\r\n");
if (data.length === 0) {return;}
let change = [];
let message = `Burgs will be renamed as below. Please confirm`;
message += `<div class="overflow-div"><table class="overflow-table"><tr><th>Id</th><th>Current name</th><th>New Name</th></tr>`;
for (var i=0; i < data.length && i < manors.length; i++) {
const v = data[i];
if (v === "" || v === undefined) {continue;}
if (v === manors[i].name) {continue;}
change.push({i, name: v});
message += `<tr><td style="width:20%">${i}</td><td style="width:40%">${manors[i].name}</td><td style="width:40%">${v}</td></tr>`;
}
message += `</tr></table></div>`;
alertMessage.innerHTML = message;
$("#alert").dialog({title: "Burgs bulk renaming", position: {my: "center", at: "center", of: "svg"},
buttons: {
Cancel: function() {$(this).dialog("close");},
"Confirm": function() {
for (var i=0; i < change.length; i++) {
const id = change[i].i;
manors[id].name = change[i].name;
labels.select("#manorLabel"+id).text(change[i].name);
}
$(this).dialog("close");
updateCountryEditors();
}
}
});
}
fileReader.readAsText(fileToLoad, "UTF-8");
});
// just apply map size that was already set // just apply map size that was already set
function applyMapSize() { function applyMapSize() {
mapWidth = +mapWidthInput.value; mapWidth = +mapWidthInput.value;