Merge pull request #7 from componentK/SG-123-fix-properties

SG-123 fix properties
retail-red · Apr 4, 2023 · 47117cf · 47117cf
2 parents 4d6014a + d15bbe5
commit 47117cf
Show file tree

Hide file tree

Showing 3 changed files with 92 additions and 83 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -5,10 +5,14 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/) and this project adheres to [Semantic Versioning](http://semver.org/).
 
 ## [Unreleased]
+### Added
+- fallback to use Product Number when EAN is not available
 ### Changed
 - replaced retail.red logo with the new one from Shopgate
 ### Fixed
 - product quantity sent as a string to the API, number required
+- issues with data for configuration provided URL's
+- issues with data for single variant children
 
 ## [1.4.0] - 2022-05-31
 ### Changed

diff --git a/src/Resources/config/config.xml b/src/Resources/config/config.xml
@@ -6,7 +6,7 @@
         <title>Basic Configuration</title>
         <title lang="de-DE">Grundeinstellungen</title>
 
-        <input-field type="text">
+        <input-field>
             <name>apiKey</name>
             <label>Storefront API Key</label>
             <copyable>true</copyable>
@@ -25,8 +25,9 @@
                     <name>EAN</name>
                 </option>
                 <option>
-                    <id>ordernumber</id>
-                    <name>Order Number</name>
+                    <id>product-number</id>
+                    <name>Product Number</name>
+                    <name lang="de-DE">Produktnummer</name>
                 </option>
             </options>
         </input-field>
@@ -92,27 +93,25 @@
             <helpText>
                 If enabled the browsers history will be used within the reservation modal allowing the users to navigate with the native controls. Can be disabled when your store is already using the browsers history internally and the modals history conflicts with it.
             </helpText>
-                <helpText lang="de-DE">Sobald aktiviert, kann der Nutzer die Browser Historie zur Navigation im Reservierungs-Prozess nutzen.</helpText>
+            <helpText lang="de-DE">Erlaubt Nutzern die Benutzung der Browser-Historie zur Navigation im Reservierungs-Prozess. Deaktivieren Sie diese Funktion, falls ihr Theme bereits eine solche Navigation anbietet und dadurch ein Konflikt mit der Plugin-Funktionalität entsteht.</helpText>
             <defaultValue>true</defaultValue>
         </input-field>
 
         <input-field type="bool">
             <name>useGeolocationImmediately</name>
             <label>Use Geolocation immediately</label>
-            <helpText>
-                If enabled, whenever the user opens the store list the browsers geolocation will be requested immediately instead of only after pressing the locate me button.
-            </helpText>
-                <helpText lang="de-DE">Wenn diese Option aktiviert wird, wird der Zugriff auf die Geo Location sofort nach öffnen der Filial-Übersicht angefragt.</helpText>
+            <helpText>If enabled, whenever the user opens the store list the browser's geolocation will be requested immediately instead of only after pressing the "locate me" button.</helpText>
+            <helpText lang="de-DE">Wenn diese Option aktiviert ist, wird der Zugriff auf die Geo-Location sofort nach dem Öffnen der Filial-Übersicht angefragt.</helpText>
             <defaultValue>true</defaultValue>
         </input-field>
 
         <input-field type="bool">
             <name>testMode</name>
             <label>Testmode</label>
             <helpText>
-                When set to true no buttons will be rendered within the users browser, till the page was once opened with a query parameter like rrTesting=start. A testing session can be stopped by opening the page with rrTesting=end
+                When set to true no buttons will be rendered within the users' browser, until the page was once opened with query parameter "rrTesting=start". The testing session can be terminated by opening the page with "rrTesting=end".
             </helpText>
-                <helpText lang="de-DE">Wenn diese Option aktiviert wird, werden keine Buttons auf der Produktdetailseite angezeigt. Um die Buttons anzuzeigen, muss der Parameter "rrTesting=Start" an die URL angehängt werden. Die Test-Session kann durch den Parameter "rrTesting=end" gestoppt werden.</helpText>
+            <helpText lang="de-DE">Wenn diese Option aktiviert wird, werden keine Buttons auf der Produktdetailseite angezeigt. Um die Buttons anzuzeigen, muss der Parameter "rrTesting=start" an die URL angehängt werden. Die Test-Session kann durch den Parameter "rrTesting=end" gestoppt werden.</helpText>
             <defaultValue>false</defaultValue>
         </input-field>
 
@@ -136,7 +135,7 @@
             <name>countries</name>
             <label>Countries</label>
             <helpText>Set the available countries for the store list search</helpText>
-                <helpText lang="de-DE">Wählen Sie die verfügbaren Länder für die Filialsuche aus.</helpText>
+            <helpText lang="de-DE">Wählen Sie die verfügbaren Länder für die Filialsuche aus.</helpText>
             <options>
                 <option>
                     <id>de</id>
@@ -158,7 +157,7 @@
                 Availability in store - A box that directly shows the availability of the product in the store.
                 The customer has to select a store the first time.
             </helpText>
-                <helpText lang="de-DE">Wählen Sie welche Version der Reservierung genutzt werden soll: Reservation Button = "Reservieren" Button, welcher die Filialsuche öffnet. Availability in Store = Einmalige Auswahl einer Filiale, sofortige Anzeige des lokalen Bestands.</helpText>
+            <helpText lang="de-DE">Wählen Sie, welche Version der Reservierung genutzt werden soll: "Reservation Button": Es wird ein Button mit der Aufschrift "Reservieren" angezeigt, welcher die Filialsuche öffnet. "Availability in Store": Der Nutzer wählt eine Filiale und es wird immer der lokale Bestand dieser Filiale angezeigt.</helpText>
             <defaultValue>reserveButton</defaultValue>
             <options>
                 <option>
@@ -185,7 +184,7 @@
                 Also shows address, distance and opening hours if available.
                 Dropdown - A simple dropdown where the customer can choose the store from. Recommended only for small amount of stores.
             </helpText>
-                <helpText lang="de-DE">Nur relevant, wenn oben "Availability in Store" gewählt wurde. Optionen: Modal = PopUp zur Filialauswahl, Dropdown = Dropdown zur Filialauswahl.</helpText>
+            <helpText lang="de-DE">Nur relevant, wenn oben "Availability in Store" gewählt wurde. Optionen: Modal = PopUp zur Filialauswahl, Dropdown = Dropdown zur Filialauswahl.</helpText>
             <defaultValue>modal</defaultValue>
             <options>
                 <option>
@@ -203,38 +202,38 @@
             <name>inventoryHideNumber</name>
             <label>Hide stock</label>
             <helpText>Hides the stock number and therefore display only if the product is available or not.</helpText>
-                <helpText lang="de-DE">Blendet den tatsächlichen Bestand aus und zeigt nur "Verfügbar" an.</helpText>
+            <helpText lang="de-DE">Blendet den tatsächlichen Bestand aus und zeigt nur "Verfügbar" an.</helpText>
             <defaultValue>false</defaultValue>
         </input-field>
 
         <input-field type="int">
             <name>inventoryShowExactUntil</name>
             <label>Show exact inventory until</label>
             <helpText>If inventory is higher than the given number the inventory will be displayed as "X+ Available"</helpText>
-                <helpText lang="de-DE">Wenn der Beständ höher als angegeben ist, wird "X+ Verfügbar" angezeigt.</helpText>
+            <helpText lang="de-DE">Wenn der Bestand höher als angegeben ist, wird "X+ Verfügbar" angezeigt.</helpText>
         </input-field>
 
         <input-field type="int">
             <name>inventoryShowLowUntil</name>
             <label>Show low inventory until</label>
             <helpText>If inventory is lower than the given number the inventory will be displayed in the state-warning color</helpText>
-                <helpText lang="de-DE">Wenn der Beständ niedriger als angegeben ist, wird "X Verfügbar" in der state-warning Farbe angezeigt.</helpText>
+            <helpText lang="de-DE">Wenn der Bestand niedriger als angegeben ist, wird "X Verfügbar" in der state-warning Farbe angezeigt.</helpText>
             <defaultValue>5</defaultValue>
         </input-field>
 
         <input-field type="url">
             <name>termsLink</name>
             <label>Terms Link</label>
-            <helpText>Add an url to the terms and condition page, also enforces the user to accept them before placing an reservation</helpText>
-                <helpText lang="de-DE">Fügen Sie eine URL ein, damit der Kunde die AGB vor Abschluss der Reservierung akzeptieren muss.</helpText>
+            <helpText>Add a URL to the terms and condition page, also enforces the user to accept them before placing a reservation</helpText>
+            <helpText lang="de-DE">Fügen Sie eine URL ein, damit der Kunde die AGB vor Abschluss der Reservierung akzeptieren muss.</helpText>
             <copyable>true</copyable>
         </input-field>
 
         <input-field type="url">
             <name>privacyLink</name>
             <label>Privacy Link</label>
-            <helpText>Add an url to the privacy page, also enforces the user to accept them before placing an reservation</helpText>
-                <helpText lang="de-DE">Fügen Sie eine URL ein, damit der Kunde die Datenschutzerklärung vor Abschluss der Reservierung akzeptieren muss.</helpText>
+            <helpText>Add a URL to the privacy page, also enforces the user to accept them before placing a reservation</helpText>
+            <helpText lang="de-DE">Fügen Sie eine URL ein, damit der Kunde die Datenschutzerklärung vor Abschluss der Reservierung akzeptieren muss.</helpText>
             <copyable>true</copyable>
         </input-field>
     </card>
@@ -246,7 +245,7 @@
             <name>colors</name>
             <label>Colors</label>
             <helpText>Please use only the 3 numbers of rgb schema. rgb(1,2,3) -> 1,2,3</helpText>
-                <helpText lang="de-DE">Bitte nutzen Sie nur die 3 Zahlen des RBG Schemas. rgb(1,2,3) -> 1,2,3</helpText>
+            <helpText lang="de-DE">Bitte nutzen Sie nur die 3 Zahlen des RBG Schemas. rgb(1,2,3) -> 1,2,3</helpText>
             <defaultValue>
                 /* Color for common text */
                 --rr-color-text: #000;

diff --git a/src/Resources/views/storefront/page/product-detail/index.html.twig b/src/Resources/views/storefront/page/product-detail/index.html.twig
@@ -13,70 +13,76 @@
                 var localization = {{ config('SgateClickAndReserveSW6.config.translations')|raw|default('null') }} || {};
                 localization.countries = {{ config('SgateClickAndReserveSW6.config.countries')|default(['de'])|json_encode|raw }};
                 var variants = {{ page.product.variation|default([])|json_encode|raw }};
-                var product = {{ page.product|json_encode|raw }}
+                var product = {{ page.product|json_encode|raw }};
+                var getBasicVariantData = function(variant) {
+                  return {
+                    code: variant.group,
+                    name: variant.group,
+                    value: {
+                      code: variant.option,
+                      name: variant.option
+                    }
+                  }
+                };
+                var sgData = {
+                  apiKey: '{{ config('SgateClickAndReserveSW6.config.apiKey') }}',
+                  apiStage: '{{ config('SgateClickAndReserveSW6.config.apiStage') }}',
+                  useGeolocationImmediately: {{ config('SgateClickAndReserveSW6.config.useGeolocationImmediately') | json_encode }},
+                  browserHistory: {{ config('SgateClickAndReserveSW6.config.browserHistory') | json_encode }},
+                  testMode: {{ config('SgateClickAndReserveSW6.config.testMode') | json_encode }},
+                  unitSystem: '{{ config('SgateClickAndReserveSW6.config.unitSystem') }}',
+                  saveCustomerData: '{{ config('SgateClickAndReserveSW6.config.saveCustomerData') === 'consentManager' ? (document.cookie.indexOf('sg-save-customer-data-enabled=') !== -1 ? 'on' : 'off') : config('SgateClickAndReserveSW6.config.saveCustomerData') }}',
+                  localization: localization,
+                  inventory: {
+                    hideNumber: {{ config('SgateClickAndReserveSW6.config.inventoryHideNumber') | json_encode }},
+                    showExactUntil: {{ config('SgateClickAndReserveSW6.config.inventoryShowExactUntil') |default('null') }},
+                    showLowUntil: {{ config('SgateClickAndReserveSW6.config.inventoryShowLowUntil') |default('null') }},
+                  },
+                  legal: {
+                    terms: '{{ config('SgateClickAndReserveSW6.config.termsLink') |default(null) }}',
+                    privacy: '{{ config('SgateClickAndReserveSW6.config.privacyLink') |default(null) }}',
+                  },
+                  customer: {
+                    code: '{{ context.customer.customerNumber }}',
+                    firstName: '{{ context.customer.firstName }}',
+                    lastName: '{{ context.customer.lastName }}',
+                    phone: '{{ context.customer.defaultBillingAddress.phoneNumber }}',
+                    emailAddress: '{{ context.customer.email }}',
+                  },
+                  product: {
+                    code: '{% if productCodeMapping == 'ean' and page.product.ean is defined %}{{ page.product.ean }}{% else %}{{ page.product.productNumber }}{% endif %}',
+                    name: '{{ page.product.translated.name }}',
+                    quantity: {{ page.product.calculatedPrice.quantity }},
+                    imageUrl: '{{ page.product.cover.media.url }}',
+                    price: {{ page.product.calculatedPrice.unitPrice }},
+                    currencyCode: '{{ context.currency.isoCode }}',
+                    options: variants.map(function (variant) {
+                      if (!product.sortedProperties) {
+                        return getBasicVariantData(variant);
+                      }
+                      const sortedProperty = product.sortedProperties.find(function(sortedProperty) {
+                        return sortedProperty.name === variant.group
+                      })
+                      if (!(sortedProperty && sortedProperty.options)) {
+                        return getBasicVariantData(variant);
+                      }
 
-                var retailred = window.RetailRedStorefront.create({
-                    apiKey: '{{ config('SgateClickAndReserveSW6.config.apiKey') }}',
-                    apiStage: '{{ config('SgateClickAndReserveSW6.config.apiStage') }}',
-                    useGeolocationImmediately: {{ config('SgateClickAndReserveSW6.config.useGeolocationImmediately') | json_encode }},
-                    browserHistory: {{ config('SgateClickAndReserveSW6.config.browserHistory') | json_encode }},
-                    testMode: {{ config('SgateClickAndReserveSW6.config.testMode') | json_encode }},
-                    unitSystem: '{{ config('SgateClickAndReserveSW6.config.unitSystem') }}',
-                    saveCustomerData: '{{ config('SgateClickAndReserveSW6.config.saveCustomerData') === 'consentManager' ? (document.cookie.indexOf('sg-save-customer-data-enabled=') !== -1 ? 'on' : 'off') : config('SgateClickAndReserveSW6.config.saveCustomerData') }}',
-                    localization: localization,
-                    inventory: {
-                        hideNumber: {{ config('SgateClickAndReserveSW6.config.inventoryHideNumber') | json_encode }},
-                        showExactUntil: {{ config('SgateClickAndReserveSW6.config.inventoryShowExactUntil') |default('null') }},
-                        showLowUntil: {{ config('SgateClickAndReserveSW6.config.inventoryShowLowUntil') |default('null') }},
-                    },
-                    legal: {
-                        terms: {{ config('SgateClickAndReserveSW6.config.termsLink') |default(null)|json_encode }},
-                        privacy: {{ config('SgateClickAndReserveSW6.config.privacyLink') |default(null)|json_encode }},
-                    },
-                    customer: {
-                        code: '{{ context.customer.customerNumber }}',
-                        firstName: '{{ context.customer.firstName }}',
-                        lastName: '{{ context.customer.lastName }}',
-                        phone: '{{ context.customer.defaultBillingAddress.phoneNumber }}',
-                        emailAddress: '{{ context.customer.email }}',
-                    },
-                    product: {
-                        code: '{% if productCodeMapping == 'ean' %}{{ page.product.ean }}{% else %}{{ page.product.productNumber }}{% endif %}',
-                        name: '{{ page.product.translated.name }}',
-                        quantity: {{ page.product.calculatedPrice.quantity }},
-                        imageUrl: '{{ page.product.cover.media.url }}',
-                        price: {{ page.product.calculatedPrice.unitPrice }},
-                        currencyCode: '{{ context.currency.isoCode }}',
-                        options: variants.map(function (variant) {
-                            if (!product.sortedProperties) {
-                                return {
-                                    code: variant.group,
-                                    name: variant.group,
-                                    value: {
-                                        code: variant.option,
-                                        name: variant.option
-                                    }
-                                }
-                            }
-                            const sortedProperty = product.sortedProperties.find(function(sortedProperty) {
-                                return sortedProperty.name === variant.group
-                            })
+                      const variantDetails = sortedProperty.options.find(function(sortedPropertyOption) {
+                        return variant.option === sortedPropertyOption.name
+                      });
 
-                            const variantDetails = sortedProperty.options.find(function(sortedPropertyOption) {
-                                return variant.option === sortedPropertyOption.name
-                            })
-
-                            return {
-                                code: sortedProperty.id,
-                                name: sortedProperty.name,
-                                value: {
-                                    code: variantDetails.id,
-                                    name: variantDetails.name
-                                }
-                            }
-                        }).filter(Boolean)
-                    },
-                });
+                      return {
+                        code: sortedProperty.id,
+                        name: sortedProperty.name,
+                        value: {
+                          code: variantDetails.id,
+                          name: variantDetails.name
+                        }
+                      }
+                    }).filter(Boolean)
+                  },
+                };
+                var retailred = window.RetailRedStorefront.create(sgData);
 
                 {% if config('SgateClickAndReserveSW6.config.displayType') == 'reserveButton' %}
                     retailred.renderReserveButton('#rr-reserve-button')