a35- Plattformunabhängige Browser-Oberfläche für allegro-Datenbanken - Design-Konzept: -
a35 ist eine Weboberfläche die modular sehr flexibel an unterschiedlichste Basiswebpräsentationen anpassbar ist. |
Header Bereich (rot) / Menü Bereich (gelb) / Content Bereich (grün) Vorraussetzungen: Java Skript aktiviert, Zugang zum WWW Startdatei: a35_demo.php Diese Datei dient als Beispiel für Ihre persönliche Corporate Design Dateistruktur. Sie ist eine Beispielbasis für den Einbau von a35 in eine bestehende Website. Abhängige Dateien: ../scripts/a35css2.php ; a35ini.php ; diverse JQuery Skripte Menü Bereich - sortierbare jQuery AccordionstrukturMenü Bereich (linke Navigationsleiste) Menübespiel mit einer sortierbaren jQuery Accordionstruktur beliebig erweiterbar und benutzerspezifisch sortierbar. sortierbares Accordiongrundgerüst (open Source Code) Quelle: http://jqueryui.com/accordion/#sortable Sonderfall Intranet: JQuery Quelldateien auf eignen Server herunterladen Quelle:http://jqueryui.com/download/ Der Menü Bereich (Navigation) ist in der Beispieldatei a35_demo.php nur als Demomenü (JQuery Accordionstruktur) eingfügt. Dieses soll eine simple Variante für Ihr eignes Menü Corporate Design darstellen in die benutzerorientiert eine Auswahl der Funktionen eingebaut werden kann. (durch übernahme des jeweiligen Funktionslinks und dessen Name)Header Bereich - headdemo.gif
Der Header Bereich (Logos, Symbolbilder, Navigationsleisten) ist in der Beispieldatei nur als Demobanner ("headdemo.gif") eingfügt. Dieses soll eine simple Variante für Ihr eignes Header Corporate Design darstellen. Content Bereich - content-a35-tab.phpTabmodell vier Tab Grundfelder ( Indexsuche, Ergebnislisten, Titeldaten, Extras) beliebig erweiterbar (Hilfe) Tabs können frei angeordnet werden Tab Grundgerüst (open Source Code) Quelle: http://jqueryui.com/tabs/ Sonderfall Intranet: JQuery Quelldateien auf eignen Server herunterladen Quelle:http://jqueryui.com/download/ Script zum Aktivieren eines Tabs in der ein Ergebnis angezeigt wird: <script> Indexsuche - active(0) - REG Header Bereich (rot) / Menü Bereich (gelb) / Content Bereich (grün) Vorraussetzungen: Server Side Include SSI Startdatei: a35_katalog.htm Header Bereich <!--#include virtual="/inc/header-a35-demo.inc" --> Header Bereich - header-a35-demo.inc (Logos, Symbolbilder, UB Braunschweig Navigationsleiste) Menü Bereich - menue-a35.inc (linke Navigationsleiste) Content Bereich - content-a35-tab.php Tabmodell vier Tab Grundfelder ( Indexsuche, Ergebnislisten, Titeldaten, Extras) beliebig erweiterbar (Hilfe) Tabs können frei angeordnet werden Tab Grundgerüst (open Source Code) Quelle: http://jqueryui.com/tabs/ Script zum Aktivieren eines Tabs in der ein Ergebnis angezeigt wird: <script> Indexsuche - active(0) - REG Header Bereich (rot) / Menü Bereich (gelb) / Content Bereich (grün) Startdatei: a35start.php In der Startdatei a35start.php ist der Menü Bereich (Navigation) als Demomenü (JQuery Drop Down Menü) durch ein PHP Include der Datei a35menu.php (kann beliebig verändert / angepasst werden) eingebaut. Der Header Bereich ist ebenfalls als PHP Include (include("$headpc");) in der a35start.php eingebettet. In der a35ini.php ist die Quelldatei für den Header Bereich definiert ($headpc= 'a35_head_pc1.php';). Dieses soll eine simple Variante für Ihr eignes Header Design darstellen das benutzerorientiert gestaltet werden kann. Im Demo Packet befinden sich zwei Varianten für den Header Bereich eine grafisch einfache Variante a35_head_pc2.php und eine etwas grafisch betontere Variante a35_head_pc1.php (Wechsel durch Änderung in der a35ini.php). Der Content Bereich (eingebettet in a35start.php) ist beim PC Design in vier Quadranten aufgebaut die gleichzeitig abgebildet werden (Zielgruppe Datenbankexperten die bei der Neueingabe oder Datenverarbeitung einen größeren Überblick auf die Daten benötigen) Die einzelnen Qudranten können mit Hilfe von Funktionstasten leicht in Ihrer Anordnung und Größe veränderet werden. Header Bereich (rot) / Menü Bereich (gelb) / Content Bereich (grün) Startdatei: a35tab.php In der Startdatei a35tab.php ist der Menü Bereich (Navigation) als Demomenü (JQuery Drop Down Menü) durch ein PHP Include der Datei a35menu.php (kann beliebig verändert / angepasst werden) eingebaut. Der Header Bereich ist ebenfalls als PHP Include (include("$headtab");) in der a35tab.php eingebettet. In der a35ini.php ist die Quelldatei für den Header Bereich definiert ($headtab= 'a35_head_tab1.php';). Dieses soll eine simple Variante für Ihr eignes Header Design darstellen das benutzerorientiert gestaltet werden kann. Im Demo Packet befinden sich zwei Varianten für den Header Bereich eine grafisch einfache Variante a35_head_tab2.php und eine etwas grafisch betontere Variante a35_head_tab1.php (Wechsel durch Änderung in der a35ini.php). Der Content Bereich (eingebettet in a35tab.php) ist beim Tablet Design analog zum Corporate Design Bsp. (Zielgruppe allgemeine Nutzer mit Endgräten größer Tablet Tabmodell vier Tab Grundfelder ( Indexsuche, Ergebnislisten, Titeldaten, Extras) beliebig erweiterbar (Hilfe) Tabs können frei angeordnet werden Tab Grundgerüst (open Source Code) Quelle: http://jqueryui.com/tabs/ Sonderfall Intranet: JQuery Quelldateien auf eignen Server herunterladen Quelle:http://jqueryui.com/download/ Script zum Aktivieren eines Tabs in der ein Ergebnis angezeigt wird: <script> Indexsuche - active(0) - REG Header Bereich (rot) / Menü Bereich (gelb) / Content Bereich (grün) Startdatei: a35app.php Der Header Bereich ist ebenfalls als PHP Include (include("$headmobile");) in der a35app.php eingebettet. In der a35ini.php ist die Quelldatei für den Header Bereich definiert ($headmobile= 'a35_head_mobile1.php';). Dieses soll eine simple Variante für Ihr eignes Header Design darstellen das benutzerorientiert gestaltet werden kann. Im Demo Packet befinden sich zwei Varianten für den Header Bereich eine grafisch einfache Variante a35_head_mobile2.php und eine etwas grafisch betontere Variante a35_head_mobile1.php (Wechsel durch Änderung in der a35ini.php). Der Content Bereich (eingebettet in a35app.php) ist beim Mobile Design als jQuery Accordionstruktur aufgebaut.(Zielgruppe allgemeine Nutzer mit mobilen Endgräten kleiner als Tablets) Accordionstruktur mit vier Sections (Indexsuche, Ergebnislisten, Titeldaten, Extras) beliebig erweiterbar (Hilfe) Sections können frei angeordnet werden Accordion Grundgerüst (open Source Code) Quelle: http://jqueryui.com/accordion/ Sonderfall Intranet: JQuery Quelldateien auf eignen Server herunterladen Quelle:http://jqueryui.com/download/ Script zum Aktivieren einer Section in der ein Ergebnis angezeigt wird: <script> Indexsuche - active(0) - REG |