Add cart cookies disabled message

src/locales/de.json

@@ -79,6 +79,7 @@
       "update": "Einkaufswagen aktualisieren",
       "checkout": "Zur Kasse",
       "empty": "Ihr Einkaufswagen ist im Moment leer.",
+      "cookies_required": "Aktivieren Sie Cookies, um den Einkaufswagen benutzen zu können",
       "continue_browsing_html": "Mit der Suche <a href=\"/collections/all\">hier</a> fortfahren.",
       "item_quantity": "Produktmenge",
       "savings": "Sie sparen"

src/locales/en.default.json

@@ -79,6 +79,7 @@
       "update": "Update Cart",
       "checkout": "Check Out",
       "empty": "Your cart is currently empty.",
+      "cookies_required": "Enable cookies to use the shopping cart",
       "continue_browsing_html": "Continue browsing <a href=\"/collections/all\">here</a>.",
       "item_quantity": "Item quantity",
       "savings": "You're saving"

src/locales/es.json

@@ -79,6 +79,7 @@
       "update": "Actualizar carrito",
       "checkout": "Finalizar pedido",
       "empty": "Su carrito actualmente está vacío.",
+      "cookies_required": "Habilite las cookies para usar el carrito de compras",
       "continue_browsing_html": "Continúe explorando <a href=\"/collections/all\">aquí</a>.",
       "item_quantity": "Cantidad de artículo",
       "savings": "Está ahorrando"

src/locales/fr.json

@@ -79,6 +79,7 @@
       "update": "Mettre à jour",
       "checkout": "Procéder au paiement",
       "empty": "Votre panier est vide.",
+      "cookies_required": "Activer les cookies pour utiliser le panier",
       "continue_browsing_html": "<a href=\"/collections/all\">Retourner au magasinage</a>.",
       "item_quantity": "Quantité de l'article",
       "savings": "Vous économisez"

src/locales/pt-BR.json

@@ -79,6 +79,7 @@
       "update": "Atualizar Carrinho",
       "checkout": "Fechar pedido",
       "empty": "Seu carrinho está vazio no momento.",
+      "cookies_required": "Habilite os cookies para usar o carrinho de compras",
       "continue_browsing_html": "Continue navegando <a href=\"/collections/all\">aqui</a>.",
       "item_quantity": "Quantidade de itens",
       "savings": "Você está economizando"

src/locales/pt-PT.json

@@ -79,6 +79,7 @@
       "update": "Atualizar Carrinho de Compras",
       "checkout": "Check-Out",
       "empty": "O seu carrinho de compras está neste momento vazio.",
+      "cookies_required": "Ative cookies para poder usar o carrinho de compras",
       "continue_browsing_html": "Continue a ver <a href=\"/collections/all\">aqui</a>.",
       "item_quantity": "Quantidade de itens",
       "savings": "Está a poupar"

src/scripts/slate/cart.js

@@ -0,0 +1,34 @@
+/**
+ * Cart Template Script
+ * ------------------------------------------------------------------------------
+ * A file that contains scripts highly couple code to the Cart template.
+ *
+ * @namespace cart
+ */
+
+slate.cart = {
+
+  selectors: {
+    cartEmpty: '.cart--empty',
+    cartNoCookies: 'cart--no-cookies'
+  },
+
+  checkCookies: function() {
+    if (!this.cookiesEnabled()) {
+      $(this.selectors.cartEmpty).addClass(this.selectors.cartNoCookies);
+    }
+  },
+
+  /**
+   * Check if cookies are enabled in the browser
+   */
+  cookiesEnabled: function() {
+    var cookieEnabled = navigator.cookieEnabled;
+
+    if (!cookieEnabled){
+      document.cookie = 'testcookie';
+      cookieEnabled = (document.cookie.indexOf('testcookie') !== -1);
+    }
+    return cookieEnabled;
+  }
+};

src/scripts/theme.js

@@ -3,6 +3,7 @@ window.theme = window.theme || {};
 
 /*================ Slate ================*/
 // =require slate/a11y.js
+// =require slate/cart.js
 // =require slate/utils.js
 // =require slate/rte.js
 // =require slate/sections.js
@@ -31,4 +32,7 @@ $(document).ready(function() {
   // Wrap videos in div to force responsive layout.
   slate.rte.wrapTable();
   slate.rte.iframeReset();
+
+  // Add a message to the cart if cookies are disabled.
+  slate.cart.checkCookies();
 });

src/styles/modules/cart.scss

@@ -0,0 +1,20 @@
+/*================ Cart Template ================*/
+.cart__empty {
+  display: none;
+
+  .cart--empty & {
+    display: block;
+  }
+
+  .cart--no-cookies & {
+    display: none;
+  }
+}
+
+.cart__no-cookies {
+  display: none;
+
+  .cart--no-cookies & {
+    display: block;
+  }
+}

src/styles/theme.scss

@@ -23,5 +23,6 @@
 @import url('global/blank-states.scss');
 
 /*================ MODULES ================*/
+@import url('modules/cart.scss');
 @import url('modules/site-header.scss');
 @import url('modules/gift-card-template.scss');

src/templates/cart.liquid

@@ -101,7 +101,22 @@
     <input type="submit" name="checkout" class="btn" value="{{ 'cart.general.checkout' | t }}">
   </form>
 {% else %}
-  <h1>{{ 'cart.general.title' | t }}</h1>
-  <p>{{ 'cart.general.empty' | t }}</p>
-  <p>{{ 'cart.general.continue_browsing_html' | t }}</p>
+  <div class="cart--empty">
+    <h1>{{ 'cart.general.title' | t }}</h1>
+
+    {% comment %}
+    Cart no cookies state
+    {% endcomment %}
+    <div class="cart__no-cookies">
+      <p>{{ 'cart.general.cookies_required' | t }}</p>
+    </div>
+
+    {% comment %}
+    Cart Empty State
+    {% endcomment %}
+    <div class="cart__empty">
+      <p>{{ 'cart.general.empty' | t }}</p>
+      <p>{{ 'cart.general.continue_browsing_html' | t }}</p>
+    </div>
+  </div>
 {% endif %}