@ribajs/shopify - npm Package Compare versions

Comparing version 1.2.2 to 1.3.0

package.json

 {
   "name": "@ribajs/shopify",
   "description": "Shopify extension for Riba.js",
-  "version": "1.2.2",
-  "author": "Pascal Garber <[e-mail]>",
+  "version": "1.3.0",
+  "author": "Pascal Garber <[e-mail]>",
   "contributors": [],
   "url": "https://github.com/ribajs/riba/tree/master/packages/shopify",
+  "homepage": "https://ribajs.com/",
   "main": "src/index.ts",
@@ -22,2 +23,13 @@ "module": "src/index.ts",
   },
+  "keywords": [
+    "Shopify",
+    "Cart.js",
+    "Art+Code Studio",
+    "Riba",
+    "Rivets",
+    "tinybind",
+    "SPA",
+    "TypeScript",
+    "Browser"
+  ],
   "scripts": {
@@ -37,5 +49,5 @@ "type-check": "tslint -c tslint.json 'src/**/*.ts' && tsc --noEmit",
     "@babel/preset-typescript": "^7.6.0",
-    "@types/jest": "^24.0.18",
+    "@types/jest": "^24.0.19",
     "@types/jquery": "^3.3.31",
-    "@types/node": "^12.7.12",
+    "@types/node": "^12.11.6",
     "babel-loader": "^8.0.6",
@@ -48,9 +60,9 @@ "babel-plugin-array-includes": "^2.0.3",
     "typescript": "^3.6.4",
-    "webpack": "^4.41.1",
+    "webpack": "^4.41.2",
     "webpack-cli": "^3.3.9"
   },
   "dependencies": {
-    "@ribajs/core": "^1.2.2",
-    "@ribajs/i18n": "^1.2.2"
+    "@ribajs/core": "^1.3.0",
+    "@ribajs/i18n": "^1.3.0"
   }
 }

README.md

@@ -20,4 +20,4 @@ # Shopify Module
 JQuery(($: JQueryStatic) => {
-  riba.bind(document.body, this.model);
+  riba.bind(document.body, model);
 });
 ```

src/binders/shopify-img.binder.ts

@@ -6,3 +6,3 @@ import { IBinder, Utils } from '@ribajs/core';
 const PX_OFFSET = 10;
-const OVERWRITE_ORIGINAL_SRC = false;
+const OVERWRITE_ORIGINAL_SRC = true;
 
@@ -20,4 +20,7 @@ /**
       oldImageWidth: ((PX_OFFSET + 1) * -1),
-      onResize: () => {
-        const currentImageWidth = el.offsetWidth;
+      setSrcset: (width: number) => {
+        // Max width
+        if (width > 5760) {
+          width = 5760;
+        }
         let currentSrcset = (el as HTMLImageElement).srcset;
@@ -28,25 +31,29 @@ let currentSizes = (el as HTMLImageElement).sizes;
         }
+        const vw = Utils.getViewportDimensions().w;
+        const filterScale = window.devicePixelRatio || 1;
+        const filterSize = width + 'x';
+        const newSrc = imgUrlFormatter.read(this.customData.initialSrc, filterSize, filterScale, undefined, undefined, el);
+        if (typeof(currentSrcset) === 'string' && currentSrcset.length > 0) {
+          currentSrcset = currentSrcset + ', ';
+        } else {
+          currentSrcset = '';
+        }
+        if (typeof(currentSizes) === 'string' && currentSizes.length > 0) {
+          currentSizes = currentSizes + ', ';
+        } else {
+          currentSizes = '';
+        }
+        const newSrcset = `${currentSrcset}${newSrc} ${width}w`;
+        const newSizes = `${currentSizes} (width: ${vw}px) ${width}px`;
+        (el as HTMLImageElement).srcset = newSrcset;
+        (el as HTMLImageElement).sizes = newSizes;
+        if (OVERWRITE_ORIGINAL_SRC) {
+          (el as HTMLImageElement).src = newSrc;
+        }
+      },
+      onResize: () => {
+        const currentImageWidth = el.offsetWidth;
+        const currentSrcset = (el as HTMLImageElement).srcset;
         if (this.customData.oldImageWidth + PX_OFFSET < currentImageWidth && currentImageWidth > 0 && !currentSrcset.includes(`${currentImageWidth}w`)) {
-          const vw = Utils.getViewportDimensions().w;
-          const filterScale = window.devicePixelRatio || 1;
-          const filterSize = currentImageWidth + 'x';
-          const newSrc = imgUrlFormatter.read(this.customData.initialSrc, filterSize, filterScale, undefined, undefined, el);
-          if (typeof(currentSrcset) === 'string' && currentSrcset.length > 0) {
-            currentSrcset = currentSrcset + ', ';
-          } else {
-            currentSrcset = '';
-          }
-          if (typeof(currentSizes) === 'string' && currentSizes.length > 0) {
-            currentSizes = currentSizes + ', ';
-          } else {
-            currentSizes = '';
-          }
-          const newSrcset = `${currentSrcset}${newSrc} ${currentImageWidth}w`;
-          const newSizes = `${currentSizes} (width: ${vw}px) ${currentImageWidth}px`;
-
-          (el as HTMLImageElement).srcset = newSrcset;
-          (el as HTMLImageElement).sizes = newSizes;
-          if (OVERWRITE_ORIGINAL_SRC) {
-            (el as HTMLImageElement).src = newSrc;
-          }
+          this.customData.setSrcset(currentImageWidth);
           this.customData.oldImageWidth = currentImageWidth;
@@ -77,13 +84,12 @@ }
     }
-    this.customData.initialSrc = this.customData.initialSrc || src;
     if (src) {
-      if (el.offsetWidth > 0) {
-        this.customData.onResize();
-      } else {
-        setTimeout(this.customData.onResize, 200);
+      this.customData.onResize();
+      setTimeout(this.customData.onResize, 200);
+      // Set src attribute if it is not set statically
+      if (typeof(this.customData.initialSrc) !== 'string' || this.customData.initialSrc.length <= 0) {
+        this.customData.initialSrc = src;
+        (el as HTMLImageElement).src = src;
       }
-    } else {
-      (el as HTMLImageElement).src = this.customData.initialSrc;
     }
   },
 };

src/services/shopify-cart.service.ts

@@ -36,3 +36,3 @@ import { Debug, Utils, EventDispatcher } from '@ribajs/core';
    */
-  public static add(id: number | number, quantity = 1, properties = {}, options: IShopifyCartRequestOptions = this.requestOptionDefaults): Promise<IShopifyCartLineItem | IShopifyCartAddError> {
+  public static add(id: number, quantity = 1, properties = {}, options: IShopifyCartRequestOptions = this.requestOptionDefaults): Promise<IShopifyCartLineItem | IShopifyCartAddError> {
     if (options.triggerOnStart) {
@@ -54,2 +54,3 @@ this.triggerOnStart();
           }
+          this.triggerAdd(id, quantity, properties);
           return lineItem; // return original response
@@ -353,2 +354,9 @@ }) as any;
 
+  /**
+   * Trigger `ShopifyCart:add`
+   */
+  protected static triggerAdd(id: number, quantity: number, properties: any) {
+    ShopifyCartService.shopifyCartEventDispatcher.trigger('ShopifyCart:add', {id, quantity, properties});
+  }
+
   protected static normalizeShippingRates(shippingRates: IShopifyShippingRates): IShopifyShippingRatesNormalized {
@@ -355,0 +363,0 @@ const normalized = new Array<any>(shippingRates.length);

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No website

Quality

Package does not have a website.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

63480

increased by1.1%

Lines of code

1708

increased by0.83%

Number of low quality alerts

0

decreased by-100%

Dependency changes

• Updated@ribajs/core@^1.3.0

• Updated@ribajs/i18n@^1.3.0