LH improvements

CHANGELOG.md

@@ -77,7 +77,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ## [1.3.0] - 2018.08.31
 
 ### Added
-- TypeScript support - please check [TypeScript Action Plan](https://github.com/DivanteLtd/vue-storefront/blob/master/doc/TypeScript%20Action%20Plan.md) for details
+- TypeScript support - please check [TypeScript Action Plan](https://github.com/DivanteLtd/vue-storefront/blob/master/docs/guide/basics/typescript.md) for details
 - New `core/modules` added regarding the [Refactor to modules plan](https://github.com/DivanteLtd/vue-storefront/blob/master/doc/api-modules/refactoring-to-modules.md)
 - Price tier's support #1625
 - Qty field on product page #1617

core/i18n/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue-storefront/i18n",
-  "version": "1.4.1",
+  "version": "1.6.0",
   "description": "Vue Storefront i18n",
   "license": "MIT",
   "main": "index.ts",

core/lib/passive-listeners.js

@@ -0,0 +1,59 @@
+const eventListenerOptionsSupported = () => {
+  let supported = false
+
+  try {
+    const opts = Object.defineProperty({}, 'passive', {
+      get () {
+        supported = true
+      }
+    })
+
+    window.addEventListener('test', null, opts)
+    window.removeEventListener('test', null, opts)
+  } catch (e) {}
+
+  return supported
+}
+
+const defaultOptions = {
+  passive: true,
+  capture: false
+}
+const supportedPassiveTypes = [
+  'scroll', 'wheel',
+  'touchstart', 'touchmove', 'touchenter', 'touchend', 'touchleave',
+  'mouseout', 'mouseleave', 'mouseup', 'mousedown', 'mousemove', 'mouseenter', 'mousewheel', 'mouseover'
+]
+const getDefaultPassiveOption = (passive, eventName) => {
+  if (passive !== undefined) return passive
+
+  return supportedPassiveTypes.indexOf(eventName) === -1 ? false : defaultOptions.passive
+}
+
+const getWritableOptions = (options) => {
+  const passiveDescriptor = Object.getOwnPropertyDescriptor(options, 'passive')
+
+  return passiveDescriptor && passiveDescriptor.writable !== true && passiveDescriptor.set === undefined ? Object.assign({}, options) : options
+}
+
+const overwriteAddEvent = (superMethod) => {
+  EventTarget.prototype.addEventListener = function (type, listener, options) {
+    const usesListenerOptions = typeof options === 'object' && options !== null
+    const useCapture = usesListenerOptions ? options.capture : options
+
+    options = usesListenerOptions ? getWritableOptions(options) : {}
+    options.passive = getDefaultPassiveOption(options.passive, type)
+    options.capture = useCapture === undefined ? defaultOptions.capture : useCapture
+
+    superMethod.call(this, type, listener, options)
+  }
+
+  EventTarget.prototype.addEventListener._original = superMethod
+}
+
+const supportsPassive = eventListenerOptionsSupported()
+
+if (supportsPassive) {
+  const addEvent = EventTarget.prototype.addEventListener
+  overwriteAddEvent(addEvent)
+}

core/mixins/thumbnail.js

@@ -12,14 +12,18 @@ export const thumbnail = {
       if (store.state.config.images.useExactUrlsNoProxy) {
         return relativeUrl // this is exact url mode
       } else {
+        let resultUrl
         if (relativeUrl && (relativeUrl.indexOf('://') > 0 || relativeUrl.indexOf('?') > 0 || relativeUrl.indexOf('&') > 0)) relativeUrl = encodeURIComponent(relativeUrl)
         let baseUrl = store.state.config.images.baseUrl
         if (baseUrl.indexOf('{{') >= 0) {
           baseUrl = baseUrl.replace('{{url}}', relativeUrl)
           baseUrl = baseUrl.replace('{{width}}', width)
           baseUrl = baseUrl.replace('{{height}}', height)
+          resultUrl = baseUrl
+        } else {
+          resultUrl = `${baseUrl}${parseInt(width)}/${parseInt(height)}/resize${relativeUrl}`
         }
-        return relativeUrl && relativeUrl.indexOf('no_selection') < 0 ? `${baseUrl}${parseInt(width)}/${parseInt(height)}/resize${relativeUrl}` : store.state.config.images.productPlaceholder || ''
+        return relativeUrl && relativeUrl.indexOf('no_selection') < 0 ? resultUrl : store.state.config.images.productPlaceholder || ''
       }
     }
   }

core/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@vue-storefront/core",
-  "version": "1.4.6",
+  "version": "1.6.0",
   "description": "Vue Storefront Core",
   "license": "MIT",
   "main": "app.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "dependencies": {
-    "@vue-storefront/store": "^1.4.3",
+    "@vue-storefront/store": "^1.6.0",
     "bodybuilder": "2.2.13",
     "config": "^1.30.0",
     "express": "^4.14.0",

core/pages/Category.js

@@ -139,7 +139,7 @@ export default {
     if (!Vue.prototype.$isServer && this.lazyLoadProductsOnscroll) {
       window.addEventListener('scroll', () => {
         this.bottom = this.bottomVisible()
-      })
+      }, {passive: true})
     }
   },
   beforeDestroy () {

core/store/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue-storefront/store",
-  "version": "1.4.3",
+  "version": "1.6.0",
   "description": "Vue Storefront core data store",
   "license": "MIT",
   "main": "index.js",

docs/guide/basics/project-structure.md

@@ -11,28 +11,27 @@ Below you can find the Vue Storefront project structure with explanations and co
 - `config` - Config files for vue storefront. They're used to define backend addresses, current theme etc.
   - `default.json` - Default config template which should never be changed. If you want to make some changes in config create `local.json` file in the same folder, copy the content and make changes here. Default `config.json` will be overwritten by `local.json` for your setup.
   - `local.json` (optional) - your custom Vue Storefront config. You can find a detailed description of all config file properties in the [Vue Storefront configuration chapter](configuration.md).
-- `docs` - Project documentation
 - `core` - Vue Storefront core
   :::warning
   Don't modify `core` directory on your project if you want to receive core updates
   :::
 
-  - `assets` - Global assets used in project like logo, app icons, placeholders and `manifest.json`, eventually will be removed and moved to themes. You can place your theme-specific assets in `{themeroot}/assets`
+
   - `build` - It contains `config.json` generated from files in `/config` folder and webpack build. It's made from vue-cli webpack template. You can extend core webpack build in `{themeroot}/webpack.config.js` (related: [Working with Webpack](../core-themes/webpack.md)).
-  - `components` Vue Storefront core components (related: [Working with core components](../core-themes/core-components.md))
-  - `filters` - Global Vue filters for the project. You can add your own filters in `{themeroot}/filters`
-  - `helpers` - Global methods for the project.
-  - `lib` - Core libraries allowing functionalities like theme support, extensions or filters
-  - `mixins` - Global mixins for the project. You can add your own mixins in `{themeroot}/mixins`
-  - `models` - Data models for things like orders or notifications, eventually will be moved to documentation
-  - `pages` - Vue Storefront core pages (related: [Working with core components](../core-themes/core-components.md))
-  - `plugins` - Core plugins (related: [Working with plugins](../core-themes/plugins.md))
-  - `resource` - Data mocks used to develop new features
-  - `router` - Core Vue Router setup. The definition of routes happens in `{themeroot}/index.js`
-  - `scripts` - Core scripts like app installer, extension installer etc.
+  - `compatibility` - API port for old components after 1.6 release. Don't use it in new projects
+  - `filters` - Core Vue filters
+  - `helpers` - Global helpers 
+  - `lib` - Core libraries allowing functionalities like theme support, modules etc
+  - `mixins` - Core Vue mixins 
+  - `modules` - core VSModules. Read more about modules [here](https://divanteltd.github.io/vue-storefront/guide/modules/introduction.html)
+  - `pages` - Vue Storefront core pages 
+  - `plugins` - Core Vue plugins 
+  - `scripts` - scripts like installer
   - `service-worker` - Core service worker. It's merged with `sw-precache` data from `build` and `{theme}/service-worker-ext.js`
-  - `store` - Core Vuex stores (related: [Working with Vuex](../vuex/introduction.md), [Working with data](../core-themes/data.md))
+  - `store` - Core Vuex stores (related: [Working with Vuex](../vuex/introduction.md), [Working with data](../core-themes/data.md)). **This part is depreciated and will be slowly migrated to modules and lib folder**
 
 - `src` - Main project folder containing Vue Storefront core and themes. This is your app playground so you can modify this folder.
-  - `extensions` - Custom extensions made for Vue Storefront like integration with MailChimp or support for Google Analytics) (see: [Working with extensions](../core-themes/extensions.md))
-  - `themes` - Vue Storefront core themes. You can change the active theme in `config/` folder. (see: [Working with themes](../core-themes/themes.md)).
+  - `modules` - project-specific VSModules and extensions
+  - `themes` - Vue Storefront core theme along with amp-theme. You can change the active theme in `config/` folder.
+  - `server` - additional Express routes that you can add to the folder
+