<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Test JavaScript</title>
</head>
<body>
<p>"JavaScript Test Page"</p>
<p>Open Console log</p>
<button id="button1">texture object 1</button><br>
<button id="button2">texture object 2</button>
<script>
let counters = {}; // Class
fetch("../csv/texture.csv")
.then((response) => {
return response.text();
})
.then((data) => {
let result = data.split(/\r?\n|\r/).map((e) => {
return e.split(",");
});
texture(result, 1);
texture(result, 2);
})
.catch((error) => {
console.log(error);
});
function texture(array, arrayNumber) {
counters[arrayNumber] = 0; //add object for taking counter log
// console.log(array);
// console.log(array[1]);
const button_click = document.getElementById('button' + String(arrayNumber)); //from HTML button id (button1, 2, ...)
// console.log(button_click);
button_click.addEventListener('click', () => {
console.log(array[arrayNumber][counters[arrayNumber]]);
if (counters[arrayNumber] == array[arrayNumber].length - 1) {
counters[arrayNumber] = -1;
}
counters[arrayNumber] += 1;
// console.log(counters);
})
}
</script>
</body>
</html>
tsubasa