let NeomojiMixer = (function(NeomojiMixer) {
//global variables
//Arrays to hold the parts
let eyes = [];
let body = [];
let mouth = [];
let arms = [];
//FOr all the different colours of the arms there will be each a own arraz
let arms_orange = [];
let arms_blue = [];
let arms_lightgrey = [];
let arms_red = [];
let arms_white = [];
let arms_yellow = [];
//Index to easily find when to roll back to the first/last element in the list
let inex_eyes = 0;
let index_body = 0;
let index_mouth = 0;
let index_arms = 0;
let index_color = 0;
//shotnames for HTML elements to interact with
//images
const body_image = document.getElementById("body_img");
const eyes_image = document.getElementById("eyes_img");
const mouth_image = document.getElementById("mouth_img");
const arms_image = document.getElementById("arms_img");
const canvas = document.getElementById("canvas_export");
const export_img = document.getElementById("imageExport");
const neomoji_name = document.getElementById("fullNeomojiName");
//names
const body_name = document.getElementById("body_name");
const eyes_name = document.getElementById("eyes_name");
const mouth_name = document.getElementById("mouth_name");
const arms_name = document.getElementById("arms_name");
//Stats
const stats = document.getElementById("stats");
// Loading the JSON and getting all the available parts
async function getData() {
fetch('./parts.json')
.then(function(response) {
return response.json();
})
.then(function(data) {
loadParts(data);
})
.catch(function(error) {
console.log('An error occurred:', error);
});
}
function loadParts(parts) {
//Load parts into Arrays
parts.type.eyes.forEach(fillArrayEyes);
parts.type.body.forEach(fillArrayBody);
parts.type.mouth.forEach(fillArrayMouth);
parts.type.arms.forEach(fillArrayArms);
//find the indexes of each part of the corresponding color and write those into the color arrays
fillArraysArms();
//Randomize initial view
randomize();
//Show little statistic
var sum = body.length + eyes.length + mouth.length + arms.length;
var variety = body.length * eyes.length * mouth.length * arms_orange.length;
stats.innerHTML = "There are " + sum + " Elements available,
with " + new Intl.NumberFormat("de-DE").format(variety) + " possible combinations.";
//Activate the buttons after everything is loaded in
document.getElementById("body_left").disabled = false;
document.getElementById("body_right").disabled = false;
document.getElementById("eyes_left").disabled = false;
document.getElementById("eyes_right").disabled = false;
document.getElementById("mouth_left").disabled = false;
document.getElementById("mouth_right").disabled = false;
document.getElementById("arms_left").disabled = false;
document.getElementById("arms_right").disabled = false;
document.getElementById("random").disabled = false;
document.getElementById("export").disabled = false;
}
function fillArrayEyes(item) {
let name = item.name;
let url = item.url;
eyes.push ([name, url]); //Two dimensional array, Second dimension holds name on index 0 and url at index 1
}
function fillArrayBody(item) {
let name = item.name;
let url = item.url;
let color = item.color;
body.push ([name, url, color]); //Two dimensional array, Second dimension holds name on index 0 and url at index 1
}
function fillArrayMouth(item) {
let name = item.name;
let url = item.url;
mouth.push ([name, url]); //Two dimensional array, Second dimension holds name on index 0 and url at index 1
}
function fillArrayArms(item) {
let name = item.name;
let url = item.url;
let color = item.color;
arms.push ([name, url, color]); //Two dimensional array, Second dimension holds name on index 0 and url at index 1
}
function fillArraysArms() {
for (let i=0; i