sidebar updates

config/app.php

@@ -247,7 +247,6 @@ return [
         Webkul\API\Providers\APIServiceProvider::class,
         Webkul\Discount\Providers\DiscountServiceProvider::class,
         Webkul\CMS\Providers\CMSServiceProvider::class,
-        // Velocity provider
         Webkul\Velocity\Providers\VelocityServiceProvider::class
     ],
 

packages/Webkul/Velocity/publishable/assets/css/velocity.css

@@ -1691,6 +1691,28 @@
   padding: 10px;
 }
 
+.search-result-status {
+  width: 100%;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+}
+
+.slides-container {
+  top: -70px;
+  position: relative;
+}
+
 /* @author Shubham Mehrotra */
 body {
   overflow-x: hidden;
@@ -2114,6 +2136,10 @@ header #search-form > *:focus {
   display: inline-block;
 }
 
+.categories-sidebar-container > .row.disabled {
+  cursor: not-allowed;
+}
+
 .categories-sidebar-container .main-category {
   border-bottom: 1px solid #CCCCCC;
 }

packages/Webkul/Velocity/publishable/assets/js/velocity.js

@@ -1119,12 +1119,14 @@ $(document).ready(function () {
                 var rightBarContainer = document.getElementById('home-right-bar-container');
                 var categoryListContainer = document.getElementById('sidebar');
 
-                categoryListContainer.classList.toggle('hide');
+                if (categoryListContainer) {
+                    categoryListContainer.classList.toggle('hide');
 
-                if (rightBarContainer.className.search('col-10') > -1) {
+                    if (rightBarContainer.className.search('col-10') > -1) {
-                    rightBarContainer.className = rightBarContainer.className.replace('col-10', 'col-12');
+                        rightBarContainer.className = rightBarContainer.className.replace('col-10', 'col-12');
-                } else {
+                    } else {
-                    rightBarContainer.className = rightBarContainer.className.replace('col-12', 'col-10');
+                        rightBarContainer.className = rightBarContainer.className.replace('col-12', 'col-10');
+                    }
                 }
             },
 
@@ -1268,7 +1270,7 @@ if (false) {
 
 "use strict";
 /* WEBPACK VAR INJECTION */(function(global, setImmediate) {/*!
- * Vue.js v2.6.10
+ * Vue.js v2.6.11
  * (c) 2014-2019 Evan You
  * Released under the MIT License.
  */
@@ -3234,7 +3236,7 @@ if (typeof Promise !== 'undefined' && isNative(Promise)) {
   isUsingMicroTask = true;
 } else if (typeof setImmediate !== 'undefined' && isNative(setImmediate)) {
   // Fallback to setImmediate.
-  // Techinically it leverages the (macro) task queue,
+  // Technically it leverages the (macro) task queue,
   // but it is still a better choice than setTimeout.
   timerFunc = function () {
     setImmediate(flushCallbacks);
@@ -3323,7 +3325,7 @@ var initProxy;
     warn(
       "Property \"" + key + "\" must be accessed with \"$data." + key + "\" because " +
       'properties starting with "$" or "_" are not proxied in the Vue instance to ' +
-      'prevent conflicts with Vue internals' +
+      'prevent conflicts with Vue internals. ' +
       'See: https://vuejs.org/v2/api/#data',
       target
     );
@@ -4183,7 +4185,7 @@ function bindDynamicKeys (baseObj, values) {
     if (typeof key === 'string' && key) {
       baseObj[values[i]] = values[i + 1];
     } else if (key !== '' && key !== null) {
-      // null is a speical value for explicitly removing a binding
+      // null is a special value for explicitly removing a binding
       warn(
         ("Invalid value for dynamic directive argument (expected string or null): " + key),
         this
@@ -4678,6 +4680,12 @@ function _createElement (
     ns = (context.$vnode && context.$vnode.ns) || config.getTagNamespace(tag);
     if (config.isReservedTag(tag)) {
       // platform built-in elements
+      if (isDef(data) && isDef(data.nativeOn)) {
+        warn(
+          ("The .native modifier for v-on is only valid on components but it was used on <" + tag + ">."),
+          context
+        );
+      }
       vnode = new VNode(
         config.parsePlatformTagName(tag), data, children,
         undefined, undefined, context
@@ -4803,7 +4811,7 @@ function renderMixin (Vue) {
     // render self
     var vnode;
     try {
-      // There's no need to maintain a stack becaues all render fns are called
+      // There's no need to maintain a stack because all render fns are called
       // separately from one another. Nested component's render fns are called
       // when parent component is patched.
       currentRenderingInstance = vm;
@@ -6702,7 +6710,7 @@ Object.defineProperty(Vue, 'FunctionalRenderContext', {
   value: FunctionalRenderContext
 });
 
-Vue.version = '2.6.10';
+Vue.version = '2.6.11';
 
 /*  */
 
@@ -7375,7 +7383,7 @@ function createPatchFunction (backend) {
     }
   }
 
-  function removeVnodes (parentElm, vnodes, startIdx, endIdx) {
+  function removeVnodes (vnodes, startIdx, endIdx) {
     for (; startIdx <= endIdx; ++startIdx) {
       var ch = vnodes[startIdx];
       if (isDef(ch)) {
@@ -7486,7 +7494,7 @@ function createPatchFunction (backend) {
       refElm = isUndef(newCh[newEndIdx + 1]) ? null : newCh[newEndIdx + 1].elm;
       addVnodes(parentElm, refElm, newCh, newStartIdx, newEndIdx, insertedVnodeQueue);
     } else if (newStartIdx > newEndIdx) {
-      removeVnodes(parentElm, oldCh, oldStartIdx, oldEndIdx);
+      removeVnodes(oldCh, oldStartIdx, oldEndIdx);
     }
   }
 
@@ -7578,7 +7586,7 @@ function createPatchFunction (backend) {
         if (isDef(oldVnode.text)) { nodeOps.setTextContent(elm, ''); }
         addVnodes(elm, null, ch, 0, ch.length - 1, insertedVnodeQueue);
       } else if (isDef(oldCh)) {
-        removeVnodes(elm, oldCh, 0, oldCh.length - 1);
+        removeVnodes(oldCh, 0, oldCh.length - 1);
       } else if (isDef(oldVnode.text)) {
         nodeOps.setTextContent(elm, '');
       }
@@ -7807,7 +7815,7 @@ function createPatchFunction (backend) {
 
         // destroy old node
         if (isDef(parentElm)) {
-          removeVnodes(parentElm, [oldVnode], 0, 0);
+          removeVnodes([oldVnode], 0, 0);
         } else if (isDef(oldVnode.tag)) {
           invokeDestroyHook(oldVnode);
         }
@@ -10513,7 +10521,7 @@ var startTagOpen = new RegExp(("^<" + qnameCapture));
 var startTagClose = /^\s*(\/?)>/;
 var endTag = new RegExp(("^<\\/" + qnameCapture + "[^>]*>"));
 var doctype = /^<!DOCTYPE [^>]+>/i;
-// #7298: escape - to avoid being pased as HTML comment when inlined in page
+// #7298: escape - to avoid being passed as HTML comment when inlined in page
 var comment = /^<!\--/;
 var conditionalComment = /^<!\[/;
 
@@ -10798,7 +10806,7 @@ function parseHTML (html, options) {
 /*  */
 
 var onRE = /^@|^v-on:/;
-var dirRE = /^v-|^@|^:/;
+var dirRE = /^v-|^@|^:|^#/;
 var forAliasRE = /([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/;
 var forIteratorRE = /,([^,\}\]]*)(?:,([^,\}\]]*))?$/;
 var stripParensRE = /^\(|\)$/g;
@@ -11422,7 +11430,7 @@ function processSlotContent (el) {
           if (el.parent && !maybeComponent(el.parent)) {
             warn$2(
               "<template v-slot> can only appear at the root level inside " +
-              "the receiving the component",
+              "the receiving component",
               el
             );
           }
@@ -11985,7 +11993,7 @@ function isDirectChildOfTemplateFor (node) {
 
 /*  */
 
-var fnExpRE = /^([\w$_]+|\([^)]*?\))\s*=>|^function\s*(?:[\w$]+)?\s*\(/;
+var fnExpRE = /^([\w$_]+|\([^)]*?\))\s*=>|^function(?:\s+[\w$]+)?\s*\(/;
 var fnInvokeRE = /\([^)]*?\);*$/;
 var simplePathRE = /^[A-Za-z_$][\w$]*(?:\.[A-Za-z_$][\w$]*|\['[^']*?']|\["[^"]*?"]|\[\d+]|\[[A-Za-z_$][\w$]*])*$/;
 
@@ -12754,6 +12762,8 @@ function checkNode (node, warn) {
           var range = node.rawAttrsMap[name];
           if (name === 'v-for') {
             checkFor(node, ("v-for=\"" + value + "\""), warn, range);
+          } else if (name === 'v-slot' || name[0] === '#') {
+            checkFunctionParameterExpression(value, (name + "=\"" + value + "\""), warn, range);
           } else if (onRE.test(name)) {
             checkEvent(value, (name + "=\"" + value + "\""), warn, range);
           } else {
@@ -12773,9 +12783,9 @@ function checkNode (node, warn) {
 }
 
 function checkEvent (exp, text, warn, range) {
-  var stipped = exp.replace(stripStringRE, '');
+  var stripped = exp.replace(stripStringRE, '');
-  var keywordMatch = stipped.match(unaryOperatorsRE);
+  var keywordMatch = stripped.match(unaryOperatorsRE);
-  if (keywordMatch && stipped.charAt(keywordMatch.index - 1) !== '$') {
+  if (keywordMatch && stripped.charAt(keywordMatch.index - 1) !== '$') {
     warn(
       "avoid using JavaScript unary operator as property name: " +
       "\"" + (keywordMatch[0]) + "\" in expression " + (text.trim()),
@@ -12830,6 +12840,19 @@ function checkExpression (exp, text, warn, range) {
   }
 }
 
+function checkFunctionParameterExpression (exp, text, warn, range) {
+  try {
+    new Function(exp, '');
+  } catch (e) {
+    warn(
+      "invalid function parameter expression: " + (e.message) + " in\n\n" +
+      "    " + exp + "\n\n" +
+      "  Raw expression: " + (text.trim()) + "\n",
+      range
+    );
+  }
+}
+
 /*  */
 
 var range = 2;
@@ -35152,7 +35175,6 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
     props: ['id', 'isOpen'],
 
     data: function data() {
-        debugger;
         return {};
     },
 
@@ -35562,6 +35584,7 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
 //
 //
 //
+//
 
 /* harmony default export */ __webpack_exports__["default"] = ({
     props: ['categories', 'url', 'addClass', 'mainSidebar'],
@@ -35614,76 +35637,81 @@ var render = function() {
   var _vm = this
   var _h = _vm.$createElement
   var _c = _vm._self._c || _h
-  return _c(
+  return _vm.categories && _vm.categories.length > 0
-    "nav",
+    ? _c(
-    {
+        "nav",
-      class: "" + (_vm.addClass ? _vm.addClass : ""),
+        {
-      attrs: { id: "sidebar" }
+          class: "" + (_vm.addClass ? _vm.addClass : ""),
-    },
+          attrs: { id: "sidebar" }
-    [
+        },
-      _c(
+        [
-        "ul",
+          _c(
-        { attrs: { type: "none" } },
+            "ul",
-        _vm._l(_vm.categories, function(category, index) {
+            { attrs: { type: "none" } },
-          return _c(
+            _vm._l(_vm.categories, function(category, index) {
-            "li",
+              return _c(
-            { key: index, attrs: { id: "category-" + category.id } },
+                "li",
-            [
+                { key: index, attrs: { id: "category-" + category.id } },
-              _c(
-                "a",
-                {
-                  staticClass: "category unset",
-                  class: category.children.length > 0 ? "fw6" : "",
-                  attrs: {
-                    href:
-                      _vm.url +
-                      "/categories/" +
-                      category["translations"][0].slug
-                  },
-                  on: {
-                    mouseover: function($event) {
-                      return _vm.hover(index, "mouseover")
-                    },
-                    mouseleave: function($event) {
-                      return _vm.hover(index, "mouseleave")
-                    }
-                  }
-                },
                 [
-                  _c("span", [_vm._v(_vm._s(category["name"]))]),
+                  _c(
-                  _vm._v(" "),
+                    "a",
-                  category.children.length > 0
+                    {
-                    ? _c("i", {
+                      staticClass: "category unset",
-                        staticClass: "angle-right-icon text-down-3",
+                      class: category.children.length > 0 ? "fw6" : "",
-                        on: {
+                      attrs: {
-                          click: function($event) {
+                        href:
-                            return _vm.toggleSubCategory(index)
+                          _vm.url +
-                          }
+                          "/categories/" +
+                          category["translations"][0].slug
+                      },
+                      on: {
+                        mouseover: function($event) {
+                          return _vm.hover(index, "mouseover")
+                        },
+                        mouseleave: function($event) {
+                          return _vm.hover(index, "mouseleave")
                         }
-                      })
+                      }
+                    },
+                    [
+                      _c("span", [_vm._v(_vm._s(category["name"]))]),
+                      _vm._v(" "),
+                      category.children.length > 0
+                        ? _c("i", {
+                            staticClass: "angle-right-icon text-down-3",
+                            on: {
+                              click: function($event) {
+                                return _vm.toggleSubCategory(index)
+                              }
+                            }
+                          })
+                        : _vm._e()
+                    ]
+                  ),
+                  _vm._v(" "),
+                  category.children.length && category.children.length > 0
+                    ? _c(
+                        "div",
+                        { staticClass: "sub-categories" },
+                        [
+                          _c("sidebar-component", {
+                            attrs: {
+                              url: _vm.url,
+                              categories: category.children
+                            }
+                          })
+                        ],
+                        1
+                      )
                     : _vm._e()
                 ]
-              ),
+              )
-              _vm._v(" "),
+            }),
-              category.children.length && category.children.length > 0
+            0
-                ? _c(
-                    "div",
-                    { staticClass: "sub-categories" },
-                    [
-                      _c("sidebar-component", {
-                        attrs: { url: _vm.url, categories: category.children }
-                      })
-                    ],
-                    1
-                  )
-                : _vm._e()
-            ]
           )
-        }),
+        ]
-        0
       )
-    ]
+    : _vm._e()
-  )
 }
 var staticRenderFns = []
 render._withStripped = true
@@ -36679,24 +36707,10 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
 //
 //
 //
+//
 
 /* harmony default export */ __webpack_exports__["default"] = ({
-    props: ['heading', 'headerContent'],
+    props: ['heading', 'headerContent', 'isEnabled']
-
-    methods: {
-        // toggleSidebar: function (event) {
-        //     let rightBarContainer = document.getElementById('home-right-bar-container');
-        //     let categoryListContainer = document.getElementById('sidebar');
-
-        //     categoryListContainer.classList.toggle('hide');
-
-        //     if (rightBarContainer.className.search('col-10') > -1) {
-        //         rightBarContainer.className = rightBarContainer.className.replace('col-10', 'col-12');
-        //     } else {
-        //         rightBarContainer.className = rightBarContainer.className.replace('col-12', 'col-10');
-        //     }
-        // }
-    }
 });
 
 /***/ }),
@@ -36707,43 +36721,50 @@ var render = function() {
   var _vm = this
   var _h = _vm.$createElement
   var _c = _vm._self._c || _h
-  return _c("div", { staticClass: "row" }, [
+  return _c(
-    _c("div", { staticClass: "main-category fs20 pt10 col-2 pl30" }, [
+    "div",
-      _c("i", {
+    { class: "row " + (_vm.isEnabled == "0" ? "disabled" : "") },
-        staticClass: "rango-view-list cursor-pointer align-vertical-top",
+    [
-        on: { click: _vm.toggleSidebar }
+      _c("div", { staticClass: "main-category fs20 pt10 col-2 pl30" }, [
-      }),
+        _c("i", {
-      _vm._v(" "),
+          class:
-      _c("span", {
+            "rango-view-list " +
-        staticClass: "text-up",
+            (_vm.isEnabled == "0" ? "" : "cursor-pointer") +
-        domProps: { textContent: _vm._s(_vm.heading) }
+            " align-vertical-top",
-      })
+          on: { click: _vm.toggleSidebar }
-    ]),
-    _vm._v(" "),
-    _c("div", { staticClass: "content-list row no-margin col-10" }, [
-      _c(
-        "ul",
-        { staticClass: "no-margin", attrs: { type: "none" } },
-        _vm._l(_vm.headerContent, function(content, index) {
-          return _c("li", { key: index }, [
-            content["content_type"] == "link"
-              ? _c("a", {
-                  attrs: {
-                    href: "content['page_link']",
-                    target: content["link_target"] ? "_blank" : "_self"
-                  },
-                  domProps: { textContent: _vm._s(content.title) }
-                })
-              : _c("a", {
-                  attrs: { href: "#" },
-                  domProps: { textContent: _vm._s(content.title) }
-                })
-          ])
         }),
-        0
+        _vm._v(" "),
-      )
+        _c("span", {
-    ])
+          staticClass: "text-up",
-  ])
+          domProps: { textContent: _vm._s(_vm.heading) }
+        })
+      ]),
+      _vm._v(" "),
+      _c("div", { staticClass: "content-list row no-margin col-10" }, [
+        _c(
+          "ul",
+          { staticClass: "no-margin", attrs: { type: "none" } },
+          _vm._l(_vm.headerContent, function(content, index) {
+            return _c("li", { key: index }, [
+              content["content_type"] == "link"
+                ? _c("a", {
+                    attrs: {
+                      href: "content['page_link']",
+                      target: content["link_target"] ? "_blank" : "_self"
+                    },
+                    domProps: { textContent: _vm._s(content.title) }
+                  })
+                : _c("a", {
+                    attrs: { href: "#" },
+                    domProps: { textContent: _vm._s(content.title) }
+                  })
+            ])
+          }),
+          0
+        )
+      ])
+    ]
+  )
 }
 var staticRenderFns = []
 render._withStripped = true

packages/Webkul/Velocity/src/Resources/assets/js/UI/components/content-header.vue

@@ -1,7 +1,8 @@
 <template>
-    <div class="row">
+    <div :class="`row ${isEnabled == '0' ? 'disabled' : ''}`">
-        <div class="main-category fs20 pt10 col-2 pl30">
+        <div
-            <i class="rango-view-list cursor-pointer align-vertical-top" @click="toggleSidebar"></i>
+            class="main-category fs20 pt10 col-2 pl30">
+            <i :class="`rango-view-list ${isEnabled == '0' ? '' : 'cursor-pointer'} align-vertical-top`" @click="toggleSidebar"></i>
             <span class="text-up" v-text="heading"></span>
         </div>
 
@@ -24,21 +25,6 @@
 
 <script type="text/javascript">
     export default {
-        props: ['heading', 'headerContent'],
+        props: ['heading', 'headerContent', 'isEnabled'],
-
-        methods: {
-            // toggleSidebar: function (event) {
-            //     let rightBarContainer = document.getElementById('home-right-bar-container');
-            //     let categoryListContainer = document.getElementById('sidebar');
-
-            //     categoryListContainer.classList.toggle('hide');
-
-            //     if (rightBarContainer.className.search('col-10') > -1) {
-            //         rightBarContainer.className = rightBarContainer.className.replace('col-10', 'col-12');
-            //     } else {
-            //         rightBarContainer.className = rightBarContainer.className.replace('col-12', 'col-10');
-            //     }
-            // }
-        }
     }
 </script>

packages/Webkul/Velocity/src/Resources/assets/js/UI/components/sidebar.vue

@@ -2,7 +2,8 @@
     <!-- categories list -->
     <nav
         :class="`${addClass ? addClass : ''}`"
-        id="sidebar">
+        id="sidebar"
+        v-if="categories && categories.length > 0">
 
         <ul type="none">
             <li

packages/Webkul/Velocity/src/Resources/assets/js/app.js

@@ -42,12 +42,14 @@ $(document).ready(function () {
                 let rightBarContainer = document.getElementById('home-right-bar-container');
                 let categoryListContainer = document.getElementById('sidebar');
 
-                categoryListContainer.classList.toggle('hide');
+                if (categoryListContainer) {
+                    categoryListContainer.classList.toggle('hide');
 
-                if (rightBarContainer.className.search('col-10') > -1) {
+                    if (rightBarContainer.className.search('col-10') > -1) {
-                    rightBarContainer.className = rightBarContainer.className.replace('col-10', 'col-12');
+                        rightBarContainer.className = rightBarContainer.className.replace('col-10', 'col-12');
-                } else {
+                    } else {
-                    rightBarContainer.className = rightBarContainer.className.replace('col-12', 'col-10');
+                        rightBarContainer.className = rightBarContainer.className.replace('col-12', 'col-10');
+                    }
                 }
             },
 

packages/Webkul/Velocity/src/Resources/assets/sass/components/app.scss

@@ -986,10 +986,17 @@
     .badge {
         padding: 10px;
     }
+}
+
 .search-result-status {
     width: 100%;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
+}
+
+.slides-container {
+    top: -70px;
+    position: relative;
 }

packages/Webkul/Velocity/src/Resources/assets/sass/components/home.scss

@@ -486,6 +486,12 @@ header #search-form > *:focus {
     margin-bottom: 60px;
     display: inline-block;
 
+    > .row {
+        &.disabled {
+            cursor: not-allowed;
+        }
+    }
+
     .main-category {
         border-bottom: 1px solid $border-common;
     }

packages/Webkul/Velocity/src/Resources/views/home/index.blade.php

@@ -39,18 +39,11 @@
     @endif
 @endsection
 
-@section('content-wrapper')
-    @parent
-
-    <img class="col-12 no-padding banner-icon" src="{{ asset('themes/velocity/assets/images/banner.png') }}"></div>
-
-@endsection
-
 @section('full-content-wrapper')
 
     {!! view_render_event('bagisto.shop.home.content.before') !!}
 
-    {!! DbView::make($channel)->field('home_page_content')->with(['sliderData' => $sliderData])->render() !!}
+    {!! DbView::make($channel)->field('home_page_content')->with(['sliderData' => []])->render() !!}
 
     {{ view_render_event('bagisto.shop.home.content.after') }}
 

packages/Webkul/Velocity/src/Resources/views/home/slider.blade.php

@@ -1,3 +1,27 @@
-{{-- <section class="slider-block">
+<div class="slides-container">
-    <image-slider :slides='@json($sliderData)' public_path="{{ url()->to('/') }}"></image-slider>
+    <carousel-component
-</section> --}}
+        :slides-count="{{ ! empty($sliderData) ? sizeof($sliderData) : 1 }}"
+        slides-per-page="1"
+        navigation-enabled="hide"
+        pagination-enabled="hide">
+
+        @if (! empty($sliderData))
+            @foreach ($sliderData as $index => $slider)
+
+                <slide slot="slide-{{ $index }}">
+                    <img
+                        class="col-12 no-padding banner-icon"
+                        src="{{ url()->to('/') . '/storage/' . $slider['path'] }}" />
+                </slide>
+
+            @endforeach
+        @else
+            <slide slot="slide-0">
+                <img
+                    class="col-12 no-padding banner-icon"
+                    src="{{ asset('themes/velocity/assets/images/banner.png') }}" />
+            </slide>
+        @endif
+
+    </carousel-component>
+</div>

packages/Webkul/Velocity/src/Resources/views/layouts/master.blade.php

@@ -74,6 +74,7 @@
                             :header-content="{{ json_encode(
                                 app('Webkul\Velocity\Repositories\ContentRepository')->getAllContents()
                             ) }}"
+                            is-enabled="{{ sizeof($categories) }}"
                         ></content-header>
 
                         <div class="container">