fix:display out of stock notification on cart page

fix: only keep overrider logic for promo code form
fixes add to cart sending two requests instead of one
2024-11-26 10:00:37 +00:00 · 2024-11-26 15:14:58 +05:30 · 2024-11-26 06:44:15 +00:00 · 2024-11-25 18:00:31 +05:30 · 2024-11-25 18:00:14 +05:30 · 2024-11-25 17:59:47 +05:30
6 changed files with 206 additions and 134 deletions
--- a/_dev/js/cart.js
+++ b/_dev/js/cart.js
@ -28,7 +28,7 @@ const CheckUpdateQuantityOperations = {

    if (errorMsg !== "") {
      const strError = `
-        <article class="alert alert-danger" role="alert" data-alert="danger">
+        <article class="alert text-center w-fit flex mt-12 p-2 bg-red-100 border border-red-300 alert-danger" role="alert" data-alert="danger">
          <ul>
            <li>${errorMsg}</li>
          </ul>
@ -398,3 +398,41 @@ $(function () {
    return false;
  });
 });
+
+$(document).ready(() => {
+  const e = $("body");
+  e.off("submit", '[data-link-action="add-voucher"]'),
+    e.on("submit", '[data-link-action="add-voucher"]', (e) => {
+      const promoSubmitBtn = $("#promo-code-form button");
+      e.preventDefault();
+      const n = $(e.currentTarget),
+        o = n.attr("action");
+      0 === n.find("[name=action]").length &&
+        n.append($("<input>", { type: "hidden", name: "ajax", value: 1 })),
+        0 === n.find("[name=action]").length &&
+          n.append(
+            $("<input>", { type: "hidden", name: "action", value: "update" }),
+          ),
+        promoSubmitBtn.text("CHECKING");
+      promoSubmitBtn.prop("disable", true);
+      $.post(o, n.serialize(), null, "json")
+        .then((n) => {
+          n.hasError
+            ? $(".js-error").show().find(".js-error-text").text(n.errors[0])
+            : prestashop.emit("updateCart", {
+                reason: e.target.dataset,
+                resp: n,
+              });
+          promoSubmitBtn.text("ADD");
+          promoSubmitBtn.prop("disable", false);
+        })
+        .fail((e) => {
+          prestashop.emit("handleError", {
+            eventType: "updateCart",
+            resp: e,
+          });
+          promoSubmitBtn.text("ADD");
+          promoSubmitBtn.prop("disable", false);
+        });
+    });
+});
--- a/_dev/js/selectors.js
+++ b/_dev/js/selectors.js
@ -22,88 +22,89 @@
 * @copyright Since 2007 PrestaShop SA and Contributors
 * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
 */
-import prestashop from 'prestashop';
-import $ from 'jquery';
+import prestashop from "prestashop";
+import $ from "jquery";

 const passwordPolicy = {
-  template: '#password-feedback',
-  hint: '.js-hint-password',
-  container: '.password-strength-feedback',
-  strengthText: '.password-strength-text',
-  requirementScore: '.password-requirements-score',
-  requirementLength: '.password-requirements-length',
-  requirementScoreIcon: '.password-requirements-score i',
-  requirementLengthIcon: '.password-requirements-length i',
-  progressBar: '.progress-bar',
-  inputColumn: '.js-input-column',
+  template: "#password-feedback",
+  hint: ".js-hint-password",
+  container: ".password-strength-feedback",
+  strengthText: ".password-strength-text",
+  requirementScore: ".password-requirements-score",
+  requirementLength: ".password-requirements-length",
+  requirementScoreIcon: ".password-requirements-score i",
+  requirementLengthIcon: ".password-requirements-length i",
+  progressBar: ".progress-bar",
+  inputColumn: ".js-input-column",
 };

 prestashop.themeSelectors = {
  product: {
-    tabs: '.tabs .nav-link',
-    activeNavClass: 'js-product-nav-active',
-    activeTabClass: 'js-product-tab-active',
-    activeTabs: '.tabs .nav-link.active, .js-product-nav-active',
-    imagesModal: '.js-product-images-modal',
-    thumb: '.js-thumb',
-    thumbContainer: '.thumb-container, .js-thumb-container',
-    arrows: '.js-arrows',
-    selected: '.selected, .js-thumb-selected',
-    modalProductCover: '.js-modal-product-cover',
-    cover: '.js-qv-product-cover',
-    customizationModal: '.js-customization-modal',
+    tabs: ".tabs .nav-link",
+    activeNavClass: "js-product-nav-active",
+    activeTabClass: "js-product-tab-active",
+    activeTabs: ".tabs .nav-link.active, .js-product-nav-active",
+    imagesModal: ".js-product-images-modal",
+    thumb: ".js-thumb",
+    thumbContainer: ".thumb-container, .js-thumb-container",
+    arrows: ".js-arrows",
+    selected: ".selected, .js-thumb-selected",
+    modalProductCover: ".js-modal-product-cover",
+    cover: ".js-qv-product-cover",
+    customizationModal: ".js-customization-modal",
  },
  listing: {
-    searchFilterToggler: '#search_filter_toggler, .js-search-toggler',
-    searchFiltersWrapper: '#search_filters_wrapper',
-    searchFilterControls: '#search_filter_controls',
-    searchFilters: '#search_filters',
-    activeSearchFilters: '#js-active-search-filters',
-    listTop: '#js-product-list-top',
-    product: '.js-product',
-    list: '#js-product-list',
-    listBottom: '#js-product-list-bottom',
-    listHeader: '#js-product-list-header',
-    searchFiltersClearAll: '.js-search-filters-clear-all',
-    searchLink: '.js-search-link',
+    searchFilterToggler: "#search_filter_toggler, .js-search-toggler",
+    searchFiltersWrapper: "#search_filters_wrapper",
+    searchFilterControls: "#search_filter_controls",
+    searchFilters: "#search_filters",
+    activeSearchFilters: "#js-active-search-filters",
+    listTop: "#js-product-list-top",
+    product: ".js-product",
+    list: "#js-product-list",
+    listBottom: "#js-product-list-bottom",
+    listHeader: "#js-product-list-header",
+    searchFiltersClearAll: ".js-search-filters-clear-all",
+    searchLink: ".js-search-link",
  },
  order: {
-    returnForm: '#order-return-form, .js-order-return-form',
+    returnForm: "#order-return-form, .js-order-return-form",
  },
-  arrowDown: '.arrow-down, .js-arrow-down',
-  arrowUp: '.arrow-up, .js-arrow-up',
-  clear: '.clear',
-  fileInput: '.js-file-input',
-  contentWrapper: '#content-wrapper, .js-content-wrapper',
-  footer: '#footer, .js-footer',
-  modalContent: '.js-modal-content',
-  modal: '#modal, .js-checkout-modal',
-  touchspin: '.js-touchspin',
+  arrowDown: ".arrow-down, .js-arrow-down",
+  arrowUp: ".arrow-up, .js-arrow-up",
+  clear: ".clear",
+  fileInput: ".js-file-input",
+  contentWrapper: "#content-wrapper, .js-content-wrapper",
+  footer: "#footer, .js-footer",
+  modalContent: ".js-modal-content",
+  modal: "#modal, .js-checkout-modal",
+  touchspin: ".js-touchspin",
  checkout: {
-    termsLink: '.js-terms a',
-    giftCheckbox: '.js-gift-checkbox',
-    imagesLink: '.card-block .cart-summary-products p a, .js-show-details',
-    carrierExtraContent: '.carrier-extra-content, .js-carrier-extra-content',
-    btn: '.checkout a',
+    termsLink: ".js-terms a",
+    giftCheckbox: ".js-gift-checkbox",
+    imagesLink: ".card-block .cart-summary-products p a, .js-show-details",
+    carrierExtraContent: ".carrier-extra-content, .js-carrier-extra-content",
+    btn: ".checkout a",
  },
  cart: {
-    productLineQty: '.js-cart-line-product-quantity',
-    quickview: '.quickview',
-    touchspin: '.bootstrap-touchspin',
-    promoCode: '#promo-code',
-    displayPromo: '.display-promo',
-    promoCodeButton: '.promo-code-button',
-    discountCode: '.js-discount .code',
-    discountName: '[name=discount_name]',
-    actions: '[data-link-action="delete-from-cart"], [data-link-action="remove-voucher"]',
+    productLineQty: ".js-cart-line-product-quantity",
+    quickview: ".quickview",
+    touchspin: ".bootstrap-touchspin",
+    promoCode: "#promo-code",
+    displayPromo: ".display-promo",
+    promoCodeButton: ".promo-code-button",
+    discountCode: ".js-discount .code",
+    discountName: "[name=discount_name]",
+    actions:
+      '[data-link-action="delete-from-cart"], [data-link-action="remove-voucher"]',
  },
  notifications: {
-    dangerAlert: '#notifications article.alert-danger',
-    container: '#notifications .notifications-container',
+    dangerAlert: "#notifications article.alert-danger",
+    container: "#notifications.notifications-container",
  },
  passwordPolicy,
 };

 $(document).ready(() => {
-  prestashop.emit('themeSelectorsInit');
+  prestashop.emit("themeSelectorsInit");
 });
--- a/assets/js/theme.js
+++ b/assets/js/theme.js
--- a/templates/_partials/notifications.tpl
+++ b/templates/_partials/notifications.tpl
@ -22,57 +22,57 @@
 * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
 * International Registered Trademark & Property of PrestaShop SA
 *}
-
-{if isset($notifications)}
-<aside id="notifications">
-  <div class="container">
-    {if $notifications.error}
-      {block name='notifications_error'}
-        <article class="alert alert-danger" role="alert" data-alert="danger">
-          <ul>
-            {foreach $notifications.error as $notif}
-              <li>{$notif nofilter}</li>
-            {/foreach}
-          </ul>
-        </article>
-      {/block}
-    {/if}
-
-    {if $notifications.warning}
-      {block name='notifications_warning'}
-        <article class="alert alert-warning" role="alert" data-alert="warning">
-          <ul>
-            {foreach $notifications.warning as $notif}
-              <li>{$notif nofilter}</li>
-            {/foreach}
-          </ul>
-        </article>
-      {/block}
-    {/if}
-
-    {if $notifications.success}
-      {block name='notifications_success'}
-        <article class="alert alert-success" role="alert" data-alert="success">
-          <ul>
-            {foreach $notifications.success as $notif}
-              <li>{$notif nofilter}</li>
-            {/foreach}
-          </ul>
-        </article>
-      {/block}
-    {/if}
-
-    {if $notifications.info}
-      {block name='notifications_info'}
-        <article class="alert alert-info" role="alert" data-alert="info">
-          <ul>
-            {foreach $notifications.info as $notif}
-              <li>{$notif nofilter}</li>
-            {/foreach}
-          </ul>
-        </article>
-      {/block}
-    {/if}
-  </div>
-</aside>
-{/if}
+ {if isset($notifications)}
+ 
+    <div id="notifications" class="notifications-container container">
+      {if $notifications.error}
+        {block name='notifications_error'}
+          <article class="alert alert-danger" role="alert" data-alert="danger">
+            <ul>
+              {foreach $notifications.error as $notif}
+                <li>{$notif nofilter}</li>
+              {/foreach}
+            </ul>
+          </article>
+        {/block}
+      {/if}
+  
+      {if $notifications.warning}
+        {block name='notifications_warning'}
+          <article class="alert alert-warning " role="alert" data-alert="warning">
+            <ul>
+              {foreach $notifications.warning as $notif}
+                <li>{$notif nofilter}</li>
+              {/foreach}
+            </ul>
+          </article>
+        {/block}
+      {/if}
+  
+      {if $notifications.success}
+        {block name='notifications_success'}
+          <article class="alert alert-success" role="alert" data-alert="success">
+            <ul>
+              {foreach $notifications.success as $notif}
+                <li>{$notif nofilter}</li>
+              {/foreach}
+            </ul>
+          </article>
+        {/block}
+      {/if}
+  
+      {if $notifications.info}
+        {block name='notifications_info'}
+          <article class="alert alert-info" role="alert" data-alert="info">
+            <ul>
+              {foreach $notifications.info as $notif}
+                <li>{$notif nofilter}</li>
+              {/foreach}
+            </ul>
+          </article>
+        {/block}
+      {/if}
+    </div>
+  </aside>
+  {/if}
+  
--- a/templates/checkout/_partials/cart-voucher.tpl
+++ b/templates/checkout/_partials/cart-voucher.tpl
@ -54,7 +54,7 @@
        <div id="promo-code mt-8">
          <div class="promo-code">
            {block name='cart_voucher_form'}
-              <form action="{$urls.pages.cart}" data-link-action="add-voucher" method="post">
+              <form id="promo-code-form" action="{$urls.pages.cart}" data-link-action="add-voucher" method="post">
                <input type="hidden" name="token" value="{$static_token}">
                <input type="hidden" name="addDiscount" value="1">
                <input class="promo-input" type="text" name="discount_name" placeholder="{l s='Promo code' d='Shop.Theme.Checkout'}">
--- a/templates/layouts/layout-both-columns.tpl
+++ b/templates/layouts/layout-both-columns.tpl
@ -60,7 +60,11 @@
    {block name='breadcrumb'}
      {include file='_partials/breadcrumb.tpl'}
    {/block}
-    
+
+     {block name='notifications'}
+      {include file='_partials/notifications.tpl'}
+    {/block}
+ 
    {block name='wrapperTop'}
      {hook h="displayWrapperTop"}
    {/block}
@ -79,15 +83,15 @@
          Start Customization</h2>
          <h3 class="text-lg font-semibold text-center mb-12">Tailored to you, at no extra cost.</h3>
        <div class="flex md:flex-row flex-col gap-8 lg:mb-32 mb-20">
-          <div><a href="https://brooksbingham.com/module/thob/configurator?id_product=74"> <img id=shirtImage
-                class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100"
-                src="https://brooksbingham.com/111-home_default/business-shirt.jpg" alt="business-shirt.jpg" /></a>
+          <div>
+		<a href="https://brooksbingham.com/module/thob/configurator?id_product=74">
+		<img id="shirtImage" class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100" src="https://brooksbingham.com/111-home_default/business-shirt.jpg" alt="business-shirt.jpg" /></a>
            <div class="flex flex-col pt-4 items-start">
              <h3 class="text-center text-lg font-bold">$99.00</h3>
              <h3 class="text-center text-lg font-semibold">Shirts</h3>
            </div>
          </div>
-          <div><a href="https://brooksbingham.com/module/thob/configurator?id_product=75"> <img id=suitImage
+          <div><a href="https://brooksbingham.com/module/thob/configurator?id_product=75"> <img id="suitImage"
                class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100"
                src="https://brooksbingham.com/107-home_default/business-suit.jpg" alt="business-suit.jpg" /></a>
            <div class="flex flex-col pt-4 items-start">
@ -95,7 +99,7 @@
              <h3 class="text-center text-lg font-semibold">Suits</h3>
            </div>
          </div>
-          <div><a href="https://brooksbingham.com/module/thob/configurator?id_product=76"> <img id=sportsjacketImage
+          <div><a href="https://brooksbingham.com/module/thob/configurator?id_product=76"> <img id="sportsjacketImage"
                class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100"
                src="https://brooksbingham.com/108-home_default/sports-jacket.jpg" alt="sports-jacket.jpg" /></a>
            <div class="flex flex-col pt-4 items-start">
@ -103,9 +107,9 @@
              <h3 class="text-center text-lg font-semibold">Sports Jackets</h3>
            </div>
          </div>
-          <div><a href="https://brooksbingham.com/module/thob/configurator?id_product=77"> <img id=tuxImage
-                class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100"
-                src="https://brooksbingham.com/112-home_default/tuxedo.jpg" alt="tuxedo.jpg" /></a>
+          <div><a href="https://brooksbingham.com/module/thob/configurator?id_product=77">
+		<img id="tuxImage" class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100" src="https://brooksbingham.com/112-home_default/tuxedo.jpg" alt="tuxedo.jpg" />
+		</a>
            <div class="flex flex-col pt-4 items-start">
              <h3 class="text-center text-lg font-bold">$995.00</h3>
              <h3 class="text-center text-lg font-semibold">Tuxedos</h3>
@ -116,9 +120,11 @@
      <div class="lg:mb-32 mb-20">
        <h1 class="text-2xl font-bold text-center">Design and Visualize what you need</h1>
        <h3 class="text-lg font-semibold text-center mb-12">Choose what looks good on you</h3>
-        <a href="https://brooksbingham.com/module/thob/configurator?id_product=75"> <img
-            src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/widget-screenshot.png"
-            alt="widget-screenshot.png" /> </a>
+        <a href="https://brooksbingham.com/module/thob/configurator?id_product=75">
+			<video autoplay="autoplay" muted loop width="100%" height="auto">
+				<source src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/homepage/brooksbingham_configurator_demo_video_compressed.mp4" />
+			</video>
+</a>
      </div>
      <div class="text-white grid grid-cols-2 grid-rows-* gap-y-1 gap-x-1 mb-1">
        <div class="row-span-3 col-start-1 row-end-2 relative">
Author	SHA1	Message	Date
jatiny	4e434d72d7	fix:display out of stock notification on cart page	2024-11-26 10:00:37 +00:00
jatin	23daeb6e32	fix: only keep overrider logic for promo code form fixes add to cart sending two requests instead of one	2024-11-26 15:14:58 +05:30
jatiny	6489d8516c	chore: add video on landing page	2024-11-26 06:44:15 +00:00
jatin	69af27c306	Merge remote-tracking branch 'origin/main' into feat/promo-code-loader	2024-11-25 18:00:31 +05:30
jatin	bf315766d7	chore: update js logic for promo-code-form loader	2024-11-25 18:00:14 +05:30
jatin	80f866153c	chore: add id on promo-code-form	2024-11-25 17:59:47 +05:30
apurvab	11879ef4d4	Merge pull request 'refactor: add custom code in layouts instead of text block' (#52 ) from apurvab/theme-elegance:main into main Reviewed-on: brooksbingham/theme-elegance#52	2024-11-25 07:01:52 +00:00