I have had this function for a long time. I made it myself. For like half the time it wouldn't work at all, but then after a while I managed to fix it. However, this is not the reason this is here.
/*pixelPrint() is a function that allows you to print pixel art from specified data in a new format. This programming language is parsed into JavaScript and executed as so. You may take this function, but keep the credits.*/
function pixelPrint(indata){
/*
* The Flux Brothers
* Major_Flux and Minor_Flux
* June 2021 product
* pixelPrint 1.0
*
* Free license use only if these credits are
* included in this product. Removal of credits
* will void your free license of use until you
* return an exact copy of this license to this
* product. You may grab this out of anyone's
* project as long as they have this license on
* it and they didn't tinker with the code.
*
* Do not tinker with the code or you will null
* its ability to function assuming it does at
* all with your setup. Email Major_Flux or any
* person who knows him if you want to tinker
* with the code if your setup doesn't allow it
* to work so that a cross-browser/OS fix can be
* put up for others to benefit from.
*/
try{
var colors = indata.split(";");
var sizeData = colors[0];
var pixWidth;
var pixHeight;
if(sizeData.indexOf("*") == 1){
pixWidth = sizeData.split("*")[0];
pixHeight = sizeData.split("*")[1];
}else{
return("<p style='color: #ff0000'>Error: size data not valid</p>");
}
if(pixWidth.indexOf(" ") > 0 || pixHeight.indexOf(" ") > 0){
return("<p style='color: #ff0000'>Error: size data have spaces in them</p>");
}
var internals = "";
var colorKey = 0;
for(var y = 0; y < pixHeight; y++){
internals = internals + "<tr>";
for(var x = 0; x < pixWidth; x++){
colorKey++;
internals = internals + "<td style='background: " + colors[colorKey] + "; width: 5px; height: 5px; display: inline-block;'></td>";
}
internals = internals + "</tr>";
}
var outdata;
if(internals != "" && internals != null && internals != undefined && internals.indexOf("<") >= 0){
outdata = "<table cellSpacing='0px' class='pixelboard'>" + internals + "</table>";
}else{
outdata = "<p style='color: #ff0000'>Error: var internals is somehow empty</p>";
}
if(outdata != indata){
return(outdata);
}else{
throw("Data was not processed");
}
}catch(err){
alert(err);
}
}<p>This HTML is not part of any of the problem, just the JS. This HTML is to display what it does.</p>
<p>Usage: <code>[width]*[height];color;color...</code></p>
<p>Example: <code>2*2;#dddddd;#aaaaaa;#aaaaaa;#777777</code>, produces a 2 by 2 square with a pixelated outset effect to it.</p>
<p>Try it out below:</p>
<input id="code" type="text"/><button onclick="document.getElementById('result').innerHTML = pixelPrint(document.getElementById('code').value);">Try</button>
<div id="result">
</div>
<p>Do not worry about the chopped up rows, I am sure you can find a CSS-based fix when you put the free function on your website.</p>The reason I put it here is that the width cannot be a two or more digit number, limiting it to only 1-9. Can you please figure out what is going on?
