diff --git a/content/utilities/map-filter-export/index.md b/content/utilities/map-filter-export/index.md
index 045cd5c..c273586 100644
--- a/content/utilities/map-filter-export/index.md
+++ b/content/utilities/map-filter-export/index.md
@@ -1,6 +1,6 @@
---
title: Map Filter Export
-date: 2022-02-01
+date: 2023-11-22
subtitle: Export filtered planets with or without background.
-version: 0.6.5
+version: 0.1.1-dfares
---
diff --git a/content/utilities/map-filter-export/plugin.js b/content/utilities/map-filter-export/plugin.js
index 8ba11c4..a6ef725 100755
--- a/content/utilities/map-filter-export/plugin.js
+++ b/content/utilities/map-filter-export/plugin.js
@@ -1,38 +1,38 @@
//
-// author: https://twitter.com/DfArchon
+// author: https://twitter.com/DFArchon
//
-// Map Filter Export
-//
-// Export filtered planets with or without background.
-//
-// the speed of export and import is faster :-)
-//
-// notice 1: If the number of planets is too large, the website may crash,
-// so we recommend choose a reasonable planetLevel range, such as [3,9].
-// We don't recommend to choose the planetLevel 0,
-// because the planets's amount maybe very large.
-//
-// notice 2: If you choose to [Download Map With Background],
-// plugin will export the map which has a lot of 16x16 pixel blocks,
-// the import speed is fast, but you may need to wait the planets to show up for a while.
-// Click the button [Show Planets] and Use the middle mouse button to zoom in
-// and out may help to make the planets show up more quickly.
+// Map Filter Export
+//
+// Export filtered planets with or without background.
+//
+// the speed of export and import is faster :-)
+//
+// notice 1: If the number of planets is too large, the website may crash,
+// so we recommend choose a reasonable planetLevel range, such as [3,9].
+// We don't recommend to choose the planetLevel 0,
+// because the planets's amount maybe very large.
+//
+// notice 2: If you choose to [Download Map With Background],
+// plugin will export the map which has a lot of 16x16 pixel blocks,
+// the import speed is fast, but you may need to wait the planets to show up for a while.
+// Click the button [Show Planets] and Use the middle mouse button to zoom in
+// and out may help to make the planets show up more quickly.
//
-// notice 3: Your planets can still be attacked by other's small planets which you can't see.
+// notice 3: Your planets can still be attacked by other's small planets which you can't see.
//
-// When writing this plugin, we learn a lot from the plugin named map export,
-// Thanks to the authors of map export !
+// When writing this plugin, we learn a lot from the plugin named map export,
+// Thanks to the authors of map export !
//
import { PlanetLevel, PlanetType, SpaceType } from
- "https://cdn.skypack.dev/@darkforest_eth/types";
+ "https://cdn.skypack.dev/@dfares/types";
import { html, render, useState } from
- "https://unpkg.com/htm/preact/standalone.module.js";
+ "https://unpkg.com/htm/preact/standalone.module.js";
import { getPlayerColor } from
- "https://cdn.skypack.dev/@darkforest_eth/procedural";
+ "https://cdn.skypack.dev/@dfares/procedural";
let showPlanets = [];
@@ -47,535 +47,551 @@ export const inGreenSpace = planet => planet.spaceType === SpaceType.DEAD_SPACE;
export const inBlueSpace = planet => planet.spaceType === SpaceType.NEBULA;
export const inDarkblueSpace = planet => planet.spaceType === SpaceType.SPACE;
export const destroyedFilter = plt => {
- return plt.location !== undefined && plt.destroyed === false;
+ return plt.location !== undefined && plt.destroyed === false;
}
export const sleep = ms => new Promise(resolve => setTimeout(resolve, ms));
function drawRound(ctx, p, color, width = 1) {
- if (!p) return '(???,???)';
- const viewport = ui.getViewport();
- ctx.strokeStyle = color;
- ctx.lineWidth = width;
- const {
- x,
- y
- } = viewport.worldToCanvasCoords(p.location.coords);
- const range = p.range * 0.01 * 20;
- const trueRange = viewport.worldToCanvasDist(range);
- ctx.beginPath();
- // ctx.setLineDash([10,10]);
- ctx.arc(x, y, trueRange, 0, 2 * Math.PI);
- ctx.stroke();
- return `(${p.location.coords.x},${p.location.coords.y})`;
+ if (!p) return '(???,???)';
+ const viewport = ui.getViewport();
+ ctx.strokeStyle = color;
+ ctx.lineWidth = width;
+ const {
+ x,
+ y
+ } = viewport.worldToCanvasCoords(p.location.coords);
+ const range = p.range * 0.01 * 20;
+ const trueRange = viewport.worldToCanvasDist(range);
+ ctx.beginPath();
+ // ctx.setLineDash([10,10]);
+ ctx.arc(x, y, trueRange, 0, 2 * Math.PI);
+ ctx.stroke();
+ return `(${p.location.coords.x},${p.location.coords.y})`;
}
function zeroFill(i) {
- if (i >= 0 && i <= 9) return "0" + i;
- else return i;
+ if (i >= 0 && i <= 9) return "0" + i;
+ else return i;
}
function getCurrentTime() {
- var date = new Date();
- var month = zeroFill(date.getMonth() + 1);
- var day = zeroFill(date.getDate());
- var hour = zeroFill(date.getHours());
- var minute = zeroFill(date.getMinutes());
- var second = zeroFill(date.getSeconds());
+ var date = new Date();
+ var month = zeroFill(date.getMonth() + 1);
+ var day = zeroFill(date.getDate());
+ var hour = zeroFill(date.getHours());
+ var minute = zeroFill(date.getMinutes());
+ var second = zeroFill(date.getSeconds());
- var curTime = date.getFullYear() + "-" + month + "-" + day
- + "_" + hour + "-" + minute + "-" + second;
+ var curTime = date.getFullYear() + "-" + month + "-" + day
+ + "_" + hour + "-" + minute + "-" + second;
- return curTime;
+ return curTime;
}
const PLANET_LEVELS = Object.values(PlanetLevel).map((level) => ({
- value: level,
- text: level.toString(),
+ value: level,
+ text: level.toString(),
}));
function mapFilterExport() {
- const [leftLevel, setLeftLevel] = useState(3);
- const [rightLevel, setRightLevel] = useState(9);
-
- const [hasPlanet, setHasPlanet] = useState(true);
- const [hasAsteroidField, setHasAsteroidField] = useState(true);
- const [hasFoundry, setHasFoundry] = useState(true);
- const [hasSpacetimeRip, setHasSpacetimeRip] = useState(true);
- const [hasQuasar, setHasQuasar] = useState(false);
+ const [leftLevel, setLeftLevel] = useState(3);
+ const [rightLevel, setRightLevel] = useState(9);
+
+ const [hasPlanet, setHasPlanet] = useState(true);
+ const [hasAsteroidField, setHasAsteroidField] = useState(true);
+ const [hasFoundry, setHasFoundry] = useState(true);
+ const [hasSpacetimeRip, setHasSpacetimeRip] = useState(true);
+ const [hasQuasar, setHasQuasar] = useState(false);
- const [ohBlackSpace, setOhBlackSpace] = useState(true);
- const [ohGreenSpace, setOhGreenSpace] = useState(true);
- const [ohBlueSpace, setOhBlueSpace] = useState(true);
- const [ohDarkblueSpace, setOhDarkblueSpace] = useState(true);
- const [onlyMe, setOnlyMe] = useState(false);
-
- const [info, setInfo] = useState('');
- const [info2, setInfo2] = useState('');
+ const [ohBlackSpace, setOhBlackSpace] = useState(true);
+ const [ohGreenSpace, setOhGreenSpace] = useState(true);
+ const [ohBlueSpace, setOhBlueSpace] = useState(true);
+ const [ohDarkblueSpace, setOhDarkblueSpace] = useState(true);
+ const [onlyMe, setOnlyMe] = useState(false);
+
+ const [info, setInfo] = useState('');
+ const [info2, setInfo2] = useState('');
- //functions
- function judgeLevel(plt) {
- let minLevel = Math.min(leftLevel, rightLevel);
- let maxLevel = Math.max(leftLevel, rightLevel);
- return minLevel <= plt.planetLevel && plt.planetLevel <= maxLevel;
- }
-
- function judgePlanetType(plt) {
- if (hasPlanet && isPlanet(plt)) return true;
- if (hasAsteroidField && isAsteroidField(plt)) return true;
- if (hasFoundry && isFoundry(plt)) return true;
- if (hasSpacetimeRip && isSpacetimeRip(plt)) return true;
- if (hasQuasar && isQuasar(plt)) return true;
- return false;
- }
-
- function judgeOwner(plt) {
- if (onlyMe === false) return true;
- if (plt.owner === df.account) return true;
- return false;
-
- }
-
- function judgeSpaceType(plt) {
- if (ohBlackSpace && inBlackSpace(plt)) return true;
- if (ohGreenSpace && inGreenSpace(plt)) return true;
- if (ohBlueSpace && inBlueSpace(plt)) return true;
- if (ohDarkblueSpace && inDarkblueSpace(plt)) return true;
- return false;
- }
-
- function generateMapWithoutBackground() {
- let chunks = ui.getExploredChunks();
- let chunksAsArray = Array.from(chunks);
-
- let res = [];
-
- let planetsCount = 0;
- let mapPixelsCnt = 0;
-
-
- for (let i = 0; i < chunksAsArray.length; i++) {
- const chunk = chunksAsArray[i];
-
- let chunkFootprint = chunk.chunkFootprint;
- let bottomLeft = chunkFootprint.bottomLeft;
- let sideLength = chunkFootprint.sideLength;
- let chunkPerlin = chunkFootprint.perlin;
-
- let planetLocations = chunk.planetLocations;
-
- let smallLength = 16;
- let number = sideLength / smallLength;
-
- if (sideLength < smallLength) continue;
-
- mapPixelsCnt += number * number;
-
- let planetLocationsWithMark = [];
-
- planetLocations.forEach(item => {
- const coords = item.coords;
- let plt = df.getPlanetWithCoords(coords);
-
- let flag = true;
-
- if (judgeLevel(plt) === false) flag = false;
- if (judgePlanetType(plt) === false) flag = false;
- if (judgeSpaceType(plt) === false) flag = false;
- if (judgeOwner(plt) === false) flag = false;
- if (destroyedFilter(plt) === false) flag = false;
-
- if (flag) {
- let tx = coords.x - bottomLeft.x;
- let ty = coords.y - bottomLeft.y;
- tx = Math.floor(tx / smallLength);
- ty = Math.floor(ty / smallLength);
-
- let value = tx * number + ty;
- let newItem = item;
- newItem.mark = value;
- planetLocationsWithMark.push(newItem);
- planetsCount++;
- }
- });
-
- planetLocationsWithMark = planetLocationsWithMark.sort((a, b) => a.mark - b.mark);
-
- let stack = [];
-
- for (let i = 0; i < planetLocationsWithMark.length; i++) {
- let item = planetLocationsWithMark[i];
- let mark = item.mark;
- let rhs = {};
- rhs.biomebase = item.biomebase;
- rhs.coords = item.coords;
- rhs.hash = item.hash;
- rhs.perlin = item.perlin;
-
- stack.push(rhs);
-
- if ((i === planetLocationsWithMark.length - 1) ||
- (i + 1 < planetLocationsWithMark.length &&
- planetLocationsWithMark[i].mark != planetLocationsWithMark[i + 1].mark)
- ) {
-
- let newChunk = {};
- newChunk.chunkFootprint = {};
-
- let tx = Math.floor(mark / number) * smallLength;
- let ty = (mark - number * Math.floor(mark / number)) * smallLength;
- tx += bottomLeft.x;
- ty += bottomLeft.y;
- let coords = { x: tx, y: ty };
- newChunk.chunkFootprint.bottomLeft = coords;
- newChunk.chunkFootprint.sideLength = smallLength;
- newChunk.perlin = chunkPerlin;
- let notCnt = 0;
- for (let j = 0; j < stack.length; j++) {
- let pltCoords = stack[j].coords;
- if (pltCoords.x >= tx && pltCoords.x < tx + smallLength && pltCoords.y >= ty && pltCoords.y < ty + smallLength);
- else notCnt++;
- }
-
- //notice: normally notCnt===0
- if (notCnt !== 0) console.error('notCnt:' + notCnt);
-
- newChunk.planetLocations = stack;
- if (stack.length !== 0) {
- res.push(newChunk);
- stack = [];
- }
- }
- }
- }
-
- let newInfo = html`
-
export ${planetsCount} planets
-
${mapPixelsCnt} 16x16 pixel blocks before
-
${res.length} 16x16 pixel blocks now
-
Begin To Download Map Without Background
`;
- setInfo(newInfo);
- let newInfo2 = html`You may need to wait for a while...
`;
- setInfo2(newInfo2);
- // notice : sleep is to refresh page
- await sleep(100);
-
- let mapRaw = generateMapWithoutBackground();
- try {
- let map = JSON.stringify(mapRaw);
- var blob = new Blob([map], { type: 'application/json' }),
- anchor = document.createElement('a');
- let currentTime = getCurrentTime();
- anchor.download = df.getContractAddress().substring(0, 6) + '_' + currentTime + '_map.json';
- anchor.href = (window.webkitURL || window.URL).createObjectURL(blob);
- anchor.dataset.downloadurl = ['application/json', anchor.download, anchor.href].join(':');
- anchor.click();
- let newInfo = html`Download Map Successfully :-)
`;
- setInfo2(newInfo);
-
- } catch (err) {
- console.error(err);
- let newInfo = html`Download Map Error :-|
`;
- setInfo(newInfo);
- }
- }
-
- function generateMapWithBackground() {
- let chunks = ui.getExploredChunks();
- let chunksAsArray = Array.from(chunks);
-
- let planetsCount = 0;
-
- for (let i = 0; i < chunksAsArray.length; i++) {
- const chunk = chunksAsArray[i];
- let planetLocations = chunk.planetLocations;
-
- planetLocations = planetLocations.filter(item=>{
- const coords = item.coords;
- let plt = df.getPlanetWithCoords(coords);
- if(judgeLevel(plt)===false) return false;
- if(judgePlanetType(plt)===false) return false;
- if(judgeSpaceType(plt)===false) return false;
- if(judgeOwner(plt)===false) return false;
- if(destroyedFilter(plt)===false) return false;
- return true;
- });
-
- chunksAsArray[i].planetLocations = planetLocations;
- planetsCount+=planetLocations.length;
- }
-
- let newInfo = html`
-
export ${planetsCount} planets
-
Begin To Download Map With Background
`;
- setInfo(newInfo);
- let newInfo2 = html`You may need to wait for a while...
`;
- setInfo2(newInfo2);
- // notice : sleep is to refresh page
- await sleep(100);
-
- let mapRaw = generateMapWithBackground();
- try {
- let map = JSON.stringify(mapRaw);
- var blob = new Blob([map], { type: 'application/json' }),
- anchor = document.createElement('a');
- let currentTime = getCurrentTime();
- anchor.download = df.getContractAddress().substring(0, 6) + '_' + currentTime + '_map.json';
- anchor.href = (window.webkitURL || window.URL).createObjectURL(blob);
- anchor.dataset.downloadurl = ['application/json', anchor.download, anchor.href].join(':');
- anchor.click();
- let newInfo = html`Download Map Successfully :-)
`;
- setInfo2(newInfo);
-
- } catch (err) {
- console.error(err);
- let newInfo = html`Download Map Error :-|
`;
- setInfo(newInfo);
- }
- }
-
-
-
-
- async function processMap(input) {
- let chunks;
- try {
- chunks = JSON.parse(input);
-
- } catch (err) {
- console.error(err);
- let newInfo = html`Invalid map data. Check the data in your file.
`;
- setInfo(newInfo);
- return;
- }
-
- let newInfo = html`Importing, this will take a while...
`;
- setInfo(newInfo);
- try {
- await df.bulkAddNewChunks(chunks)
- let newInfo = html`Successfully imported map :-)
`;
- setInfo(newInfo);
- } catch (err) {
- console.error(err);
- let newInfo = html`Encountered an unexpected error :-(
`;
- setInfo(newInfo);
- }
- }
-
- let onUpload = async () => {
- let newInfo = html`Begin To Upload
`;
- setInfo(newInfo);
- let newInfo2 = html`You may need to wait For a while...
`;
- setInfo2(newInfo2);
-
- let inputFile = document.createElement('input');
- inputFile.type = 'file';
- inputFile.onchange = () => {
- try {
- var file = inputFile.files.item(0);
- var reader = new FileReader();
- reader.onload = () => {
- processMap(reader.result);
- };
- reader.readAsText(file);
-
- newInfo2 = html`NOTICE: Filter Functions Only Used In Download!
`;
- setInfo2(newInfo2);
-
- } catch (err) {
- console.error(err);
- let newInfo = html`Unable to upload map :-(
`;
- setInfo(newInfo);
- setInfo2('');
- return;
- }
- }
- inputFile.click();
- }
-
- let updatePlanets = () => {
- showPlanets = Array.from(df.getAllPlanets())
- .filter(destroyedFilter)
- .filter(judgeLevel)
- .filter(judgeOwner)
- .filter(judgeSpaceType);
- }
-
- let clearPlanets = () => {
- showPlanets = [];
- }
-
- // css style
- let divStyle = {
- textAlign: 'center',
- justifyContent: "space-around",
- width: "100%",
- marginTop: "10px",
- };
-
- let buttonStyle = { height: "25px", width: "130px" };
-
- let longButtonStyle = { height: "25px", width: "300px" };
- let selectStyle = {
- background: "rgb(8,8,8)",
- width: "100px",
- padding: "3px 5px",
- border: "1px solid white",
- borderRadius: "3px",
- };
-
- let planetLevelStyle = {
- marginTop: "5px",
- marginBottom: "5px"
- };
-
- // Component
- const leftLevelSelect = html`
-
- `;
- const rightLevelSelect = html`
-
- `;
-
- let levelComponent = html`
- ${leftLevelSelect}
- ${' '}
- ${rightLevelSelect}
-
`;
-
- let thePlanetComponent = html`
- setHasPlanet(!hasPlanet)}/>
- ${' Planet'}
`;
-
- let theAsteroidFiledComponent = html`
- setHasAsteroidField(!hasAsteroidField)}/>
- ${' AsteroidField'}
`;
-
- let theFoundryComponent = html`
- setHasFoundry(!hasFoundry)}/>
- ${' Foundry'}
`;
-
- let theSpacetimeRipComponent = html`
- setHasSpacetimeRip(!hasSpacetimeRip)}/>
- ${' SpacetimeRip'}
`;
-
- let theQuasarComponent = html`
- setHasQuasar(!hasQuasar)}/>
- ${' Quasar'}
`;
-
- let planetTypeComponent = html`
-
- ${thePlanetComponent}
- ${theAsteroidFiledComponent}
- ${theFoundryComponent}
- ${theSpacetimeRipComponent}
- ${theQuasarComponent}
-
- `;
-
- let theBlackSpaceComponent = html`
- setOhBlackSpace(!ohBlackSpace)}/>
- ${' Black'}
`;
-
- let theGreenSpaceComponent = html`
- setOhGreenSpace(!ohGreenSpace)}/>
- ${' Green'}
`;
-
- let theBlueSpaceComponent = html`
- setOhBlueSpace(!ohBlackSpace)}/>
- ${' Blue'}
`;
- let theDarkblueSpaceComponent = html`
- setOhDarkblueSpace(!ohDarkblueSpace)}/>
- ${' Darkblue'}
`;
-
- let spaceTypeComponent = html`
-
-
- ${theBlackSpaceComponent}
- ${theGreenSpaceComponent}
- ${theBlueSpaceComponent}
- ${theDarkblueSpaceComponent}
-
`;
-
- let ownerComponent = html`
-
- setOnlyMe(!onlyMe)}/>
-
- ${' All '}
- setOnlyMe(!onlyMe)}/>
- ${' Me '}
-
`;
-
- return html`
- ${levelComponent}
-
- ${planetTypeComponent}
- ${ownerComponent}
- ${spaceTypeComponent}
-
-
-
-
-
-
-
-
-
-
-
-
-
- ${' '}
-
-
-
-
- ${info}
- ${info2}
-
+
export ${planetsCount} planets
+
${mapPixelsCnt} 16x16 pixel blocks before
+
${res.length} 16x16 pixel blocks now
+
Begin To Download Map Without Background
`;
+ setInfo(newInfo);
+ let newInfo2 = html`You may need to wait for a while...
`;
+ setInfo2(newInfo2);
+ // notice : sleep is to refresh page
+ await sleep(100);
+
+ let mapRaw = generateMapWithoutBackground();
+ try {
+ let map = JSON.stringify(mapRaw);
+ var blob = new Blob([map], { type: 'application/json' }),
+ anchor = document.createElement('a');
+ let currentTime = getCurrentTime();
+ anchor.download = df.getContractAddress().substring(0, 6) + '_' + currentTime + '_map.json';
+ anchor.href = (window.webkitURL || window.URL).createObjectURL(blob);
+ anchor.dataset.downloadurl = ['application/json', anchor.download, anchor.href].join(':');
+ anchor.click();
+ let newInfo = html`Download Map Successfully :-)
`;
+ setInfo2(newInfo);
+
+ } catch (err) {
+ console.error(err);
+ let newInfo = html`Download Map Error :-|
`;
+ setInfo(newInfo);
+ }
+ }
+
+ function generateMapWithBackground() {
+ let chunks = ui.getExploredChunks();
+ let chunksAsArray = Array.from(chunks);
+
+ let planetsCount = 0;
+
+
+
+ let res = [];
+
+ for (let i = 0; i < chunksAsArray.length; i++) {
+ const chunk = chunksAsArray[i];
+ const planetLocations = chunk.planetLocations;
+ let planetLocationsWithMark = [];
+ let newChunk = {};
+ newChunk.chunkFootprint = {};
+ newChunk.chunkFootprint.bottomLeft = chunk.chunkFootprint.bottomLeft;
+ newChunk.chunkFootprint.sideLength = chunk.chunkFootprint.sideLength;
+ newChunk.perlin = chunk.perlin;
+
+
+ planetLocations.forEach(item=>{
+ const coords = item.coords;
+ let plt = df.getPlanetWithCoords(coords);
+ let flag = true;
+ if(judgeLevel(plt)===false) flag = false;
+ if(judgePlanetType(plt)===false) flag = false;
+ if(judgeSpaceType(plt)===false) flag = false;
+ if(judgeOwner(plt)===false) flag = false;
+ if(destroyedFilter(plt)===false) flag = false;
+ if(flag){
+ planetLocationsWithMark.push(item);
+
+ }
+ });
+
+ newChunk.planetLocations = planetLocationsWithMark;
+ res.push(newChunk);
+ planetsCount+=planetLocationsWithMark.length;
+ }
+
+ let newInfo = html`
+
export ${planetsCount} planets
+
Begin To Download Map With Background
`;
+ setInfo(newInfo);
+ let newInfo2 = html`You may need to wait for a while...
`;
+ setInfo2(newInfo2);
+ // notice : sleep is to refresh page
+ await sleep(100);
+
+ let mapRaw = generateMapWithBackground();
+ try {
+ let map = JSON.stringify(mapRaw);
+ var blob = new Blob([map], { type: 'application/json' }),
+ anchor = document.createElement('a');
+ let currentTime = getCurrentTime();
+ anchor.download = df.getContractAddress().substring(0, 6) + '_' + currentTime + '_map.json';
+ anchor.href = (window.webkitURL || window.URL).createObjectURL(blob);
+ anchor.dataset.downloadurl = ['application/json', anchor.download, anchor.href].join(':');
+ anchor.click();
+ let newInfo = html`Download Map Successfully :-)
`;
+ setInfo2(newInfo);
+
+ } catch (err) {
+ console.error(err);
+ let newInfo = html`Download Map Error :-|
`;
+ setInfo(newInfo);
+ }
+ }
+
+
+
+
+ async function processMap(input) {
+ let chunks;
+ try {
+ chunks = JSON.parse(input);
+
+ } catch (err) {
+ console.error(err);
+ let newInfo = html`Invalid map data. Check the data in your file.
`;
+ setInfo(newInfo);
+ return;
+ }
+
+ let newInfo = html`Importing, this will take a while...
`;
+ setInfo(newInfo);
+ try {
+ await df.bulkAddNewChunks(chunks)
+ let newInfo = html`Successfully imported map :-)
`;
+ setInfo(newInfo);
+ } catch (err) {
+ console.error(err);
+ let newInfo = html`Encountered an unexpected error :-(
`;
+ setInfo(newInfo);
+ }
+ }
+
+ let onUpload = async () => {
+ let newInfo = html`Begin To Upload
`;
+ setInfo(newInfo);
+ let newInfo2 = html`You may need to wait For a while...
`;
+ setInfo2(newInfo2);
+
+ let inputFile = document.createElement('input');
+ inputFile.type = 'file';
+ inputFile.onchange = () => {
+ try {
+ var file = inputFile.files.item(0);
+ var reader = new FileReader();
+ reader.onload = () => {
+ processMap(reader.result);
+ };
+ reader.readAsText(file);
+
+ newInfo2 = html`NOTICE: Filter Functions Only Used In Download!
`;
+ setInfo2(newInfo2);
+
+ } catch (err) {
+ console.error(err);
+ let newInfo = html`Unable to upload map :-(
`;
+ setInfo(newInfo);
+ setInfo2('');
+ return;
+ }
+ }
+ inputFile.click();
+ }
+
+ let updatePlanets = () => {
+ showPlanets = Array.from(df.getAllPlanets())
+ .filter(destroyedFilter)
+ .filter(judgeLevel)
+ .filter(judgeOwner)
+ .filter(judgeSpaceType);
+ }
+
+ let clearPlanets = () => {
+ showPlanets = [];
+ }
+
+ // css style
+ let divStyle = {
+ textAlign: 'center',
+ justifyContent: "space-around",
+ width: "100%",
+ marginTop: "10px",
+ };
+
+ let buttonStyle = { height: "25px", width: "130px" };
+
+ let longButtonStyle = { height: "25px", width: "300px" };
+ let selectStyle = {
+ background: "rgb(8,8,8)",
+ width: "100px",
+ padding: "3px 5px",
+ border: "1px solid white",
+ borderRadius: "3px",
+ };
+
+ let planetLevelStyle = {
+ marginTop: "5px",
+ marginBottom: "5px"
+ };
+
+ // Component
+ const leftLevelSelect = html`
+
+ `;
+ const rightLevelSelect = html`
+
+ `;
+
+ let levelComponent = html`
+ ${leftLevelSelect}
+ ${' '}
+ ${rightLevelSelect}
+
`;
+
+ let thePlanetComponent = html`
+ setHasPlanet(!hasPlanet)}/>
+ ${' Planet'}
`;
+
+ let theAsteroidFiledComponent = html`
+ setHasAsteroidField(!hasAsteroidField)}/>
+ ${' AsteroidField'}
`;
+
+ let theFoundryComponent = html`
+ setHasFoundry(!hasFoundry)}/>
+ ${' Foundry'}
`;
+
+ let theSpacetimeRipComponent = html`
+ setHasSpacetimeRip(!hasSpacetimeRip)}/>
+ ${' SpacetimeRip'}
`;
+
+ let theQuasarComponent = html`
+ setHasQuasar(!hasQuasar)}/>
+ ${' Quasar'}
`;
+
+ let planetTypeComponent = html`
+
+ ${thePlanetComponent}
+ ${theAsteroidFiledComponent}
+ ${theFoundryComponent}
+ ${theSpacetimeRipComponent}
+ ${theQuasarComponent}
+
+ `;
+
+ let theBlackSpaceComponent = html`
+ setOhBlackSpace(!ohBlackSpace)}/>
+ ${' Black'}
`;
+
+ let theGreenSpaceComponent = html`
+ setOhGreenSpace(!ohGreenSpace)}/>
+ ${' Green'}
`;
+
+ let theBlueSpaceComponent = html`
+ setOhBlueSpace(!ohBlackSpace)}/>
+ ${' Blue'}
`;
+ let theDarkblueSpaceComponent = html`
+ setOhDarkblueSpace(!ohDarkblueSpace)}/>
+ ${' Darkblue'}
`;
+
+ let spaceTypeComponent = html`
+
+
+ ${theBlackSpaceComponent}
+ ${theGreenSpaceComponent}
+ ${theBlueSpaceComponent}
+ ${theDarkblueSpaceComponent}
+
`;
+
+ let ownerComponent = html`
+
+ setOnlyMe(!onlyMe)}/>
+
+ ${' All '}
+ setOnlyMe(!onlyMe)}/>
+ ${' Me '}
+
`;
+
+ return html`
+ ${levelComponent}
+
+ ${planetTypeComponent}
+ ${ownerComponent}
+ ${spaceTypeComponent}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ${' '}
+
+
+
+
+ ${info}
+ ${info2}
+