JavaScript
var canvas = document.getElementById("canvas");
var HorizOrVert = prompt("Horizontal design or Vertical Design?")
var color = prompt("Name a color for the head of your countryball.")
var color2 = prompt("Name a color for the torso of your countryball.")
var color3 = prompt("Name a color for the bottom of your countryball.")
var leftEye = prompt("Name a color for the left eye.")
var rightEye = prompt("Name a color for your right eye")
// get canvas 2D context and set it to the correct size
var ctx = canvas.getContext("2d");
ctx.scale(15, 15);
if(HorizOrVert === "Horizontal"){
const okpolandball = [
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
[0, 0, 0, 1, 1, 4, 4, 4, 4, 4, 1, 1, 0, 0, 0],
[0, 0, 1, 4, 4, 4, 4, 4, 4, 4, 4, 4, 1, 0, 0],
[0, 1, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 1, 0],
[0, 1, 4, 1, 1, 1, 4, 4, 4, 1, 1, 1, 4, 1, 0],
[1, 2, 1, 6, 6, 6, 1, 2, 1, 5, 5, 5, 1, 2, 1],
[1, 2, 1, 6, 6, 6, 1, 2, 1, 5, 5, 5, 1, 2, 1],
[1, 2, 1, 6, 6, 6, 1, 2, 1, 5, 5, 5, 1, 2, 1],
[1, 2, 2, 1, 1, 1, 2, 2, 2, 1, 1, 1, 2, 2, 1],
[1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1],
[0, 1, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 1, 0],
[0, 1, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 1, 0],
[0, 0, 1, 3, 3, 3, 3, 3, 3, 3, 3, 3, 1, 0, 0],
[0, 0, 0, 1, 1, 3, 3, 3, 3, 3, 1, 1, 0, 0, 0],
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
];
okpolandball.forEach((row, y) => {
row.forEach((value, x) => {
if(value === 1) {
ctx.fillStyle = 'black';
ctx.fillRect(x, y, 1, 1)
}
if(value === 4){
ctx.fillStyle = color;
ctx.fillRect(x, y, 1, 1)
}
if(value === 2){
ctx.fillStyle = color2;
ctx.fillRect(x, y, 1, 1)
}
if(value === 3){
ctx.fillStyle = color3;
ctx.fillRect(x, y, 1, 1)
}
if(value === 6){
ctx.fillStyle = leftEye;
ctx.fillRect(x, y, 1, 1)
}
if(value === 5){
ctx.fillStyle = rightEye;
ctx.fillRect(x, y, 1, 1)
}
})
})
}else if(HorizOrVert === "Vertical"){
const okpolandball = [
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
[0, 0, 0, 1, 1, 2, 2, 2, 2, 2, 1, 1, 0, 0, 0],
[0, 0, 1, 4,...