A New Chapter for MagicMirror: The Community Takes the Lead
Read the statement by Michael Teeuw here.
Read the statement by Michael Teeuw here.
read csv-data and put it in an array
-
and the parent-element itselfs get a 0 (null) as parent ?
-
@Perlchamp i usually don’t use it for wrapper, but yes… the routine would have to check and not set if parent null, same for id
-
doesn’t work (black screen) yet, BUT:
- the classes set in “” ?
- no use of appendchild ?
- the wrapper set in “” ?
i did :
- no
- correct
- no
question:
get i problems with this.create… because of “var self = this” ? -
my code (only table):
// create table var wrapper = this.createEl('table', "birthday-table", table , 0) //var wrapper = document.createElement("table"); //wrapper.className = 'table'; //wrapper.id = 'birthday-table'; // create header var tHeader = this.createEl('thead', "birthday-thead", thead , wrapper) //var tHeader = document.createElement("thead"); //tHeader.className = "thead"; //tHeader.id = "birthday-thead"; var headerTR = this.createEl('tr', "birthday-tr-head", tr-head , tHeader) //var headerTR = document.createElement("tr"); //headerTR.className = "tr-head"; //headerTR.id = "birthday-tr-head"; var headerTH = document.createElement("th"); //var headerTH = this.createEl('th', "birthday-th-head", th-head , headerTR) headerTH.colSpan = "2"; headerTH.scope = "col"; headerTH.innerHTML = " "; //headerTH.className = "th-head"; //headerTH.id = "birthday-th-head"; //headerTR.appendChild(headerTH); //tHeader.appendChild(headerTR); //wrapper.appendChild(tHeader); // Create TFOOT section -- currently used for debugging only var tFooter = this.createEl('tfoot', "birthday-tfood", tfoot , wrapper) //var tFooter = document.createElement('tfoot'); //tFooter.className = "tfoot"; //tFooter.id = "birthday-tfoot"; //var footerTR = document.createElement("tr"); var footerTR = this.createEl('tr', "birthday-tf-foot", tr-foot , tFooter) //footerTR.className = "tr-foot"; //footerTR.id = "birthday-tr-foot"; //var footerTD = document.createElement("td"); var footerTD = this.createEl('td', "birthday-td-foot", td-foot , footerTR) footerTD.colSpan ="2"; //footerTD.className = "td-foot"; //footerTD.id = "birthday-td-foot"; if (this.config.debugging) { footerTD.innerHTML = "Birthdaylist is currently in DEBUG mode! < br / > Please see console log."; } else { footerTD.innerHTML = " "; } //footerTR.appendChild(footerTD); //tFooter.appendChild(footerTR); //wrapper.appendChild(tFooter); // create TBODY section with day names var tBody = this.createEl('tBody', "birthday-tbody", tbody , wrapper) //var tBody = document.createElement("tBody"); //tBody.className = "tbody"; //tBody.id = "birthday-tbody"; for(var birthday of Object.keys(this.active_birthdays)) { for(var person of this.active_birthdays[birthday]) { //var m = document.createElement('div'); // create looped row section var bodyTR = this.createEl('tr', "birthday-tr-body", tr-body , tBody) //var bodyTR = document.createElement("tr"); //bodyTR.className = "tr-body"; //bodyTR.id = "birthday-tr-body"; var bodyTDimage = this.createEl('td', "birthday-td-image", td-image , bodyTR) //var bodyTDimage = document.createElement("td"); //bodyTDimage.className = "td-image"; //bodyTDimage.id = "birthday-td-image"; if (birthday.charAt(0) === "0") { birthday = birthday.replace("0",""); birthday = birthday.substring(0,1); } bodyTDimage.innerHTML = birthday.substring(0,2); var bodyTD = this.createEl('td', "birthday-td-body", td-body , bodyTDimage) //var bodyTD = document.createElement("td"); //bodyTD.className = "td-body"; //bodyTD.id = "birthday-td-body"; bodyTD.innerHTML = person.name + " < span class=\"age-span\" > " + person.age + " < /span > "; //m.innerText = birthday + ' ' + person.name + ' age=' + person.age; //wrapper.appendChild(m); //bodyTR.appendChild(bodyTDimage); //bodyTR.appendChild(bodyTD); //tBody.appendChild(bodyTR); //wrapper.appendChild(tBody); } }
-
@Perlchamp all except parent in quotes
tables parent is wrapper, wrappers parent is null/0
-
wrapper in quotes , too ?
-
@sdetweil if there is no data, then you still need to return something (empty div)
-
@Perlchamp wrapper is a div type, no id,class or parent
-
my code now does not work:
// create table var wrapper = this.createEl('table', "birthday-table", table , 0) // create header var tHeader = this.createEl('thead', "birthday-thead", thead , "") var headerTR = this.createEl('tr', "birthday-tr-head", tr-head , "tHeader") var headerTH = this.createEl('th', "birthday-th-head", th-head , "headerTR") headerTH.colSpan = "2"; headerTH.scope = "col"; headerTH.innerHTML = " "; // Create TFOOT section -- currently used for debugging only var tFooter = this.createEl('tfoot', "birthday-tfood", tfoot , "") var footerTR = this.createEl('tr', "birthday-tf-foot", tr-foot , "tFooter") var footerTD = this.createEl('td', "birthday-td-foot", td-foot , "footerTR") footerTD.colSpan ="2"; if (this.config.debugging) { footerTD.innerHTML = "Birthdaylist is currently in DEBUG mode! < br / > Please see console log."; } else { footerTD.innerHTML = " "; } // create TBODY section with day names var tBody = this.createEl('tBody', "birthday-tbody", tbody , "") for(var birthday of Object.keys(this.active_birthdays)) { for(var person of this.active_birthdays[birthday]) { // create looped row section var bodyTR = this.createEl('tr', "birthday-tr-body", tr-body , "tBody") var bodyTDimage = this.createEl('td', "birthday-td-image", td-image , "bodyTR") if (birthday.charAt(0) === "0") { birthday = birthday.replace("0",""); birthday = birthday.substring(0,1); } bodyTDimage.innerHTML = birthday.substring(0,2); var bodyTD = this.createEl('td', "birthday-td-body", td-body , "bodyTDimage") bodyTD.innerHTML = person.name + " < span class=\"age-span\" > " + person.age + " < /span > "; } }
-
@Perlchamp said in read csv-data and put it in an array:
", thead ,
again all classes in quotes, ONLY parent NOT in quotes
var wrapper = this.createEl('table', "birthday-table", "table" , null) var tHeader = this.createEl('thead', "birthday-thead", "thead" , wrapper ) var headerTR = this.createEl('tr', "birthday-tr-head", "tr-head" , tHeader) var headerTH = this.createEl('th', "birthday-th-head", "th-head" , headerTR)