Technologie > JavaScript
ZurückZusätzliche Komfortfunktionen via JavaScript
Der PepperShop setzt JavaScript ein um moderne Bedien-, Design und Integrationselemente umzusetzen und um den Komfort zu erhöhen.
Ein Bestellabschluss ist auch ohne JavaScript möglich (wenn nicht ein Payment Service Provider verwendet wird, welcher in seinem Terminal JavaScript voraussetzt oder eine spezifische, auf JavaScript basierte Technologie zur Artikelauswahl aktiv ist). So kann man auch mit den einfachsten Eingabegeräten im PepperShop einkaufen.
Zusätzlich zu reinem JavaScript stellt der PepperShop auch fertige, auf JavaScript Technologie basierende, Subsysteme zur Verfügung, so dass Entwicklungen kostengünstig und schnell umgesetzt werden können.
jQuery
jQuery ist die am weitesten verbreitete JavaScript Library. Sie bietet viele nützliche und auch essentielle Funktionen, um komfortabel, effizient und Browser unabhängig Programmieren zu können.
Es gibt inzwischen eine Vielzahl von anderen JavaScript Libraries und Frameworks welche jQuery als Basis voraussetzen. Mit dem PepperShop muss man sich darum nicht mehr kümmern. Es wird jQuery direkt integriert und aktiviert mitgelierfert, dazu auch viele der jQuery-UI Widgets.
Im PepperShop stehen folgende jQuery Add-Ons zur Verfügung:
| Produkt | Beschreibung |
| Bootstrap: | Sehr umfangreiches Framework zur Anzeige von modernem HTML5 Code |
| Fancybox: | Flexibles Add-On zur grafischen Visualisierung von Bildern (z.B. Zoomanzeige) |
| cloudzoom: | Add-On, dass erlaubt mit der Maus über ein Bild zu fahren, wo dann ein gezoomter Ausschnitt einer grösseren Version des Bildes angezeigt wird |
| bxSlider: | Slider Komponente zum Rendern einer animierten Fläche mit HTML-Inhalt oder Bildern |
| jpicker: | Sehr umfangreicher Color-Picker |
| qtip: | Add-On um Zusatzinfos zu einem Element anzuzeigen (Tooltipps) |
| selectmenu: | Add-On HTML Dropdown Menüs modern zu gestalten und auch um komplexe Elemente als Inhalte anzeigen zu können |
| slidemenu: | Menü-Komponente um verschachtelte, gestaltbare Menuüs zu rendern. Wird im PepperShop verwendet, wenn die Kategorien in der Hauptnavigation angezeigt werden sollen |
Unabhängig von jQuery gibt es noch die JavaScript Libraries jscolor (sehr schneller Color-Picker) und Tigra Calendar (Kalender-Widget), welche die «JavaScript-Helferlein» Runde komplettieren.
Bootstrap
Bootstrap ist ein schlankes, intuitives und mächtiges Front-End Framework für schnelleres und einfacheres Web Development. Es basiert auf jQuery.
Highslide JS
Highslide JS ist ein schöner, auf JavaScript basierender Bilder / Medien und Gallery Viewer. Diese kommerzielle Library ist sehr umfangreich programmierbar (mehr noch als die Fancybox) und es gibt auch Adaptoren für die PepperShop API.
JSON-API
JSON (JavaScript Object Notation) bietet eine einfache und einheitliche Übertragungsart für JavaScript Objekte / Daten an. (Info: Ab PepperShop v.6 gibt es zudem auch eine REST basierte Webservice API als Modul)
Für den PepperShop wird mit dem Mobile PepperShop Modul ein sehr umfangreiches JSON API geschrieben, welches die kundenseitige Interaktion mit dem PepperShop aus einer anderen Applikation heraus erlaubt.
Unter anderen stehen folgende Aufrufe bereit:
| API-Calls | Beschreibung |
| catalog get_category|get_product: | Kategorien / Unterkategorien auslesen, Artikel einer Kategorie und Details eines Artikels auslesen |
| search search_product: | Artikelsuche |
| basket load|save: | Warenkorb laden und speichern (z.B. wenn Anzahl geändert hat oder Produkt entfernt werden soll) |
| address load|save: | Kasse / Lieferadresse: Laden und speichern |
| login save|save_temp|logout: | Login Steuerung: speichern eines Kunden mit und ohne Logindaten, abmelden |
| home get_infos: | Startseite: Content Auslesen (Content-Slider, Startseite HTML-Block, Artikel auf Startseite, Links auf Startseite, Detailanzeige von statischen Pages (z.B. AGB) |
| environment get_environment: | Umgebungsdaten auslesen und speichern, z.B. Sprache / Währung |