• 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 408.8k 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 sdetweil May 3, 2020, 2:37 AM May 3, 2020, 2:36 AM

    @Perlchamp with my code I see
    I removed class
    date Name age
    12.05 Sam 69
    02.05 Frank 81
    02.05 Sue 81
    05.05 mary 65
    10.05 eee EEEEE 51
    16.05 fff FFFFF 8
    16.05 ggg GGGGG 32
    27.05 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, 2:47 AM May 3, 2020, 2:42 AM

      i have a calendar OVER the birthdaylist, so i DON#T need the month in the first cell. the FIRST cell has a calendar sheet as background-image, THOUGH i DON’T need the leading null of the day of birth. should be:
      5 Sam 69
      Mary 12
      8 Frank 81
      15 Sue 81
      …
      did you seen the images i did send ?
      and, of course, people with the same day of birth without day of birth

      S 1 Reply Last reply May 3, 2020, 2:52 AM Reply Quote 0
      • S Offline
        sdetweil @Perlchamp
        last edited by sdetweil May 3, 2020, 2:52 AM May 3, 2020, 2:52 AM

        @Perlchamp no images email or text
        (cannot do fixed font here)

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

        code

        	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 TBODY section with day names
        		    var tBody = this.createEl("tBody", "birthday-tbody", null, table );	
        		    var birthdays_seen= {}
        			for(var birthday of Object.keys(this.active_birthdays)){
        				for(var person of this.active_birthdays[birthday]){
        			
        				    var bodyTR = this.createEl("tr", null,null, tBody);
        				    		var bd =""
        					    	if(birthdays_seen[birthday] == undefined){
        					    		bd =(birthday.startsWith("0")? birthday.substring(1): birthday).split('.')[0]
                     				 	        birthdays_seen[birthday] = true
        					    	}
        					 	   var bodyTDimage = this.createEl("td",null, null, bodyTR , bd );
        
        						
        
        					    var bodyTD = this.createEl("td", null, null, bodyTR , person.name);
        					     
        						var ageTD = this.createEl("td",null, null, bodyTR  ,person.age );
        
        				}
        			}
        		}
        // create your table footer here	
        
        		// pass the created content back to MM to add to DOM.
        		return wrapper;
        	}
        

        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, 2:54 AM

          my code:

             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;
              },
              
              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;
              },
          
              getDom: function() {
          	var wrapper = this.createEl("div",null,null,null);
          	
          	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();
          
          	    if(Object.keys(this.active_birthdays).length>0) {
          
          		// create table
          		var table = this.createEl("table", "birthday-table", "TABLE" , wrapper)
          
          		// create tableheader
          
          		// create TBODY section with day names
          		var tBody = this.createEl('tBody', "birthday-tbody", "TBODY" , table);
          
          		for(var birthday of Object.keys(this.active_birthdays)) {
          		    for(var person of this.active_birthdays[birthday]) {
          				
          			var bodyTR = this.createEl('tr', "birthday-tr-body", "tr-body" , tBody);
          
          			if (birthday.charAt(0) === "0") {
          			    birthday = birthday.replace("0","");
          			    birthday = birthday.substring(0,1);
          			}
          
          			var bodyTDimage = this.createEl('td', "birthday-td-image", "TD-IMAGE" , bodyTR, birthday.substring(0,2));
          			var nameTD = this.createEl('td', "birthday-td-body", "TD-BODY" , bodyTR, person.name);
          			var ageTD = this.createEl("td", "birthday-td-age", "TD-AGE", bodyTR  ,person.age );
          
          		    }
          		}
          	    }
          
          	    // Create TFOOT section -- currently used for debugging only
          
          	    return wrapper;
          
          	}
          	this.loaded = true;
              },
          
          
          S 1 Reply Last reply May 3, 2020, 3:06 AM Reply Quote 0
          • S Offline
            sdetweil @Perlchamp
            last edited by sdetweil May 3, 2020, 3:16 AM May 3, 2020, 3:06 AM

            @Perlchamp the short birthday

            bd =(birthday.startsWith(“0”)? birthday.substring(1): birthday).split(‘.’)[0]

            if the birthday starts with ‘0’ then get the rest skipping the 0

            01.05 -> 1.05
            then split the result on ‘.’
            yields array of [ 1, 05]
            and take the first element in the array [0] = 1
            if it doesn’t start with 0,use the whole string, split and take the 1st element of array
            10.05 = [10,05] = 10

            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, 3:11 AM

              sorry, i’m still sorting my code …uff

              1 Reply Last reply Reply Quote 0
              • P Offline
                Perlchamp
                last edited by Perlchamp May 3, 2020, 3:17 AM May 3, 2020, 3:16 AM

                back again. WITHOUT a class reference (third element = null) i see the days.
                WITH class-reference (“TD-IMAGE”) i see NO days.
                the rest is working very good, thank you for that :-)

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

                  @Perlchamp what does TD-IMAGE class def look like?

                  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, 3:18 AM

                    .birthdaylist .TD-IMAGE {
                      width: 27px;
                      font-size: 20px;
                      color: #000000;
                      background-repeat: no-repeat;
                      background-position: top left;
                      background-image: url("/modules/birthdaylist/images/kalenderblatt.png");
                      font-weight: 400;
                      line-height: 26px;
                      vertical-align: top;
                      text-align: center;
                      margin: 0px;
                      padding: 10px 0px 0px 0px;
                    }
                    
                    S 1 Reply Last reply May 3, 2020, 3:21 AM Reply Quote 0
                    • S Offline
                      sdetweil @Perlchamp
                      last edited by May 3, 2020, 3:21 AM

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

                      .birthdaylist

                      there is no birthdaylist class being used (unless u changed the modulename again)

                      maybe

                      .TD-IMAGE {
                      

                      Sam

                      How to add modules

                      learning how to use browser developers window for css changes

                      1 Reply Last reply Reply Quote 0
                      • 1
                      • 2
                      • 15
                      • 16
                      • 17
                      • 18
                      • 19
                      • 31
                      • 32
                      • 17 / 32
                      17 / 32
                      • First post
                        261/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