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 440.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

      @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
      • PerlchampP Offline
        Perlchamp
        last edited by

        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 Reply Quote 0
        • S Offline
          sdetweil @Perlchamp
          last edited by

          @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

            @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 Reply Quote 0
            • S Offline
              sdetweil @sdetweil
              last edited by

              @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
              • PerlchampP Offline
                Perlchamp
                last edited by

                @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 Reply Quote 0
                • S Offline
                  sdetweil @Perlchamp
                  last edited by sdetweil

                  @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
                  • PerlchampP Offline
                    Perlchamp
                    last edited by Perlchamp

                    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 Reply Quote 0
                    • S Offline
                      sdetweil @Perlchamp
                      last edited by

                      @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
                      • PerlchampP Offline
                        Perlchamp
                        last edited by

                        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 Reply Quote 0
                        • 1
                        • 2
                        • 28
                        • 29
                        • 30
                        • 31
                        • 32
                        • 32 / 32
                        • First post
                          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