Read the statement by Michael Teeuw here.
read csv-data and put it in an array
-
bloody nice dreams, sam
-
hi sam, for me it’s a milestone :
// type: td, id: id of element, className: classname of element // parent: parent of element, value: value createEl : function (type, id, className, parent, value) { var el= document.createElement(type); if(id) el.id = id; if(className) el.className = className; if(parent) parent.appendChild(el); if(value) el.appendChild(document.createTextNode(value)); return el; }, // creates a tableheader with columnnaes createTableHeader: function(parent, className, columnlabels) { var header = document.createElement("tr"); for(columnName of columnlabels) { this.createEl("th", null, className, header, columnName); } parent.appendChild(header); return header; }, // creates a tablefooter with columns createTableFooter: function(parent, className, column) { var footer = document.createElement("tr"); for(colContent of column) { this.createEl("td", null, className, footer, colContent); } parent.appendChild(footer); return footer; }, // this is the major worker of the module, it provides the // displayable content for this module getDom: function() { var wrapper = this.createEl("div",null,null,null,null); // tell MM to call and get our content Log.log(JSON.stringify(this.active_birthdays)); if ((moment() > this.midnight) || (!this.loaded)) { var month = moment().month(); var year = moment().year(); var monthName = moment().format("MMMM"); var monthLength = moment().daysInMonth(); var now_day_month = moment().format("DD.MM"); if(Object.keys(this.active_birthdays).length > 0) { // create table var table = this.createEl("table", "birthday-table", "TABLE" , wrapper,null) // create tableheader here var table_header = this.createTableHeader(table, null, [" "," "]); // create TBODY section with day names var tBody = this.createEl('tBody', "birthday-tbody", "TBODY" , table, null); var day_month_now = moment().format("DD.MM"); var birthdays_seen= {} var spacer = " "; 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, null); // delete leading 0 and month var bd = ""; if(birthdays_seen[birthday] == undefined) { bd =(birthday.startsWith("0")? birthday.substring(1): birthday).split('.')[0]; birthdays_seen[birthday] = true; } let date1 = moment(birthday,'DD.MM').valueOf(); let date2 = moment(now_day_month,'DD.MM').valueOf(); if (date1 < date2) { var imageTD = this.createEl('td', "birthday-td-image", "TD-IMAGE_DIMMED" , bodyTR, bd); var nameTD = this.createEl('td', "birthday-td-body", "TD-BODY_DIMMED" , bodyTR, person.name); var spanTD = this.createEl("span", "birthday-span-body", "TD-AGE_DIMMED", nameTD, person.age); } else { var imageTD = this.createEl('td', "birthday-td-image", "TD-IMAGE" , bodyTR, bd); var nameTD = this.createEl('td', "birthday-td-body", "TD-BODY" , bodyTR, person.name); var spanTD = this.createEl("span", "birthday-span-body", "TD-AGE", nameTD, person.age); } var spacerTR = this.createEl('tr', null, null , tBody, null); var spacerTD = this.createEl('td', null, "SPACER" , spacerTR, spacer); spacerTD.colSpan = "2"; } } // Create TFOOT section -- currently used for debugging only if (this.config.debugging) { var table_footer = this.createTableFooter(tBody, null, [" "," "]); //footerTD.innerHTML = "Birthdaylist is currently in DEBUG mode!<br />Please see console log."; } else { var table_footer = this.createTableFooter(tBody, null, [" "," "]); } } // pass the created content back to MM to add to DOM. return wrapper; } // Dom is loaded this.loaded = true; },
css-file via email
-
the next working step:
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, null); // delete leading 0 and month var bd = ""; if(birthdays_seen[birthday] == undefined) { bd =(birthday.startsWith("0")? birthday.substring(1): birthday).split('.')[0]; birthdays_seen[birthday] = true; } let entrie = moment(birthday,'DD.MM').valueOf(); let now = moment(now_day_month,'DD.MM').valueOf(); if (entrie < now) { if(this.config.dimmEntries) { var imageTD = this.createEl('td', "birthday-td-image", "TD-IMAGE_DIMMED" , bodyTR, bd); var nameTD = this.createEl('td', "birthday-td-body", "TD-BODY_DIMMED" , bodyTR, person.name); var spanTD = this.createEl("span", "birthday-span-body", "TD-AGE_DIMMED", nameTD, person.age); var spacerTR = this.createEl('tr', null, null , tBody, null); var spacerTD = this.createEl('td', null, "SPACER" , spacerTR, spacer); spacerTD.colSpan = "2"; } else { } } else { var imageTD = this.createEl('td', "birthday-td-image", "TD-IMAGE" , bodyTR, bd); var nameTD = this.createEl('td', "birthday-td-body", "TD-BODY" , bodyTR, person.name); var spanTD = this.createEl("span", "birthday-span-body", "TD-AGE", nameTD, person.age); var spacerTR = this.createEl('tr', null, null , tBody, null); var spacerTD = this.createEl('td', null, "SPACER" , spacerTR, spacer); spacerTD.colSpan = "2"; } } }
now should be the last step:
people who are their birthday at the same day in one cell separated by < /br > … that’s (maybe) too difficult for me, but just figuring out … -
@Perlchamp ok, busy at the moment… about an hour 13:30 my time
-
ok, doesn’t matter. enjoy your meal with your family.
-
i’m a step foward (did write two functions for smarter code) :
// creates a tablefooter with columns createTableFooter: function(parent, className, column) { var footer = document.createElement("tr"); for(colContent of column) { this.createEl("td", null, className, footer, colContent); } parent.appendChild(footer); return footer; }, // compares two dates, requires moment.js : // output "1" : date1 > date2 // output "-1" : date1 < date2 // output "0" : fault compareDate: function(now, entrie, format) { let date_1 = moment(now,format).valueOf(); let date_2 = moment(entrie,format).valueOf(); if (date_1 > date_2) { return 1; } else if (date_1 < date_2) { return -1; } else { return 0; } },
the lastone is used here:
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, null); // delete leading 0 and month var bd = ""; if(birthdays_seen[birthday] == undefined) { bd =(birthday.startsWith("0")? birthday.substring(1): birthday).split('.')[0]; birthdays_seen[birthday] = true; } if (this.compareDate(now,birthday,"DD.MM") === 1) { if(this.config.dimmEntries) { var imageTD = this.createEl('td', "birthday-td-image", "TD-IMAGE_DIMMED" , bodyTR, bd); var nameTD = this.createEl('td', "birthday-td-body", "TD-BODY_DIMMED" , bodyTR, person.name); var spanTD = this.createEl("span", "birthday-span-body", "TD-AGE_DIMMED", nameTD, person.age); var spacerTR = this.createEl('tr', null, null , tBody, null); var spacerTD = this.createEl('td', null, "SPACER" , spacerTR, spacer); spacerTD.colSpan = "2"; } else { } } else { var imageTD = this.createEl('td', "birthday-td-image", "TD-IMAGE" , bodyTR, bd); var nameTD = this.createEl('td', "birthday-td-body", "TD-BODY" , bodyTR, person.name); var spanTD = this.createEl("span", "birthday-span-body", "TD-AGE", nameTD, person.age); var spacerTR = this.createEl('tr', null, null , tBody, null); var spacerTD = this.createEl('td', null, "SPACER" , spacerTR, spacer); spacerTD.colSpan = "2"; } } }
it works fine for me :-). for the last step (people with the same birthday in one cell, separeted via < /br >) i have momently no ideas…
-
@Perlchamp ok, not sure how u want to present the two people with the same date
simplified codegetDom: function(){ var wrapper = this.createEl("div",null,null,null); if(Object.keys(this.active_birthdays).length>0){ // create your table here var table = this.createEl("table", "birthday-table", null, wrapper ); // table header here, array of column names var table_header=this.createTableHeader(table,null, ["date","Name","age"]) // create looped row section var tBody = this.createEl('tbody', "birthday-t-body", "tbody", table, null); var birthdays_seen= {} 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', null, "TR-BODY" ,tBody, null); let now = moment().format('DD.MM').valueOf(); let entrie=now if(this.config.dimmEntries) { entrie = moment(birthday,'DD.MM').valueOf(); } var bd = ""; if(birthdays_seen[birthday]==undefined){ bd =(birthday.startsWith("0")? birthday.substring(1): birthday).split('.')[0]; var imageTD = this.createEl('td', null, "TD-IMAGE_"+(entrie < now)?"DIMMED":'' , bodyTR, bd); } else{ this.createEl('span', null , null , bodyTR,bd); } var nameTD = this.createEl('td', null, "TD-BODY_"+(entrie < now)?"DIMMED":'' , bodyTR, person.name); var spanTD = this.createEl("span", null, "TD-AGE_"+(entrie < now)?"DIMMED":'', nameTD, person.age); var spacerTR = this.createEl('tr', null, null , tBody, null); var spacerTD = this.createEl('td', null, "SPACER" , spacerTR, "----"); spacerTD.colSpan = "2"; birthdays_seen[birthday] = true; } } } return wrapper; },
maybe? but why?
we have currently two rows, 3 columns
day name age empty name age
you want ?? two columns?
row (2 cols) day name + age < br> name + age row (3 cols) dayn name age
-
hi sam,
right row 2 cols day name + age < br > … < br > name+age < br >
the image below displays that:
look at my code, it’s all implemated but not the users in one cell :
getDom: function() { var wrapper = this.createEl("div",null,null,null,null); // tell MM to call and get our content Log.log(JSON.stringify(this.active_birthdays)); if ((moment() > this.midnight) || (!this.loaded)) { var month = moment().month(); var year = moment().year(); var monthName = moment().format("MMMM"); var monthLength = moment().daysInMonth(); var now = moment(); if(Object.keys(this.active_birthdays).length > 0) { // create table var table = this.createEl("table", "birthday-table", "TABLE" , wrapper,null) // create tableheader here var table_header = this.createTableHeader(table, null, [" "," "]); // create TBODY section with day names var tBody = this.createEl('tBody', "birthday-tbody", "TBODY" , table, null); var day_month_now = moment().format("DD.MM"); var birthdays_seen= {} var spacer = " "; 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, null); // delete leading 0 and month var bd = ""; if(birthdays_seen[birthday] == undefined) { bd =(birthday.startsWith("0")? birthday.substring(1): birthday).split('.')[0]; birthdays_seen[birthday] = true; } if (this.compareDate(now,birthday,"DD.MM") === 1) { if(this.config.dimmEntries) { var imageTD = this.createEl('td', "birthday-td-image", "TD-IMAGE_DIMMED" , bodyTR, bd); var nameTD = this.createEl('td', "birthday-td-body", "TD-BODY_DIMMED" , bodyTR, person.name); var spanTD = this.createEl("span", "birthday-span-body", "TD-AGE_DIMMED", nameTD, person.age); var spacerTR = this.createEl('tr', null, null , tBody, null); var spacerTD = this.createEl('td', null, "SPACER" , spacerTR, spacer); spacerTD.colSpan = "2"; } else { } } else { var imageTD = this.createEl('td', "birthday-td-image", "TD-IMAGE" , bodyTR, bd); var nameTD = this.createEl('td', "birthday-td-body", "TD-BODY" , bodyTR, person.name); var spanTD = this.createEl("span", "birthday-span-body", "TD-AGE", nameTD, person.age); var spacerTR = this.createEl('tr', null, null , tBody, null); var spacerTD = this.createEl('td', null, "SPACER" , spacerTR, spacer); spacerTD.colSpan = "2"; } } } // Create TFOOT section -- currently used for debugging only if (this.config.debugging) { var table_footer = this.createTableFooter(tBody, null, [" "," "]); //footerTD.innerHTML = "Birthdaylist is currently in DEBUG mode!<br />Please see console log."; } else { var table_footer = this.createTableFooter(tBody, null, [" "," "]); } } // pass the created content back to MM to add to DOM. return wrapper; } // Dom is loaded this.loaded = true; },
-
@Perlchamp i missed the span instead of td for age… working on the join
-
i have the span ! look in my code !