From 466b7e654f63244bd4e596960c1ff352786256fc Mon Sep 17 00:00:00 2001 From: gdamms Date: Fri, 13 May 2022 14:20:55 +0200 Subject: [PATCH] feat: pixels color js ca avance --- src/front/index.html | 4 ++-- src/front/pixels.js | 50 +++++++++++++++++++------------------------- 2 files changed, 24 insertions(+), 30 deletions(-) diff --git a/src/front/index.html b/src/front/index.html index d74890c..7fa1c25 100644 --- a/src/front/index.html +++ b/src/front/index.html @@ -15,6 +15,7 @@ document.getElementById("show-signup").checked = s; } + @@ -806,7 +807,6 @@ - - \ No newline at end of file + diff --git a/src/front/pixels.js b/src/front/pixels.js index 65fb37a..3d9dbf4 100644 --- a/src/front/pixels.js +++ b/src/front/pixels.js @@ -1,31 +1,25 @@ -debugger; +var xmlhttp = new XMLHttpRequest(); +var url = "http://localhost:8080/api/pixel"; -function readTextFile(file) -{ - var rawFile = new XMLHttpRequest(); - rawFile.open("GET", file, false); - rawFile.onreadystatechange = function () - { - if(rawFile.readyState === 4) - { - if(rawFile.status === 200 || rawFile.status == 0) - { - var allText = rawFile.responseText; - alert(allText); - } - } +xmlhttp.onreadystatechange = function() { + if (this.readyState == 4 && this.status == 200) { + var json = JSON.parse(this.responseText); + setPixels(json); + } +}; +xmlhttp.open("GET", url, true); +xmlhttp.send(); + +function setPixels(json) { + console.log(json); + + var table = document.getElementById("pixelTable"); + var num_columns = table.rows[0].cells.length; + + for (i in json) { + var pixel = json[i] + console.log(pixel) + var cell = table.rows[Math.floor((pixel.id - 1) / num_columns)].cells[(pixel.id - 1) % num_columns]; + cell.style.background = pixel.color; } - rawFile.send(null); -} - -// fetch("https://URL/file").then((r)=>{r.text().then((d)=>{let json = d})}) -const json = readTextFile("test.json"); -const obj = JSON.parse(json); - -var table = document.getElementById("pixelTable"); -var num_columns = table.rows[0].cells.length; - -for (pixel in obj) { - var cell = table.rows[Math.floor(pixel.id / num_columns)].cells[pixel.id % num_columns]; - cell.style.background = "#f00"; }