From 18a4b4f42853c0a4342b840db21e9fd2b4fb0765 Mon Sep 17 00:00:00 2001 From: Ovidiu Alexandru Toma Date: Tue, 9 Oct 2018 15:31:11 +0300 Subject: [PATCH 1/5] hotfix/add_color - wip --- .DS_Store | Bin 0 -> 6148 bytes assets/app.js | 15 ++++++++++++++- index.html | 4 ++-- 3 files changed, 16 insertions(+), 3 deletions(-) create mode 100644 .DS_Store diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..8806480b739dd419689d5f30aee94d2d7e87205a GIT binary patch literal 6148 zcmeHK-EPw`6h7X{<^~}ugtT4e28oMlY8fyggcQ2=q7ooP5L^K25)#%-X;L*Q0ZLJB zcn9DOcod$12jKzW^H0&5!0p74Pj&pA*ypq3ud*Ez5$n!^4pEDUI9y=ELh%O^?ZRue zrfWnalYQir4dV2rAE$mT+f*0@i~|3f0%GlMkVhGQA+4@ou_@e!U;QafzPd#bB@`g{ z4einhj4{P0*1X_+t#CH!9u4S#`t*QY>aS+AtxEPK+5ead8p0!*VyssvJ&Y7$%ww9+ zQKgTMl|GvE2&3Jl9^D7-f*Dj8KPn84nS{ujP>hifujWe~KAq5^mhTtYMDKgw{7D>T zdAt3ct*tlCZESLGaqEKh!X2fBn|t{z>w42?;_0E6k9-|JPSf~z?DS~ zeCtZ*&fswT_TBvb;=^Z%0Atv^rCrpxgf9qc6MgMYlQ>O|(6;0)^9`OU1@zy?&!4Hc zHZN-wFbbT80%Cu#;Q}3vr9!!NppaJpU<1|C5Q|R$!Lc5-Yfp)ff*`nP2|F-M^(jRHo2RRz}7V@sU>{lDM;S4rl{C}0%$ zuM}X7p4;nUO8RWAO-`J(HvAASOyrdcB?W~(j%6T@;%&GzwAms6IvPubsDYUe0V#ti Ji~^^sz%O=1rB?s| literal 0 HcmV?d00001 diff --git a/assets/app.js b/assets/app.js index 5e90e89..e616068 100644 --- a/assets/app.js +++ b/assets/app.js @@ -8,7 +8,14 @@ var getTemplateHtml = template => { }) .then(function(html) { document.getElementById('iframe').contentWindow.document.write(html); - console.log(document.getElementById('iframe').contentWindow.document) + // console.log(document.getElementById('iframe').contentWindow.document) + + var elements = document.getElementById('iframe').contentWindow.document.querySelectorAll("body *"); + var numElements = elements.length; + var i; + for (i = 0; i < numElements; i++) { + elements[i].addEventListener("click", addColorTrigger); + } }); } @@ -18,6 +25,12 @@ var valueChange = value => { iframehtml.innerHTML = val } +var addColorTrigger = (e) => { + console.log("click"); + console.log(e.currentTarget); + +} + var downloadPage = () => { var pageContents = new XMLSerializer().serializeToString(document.getElementById('iframe').contentWindow.document) pageContents = pageContents.replace("rep_DEVNAME", document.getElementById("devname").value) diff --git a/index.html b/index.html index 750cdc0..a29fedd 100644 --- a/index.html +++ b/index.html @@ -22,11 +22,11 @@ - +

Values

From c7b784b1266ff3beb16c4ea938ecbed96a5f6546 Mon Sep 17 00:00:00 2001 From: Ovidiu Alexandru Toma Date: Wed, 10 Oct 2018 18:13:38 +0300 Subject: [PATCH 2/5] adds implementation --- assets/app.js | 40 +++++++++++++++++++++++++++------------- index.html | 5 +++-- template/color_test.html | 31 +++++++++++++++++++++++++++++++ 3 files changed, 61 insertions(+), 15 deletions(-) create mode 100644 template/color_test.html diff --git a/assets/app.js b/assets/app.js index e616068..7a597df 100644 --- a/assets/app.js +++ b/assets/app.js @@ -1,6 +1,6 @@ console.log("app.js loaded"); -var getTemplateHtml = template => { +var getTemplateHtml = (template, primary_color="#ffffff", secondary_color="#ffffff") => { document.getElementById('iframe').src = "about:blank"; fetch('template/'+template+'.html') .then(function(response) { @@ -9,28 +9,42 @@ var getTemplateHtml = template => { .then(function(html) { document.getElementById('iframe').contentWindow.document.write(html); // console.log(document.getElementById('iframe').contentWindow.document) + primary_elements = document.getElementById('iframe').contentWindow.document.getElementsByClassName("primary_color"); + applyColor(primary_elements, primary_color); - var elements = document.getElementById('iframe').contentWindow.document.querySelectorAll("body *"); - var numElements = elements.length; - var i; - for (i = 0; i < numElements; i++) { - elements[i].addEventListener("click", addColorTrigger); - } + secondary_elements = document.getElementById('iframe').contentWindow.document.getElementsByClassName("secondary_color"); + applyColor(secondary_elements, secondary_color); + document.getElementById("primary").value = primary_color + document.getElementById("secondary").value = secondary_color }); } +var changeColor = (el) => { + color = el.value + iframe_doc = document.getElementById('iframe').contentWindow.document + if(el.id == "primary") + { + divs = iframe_doc.getElementsByClassName("primary_color") + } + else + { + divs = iframe_doc.getElementsByClassName("secondary_color") + } + applyColor(divs, color); +} + +var applyColor = (elements, color) => { + var i; + for (i = 0; i < elements.length; i++) { + elements[i].style["background-color"] = color; + } +} var valueChange = value => { var iframehtml = document.getElementById('iframe').contentWindow.document.getElementById(value); val = document.getElementById(value).value; iframehtml.innerHTML = val } -var addColorTrigger = (e) => { - console.log("click"); - console.log(e.currentTarget); - -} - var downloadPage = () => { var pageContents = new XMLSerializer().serializeToString(document.getElementById('iframe').contentWindow.document) pageContents = pageContents.replace("rep_DEVNAME", document.getElementById("devname").value) diff --git a/index.html b/index.html index a29fedd..f15a489 100644 --- a/index.html +++ b/index.html @@ -20,12 +20,13 @@ +

Colours

- - + +

Values

diff --git a/template/color_test.html b/template/color_test.html new file mode 100644 index 0000000..27b3918 --- /dev/null +++ b/template/color_test.html @@ -0,0 +1,31 @@ + + + + + rep_SNAME + + + + + + + + + +
+

rep_SNAME will be back soon!

+
+

Sorry for the inconvenience but rep_URL is performing some maintenance at the moment. We’ll be back online shortly!

+

— rep_DEVNAME

+
+
+ + \ No newline at end of file From 1bf66ea5b8a53d3efa758e03ac7452e69d824053 Mon Sep 17 00:00:00 2001 From: Ovidiu Alexandru Toma Date: Thu, 11 Oct 2018 10:56:29 +0300 Subject: [PATCH 3/5] fixes js --- template/color_test.html | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/template/color_test.html b/template/color_test.html index 27b3918..62a6de9 100644 --- a/template/color_test.html +++ b/template/color_test.html @@ -21,10 +21,10 @@
-

rep_SNAME will be back soon!

+

rep_SNAME will be back soon!

-

Sorry for the inconvenience but rep_URL is performing some maintenance at the moment. We’ll be back online shortly!

-

— rep_DEVNAME

+

Sorry for the inconvenience but rep_URL is performing some maintenance at the moment. We’ll be back online shortly!

+

rep_DEVNAME

From 8869346b97637ce82af5004ba3ad4fc3dafac4d3 Mon Sep 17 00:00:00 2001 From: Ovidiu Alexandru Toma Date: Thu, 11 Oct 2018 12:31:09 +0300 Subject: [PATCH 4/5] indentation fix --- assets/app.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/assets/app.js b/assets/app.js index ad1de91..3bda0ae 100644 --- a/assets/app.js +++ b/assets/app.js @@ -37,12 +37,12 @@ const getTemplateHtml = (template, primary_color="#ffffff", secondary_color="#ff html = parseContent(html); document.getElementById('iframe').contentWindow.document.write(html); primary_elements = document.getElementById('iframe').contentWindow.document.getElementsByClassName("primary_color"); - applyColor(primary_elements, primary_color); + applyColor(primary_elements, primary_color); - secondary_elements = document.getElementById('iframe').contentWindow.document.getElementsByClassName("secondary_color"); - applyColor(secondary_elements, secondary_color); - document.getElementById("primary").value = primary_color - document.getElementById("secondary").value = secondary_color + secondary_elements = document.getElementById('iframe').contentWindow.document.getElementsByClassName("secondary_color"); + applyColor(secondary_elements, secondary_color); + document.getElementById("primary").value = primary_color + document.getElementById("secondary").value = secondary_color }); }; From cdf84a6643b6bb6ae93624330b5dae727e697562 Mon Sep 17 00:00:00 2001 From: Ovidiu Alexandru Toma Date: Mon, 15 Oct 2018 10:43:36 +0300 Subject: [PATCH 5/5] fixes text --- assets/app.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/app.js b/assets/app.js index 3bda0ae..df993f8 100644 --- a/assets/app.js +++ b/assets/app.js @@ -9,7 +9,7 @@ const getTemplates = () => { }) .then(function(templates) { populateTemplates(templates); - getTemplateHtml(templates[0].id); + getTemplateHtml(templates[0].id, templates[0].primary_color, templates[0].secondary_color); }); };