Mecki: eigenen Tag definieren

Hallo

Ich bin neu hier. Danke erst Mal an alle Autoren, denn ich habe schon einige meiner Probleme mit SelfHtml lösen können. Ich beschäftige mich mit aktiv mit Webseitengestaltung seit ungefähr einem Jahr und muss das jetzt auch beruflich einsetzen.
Und da kommt mein Problem.

Eigentlich programmiere ich an einer SPS zur Steuerung von Verfahrenstechnischen Anlagen.
Jetzt wollen unsere Kunden als Visualisierungstool keine eigene Software mehr einsetzen, sondern das Ganze über beliebige Browser im Intranet laufen lassen.
Die SPS hat dazu einen rudimentären Webserver bekommen, der als einziges Kommando GET versteht. Ursprüngliche Idee war halt statisches HTML ;-(
(Wegen Speicher und Performance Einschränkungen kann der auch nicht großartig aufgerüstet werden)
Um aber mit der SPS kommunizieren zu können, parst der Server jedes HTML Dokument, bevor er es heraus gibt, und ersetzt Kommentare einer ganz bestimmten Struktur durch entsprechende Variablenwerte der SPS.
Die stehen jetzt also ganz ohne Zusatzinformation im Quelltext.

Kann ich jetzt irgendwie ein HTML Tag definieren
z.B.: <sps_var name="AI_01">0,987654321</sps_var>
so dass ich jetzt per Javascript den Analogen Eingang 1 überwachen, die Ausgabe formatieren, auf bestimmte Schwellwerte reagieren usw. kann?

Vor allem muss ich die werte ja zyklisch aktualisieren und da will ich nicht jedes mal die ganze Seite neu Laden, sonder z.B. über AJAX und XML die aktuellen Werte nachladen und dann in der Seite aktualisieren.

Danke für die Hilfe

Mecki

  1. @@Mecki:

    nuqneH

    Kann ich jetzt irgendwie ein HTML Tag definieren
    z.B.: <sps_var name="AI_01">0,987654321</sps_var>

    Das wäre kein gültiges HTML.

    Wie wäre es mit <output data-sps-var="AI_01"> oder <output id="AI_01">?

    Qapla'

    --
    „Perfektion ist nicht dann erreicht, wenn es nichts mehr hinzuzufügen gibt, sondern wenn man nichts mehr weglassen kann.“ (Antoine de Saint-Exupéry)
    1. @ Gunnar

      jIyajbe'

      Das wäre kein gültiges HTML.

      Wie wäre es mit <output data-sps-var="AI_01"> oder <output id="AI_01">?

      @ suit: Ok, ich meine ein Element

      Dass das dann kein HTML mehr ist, ist mir schon irgendwie klar, es soll ja auch nur auf den Seiten zum Einsatz kommen, die direkt mit der SPS kommunizieren müssen.

      HTML5 geht aber nicht - oder versteht IE6 das? Denn damit muss ich rechnen.
      (<IE6 aber wahrscheinlich nicht mehr)

      Kann ich denn eine eigene DTD einsetzen, um HTML zu erweitern, oder muss ich dazu - wie bei XHTML - die ganze Sprache neu definieren?

      Das mit den custom attributes wäre wahrscheinlich eine Möglichkeit die Daten sauber zu aktualisieren. Aber das geht wohl auch erst mit HTML5, oder?

      Danke für die schnelle Antwort, aber so ganz hilft mir das nicht weiter.

      Ich brauche eine Möglichkeit um
      1. alle Variablenwerte in der HTMl Datei zu identifizieren um
      z.B. die Variablenwerte zu aktualisieren
      2. jeden einzeln zu identifizieren um
      z.B. Schwellwerte zu überwachen und darauf zu reagieren

      class zu missbrauchen geht leider nicht, da ich das gerne weiter einsetzen würde, um die Darstellung anzupassen, die je nach Bedeutung des Wertes variieren muss

      und das so, dass auch IE6 damit klar kommt

      tlho'

      Mecki

      P.S: tlhIngan Hol vIjatlhaHbe’ ;-)

      1. HTML5 geht aber nicht - oder versteht IE6 das? Denn damit muss ich rechnen.
        (<IE6 aber wahrscheinlich nicht mehr)

        Wenn du ohnehin JavaScript verwendest, ist das kein Problem - du nutzt ja keine HTML5-Features sondern nur irgendetwas das nach SGML aussieht und per DOM mit JavaScript gelesen/manipuliert wird.

        Du kannst sogar HTML5-Elemente verwenden:
        http://code.google.com/p/html5shiv/

        Aber wenns dir nur um das Lesen der Werte geht, kannst du darauf verzichten.

        Kann ich denn eine eigene DTD einsetzen, um HTML zu erweitern, oder muss ich dazu - wie bei XHTML - die ganze Sprache neu definieren?

        Vergiss das :)

        Das mit den custom attributes wäre wahrscheinlich eine Möglichkeit die Daten sauber zu aktualisieren. Aber das geht wohl auch erst mit HTML5, oder?

        Das ging immer schon, weil sich JavaScript/DOM einen Dreck um die DTD schert - in HTML5 sind diese Attribute aber valide.

        und das so, dass auch IE6 damit klar kommt

        Eine Selector-Engine oder ein Framework währen hier sicher hilfreich - bringst du ein paar Kb für z.B. jQuery unter?

        1. Hallo suit

          Nochmal Danke, das hilft mir erst einmal weiter.

          Wenn du ohnehin JavaScript verwendest, ist das kein Problem - du nutzt ja keine HTML5-Features sondern nur irgendetwas das nach SGML aussieht und per DOM mit JavaScript gelesen/manipuliert wird.

          Du kannst sogar HTML5-Elemente verwenden:
          http://code.google.com/p/html5shiv/

          Aber wenns dir nur um das Lesen der Werte geht, kannst du darauf verzichten.

          Eine Selector-Engine oder ein Framework währen hier sicher hilfreich - bringst du ein paar Kb für z.B. jQuery unter?

          Grundsätzlich ja, aber ich wollte es erst einmal ohne versuchen. Nach der ersten Version der Oberfläche mit statischem HTML (hier habe ich noch zyklisch die ganze Seite aktualisiert), hat uns der Kunde eine große Liste mit Änderungswünschen übermittelt, die weit über das ursprüngliche Angebot hinaus gehen.
          Deshalb weiß ich noch nicht, wie weit mein Platz reicht. Wenn ich damit aber Speicher sparen kann, dann auf jeden Fall.

          Aber durch deine und Gunnars Hinweise bin ich über das *var* element gestolpert, das nach Allem, was ich bisher festgestellt habe, auch nur zur Gestaltung benutzt wird.
          Damit und mit "id" als eindeutiger Kennzeichnung für jede einzelne Variable habe ich (glaube ich) erst mal das, was ich brauche.
          Ich muss einzelne Variablenwerte auch von der Oberfläche aus ändern können. Und da "var" "onclick" akzeptiert geht das damit

          Schönen Tag noch

          Mecki

          1. @@Mecki:

            nuqneH

            Aber durch deine und Gunnars Hinweise bin ich über das *var* element gestolpert

            Nö, das var-Element dient zur Auszeichnung von Variablen, wie in
            <p>Einsteins Formel <var>E</var> = <var>m</var> <var>c</var>²</p>

            Wenn dir das HTML5-Element output nicht passt (warum eigentlich nicht?), dann mimm span.

            Qapla'

            --
            „Perfektion ist nicht dann erreicht, wenn es nichts mehr hinzuzufügen gibt, sondern wenn man nichts mehr weglassen kann.“ (Antoine de Saint-Exupéry)
            1. Nö, das var-Element dient zur Auszeichnung von Variablen, wie in
              <p>Einsteins Formel <var>E</var> = <var>m</var> <var>c</var>²</p>

              Warum so unvollständig/gekürzt?
              E² = m²c⁴ + p²c²

            2. Hallo,

              Wenn dir das HTML5-Element output nicht passt (warum eigentlich nicht?), dann mimm span.

              und span mit id und document.getElementById kann sogar der IE6.

              Gruß, Jürgen

              1. und span mit id und document.getElementById kann sogar der IE6.

                output-Elemente funktionieren auch problemlos wenn es nur darum geht, sie mit JavaScript auszulesen.

                1. Hallo suit,

                  und span mit id und document.getElementById kann sogar der IE6.

                  output-Elemente funktionieren auch problemlos wenn es nur darum geht, sie mit JavaScript auszulesen.

                  ich habe vor geraumer Zeit mal mit "selbst erdachten" Elementen experimentiert, und ich meine, dass da der IE6 nicht mit klar kam. Ich kann das aber nicht mehr nachvollziehen.

                  Im Zweifel und als Anfänger würde ich da sehr vorsichtig sein, gerade wenn es eine einfache und erprobte Alternative gibt.

                  Gruß, Jürgen

                  1. ich habe vor geraumer Zeit mal mit "selbst erdachten" Elementen experimentiert, und ich meine, dass da der IE6 nicht mit klar kam. Ich kann das aber nicht mehr nachvollziehen.

                    "Nicht klar kam" ist dehnbar - man kann sie mit JavaScript lesen und manipulieren, aber ansonsten werden unbekannte Elemente einfach ignoriert - nicht nur im IE6 - auch im IE7 und 8, dafür gibts ja den shiv.

                    1. Hallo suit,

                      "Nicht klar kam" ist dehnbar - ...

                      ich habe ganz schwach in Erinnerung, dass der IE6 die selbst erdachten Elemenet per JS nicht lesen konnte, aber das ist schon lange her und ich weiß es auch nicht mehr genau.

                      Und wie ich schon in der anderen Antwort geschrieben habe, auch HTML 4 bietet genug Elemente, um "Messdaten" anzeigen und verändern zu können. Wahrscheinlich wäre hier eine Tabelle sogar das Element der Wahl.

                      Gruß, Jürgen

                      1. Hallo Jürgen

                        Und wie ich schon in der anderen Antwort geschrieben habe, auch HTML 4 bietet genug Elemente, um "Messdaten" anzeigen und verändern zu können. Wahrscheinlich wäre hier eine Tabelle sogar das Element der Wahl.

                        Leider nicht!

                        Das hatten wir ja auf den statischen Seiten. Aber der Kunde möchte eine bunte Oberfläche, auf der viel passiert, wenn sich die Werte ändern.

                        Und deshalb suchte ich nach einem Weg, um klar zu markieren, welche Daten aus der SPS kommen und welche entweder daraus abgeleitet oder sogar nur auf der Oberfläche generiert sind.
                        Dafür brauchte ich ein Element, das Änderungen zulässt und für nichts anderes gebraucht wird.
                        Um aber nicht mit der Anzeige der SPS Daten durcheinander zu kommen, will ich Änderungen durch den Nutzer auf jeden Fall mit PopUp-Fenstern relisieren und nehme erst mal "prompt" (um die Möglichkeit zu geben, einen geänderten Analogwert an die SPS zu schicken) und "confirm" (um die Änderung eines binären Wertes von true auf false und umgekehrt zu bestätigen). Mal schauen was unser Kunde davon hält.
                        Damit reicht die Fähigkeit des Elementes auf onclick zu reagieren. Das geht zur Not sogar ohne Javascript.
                        z.B. onclick="location.href=....

                        Wobei das dann sehr umständlich wird ;-))

                        BTW.: läuft
                        <meta http-equiv="refresh" content="10" URL="http://sps/index.html" /> eigentlich als Browser- oder als Serveraktion?
                        Bei mir funktioniert das nicht richtig.

                        Mecki

                        1. Hallo Mecki,

                          Und wie ich schon in der anderen Antwort geschrieben habe, auch HTML 4 bietet genug Elemente, um "Messdaten" anzeigen und verändern zu können. Wahrscheinlich wäre hier eine Tabelle sogar das Element der Wahl.

                          Leider nicht!

                          ich glaube, du suchst verzweifelt nach Problemen ... :)

                          Das hatten wir ja auf den statischen Seiten. Aber der Kunde möchte eine bunte Oberfläche, auf der viel passiert, wenn sich die Werte ändern.

                          und warum soll das mit Standard-Elementen nicht gehen?

                          Und deshalb suchte ich nach einem Weg, um klar zu markieren, welche Daten aus der SPS kommen und welche entweder daraus abgeleitet oder sogar nur auf der Oberfläche generiert sind.

                          Das geht bei beliebigen Elementen mit CSS, bei Bedarf auch per Javascript dynamisch angepasst, z.B. Farbwechsel bei Grenzwertüberschreitung.

                          Dafür brauchte ich ein Element, das Änderungen zulässt und für nichts anderes gebraucht wird.

                          Du kannst fast jedes HTML-Element per Javascript auslesen und beschreiben.

                          Um aber nicht mit der Anzeige der SPS Daten durcheinander zu kommen, will ich Änderungen durch den Nutzer auf jeden Fall mit PopUp-Fenstern relisieren und nehme erst mal "prompt" (um die Möglichkeit zu geben, einen geänderten Analogwert an die SPS zu schicken) und "confirm" (um die Änderung eines binären Wertes von true auf false und umgekehrt zu bestätigen). Mal schauen was unser Kunde davon hält.

                          das geht aber auch mit input und button.

                          Damit reicht die Fähigkeit des Elementes auf onclick zu reagieren. Das geht zur Not sogar ohne Javascript.
                          z.B. onclick="location.href=....

                          das ist Javascript.

                          <meta http-equiv="refresh" content="10" URL="http://sps/index.html" /> eigentlich als Browser- oder als Serveraktion?

                          beides, der Browser ruft nach 10 Sekunden die angegebene Seite auf, dann kommt der Server dran.

                          Bei mir funktioniert das nicht richtig.

                          und wie äußert sich das?

                          Auf dieser Testseite werden inputs gelesen und spans beschrieben. Die Rechnungen werden im Browser per Javascript durchgeführt. Ebenso hätte ich die Daten aber auch per Ajax an den Server senden können, um dessen Ergebnisse dann in die spans zu schreiben.

                          Gruß, Jürgen

                          1. Leider nicht!

                            ich glaube, du suchst verzweifelt nach Problemen ... :)

                            Ich langsam auch-

                            Dafür brauchte ich ein Element, das Änderungen zulässt und für nichts anderes gebraucht wird.

                            Du kannst fast jedes HTML-Element per Javascript auslesen und beschreiben.

                            Ein der wenigen Ausnahmen ist input[type=file] - aber ob das Element "schniziwuzi" oder "span" heisst ist den DOM-Methoden von JavaScript völlig wurst.

                          2. Hallo Jürgen, Hallo Martin

                            z.B. onclick="location.href=....

                            das ist Javascript.

                            Mist!
                            D.h. wenn jemand Javascript abgeschaltet hat, geht das nicht?
                            Dann muss ich hier einen Link einfügen, der auf die entsprechende Seite verweist?

                            Ich krieg das hin, dass dann eine neue Seite aufgerufen wird, in der ich ein Inputfeld integriere mit dem angehängten Befehl für den Server, den
                            Wert der Variablen zu ändern.
                            Das sieht dann so aus:

                            <!DOCTYPE html PUBLIC "-//thestyleworks.de//DTD XHTML 1.0 Custom//EN"  
                                 "../dtd/xhtml1-custom.dtd">  
                            <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">  
                            	<head>  
                            		  
                            		<title>Web Service</title>  
                            		<link rel="shortcut icon" href="./picture/favicon.ico" type=image/x-icon"/>  
                            		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />  
                            		<meta name="robots" content="noindex,nofollow" />  
                            	</head>  
                            	<body>  
                            		<p>VariablenWert = <!-- $SSI_FTL:@A_VAR //--></p>  
                            		<a href="changeana.html?@A_Var=">VariablenWert aendern</a>  
                            	</body>  
                            </html>  
                            
                            

                            und die aufgerufene Seite so:

                              
                            <!DOCTYPE html PUBLIC "-//thestyleworks.de//DTD XHTML 1.0 Custom//EN"  
                                 "../dtd/xhtml1-custom.dtd">  
                            <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">  
                            	<head>  
                            		  
                            		<title>Web Service</title>  
                            		<link rel="shortcut icon" href="./picture/favicon.ico" type=image/x-icon"/>  
                            		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />  
                            		<meta name="robots" content="noindex,nofollow" />  
                            	</head>  
                            	<body>  
                            		<form action="getChange.html" method="GET">  
                            			<label>Welcher Wert soll gesendet werden? <input type="text"></label>  
                            		</form>  
                            	</body>  
                            </html>  
                            
                            

                            Wenn ich jetzt in der 2. Seite einen Wert eingebe, dann wird wieder die erste Seite aufgerufen - ohne javascript sehe ich zusätzlich einen Button mit der url der aufzurufenden Seite
                            Kann man jetzt ohne javascript dafür sorgen, dass der Befehl an den Browser  "?@A_Var=" und der eingegebene Wert
                            an die url angehängt wird und das dann so an den Server geht, oder muss ich da für jede Variable eine eigene Seite kreieren?

                            <meta http-equiv="refresh" content="10" URL="http://sps/index.html" /> eigentlich als Browser- oder als Serveraktion?

                            Bei mir funktioniert das nicht richtig.

                            Danke Martin! Mit
                            ...content="10; URL=http://sps...
                            funktioniert es jetzt und lässt sich per Script abschalten und durch die entsprechenden Routinen übersteuern, falls erlaubt. Lag also nicht an dem rudimentären Server.

                            Mecki

                            1. Hallo Mecki,

                              vorweg: ist in deiner definierten Umgebung Javascript ein Problem oder kannst du davon ausgehen, dass die User alle Javascript eingeschaltet haben?

                              Bei Formularen musst du nur den Eingabeelementen einen Namen geben, dieser wird dann zur Übertragung (name=wert) verwendet. Dazu musst du natürlich für jede Größe ein extra Eingabefeld vorsehen. Bei beliebigen Größen fällt mir nur Javascript ein.

                              Gruß, Jürgen

                              1. Hallo Jürgen

                                vorweg: ist in deiner definierten Umgebung Javascript ein Problem oder kannst du davon ausgehen, dass die User alle Javascript eingeschaltet haben?

                                Bis jetzt: leider nein!
                                Die User haben teilweise keine Kontrolle über die Softwareausstattung ihrer PCs, dass macht die IT-Abteilung. Und die hat für eine bestimmte Gruppe bisher Javascript generell deaktiviert. Das habe ich aber erst letzte Woche erfahren.

                                Bei Formularen musst du nur den Eingabeelementen einen Namen geben, dieser wird dann zur Übertragung (name=wert) verwendet. Dazu musst du natürlich für jede Größe ein extra Eingabefeld vorsehen. Bei beliebigen Größen fällt mir nur Javascript ein.

                                Dann muss ich noch mal schauen, wie ich das mit Eingabefeldern realisieren kann.
                                *Mein* Problem liegt darin, dass ich ohne Javascript für jede Variable nicht nur das Feld brauche, sondern auch zusätzlich den Submit-Button und damit wird der Platz auf der Seite sehr eingeschränkt.

                                Aber danke für eure(Deine und all der Anderen) Hilfe. Jetzt komme ich ein ganzes Stück weiter und habe auch Argumente gegenüber unserm Kunden in der Hand, evtl. Javascript doch freizuschalten.

                                Mecki

                        2. Hallo,

                          Das geht zur Not sogar ohne Javascript.
                          z.B. onclick="location.href=....

                          und was ist das, wenn nicht Javascript?

                          BTW.: läuft
                          <meta http-equiv="refresh" content="10" URL="http://sps/index.html" /> eigentlich als Browser- oder als Serveraktion?

                          So wie du es formuliert hast, "läuft" es gar nicht. Die Verzögerung (in Sekunden) und die Ziel-URL (mit dem Präfix "url=") bilden mit einem Semikolon getrennt gemeinsam den Wert des content-Attributs.

                          Und dann ist es eine reine Client-Geschichte.

                          Ciao,
                           Martin

                          --
                          Ich wollt', ich wär ein Teppich.
                          Dann könnte ich morgens liegenbleiben.
                          Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
            3. Nö, das var-Element dient zur Auszeichnung von Variablen, wie in
              <p>Einsteins Formel <var>E</var> = <var>m</var> <var>c</var>²</p>

              Genau, aber die Variablen haben prizipiell keine Funktion (im Gegensatz zu input und -so wie ich das lese- auch output) oder gibt es ein Attribut, mit dem ich var durch einen Wert ersetzen könnte?

              Wenn dir das HTML5-Element output nicht passt (warum eigentlich nicht?), dann nimm span.

              Das hatte ein Kollege schon in den statischen Seiten für andere Sachen eingesetzt. Aber vielleicht komme ich ohne aus. Mal sehen.

              Mecki

              1. Hallo Mecki,

                du kannst mit den DOM-Methoden auf (fast?) alle Elemente einer Seite zugreifen und deren Inhalt ändern. Warum beißt du dich an selbst definierten oder an HTML5-Elementen fest, wo du doch noch alte IEs unterstützen musst.

                Gruß, Jürgen

  2. Kann ich jetzt irgendwie ein HTML Tag definieren
    z.B.: <sps_var name="AI_01">0,987654321</sps_var>

    Du meinst ein Element

    Du kannst deine eigene DTD verfassen die du dann irgenwdie nennst - aber HTML ist das nicht mehr.

    Die Lösung für dein Problem ist aber trivial.

    Das HTML5-data-Attribut:
    http://www.w3.org/TR/2010/WD-html5-20101019/elements.html#embedding-custom-non-visible-data-with-the-data-attributes
    http://ejohn.org/blog/html-5-data-attributes/
    http://api.jquery.com/jQuery.data/