Website ASAMPLE

Inhalt

Im vorliegenden Dokument wird die XTEND-Website ASAMPLE beschrieben, die standardmäßig im Lieferumfang von XTEND enthalten ist und die Definition der XTEND-Standardtokens sowie ein mit der Software Dreamweaver erstelltes HTML-Projekt umfasst.

Dieses Projekt enthält Beispielseiten (Homepage, Über..., Anmeldung, Kontakt, Fehler etc.), die dem XTEND-Entwickler dabei helfen sollen, sein Projekt zu entwickeln. 

HTML-Projekt

Dateien

Die HTML-Website ASAMPLE basiert auf einem Dreamweaver-Template.

Seitenstruktur

Das Seitenmodell ('Templates\ASAMPLE.dwt') sieht eine Aufteilung der 'editierbaren Bereiche' und 'libraries.lbi' in Hauptinhalt und von allen Seiten gemeinsam verwendete Elemente vor:

• Unternehmensname oben links
• Anzeigebereich für Meldungen oben rechts
• Menü links
• Menü unten
• Stildaten
• zwei JavaScript-Funktionen für die Faktorisierung der Verarbeitungen
• beim Laden der Seite (xBodyOnLoad)
• bei Mausklick auf einen dynamischen Link (xtdDoMyDlk)

editierbare Bereiche

Das Template sieht folgende Aufteilung in 'editierbare Bereiche' vor:

• Seitentitel (doctitle)
• HTML-Header (head)
• Inhalt vor dem FORM-Tag (beforeForm)
• Hauptinhalt (Content)
• Inhalt nach dem FORM-Tag (afterForm)

Bibliotheken

Seiten-Template 'Template\ASAMPLE.dwt' mit folgenden Bibliotheken:

• Zelle TopLeft.lbi, die den Unternehmensnamen enthält
• Zelle TopRight.lbi, die das Tagesdatum und die Benutzermeldungen enthält (Token aMsgUser)
• Menü unten (BottomMenu.lbi)
• Menü links (LeftMenu.lbi)

Die Bibliothek pagination.lbi wird für den Seitenumbruch bei den XTEND-Tabellen verwendet

Grafische Elemente

Grafische Elemente:

• Stildaten my.css
• Bilder im Verzeichnis IMG\
• Flaggensymbole FLAGS\, die auf der Seite 'Länderliste' verwendet werden

HTML-Seiten

HTML-Seiten:

• home.html
• about.html
• account.html
• contact.html
• countries.html
• login.html

Technische HTML-Seiten:

• notavail.html
• reconnection.html
• error.html

Dateien

Lagerplatz

Das HTML-Projekt ASAMPLE liegt auf dem X3-Hauptserver im Verzeichnis X3_PUB/X3FOLDER/X_TEND/X_HTML/ASAMPLE/FRA (Französisch) bzw. ~/ENG (Englisch).

X3_PUB
Veröffentlichungsverzeichnis für alle Ordner der aktuellen Lösung

X3FOLDER
Name des aktuellen X3-Ordners

Wenn sich die Dateien der Website ASAMPLE nicht in diesem Verzeichnis befinden, steht XTEND für den aktuellen X3-Ordner nicht zur Verfügung.

Unter UNIX muss geprüft werden, ob für sämtliche Dateien im HTML-Projekt mindestens folgende Rechte vorliegen:

• 'Read' für alle Benutzer
• 'Read / Write / Execute' für die XTEND-Entwickler

Eine lokale Kopie anlegen

Wir empfehlen, die Website ASAMPLE niemals zu ändern, sondern lokale Kopien unter einem anderen Namen anzulegen.

Der Inhalt der Website kann beispielsweise mit einem FTP-Client wie FileZilla heruntergeladen werden.

Soll auf Basis dieses Templates eine neue Website realisiert werden, muss zuvor die Software Dreamweaver installiert werden. Im Anschluss daran wird eine neue Website angelegt, die auf das lokale Verzeichnis zeigt.

Wenn Dreamweaver nicht verfügbar ist und trotzdem Tests durchgeführt werden sollen, können die HTML-Seiten auch mit einem Texteditor wie Notepad++ oder PSPad geändert und dann mit dem FTP-Client auf den Remote-Server (X3-Server) übertragen werden. In diesem Fall können die Verzeichnisse 'Library' und 'Templates' gelöscht werden.

Contentverwaltung

Die Seiteninhalte werden nicht in der HTML-Seite gespeichert, sondern in der X3-Datenbank. Auf diese kann mit der XTEND-Funktion 'HTML-Inhalt' zugegriffen werden.

Ziel dabei ist es, die HTML-Inhalte der Website in X3 zu verwalten.

Aus Sicht der Antwortzeiten ist diese Vorgehensweise nicht optimal, denn der Aufruf des Webservice, der den HTML-Inhalt (Clob) liest, ist weniger performant als die direkte Anzeige einer HTML-Seite über den HTTP-Server.

In der Praxis muss ein Kompromiss zwischen der von zahlreichen Faktoren abhängigen Performance (Infrastruktur Netz / Maschinen, Dokumentgrößen, Auslastung des X3-Servers etc.) und der Benutzerfreundlichkeit bei der Verwaltung der XTEND-Website gefunden werden.

Aus technischer Sicht wird der Inhalt in einem Feld (TEXTE) angezeigt, dessen Wert durch einen Block (ABLKDOCHTML) geliefert wird.

Dieser Block selektiert der Aufruf einer Schnittstelle (ADOCHTML) vom Typ 'Generierter Tabellenzugriff' den HTML-Inhalt der Seite in Abhängigkeit von dem Namen der Webseite (Feld DOCCOD).

Seitenliste

Contentseiten

home
Homepage (Name = AHOME)

about
Seite 'Über' (Name = AABOUT)

contact
Erfassung eines HTML-Formulars und speichern in X3 (Alias = ACONTACT)

login
XTEND-Anmeldungsseite (Name = ALOGIN)

account
Anzeige der Benutzerdaten nach der Anmeldung (Name = AACCOUNT)

countries
Beispielseite für einen Datenzugriff und für eine Verbindung Liste / Auskunft, die die Länderliste (Tabelle TABCOUNTRY) anzeigt (mit Umbruch) und die Auswahl eines Landes für die Anzeige (Auskunft) der Währung und der Sprache zulässt (Name = ACOUNTRIES)

Technische Seiten

Die folgenden Seiten sind auf Ebene der XTEND-Website definierte technische Seiten.

error
Wird bei einem schweren Fehler (Ausnahme) angezeigt (Name = AERROR)

notavail
Wird angezeigt, wenn die Seite nicht verfügbar ist (Name = ANOTAVAIL)

reconnection
Wird angezeigt, wenn der Benutzer wieder zu seiner Sitzung zurückkehrt, nachdem er den Browser geschlossen hat (Name = ARECONNECTION)

Hinweis

Die Website ist auf Englisch verwendbar. Es stehen jedoch nicht alle Seiten in dieser Sprache zur Verfügung.

Link SAFE X3

In diesem Absatz wird die Liste der Schnittstellen und Webservices erläutert, die von der Website ASAMPLE verwendet werden. Weiterhin wird beschrieben, wie diese bei der Verwendung von XTEND zu aktivieren sind.

Konfigurierung des Webservice-Pools

Webservices können erst verwendet werden, wenn ein XTEND-Standard-Webservice-Pool definiert wurde.

Damit der XTEND-Server die Felder berücksichtigt, muss dieser Pool nach seiner Anlage freigegeben werden.

Auf der X3-Konsole auszuführende Vorgänge

Der aktuelle X3-Ordner muss über die X3-Konsole auf einem X3WEB-Server veröffentlicht werden. Der Ordner muss in der mit der X3-Funktion GESAYS (Menü Tools/Webservice-Pools) verfügbaren Liste der 'Webservice-Pools' einen Eintrag aufweisen.

Leere Liste oder Ihr X3-Ordner ist nicht in der Liste enthalten:

• Der X3-Ordner wurde nicht auf dem X3WEB-Server veröffentlicht
• Es wurde bei der Konfiguration des Webservice-Servers kein Verbindungspool für diesen X3-Ordner spezifiziert

Diese beiden Vorgänge müssen über die X3-Konsole abgewickelt werden.

Definition des XTEND-Webservice-Pools

Dieser Vorgang besteht in der Definition eines Standardverbindungspools als Eingabepunkt (URL) sämtlicher Webservice-Aufrufe der Website ASAMPLE.

Rufen Sie den Webservice-Pool auf.

Wenn ein Pool namens 'ADEFAULT' in der Liste vorhanden ist, ändern Sie dessen Daten:

• 'X3-Pool', damit er auf Ihren Webservice-Server und den richtigen Verbindungspool zeigt
• 'Benutzer' mit gültigen X3-Logindaten

Ist dieser Pool nicht vorhanden, legen Sie ihn unter dem Namen 'ADEFAULT' an (siehe Dokument XTEND-Webservice-Pool).

Schnittstellen

In diesem Absatz werden die zur Aktivierung der von der Website ASAMPLE verwendeten Schnittstellen notwendigen Schritte erläutert.

Die Website ASAMPLE verwendet die folgenden drei über die Funktion interface(GESAYI) verfügbaren Schnittstellen:

Gemeinsame Parameter aller Schnittstellendaten

Standard-Pool:Ja

Zugriff geschützt:Nein

Meldungsanzeige:Aktivieren Sie Hinweis, Warnung, Fehler

Schnittstelle ADOCHTML

1. Öffnen Sie die Schnittstelle ADOCHTML

2. Prüfen Sie, ob folgende Parameter korrekt sind und korrigieren Sie sie ggf.
Typ:'Generierter Tabellenzugriff'
Tabellencode:AYTDOC
Veröffentlichungsname:AXTDHTML

3. Generieren Sie den Zugriff per Klick auf den Button 'Zugriff generieren'
Folgende Elemente werden automatisch angelegt: Verarbeitung WTAXTDHTML, Unterprogrammdaten WTAXTDHTML/ACCTAB und Webservice AXTDHTML
1. Prüfen Sie, ob folgende Parameter korrekt sind und korrigieren Sie sie ggf.
Max. Anzahl Positionen:10
              Feldertabelle:

4. Speichern und Freigabe der Daten

Schnittstelle AXTDFORM

1. Öffnen Sie die Schnittstellendaten AXTDFORM

2. Prüfen Sie, ob folgende Parameter korrekt sind und korrigieren Sie sie ggf.
Typ:'Aktion Benutzerobjekt'
Objekt:AYZ
Veröffentlichungsname:AXTDAYZ

3. Generieren Sie den Zugriff per Klick auf den Button 'Zugriff generieren'
Folgende Elemente werden automatisch angelegt: Verarbeitung WJAXTDAYZ und Webservice AXTDAYZ
1. Prüfen Sie, ob folgende Parameter korrekt sind und korrigieren Sie sie ggf.
           Feldertabelle:

4. Speichern und Freigabe der Daten

Schnittstelle AXTDLOGIN

1. Öffnen Sie die Schnittstellendaten AXTDLOGIN

2. Prüfen Sie, ob folgende Parameter korrekt sind und korrigieren Sie sie ggf.
Typ:'Aktion Benutzer Unterprogramm'
Verarbeitung:YTXTLOGIN
Unterprogramm:AKTION
Datei Unterprogramm (über Verzweigung zum Verarbeitungsfeld): AYTXTLOGIN/ACTION

3. Generieren Sie den Zugriff per Klick auf den Button 'Zugriff generieren'
Folgende Elemente werden automatisch angelegt: Webservice AXTDLOGIN
1. Prüfen Sie, ob folgende Parameter korrekt sind und korrigieren Sie sie ggf.
           Feldertabelle:

4. Speichern und Freigabe der Daten

Schnittstellen ACOUNTRY / ACURRENCIES / ALANGUAGES

Die Vorgehensweise entspricht der Schnittstelle ADOCHTML mit den Tabellen TABCOUNTRY, TABCUR, TABLAN.

JavaScript

Die Verwendung von JavaScript in der Website ASAMPLE ist begrenzt auf:

• Prüfung bestimmter Eingabedaten
• Verwaltung der Meldungsanzeige

In unserem Beispiel bieten wir eine Reihe von Standardeingabepunkten, die in der Dreamweaver-Template-Datei (ASAMPLE.dwt) programmiert sind und auf allen mit diesem Template erstellten Seiten zugänglich sind.

XTEND-Bibliothek

Der für XTEND spezifische JavaScript-Code wird mit dem Token ALIBJS in die HTML-Seite eingefügt. Mit diesem Token werden eingefügt:

• Bibliothek prototype.js
• JavaScript-XTEND-Bibliotheken
• XTEND-Stildaten

<script  adx="ALIBJS"></script>

Laden der HTML-Seite

// onLoad event handler for all pages
function xBodyOnLoad()
{
   // Set '0' value for unselected checkboxes
   xtdSetUnSelelectedValue('0');
   // pageBodyOnLoad is the page onLoad handler
   if (typeof(pageBodyOnLoad)=="function")
       pageBodyOnLoad();
   }
}

pageBodyOnLoad

Mit diesem Eingabepunkt können mit dem Seitenereignis '<BODY onLoad>' für diese HTML-Seite spezifische Verarbeitungen ausgeführt werden.

Um den Eingabepunkt zu aktivieren, muss lediglich eine JavaScript-Funktion 'function pageBodyOnLoad(){}' in der HTML-Seite deklariert werden.

Verarbeitungen bei Klick auf einen dynamischen Link

Mit dieser Funktion kann die Benutzermeldung gelöscht und ein Prüfeingabepunkt für Klicks auf einen dynamischen Link aufgerufen werden.

// Called each time the user clicks on an XTEND link
function xtdDoMyDlk(aDomOut)
{       
   // Clear user messages
   xtdRemoveElmtId("xtdusermsg",true);
   var wContinue=true;
   // Call page handler pageDoMyDlk if any
   if (typeof(pageDoMyDlk)=="function") wContinue=pageDoMyDlk(aDomOut);
   return wContinue;
}

pageDoMyDlk

Mit diesem Eingabepunkt können für diese HTML-Seite spezifische Verarbeitungen ausgeführt werden.

Um den Eingabepunkt zu aktivieren, muss lediglich eine JavaScript-Funktion 'function pageDoMyDlk(){aDomOut}' in der HTML-Seite deklariert werden.

//Asks user to confirm creation of a new form if user clicks on ADLKCONTACTNEW dynamic link
function pageDoMyDlk(aDomOut)
{
    if (aDomOut.isDlk("ADLKCONTACTNEW"))
        return confirm('Formularerstellung bestätigen\nErstellung bestätigen');
    return true;
}