Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Skripten / Logik
    4. JavaScript
    5. Bundesliga Meisterschaft HTML Tabelle

    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

    Bundesliga Meisterschaft HTML Tabelle

    This topic has been deleted. Only users with topic management privileges can see it.
    • B
      biker1602 @liv-in-sky last edited by

      @liv-in-sky bist du online?

      1 Reply Last reply Reply Quote 0
      • B
        blackeagle998 last edited by blackeagle998

        Ich habe mal die Bundesliga Widgets "aktueller Spieltag" und "Tabelle" untereinander gepackt, sieht dann so aus:
        55aa1684-9348-4e0f-8fe4-2413647df20e-image.png

        Dazu habe ich eine HTML Datei erstellt. Diese wird in einer Popup Kachel als URL aufgerufen, HTML-Code dazu (Hinweis: ich habe keine Ahnung von HTML, Verbesserungen/Anmerkungen sind gerne erwünscht):

        <!doctype html>
        <html>
         <body bgcolor="black">
          <div id="fblwidget_simple" style="border:2px outset black;background-color:white"></div>
           <script src="//bundesliga-widgets.de/js/simple.js"
                  type="text/javascript"></script>
          <div id="fblwidget_table" style="border:2px outset black;background-color:white"></div>
           <script src="//bundesliga-widgets.de/js/table.js"
                  type="text/javascript"></script>
         </body>
        </html>
        

        Wichtig:
        Ich benutze nicht die Aufbereitungs-Skripte, sondern die Widgets direkt von der Webseite bundesliga-widgets.de.

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

          @liv-in-sky said in Bundesliga Meisterschaft HTML Tabelle:

          @biker1602 @dslraser

          habe hier ein script für den spielstand - getriggert wird auf änderung des quellen-datenpunktes - also schedule nicht mehr notwendig

          wird genau so eingerichtet wie das hauptscript
          mit der variable anzahlSpiele, können auch mehrere wochenenden angezeigt werden - bei 18 werden 2 wochen angezeigt - standard ist 9

          Image 3.png

          script zum import:
          siehe ersten post :https://forum.iobroker.net/post/367377

          1. und 2. Bundesliga gehen aber nicht die 3. Liga. Ich weiß nicht, ob es damit zusammen hängt, dass die noch nicht fertig sind und noch 2 Spiele haben und deswegen etwas anderes eingetragen werden muss?
            Das Script wird beim starten auch nicht grün, sondern nur gelb
          liv-in-sky 1 Reply Last reply Reply Quote 0
          • liv-in-sky
            liv-in-sky @blackeagle998 last edited by

            @blackeagle998

            habe es im ersten post erwähnt

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

              @biker1602

              kannst du mir mal bitte eine datei hier einstellen, mit dem inhalt des datenpunktes für die 3. liga - dann check ich das mal

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

                @liv-in-sky said in Bundesliga Meisterschaft HTML Tabelle:

                @biker1602

                kannst du mir mal bitte eine datei hier einstellen, mit dem inhalt des datenpunktes für die 3. liga - dann check ich das mal

                3. Liga.txt
                Das von der 3. Liga dasselbe was wir gestern mit der 1. und 2. gemacht haben.
                a3a6fa10-766c-40b0-b87c-2a394f558e76-grafik.png

                openligadb.0.bl3.2019.allmatches

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

                  @biker1602 habe mir mittlerweile den adapter geholt - sorry fürdie arbeit

                  das ganze ist echt etwas "verzwickt", da in der auflistung spiele stehen, die noch nicht waren - ich hoffte immer, das die letzten 9 einträge, die letzten spiele wären

                  habe aber eine neue version im ersten post und diesmal mit der 3. liga geteset

                  bitte teste auch mal

                  sonderheit:

                  es gibt dort 2 parameter zum einstellen

                  Image 8.png

                  bei anzahlSpiele=18 und nextComingGames ist 9 , werden die letzten 9 abgeschlossenen spiele gezeigt und die 9 nächsten anstehenden

                  bbei anzahlSpiele=9 und nextComingGames ist 0 , werden die letzten 9 abgeschlossenen spiele gezeigt - sonst nix

                  B 1 Reply Last reply Reply Quote 0
                  • dslraser
                    dslraser Forum Testing Most Active @blackeagle998 last edited by

                    @blackeagle998 sagte in Bundesliga Meisterschaft HTML Tabelle:

                    Dazu habe ich eine HTML Datei erstellt. Diese wird in einer Popup Kachel als URL aufgerufen, HTML-Code dazu (Hinweis: ich habe keine Ahnung von HTML, Verbesserungen/Anmerkungen sind gerne erwünscht):

                    Ich habe es mal als HTML (nicht als URL) eingefügt, geht auch.

                    Screenshot_20200701-183114_Chrome.jpg

                    1 Reply Last reply Reply Quote 1
                    • B
                      biker1602 @liv-in-sky last edited by biker1602

                      @liv-in-sky ich habe das heute Morgen gemacht aber die Spielstände stimmen nicht.
                      576e42dd-81fe-42e4-a085-a34af97d2de1-grafik.png

                      Die Tabelle ist richtig

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

                        @biker1602

                        ok - sorry - sind die halbzeitstände

                        ich habe mal hier ein script, indem ich versucht habe, alles so klein wie möglich zu machen - würdest du dies bitte nochmal testen - ich hoffe, es paßt auf den handy-screen

                        falls die schrift zu klein ist, kannst du dies hier ändern - in iqontrol habe ich die weite 330 eingestellt

                        Image 3.png

                        Image 4.png

                        //@liv-in-sky 2020  1.7. 18:11
                        
                        
                        //HIER WIRD PFAD UND FILENAME DEFINIERT
                        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=true;                          // bei true wird ein file geschrieben
                        let   braucheEinVISWidget=true;                     // bei true wird ein html-tabelle in einen dp geschrieben - siehe nächste zeile
                        let dpVIS="controll-own.0.TABELLEN.MeisterschaftSpielstand"         //WICHTIG wenn braucheEinVISWidget auf true gesetzt !!  dp zusätzlich für VIS-HTML-Basic-Widget
                        let dpData="openligadb.0.bl3.2019.allmatches";  //quelle von openlig instanz
                        let anzahlSpiele=9;                                // Styandard ist 9 
                        let nextComingGames=0;                              // Styandard ist 0
                        let groesseBilder=16
                        
                        //---------------------------------------
                        
                        
                        //HIER DIE SPALTEN ANZAHL DEFINIEREN - jede Spalte einen Wert - in diesem Beispiel sind es 5
                        var htmlFeld1='Heim';       var Feld1lAlign="center";                     // überschrift Tabellen Spalte1 und  Ausrichtung left,right or center
                        var htmlFeld2=' ';        var Feld2lAlign="right";                      // überschrift Tabellen Spalte2 und  Ausrichtung left,right or center
                        var htmlFeld3='Stand';         var Feld3lAlign="center";                    // überschrift Tabellen Spalte3 und  Ausrichtung left,right or center
                        var htmlFeld4='';        var Feld4lAlign="right";                    // überschrift Tabellen Spalte4 und  Ausrichtung left,right or center
                        var htmlFeld5='Gast';        var Feld5lAlign="center";                    // überschrift Tabellen Spalte5 und  Ausrichtung left,right or center
                        
                        //-----------------------------------
                        
                        
                        //ÜBERSCHRIFT ÜBER TABELLE
                        let   htmlUberschrift=false;                           // mit Überschrift über der tabelle
                        let   htmlSignature=false;                              // anstatt der Überscghrift eine signature: - kleiner - anliegend
                        const htmlFeldUeber='DFB Spielstand';              // Überschrift und Signature
                        const htmlFarbUber="white";                         // Farbe der Überschrift
                        const htmlSchriftWeite="normal";                       // bold, normal - Fettschrift für Überschrift
                        const htmlÜberFontGroesse="18px";                       // schriftgröße überschrift
                        //MEHRERE TABELLEN NEBENEINANDER
                        let   mehrfachTabelle=1;                              // bis zu 4 Tabellen werden nebeneinander geschrieben-  verkürzt das Ganze, dafür etwas breiter - MÖGLICH 1,2,3,oder 4 !!!
                        const trennungsLinie="2";                             //extra trennungslinie bei mehrfachtabellen - evtl auf 0 stellen, wnn htmlRahmenLinien auf none sind
                        const farbetrennungsLinie="white";
                        const htmlFarbZweiteTabelle="white";                // Farbe der Überschrift bei jeder 2.ten Tabelle
                        const htmlFarbTableColorUber="#BDBDBD";               // Überschrift in der tabelle - der einzelnen Spalten
                        //ÜBERSCHRIFT SPALTEN
                        const UeberSchriftHöhe="35";                          //Überschrift bekommt mehr Raum - darunter und darüber - Zellenhöhe
                        const LinieUnterUeberschrift="3";                   // Linie nur unter Spaltenüberschrift - 
                        const farbeLinieUnterUeberschrift="white";
                        const groesseUeberschrift=16;
                        const UeberschriftStyle="normal"                     // möglich "bold"
                        //GANZE TABELLE
                        let abstandZelle="0";
                        let farbeUngeradeZeilen="#000000";                     //Farbe für ungerade Zeilenanzahl - Hintergrund der Spaltenüberschrift bleibt bei htmlFarbTableColorGradient1/2
                        let farbeGeradeZeilen="#151515";                        //Farbe für gerade Zeilenanzahl - Hintergrund der Spaltenüberschrift bleibt bei htmlFarbTableColorGradient1/2
                        let weite="auto";                                     //Weite der Tabelle
                        let zentriert=true;                                   //ganze tabelle zentriert
                        const backgroundAll="#000000";                        //Hintergrund für die ganze Seite - für direkten aufruf oder iqontrol sichtber - keine auswirkung auf vis-widget
                        const htmlSchriftart="Helvetica";
                        const htmlSchriftgroesse="13px";
                        //FELDER UND RAHMEN
                        let   UeberschriftSpalten=true;                // ein- oder ausblenden der spatlen-überschriften
                        const htmlFarbFelderschrift="#FFFFFF";                  // SchriftFarbe der Felder
                        const htmlFarbFelderschrift2="#D8D8D8";                 // SchriftFarbe der Felder für jede 2te Tabelle
                        const htmlFarbTableColorGradient1="#424242";          //  Gradient - Hintergrund der Tabelle - Verlauffarbe
                        const htmlFarbTableColorGradient2="#424242";          //  Gradient - Hintergrund der Tabelle - ist dieser Wert gleich Gradient1 gibt es keinen verlauf
                        const htmlFarbTableBorderColor="grey";             // Farbe des Rahmen - is tdieser gleich den gradienten, sind die rahmen unsichtbar
                        let htmlRahmenLinien="none";                            // Format für Rahmen: MÖGLICH: "none" oder "all" oder "cols" oder "rows"
                        const htmlSpalte1Weite="auto";                   //  Weite der ersten beiden  Spalten oder z.b. 115px
                        
                        // HIER NICHTS  ÄNDERN
                        
                        let borderHelpBottum;
                        let borderHelpRight;
                        let htmlcenterHelp;
                        let htmlcenterHelp2;
                        
                        if(htmlRahmenLinien=="rows") {borderHelpBottum=1;borderHelpRight=0;}
                        if(htmlRahmenLinien=="cols") {borderHelpBottum=0;borderHelpRight=1;}
                        if(htmlRahmenLinien=="none") {borderHelpBottum=0;borderHelpRight=0;}
                        if(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; 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 { vertical-align: middle; 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+"}"+"td:nth-child(2) {width:"+htmlSpalte1Weite+"}"+
                                           " </style></head><body> <div>";
                        //const htmlUeber=    "<p style=\"color:"+htmlFarbUber+"; font-family:"+htmlSchriftart+"; font-weight: bold\">"+htmlFeldUeber+"</p>";                    
                        const htmlTabStyle= "<table bordercolor=\""+htmlFarbTableBorderColor+"\" border=\"2px\" cellspacing=\""+abstandZelle+"\" cellpadding=\""+abstandZelle+"\" width=\""+weite+"\" rules=\""+htmlRahmenLinien+"\" style=\"color:"+htmlFarbFelderschrift+";  font-size:"+htmlSchriftgroesse+
                                              "; font-family:"+htmlSchriftart+";background-image: linear-gradient(42deg,"+htmlFarbTableColorGradient2+","+htmlFarbTableColorGradient1+");\">";
                        const htmlTabUeber1="<tr height=\""+UeberSchriftHöhe+"\" style=\"color:"+htmlFarbTableColorUber+"; font-size: "+groesseUeberschrift+"px; font-weight: "+UeberschriftStyle+" ;  border-bottom: "+LinieUnterUeberschrift+"px solid "+farbeLinieUnterUeberschrift+" \">";
                        const htmlTabUeber3="</tr>";
                        
                        
                        //NICHTS ÄNDERN - abhängig von den oben definierten _Spalten - in diesem Beispiel sind es 5
                        
                        var htmlTabUeber2="<td width="+htmlSpalte1Weite+" align="+Feld1lAlign+">&ensp;"+htmlFeld1+"&ensp;</td><td width="+htmlSpalte1Weite+" align="+Feld2lAlign+">&ensp;"+htmlFeld2+"&ensp;</td><td  align="+Feld3lAlign+">&ensp;"+htmlFeld3+"&ensp;</td><td align="+Feld4lAlign+">&ensp;"+htmlFeld4+"&ensp;</td><td  align="+Feld5lAlign+">&ensp;"+htmlFeld5+"&ensp;</td>";
                        var htmlTabUeber2_1="<td width="+htmlSpalte1Weite+" align="+Feld1lAlign+" style=\"color:"+htmlFarbZweiteTabelle+"\">&ensp;"+htmlFeld1+"&ensp;</td><td width="+htmlSpalte1Weite+" align="+Feld2lAlign+" style=\"color:"+htmlFarbZweiteTabelle+"\">&ensp;"+htmlFeld3+
                                           "&ensp;</td><td  align="+Feld3lAlign+" style=\"color:"+htmlFarbZweiteTabelle+"\">&ensp;"+htmlFeld3+"&ensp;</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbZweiteTabelle+"\">&ensp;"+htmlFeld4+
                                           "&ensp;</td><td align="+Feld5lAlign+" style=\"color:"+htmlFarbZweiteTabelle+"\">&ensp;"+htmlFeld5+"&ensp;</td>";
                                               //------------------------------------------------------
                        
                        
                        
                        var htmlOut="";
                        var mix;
                        var counter;
                        var val1; var val2; var val0; var val3; var val4;
                        var htmlTabUeber="";
                        function writeHTML(){
                        
                        
                        
                        htmlOut="";
                        
                        counter=-1;
                        htmlTabUeber="";
                        switch (mehrfachTabelle) { 
                           case 1: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber3;  break;
                           case 2: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber2_1+htmlTabUeber3; break;
                           case 3: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber2+htmlTabUeber2+htmlTabUeber3; break;
                           case 4: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber2_1+htmlTabUeber2+htmlTabUeber2_1+htmlTabUeber3; break;
                        }; 
                        if (!UeberschriftSpalten) {htmlTabUeber=""}  
                        
                        //--------------------------------------------------------------------------------------------------------------------------------------------------
                        //---------hier kommt eure schleife rein counter++, tabelleBind() und tabelleFinish() müssen so integriert bleiben !!!------------------------------
                        //---------alle valx werte müssen von euch bestimmt werden - val0,val1,val2,val3,val4!!!------------------------------------------------------------
                        //--------------------------------------------------------------------------------------------------------------------------------------------------
                        var val5help="";  var val5;
                        var myData=JSON.parse(getState(dpData).val);
                        var laengeObject=(Object.keys(myData).length)
                        var countMyTrues=0
                         for (var index in myData ) {
                                  if(myData[index].MatchIsFinished==true) countMyTrues++
                         }
                         countMyTrues=countMyTrues+nextComingGames;
                        for (var index in myData ) {           // hier eigene schleife definieren
                            
                               //  if(parseInt(index) >=laengeObject-anzahlSpiele) {
                                      if(parseInt(index) >=countMyTrues-anzahlSpiele && parseInt(index)<=countMyTrues-1 ) {
                                  counter++;                                       // SEHR WICHTIG - MUSS IN JEDER SCHLEIFE INTEGRIERT SEIN
                        //log(index)
                                  val5=myData[index].MatchDateTimeUTC;
                                  let date = new Date(val5);
                              
                                  if (val5help == val5) {
                                  if (myData[index].MatchIsFinished==true) {
                                  val2="<b>"+myData[index].MatchResults[1].PointsTeam1+" : "+myData[index].MatchResults[1].PointsTeam2+"</b>";}else {val2=" - "}
                                 
                                  val3="<img src="+myData[index].Team2.TeamIconUrl+" height=\""+groesseBilder+"\" width=\""+groesseBilder+"\">"
                                  val1="<img src="+myData[index].Team1.TeamIconUrl+" height=\""+groesseBilder+"\" width=\""+groesseBilder+"\">"
                                  if(myData[index].Team1.ShortName!="") {val0=myData[index].Team1.ShortName;} else{val0=myData[index].Team1.TeamName;}
                                  if(myData[index].Team2.ShortName!="") {val4=myData[index].Team2.ShortName;} else{val4=myData[index].Team2.TeamName;}
                                 
                                  
                                 // val4="<span title=\""+date.getDay()+'.' + date.getMonth() + '.'+date.getFullYear()+"   "+date.getHours()+":"+date.getMinutes()+"\">"+val4+"</span>";
                                  val5help=val5
                         
                            tabelleBind(); //HIER NICHTS ÄNDERN : HIER WERDEN DIE DATEN DER SCHLEIFE ZUSAMMENGESETZT  - diese function muss als letztes in der eigenen schleife aufgerufen werden
                        
                        } else {
                            
                               let date = new Date(val5);
                               log(formatDate(getDateObject(date), "O", "de"))
                               val2=formatDate(getDateObject(date), "<center>DD.MM.</br>SS:mm</center>") //"    "+date.getDay()+'.' + date.getMonth() + '.'+date.getFullYear()+"   "+date.getHours()+":"+date.getMinutes()
                              // val2="<center>"+formatDate(getDateObject(date), "O", "de")+"</center>"
                               val1="";val0="";val3="";val4="";
                          
                               tabelleBind(); counter++
                               if (myData[index].MatchIsFinished==true) {
                               val2="<b>"+myData[index].MatchResults[1].PointsTeam1+" : "+myData[index].MatchResults[1].PointsTeam2+"</b>";}else {val2=" - "}
                               val3="<img src="+myData[index].Team2.TeamIconUrl+"height=\""+groesseBilder+"\" width=\""+groesseBilder+"\">"
                               val1="<img src="+myData[index].Team1.TeamIconUrl+"height=\""+groesseBilder+"\" width=\""+groesseBilder+"\">"
                               if(myData[index].Team1.ShortName!="") {val0=myData[index].Team1.ShortName;} else{val0=myData[index].Team1.TeamName;}
                                  if(myData[index].Team2.ShortName!="") {val4=myData[index].Team2.ShortName;} else{val4=myData[index].Team2.TeamName;}
                               tabelleBind();
                               val5help=val5
                             
                        
                        
                        }
                        }
                         }; //Schleifen Ende - je nach schleifenart muss hier etwas geändert werden !!!!!!!!!
                        
                        //-------------------------------------------------------------------------------------------------------------------------------------------------
                        //--------------------------------------------------Ende der schleife------------------------------------------------------------------------------
                        //-------------------------------------------------------------------------------------------------------------------------------------------------
                        
                              tabelleFinish(); // AB HIER NICHTS ÄNDERN - tabelle fertigstellen
                             
                        } // function ende
                        
                        //MAIN:
                         
                        //schedule(mySchedule,  function () {
                            on({id: dpData, change: "any"}, function (obj) { 
                          
                            writeHTML();
                            if (braucheEinFile) {writeFile(home, path ,htmlOut, function (error) { /* log('file written');*/  });}
                               
                           });
                         writeHTML();
                        
                           				 function tabelleBind(){
                             //HIER WERDEN DIE DATEN DER SCHLEIFE ZUSAMMENGESETZT - hat man oben 5 Felder definiert, braucht man hier 5 Werte
                           
                               switch (mehrfachTabelle) {  
                                 case 1:  if(counter%2==0) {  htmlOut=htmlOut+"<tr bgcolor=\""+farbeGeradeZeilen+"\"><td align="+Feld1lAlign+" >&ensp;"+val0+"&ensp;</td><td align="+Feld2lAlign+">&ensp;"+val1+"&ensp;</td><td align="+Feld3lAlign+">&ensp;"+val2+"&ensp;</td><td align="+Feld4lAlign+">&ensp;"+val3+"&ensp;</td><td align="+Feld5lAlign+">&ensp;"+val4+"&ensp;</td></tr>"; break; } else
                                                          {  htmlOut=htmlOut+"<tr bgcolor=\""+farbeUngeradeZeilen+"\"><td align="+Feld1lAlign+" >&ensp;"+val0+"&ensp;</td><td align="+Feld2lAlign+">&ensp;"+val1+"&ensp;</td><td align="+Feld3lAlign+">&ensp;"+val2+"&ensp;</td><td align="+Feld4lAlign+">&ensp;"+val3+"&ensp;</td><td align="+Feld5lAlign+">&ensp;"+val4+"&ensp;</td></tr>"; break; } 
                               
                                case 2: if(counter%4==0){
                                           if(counter%2==0)  {htmlOut = htmlOut+"<tr bgcolor=\""+farbeGeradeZeilen+"\"><td align="+Feld1lAlign+" >&ensp;"+val0+"&ensp;</td><td align="+Feld2lAlign+">&ensp;"+val1+"&ensp;</td><td align="+Feld3lAlign+">&ensp;"+val2+"&ensp;</td><td align="+Feld4lAlign+">&ensp;"+val3+"&ensp;</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\"  align="+Feld5lAlign+">&ensp;"+val4+"&ensp;</td>"; } 
                                                      else {htmlOut = htmlOut+"<td align="+Feld1lAlign+"  style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val0+"&ensp;</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val1+"&ensp;</td><td  align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val2+"&ensp;</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val3+"&ensp;</td><td align="+Feld5lAlign+">&ensp;"+val4+"&ensp;</td></tr>";} break;
                                       }else{
                                                      if(counter%2==0)  {htmlOut = htmlOut+"<tr bgcolor=\""+farbeUngeradeZeilen+"\"><td align="+Feld1lAlign+" >&ensp;"+val0+"&ensp;</td><td align="+Feld2lAlign+">&ensp;"+val1+"&ensp;</td><td align="+Feld3lAlign+">&ensp;"+val2+"&ensp;</td><td align="+Feld4lAlign+">&ensp;"+val3+"&ensp;</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\" align="+Feld5lAlign+">&ensp;"+val4+"&ensp;</td>"; } 
                                                      else {htmlOut = htmlOut+"<td align="+Feld1lAlign+"  style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val0+"&ensp;</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val1+"&ensp;</td><td  align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val2+"&ensp;</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val3+"&ensp;</td><td align="+Feld5lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val4+"&ensp;</td></tr>";} break;}
                                                           
                                case 3:  if(counter%2==0)   {
                                         if(counter%3==0 )  {htmlOut = htmlOut+"<tr bgcolor=\""+farbeGeradeZeilen+"\"><td align="+Feld1lAlign+" >&ensp;"+val0+"&ensp;</td><td align="+Feld2lAlign+">&ensp;"+val1+"&ensp;</td><td align="+Feld3lAlign+">&ensp;"+val2+"&ensp;</td><td  align="+Feld4lAlign+">&ensp;"+val3+"&ensp;</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\" align="+Feld5lAlign+">&ensp;"+val4+"&ensp;</td>"; } 
                                                      else { if(counter%3==1 )  { htmlOut = htmlOut+"<td align="+Feld1lAlign+"  style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val0+"&ensp;</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val1+"&ensp;</td><td  align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val2+"&ensp;</td><td  align="+Feld4lAlign+" style=\" color:"+htmlFarbFelderschrift2+"\">&ensp;"+val3+"&ensp;</td><td align="+Feld5lAlign+" style=\"border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"; color:"+htmlFarbFelderschrift2+"\">&ensp;"+val4+"&ensp;</td>";} 
                                                                       else    {htmlOut = htmlOut+"<td align="+Feld1lAlign+" >&ensp;"+val0+"&ensp;</td><td align="+Feld2lAlign+">&ensp;"+val1+"&ensp;</td><td align="+Feld3lAlign+">&ensp;"+val2+"&ensp;</td><td align="+Feld4lAlign+">&ensp;"+val3+"&ensp;</td><td align="+Feld5lAlign+">&ensp;"+val4+"&ensp;</td></tr>";}
                                                                 } break;} else{
                                         if(counter%3==0 )  {htmlOut = htmlOut+"<tr bgcolor=\""+farbeUngeradeZeilen+"\"><td align="+Feld1lAlign+" >&ensp;"+val0+"&ensp;</td><td align="+Feld2lAlign+">&ensp;"+val1+"&ensp;</td><td align="+Feld3lAlign+">&ensp;"+val2+"&ensp;</td><td align="+Feld4lAlign+">&ensp;"+val3+"&ensp;</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\" align="+Feld5lAlign+">&ensp;"+val4+"&ensp;</td>"; } 
                                                      else { if(counter%3==1 )  { htmlOut = htmlOut+"<td align="+Feld1lAlign+"  style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val0+"&ensp;</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val1+"&ensp;</td><td  align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val2+"&ensp;</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val3+"&ensp;</td><td align="+Feld5lAlign+" style=\"border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"; color:"+htmlFarbFelderschrift2+"\">&ensp;"+val4+"&ensp;</td>";} 
                                                                       else    {htmlOut = htmlOut+"<td align="+Feld1lAlign+" >&ensp;"+val0+"&ensp;</td><td align="+Feld2lAlign+">&ensp;"+val1+"&ensp;</td><td align="+Feld3lAlign+">&ensp;"+val2+"&ensp;</td><td align="+Feld4lAlign+">&ensp;"+val3+"&ensp;</td><td align="+Feld5lAlign+">&ensp;"+val4+"&ensp;</td></tr>";}
                                                                 } break; }
                        
                                case 4:  if(counter%8==0)   {
                                         if(counter%4==0)  {htmlOut = htmlOut+"<tr bgcolor=\""+farbeGeradeZeilen+"\"><td align="+Feld1lAlign+" >&ensp;"+val0+"&ensp;</td><td align="+Feld2lAlign+">&ensp;"+val1+"&ensp;</td><td align="+Feld3lAlign+">&ensp;"+val2+"&ensp;</td><td align="+Feld4lAlign+">&ensp;"+val4+"&ensp;</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\" align="+Feld5lAlign+">&ensp;"+val3+"&ensp;</td>"; } 
                                                          else {if(counter%4==1 )  { htmlOut = htmlOut+"<td  align="+Feld1lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val0+"&ensp;</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val1+"&ensp;</td><td  align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val2+"&ensp;</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val3+"&ensp;</td><td align="+Feld5lAlign+" style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"; color:"+htmlFarbFelderschrift2+"\">&ensp;"+val4+"&ensp;</td>";} 
                                                                       else    {if(counter%4==3)  { htmlOut= htmlOut+"<td align="+Feld1lAlign+"  style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val0+"&ensp;</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val1+"&ensp;</td><td align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val2+"&ensp;</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val3+"&ensp;</td><td align="+Feld5lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val4+"&ensp;</td></tr>";} 
                                                                                         else    {htmlOut = htmlOut+"<td align="+Feld1lAlign+" >&ensp;"+val0+"&ensp;</td><td align="+Feld2lAlign+">&ensp;"+val1+"&ensp;</td><td align="+Feld3lAlign+">&ensp;"+val2+"&ensp;</td><td align="+Feld4lAlign+">&ensp;"+val3+"&ensp;</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\" align="+Feld5lAlign+">&ensp;"+val4+"&ensp;</td>";}}
                                                                 } break;} else{
                                         if(counter%4==0)  {htmlOut = htmlOut+"<tr bgcolor=\""+farbeUngeradeZeilen+"\"><td align="+Feld1lAlign+" >&ensp;"+val0+"&ensp;</td><td align="+Feld2lAlign+">&ensp;"+val1+"&ensp;</td><td align="+Feld3lAlign+">&ensp;"+val2+"&ensp;</td><td align="+Feld4lAlign+">&ensp;"+val3+"&ensp;</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\" align="+Feld5lAlign+">&ensp;"+val3+"&ensp;</td>"; } 
                                                          else {if(counter%4==1 )  { htmlOut = htmlOut+"<td  align="+Feld1lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val0+"&ensp;</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val1+"&ensp;</td><td  align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val2+"&ensp;</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val3+"&ensp;</td><td align="+Feld5lAlign+" style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"; color:"+htmlFarbFelderschrift2+"\">&ensp;"+val4+"&ensp;</td>";} 
                                                                       else    {if(counter%4==3)  { htmlOut= htmlOut+"<td align="+Feld1lAlign+"  style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val0+"&ensp;</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val1+"&ensp;</td><td align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val2+"&ensp;</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val3+"&ensp;</td><td align="+Feld5lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">&ensp;"+val4+"&ensp;</td></tr>";} 
                                                                                         else    {htmlOut = htmlOut+"<td align="+Feld1lAlign+" >&ensp;"+val0+"&ensp;</td><td align="+Feld2lAlign+">&ensp;"+val1+"&ensp;</td><td align="+Feld3lAlign+">&ensp;"+val2+"&ensp;</td><td align="+Feld4lAlign+">&ensp;"+val3+"&ensp;</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\" align="+Feld5lAlign+">&ensp;"+val4+"&ensp;</td>";}}
                                                                 } break; }
                        
                             } //switch ende
                        
                        
                        
                        }
                        
                        function tabelleFinish() {
                        
                              // tabelle fertigstellen
                        switch (mehrfachTabelle) {  
                               case 1:    break;
                        
                               case 2:    
                                          if(counter%2==0)  htmlOut = htmlOut.replace(/<\/td>$/, '</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>');
                                        
                                          break;
                        
                               case 3:   if(counter%3==2)  htmlOut = htmlOut.replace(/<\/td>$/, "</td></tr>");
                                         if(counter%3==1)  htmlOut = htmlOut.replace(/<\/td>$/, "</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>");        
                                         if(counter%3==0)      htmlOut = htmlOut.replace(/<\/td>$/, "</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td  style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"\">&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>");
                                       
                                          break;
                               case 4:   if(counter%4==3)  htmlOut = htmlOut.replace(/<\/td>$/, "</td></tr>");
                                         if(counter%4==2)  htmlOut = htmlOut.replace(/<\/td>$/, "</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>");
                                         if(counter%4==1)  htmlOut = htmlOut.replace(/<\/td>$/, "</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"\">&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>");    
                                         if(counter%4==0)  htmlOut = htmlOut.replace(/<\/td>$/, "</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"\">&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"\">&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>");      
                                         break; }
                             
                                            var htmlUeber=    "<p style=\"color:"+htmlFarbUber+"; font-family:"+htmlSchriftart+"; font-size: "+htmlÜberFontGroesse+"; font-weight:"+htmlSchriftWeite+ "\">"+htmlFeldUeber+"&ensp;&ensp;Last Update: "+formatDate(getDateObject((parseFloat((new Date().getTime())))), "SS:mm:ss");+"</p>"; 
                               var htmlUnter= "<div  style=\"color:"+htmlFarbUber+"; font-family:"+htmlSchriftart+"; font-size: 70%; text-align: right;\" >"+htmlFeldUeber+"&ensp;&ensp;Last Update: "+formatDate(getDateObject((parseFloat((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 : htmlOutVIS=htmlUeber+htmlTabStyle+htmlTabUeber+htmlOut+"</table>"+htmlUnter ;
                        
                                      } else {
                                       zentriert ?  htmlOutVIS=htmlZentriert+htmlTabStyle+htmlTabUeber+htmlOut+"</table>"+htmlUnter :  htmlOutVIS=htmlTabStyle+htmlTabUeber+htmlOut+"</table>"+htmlUnter;
                        
                                         }
                        
                        // log("bin raus aus tabelleBind");
                                   if (braucheEinVISWidget) setState(dpVIS, htmlOutVIS );
                        
                         var htmlUnter= "<div  style=\"color:"+htmlFarbUber+"; font-family:"+htmlSchriftart+"; font-size: 80%;  text-align: center; \" >"+htmlFeldUeber+"&ensp;&ensp;Last Update: "+formatDate(getDateObject((parseFloat((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);
                         
                        
                        
                        }
                        
                        
                        
                        

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

                          @liv-in-sky said in Bundesliga Meisterschaft HTML Tabelle:

                          So ist es richtig (denn jetzt ist Braunschweig auch aufgestiegen in die 2. Bundesliga) aber nur der letzte Spieltag sprich von gestern. Wann kommen denn die Ansetzungen für den letzten Spieltag am Samstag?

                          liv-in-sky 3 Replies Last reply Reply Quote 0
                          • liv-in-sky
                            liv-in-sky @biker1602 last edited by liv-in-sky

                            @biker1602

                            oh mann - sorry - im moment wird mein javascript nicht immer gespeichert - dazu gibt es einen extra forumeintrag - du kannst das im setting des scriptes einstellen

                            sonderheit beim spielstände script:

                            • bei variable anzahlSpiele=18 und (davon) nextComingGames ist 9 , werden die letzten 9 abgeschlossenen spiele gezeigt und die 9 nächsten anstehenden (erstes bild)
                            • bei variable anzahlSpiele=9 und (davon) nextComingGames ist 0 , werden die letzten 9 abgeschlossenen spiele gezeigt - sonst nix (zweites bild)
                            • du kannst auch 27 und 18 einstellen - also insgesamt den letzten spieltag und die nächsten kommenden 2 spietage

                            daher nochmal das script zum download ( hoffentlich richtig gepseichert:-) )

                            Image 6.png

                            //@liv-in-sky 2020  2.7. 15:11
                            
                            
                            //HIER WIRD PFAD UND FILENAME DEFINIERT
                            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=true;                          // bei true wird ein file geschrieben
                            let   braucheEinVISWidget=true;                     // bei true wird ein html-tabelle in einen dp geschrieben - siehe nächste zeile
                            let dpVIS="controll-own.0.TABELLEN.MeisterschaftSpielstand"         //WICHTIG wenn braucheEinVISWidget auf true gesetzt !!  dp zusätzlich für VIS-HTML-Basic-Widget
                            let dpData="openligadb.0.bl3.2019.allmatches";  //quelle von openlig instanz
                            let anzahlSpiele=20;                                // Styandard ist 9 
                            let nextComingGames=10;                              // Styandard ist 0
                            let groesseBilder=16
                            
                            //---------------------------------------
                            
                            
                            //HIER DIE SPALTEN ANZAHL DEFINIEREN - jede Spalte einen Wert - in diesem Beispiel sind es 5
                            var htmlFeld1='Heim';       var Feld1lAlign="center";                     // überschrift Tabellen Spalte1 und  Ausrichtung left,right or center
                            var htmlFeld2=' ';        var Feld2lAlign="right";                      // überschrift Tabellen Spalte2 und  Ausrichtung left,right or center
                            var htmlFeld3='Stand';         var Feld3lAlign="center";                    // überschrift Tabellen Spalte3 und  Ausrichtung left,right or center
                            var htmlFeld4='';        var Feld4lAlign="right";                    // überschrift Tabellen Spalte4 und  Ausrichtung left,right or center
                            var htmlFeld5='Gast';        var Feld5lAlign="center";                    // überschrift Tabellen Spalte5 und  Ausrichtung left,right or center
                            
                            //-----------------------------------
                            
                            
                            //ÜBERSCHRIFT ÜBER TABELLE
                            let   htmlUberschrift=false;                           // mit Überschrift über der tabelle
                            let   htmlSignature=false;                              // anstatt der Überscghrift eine signature: - kleiner - anliegend
                            const htmlFeldUeber='DFB Spielstand';              // Überschrift und Signature
                            const htmlFarbUber="white";                         // Farbe der Überschrift
                            const htmlSchriftWeite="normal";                       // bold, normal - Fettschrift für Überschrift
                            const htmlÜberFontGroesse="18px";                       // schriftgröße überschrift
                            //MEHRERE TABELLEN NEBENEINANDER
                            let   mehrfachTabelle=1;                              // bis zu 4 Tabellen werden nebeneinander geschrieben-  verkürzt das Ganze, dafür etwas breiter - MÖGLICH 1,2,3,oder 4 !!!
                            const trennungsLinie="2";                             //extra trennungslinie bei mehrfachtabellen - evtl auf 0 stellen, wnn htmlRahmenLinien auf none sind
                            const farbetrennungsLinie="white";
                            const htmlFarbZweiteTabelle="white";                // Farbe der Überschrift bei jeder 2.ten Tabelle
                            const htmlFarbTableColorUber="#BDBDBD";               // Überschrift in der tabelle - der einzelnen Spalten
                            //ÜBERSCHRIFT SPALTEN
                            const UeberSchriftHöhe="35";                          //Überschrift bekommt mehr Raum - darunter und darüber - Zellenhöhe
                            const LinieUnterUeberschrift="3";                   // Linie nur unter Spaltenüberschrift - 
                            const farbeLinieUnterUeberschrift="white";
                            const groesseUeberschrift=16;
                            const UeberschriftStyle="normal"                     // möglich "bold"
                            //GANZE TABELLE
                            let abstandZelle="0";
                            let farbeUngeradeZeilen="#000000";                     //Farbe für ungerade Zeilenanzahl - Hintergrund der Spaltenüberschrift bleibt bei htmlFarbTableColorGradient1/2
                            let farbeGeradeZeilen="#151515";                        //Farbe für gerade Zeilenanzahl - Hintergrund der Spaltenüberschrift bleibt bei htmlFarbTableColorGradient1/2
                            let weite="auto";                                     //Weite der Tabelle
                            let zentriert=true;                                   //ganze tabelle zentriert
                            const backgroundAll="#000000";                        //Hintergrund für die ganze Seite - für direkten aufruf oder iqontrol sichtber - keine auswirkung auf vis-widget
                            const htmlSchriftart="Helvetica";
                            const htmlSchriftgroesse="13px";
                            //FELDER UND RAHMEN
                            let   UeberschriftSpalten=true;                // ein- oder ausblenden der spatlen-überschriften
                            const htmlFarbFelderschrift="#FFFFFF";                  // SchriftFarbe der Felder
                            const htmlFarbFelderschrift2="#D8D8D8";                 // SchriftFarbe der Felder für jede 2te Tabelle
                            const htmlFarbTableColorGradient1="#424242";          //  Gradient - Hintergrund der Tabelle - Verlauffarbe
                            const htmlFarbTableColorGradient2="#424242";          //  Gradient - Hintergrund der Tabelle - ist dieser Wert gleich Gradient1 gibt es keinen verlauf
                            const htmlFarbTableBorderColor="grey";             // Farbe des Rahmen - is tdieser gleich den gradienten, sind die rahmen unsichtbar
                            let htmlRahmenLinien="none";                            // Format für Rahmen: MÖGLICH: "none" oder "all" oder "cols" oder "rows"
                            const htmlSpalte1Weite="auto";                   //  Weite der ersten beiden  Spalten oder z.b. 115px
                            
                            // HIER NICHTS  ÄNDERN
                            
                            let borderHelpBottum;
                            let borderHelpRight;
                            let htmlcenterHelp;
                            let htmlcenterHelp2;
                            
                            if(htmlRahmenLinien=="rows") {borderHelpBottum=1;borderHelpRight=0;}
                            if(htmlRahmenLinien=="cols") {borderHelpBottum=0;borderHelpRight=1;}
                            if(htmlRahmenLinien=="none") {borderHelpBottum=0;borderHelpRight=0;}
                            if(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; 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 { vertical-align: middle; 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+"}"+"td:nth-child(2) {width:"+htmlSpalte1Weite+"}"+
                                               " </style></head><body> <div>";
                            //const htmlUeber=    "<p style=\"color:"+htmlFarbUber+"; font-family:"+htmlSchriftart+"; font-weight: bold\">"+htmlFeldUeber+"</p>";                    
                            const htmlTabStyle= "<table bordercolor=\""+htmlFarbTableBorderColor+"\" border=\"2px\" cellspacing=\""+abstandZelle+"\" cellpadding=\""+abstandZelle+"\" width=\""+weite+"\" rules=\""+htmlRahmenLinien+"\" style=\"color:"+htmlFarbFelderschrift+";  font-size:"+htmlSchriftgroesse+
                                                  "; font-family:"+htmlSchriftart+";background-image: linear-gradient(42deg,"+htmlFarbTableColorGradient2+","+htmlFarbTableColorGradient1+");\">";
                            const htmlTabUeber1="<tr height=\""+UeberSchriftHöhe+"\" style=\"color:"+htmlFarbTableColorUber+"; font-size: "+groesseUeberschrift+"px; font-weight: "+UeberschriftStyle+" ;  border-bottom: "+LinieUnterUeberschrift+"px solid "+farbeLinieUnterUeberschrift+" \">";
                            const htmlTabUeber3="</tr>";
                            
                            
                            //NICHTS ÄNDERN - abhängig von den oben definierten _Spalten - in diesem Beispiel sind es 5
                            
                            var htmlTabUeber2="<td width="+htmlSpalte1Weite+" align="+Feld1lAlign+">&ensp;"+htmlFeld1+"&ensp;</td><td width="+htmlSpalte1Weite+" align="+Feld2lAlign+">&ensp;"+htmlFeld2+"&ensp;</td><td  align="+Feld3lAlign+">&ensp;"+htmlFeld3+"&ensp;</td><td align="+Feld4lAlign+">&ensp;"+htmlFeld4+"&ensp;</td><td  align="+Feld5lAlign+">&ensp;"+htmlFeld5+"&ensp;</td>";
                            var htmlTabUeber2_1="<td width="+htmlSpalte1Weite+" align="+Feld1lAlign+" style=\"color:"+htmlFarbZweiteTabelle+"\">&ensp;"+htmlFeld1+"&ensp;</td><td width="+htmlSpalte1Weite+" align="+Feld2lAlign+" style=\"color:"+htmlFarbZweiteTabelle+"\">&ensp;"+htmlFeld3+
                                               "&ensp;</td><td  align="+Feld3lAlign+" style=\"color:"+htmlFarbZweiteTabelle+"\">&ensp;"+htmlFeld3+"&ensp;</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbZweiteTabelle+"\">&ensp;"+htmlFeld4+
                                               "&ensp;</td><td align="+Feld5lAlign+" style=\"color:"+htmlFarbZweiteTabelle+"\">&ensp;"+htmlFeld5+"&ensp;</td>";
                                                   //------------------------------------------------------
                            
                            
                            
                            var htmlOut="";
                            var mix;
                            var counter;
                            var val1; var val2; var val0; var val3; var val4;
                            var htmlTabUeber="";
                            function writeHTML(){
                            
                            
                            
                            htmlOut="";
                            
                            counter=-1;
                            htmlTabUeber="";
                            switch (mehrfachTabelle) { 
                               case 1: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber3;  break;
                               case 2: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber2_1+htmlTabUeber3; break;
                               case 3: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber2+htmlTabUeber2+htmlTabUeber3; break;
                               case 4: htmlTabUeber=htmlTabUeber1+htmlTabUeber2+htmlTabUeber2_1+htmlTabUeber2+htmlTabUeber2_1+htmlTabUeber3; break;
                            }; 
                            if (!UeberschriftSpalten) {htmlTabUeber=""}  
                            
                            //--------------------------------------------------------------------------------------------------------------------------------------------------
                            //---------hier kommt eure schleife rein counter++, tabelleBind() und tabelleFinish() müssen so integriert bleiben !!!------------------------------
                            //---------alle valx werte müssen von euch bestimmt werden - val0,val1,val2,val3,val4!!!------------------------------------------------------------
                            //--------------------------------------------------------------------------------------------------------------------------------------------------
                            var val5help="";  var val5;
                            var myData=JSON.parse(getState(dpData).val);
                            var laengeObject=(Object.keys(myData).length)
                            var countMyTrues=0
                             for (var index in myData ) {
                                      if(myData[index].MatchIsFinished==true) countMyTrues++
                             }
                             countMyTrues=countMyTrues+nextComingGames;
                            for (var index in myData ) {           // hier eigene schleife definieren
                                   // log(parseInt(index).toString()+" " )
                                   //  if(parseInt(index) >=laengeObject-anzahlSpiele) {
                                          if(parseInt(index) >=countMyTrues-anzahlSpiele && parseInt(index)<=countMyTrues+nextComingGames-1 ) {
                                      counter++;                                       // SEHR WICHTIG - MUSS IN JEDER SCHLEIFE INTEGRIERT SEIN
                            //log(index)
                            //log(parseInt(index).toString()+" " )
                                      val5=myData[index].MatchDateTimeUTC;
                                      let date = new Date(val5);
                                  
                                      if (val5help == val5) {
                                      if (myData[index].MatchIsFinished==true) {
                                      val2="<b>"+myData[index].MatchResults[1].PointsTeam1+" : "+myData[index].MatchResults[1].PointsTeam2+"</b>";}else {val2=" - "}
                                     
                                      val3="<img src="+myData[index].Team2.TeamIconUrl+" height=\""+groesseBilder+"\" width=\""+groesseBilder+"\">"
                                      val1="<img src="+myData[index].Team1.TeamIconUrl+" height=\""+groesseBilder+"\" width=\""+groesseBilder+"\">"
                                      if(myData[index].Team1.ShortName!="") {val0=myData[index].Team1.ShortName;} else{val0=myData[index].Team1.TeamName;}
                                      if(myData[index].Team2.ShortName!="") {val4=myData[index].Team2.ShortName;} else{val4=myData[index].Team2.TeamName;}
                                     
                                      
                                     // val4="<span title=\""+date.getDay()+'.' + date.getMonth() + '.'+date.getFullYear()+"   "+date.getHours()+":"+date.getMinutes()+"\">"+val4+"</span>";
                                      val5help=val5
                             
                                tabelleBind(); //HIER NICHTS ÄNDERN : HIER WERDEN DIE DATEN DER SCHLEIFE ZUSAMMENGESETZT  - diese function muss als letztes in der eigenen schleife aufgerufen werden
                            
                            } else {
                                
                                   let date = new Date(val5);
                                   val2=formatDate(getDateObject(date), "<center>DD.MM.</br>SS:mm") //"    "+date.getDay()+'.' + date.getMonth() + '.'+date.getFullYear()+"   "+date.getHours()+":"+date.getMinutes()
                                   val2="<center>"+formatDate(getDateObject(date), "TT.")+" "+formatDate(getDateObject(date), "O", "de")+"</br>"+formatDate(getDateObject(date), "SS:mm") +"</center>"
                                   
                                   val1="";val0="";val3="";val4="";
                              
                                   tabelleBind(); counter++
                                   if (myData[index].MatchIsFinished==true) {
                                   val2="<b>"+myData[index].MatchResults[1].PointsTeam1+" : "+myData[index].MatchResults[1].PointsTeam2+"</b>";}else {val2=" - "}
                                   val3="<img src="+myData[index].Team2.TeamIconUrl+"height=\""+groesseBilder+"\" width=\""+groesseBilder+"\">"
                                   val1="<img src="+myData[index].Team1.TeamIconUrl+"height=\""+groesseBilder+"\" width=\""+groesseBilder+"\">"
                                   if(myData[index].Team1.ShortName!="") {val0=myData[index].Team1.ShortName;} else{val0=myData[index].Team1.TeamName;}
                                      if(myData[index].Team2.ShortName!="") {val4=myData[index].Team2.ShortName;} else{val4=myData[index].Team2.TeamName;}
                                   tabelleBind();
                                   val5help=val5
                                 
                            
                            
                            }
                            }
                             }; //Schleifen Ende - je nach schleifenart muss hier etwas geändert werden !!!!!!!!!
                            
                            //-------------------------------------------------------------------------------------------------------------------------------------------------
                            //--------------------------------------------------Ende der schleife------------------------------------------------------------------------------
                            //-------------------------------------------------------------------------------------------------------------------------------------------------
                            
                                  tabelleFinish(); // AB HIER NICHTS ÄNDERN - tabelle fertigstellen
                                 
                            } // function ende
                            
                            //MAIN:
                             
                            //schedule(mySchedule,  function () {
                                on({id: dpData, change: "any"}, function (obj) { 
                              
                                writeHTML();
                                if (braucheEinFile) {writeFile(home, path ,htmlOut, function (error) { /* log('file written');*/  });}
                                   
                               });
                             writeHTML();
                            
                               				 function tabelleBind(){
                                 //HIER WERDEN DIE DATEN DER SCHLEIFE ZUSAMMENGESETZT - hat man oben 5 Felder definiert, braucht man hier 5 Werte
                               
                                   switch (mehrfachTabelle) {  
                                     case 1:  if(counter%2==0) {  htmlOut=htmlOut+"<tr bgcolor=\""+farbeGeradeZeilen+"\"><td vertical-align=middle align="+Feld1lAlign+" >"+val0+"</td><td vertical-align=middle align="+Feld2lAlign+">"+val1+"</td><td vertical-align=middle align="+Feld3lAlign+">"+val2+"</td><td vertical-align=middle align="+Feld4lAlign+">"+val3+"</td><td vertical-align=middle align="+Feld5lAlign+">"+val4+"</td></tr>"; break; } else
                                                              {  htmlOut=htmlOut+"<tr bgcolor=\""+farbeUngeradeZeilen+"\"><td vertical-align=middle align="+Feld1lAlign+" >"+val0+"</td><td vertical-align=middle align="+Feld2lAlign+">"+val1+"</td><td vertical-align=middle align="+Feld3lAlign+">"+val2+"</td><td vertical-align=middle align="+Feld4lAlign+">"+val3+"</td><td vertical-align=middle align="+Feld5lAlign+">"+val4+"</td></tr>"; break; } 
                                   
                                    case 2: if(counter%4==0){
                                               if(counter%2==0)  {htmlOut = htmlOut+"<tr bgcolor=\""+farbeGeradeZeilen+"\"><td vertical-align=middle align="+Feld1lAlign+" >"+val0+"</td><td vertical-align=middle align="+Feld2lAlign+">"+val1+"</td><td vertical-align=middle align="+Feld3lAlign+">"+val2+"</td><td vertical-align=middle align="+Feld4lAlign+">"+val3+"</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\"  align="+Feld5lAlign+">"+val4+"</td>"; } 
                                                          else {htmlOut = htmlOut+"<td vertical-align=middle align="+Feld1lAlign+"  style=\"color:"+htmlFarbFelderschrift2+"\">"+val0+"</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val1+"</td><td  align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val2+"</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val3+"</td><td vertical-align=middle align="+Feld5lAlign+">"+val4+"</td></tr>";} break;
                                           }else{
                                                          if(counter%2==0)  {htmlOut = htmlOut+"<tr bgcolor=\""+farbeUngeradeZeilen+"\"><td vertical-align=middle align="+Feld1lAlign+" >"+val0+"</td><td vertical-align=middle align="+Feld2lAlign+">"+val1+"</td><td vertical-align=middle align="+Feld3lAlign+">"+val2+"</td><td vertical-align=middle align="+Feld4lAlign+">"+val3+"</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\" align="+Feld5lAlign+">"+val4+"</td>"; } 
                                                          else {htmlOut = htmlOut+"<td vertical-align=middle align="+Feld1lAlign+"  style=\"color:"+htmlFarbFelderschrift2+"\">"+val0+"</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val1+"</td><td  align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val2+"</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val3+"</td><td vertical-align=middle align="+Feld5lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val4+"</td></tr>";} break;}
                                                               
                                    case 3:  if(counter%2==0)   {
                                             if(counter%3==0 )  {htmlOut = htmlOut+"<tr bgcolor=\""+farbeGeradeZeilen+"\"><td vertical-align=middle align="+Feld1lAlign+" >"+val0+"</td><td vertical-align=middle align="+Feld2lAlign+">"+val1+"</td><td vertical-align=middle align="+Feld3lAlign+">"+val2+"</td><td  align="+Feld4lAlign+">"+val3+"</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\" align="+Feld5lAlign+">"+val4+"</td>"; } 
                                                          else { if(counter%3==1 )  { htmlOut = htmlOut+"<td vertical-align=middle align="+Feld1lAlign+"  style=\"color:"+htmlFarbFelderschrift2+"\">"+val0+"</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val1+"</td><td  align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val2+"</td><td  align="+Feld4lAlign+" style=\" color:"+htmlFarbFelderschrift2+"\">"+val3+"</td><td vertical-align=middle align="+Feld5lAlign+" style=\"border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"; color:"+htmlFarbFelderschrift2+"\">"+val4+"</td>";} 
                                                                           else    {htmlOut = htmlOut+"<td vertical-align=middle align="+Feld1lAlign+" >"+val0+"</td><td vertical-align=middle align="+Feld2lAlign+">"+val1+"</td><td vertical-align=middle align="+Feld3lAlign+">"+val2+"</td><td vertical-align=middle align="+Feld4lAlign+">"+val3+"</td><td vertical-align=middle align="+Feld5lAlign+">"+val4+"</td></tr>";}
                                                                     } break;} else{
                                             if(counter%3==0 )  {htmlOut = htmlOut+"<tr bgcolor=\""+farbeUngeradeZeilen+"\"><td vertical-align=middle align="+Feld1lAlign+" >"+val0+"</td><td vertical-align=middle align="+Feld2lAlign+">"+val1+"</td><td vertical-align=middle align="+Feld3lAlign+">"+val2+"</td><td vertical-align=middle align="+Feld4lAlign+">"+val3+"</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\" align="+Feld5lAlign+">"+val4+"</td>"; } 
                                                          else { if(counter%3==1 )  { htmlOut = htmlOut+"<td vertical-align=middle align="+Feld1lAlign+"  style=\"color:"+htmlFarbFelderschrift2+"\">"+val0+"</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val1+"</td><td  align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val2+"</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val3+"</td><td vertical-align=middle align="+Feld5lAlign+" style=\"border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"; color:"+htmlFarbFelderschrift2+"\">"+val4+"</td>";} 
                                                                           else    {htmlOut = htmlOut+"<td vertical-align=middle align="+Feld1lAlign+" >"+val0+"</td><td vertical-align=middle align="+Feld2lAlign+">"+val1+"</td><td vertical-align=middle align="+Feld3lAlign+">"+val2+"</td><td vertical-align=middle align="+Feld4lAlign+">"+val3+"</td><td vertical-align=middle align="+Feld5lAlign+">"+val4+"</td></tr>";}
                                                                     } break; }
                            
                                    case 4:  if(counter%8==0)   {
                                             if(counter%4==0)  {htmlOut = htmlOut+"<tr bgcolor=\""+farbeGeradeZeilen+"\"><td vertical-align=middle align="+Feld1lAlign+" >"+val0+"</td><td vertical-align=middle align="+Feld2lAlign+">"+val1+"</td><td vertical-align=middle align="+Feld3lAlign+">"+val2+"</td><td vertical-align=middle align="+Feld4lAlign+">"+val4+"</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\" align="+Feld5lAlign+">"+val3+"</td>"; } 
                                                              else {if(counter%4==1 )  { htmlOut = htmlOut+"<td  align="+Feld1lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val0+"</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val1+"</td><td  align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val2+"</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val3+"</td><td vertical-align=middle align="+Feld5lAlign+" style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"; color:"+htmlFarbFelderschrift2+"\">"+val4+"</td>";} 
                                                                           else    {if(counter%4==3)  { htmlOut= htmlOut+"<td vertical-align=middle align="+Feld1lAlign+"  style=\"color:"+htmlFarbFelderschrift2+"\">"+val0+"</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val1+"</td><td vertical-align=middle align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val2+"</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val3+"</td><td vertical-align=middle align="+Feld5lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val4+"</td></tr>";} 
                                                                                             else    {htmlOut = htmlOut+"<td vertical-align=middle align="+Feld1lAlign+" >"+val0+"</td><td vertical-align=middle align="+Feld2lAlign+">"+val1+"</td><td vertical-align=middle align="+Feld3lAlign+">"+val2+"</td><td vertical-align=middle align="+Feld4lAlign+">"+val3+"</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\" align="+Feld5lAlign+">"+val4+"</td>";}}
                                                                     } break;} else{
                                             if(counter%4==0)  {htmlOut = htmlOut+"<tr bgcolor=\""+farbeUngeradeZeilen+"\"><td vertical-align=middle align="+Feld1lAlign+" >"+val0+"</td><td vertical-align=middle align="+Feld2lAlign+">"+val1+"</td><td vertical-align=middle align="+Feld3lAlign+">"+val2+"</td><td vertical-align=middle align="+Feld4lAlign+">"+val3+"</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\" align="+Feld5lAlign+">"+val3+"</td>"; } 
                                                              else {if(counter%4==1 )  { htmlOut = htmlOut+"<td  align="+Feld1lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val0+"</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val1+"</td><td  align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val2+"</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val3+"</td><td vertical-align=middle align="+Feld5lAlign+" style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"; color:"+htmlFarbFelderschrift2+"\">"+val4+"</td>";} 
                                                                           else    {if(counter%4==3)  { htmlOut= htmlOut+"<td vertical-align=middle align="+Feld1lAlign+"  style=\"color:"+htmlFarbFelderschrift2+"\">"+val0+"</td><td  align="+Feld2lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val1+"</td><td vertical-align=middle align="+Feld3lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val2+"</td><td  align="+Feld4lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val3+"</td><td vertical-align=middle align="+Feld5lAlign+" style=\"color:"+htmlFarbFelderschrift2+"\">"+val4+"</td></tr>";} 
                                                                                             else    {htmlOut = htmlOut+"<td vertical-align=middle align="+Feld1lAlign+" >"+val0+"</td><td vertical-align=middle align="+Feld2lAlign+">"+val1+"</td><td vertical-align=middle align="+Feld3lAlign+">"+val2+"</td><td vertical-align=middle align="+Feld4lAlign+">"+val3+"</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+";\" align="+Feld5lAlign+">"+val4+"</td>";}}
                                                                     } break; }
                            
                                 } //switch ende
                            
                            
                            
                            }
                            
                            function tabelleFinish() {
                            
                                  // tabelle fertigstellen
                            switch (mehrfachTabelle) {  
                                   case 1:    break;
                            
                                   case 2:    
                                              if(counter%2==0)  htmlOut = htmlOut.replace(/<\/td>$/, '</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>');
                                            
                                              break;
                            
                                   case 3:   if(counter%3==2)  htmlOut = htmlOut.replace(/<\/td>$/, "</td></tr>");
                                             if(counter%3==1)  htmlOut = htmlOut.replace(/<\/td>$/, "</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>");        
                                             if(counter%3==0)      htmlOut = htmlOut.replace(/<\/td>$/, "</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td  style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"\">&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>");
                                           
                                              break;
                                   case 4:   if(counter%4==3)  htmlOut = htmlOut.replace(/<\/td>$/, "</td></tr>");
                                             if(counter%4==2)  htmlOut = htmlOut.replace(/<\/td>$/, "</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>");
                                             if(counter%4==1)  htmlOut = htmlOut.replace(/<\/td>$/, "</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"\">&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>");    
                                             if(counter%4==0)  htmlOut = htmlOut.replace(/<\/td>$/, "</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"\">&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td style=\" border-right: "+trennungsLinie+"px solid "+farbetrennungsLinie+"\">&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td><td>&ensp;</td></tr>");      
                                             break; }
                                 
                                                var htmlUeber=    "<p style=\"color:"+htmlFarbUber+"; font-family:"+htmlSchriftart+"; font-size: "+htmlÜberFontGroesse+"; font-weight:"+htmlSchriftWeite+ "\">"+htmlFeldUeber+"&ensp;&ensp;Last Update: "+formatDate(getDateObject((parseFloat((new Date().getTime())))), "SS:mm:ss");+"</p>"; 
                                   var htmlUnter= "<div  style=\"color:"+htmlFarbUber+"; font-family:"+htmlSchriftart+"; font-size: 70%; text-align: right;\" >"+htmlFeldUeber+"&ensp;&ensp;Last Update: "+formatDate(getDateObject((parseFloat((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 : htmlOutVIS=htmlUeber+htmlTabStyle+htmlTabUeber+htmlOut+"</table>"+htmlUnter ;
                            
                                          } else {
                                           zentriert ?  htmlOutVIS=htmlZentriert+htmlTabStyle+htmlTabUeber+htmlOut+"</table>"+htmlUnter :  htmlOutVIS=htmlTabStyle+htmlTabUeber+htmlOut+"</table>"+htmlUnter;
                            
                                             }
                            
                            // log("bin raus aus tabelleBind");
                                       if (braucheEinVISWidget) setState(dpVIS, htmlOutVIS );
                            
                             var htmlUnter= "<div  style=\"color:"+htmlFarbUber+"; font-family:"+htmlSchriftart+"; font-size: 80%;  text-align: center; \" >"+htmlFeldUeber+"&ensp;&ensp;Last Update: "+formatDate(getDateObject((parseFloat((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);
                             
                            
                            
                            }
                            
                            
                            
                            

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

                              @biker1602 warte noch kurz - mir ist noch was aufgefallen - script im oberen post ist gerade leer

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

                                @biker1602

                                jetzt ist das script drin - das problem - in der 3ten liga sind es ja 20 manschaften

                                daher müssen auch andere werte für die 3 liga genutzt werden

                                sonderheit beim spielstände script:

                                • bei variable anzahlSpiele=20 und (davon) nextComingGames ist 10 , werden die letzten 10 abgeschlossenen spiele gezeigt und die 10 nächsten anstehenden (erstes bild)
                                • bei variable anzahlSpiele=10 und (davon) nextComingGames ist 0 , werden die letzten 10 abgeschlossenen spiele gezeigt - sonst nix (zweites bild)
                                • du kannst auch 30 und 20 einstellen - also insgesamt den letzten spieltag und die nächsten kommenden 2 spietage

                                Image 7.png

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

                                  @liv-in-sky Danke für deine Mühe

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

                                  Support us

                                  ioBroker
                                  Community Adapters
                                  Donate

                                  606
                                  Online

                                  31.9k
                                  Users

                                  80.1k
                                  Topics

                                  1.3m
                                  Posts

                                  javascript template
                                  9
                                  102
                                  8782
                                  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