@codexteam/deeplinker - npm Package Compare versions

Comparing version 1.0.7 to 1.1.0

dist/deeplinker.js

@@ -1,2 +0,2 @@
-!function(e,n){"object"==typeof exports&&"object"==typeof module?module.exports=n():"function"==typeof define&&define.amd?define([],n):"object"==typeof exports?exports.deeplinker=n():e.deeplinker=n()}(window,function(){return function(e){var n={};function t(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,t),r.l=!0,r.exports}return t.m=e,t.c=n,t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:o})},t.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},t.p="",t(t.s=0)}([function(e,n,t){"use strict";var o,r,i,u,c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e};
+!function(e,n){"object"==typeof exports&&"object"==typeof module?module.exports=n():"function"==typeof define&&define.amd?define([],n):"object"==typeof exports?exports.deeplinker=n():e.deeplinker=n()}(window,function(){return function(e){var n={};function t(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,t),r.l=!0,r.exports}return t.m=e,t.c=n,t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:o})},t.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},t.p="",t(t.s=0)}([function(e,n,t){"use strict";var o,r,i,u,c,f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e};
 /**
@@ -7,2 +7,2 @@ * Helps to set link with custom protocol (to open apps) and usual link (for webpages) to a button
  * @license MIT
- */e.exports=(o=function(e){e||u("Can not open app, because appLink is undefined");var n=document.createElement("iframe");n.style.display="none",document.body.appendChild(n),null!==n&&(n.src=e)},r=function(e,n){var t=!1;window.addEventListener("pagehide",function(){t=!0},!1),window.addEventListener("blur",function(){t=!0},!1),o(e),setTimeout(function(){t||i(n)},100)},i=function(e){e||u("Can not open page because link is undefined"),window.open(e,"_blank")},u=function(e){throw Error("[Deeplinker] "+e)},{click:function(e){"object"!==(void 0===e?"undefined":c(e))&&u("Passed element is not an object");var n=e.dataset.link||e.href,t=e.dataset.appLink;r(t,n)},tryToOpenApp:o})}])});
+ */e.exports=(o=function(e){"object"!==(void 0===e?"undefined":f(e))&&c("Passed element is not an object");var n=e.dataset.link||e.href,t=e.dataset.appLink;i(t,n)},r=function(e){e||c("Can not open app, because appLink is undefined");var n=document.createElement("iframe");n.style.display="none",document.body.appendChild(n),null!==n&&(n.src=e)},i=function(e,n){var t=!1;window.addEventListener("pagehide",function(){t=!0},!1),window.addEventListener("blur",function(){t=!0},!1),r(e),setTimeout(function(){t||u(n)},100)},u=function(e){e||c("Can not open page because link is undefined"),window.open(e,"_blank")},c=function(e){throw Error("[Deeplinker] "+e)},{click:o,init:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:".deeplinker",n=document.querySelectorAll(e);n&&n.forEach(function(e){e.addEventListener("click",function(n){n.preventDefault(),o(e)})})},tryToOpenApp:r})}])});

package.json

 {
   "name": "@codexteam/deeplinker",
-  "version": "1.0.7",
+  "version": "1.1.0",
   "description": "Tiny script that helps you to use one link to open web pages or installed apps",
@@ -5,0 +5,0 @@ "keywords": [

README.md

@@ -9,3 +9,3 @@ # Deeplinker
 
-You can install script via package managers or download it to your server. 
+You can install script via package managers or download it to your server.
 
@@ -17,3 +17,3 @@ ### NPM and Yarn
 ```shell
-npm install @codexteam/deeplinker --save 
+npm install @codexteam/deeplinker --save
 ```
@@ -29,3 +29,3 @@
 const deeplinker = require('@codexteam/deeplinker');
-``` 
+```
 
@@ -48,3 +48,3 @@ ### Local script
 
-Call `deeplinker.click(element)` function. Element should contain the following params:
+Firstly you need to add the following params to deeplinker elements:
 
@@ -54,13 +54,61 @@ - `data-link` or `href` with a usual link
 
-Upgrade your link element by adding a listener with preventing default action. Set up `data-app-link` param.
+Set up `data-app-link` param for links with `href`.
 
 ```html
-<a href="https://www.instagram.com/codex_team/"
-   onclick="event.preventDefault(); deeplinker.click(this)"
-   data-app-link="instagram://user?username=codex_team">Follow us on Instagram</a>
+<a href="https://www.instagram.com/codex_team/" data-app-link="instagram://user?username=codex_team">
+  Follow us on Instagram
+</a>
 ```
 
-Or add listener to any element. Set up `data-link` and `data-app-link` params.
+Or set up `data-link` and `data-app-link` params for any other elements
 
 ```html
+<div data-link="https://t.me/codex_team" data-app-link="tg://resolve?domain=codex_team">
+  Join our Telegram-channel
+</div>
+```
+
+Then you need to add click listeners. There are two ways to do this.
+
+#### Add listeners automatically
+
+Add target class name to all deeplinker elements (`deeplinker` by default). Use `deeplinker.init()` function to add listeners automatically to all elements with target class name. `event.preventDefault` and `deeplinker.click` will be added as onclick function.
+
+Run this function when page is loaded.
+
+```html
+<body onload='deeplinker.init()'>
+```
+
+```html
+<div class="deeplinker" data-link="https://t.me/codex_team" data-app-link="tg://resolve?domain=codex_team">
+  Join our Telegram-channel
+</div>
+```
+
+##### Custom selector
+
+You can call `deeplinker.init()` with string param to set up target selector. `.deeplinker` by default.
+
+Example:
+
+```js
+deeplinker.init('.my_deeplinker_element');
+```
+
+for
+
+```html
+<div class="my_deeplinker_element" ...>
+  Join our Telegram-channel
+</div>
+```
+
+#### Set up onclick functions by yourself
+
+Call `deeplinker.click(element)` function on click.
+
+Set up click function on deeplinker elements.
+
+```html
 <div onclick="deeplinker.click(this)"
@@ -71,4 +119,13 @@ data-link="https://t.me/codex_team"
 
-### Run automatically
+For link elements you also need to add `event.preventDefault` function:
 
+```html
+<a href="https://www.instagram.com/codex_team/"
+   onclick="event.preventDefault(); deeplinker.click(this)"
+   data-app-link="instagram://user?username=codex_team">Follow us on Instagram</a>
+```
+
+
+### Try to open app automatically
+
 If you want to try to open app silently then call `deeplinker.tryToOpenApp(deepLink)`.
@@ -78,3 +135,3 @@
 
-> Doesn't works on mobile devices.
+> Doesn't work on mobile devices.
 
@@ -85,3 +142,3 @@ ```html
 
-## Schemes of popular apps 
+## Schemes of popular apps
 
@@ -88,0 +145,0 @@ ### Telegram

src/index.js

@@ -11,2 +11,24 @@ /**
    *
+   * @description Add listeners for deeplinker elements
+   *
+   * @param {string} selector - find elements by target selector
+   */
+  const init = (selector = '.deeplinker') => {
+    let links = document.querySelectorAll(selector);
+
+    if (!links) {
+      return;
+    }
+
+    links.forEach(link => {
+      link.addEventListener('click', (event) => {
+        event.preventDefault();
+        click(link);
+      });
+    });
+  };
+
+  /**
+   * @public
+   *
    * @description Wrapper for openAppOrLink for clickable elements as div buttons
@@ -168,2 +190,3 @@ *
     click,
+    init,
     tryToOpenApp
@@ -170,0 +193,0 @@ }

No alert changes

Improved metrics

Total package byte prevSize

71561

increased by2.87%

Lines of code

197

increased by11.3%

Number of lines in readme file

174

increased by48.72%

No dependency changes