minimapjs is a JS class ( library? eh i wouldn't go that far ) that allows you to generate a minimap representing the EE worlds. Best of all, it shouldn't break over time.
If while you use this and something breaks, please say so, I'll gladly provide help.
Here's the source code if you'd like to look at it, and if you'd like to include it in your own projects.
This is also in the public domain, just keep the header comments if you use/modify it at all, thank you!
Things it does:
Download https://raw.githubusercontent.com/EEJes … Colors.txt without JQuery
Caches said download so that you're not downloading that file every time you want to make a minimap
Makes a minimap
Different ways to parse map data so it can co-align more with your intents
▼Quick Start
Put this one first because who reads documentation unless they're stuck.
var map = [[[]]];
onMessage = function(message) {
switch(message.type) {
case "init": {
var canvas = document.querySelector("canvas");
canvas.width = message.getInt(18);
canvas.height = message.getInt(19);
var ctx = canvas.getContext("2d");
ctx.width = canvas.width;
ctx.height = canvas.height;
//using jsparse
//new minimapjs().generateMap(ctx, jsparse(message), l=>{});
//alternatively, if you'd like to store your world in a multidimensional array [][][]
var map = []; //init map
for(var i = 0; i < 2; i++) {
map.push([]);
for(var j = 0; j < message.getInt(18); j++) {
map[i].push([]);
for(var k = 0; k < message.getInt(19); k++) {
map[i][j].push([]);
}
}
}
jsparse(message).forEach((j) => { //jsparse just sets this world data for us
map[j.layer][j.x][j.y] = j;
});
new minimapjs("array").generateMap(ctx, map, function (l) {
console.log("This code executes when the minimap has been generated, or if there's an error.");
if (l === 1) {
console.log("Success!");
} else {
console.log("Failure!");
}
}
);
} break;
}
};
▼Reference code
var mjs = new minimapjs(); //make minimapjs
mjs.options.useCacheing = false; //chance cacheing
mjs.options.cacheTime = 31 * 24 * 60 * 60 * 1000 //cahcne cacheing time, in this case 31 days
mjs.addParseMethod("customParseMethod", function(e) {
///TODO: turn 'e' ( the data you'd pass to generateMap for map data ) into an array [] with properties x, y, id, and layer.
///See JSParse if you'd like an example of this format.
});
mjs.setParseMethod("customParseMethod"); //set your custom parse method if you want
//ctx is the canvas element,
//map is the map data ( this can be anything you'd like, as long as theres a proper parsing method for it available ( see above for adding and setting parse methods )
//callback has 1 parameter, and it's 1 if everything generated fine, otherwise it's null.
//Callback parameter isn't required.
mjs.generateMap(ctx, mapdata, function(l){ });
//generally you wouldn't use it, because generateMap does it for you
//ctx is the canvas, mapData is the map data ( will be parsed )
//parseCode is equivalent to mjs.parseCode
//parseMethod is equivalent to mjs.options.parseMethod
//callback returns 1 here
//Must specify a callback otherwise javascript will throw an error
mjs.drawMinimap(ctx, mapData, colors, parseCode, parseMethod, l=>{});
//This would parse the output of the GET request to https://raw.githubusercontent.com/EEJesse/EEBlocks/master/Colors.txt into an array where each key correspents to a variable with properties r, g, b, and a
mjs.parseColorList(resp);
//This performs a GET request to "https://raw.githubusercontent.com/EEJesse/EEBlocks/master/Colors.txt", and returns it.
//It also handles the cacheing feature.
//As soon as it gets some version of Colors.txt, it'll save it to "mjs.cache.colorList", so you can use that variable to get the color list ( not recommended )
mjs.getColors(resp => {
if(resp === null) { //failed
} else { //success
}
});
//it just returns a string.
mjs.getColors(c=>{
//Change a single color of the canvas
//'b' is the block, with the layer, x, y, and id properties.
//Please not that minimapjs doesn't store a copy of the map, so you should first check if the map data at layer, x, y has a background, and pass the background first then the foreground, or something along those lines.
mjs.updateMinimap(global.ctx, c, b);
});
▼Update Log
Update 1:
* Fixed a 1 charecter bug with the addParseMethod and setParseMethod
* Fixed bug not allowing you to not pass no function for the callback on generateMap
+ Added a variable cache for getColors
+ Added alpha/transparency support for it
+ Improved how uintToRgb works
+ Added a function to allow you to change a single pixel of the canvas
- No longer about to just define a canvas, have to define a canvas with stlye attribute background:#000; for images generated to look proper.
Clear your browser cache to use the update!
Release:
+ created, everything is added