Isotope-Cart-ProductAddedFeedback - Versionsgeschichte

Manitougs: Aufbereitung

2011-08-27T18:41:55Z

Aufbereitung

Bubblez am 24. Juli 2011 um 16:49 Uhr

2011-07-24T16:49:17Z

Bubblez: /* Variante1: Isotope Box und Hooks */

2011-07-24T16:43:55Z

‎Variante1: Isotope Box und Hooks

Bubblez am 24. Juli 2011 um 16:40 Uhr

2011-07-24T16:40:34Z

Bubblez: /* Isotope-Basket - Feedback wenn neues Produkt im Warenkorb */

2011-07-24T16:38:15Z

‎Isotope-Basket - Feedback wenn neues Produkt im Warenkorb

Bubblez: /* Variante1: Isotope Box und Hooks */

2011-07-24T16:36:07Z

‎Variante1: Isotope Box und Hooks

Bubblez: /* Templates & Isotope Box */

2011-07-24T16:30:53Z

‎Templates & Isotope Box

Bubblez: /* Templates & Isotope Box */

2011-07-24T16:29:53Z

‎Templates & Isotope Box

Bubblez am 24. Juli 2011 um 16:29 Uhr

2011-07-24T16:29:27Z

Bubblez: /* Templates & Isotope Box */

2011-07-24T16:28:27Z

‎Templates & Isotope Box

@@ Zeile 1: / Zeile 1: @@
-<!-- begin Stub -->
+{{stub}}
-<div class="stub" align="center" style="margin-bottom:30px;">
+[[Kategorie:Isotope eCommerce]]
-{| cellpadding="2" cellspacing="0" style="text-align: left; color:#B65C5C; border: 1px solid #8E0505; background-color: #F2F2F2"
+In der aktuellen Isotope Version (0.2.10 stable) wird dem Benutzer nach erfolgreichem Hinzufügen eines Produktes in den Warenkorb keine Meldung angezeigt. Mit den Boardmitteln von Contao und ein wenig Kreativität kann man das in wenigen Minuten ändern. Es gibt mehrere Wege dieses Verhalten zu implementieren. Die einzelnen Varianten werden hier vorgestellt.
-| | [[Bild:msgError.png]] || <span class="title">'''Unvollständiger Artikel:'''</span> dieser Artikel ist noch nicht sauber bearbeitet.
-Bitte [{{fullurl:{{FULLPAGENAME}}|action=edit}} erweitere ihn] und entferne erst anschliessend diesen Hinweis.<includeonly>[[Category:Stub]]</includeonly>
-|}
-</div>
-<!-- end Stub -->
-−
-[[Category:Dev_HOWTOS]]
-In der aktuellen Isotope Version (0.2.10 stable), wird dem Benutzer nach erfolgreichem Hinzufügen eines Produktes in den Warenkorb, keine Meldung angezeigt. Mit den Boardmitteln von contao und ein wenig Kreativität kann man das in wenigen Minuten ändern. Es gibt mehrere Wege dieses Verhalten zu implementieren. Die einzelnen Varianten werden hier vorgestellt.
 {{Hinweis
@@ Zeile 16: / Zeile 8: @@
 ==Variante1: Isotope Box und Hooks==
-Wir verwenden PHP, Javascript und CSS um nach erfolgreichem Hinzufügen eine HTML-Messagebox anzuzeigen. Schlussendlich würde es diese Technik auch erlauben Isotope Fehlermeldungen (Out of Stock, komplexere Validierungsresultate) anzuzeigen.
+Zum Anzeigen einer HTML-Messagebox nach dem erfolgreichen Hinzufügen eines Artikels in den Warenkorb wird PHP, Javascript und CSS verwendet. Schlussendlich würde es diese Technik auch erlauben Isotope Fehlermeldungen (Out of Stock, komplexere Validierungsresultate) anzuzeigen.
-[[Datei:IsotopeCartExt_ajaxBox.png]]
+[[Datei:IsotopeCartExt_ajaxBox.png|HTML-Messagebox|frame|center]]
-Zuerst erstellen wir ein neues Modul. In diesem Tutorial verwende ich den Modulnamen ''IsotopeExt''. Im Ordner TL_ROOT/system/modules erstellen wir folgende Verzeichnisse und Dateien: IsotopeExt/config/config.php, IsotopeExt/IsotopeCartExt.php
+Zuerst erstellt man ein neues Modul namens''IsotopeExt''. Im Ordner TL_ROOT/system/modules erstellt man folgende Verzeichnisse und Dateien:
 ===Backend Konfiguration===
@@ Zeile 26: / Zeile 21: @@
 ===PHP Konfiguration===
-In der config/config.php folgenden PHP-Code hinzufügen:
+In der Datei ''IsotopeExt/config/config.php'' folgenden PHP-Code hinzufügen:
 <source lang="php">
@@ Zeile 34: / Zeile 29: @@
 (Am einfachsten eine config.php eines anderen Moduls kopieren und dessen Inhalt ersetzen.)
-Damit registrieren wir zwei neue Hooks, die jedes mal aufgerufen werden, wenn ein Produkt dem Warenkorb hinzugefügt wird. Im Folgenden nun die Implementation der zwei registrierten Funktionen.
+Damit registriert man zwei neue Hooks, die jedes mal aufgerufen werden, wenn ein Produkt dem Warenkorb hinzugefügt wird. Im Folgenden nun die Implementation der zwei registrierten Funktionen.
-In der IsotopeCartExt.php folgenden Code einfügen:
+In der Datei ''IsotopeExt/IsotopeCartExt.php'' folgenden Code einfügen:
 <source lang="php">
 class IsotopeCartExt extends Model {
@@ Zeile 58: / Zeile 53: @@
 ===Templates & Isotope Box===
-Nun ist es möglich die erstellten Session Objekte im Frontend zu verwenden. Wir verwenden dazu ein angepasstes Produktleser Template. Dazu einfach das entsprechende Template iso_reader_default.tpl von TL_ROOT/modules/Isotope/templates nach TL_ROOT/templates kopieren. Wenn das Template umbenannt wird, nicht vergessen im Produktleser Modul das umbenannte Template anzuwählen.
+Nun ist es möglich, die erstellten Session Objekte im Frontend zu verwenden. Man verwendet dazu ein [[Templates_bearbeiten|angepasstes]] Produktleser-Template. Dazu einfach das entsprechende Template ''iso_reader_default.tpl'' von TL_ROOT/modules/Isotope/templates nach TL_ROOT/templates kopieren. Wenn das Template umbenannt wird, nicht vergessen im Produktleser Modul das umbenannte Template anzuwählen.
 Folgende Zeilen am Anfang einfügen:
@@ Zeile 68: / Zeile 63: @@
 </source>
-In der Session-Variabel $_SESSION['ISOTOPE']['FE_NOTIFY']['html'] steckt das ganze gerenderte HTML der anzuzeigenden Nachricht. Allerdings noch nicht sichtbar. Mit Javascript lesen wir das HTMl aus und zeigen es in einer Isotope Box an.
+In der Session-Variabel $_SESSION['ISOTOPE']['FE_NOTIFY']['html'] steckt das ganze gerenderte HTML der anzuzeigenden Nachricht, ist allerdings noch nicht sichtbar. Mit Javascript liest man das HTML aus und zeigen es in einer Isotope Box an.
 Dazu anschliessend an den PHP-Code folgendes einfügen:
-<source lang="php">
+<source lang="javascript">
 <script type='text/javascript'>
 var notifyCtnr = jQuery("#isotope_notify"); // in mootools use: $('isotope_notify');
@@ Zeile 85: / Zeile 80: @@
 ====CSS====
 Mit optional markierte Zeilen bzw. Blöcke können weggelassen werden, ohne die Funktion einzuschränken.
-Den Folgenden CSS Code direkt im Template einbinden, oder besser im CSS des Themes.
+Den folgenden CSS-Code direkt im Template einbinden, oder besser im CSS des Themes.
 <source lang="css">
 #iso_ajaxBox{

@@ Zeile 10: / Zeile 10: @@
 [[Category:Dev_HOWTOS]]
 In der aktuellen Isotope Version (0.2.10 stable), wird dem Benutzer nach erfolgreichem Hinzufügen eines Produktes in den Warenkorb, keine Meldung angezeigt. Mit den Boardmitteln von contao und ein wenig Kreativität kann man das in wenigen Minuten ändern. Es gibt mehrere Wege dieses Verhalten zu implementieren. Die einzelnen Varianten werden hier vorgestellt.
 ==Variante1: Isotope Box und Hooks==

@@ Zeile 13: / Zeile 13: @@
 ==Variante1: Isotope Box und Hooks==
 Wir verwenden PHP, Javascript und CSS um nach erfolgreichem Hinzufügen eine HTML-Messagebox anzuzeigen. Schlussendlich würde es diese Technik auch erlauben Isotope Fehlermeldungen (Out of Stock, komplexere Validierungsresultate) anzuzeigen.
 Zuerst erstellen wir ein neues Modul. In diesem Tutorial verwende ich den Modulnamen ''IsotopeExt''. Im Ordner TL_ROOT/system/modules erstellen wir folgende Verzeichnisse und Dateien: IsotopeExt/config/config.php, IsotopeExt/IsotopeCartExt.php
@@ Zeile 90: / Zeile 92: @@
+}
 #iso_ajaxBox .add_success{
 	background: url("../../system/themes/default/images/help.gif") no-repeat scroll right center #FFFFFF;
 	padding-right: 50px;
+}
 #iso_ajaxBox .add_fail{ /*optional*/
 	background: url("../../system/themes/default/images/important.gif") no-repeat scroll right center #FFFFFF;
 	padding-right: 50px;

@@ Zeile 9: / Zeile 9: @@
 [[Category:Dev_HOWTOS]]
-In der aktuellen Isotope Version (0.2.10 stable), wird dem Benutzer nach erfolgreichem Hinzufügen eines Produktes in den Warenkorb, keine Meldung angezeigt. Mit den Boardmitteln von contao und ein wenig Kreativität kann man das in wenigen Minuten ändern.
+In der aktuellen Isotope Version (0.2.10 stable), wird dem Benutzer nach erfolgreichem Hinzufügen eines Produktes in den Warenkorb, keine Meldung angezeigt. Mit den Boardmitteln von contao und ein wenig Kreativität kann man das in wenigen Minuten ändern. Es gibt mehrere Wege dieses Verhalten zu implementieren. Die einzelnen Varianten werden hier vorgestellt.
 ==Variante1: Isotope Box und Hooks==
-Wir verwenden PHP, Javascript und CSS um nach erfolgreichem Hinzufügen eine HTML-Messagebox anzuzeigen.
+Wir verwenden PHP, Javascript und CSS um nach erfolgreichem Hinzufügen eine HTML-Messagebox anzuzeigen. Schlussendlich würde es diese Technik auch erlauben Isotope Fehlermeldungen (Out of Stock, komplexere Validierungsresultate) anzuzeigen.
 Zuerst erstellen wir ein neues Modul. In diesem Tutorial verwende ich den Modulnamen ''IsotopeExt''. Im Ordner TL_ROOT/system/modules erstellen wir folgende Verzeichnisse und Dateien: IsotopeExt/config/config.php, IsotopeExt/IsotopeCartExt.php

← Nächstältere Version		Version vom 24. Juli 2011, 16:38 Uhr
Zeile 9:		Zeile 9:

	[[Category:Dev_HOWTOS]]		[[Category:Dev_HOWTOS]]
−	~~=Isotope-Basket - Feedback wenn neues Produkt im Warenkorb=~~
−
	In der aktuellen Isotope Version (0.2.10 stable), wird dem Benutzer nach erfolgreichem Hinzufügen eines Produktes in den Warenkorb, keine Meldung angezeigt. Mit den Boardmitteln von contao und ein wenig Kreativität kann man das in wenigen Minuten ändern.		In der aktuellen Isotope Version (0.2.10 stable), wird dem Benutzer nach erfolgreichem Hinzufügen eines Produktes in den Warenkorb, keine Meldung angezeigt. Mit den Boardmitteln von contao und ein wenig Kreativität kann man das in wenigen Minuten ändern.

@@ Zeile 14: / Zeile 14: @@
 ==Variante1: Isotope Box und Hooks==
-Wir erstellen zuerst ein neues Modul. In diesem Tutorial verwende ich den Modulnamen ''IsotopeExt''. Im Ordner TL_ROOT/system/modules erstellen wir folgende Verzeichnisse und Dateien: IsotopeExt/config/config.php, IsotopeExt/IsotopeCartExt.php
+Wir verwenden PHP, Javascript und CSS um nach erfolgreichem Hinzufügen eine HTML-Messagebox anzuzeigen.
 ===Backend Konfiguration===
@@ Zeile 23: / Zeile 25: @@
 <source lang="php">
-$GLOBALS['TL_HOOKS']['iso_addProductToCollection'][] 		= array('IsotopeCartExt', 'addProduct');
+$GLOBALS['TL_HOOKS']['iso_addProductToCollection'][] 		= array('IsotopeCartExt', 'addSuccess');
 $GLOBALS['TL_HOOKS']['iso_addProductToCollection'][] 		= array('IsotopeCartExt', 'createFENotification');
 </source>
@@ Zeile 33: / Zeile 35: @@
 <source lang="php">
 class IsotopeCartExt extends Model {
-	public function addSuccess(){
+	public function addSuccess(IsotopeProduct $objProduct, $intQuantity){
 		$_SESSION['ISOTOPE']['FE_NOTIFY']['messages']['add_success'] = array(
 			'class'   => 'add_success',
 			'message' => 'Produkt wurde dem Warenkorb hinzugefügt.'
 		);
+	}

@@ Zeile 70: / Zeile 70: @@
+}
 // optional jQuey Code, enhance isotope box overlay close operation
-$("#iso_ajaxOverlay").click(function(){
+jQuery("#iso_ajaxOverlay").click(function(){
      Isotope.hideBox();
 });

@@ Zeile 59: / Zeile 59: @@
 unset($_SESSION['ISOTOPE']['FE_NOTIFY']);
 ?>
 </source>