Mirrors/queerallyear
2
0
Fork 0
mirror of https://github.com/lenaschimmel/queerallyear synced 2024-11-10 05:54:13 +00:00
Code Issues Projects Releases Packages Wiki Activity

Ability to define own color values.

Browse source
This commit is contained in:
Lena Schimmel 2019-06-29 19:28:46 +02:00
parent b687fded79
commit 97af4e4723
2 changed files with 22 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
node/tool/browser.js
View file

@ -128,10 +128,10 @@ window.queer.initColors = function() {
for (let l = 0; l < 100; l+= 15) {
var color = colorLib.hsl(0,0,l);
id = "color" + color.hex().substring(1);
x += '<div class="cd" id="'+id+'" style="background-color:'+color+'" onclick="queer.activateColor(\''+id+'\');" />';
x += '<div class="cd '+id+'" style="background-color:'+color+'" onclick="queer.activateColor(\''+id+'\');" />';
}
x += " (Gray)</div>";
$("#colors").append(x);
$("#swatches").append(x);
for (const flagKey in flags.allFlags) {
if (flags.allFlags.hasOwnProperty(flagKey)) {
@ -148,16 +148,24 @@ window.queer.initColors = function() {
var x = "<div class='colorgroup'>";
for(const color in colors) {
id = "color" + color.substring(1);
x += '<div class="cd" id="'+id+'" style="background-color:'+color+'" onclick="queer.activateColor(\''+id+'\');" />';
x += '<div class="cd '+id+'" style="background-color:'+color+'" onclick="queer.activateColor(\''+id+'\');" />';
}
x += " ("+flagKey+")</div>";
$("#colors").append(x);
$("#swatches").append(x);
}
}
document.getElementById('owncolor').addEventListener("change", window.queer.ownColorChanged);
}
window.queer.activateColor = function(id) {
$(".cd").removeClass("active");
$("#" + id).addClass("active");
$("." + id).addClass("active");
activeColor = "#" + id.substring(5);
}
window.queer.ownColorChanged = function() {
$(".cd").removeClass("active");
activeColor = document.getElementById('owncolor').value;
console.log("Color selected: " + activeColor);
}

10
web/contents/design.fragment
View file

@ -63,11 +63,19 @@
<noscript>Die Vorschau erfordert Javascript. Der Download funtioniert auch ohne.</noscript>
<div id="colors" class="hidden">
<div id="swatches"></div>
<div style="clear:both; height:2em; display:block;"> </div>
Eigene Farbe: <input type="color" id="owncolor" name="owncolor" onchange="queer.ownColorChanged();"> (eventuell muss die Farbauswahl geschlossen werden, bevor die neue Farbe verwendet werden kann.)
<div>
<h1>Eigene Farbkombination bauen</h1>
<p>Wähle unten eine Farbe aus, und klicke auf die Buchstaben um sie entsprechend einzufärben.</p>
<p>Deine Farbauswahl wird lokal gespeichert, bis du deine Browsersitzung beendest.</p>
</div>
<div style="clear:both; height:2em; display:block;"> </div>
</div>
</div>
</div>
</div>