Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Skripten / Logik
    4. JavaScript
    5. HTML Tabelle für alle Schedules in den Scripten

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    HTML Tabelle für alle Schedules in den Scripten

    This topic has been deleted. Only users with topic management privileges can see it.
    • Q
      quorle last edited by

      @liv-in-sky

      Wobei ich gerade etwas versucht habe. Wollte eine Leerzeile einfügen und habe diese so gestaltet:

      Unbenannt.PNG

      Sieht aber dann so in der VIS aus:

      Unbenannt.PNG

      Kann man dies mit Platzhalter so nicht lösen?

      liv-in-sky 2 Replies Last reply Reply Quote 0
      • liv-in-sky
        liv-in-sky @quorle last edited by

        @quorle leider geht ds so nicht - soll ich dir eine lerzeile machen ? - bitte poste dein aktuelles script - dann mach ich damit weiter

        1 Reply Last reply Reply Quote 0
        • liv-in-sky
          liv-in-sky @quorle last edited by

          @quorle

          oder tausche mal die zeile aus mit

            myObject[zz].value1!="" ? val[1]=myObject[zz].value1+" "+myObject[zz].value2 : val[1]=myObject[zz].value1
          

          Image 3.png

          1 Reply Last reply Reply Quote 0
          • Q
            quorle last edited by

            @liv-in-sky

            Das wäre Prima. Also deine Tabellen sind wirklich spitzenmäßig. Denke ich werde alles an Tabellen mit deinem Script machen.

            //@liv-in-sky 2021  17.2.-11:11
            
            
            
            
            
            // @ts-ignore
            let braucheEinVISWidget=true;                          // bei true wird ein html-tabelle in einen dp geschrieben - siehe nächste zeile
            let  dpVIS="VIS_Anzeige_PV_Anlage_HTML_Liste_Aktuell";                            // WICHTIG wenn braucheEinVISWidget auf true gesetzt !!  dp zusätzlich für VIS-HTML-Basic-Widget
            let braucheEinJSON=false;                               // bei true wird ein html-tabelle in einen dp geschrieben - siehe nächste zeile
            let  dpJSON="";    // WICHTIG wenn braucheEinJSON auf true gesetzt !!  dp zusätzlich für JSON
            let mySchedule="*/30 * * * * *";                         // jede minute  
            
            // Variablen für feste Werte
            let  spalteEins=["Tagesproduktion:","Tageseinspeisung:","Eigenverbrauch:", "gekaufte Energie:"]
            // Variable für Datenpunkte die sich ändern (zugehörig für feste Werte)
            let spalteZwei=["modbus.0.inputRegisters.13001_Daily_PV Generation","modbus.0.inputRegisters.13004_Daily_export  power from PV","modbus.0.inputRegisters.13016_Daily_direct  Energy Consumption", "modbus.0.inputRegisters.13035_Daily_Import Energy"
            ,]
            // Variable für Einheiten
            let einheiten=["KW/h","KW/h","KW/h","KW/h"] 
            
            //ZUSÄTZLICH VARIABLEN
            let onlineFarbe="#C9AF4A";
            let mitAlphabet=false;
            let sortierenEIN=false;
            
            //---------------------------------------
            
            //HIER DIE SPALTEN ANZAHL DEFINIEREN - jede Spalte einen Wert - in diesem Beispiel sind es 3 - es MÜSSEN in allen Arrays die GLEICHE Anzahl für die Werte sein
            let val=             ["dummy1","dummy2"];       //HIER SIND DIE  WERTE, DIE IN DER SCHLEIFE GEFILTERET WERDEN -  jeder val[x] muss unten in der schleife gesetzt werden !!
            let Feld1lAlign=     ["left","center"];           // AUSRICHTUNG IN DER SPALTE
            let htmlSpalte1Weite=["180px","auto"];            //BREITE DER SPALTE, wenn nicht auto
            let htmlFeld=        ["Tageswerte",""];       // NAME/ÜBERSCHRIFT DER SPALTE
            let schalterInSpaltenUeberschrift=[false,false,true,true,true,true];
            let symbolSchalter=["na","⇄","⇄","≙","≙"];
            //-----------------------------------
            
            //Symbole für Tabelle z.b.: ⚪  ⚫ ⭕  🔴 🔵 ⏱ 💀 👍 👎 📑 💲 👀 🔹 ✅ ❌ ⚠️ mehr: https://emojiterra.com/de/ oder https://unicode-table.com/de/html-entities/
            
            //hier werden die styles für die tabelle definiert
            //ÜBERSCHRIFT ÜBER TABELLE
            const htmlUberschrift=false;                             // mit Überschrift über der tabelle
            const htmlSignature=true;                               // anstatt der Überscghrift eine signature: - kleiner - anliegend
            const htmlFeldUeber='';                // für Überschrift und Signature falls htmlUberschrift und htmlSignature ist true
            const htmlFarbUber="white";                              // Farbe der Überschrift
            const htmlSchriftWeite="normal";                         // bold, normal - Fettschrift für Überschrift
            const htmlUEberFontGroesse="18px";                       // schriftgröße überschrift
            //SEITENLEISTE
            const ichWillSeitenLeiste=false;                          // links einblenden einer Seitenleiste
            const nameSeitenLeiste="Tageswerte"
            const breiteSeitenleiste=25;
            const schriftGroesseSeitenleiste=12;
            const abstandSeitentextVonOben=2;
            const htmlFarbSeiteSchrift="#8A8A88";
            const htmlBackgroundFarbeSeitenliste="transparent";
            //MEHRERE TABELLEN NEBENEINANDER
            let mehrfachTabelle=1;                                   // bis zu 3 Tabellen werden nebeneinander geschrieben-  verkürzt das Ganze, dafür etwas breiter - MÖGLICH 1,2,3 !!!
            const trennungsLinie="2";                                // extra trennungslinie bei mehrfachtabellen - evtl auf 0 stellen, wnn htmlRahmenLinien auf none sind
            const farbetrennungsLinie="#C9AF4A";                       // bei mehreren Tabellen nebeneinander wird ein Strich zw. den Tabellen gezogen
            const htmlFarbTableColorUber="black"                     // Spalten-Überschrift in der tabelle - für die einzelnen Spalten //"#BDBDBD"; 
            const htmlFarbZweiteTabelle="black";                     // Farbe der Spalten-Überschrift bei jeder 2.ten Tabelle        
            //ÜBERSCHRIFT SPALTEN - OBERSTE ZEILE IN TAB
            const UeberSchriftHoehe="25";                            // Überschrift bekommt mehr Raum - darunter und darüber - Zellenhöhe
            const LinieUnterUeberschrift="5";                        // Liniehoehe nur unter Spaltenüberschrift  
            const farbeLinieUnterUeberschrift="orange";               // LinienFarbe unter Spaltenüberschrift
            const groesseUeberschrift=20; 
            const UeberschriftStyle="bold"                         // möglich "bold"
            const UeberschriftSpalten=true;                          // ein- oder ausblenden der spatlen-überschriften
            //GANZE TABELLE
            const abstandZelle="2";                                  // legt den abstand in den zellen zum rahmen fest
            const zeilenAbstand=3;                                   // legt den abstand zwischen den zeilen fest
            const farbeUngeradeZeilen="#000000";                     // Farbe für ungerade Zeilenanzahl - Hintergrund der Spaltenüberschrift bleibt bei htmlFarbTableColorGradient1/2 - bei "transparent" gewinnt htmlFarbTableColorGradient1
            const farbeGeradeZeilen="#151515";                       // Farbe für gerade Zeilenanzahl - Hintergrund der Spaltenüberschrift bleibt bei htmlFarbTableColorGradient1/2   - bei "transparent" gewinnt htmlFarbTableColorGradient2
            const weite="auto";                                      // Weite der Tabelle - verhindert das dynamische breiter werden, wenn werte unterschiedliche werte haben
            const zentriert=true;                                    // ganze tabelle zentriert im html Widget
            const backgroundAll="#000000";                           // Hintergrund für die ganze Seite - für direkten aufruf oder iqontrol sichtber - keine auswirkung auf vis-widget
            const htmlSchriftart="Ubuntu-Regular"                    // "Jura-DemiBold"   //"RobotoCondensed-Bold"   //"Helvetica"; .....
            const htmlSchriftgroesse="16px";                         // schriftgröße in den zellen
            const rahmenBreite="3px";                                //mit 0 ist äußerer rahmen weg
            //FELDER UND RAHMEN
            const htmlFarbFelderschrift="orange";                   // SchriftFarbe der Felder
            const htmlFarbFelderschrift2="#8A8A88";                  // SchriftFarbe der Felder für jede 2te Tabelle
            const htmlGragient=[150,15,50];                          // einstellung des gradienten
            const htmlFarbTableColorGradient1="lightyellow";         // Gradient - Hintergrund der Tabelle - Verlauffarbe
            const htmlFarbTableColorGradient2="orange";              // Gradient - Hintergrund der Tabelle - ist dieser Wert gleich Gradient1 gibt es keinen verlauf
            const htmlFarbTableBorderColor="grey";                   // Farbe des Rahmen - ist dieser gleich den gradienten, sind die rahmen unsichtbar
            let htmlRahmenLinien="rows";                             // Format für Rahmen: MÖGLICH: "none" oder "all" oder "cols" oder "rows"
            
            // falls eine extra html datei gebraucht wird
            const path = "/htmlexample.html";                        //FIlenamen definieren
            const home ='vis.0'                                      //wo soll das file im iobroker-file-system liegen ? (oder z.b auch iqontrol.meta)
            let   braucheEinFile=false;                              // bei true wird ein file geschrieben
            
            // AB HIER NICHTS  ÄNDERN -------------------------------------------------------------------------------------------------
            // AB HIER NICHTS  ÄNDERN -------------------------------------------------------------------------------------------------
            // AB HIER NICHTS  ÄNDERN ---------------------------------erst wieder ab Zeile 134----------------------------------------
            
            let borderHelpBottum;
            let borderHelpRight;
            let htmlcenterHelp;
            let htmlcenterHelp2;
            
            if(String(htmlRahmenLinien)=="rows") {borderHelpBottum=1;borderHelpRight=0;}
            if(String(htmlRahmenLinien)=="cols") {borderHelpBottum=0;borderHelpRight=1;}
            if(String(htmlRahmenLinien)=="none") {borderHelpBottum=0;borderHelpRight=0;}
            if(String(htmlRahmenLinien)=="all")  {borderHelpBottum=1;borderHelpRight=1;}
            zentriert ? htmlcenterHelp="auto" : htmlcenterHelp="left";
            zentriert ? htmlcenterHelp2="center" : htmlcenterHelp2="left";
            
            
            const htmlZentriert='<center>'
            const htmlStart=    "<!DOCTYPE html><html lang=\"de\"><head><title>Vorlage</title><meta http-equiv=\"content-type\" content=\"text/html;  http-equiv=\"refresh\" content=\"30\"; charset=utf-8\">"+
                             "<style> * {  margin: 0;} body {background-color: "+backgroundAll+"; margin: 0 auto;  }"+
                             " p {padding-top: 10px; padding-bottom: 10px; text-align: "+htmlcenterHelp2+"}"+
                            // " div { margin: 0 auto;  margin-left: auto; margin-right: auto;}"+
                             " td { padding:"+abstandZelle+"px; border:0px solid "+htmlFarbTableBorderColor+";  border-right:"+borderHelpRight+"px solid "+htmlFarbTableBorderColor+";border-bottom:"+borderHelpBottum+"px solid "+htmlFarbTableBorderColor+";}"+ 
                             " table { width: "+weite+";  margin: 0 "+htmlcenterHelp+"; border:1px solid "+htmlFarbTableBorderColor+"; border-spacing=\""+abstandZelle+"0px\" ; }"+   // margin macht center
                             "td:nth-child(1) {width: "+htmlSpalte1Weite[0]+"}"+"td:nth-child(2) {width:"+htmlSpalte1Weite[1]+"}"+
                             " </style></head><body> <div>";
            //const htmlUeber=    "<p style=\"color:"+htmlFarbUber+"; font-family:"+htmlSchriftart+"; font-weight: bold\">"+htmlFeldUeber+"</p>";                    
            const htmlTabStyle= "<table bordercolor=\""+htmlFarbTableBorderColor+"\" border=\""+rahmenBreite+"\" cellspacing=\""+abstandZelle+"\" cellpadding=\""+abstandZelle+"\" width=\""+weite+"\" rules=\""+htmlRahmenLinien+"\" style=\"color:"+htmlFarbFelderschrift+";  font-size:"+htmlSchriftgroesse+
                              "; font-family:"+htmlSchriftart+";background-image: linear-gradient("+htmlGragient[0]+"deg,"+htmlFarbTableColorGradient2+" "+htmlGragient[1]+"%,"+htmlFarbTableColorGradient1+" "+htmlGragient[2]+"%);\">";
            let htmlTabUeber4="<tr style=\" height:"+UeberSchriftHoehe+"px; color:"+htmlFarbTableColorUber+"; font-size: "+groesseUeberschrift+"px; font-weight: "+UeberschriftStyle+" ;  border-bottom: "+LinieUnterUeberschrift+"px solid "+farbeLinieUnterUeberschrift+" \">";
            const htmlTabUeber3="</tr>";
            
            
            const buttonScript =   '<script> function setOnOtherValue(myval) {	var Self = this;	Self.servConn.getStates(myval, (error, states) => {  console.log(states); self.servConn.setState(myval, !states[myval].val);}  )}'
                               +'</script>'
            
            
            //NICHTS ÄNDERN - abhängig von den oben definierten _Spalten - in diesem Beispiel sind es 3
            let htmlTabUeber2=""
            for (let ue=0;ue<htmlSpalte1Weite.length;ue++) { if (!schalterInSpaltenUeberschrift[ue] ) { 
                                                                htmlTabUeber2=htmlTabUeber2.concat("<td width="+htmlSpalte1Weite[ue]+" align="+Feld1lAlign[ue]+" style=\"color:"+htmlFarbTableColorUber+"\">"+htmlFeld[ue]+"</td>")} 
                                                                else {let valButton="javascript." + instance + ".Tabellen@Liv."+dpVIS+".Spalte"+ue
                                                                 htmlTabUeber2=htmlTabUeber2.concat("<td width="+htmlSpalte1Weite[ue]+" align="+Feld1lAlign[ue]+">"+""+"<button  style\=\" border-radius: 4px; border:1px solid; background-color\:#7CA4CD\; color: "+htmlFarbTableColorUber+"; font\-size\:1em\; text\-align:left\" value=\"toggle\" onclick=\"setOnOtherValue\(\'"+valButton+"\')\">"+htmlFeld[ue]+"</button></td>")}  //symbolSchalter[ue]     
                                                                }
            
            
            let  htmlTabUeber2_1=""
            for (let ue=0;ue<htmlSpalte1Weite.length;ue++) { htmlTabUeber2_1=htmlTabUeber2_1.concat("<td width="+htmlSpalte1Weite[ue]+" align="+Feld1lAlign[ue]+" style=\"color:"+htmlFarbZweiteTabelle+"\">"+htmlFeld[ue]+"</td>")}
            
            //------------------------------------------------------
            if ( !(val.length == Feld1lAlign.length && htmlSpalte1Weite.length == htmlFeld.length && val.length == htmlFeld.length) || (mehrfachTabelle<1 || mehrfachTabelle>3) ) 
               { log("Anzahle der Definitions Arrays sind ungleich ODER mehrfachTabelle ist falsch - Script wurde gestoppt !!!","error");
                   // @ts-ignore
                   stopScript();}
            
            let langeGesamt=0; 
            let htmlTabUeber="";
            let htmlOut="";
            let mix;
            let counter;
            let makeJsonWidget;
            let myObject=[];
            let welcheSortierung=0;
            
            needDP();
            
            function writeHTML(){
            let seitenLeistenTest="";
            let htmlTabUeber1=htmlTabUeber4
            myObject=[]
            let helperLeerzeile=""
            let makeJsonWidget=[];
            htmlOut="";
            counter=-1;
            
            //--------------------------------------------------------------------------------------------------------------------------------------------------
            //---------hier kommt eure schleife rein counter++, tabelleBind() und tabelleFinish() müssen so integriert bleiben !!!------------------------------
            //---------alle val[x] werte müssen von euch bestimmt werden - val[0],val[1],val[2] !!!-------------------------------------------------------------
            //--------------------------------------------------------------------------------------------------------------------------------------------------
            
            
            
            let myEinheiten;
            
            for(let aa=0;aa<spalteEins.length;aa++) {           // hier eigene schleife definieren und den wert counter++ nicht vergessen  !!!
               
            
            
                  
                    val[0]=spalteEins[aa];
                    val[1]=getState(spalteZwei[aa]).val
                    myEinheiten=einheiten[aa];
             
            
                  myObject.push({                "value0" : val[0],            //  "INSTANCE"
                                                 "value1" : val[1],
                                                 "value2" : myEinheiten 
                                                                 })
                         
                    makeJsonWidget.push({        [htmlFeld[0]] : val[0],  //  "INSTANCE"
                                                 [htmlFeld[1]] : val[1]
                                                                 })  
                  
                    
                    // tabelleAusbessern()
                                                          // diese function muss als letztes in der eigenen schleife aufgerufen werden
             };   
            
             if(sortierenEIN ) switch (welcheSortierung) {
                 case 0: sortMe("alpha","value0");break;  
                 case 1: sortMe("num","value1");break;   
                 case 2: sortMe("alpha","value2");break;}
            
                  
            
             for(let zz=0;zz<myObject.length;zz++){
            
            // Unterüberschften ------------------------------------------------------       
                  if (mitAlphabet){
                    if( myObject[zz].value0[0]!=helperLeerzeile){ tabelleAusbessern();
                                                                  counter=-1;  for(let ic=0;ic<mehrfachTabelle;ic++ ) { for (let tt=0 ;tt<val.length;tt++) 
                                                                                                                            { tt==0 && ic==0 ? val[tt]=(myObject[zz].value0[0]).toUpperCase() : val[tt]="&ensp;"
                                                                                                                            }   
                                                                                                                        counter++;tabelleBind();langeGesamt++; }
                    helperLeerzeile=myObject[zz].value0[0] } ; sortierenEIN=false;}
            // Unterüberschften Ende---------------------------------------------------  
            
            
              val[0]="&ensp;"+myObject[zz].value0
              val[1]=myObject[zz].value1+" "+myObject[zz].value2
            
                                         
               counter++;                                       // SEHR WICHTIG - MUSS IN JEDER SCHLEIFE INTEGRIERT SEIN
               tabelleBind();                                   // HIER NICHTS ÄNDERN : HIER WERDEN DIE DATEN DER SCHLEIFE ZUSAMMENGESETZT  
               langeGesamt++;                                   // WICHTIG Seitenleiste
             }
            
            //-------------------------------------------------------------------------------------------------------------------------------------------------
            //--------------------------------------------------Ende der schleife------------------------------------------------------------------------------
            //-------------------------------------------------------------------------------------------------------------------------------------------------
            let einmalAbstand=`</br>
            `
            for (let f=0;f<abstandSeitentextVonOben;f++){
               seitenLeistenTest=seitenLeistenTest+`<br>
            `}
            for (let i=0;i<nameSeitenLeiste.length;i++){
               seitenLeistenTest=seitenLeistenTest+nameSeitenLeiste[i]+`</br>
            ` }
             htmlTabUeber="";
            if (ichWillSeitenLeiste) htmlTabUeber1=htmlTabUeber1+"<td  style=\" background-color: "+htmlBackgroundFarbeSeitenliste+"; margin-top: 200px; color: "+htmlFarbSeiteSchrift+ ";font-size:"+schriftGroesseSeitenleiste+"px; vertical-align:top; text-align:center \" width=\""+breiteSeitenleiste+"\" rowspan=\""+(langeGesamt+1)+"\">"+seitenLeistenTest+"</td>"
            switch (mehrfachTabelle) { 
             case 1: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber3;  break;
             case 2: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber2_1+htmlTabUeber3; break;
             case 3: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber2_1+htmlTabUeber2_1+htmlTabUeber3; break;
             case 4: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber2_1+htmlTabUeber2+htmlTabUeber2_1+htmlTabUeber3; break;
            };   
            if (!UeberschriftSpalten) {htmlTabUeber=""}
            
                tabelleFinish(); // AB HIER NICHTS ÄNDERN - tabelle fertigstellen
                if (braucheEinJSON ) {setStateDelayed("javascript." + instance + ".Tabellen@Liv."+dpVIS+".JSONVis",JSON.stringify(makeJsonWidget),1000 )}
               
            } // function ende
            
            //MAIN:
            
            schedule(mySchedule,  function () { 
            writeHTML();
            if (braucheEinFile) {writeFile(home, path ,htmlOut, function (error) { /* log('file written');*/  });}
            }); 
            setTimeout(function () {writeHTML();  }, 2050);  
            
            function tabelleBind(){
            
             switch (mehrfachTabelle) { 
            
             case 1: if(counter%2==0)   {htmlOut=htmlOut+"<tr cellspacing=\""+abstandZelle+"\"  bgcolor=\""+farbeGeradeZeilen+"\">";
                                         for(let u=0;u<val.length;u++){ htmlOut=htmlOut.concat("<td align="+Feld1lAlign[u]+">"+val[u]+"</td>");
                                                                      }  htmlOut=htmlOut.concat("</tr>");   break;
            
                                         } else   {htmlOut=htmlOut+"<tr cellspacing=\""+abstandZelle+"\"  bgcolor=\""+farbeUngeradeZeilen+"\">";
                                                   for(let u=0;u<val.length;u++){ htmlOut=htmlOut.concat("<td align="+Feld1lAlign[u]+">"+val[u]+"</td>");
                                                                                }  htmlOut=htmlOut.concat("</tr>");   break;
                                         }
             
             case 2: if(counter%4==0){  if(counter%2==0)  {htmlOut = htmlOut+"<tr cellspacing=\""+abstandZelle+"\"  bgcolor=\""+farbeGeradeZeilen+"\">";
                                                           for(let u=0;u<val.length;u++){ if(u<val.length-1) {htmlOut=htmlOut.concat("<td align="+Feld1lAlign[u]+">"+val[u]+"</td>");} else
                                                                                        {htmlOut=htmlOut.concat("<td style=\" border-right:"+trennungsLinie+"px solid "+farbetrennungsLinie+ ";\" align="+Feld1lAlign[u]+">"+val[u]+"</td>")}
                                                                                        }  
                                                                                     
                                          } else { for(let u=0;u<val.length;u++){ htmlOut=htmlOut.concat("<td align="+Feld1lAlign[u]+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val[u]+"</td>");
                                                                                }  htmlOut=htmlOut.concat("</tr>");  } break;
                                     } else {
                                       if(counter%2==0)  {htmlOut=htmlOut+"<tr cellspacing=\""+abstandZelle+"\"  bgcolor=\""+farbeUngeradeZeilen+"\">";
                                                          for(let u=0;u<val.length;u++){  if(u<val.length-1) {htmlOut=htmlOut.concat("<td align="+Feld1lAlign[u]+">"+val[u]+"</td>");} else
                                                                                       {htmlOut=htmlOut.concat("<td style=\" border-right:"+trennungsLinie+"px solid "+farbetrennungsLinie+ ";\" align="+Feld1lAlign[u]+">"+val[u]+"</td>")}
                                                                                       }  
                                          } else {        for(let u=0;u<val.length;u++){ htmlOut=htmlOut.concat("<td align="+Feld1lAlign[u]+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val[u]+"</td>");
                                                                                       }  htmlOut=htmlOut.concat("</tr>");  }  break;}
            
             case 3: if(counter%2==0)  {  if(counter%3==0 ) {htmlOut = htmlOut+"<tr cellspacing=\""+abstandZelle+"\"  bgcolor=\""+farbeGeradeZeilen+"\">";
                                                             for(let u=0;u<val.length;u++){if(u<val.length-1) {htmlOut=htmlOut.concat("<td align="+Feld1lAlign[u]+">"+val[u]+"</td>");} else
                                                                                          {htmlOut=htmlOut.concat("<td style=\" border-right:"+trennungsLinie+"px solid "+farbetrennungsLinie+ ";\" align="+Feld1lAlign[u]+">"+val[u]+"</td>")}
                                                                                                                  }  
                                         } else { if(counter%3==1)  {for(let u=0;u<val.length;u++){  if(u<val.length-1) {htmlOut=htmlOut.concat("<td align="+Feld1lAlign[u]+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val[u]+"</td>");} else
                                                                                                                        {htmlOut=htmlOut.concat("<td  align="+Feld1lAlign[u]+" style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+ "; color:"+htmlFarbFelderschrift2+"\">"+val[u]+"</td>")}
                                                                                                                  }  
                                                                    } else  { for(let u=0;u<val.length;u++){  htmlOut=htmlOut.concat("<td align="+Feld1lAlign[u]+">"+val[u]+"</td>");
                                                                                                           }  htmlOut=htmlOut.concat("</tr>");  } }  break;
                                       } 
                                       else {
                                          if(counter%3==0 )  {htmlOut = htmlOut+"<tr cellspacing=\""+abstandZelle+"\"  bgcolor=\""+farbeUngeradeZeilen+"\">";
                                                             for(let u=0;u<val.length;u++){ if(u<val.length-1) {htmlOut=htmlOut.concat("<td align="+Feld1lAlign[u]+">"+val[u]+"</td>");} else
                                                                                                               {htmlOut=htmlOut.concat("<td style=\" border-right:"+trennungsLinie+"px solid "+farbetrennungsLinie+ ";\" align="+Feld1lAlign[u]+">"+val[u]+"</td>")}
                                                                                                                  }  
                                                                                                                  
                                       } else{ if(counter%3==1 )  { for(let u=0;u<val.length;u++){ if(u<val.length-1) {htmlOut=htmlOut.concat("<td align="+Feld1lAlign[u]+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val[u]+"</td>");} else
                                                                                                                      {htmlOut=htmlOut.concat("<td  align="+Feld1lAlign[u]+" style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+ "; color:"+htmlFarbFelderschrift2+"\">"+val[u]+"</td>")}
                                                                                                                  }  
                                                                   } else {        for(let u=0;u<val.length;u++){ htmlOut=htmlOut.concat("<td align="+Feld1lAlign[u]+">"+val[u]+"</td>");
                                                                                                                }  htmlOut=htmlOut.concat("</tr>"); } } break;
                                       }                                        
            
            
                                          
                  } //switch ende
            
            }
            
            function tabelleAusbessern() {         // bessert mei mehrfachtabellen die nicht vollen zeilenn aus - bevor die unterüberschriften kommen
            
            switch (mehrfachTabelle) {
                  
                 case 1:    break;
                 case 2:    let helpMehrfach="</td>";
                            for(let w=0;w<val.length;w++){helpMehrfach=helpMehrfach.concat("<td>&ensp;</td>")};helpMehrfach=helpMehrfach.concat("</tr>")
                            if(counter%2==0)  htmlOut = htmlOut.replace(/<\/td>$/, helpMehrfach);
                            break;
                 case 3:   let helpMehrfach2="</td>";
                           for(let w=0;w<val.length;w++){helpMehrfach2=helpMehrfach2.concat("<td>&ensp;</td>")};helpMehrfach2=helpMehrfach2.concat("</tr>")
                           if(counter%3==2)  htmlOut = htmlOut.replace(/<\/td>$/, "</td></tr>");
                           if(counter%3==1)  htmlOut = htmlOut.replace(/<\/td>$/, helpMehrfach2);
                           let helpMehrfach3="</td>";
                           let helpMehrfach31="";for(let w=0;w<val.length;w++){helpMehrfach31=helpMehrfach31.concat("<td>&ensp;</td>")}
                           for(let w=0;w<val.length;w++){if(w<val.length-1) {helpMehrfach3=helpMehrfach3.concat("<td>&ensp;</td>")} else
                                                                   {helpMehrfach3=helpMehrfach3.concat("<td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"\">&ensp;</td>"+helpMehrfach31)}
                                                             };helpMehrfach3=helpMehrfach3.concat("</tr>")        
                           if(counter%3==0)  htmlOut = htmlOut.replace(/<\/td>$/, helpMehrfach3);  break; }}
            
            function tabelleFinish() {
            
            switch (mehrfachTabelle) {
                  
                 case 1:    break;
                 case 2:    let helpMehrfach="</td>";
                            for(let w=0;w<val.length;w++){helpMehrfach=helpMehrfach.concat("<td>&ensp;</td>")};helpMehrfach=helpMehrfach.concat("</tr>")
                            if(counter%2==0)  htmlOut = htmlOut.replace(/<\/td>$/, helpMehrfach);
                            break;
                 case 3:   let helpMehrfach2="</td>";
                           for(let w=0;w<val.length;w++){helpMehrfach2=helpMehrfach2.concat("<td>&ensp;</td>")};helpMehrfach2=helpMehrfach2.concat("</tr>")
                           if(counter%3==2)  htmlOut = htmlOut.replace(/<\/td>$/, "</td></tr>");
                           if(counter%3==1)  htmlOut = htmlOut.replace(/<\/td>$/, helpMehrfach2);
                           let helpMehrfach3="</td>";
                           let helpMehrfach31="";for(let w=0;w<val.length;w++){helpMehrfach31=helpMehrfach31.concat("<td>&ensp;</td>")}
                           for(let w=0;w<val.length;w++){if(w<val.length-1) {helpMehrfach3=helpMehrfach3.concat("<td>&ensp;</td>")} else
                                                                   {helpMehrfach3=helpMehrfach3.concat("<td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"\">&ensp;</td>"+helpMehrfach31)}
                                                             };helpMehrfach3=helpMehrfach3.concat("</tr>")        
                           if(counter%3==0)  htmlOut = htmlOut.replace(/<\/td>$/, helpMehrfach3);  break; }
               
                   var htmlUeber=    "<p style=\"color:"+htmlFarbUber+"; font-family:"+htmlSchriftart+"; font-size: "+htmlUEberFontGroesse+"; font-weight:"+htmlSchriftWeite+ "\">"+htmlFeldUeber+"&ensp;&ensp;Last Update: "+formatDate(getDateObject((new Date().getTime())), "SS:mm:ss");+"</p>"; 
                 var htmlUnter= "<div  style=\"color:"+htmlFarbUber+"; font-family:"+htmlSchriftart+"; font-size: 70%; text-align: center;\" >"+htmlFeldUeber+"&ensp;&ensp;Last Update: "+formatDate(getDateObject((new Date().getTime())), "SS:mm:ss");+"</div>";
                  
                  if (!htmlSignature) htmlUnter="";
                    //Ausgabe über VIS html widget - tabelle in datenpunkt schreiben - html tabelle ohne html header und body
                     var htmlOutVIS="";
                   //  htmlUberschrift ? htmlOutVIS=htmlUeber+htmlTabStyle+htmlTabUeber+htmlOut+"</table>" : htmlOutVIS=htmlTabStyle+htmlTabUeber+htmlOut+"</table>";
                      if (htmlUberschrift) 
                          { zentriert ? htmlOutVIS=htmlZentriert+htmlUeber+htmlTabStyle+htmlTabUeber+htmlOut+"</table>"+htmlUnter+ buttonScript : htmlOutVIS=htmlUeber+htmlTabStyle+htmlTabUeber+htmlOut+"</table>"+htmlUnter+ buttonScript ;
            
                        } else {
                         zentriert ?  htmlOutVIS=htmlZentriert+htmlTabStyle+htmlTabUeber+htmlOut+"</table>"+htmlUnter+ buttonScript :  htmlOutVIS=htmlTabStyle+htmlTabUeber+htmlOut+"</table>"+htmlUnter+ buttonScript;
            
                           }
                           
            
            // log("bin raus aus tabelleBind");
                     if (braucheEinVISWidget)  setStateDelayed("javascript." + instance + ".Tabellen@Liv."+dpVIS+".HTMLTableVis", htmlOutVIS ,1000);
            
            var htmlUnter= "<div  style=\"color:"+htmlFarbUber+"; font-family:"+htmlSchriftart+"; font-size: 80%;  text-align: center; \" >"+htmlFeldUeber+"&ensp;&ensp;Last Update: "+formatDate(getDateObject((new Date().getTime())), "SS:mm:ss");+"</div>"
            
            if (!htmlSignature) htmlUnter="";
            var htmlEnd="</table>"+htmlUnter+"</div></body>";
            //mit oder ohne überschrift - zentriert oder links
            htmlUberschrift ? htmlOut=htmlStart+htmlUeber+htmlTabStyle+htmlTabUeber+htmlOut+htmlEnd : htmlOut=htmlStart+htmlTabStyle+htmlTabUeber+htmlOut+htmlEnd;
            //log(htmlOut);
            
            
            }
            
            async function needDP(){
             for(let s=0;s<schalterInSpaltenUeberschrift.length;s++){ if(schalterInSpaltenUeberschrift[s]){
             if (!(await existsStateAsync("javascript." + instance + ".Tabellen@Liv."+dpVIS+".Spalte"+s))) {
                 await createStateAsync("Tabellen@Liv."+dpVIS+".Spalte"+s, false,{type: "boolean", name: "Schalter_Spalte"+s, role: "value", read: true, write: true, } ); } 
               }}
            
             if (!(await existsStateAsync("javascript." + instance + ".Tabellen@Liv."+dpVIS+".HTMLTableVis"))) {
                 await createStateAsync("Tabellen@Liv."+dpVIS+".HTMLTableVis", "empty",{type: "string", name: "HTML_Standard_Widget_mit_Binding", role: "value", read: true, write: true, } ); } 
              if (!(await existsStateAsync("javascript." + instance + ".Tabellen@Liv."+dpVIS+".JSONVis"))) {
                 await createStateAsync("Tabellen@Liv."+dpVIS+".JSONVis", "",{type: "string", name: "JSON Format", role: "value", read: true, write: true, } ); }   
             
            
             let arrTriggerSchalter=[]
             $("javascript." + instance + ".Tabellen@Liv."+dpVIS+".Spalte*").each(function(id, i) {  
                    arrTriggerSchalter.push(id) 
             });
            //  log(arrTriggerSchalter.toString())
             on({id: arrTriggerSchalter, ack: false, change: "any"}, function (obj) { 
               //  log(obj.id)
               obj.id=="javascript." + instance + ".Tabellen@Liv."+dpVIS+".Spalte1"  ? welcheSortierung=1 : welcheSortierung=2;
               if (obj.id=="javascript." + instance + ".Tabellen@Liv."+dpVIS+".Spalte0") welcheSortierung=0;
              writeHTML();
              if (braucheEinFile) {writeFile(home, path ,htmlOut, function (error) { /* log('file written');*/  });}
            
               
             });
            
            }
            
            
            //SORTIEREN
            function sortMe(myType,value){
            
            if(myType=="alpha" ){
             if( typeof myObject[0][value] != "boolean" ){ 
              myObject.sort(function (alpha, beta) {
                      if ((alpha[value].toString().toUpperCase()).trim() > (beta[value].toString().toUpperCase()).trim())
                         return 1;
                      if ((beta[value].toString().toUpperCase()).trim()> (alpha[value].toUpperCase().toString()).trim())
                         return -1;
                      return 0;
                     });
             }  else { 
                myObject.sort(function(x, y) {
               
                 return (x[value] === y[value])? 0 : x[value]? -1 : 1;
                 
               
             });
             }
            
            
            }     else { 
                     
                myObject.sort(function (alpha, beta) {
            
                 return  beta[value] -alpha[value]; 
                
            
             });}
            
            //    log(JSON.stringify(myObject))
             
            }
            
            

            liv-in-sky 1 Reply Last reply Reply Quote 0
            • liv-in-sky
              liv-in-sky @quorle last edited by

              @quorle tausche einfach die zeile 223 bei dir mit und lasse die "" in den arrays

               myObject[zz].value1!="" ? val[1]=myObject[zz].value1+" "+myObject[zz].value2 : val[1]=myObject[zz].value1 
              
              Q 1 Reply Last reply Reply Quote 0
              • Q
                quorle @liv-in-sky last edited by quorle

                @liv-in-sky sagte in HTML Tabelle für alle Schedules in den Scripten:

                myObject[zz].value1!="" ? val[1]=myObject[zz].value1+" "+myObject[zz].value2 : val[1]=myObject[zz].value1

                Gerade versucht, klappt leider nicht. Es wird keine Zeile ausgelassen.

                Sieht dann so aus:
                Unbenannt.PNG

                liv-in-sky 2 Replies Last reply Reply Quote 0
                • liv-in-sky
                  liv-in-sky @quorle last edited by

                  @quorle ok - das war zu schnell - moment ...

                  1 Reply Last reply Reply Quote 0
                  • liv-in-sky
                    liv-in-sky @quorle last edited by liv-in-sky

                    @quorle

                    mach mal noch diese zeile rein:

                    spalteZwei[aa]!="" ? val[1]=getState(spalteZwei[aa]).val : val[1]="";
                    

                    kommt hier hin:

                    Image 5.png

                    1 Reply Last reply Reply Quote 0
                    • Q
                      quorle last edited by

                      @liv-in-sky sagte in HTML Tabelle für alle Schedules in den Scripten:

                      spalteZwei[aa]!="" ? val[1]=getState(spalteZwei[aa]).val : val[1]="";

                      Klappt wunderbar. Danke hierfür. Kann man das ganze widerholen?

                      liv-in-sky 1 Reply Last reply Reply Quote 0
                      • liv-in-sky
                        liv-in-sky @quorle last edited by

                        @quorle

                        was meinst du mit wiedrholen

                        Q 1 Reply Last reply Reply Quote 0
                        • Q
                          quorle @liv-in-sky last edited by

                          @liv-in-sky

                          Meinte eine erneute Leerzeile einfügen. Habe es gestestet und es funktioniert.

                          liv-in-sky 2 Replies Last reply Reply Quote 0
                          • liv-in-sky
                            liv-in-sky @quorle last edited by

                            @quorle ja das funktioniert jetzt - so oft du willst - die "" müssen halt in den arrays an den richtigen positionen sein

                            1 Reply Last reply Reply Quote 0
                            • liv-in-sky
                              liv-in-sky @quorle last edited by

                              @quorle falls du das script kopieren willst, um andere werte damit anzuzeigen: einfach nur den namen oben und dpVIS ändern, damit sich die scripte nicht überschreiben bzw. deren datenpunkte

                              1 Reply Last reply Reply Quote 0
                              • Agria4800
                                Agria4800 @liv-in-sky last edited by

                                @liv-in-sky sagte in HTML Tabelle für alle Schedules in den Scripten:
                                Mal ne Frage, funktioniert das Script bei dir, ich bekomme einen Fehler in Zeile 175:

                                val[0]=valZwischen.replace(/.+\.(.+)$/g,"$1");
                                

                                Log:

                                javascript.0	2021-04-06 21:16:14.975	error	(3632) at writeHTML (script.js.VIS-Tabellen.JS_Schedule_Übersicht:175:23)
                                javascript.0	2021-04-06 21:16:14.974	error	(3632) script.js.VIS-Tabellen.JS_Schedule_Übersicht: TypeError: Cannot read property 'replace' of undefined
                                javascript.0	2021-04-06 21:16:12.117	error	(3632) at writeHTML (script.js.VIS-Tabellen.JS_Schedule_Übersicht:175:23)
                                javascript.0	2021-04-06 21:16:12.117	error	(3632) script.js.VIS-Tabellen.JS_Schedule_Übersicht: TypeError: Cannot read property 'replace' of undefined
                                
                                liv-in-sky 2 Replies Last reply Reply Quote 0
                                • liv-in-sky
                                  liv-in-sky @Agria4800 last edited by

                                  @agria4800 lief das schon mal bei dir - oder erstversuch ?

                                  bei mir funktioniert es - habe gerade getestet

                                  aktiviere - entkommentiere - mal das log und schau, ob du überhaupt ein array bekommst

                                  Image 2.png

                                  Latzi 1 Reply Last reply Reply Quote 0
                                  • Latzi
                                    Latzi @liv-in-sky last edited by

                                    @liv-in-sky
                                    Ist das Script im ersten Post das Aktuelle?
                                    Falls ja, bekomme ich folgende Meldung beim Start:

                                    javascript.0	2021-04-07 11:08:40.816	error	(1145) at writeHTML (script.js.common.Skript-Status_neu:175:23)
                                    javascript.0	2021-04-07 11:08:40.815	error	(1145) script.js.common.Skript-Status_neu: TypeError: Cannot read property 'replace' of undefined
                                    
                                    liv-in-sky 2 Replies Last reply Reply Quote 0
                                    • liv-in-sky
                                      liv-in-sky @Latzi last edited by

                                      @latzi ja ist das aktuelle- 2 leute mit dem selben fehler - seltsam ?

                                      kannst du auch mal das log, wie einen post über deinem" aktivieren und nachsehen, ob du im log das array mit den schedules bekommst

                                      1 Reply Last reply Reply Quote 0
                                      • liv-in-sky
                                        liv-in-sky @Latzi last edited by

                                        @latzi welche javascript adapter version hast du ?

                                        Latzi 2 Replies Last reply Reply Quote 0
                                        • Latzi
                                          Latzi @liv-in-sky last edited by

                                          @liv-in-sky
                                          ... bitte sehr:

                                          2021-04-07 11:22:41.707 - info: javascript.0 (1145) Start javascript script.js.common.Skript-Status_neu
                                          2021-04-07 11:22:41.718 - info: javascript.0 (1145) script.js.common.Skript-Status_neu: registered 0 subscriptions and 1 schedule
                                          2021-04-07 11:22:41.770 - info: javascript.0 (1145) script.js.common.Skript-Status_neu: [{"id":"schedule_93434.1617778215532","type":"schedule","schedule":"{\"time\":{\"exactTime\":true,\"start\":\"06:45\"},\"period\":{\"days\":1,\"dows\":\"[1, 2, 3, 4, 5]\"}}"},{"id":"schedule_972396.1617778215556","type":"schedule","schedule":"{\"time\":{\"exactTime\":true,\"start\":\"00:30\"},\"period\":{\"days\":1}}"},{"id":"schedule_680342.1617778216410","type":"schedule","schedule":"{\"time\":{\"exactTime\":true,\"start\":\"23:59\"},\"period\":{\"days\":1}}"},{"id":"schedule_191570.1617778216415","type":"schedule","schedule":"{\"time\":{\"exactTime\":true,\"start\":\"00:07\"},\"period\":{\"years\":1,\"yearDate\":1,\"yearMonth\":1}}"},{"id":"schedule_922680.1617778216448","type":"schedule","schedule":"{\"time\":{\"exactTime\":true,\"start\":\"18:24\"},\"period\":{\"days\":1}}"},{"id":"schedule_451818.1617778216588","type":"schedule","schedule":"{\"time\":{\"exactTime\":true,\"start\":\"06:00\"},\"period\":{\"days\":1},\"valid\":{\"from\":\"15.04.2020\",\"to\":\"\"}}"},{"id":"schedule_654066.1617778216594","type":"schedule","schedule":"{\"time\":{\"exactTime\":true,\"start\":\"22:00\"},\"period\":{\"days\":1}}"},{"type":"cron","pattern":" */5 * * * * ","scriptName":"script.js.common.Batteriestatus","id":"cron_1617778215612_44127"},{"type":"cron","pattern":" * * * * * ","scriptName":"script.js.common.Energiestatus","id":"cron_1617778215642_25652"},{"type":"cron","pattern":"0 0 * * *","scriptName":"script.js.common.Energiestatus","id":"cron_1617778216021_78897"},{"type":"cron","pattern":"*/30 * * * * *","scriptName":"script.js.common.Log_Dateien","id":"cron_1617778220501_77395"},{"type":"cron","pattern":" */20 9-23,0 * * * ","scriptName":"script.js.common.TV-Programm_gesamt","id":"cron_1617778216373_63321"},{"type":"cron","pattern":" */20 * * * * * ","scriptName":"script.js.common.Skript-Status","id":"cron_1617778216391_24760"},{"type":"cron","pattern":"*/5 * * * * *","scriptName":"script.js.common.Waschmaschine_Energie","id":"cron_1617778216460_62856"},{"type":"cron","pattern":"* * * * *","scriptName":"script.js.common.Adapter_NAS_überwachen","id":"cron_1617778216517_49166"},{"type":"cron","pattern":" 1 */10 * * * ","scriptName":"script.js.common.Adapter_Versionen","id":"cron_1617778216524_49624"},{"type":"cron","pattern":"*/5 * * * *","scriptName":"script.js.common.Wasserpegel","id":"cron_1617778216654_56246"},{"type":"cron","pattern":"*/5 * * * *","scriptName":"script.js.common.Bodenfeuchte","id":"cron_1617778216663_37984"},{"type":"cron","pattern":"18 */10 * * * *","scriptName":"script.js.common.Unwetter_melden","id":"cron_1617778217814_90331"},{"type":"cron","pattern":" */15 * * * * ","scriptName":"script.js.common.Shelly-Übersicht","id":"cron_1617778217826_95674"},{"type":"cron","pattern":"*/10 * * * * *","scriptName":"script.js.common.CPU-Last","id":"cron_1617778217836_4172"},{"type":"cron","pattern":"1 0 * * *","scriptName":"script.js.common.1_Alexa.Alexa_Historie","id":"cron_1617778219900_60360"},{"type":"cron","pattern":" 1,31 * * * * ","scriptName":"script.js.common.IP_Adressen_neu","id":"cron_1617778218057_36698"},{"type":"cron","pattern":" * * * * * ","scriptName":"script.js.common.Zigbee-Status","id":"cron_1617778218432_16516"},{"type":"cron","pattern":"* * * * *","scriptName":"script.js.common.Anwesenheit","id":"cron_1617778218441_17319"},{"type":"cron","pattern":" * * * * * ","scriptName":"script.js.common.Tuya_Leistung_Zeitstempel","id":"cron_1617778218450_98848"},{"type":"cron","pattern":" 18 */2 * * * ","scriptName":"script.js.common.Skript-Status_neu","id":"cron_1617787361718_25930"}]
                                          2021-04-07 11:22:41.771 - error: javascript.0 (1145) script.js.common.Skript-Status_neu: TypeError: Cannot read property 'replace' of undefined
                                          2021-04-07 11:22:41.772 - error: javascript.0 (1145) at writeHTML (script.js.common.Skript-Status_neu:175:23)
                                          

                                          Version 4.11 (noch nicht die 5er)

                                          liv-in-sky 1 Reply Last reply Reply Quote 0
                                          • Latzi
                                            Latzi @liv-in-sky last edited by

                                            @liv-in-sky sagte in HTML Tabelle für alle Schedules in den Scripten:

                                            welche javascript adapter version hast du ?

                                            hab gerade auf 5.1.3 upgedated und Resultat ist gleich

                                            1 Reply Last reply Reply Quote 0
                                            • First post
                                              Last post

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            687
                                            Online

                                            31.9k
                                            Users

                                            80.1k
                                            Topics

                                            1.3m
                                            Posts

                                            template
                                            4
                                            52
                                            2064
                                            Loading More Posts
                                            • Oldest to Newest
                                            • Newest to Oldest
                                            • Most Votes
                                            Reply
                                            • Reply as topic
                                            Log in to reply
                                            Community
                                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                            The ioBroker Community 2014-2023
                                            logo