• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
MagicMirror Forum
  • Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
A New Chapter for MagicMirror: The Community Takes the Lead
Read the statement by Michael Teeuw here.

read csv-data and put it in an array

Scheduled Pinned Locked Moved Utilities
313 Posts 3 Posters 395.0k Views 4 Watching
Loading More Posts
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • S Offline
    sdetweil @Perlchamp
    last edited by May 3, 2020, 8:54 PM

    @Perlchamp use the debugger, expand the elements tree, find the table and look at the classes assigned

    Sam

    How to add modules

    learning how to use browser developers window for css changes

    1 Reply Last reply Reply Quote 0
    • P Offline
      Perlchamp
      last edited by May 3, 2020, 9:59 PM

      hi sam,
      if i do this:

         var imageTD = this.createEl("td", null, "TD-IMAGE", bodyTR, bd);
      

      instead of this :

      var imageTD = this.createEl("td", null, "TD-IMAGE" + (entrie < now)?"_DIMMED":'' , bodyTR, bd);
      

      css are addressed. maybe something has to change in the createEl function ?

      S 2 Replies Last reply May 3, 2020, 10:00 PM Reply Quote 0
      • S Offline
        sdetweil @Perlchamp
        last edited by May 3, 2020, 10:00 PM

        @Perlchamp let me look…

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        1 Reply Last reply Reply Quote 0
        • S Offline
          sdetweil @Perlchamp
          last edited by sdetweil May 3, 2020, 10:20 PM May 3, 2020, 10:09 PM

          @Perlchamp

          warning one ( was missing, fixed
          SORRY… tested now… the + append didn’t work, had to force with concat()…

          Its the two values, now and entrie

          				let now = moment().format('DD.MM').valueOf();				 // this is string dd.mm
          				let entrie=now
          			    if(this.config.dimmEntries) {				
          					entrie = moment(birthday,'DD.MM').format.valueOf();     // this is a moment 
          

          so later when compared, it doesn;t work

          and comparing strings with < doesn’t really work…

          I would do

          let now=moment()
          let entrie = moment(birthday,‘DD.MM’)
          then in the compare
          (entrie.isBefore(now))?..

          	getDom: 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()		
          					let entrie=now
          				    if(this.config.dimmEntries) {				
          						entrie = moment(birthday,'DD.MM')
          					}
          					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".concat(entrie.isBefore(now)?"_DIMMED":'') , bodyTR, bd);		
          						var nameTD = this.createEl('td', null, "TD-BODY".concat(entrie.isBefore(now)?"_DIMMED":'') , bodyTR, person.name);
          									 this.createEl("span", null, null, nameTD, " ");						// needs class for width
          						var spanTDo = this.createEl("span", null, "TD-AGE".concat(entrie.isBefore(now)?"_DIMMED":''), nameTD, person.age);
          					}	
          					else{
          						// add a break
          						this.createEl('br', null , null , spanTDo,null);
          						// add a span with name
          						var nameTD = this.createEl('span', null, "TD-BODY".concat(entrie.isBefore(now)?"_DIMMED":'') ,spanTDo, person.name);
          						// add a span with age
          						var spanTD = this.createEl("span", null, "TD-AGE".concat(entrie.isBefore(now)?"_DIMMED":''), spanTDo, 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;
          	},
          

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          S 1 Reply Last reply May 3, 2020, 10:21 PM Reply Quote 0
          • S Offline
            sdetweil @sdetweil
            last edited by May 3, 2020, 10:21 PM

            @Perlchamp see my update above

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            1 Reply Last reply Reply Quote 0
            • P Offline
              Perlchamp
              last edited by May 3, 2020, 10:42 PM

              @sdetweil said in read csv-data and put it in an array:

              moment(birthday,‘DD.MM’)

              sorry, doesn’t work. blackscreen. if i change back (my post) css is addressed. i didn’t change the jet = part. i think, something’s wrong with the cerateEl function, but you know i’m not an expert.but to control. here is my code :

              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);
              
              			let now = moment();
              			let entrie = moment(birthday,"DD.MM");
              			
              			if(this.config.dimmEntries) {				
              			    entrie = moment(birthday,'DD.MM');
              			}
              			
              			// delete leading 0 and month
              			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".concat(entrie.isBefore(now)?"_DIMMED":'', bodyTR, bd);
              			    var imageTD = this.createEl("td", null, "TD-IMAGE", bodyTR, bd);
              			    //var nameTD = this.createEl("td", null, "TD-BODY".concat(entrie.isBefore(now)?"_DIMMED":'', bodyTR, person.name);
              			    var nameTD = this.createEl("td", null, "TD-BODY", bodyTR, person.name);
              			    this.createEl("span", null, "TD-AGE", nameTD, " ");						
              			    
              			    // needs class for width
              			    //var spanTDo = this.createEl("span", null, "TD-AGE".concat(entrie.isBefore(now)?"_DIMMED":'', nameTD, person.age);
              			    var spanTDo = this.createEl("span", null, "TD-AGE", nameTD, person.age);
              			}
              			else{
              			    // add a break
              			    this.createEl("br", null , null , spanTDo, null);
              			    // add a span with name
              			    //var nameTD = this.createEl("span", null, "TD-BODY".concat(entrie.isBefore(now)?"_DIMMED":'',spanTDo, person.name);
              			    var nameTD = this.createEl("span", null, "TD-BODY", spanTDo, person.name);
              			    // add a span with age
              			    //var spanTD = this.createEl("span", null, "TD-AGE".concat(entrie.isBefore(now)?"_DIMMED":'', spanTDo, person.age);
              			    var spanTD = this.createEl("span", null, "TD-AGE", spanTDo, 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;
              			
              		    }
              		}
              
              S 1 Reply Last reply May 3, 2020, 10:46 PM Reply Quote 0
              • S Offline
                sdetweil @Perlchamp
                last edited by sdetweil May 3, 2020, 10:49 PM May 3, 2020, 10:46 PM

                @Perlchamp ah well. both work here… your latest and mine produce the same results

                your output

                date	Name	age
                12	Sam 69
                2	Frank 81
                Sue81
                5	mary 65
                10	eee EEEEE 51
                16	fff FFFFF 8
                ggg GGGGG32
                27	hhh HHHHH 18
                

                my output

                date	Name	age
                12	Sam 69
                2	Frank 81
                Sue81
                5	mary 65
                10	eee EEEEE 51
                16	fff FFFFF 8
                ggg GGGGG32
                27	hhh HHHHH 18
                

                Sam

                How to add modules

                learning how to use browser developers window for css changes

                1 Reply Last reply Reply Quote 0
                • P Offline
                  Perlchamp
                  last edited by Perlchamp May 3, 2020, 11:12 PM May 3, 2020, 11:08 PM

                  what does that mean? but you don’t use css, do you ? YES, but didn’t you see, that i have annotate the

                  .concat(entrie.isBefore(now)?"_DIMMED":''
                  

                  lines in the code, i posted ? without entrie.isBefore … css is addressed, with it’s not addressed

                  S 1 Reply Last reply May 3, 2020, 11:17 PM Reply Quote 0
                  • S Offline
                    sdetweil @Perlchamp
                    last edited by May 3, 2020, 11:17 PM

                    @Perlchamp I stepped thru and watched it change from with dimmed and without

                    Sam

                    How to add modules

                    learning how to use browser developers window for css changes

                    1 Reply Last reply Reply Quote 0
                    • P Offline
                      Perlchamp
                      last edited by May 4, 2020, 12:10 AM

                      sorry for nerving, sam. i would like to understand the code. where is the part in which the name and age of people with the same birthday are collected/combined ?

                      S 1 Reply Last reply May 4, 2020, 12:45 AM Reply Quote 0
                      • 1
                      • 2
                      • 27
                      • 28
                      • 29
                      • 30
                      • 31
                      • 32
                      • 29 / 32
                      29 / 32
                      • First post
                        289/313
                        Last post
                      Enjoying MagicMirror? Please consider a donation!
                      MagicMirror created by Michael Teeuw.
                      Forum managed by Sam, technical setup by Karsten.
                      This forum is using NodeBB as its core | Contributors
                      Contact | Privacy Policy