Ankündigung

Einklappen
Keine Ankündigung bisher.

Benutzerdefinierte Funktionen (custom.js/custom.css)

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

    #31
    @Hans
    ist commited, sollte jetzt laden
    Nils
    xxAPI² - HTML5 Client für den Gira Homeserver (Status: Beta / Visuclient = 80% / xxAPI¹ Funktionen = 100% / zusätzlich: Slider/Drehknöpfe/Balken/mausnahe Popups/.... ) - Installation: Logikbaustein nach Start Triggern / Startlink auf der Debugseite

    Kommentar


      #32
      Hi Nils! Kannst Du mir noch verraten, warum die Schriftfarbe der Wertanzeige nicht von der costum.css überschrieben werden? Hast Du da was "hart verdrahtet"?
      Angehängte Dateien
      Mfg Micha
      Ich sage ja nicht, das wir alle dummen Menschen loswerden müssen, aber könnten wir nicht einfach alle Warnhinweise entfernen und den Dingen ihren Lauf lassen?

      Kommentar


        #33
        Hi Micha,

        Schriftfarbe kommt aus Design -> Systemschriften -> Wert


        kannst du auch nicht mit "color: black !important" im css überschreiben?

        EDIT: anworte mir gleich selbst. Doch geht ;-) einfach das !important hinten dran.
        Nils
        xxAPI² - HTML5 Client für den Gira Homeserver (Status: Beta / Visuclient = 80% / xxAPI¹ Funktionen = 100% / zusätzlich: Slider/Drehknöpfe/Balken/mausnahe Popups/.... ) - Installation: Logikbaustein nach Start Triggern / Startlink auf der Debugseite

        Kommentar


          #34
          Ja, geht! thx!
          Mfg Micha
          Ich sage ja nicht, das wir alle dummen Menschen loswerden müssen, aber könnten wir nicht einfach alle Warnhinweise entfernen und den Dingen ihren Lauf lassen?

          Kommentar


            #35
            Hi Nils.

            kannst Du mir auf die Sprünge helfen:

            wie kann ich meinen CODE statt Deinen via custom.js austauschen?

            Code:
               
                  <link id='id_startup_icon_120' rel='apple-touch-icon' sizes='120x120' href='img/gira-icon-precomposed-intern-120x120.png'>
                  <link id='id_startup_icon_152' rel='apple-touch-icon' sizes='152x152' href='img/gira-icon-precomposed-intern-152x152.png'>
                  <link id='id_startup_icon_180' rel='apple-touch-icon' sizes='180x180' href='img/gira-icon-precomposed-intern-180x180.png'>
                  <script type="application/javascript">
                  (function() {
                   /**
                    ** APPLE-TOUCH-ICON: unterschiedliches Icon für intern (Intranet) und extern (Internet)
                    **/
                    var id_startup_icon_120 = document.getElementById('id_startup_icon_120');
                    var id_startup_icon_152 = document.getElementById('id_startup_icon_152');
                    var id_startup_icon_180 = document.getElementById('id_startup_icon_180');
                    if ( window.location.port !== '' ) { // access external via internet (with port-number)
                      id_startup_icon_120.setAttribute( 'href', 'img/gira-icon-precomposed-extern-120x120.png' );
                      id_startup_icon_152.setAttribute( 'href', 'img/gira-icon-precomposed-extern-152x152.png' );
                      id_startup_icon_180.setAttribute( 'href', 'img/gira-icon-precomposed-extern-180x180.png' );
                    } else {                             // access internal via intranet (within own local network)
                      id_startup_icon_120.setAttribute( 'href', 'img/gira-icon-precomposed-intern-120x120.png' );
                      id_startup_icon_152.setAttribute( 'href', 'img/gira-icon-precomposed-intern-152x152.png' );
                      id_startup_icon_180.setAttribute( 'href', 'img/gira-icon-precomposed-intern-180x180.png' );
                    } 
                  }(document));
            Hans

            Kommentar


              #36
              Moin Hans

              Code:
              $.each($("link[rel$=startup-image]"),function(index,obj) {
                     obj.attr("href","neueurl.img");
              });
              Nils
              xxAPI² - HTML5 Client für den Gira Homeserver (Status: Beta / Visuclient = 80% / xxAPI¹ Funktionen = 100% / zusätzlich: Slider/Drehknöpfe/Balken/mausnahe Popups/.... ) - Installation: Logikbaustein nach Start Triggern / Startlink auf der Debugseite

              Kommentar


                #37
                Zitat von NilsS Beitrag anzeigen
                Moin Hans

                Code:
                $.each($("link[rel$=startup-image]"),function(index,obj) {
                       obj.attr("href","neueurl.img");
                });
                Hi Nils;

                Ich schreibe es extra "ausführlich" dass auch andere Forumsmitglieder es besser "verstehen" können.

                Jetzt hab ich es kapiert. Man denkt oft zu kompliziert.... Ich hab Dein obiges Beispiel sogar optimiert. Ein guter Tipp, das Kapitel "Selektoren" auf der jQuery-Seite lesen (Selectors | jQuery API Documentation).

                1. Start-Up Ikonen für IOS; getrennt für lokal und extern

                Von Safari mit Funktion "Zum Homescreen" definierbar. Funktioniert dann wie eine "native" APP unter IOS (oder auch mit Andriod oder Microsoft).

                Fullscreen - ohne "irgendwelche Safari-Controls". Eigene Ikon, getrennt nach internen (lokal) und externen Zugriff. Skaliert die Bildschirmgröße auf Tablets und Phones (im Hoch- und Querformat). Mit oder ohne Statusbar. Ich benutze Lösung ohne Statusbar auf iPhone 6 plus und iPad air 2 (beides mit der doppelten Retina-Auflösung, die zB bei nachfolgeden Beispiel "Bahnhofsuhr" besonders gut bemerkbar ist).

                Hintergrundinfos:
                https://developer.apple.com/library/...eViewport.html.
                ... und noch intensiver unter "Quirksmode" (auch für andere Platformen, wie zB Andriod): Mobile - Table of contents

                Jetzt kann ich mit meinen "individuellen" Ikonen 4 unterschiedliche Lösungen darstellen. Siehe Bildschirm-Foto 1 (4. Zeile):

                1. xxAPI¹: lokaler Zugriff
                2. xxAPI¹: externer Zugriff
                3. xxAPI²: lokaler Zugriff
                4. xxAPI²: externer Zugriff

                Beiliegend nochmals der Code (bei mir in custom.js enthalten) der Deine (xstart.htm) überschreibt.
                Ein Problem bei mir war, daß ich am Anfang nicht kapierte, das - wenn man "custom.js" und "custom.css" verwendet - nochmals ein zusätzliches Sub-Directory anlegen muss (zB xxapi) und es im Hauptpfad "definitiv" nur die "xstart.htm" ohne "Extras" funktioniert. Hauptpfad ist der Projektpfad im HS Experte - unter Extras/Einstellungen/Projektordner. Nicht der alte Pfad von xxAPI Version 1. Weiters muß im HS Experten unter Stammdaten/Projekt/Oberfläche das gewählte Verzeichnis - ist in unserem Fall "xxapi" - angehakt sein.

                Beispiel für custom.js. In diesen Beispiel wird externer Zugriff erkannt, wenn port-number (= "window.location.port") verwendet wird.

                Vorsicht: Diese Lösung via Zugriff über Ports entspricht nicht den heutigen Sicherheitsanprüchen. Das Beispiel soll nur einen Eindruck über die Flexibilität und Anpassbarkeit der darunterliegenden Architektur von Nils xxAPI²-Lösung geben.
                Code:
                /**
                 ** APPLE-TOUCH-ICON: unterschiedliches Icon für intern (Intranet) und extern (Internet)
                 **/
                (function() {
                if ( window.location.port !== '' ) { // access external via internet (with port-number)
                    $("link[rel$='touch-icon-precomposed'][sizes$='120']").attr("href","img/startup/gira-icon-precomposed-extern-120x120.png");
                    $("link[rel$='touch-icon-precomposed'][sizes$='152']").attr("href","img/startup/gira-icon-precomposed-extern-152x152.png");
                    $("link[rel$='touch-icon-precomposed'][sizes$='144']").attr("href","img/startup/gira-icon-precomposed-extern-180x180.png");
                  } else {                           // access internal via intranet (within own local network)
                    $("link[rel$='touch-icon-precomposed'][sizes$='120']").attr("href","img/startup/gira-icon-precomposed-intern-120x120.png");
                    $("link[rel$='touch-icon-precomposed'][sizes$='152']").attr("href","img/startup/gira-icon-precomposed-intern-152x152.png");
                    $("link[rel$='touch-icon-precomposed'][sizes$='144']").attr("href","img/startup/gira-icon-precomposed-intern-180x180.png");
                  }   
                })();
                Die Beschriftung mit "Haussteuerung" bzw. "xxAPI²" unterhalb der Ikone erfolgt mit folgenden Code in der Datei xstart.htm. Diese Beschriftung könnte natürlich mit ähnlicher Logik wie oberhalb in der Datei custom.js überschrieben werden.
                Code:
                 
                <meta name="apple-mobile-web-app-title" content="xxAPI²" >
                wenn kein Eintrag:
                meta name="apple-mobile-web-app-title"
                genügt auch der Eintrag:
                Code:
                <title>xxAPI²</title>
                2. Code der Bahnhofsuhr (siehe Foto 2, ganz rechts unten).

                Die javascript Library findet man unter 3Quarks - Bahnhofsuhr. Diese kann man in einem Sub-Pfad von ""xxapi" ablegen (unter der Annahme, das dieser Pfad übernommen wurde). Dort ist auch eine ausführliche Beschreibung vorhanden.

                Beispielcode für custom.js und Gira HS Experte (im Kommentar):
                Code:
                /* 
                 * in Visu HS Experte: Statischer Text: XXANALOGCLOCK*
                 */
                hs.functions.element_loader("js/station-clock.js");
                xxAPI.functions.XXANALOGCLOCK = function( oarg ) {
                    var _id = "id_bahnhofsuhr";
                    oarg.item.html = "<canvas id='id_bahnhofsuhr' width='128px' height='128px' style='width:64px; height:64px;'/>";
                    oarg.item.xxapi.analogclock = new StationClock(_id);
                 	$.extend(oarg.item.xxapi.analogclock,{
                    	    "body" 	         : StationClock.SmallWhiteBody,
                	    "dial"   	         : StationClock.SwissStrokeDial,
                	    "hourHand" 		 : StationClock.PointedHourHand,
                	    "minuteHand" 	 : StationClock.PointedMinuteHand,
                	    "secondHand" 	 : StationClock.HoleShapedSecondHand,
                	    "boss" 		 : StationClock.NoBoss,
                	    "minuteHandBehavoir" : StationClock.BouncingMinuteHand,
                	    "secondHandBehavoir" : StationClock.BouncingSecondHand
                	});  
                    oarg.item.next_update = 1;
                    oarg.item.update_code = function ( oarg ) {
                    oarg.item.xxapi.analogclock.draw();
                    oarg.item.next_update = $.now() + 500;
                    };
                }
                3. Versionsnummer aus xxapi2.js und aus custom.js in Visu von HS Experte anzeigen.

                Die Versionsnummern werden in meinem Beispiel auf Foto 2, links unten angezeigt.

                Die erste Zeile ist die Versionsnummer von Nils xxapi2.js (allgemein genutzt). Die zweite Zeile von custom.js (individuelle Anpassungen).
                Durch die Versionsnummer von Nils erkennt man, ob es wieder zusätzliche Funktionalität oder sonstige Änderungen vorhanden sind. Das ist - jetzt in der Entwicklungsphase - besonders interessant.

                Anzeige von Nils Versionsnummer. Code in statischen Textfeld in HS Experten Visu.
                Code:
                XXEXECUTE*item.text=xxAPI.version
                Definition der Versionsnummer in der custom.js Datei und im HS Experten (siehe Kommentar):
                Code:
                /* 
                 * in Visu HS Experte: Statischer Text: XXCUST_VERSION*
                 */
                xxAPI.functions.XXCUST_VERSION = function ( oarg ) {
                    debug( 2 , "XXCUST_VERSION" , oarg );
                    oarg.item.text = "V 2.1";
                }
                4. Positionierung Popup unmittelbar neben "aufrufender" Taste

                Siehe Foto 2.

                Es ist ein Textfeld am unteren rechten Rand des Popups mit folgenden Inhalt zu positionieren. Alles mit sehr knappen Rand sieht besser aus.

                im HS Experte (statisches Textfeld):
                Code:
                XXPAGE*POPUP*top:MOUSE+0px;
                Danke nochmals "Nils" für Deine oftmals auf der "Leitung" stehenden "Mitkämpfer". Hoffe damit auch für "andere" Neulinge das Leben einfacher zu machen.

                Gruss aus Wien
                Angehängte Dateien
                Hans

                Kommentar


                  #38
                  Bei mir gibt es NUR intern. Dein Beispiel basiert auf der Annahme das der externe Zugriff über einen anderen Port als 80 (http) per Portforwarding eingerichtet ist.

                  Ich nutze (und würde auch dringend dazu raten) NUR per VPN oder SSL Reverseproxy auf den HS zuzugreifen.

                  a) die eigentliche Passwort"verschlüsselung" des Homeservers basiert auf MD5 (welches es es in den letzten Jahren doch endlich geschafft hat auch bei der breiten Mehrheit als tot anerkannt zu werden https://de.wikipedia.org/wiki/Messag...m_5#Sicherheit )

                  b) Zugangsdaten für Kameras mit Kameradirektzugriff trifft es noch schlimmer, diese werden lediglich Base64 kodiert über Netz transportiert.

                  Wenn man einen Reverseproxy nutzt könnte man von extern noch das location.protocol == "https:" überprüfen.
                  Nils
                  xxAPI² - HTML5 Client für den Gira Homeserver (Status: Beta / Visuclient = 80% / xxAPI¹ Funktionen = 100% / zusätzlich: Slider/Drehknöpfe/Balken/mausnahe Popups/.... ) - Installation: Logikbaustein nach Start Triggern / Startlink auf der Debugseite

                  Kommentar


                    #39
                    Zitat von TirochH Beitrag anzeigen
                    Code:
                     
                    <meta name="apple-mobile-web-app-title" content="xxAPI²" >
                    wenn kein Eintrag: genügt auch der Eintrag:
                    Code:
                    <title>xxAPI²</title>
                    Nicht korrekt, da der Title bei Aufruf der Seiten immer auf die 1.Zeile der Visuseite geändert wird, der WebApp Title aber immer gleich bleiben soll.

                    xxapi2.js ~ 2158
                    Code:
                                    document.title = "xxAPI - " + _page.text1;
                    Nils
                    xxAPI² - HTML5 Client für den Gira Homeserver (Status: Beta / Visuclient = 80% / xxAPI¹ Funktionen = 100% / zusätzlich: Slider/Drehknöpfe/Balken/mausnahe Popups/.... ) - Installation: Logikbaustein nach Start Triggern / Startlink auf der Debugseite

                    Kommentar


                      #40
                      Zitat von NilsS Beitrag anzeigen
                      Bei mir gibt es NUR intern. Dein Beispiel basiert auf der Annahme das der externe Zugriff über einen anderen Port als 80 (http) per Portforwarding eingerichtet ist.

                      Ich nutze (und würde auch dringend dazu raten) NUR per VPN oder SSL Reverseproxy auf den HS zuzugreifen.

                      a) die eigentliche Passwort"verschlüsselung" des Homeservers basiert auf MD5 (welches es es in den letzten Jahren doch endlich geschafft hat auch bei der breiten Mehrheit als tot anerkannt zu werden https://de.wikipedia.org/wiki/Messag...m_5#Sicherheit )

                      b) Zugangsdaten für Kameras mit Kameradirektzugriff trifft es noch schlimmer, diese werden lediglich Base64 kodiert über Netz transportiert.

                      Wenn man einen Reverseproxy nutzt könnte man von extern noch das location.protocol == "https:" überprüfen.
                      Danke für den Hinweis.

                      Mir erscheint VPN am sinnvollsten. Baue meine Lösung um.
                      Hans

                      Kommentar


                        #41
                        Zitat von NilsS Beitrag anzeigen
                        Nicht korrekt, da der Title bei Aufruf der Seiten immer auf die 1.Zeile der Visuseite geändert wird, der WebApp Title aber immer gleich bleiben soll.

                        xxapi2.js ~ 2158
                        Code:
                                        document.title = "xxAPI - " + _page.text1;
                        Interessant. Muss doch noch ne Menge lesen.

                        Ist das allgemein so, oder bei xxAPI?

                        Möchte ja niemanden irreführen. Muss meinen Text adaptieren.

                        Die Frage wie ? Ist die Formulierung ungenau oder ist der Inhalt falsch ?
                        Hans

                        Kommentar


                          #42
                          Wenn du wie du oben geschrieben hast "apple-mobile-web-app-title" weglässt, dann wird beim hinzufügen zum Homescreen (nachdem man eingeloggt ist und bereits die Visu betrachtet) der WebApp Name "xxAPI - Mein S"... sein (auf 13 Zeichen abgeschnitten).
                          Nils
                          xxAPI² - HTML5 Client für den Gira Homeserver (Status: Beta / Visuclient = 80% / xxAPI¹ Funktionen = 100% / zusätzlich: Slider/Drehknöpfe/Balken/mausnahe Popups/.... ) - Installation: Logikbaustein nach Start Triggern / Startlink auf der Debugseite

                          Kommentar


                            #43
                            Zitat von NilsS Beitrag anzeigen
                            Wenn du wie du oben geschrieben hast "apple-mobile-web-app-title" weglässt, dann wird beim hinzufügen zum Homescreen (nachdem man eingeloggt ist und bereits die Visu betrachtet) der WebApp Name "xxAPI - Mein S"... sein (auf 13 Zeichen abgeschnitten).
                            Schau gerade auf apple developer website: https://developer.apple.com/library/...eViewport.html. Dort ist Definition nicht auffindbar. Meiner Meinung umdokumentiertes Feature.

                            Auf Treehouse Optimizing Mobile Web Apps for iOS | Treehouse Blog folgende (halbwegs sinnvolle) Definition:
                            Setting the Launcher Title
                            By default Safari will use the contents of the page’s <title> element to set the initial title for the launcher icon. You can however override this by adding a <meta> tag with apple-mobile-web-app-title set as the value of the name attribute. The value of the element’s content attribute will then be used as the launcher title.

                            <meta name="apple-mobile-web-app-title" content="Kojitsu">
                            Explicitly setting the title of your web app like this can be useful if the <title> element contains a lot of text that’s used for SEO purposes.
                            Hans

                            Kommentar


                              #44
                              Jo undokumentiert
                              https://gist.github.com/uweschmelzer/5597784
                              Nils
                              xxAPI² - HTML5 Client für den Gira Homeserver (Status: Beta / Visuclient = 80% / xxAPI¹ Funktionen = 100% / zusätzlich: Slider/Drehknöpfe/Balken/mausnahe Popups/.... ) - Installation: Logikbaustein nach Start Triggern / Startlink auf der Debugseite

                              Kommentar


                                #45
                                NilsS Bei mir ist seit kurzem die tolle Analoguhr weg, stattdessen wird der Name des Platzhalters angezeigt. Mache ich was falsch oder hat sich diesbezüglich was geändert. Ich habe das seit Monaten nicht angefasst und bis gestern ging es.

                                Bildschirmfoto 2016-07-13 um 21.16.00.png Bildschirmfoto 2016-07-13 um 21.16.23.png ​​​​​​​

                                Kommentar

                                Lädt...
                                X