raphael/calendarwatch_frontend
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

adds writing the color as css attribute and then via jsqurey going through all of the class and adding this as background color

Browse Source
This commit is contained in:
Raphael Maenle 2020-04-15 18:47:41 +00:00
parent 04942268a6
commit c3f815939d
2 changed files with 17 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app.py
View File

@ -104,6 +104,7 @@ def calendarsFromDb():
calId = calendar[1]
toggle = calendar[3]
color = calendar[4]
pyCalendars.append(Calendar(name, toggle, color))
return pyCalendars

20
template/calendar.html
View File

@ -11,7 +11,7 @@
{% for item in calendars %}
<div style="height: 30px">
<!--Name-->
<div style="width: 30%; float: left; font-size: 24px; text-align: left; margin-left: 10%">{{ item.name }}</div>
<div style="width: 30%; float: left; font-size: 10px; text-align: left; margin-left: 10%">{{ item.name }}</div>
<!--Toggle-->
<div style="width: 30%; float: left">
@ -24,7 +24,7 @@
<!--Color Selector-->
<div style="width: 30%; float: left">
<div class="colorPickSelector" id={{item.name}}></div>
<div class="colorPickSelector" id={{item.name}} defaultColor={{item.color}}></div>
<!--svg height="20" width="20">
<circle cx="10" cy="10" r="10" stroke="black" stroke-width="0" fill={{ item.color }} />
</svg-->
@ -36,6 +36,8 @@
</div>
<script type="text/javascript">
$(".colorPickSelector").colorPick({
'initialColor': '#3498db',
'allowRecent': true,
@ -46,12 +48,22 @@
// Todo getting the element id is currently done over [0] [#02]
this.element.css({'backgroundColor': this.color, 'color': this.color});
console.log(this.element[0].id);
console.log(this.color);
post("color", this.element[0].id, this.color);
}
});
($(".colorPickSelector").each(function() {
console.log($( this )[0].attributes.getNamedItem("style"));
var color = $( this )[0].attributes.getNamedItem("defaultcolor").nodeValue;
var style = document.createAttribute("style");
style.value = 'background-color: ' + color + '; color: ' + color + ';';
$( this )[0].attributes.setNamedItem(style);
console.log($( this )[0].attributes.getNamedItem("style"));
}));
function post(type, id, data) {
var url = "https://192.168.68.103.xip.io:1234/calendar";
var method = "POST";