From 149ac2f5fcaa679913d7b289d1a6adc5fe910879 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Vic=20Sho=CC=81stak?= <koddr.me@gmail.com>
Date: Fri, 15 Mar 2019 23:47:28 +0300
Subject: [PATCH] Update Providers

---
 package-lock.json               |  8 +--
 package.json                    |  4 +-
 src/providers/GooglePlus.vue    | 14 ++---
 src/providers/Line.vue          | 12 ++---
 src/providers/LinkedIn.vue      | 52 ++++---------------
 src/providers/LiveJournal.vue   | 36 ++++---------
 src/providers/MoiMir.vue        | 85 +++++++++---------------------
 src/providers/Odnoklassniki.vue | 70 ++++++-------------------
 src/providers/Pinterest.vue     | 85 +++++++++---------------------
 src/providers/Reddit.vue        | 81 ++++++++---------------------
 src/providers/Telegram.vue      | 40 +++++----------
 src/providers/Tumblr.vue        | 86 +++++++++----------------------
 src/providers/Twitter.vue       | 36 ++++---------
 src/providers/Viber.vue         | 38 +++++---------
 src/providers/Vkontakte.vue     | 91 +++++++++------------------------
 src/providers/WhatsApp.vue      | 38 +++++---------
 16 files changed, 219 insertions(+), 557 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 59cdc77..9c124c8 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-goodshare",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -7430,9 +7430,9 @@
       }
     },
     "vue": {
-      "version": "2.6.8",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.8.tgz",
-      "integrity": "sha512-+vp9lEC2Kt3yom673pzg1J7T1NVGuGzO9j8Wxno+rQN2WYVBX2pyo/RGQ3fXCLh2Pk76Skw/laAPCuBuEQ4diw=="
+      "version": "2.6.9",
+      "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.9.tgz",
+      "integrity": "sha512-t1+tvH8hybPM86oNne3ZozCD02zj/VoZIiojOBPJLjwBn7hxYU5e1gBObFpq8ts1NEn1VhPf/hVXBDAJ3X5ljg=="
     },
     "vue-style-loader": {
       "version": "3.1.2",
diff --git a/package.json b/package.json
index 0a7204f..38e3fc1 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-goodshare",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "Vue.js component for social share. A simple way to share a link on the pages of your website in the most popular (and not so) social networks.",
   "main": "src/VueGoodshare.vue",
   "scripts": {
@@ -13,7 +13,7 @@
     "url": "git+https://github.com/koddr/vue-goodshare.git"
   },
   "dependencies": {
-    "vue": "^2.6.8"
+    "vue": "^2.6.9"
   },
   "devDependencies": {
     "css-loader": "^0.28.11",
diff --git a/src/providers/GooglePlus.vue b/src/providers/GooglePlus.vue
index eb8b137..1c19ba3 100644
--- a/src/providers/GooglePlus.vue
+++ b/src/providers/GooglePlus.vue
@@ -19,6 +19,7 @@
 <script>
 import { clickEvent } from "../helpers/events";
 import { documentHref } from "../helpers/href";
+import { openPopUpWindow } from "../helpers/popup_window";
 
 export default {
   name: "VueGoodshareGooglePlus",
@@ -54,22 +55,15 @@ export default {
     showShareWindow: function() {
       // Variables
       const width = 640;
-      const height = 640;
-      let left = screen.width / 2 - width / 2;
-      let top = screen.height / 2 - height / 2;
-      const window_config = `width=${width},height=${height},left=${left},top=${top}`;
+      const height = 480;
       const share_url = `https://plus.google.com/share?url=${encodeURIComponent(
         this.$props.page_url
       )}`;
 
       // onClick event
-      clickEvent(this, "googlePlus");
+      clickEvent(this, "googleplus");
 
-      return window.open(
-        share_url,
-        "Share this",
-        `${window_config},toolbar=no,menubar=no,scrollbars=no`
-      );
+      return openPopUpWindow(share_url, width, height);
     }
   }
 };
diff --git a/src/providers/Line.vue b/src/providers/Line.vue
index 15f93ab..40c2f7a 100644
--- a/src/providers/Line.vue
+++ b/src/providers/Line.vue
@@ -19,6 +19,7 @@
 <script>
 import { clickEvent } from "../helpers/events";
 import { documentHref } from "../helpers/href";
+import { openPopUpWindow } from "../helpers/popup_window";
 
 export default {
   name: "VueGoodshareLine",
@@ -54,10 +55,7 @@ export default {
     showShareWindow: function() {
       // Variables
       const width = 640;
-      const height = 640;
-      let left = screen.width / 2 - width / 2;
-      let top = screen.height / 2 - height / 2;
-      const window_config = `width=${width},height=${height},left=${left},top=${top}`;
+      const height = 480;
       const share_url = `line://msg/text/${encodeURIComponent(
         this.$props.page_url
       )}`;
@@ -65,11 +63,7 @@ export default {
       // onClick event
       clickEvent(this, "line");
 
-      return window.open(
-        share_url,
-        "Share this",
-        `${window_config},toolbar=no,menubar=no,scrollbars=no`
-      );
+      return openPopUpWindow(share_url, width, height);
     }
   }
 };
diff --git a/src/providers/LinkedIn.vue b/src/providers/LinkedIn.vue
index e94af07..fd9eaa7 100644
--- a/src/providers/LinkedIn.vue
+++ b/src/providers/LinkedIn.vue
@@ -31,6 +31,9 @@ import { clickEvent } from "../helpers/events";
 import { documentHref } from "../helpers/href";
 import { documentTitle } from "../helpers/title";
 import { metaDescription } from "../helpers/description";
+import { getCallbackName } from "../helpers/callback_name";
+import { sliceThousandInt } from "../helpers/count_number";
+import { openPopUpWindow } from "../helpers/popup_window";
 
 export default {
   name: "VueGoodshareLinkedIn",
@@ -68,27 +71,6 @@ export default {
     };
   },
   methods: {
-    /**
-     * Get a random integer between `min` and `max`.
-     *
-     * @param {number} min - min number
-     * @param {number} max - max number
-     * @return {number} a random integer
-     */
-    getRandomInt: (min, max) => {
-      return Math.floor(Math.random() * (max - min + 1) + min);
-    },
-
-    /**
-     * Slice thousand integer and add `k` letter.
-     *
-     * @param {number} number - thousand integer
-     * @return {string} a integer with letter
-     */
-    sliceThousandInt: number => {
-      return (number / 1000).toFixed(1) + "k";
-    },
-
     /**
      * Show share window.
      *
@@ -97,10 +79,7 @@ export default {
     showShareWindow: function() {
       // Variables
       const width = 640;
-      const height = 640;
-      let left = screen.width / 2 - width / 2;
-      let top = screen.height / 2 - height / 2;
-      const window_config = `width=${width},height=${height},left=${left},top=${top}`;
+      const height = 480;
       const share_url = `https://www.linkedin.com/shareArticle?url=${encodeURIComponent(
         this.$props.page_url
       )}&text=${encodeURIComponent(
@@ -108,13 +87,9 @@ export default {
       )}&summary=${encodeURIComponent(this.$props.page_description)}&mini=true`;
 
       // onClick event
-      clickEvent(this, "linkedIn");
+      clickEvent(this, "linkedin");
 
-      return window.open(
-        share_url,
-        "Share this",
-        `${window_config},toolbar=no,menubar=no,scrollbars=no`
-      );
+      return openPopUpWindow(share_url, width, height);
     },
 
     /**
@@ -125,15 +100,12 @@ export default {
     getShareCounter: function() {
       // Variables
       const script = document.createElement("script");
-      const callback = `vue_goodshare_${this.getRandomInt(1, 2345)}`;
+      const callback = getCallbackName("vue_goodshare", 9999, 111);
 
       // Create `script` tag with share count URL
-      script.src =
-        "https://www.linkedin.com/countserv/count/share?" +
-        "url=" +
-        encodeURIComponent(this.$props.page_url) +
-        "&callback=" +
-        callback;
+      script.src = `https://www.linkedin.com/countserv/count/share?url=${encodeURIComponent(
+        this.$props.page_url
+      )}&callback=${callback}`;
 
       // Add `script` tag with share count URL
       // to end of `body` tag
@@ -143,9 +115,7 @@ export default {
       window[callback] = count => {
         if (count) {
           this.counter_linkedin =
-            count.count >= 1000
-              ? this.sliceThousandInt(count.count)
-              : count.count;
+            count.count >= 1000 ? sliceThousandInt(count.count) : count.count;
         }
       };
     }
diff --git a/src/providers/LiveJournal.vue b/src/providers/LiveJournal.vue
index f522a36..0751181 100644
--- a/src/providers/LiveJournal.vue
+++ b/src/providers/LiveJournal.vue
@@ -21,6 +21,7 @@
 import { clickEvent } from "../helpers/events";
 import { documentHref } from "../helpers/href";
 import { documentTitle } from "../helpers/title";
+import { openPopUpWindow } from "../helpers/popup_window";
 
 export default {
   name: "VueGoodshareLiveJournal",
@@ -58,34 +59,17 @@ export default {
      * @return {object} a pop-up window
      */
     showShareWindow: function() {
-      click(this, "liveJournal");
       // Variables
       const width = 640;
-      const height = 640;
-      let left = screen.width / 2 - width / 2;
-      let top = screen.height / 2 - height / 2;
-      const window_config =
-        "width=" +
-        width +
-        ",height=" +
-        height +
-        ",left=" +
-        left +
-        ",top=" +
-        top +
-        ",";
-      const share_url =
-        "https://livejournal.com/update.bml?" +
-        "event=" +
-        encodeURIComponent(this.$props.page_url) +
-        "&subject=" +
-        encodeURIComponent(this.$props.page_title);
-
-      return window.open(
-        share_url,
-        "Share this",
-        window_config + "toolbar=no,menubar=no,scrollbars=no"
-      );
+      const height = 480;
+      const share_url = `https://livejournal.com/update.bml?event=${encodeURIComponent(
+        this.$props.page_url
+      )}&subject=${encodeURIComponent(this.$props.page_title)}`;
+
+      // onClick event
+      clickEvent(this, "livejournal");
+
+      return openPopUpWindow(share_url, width, height);
     }
   }
 };
diff --git a/src/providers/MoiMir.vue b/src/providers/MoiMir.vue
index b670e91..94f333a 100644
--- a/src/providers/MoiMir.vue
+++ b/src/providers/MoiMir.vue
@@ -14,15 +14,16 @@
     @click.prevent="showShareWindow"
   >
     <i class="icon-moimir" v-if="this.$props.has_icon"></i>
-    <span class="title-social" v-if="this.$props.title_social">{{
-      title_social
-    }}</span>
+    <span class="title-social" v-if="this.$props.title_social">
+      {{ title_social }}
+    </span>
     <span
       class="counter-moimir"
       v-model="counter_moimir"
       v-if="this.$props.has_counter"
-      >{{ counter_moimir }}</span
     >
+      {{ counter_moimir }}
+    </span>
   </a>
 </template>
 
@@ -32,6 +33,9 @@ import { documentHref } from "../helpers/href";
 import { documentTitle } from "../helpers/title";
 import { metaDescription } from "../helpers/description";
 import { linkAppleTouchIcon } from "../helpers/icon";
+import { getCallbackName } from "../helpers/callback_name";
+import { sliceThousandInt } from "../helpers/count_number";
+import { openPopUpWindow } from "../helpers/popup_window";
 
 export default {
   name: "VueGoodshareMoiMir",
@@ -73,64 +77,27 @@ export default {
     };
   },
   methods: {
-    /**
-     * Get a random integer between `min` and `max`.
-     *
-     * @param {number} min - min number
-     * @param {number} max - max number
-     * @return {number} a random integer
-     */
-    getRandomInt: (min, max) => {
-      return Math.floor(Math.random() * (max - min + 1) + min);
-    },
-
-    /**
-     * Slice thousand integer and add `k` letter.
-     *
-     * @param {number} number - thousand integer
-     * @return {string} a integer with letter
-     */
-    sliceThousandInt: number => {
-      return (number / 1000).toFixed(1) + "k";
-    },
-
     /**
      * Show share window.
      *
      * @return {object} a pop-up window
      */
     showShareWindow: function() {
-      click(this, "moiMir");
       // Variables
       const width = 640;
-      const height = 640;
-      let left = screen.width / 2 - width / 2;
-      let top = screen.height / 2 - height / 2;
-      const window_config =
-        "width=" +
-        width +
-        ",height=" +
-        height +
-        ",left=" +
-        left +
-        ",top=" +
-        top;
-      const share_url =
-        "https://connect.mail.ru/share?" +
-        "url=" +
-        encodeURIComponent(this.$props.page_url) +
-        "&title=" +
-        encodeURIComponent(this.$props.page_title) +
-        "&description=" +
-        encodeURIComponent(this.$props.page_description) +
-        "&imageurl=" +
-        encodeURIComponent(this.$props.page_image);
+      const height = 480;
+      const share_url = `https://connect.mail.ru/share?url=${encodeURIComponent(
+        this.$props.page_url
+      )}&title=${encodeURIComponent(
+        this.$props.page_title
+      )}&description=${encodeURIComponent(
+        this.$props.page_description
+      )}&imageurl=${encodeURIComponent(this.$props.page_image)}`;
+
+      // onClick event
+      clickEvent(this, "moimir");
 
-      return window.open(
-        share_url,
-        "Share this",
-        window_config + ",toolbar=no,menubar=no,scrollbars=no"
-      );
+      return openPopUpWindow(share_url, width, height);
     },
 
     /**
@@ -141,14 +108,12 @@ export default {
     getShareCounter: function() {
       // Variables
       const script = document.createElement("script");
-      const callback = "vue_goodshare_" + this.getRandomInt(1, 2345);
+      const callback = getCallbackName("vue_goodshare", 9999, 111);
 
       // Create `script` tag with share count URL
-      script.src =
-        "https://appsmail.ru/share/count/" +
-        encodeURIComponent(this.$props.page_url.replace(/^.*?:\/\//, "")) +
-        "?callback=" +
-        callback;
+      script.src = `https://appsmail.ru/share/count/${encodeURIComponent(
+        this.$props.page_url.replace(/^.*?:\/\//, "")
+      )}?callback=${callback}`;
 
       // Add `script` tag with share count URL
       // to end of `body` tag
@@ -159,7 +124,7 @@ export default {
         if (count) {
           this.counter_moimir =
             count.share_mm >= 1000
-              ? this.sliceThousandInt(count.share_mm)
+              ? sliceThousandInt(count.share_mm)
               : count.share_mm;
         }
       };
diff --git a/src/providers/Odnoklassniki.vue b/src/providers/Odnoklassniki.vue
index 138d7c9..f8c18ac 100644
--- a/src/providers/Odnoklassniki.vue
+++ b/src/providers/Odnoklassniki.vue
@@ -12,9 +12,9 @@
     @click.prevent="showShareWindow"
   >
     <i class="icon-odnoklassniki" v-if="this.$props.has_icon"></i>
-    <span class="title-social" v-if="this.$props.title_social">{{
-      title_social
-    }}</span>
+    <span class="title-social" v-if="this.$props.title_social">
+      {{ title_social }}
+    </span>
     <span
       class="counter-odnoklassniki"
       v-model="counter_odnoklassniki"
@@ -29,6 +29,8 @@
 import { clickEvent } from "../helpers/events";
 import { documentHrefWithoutHash } from "../helpers/href";
 import { documentTitle } from "../helpers/title";
+import { sliceThousandInt } from "../helpers/count_number";
+import { openPopUpWindow } from "../helpers/popup_window";
 
 export default {
   name: "VueGoodshareOdnoklassniki",
@@ -63,65 +65,28 @@ export default {
     };
   },
   methods: {
-    /**
-     * Get a random integer between `min` and `max`.
-     *
-     * @param {number} min - min number
-     * @param {number} max - max number
-     * @return {number} a random integer
-     */
-    getRandomInt: (min, max) => {
-      return Math.floor(Math.random() * (max - min + 1) + min);
-    },
-
-    /**
-     * Slice thousand integer and add `k` letter.
-     *
-     * @param {number} number - thousand integer
-     * @return {string} a integer with letter
-     */
-    sliceThousandInt: number => {
-      return (number / 1000).toFixed(1) + "k";
-    },
-
     /**
      * Show share window.
      *
      * @return {object} a pop-up window
      */
     showShareWindow: function() {
-      click(this, "odnoklassniki");
       // Variables
       const width = 640;
-      const height = 640;
-      let left = screen.width / 2 - width / 2;
-      let top = screen.height / 2 - height / 2;
-      const window_config =
-        "width=" +
-        width +
-        ",height=" +
-        height +
-        ",left=" +
-        left +
-        ",top=" +
-        top;
-      const share_url =
-        "https://www.odnoklassniki.ru/dk?st.cmd=addShare&st.s=1" +
-        "&st._surl=" +
-        encodeURIComponent(this.$props.page_url) +
-        "&st.comments=" +
-        encodeURIComponent(this.$props.page_title);
+      const height = 480;
+      const share_url = `https://www.odnoklassniki.ru/dk?st.cmd=addShare&st.s=1&st._surl=${encodeURIComponent(
+        this.$props.page_url
+      )}&st.comments=${encodeURIComponent(this.$props.page_title)}`;
+
+      // onClick event
+      clickEvent(this, "odnoklassniki");
 
-      return window.open(
-        share_url,
-        "Share this",
-        window_config + ",toolbar=no,menubar=no,scrollbars=no"
-      );
+      return openPopUpWindow(share_url, width, height);
     },
 
     handleUpdateCount(count) {
       this.counter_odnoklassniki =
-        count >= 1000 ? this.sliceThousandInt(count) : count;
+        count >= 1000 ? sliceThousandInt(count) : count;
     },
 
     /**
@@ -139,10 +104,9 @@ export default {
       const script = document.createElement("script");
 
       // Create `script` tag with share count URL
-      script.src =
-        "https://connect.ok.ru/dk?st.cmd=extLike&uid=1" +
-        "&ref=" +
-        encodeURIComponent(this.$props.page_url);
+      script.src = `https://connect.ok.ru/dk?st.cmd=extLike&uid=1&ref=${encodeURIComponent(
+        this.$props.page_url
+      )}`;
 
       // Add `script` tag with share count URL
       // to end of `body` tag
diff --git a/src/providers/Pinterest.vue b/src/providers/Pinterest.vue
index 8bcdfdd..72ccd97 100644
--- a/src/providers/Pinterest.vue
+++ b/src/providers/Pinterest.vue
@@ -12,15 +12,16 @@
     @click.prevent="showShareWindow"
   >
     <i class="icon-pinterest" v-if="this.$props.has_icon"></i>
-    <span class="title-social" v-if="this.$props.title_social">{{
-      title_social
-    }}</span>
+    <span class="title-social" v-if="this.$props.title_social">
+      {{ title_social }}
+    </span>
     <span
       class="counter-pinterest"
       v-model="counter_pinterest"
       v-if="this.$props.has_counter"
-      >{{ counter_pinterest }}</span
     >
+      {{ counter_pinterest }}
+    </span>
   </a>
 </template>
 
@@ -29,6 +30,9 @@ import { clickEvent } from "../helpers/events";
 import { documentHref } from "../helpers/href";
 import { metaDescription } from "../helpers/description";
 import { linkAppleTouchIcon } from "../helpers/icon";
+import { getCallbackName } from "../helpers/callback_name";
+import { sliceThousandInt } from "../helpers/count_number";
+import { openPopUpWindow } from "../helpers/popup_window";
 
 export default {
   name: "VueGoodsharePinterest",
@@ -66,63 +70,25 @@ export default {
     };
   },
   methods: {
-    /**
-     * Get a random integer between `min` and `max`.
-     *
-     * @param {number} min - min number
-     * @param {number} max - max number
-     * @return {number} a random integer
-     */
-    getRandomInt: (min, max) => {
-      return Math.floor(Math.random() * (max - min + 1) + min);
-    },
-
-    /**
-     * Slice thousand integer and add `k` letter.
-     *
-     * @param {number} number - thousand integer
-     * @return {string} a integer with letter
-     */
-    sliceThousandInt: number => {
-      return (number / 1000).toFixed(1) + "k";
-    },
-
     /**
      * Show share window.
      *
      * @return {object} a pop-up window
      */
     showShareWindow: function() {
-      click(this, "pinterest");
       // Variables
       const width = 640;
-      const height = 640;
-      let left = screen.width / 2 - width / 2;
-      let top = screen.height / 2 - height / 2;
-      const window_config =
-        "width=" +
-        width +
-        ",height=" +
-        height +
-        ",left=" +
-        left +
-        ",top=" +
-        top +
-        ",";
-      const share_url =
-        "https://www.pinterest.com/pin/create/button/?" +
-        "canonicalUrl=" +
-        encodeURIComponent(this.$props.page_url) +
-        "&description=" +
-        encodeURIComponent(this.$props.page_description) +
-        "&media=" +
-        encodeURIComponent(this.$props.page_image);
+      const height = 480;
+      const share_url = `https://www.pinterest.com/pin/create/button/?canonicalUrl=${encodeURIComponent(
+        this.$props.page_url
+      )}&description=${encodeURIComponent(
+        this.$props.page_description
+      )}&media=${encodeURIComponent(this.$props.page_image)}`;
+
+      // onClick event
+      clickEvent(this, "pinterest");
 
-      return window.open(
-        share_url,
-        "Share this",
-        window_config + "toolbar=no,menubar=no,scrollbars=no"
-      );
+      return openPopUpWindow(share_url, width, height);
     },
 
     /**
@@ -133,15 +99,12 @@ export default {
     getShareCounter: function() {
       // Variables
       const script = document.createElement("script");
-      const callback = "vue_goodshare_" + this.getRandomInt(1, 2345);
+      const callback = getCallbackName("vue_goodshare", 9999, 111);
 
       // Create `script` tag with share count URL
-      script.src =
-        "https://api.pinterest.com/v1/urls/count.json?" +
-        "url=" +
-        encodeURIComponent(this.$props.page_url) +
-        "&callback=" +
-        callback;
+      script.src = `https://api.pinterest.com/v1/urls/count.json?url=${encodeURIComponent(
+        this.$props.page_url
+      )}&callback=${callback}`;
 
       // Add `script` tag with share count URL
       // to end of `body` tag
@@ -151,9 +114,7 @@ export default {
       window[callback] = count => {
         if (count) {
           this.counter_pinterest =
-            count.count >= 1000
-              ? this.sliceThousandInt(count.count)
-              : count.count;
+            count.count >= 1000 ? sliceThousandInt(count.count) : count.count;
         }
       };
     }
diff --git a/src/providers/Reddit.vue b/src/providers/Reddit.vue
index 1286a1d..d97ca7a 100644
--- a/src/providers/Reddit.vue
+++ b/src/providers/Reddit.vue
@@ -12,15 +12,16 @@
     @click.prevent="showShareWindow"
   >
     <i class="icon-reddit" v-if="this.$props.has_icon"></i>
-    <span class="title-social" v-if="this.$props.title_social">{{
-      title_social
-    }}</span>
+    <span class="title-social" v-if="this.$props.title_social">
+      {{ title_social }}
+    </span>
     <span
       class="counter-reddit"
       v-model="counter_reddit"
       v-if="this.$props.has_counter"
-      >{{ counter_reddit }}</span
     >
+      {{ counter_reddit }}
+    </span>
   </a>
 </template>
 
@@ -28,6 +29,9 @@
 import { clickEvent } from "../helpers/events";
 import { documentHref } from "../helpers/href";
 import { documentTitle } from "../helpers/title";
+import { getCallbackName } from "../helpers/callback_name";
+import { sliceThousandInt } from "../helpers/count_number";
+import { openPopUpWindow } from "../helpers/popup_window";
 
 export default {
   name: "VueGoodshareReddit",
@@ -61,61 +65,23 @@ export default {
     };
   },
   methods: {
-    /**
-     * Get a random integer between `min` and `max`.
-     *
-     * @param {number} min - min number
-     * @param {number} max - max number
-     * @return {number} a random integer
-     */
-    getRandomInt: (min, max) => {
-      return Math.floor(Math.random() * (max - min + 1) + min);
-    },
-
-    /**
-     * Slice thousand integer and add `k` letter.
-     *
-     * @param {number} number - thousand integer
-     * @return {string} a integer with letter
-     */
-    sliceThousandInt: number => {
-      return (number / 1000).toFixed(1) + "k";
-    },
-
     /**
      * Show share window.
      *
      * @return {object} a pop-up window
      */
     showShareWindow: function() {
-      click(this, "reddit");
       // Variables
       const width = 640;
-      const height = 640;
-      let left = screen.width / 2 - width / 2;
-      let top = screen.height / 2 - height / 2;
-      const window_config =
-        "width=" +
-        width +
-        ",height=" +
-        height +
-        ",left=" +
-        left +
-        ",top=" +
-        top +
-        ",";
-      const share_url =
-        "https://reddit.com/submit?" +
-        "url=" +
-        encodeURIComponent(this.$props.page_url) +
-        "&title=" +
-        encodeURIComponent(this.$props.page_title);
+      const height = 480;
+      const share_url = `https://reddit.com/submit?url=${encodeURIComponent(
+        this.$props.page_url
+      )}&title=${encodeURIComponent(this.$props.page_title)}`;
+
+      // onClick event
+      clickEvent(this, "reddit");
 
-      return window.open(
-        share_url,
-        "Share this",
-        window_config + "toolbar=no,menubar=no,scrollbars=no"
-      );
+      return openPopUpWindow(share_url, width, height);
     },
 
     /**
@@ -126,15 +92,12 @@ export default {
     getShareCounter: function() {
       // Variables
       const script = document.createElement("script");
-      const callback = "vue_goodshare_" + this.getRandomInt(1, 2345);
+      const callback = getCallbackName("vue_goodshare", 9999, 111);
 
       // Create `script` tag with share count URL
-      script.src =
-        "https://www.reddit.com/api/info.json?" +
-        "url=" +
-        encodeURIComponent(this.$props.page_url) +
-        "&callback=" +
-        callback;
+      script.src = `https://www.reddit.com/api/info.json?url=${encodeURIComponent(
+        this.$props.page_url
+      )}&callback=${callback}`;
 
       // Add `script` tag with share count URL
       // to end of `body` tag
@@ -150,9 +113,7 @@ export default {
           }
 
           this.counter_reddit =
-            total_count >= 1000
-              ? this.sliceThousandInt(total_count)
-              : total_count;
+            total_count >= 1000 ? sliceThousandInt(total_count) : total_count;
         } else {
           this.counter_reddit = 0;
         }
diff --git a/src/providers/Telegram.vue b/src/providers/Telegram.vue
index 72d689d..986507c 100644
--- a/src/providers/Telegram.vue
+++ b/src/providers/Telegram.vue
@@ -10,15 +10,16 @@
     @click.prevent="showShareWindow"
   >
     <i class="icon-telegram" v-if="this.$props.has_icon"></i>
-    <span class="title-social" v-if="this.$props.title_social">{{
-      title_social
-    }}</span>
+    <span class="title-social" v-if="this.$props.title_social">
+      {{ title_social }}
+    </span>
   </a>
 </template>
 
 <script>
 import { clickEvent } from "../helpers/events";
 import { documentHrefWithoutHash } from "../helpers/href";
+import { openPopUpWindow } from "../helpers/popup_window";
 
 export default {
   name: "VueGoodshareTelegram",
@@ -52,32 +53,17 @@ export default {
      * @return {object} a pop-up window
      */
     showShareWindow: function() {
-      click(this, "telegram");
       // Variables
       const width = 640;
-      const height = 640;
-      let left = screen.width / 2 - width / 2;
-      let top = screen.height / 2 - height / 2;
-      const window_config =
-        "width=" +
-        width +
-        ",height=" +
-        height +
-        ",left=" +
-        left +
-        ",top=" +
-        top +
-        ",";
-      const share_url =
-        "https://telegram.me/share/url?" +
-        "url=" +
-        encodeURIComponent(this.$props.page_url);
-
-      return window.open(
-        share_url,
-        "Share this",
-        window_config + "toolbar=no,menubar=no,scrollbars=no"
-      );
+      const height = 480;
+      const share_url = `https://telegram.me/share/url?url=${encodeURIComponent(
+        this.$props.page_url
+      )}`;
+
+      // onClick event
+      clickEvent(this, "telegram");
+
+      return openPopUpWindow(share_url, width, height);
     }
   }
 };
diff --git a/src/providers/Tumblr.vue b/src/providers/Tumblr.vue
index 641e239..a00adb6 100644
--- a/src/providers/Tumblr.vue
+++ b/src/providers/Tumblr.vue
@@ -13,15 +13,16 @@
     @click.prevent="showShareWindow"
   >
     <i class="icon-tumblr" v-if="this.$props.has_icon"></i>
-    <span class="title-social" v-if="this.$props.title_social">{{
-      title_social
-    }}</span>
+    <span class="title-social" v-if="this.$props.title_social">
+      {{ title_social }}
+    </span>
     <span
       class="counter-tumblr"
       v-model="counter_tumblr"
       v-if="this.$props.has_counter"
-      >{{ counter_tumblr }}</span
     >
+      {{ counter_tumblr }}
+    </span>
   </a>
 </template>
 
@@ -30,6 +31,9 @@ import { clickEvent } from "../helpers/events";
 import { documentHref } from "../helpers/href";
 import { documentTitle } from "../helpers/title";
 import { metaDescription } from "../helpers/description";
+import { getCallbackName } from "../helpers/callback_name";
+import { sliceThousandInt } from "../helpers/count_number";
+import { openPopUpWindow } from "../helpers/popup_window";
 
 export default {
   name: "VueGoodshareTumblr",
@@ -67,64 +71,27 @@ export default {
     };
   },
   methods: {
-    /**
-     * Get a random integer between `min` and `max`.
-     *
-     * @param {number} min - min number
-     * @param {number} max - max number
-     * @return {number} a random integer
-     */
-    getRandomInt: (min, max) => {
-      return Math.floor(Math.random() * (max - min + 1) + min);
-    },
-
-    /**
-     * Slice thousand integer and add `k` letter.
-     *
-     * @param {number} number - thousand integer
-     * @return {string} a integer with letter
-     */
-    sliceThousandInt: number => {
-      return (number / 1000).toFixed(1) + "k";
-    },
-
     /**
      * Show share window.
      *
      * @return {object} a pop-up window
      */
     showShareWindow: function() {
-      click(this, "tumblr");
       // Variables
       const width = 640;
-      const height = 640;
-      let left = screen.width / 2 - width / 2;
-      let top = screen.height / 2 - height / 2;
-      const window_config =
-        "width=" +
-        width +
-        ",height=" +
-        height +
-        ",left=" +
-        left +
-        ",top=" +
-        top +
-        ",";
-      const share_url =
-        "https://www.tumblr.com/widgets/share/tool?" +
-        "canonicalUrl=" +
-        encodeURIComponent(this.$props.page_url) +
-        "&title=" +
-        encodeURIComponent(this.$props.page_title) +
-        "&caption=" +
-        encodeURIComponent(this.$props.page_description) +
-        "&posttype=link";
+      const height = 480;
+      const share_url = `https://www.tumblr.com/widgets/share/tool?canonicalUrl=${encodeURIComponent(
+        this.$props.page_url
+      )}&title=${encodeURIComponent(
+        this.$props.page_title
+      )}&caption=${encodeURIComponent(
+        this.$props.page_description
+      )}&posttype=link`;
+
+      // onClick event
+      clickEvent(this, "tumblr");
 
-      return window.open(
-        share_url,
-        "Share this",
-        window_config + "toolbar=no,menubar=no,scrollbars=no"
-      );
+      return openPopUpWindow(share_url, width, height);
     },
 
     /**
@@ -135,15 +102,12 @@ export default {
     getShareCounter: function() {
       // Variables
       const script = document.createElement("script");
-      const callback = "vue_goodshare_" + this.getRandomInt(1, 2345);
+      const callback = getCallbackName("vue_goodshare", 9999, 111);
 
       // Create `script` tag with share count URL
-      script.src =
-        "https://api.tumblr.com/v2/share/stats?" +
-        "url=" +
-        encodeURIComponent(this.$props.page_url) +
-        "&callback=" +
-        callback;
+      script.src = `https://api.tumblr.com/v2/share/stats?url=${encodeURIComponent(
+        this.$props.page_url
+      )}&callback=${callback}`;
 
       // Add `script` tag with share count URL
       // to end of `body` tag
@@ -154,7 +118,7 @@ export default {
         if (count) {
           this.counter_tumblr =
             count.response.note_count >= 1000
-              ? this.sliceThousandInt(count.response.note_count)
+              ? sliceThousandInt(count.response.note_count)
               : count.response.note_count;
         }
       };
diff --git a/src/providers/Twitter.vue b/src/providers/Twitter.vue
index 2dbb8af..94ae8a8 100644
--- a/src/providers/Twitter.vue
+++ b/src/providers/Twitter.vue
@@ -21,6 +21,7 @@
 import { clickEvent } from "../helpers/events";
 import { documentHref } from "../helpers/href";
 import { documentTitle } from "../helpers/title";
+import { openPopUpWindow } from "../helpers/popup_window";
 
 export default {
   name: "VueGoodshareTwitter",
@@ -58,34 +59,17 @@ export default {
      * @return {object} a pop-up window
      */
     showShareWindow: function() {
-      click(this, "twitter");
       // Variables
       const width = 640;
-      const height = 640;
-      let left = screen.width / 2 - width / 2;
-      let top = screen.height / 2 - height / 2;
-      const window_config =
-        "width=" +
-        width +
-        ",height=" +
-        height +
-        ",left=" +
-        left +
-        ",top=" +
-        top +
-        ",";
-      const share_url =
-        "https://twitter.com/share?" +
-        "url=" +
-        encodeURIComponent(this.$props.page_url) +
-        "&text=" +
-        encodeURIComponent(this.$props.page_title);
-
-      return window.open(
-        share_url,
-        "Share this",
-        window_config + "toolbar=no,menubar=no,scrollbars=no"
-      );
+      const height = 480;
+      const share_url = `https://twitter.com/share?url=${encodeURIComponent(
+        this.$props.page_url
+      )}&text=${encodeURIComponent(this.$props.page_title)}`;
+
+      // onClick event
+      clickEvent(this, "twitter");
+
+      return openPopUpWindow(share_url, width, height);
     }
   }
 };
diff --git a/src/providers/Viber.vue b/src/providers/Viber.vue
index f693cd2..789a360 100644
--- a/src/providers/Viber.vue
+++ b/src/providers/Viber.vue
@@ -10,15 +10,16 @@
     @click.prevent="showShareWindow"
   >
     <i class="icon-viber" v-if="this.$props.has_icon"></i>
-    <span class="title-social" v-if="this.$props.title_social">{{
-      title_social
-    }}</span>
+    <span class="title-social" v-if="this.$props.title_social">
+      {{ title_social }}
+    </span>
   </a>
 </template>
 
 <script>
 import { clickEvent } from "../helpers/events";
 import { documentHref } from "../helpers/href";
+import { openPopUpWindow } from "../helpers/popup_window";
 
 export default {
   name: "VueGoodshareViber",
@@ -52,30 +53,17 @@ export default {
      * @return {object} a pop-up window
      */
     showShareWindow: function() {
-      click(this, "viber");
       // Variables
       const width = 640;
-      const height = 640;
-      let left = screen.width / 2 - width / 2;
-      let top = screen.height / 2 - height / 2;
-      const window_config =
-        "width=" +
-        width +
-        ",height=" +
-        height +
-        ",left=" +
-        left +
-        ",top=" +
-        top +
-        ",";
-      const share_url =
-        "viber://forward?" + "text=" + encodeURIComponent(this.$props.page_url);
-
-      return window.open(
-        share_url,
-        "Share this",
-        window_config + "toolbar=no,menubar=no,scrollbars=no"
-      );
+      const height = 480;
+      const share_url = `viber://forward?text=${encodeURIComponent(
+        this.$props.page_url
+      )}`;
+
+      // onClick event
+      clickEvent(this, "viber");
+
+      return openPopUpWindow(share_url, width, height);
     }
   }
 };
diff --git a/src/providers/Vkontakte.vue b/src/providers/Vkontakte.vue
index 2ffcfe9..e5b2a2c 100644
--- a/src/providers/Vkontakte.vue
+++ b/src/providers/Vkontakte.vue
@@ -14,15 +14,16 @@
     @click.prevent="showShareWindow"
   >
     <i class="icon-vkontakte" v-if="this.$props.has_icon"></i>
-    <span class="title-social" v-if="this.$props.title_social">{{
-      title_social
-    }}</span>
+    <span class="title-social" v-if="this.$props.title_social">
+      {{ title_social }}
+    </span>
     <span
       class="counter-vkontakte"
       v-model="counter_vkontakte"
       v-if="this.$props.has_counter"
-      >{{ counter_vkontakte }}</span
     >
+      {{ counter_vkontakte }}
+    </span>
   </a>
 </template>
 
@@ -32,6 +33,8 @@ import { documentHref } from "../helpers/href";
 import { documentTitle } from "../helpers/title";
 import { metaDescription } from "../helpers/description";
 import { linkAppleTouchIcon } from "../helpers/icon";
+import { sliceThousandInt } from "../helpers/count_number";
+import { openPopUpWindow } from "../helpers/popup_window";
 
 export default {
   name: "VueGoodshareVkontakte",
@@ -73,71 +76,31 @@ export default {
     };
   },
   methods: {
-    /**
-     * Get a random integer between `min` and `max`.
-     *
-     * @param {number} min - min number
-     * @param {number} max - max number
-     * @return {number} a random integer
-     */
-    getRandomInt: (min, max) => {
-      return Math.floor(Math.random() * (max - min + 1) + min);
-    },
-
-    /**
-     * Slice thousand integer and add `k` letter.
-     *
-     * @param {number} number - thousand integer
-     * @return {string} a integer with letter
-     */
-    sliceThousandInt: number => {
-      return (number / 1000).toFixed(1) + "k";
-    },
-
     /**
      * Show share window.
      *
      * @return {object} a pop-up window
      */
     showShareWindow: function() {
-      click(this, "vkontakte");
       // Variables
       const width = 640;
-      const height = 640;
-      let left = screen.width / 2 - width / 2;
-      let top = screen.height / 2 - height / 2;
-      const window_config =
-        "width=" +
-        width +
-        ",height=" +
-        height +
-        ",left=" +
-        left +
-        ",top=" +
-        top +
-        ",";
-      const share_url =
-        "https://vk.com/share.php?" +
-        "url=" +
-        encodeURIComponent(this.$props.page_url) +
-        "&title=" +
-        encodeURIComponent(this.$props.page_title) +
-        "&description=" +
-        encodeURIComponent(this.$props.page_description) +
-        "&image=" +
-        encodeURIComponent(this.$props.page_image) +
-        "&noparse=true";
+      const height = 480;
+      const share_url = `https://vk.com/share.php?url=${encodeURIComponent(
+        this.$props.page_url
+      )}&title=${encodeURIComponent(
+        this.$props.page_title
+      )}&description=${encodeURIComponent(
+        this.$props.page_description
+      )}&image=${encodeURIComponent(this.$props.page_image)}&noparse=true`;
+
+      // onClick event
+      clickEvent(this, "vkontakte");
 
-      return window.open(
-        share_url,
-        "Share this",
-        window_config + "toolbar=no,menubar=no,scrollbars=no"
-      );
+      return openPopUpWindow(share_url, width, height);
     },
 
     handleUpdateCount(count) {
-      this.counter_vkontakte =
-        count >= 1000 ? this.sliceThousandInt(count) : count;
+      this.counter_vkontakte = count >= 1000 ? sliceThousandInt(count) : count;
     },
 
     /**
@@ -159,12 +122,10 @@ export default {
       const script = document.createElement("script");
 
       // Create `script` tag with share count URL
-      script.src =
-        "https://vk.com/share.php?act=count" +
-        "&index=" +
-        this.getRandomInt(1, 2345) +
-        "&url=" +
-        encodeURIComponent(this.$props.page_url);
+      script.src = `https://vk.com/share.php?act=count&index=${this.getRandomInt(
+        1,
+        2345
+      )}&url=${encodeURIComponent(this.$props.page_url)}`;
 
       // Add `script` tag with share count URL
       // to end of `body` tag
@@ -173,9 +134,7 @@ export default {
       // Set share count to `counter_vkontakte` v-model
       window.VK = Object.assign({}, { Share: {} }, window.VK);
       window.VK.Share.count = (index, count) => {
-        if (count) {
-          this.$root.$emit("VK:Share:count:update", count);
-        }
+        if (count) this.$root.$emit("VK:Share:count:update", count);
       };
     }
   },
diff --git a/src/providers/WhatsApp.vue b/src/providers/WhatsApp.vue
index a256c63..4a862db 100644
--- a/src/providers/WhatsApp.vue
+++ b/src/providers/WhatsApp.vue
@@ -10,15 +10,16 @@
     @click.prevent="showShareWindow"
   >
     <i class="icon-whatsapp" v-if="this.$props.has_icon"></i>
-    <span class="title-social" v-if="this.$props.title_social">{{
-      title_social
-    }}</span>
+    <span class="title-social" v-if="this.$props.title_social">
+      {{ title_social }}
+    </span>
   </a>
 </template>
 
 <script>
 import { clickEvent } from "../helpers/events";
 import { documentHref } from "../helpers/href";
+import { openPopUpWindow } from "../helpers/popup_window";
 
 export default {
   name: "VueGoodshareWhatsApp",
@@ -52,30 +53,17 @@ export default {
      * @return {object} a pop-up window
      */
     showShareWindow: function() {
-      click(this, "whatsApp");
       // Variables
       const width = 640;
-      const height = 640;
-      let left = screen.width / 2 - width / 2;
-      let top = screen.height / 2 - height / 2;
-      const window_config =
-        "width=" +
-        width +
-        ",height=" +
-        height +
-        ",left=" +
-        left +
-        ",top=" +
-        top +
-        ",";
-      const share_url =
-        "whatsapp://send?" + "text=" + encodeURIComponent(this.$props.page_url);
-
-      return window.open(
-        share_url,
-        "Share this",
-        window_config + "toolbar=no,menubar=no,scrollbars=no"
-      );
+      const height = 480;
+      const share_url = `whatsapp://send?text=${encodeURIComponent(
+        this.$props.page_url
+      )}`;
+
+      // onClick event
+      clickEvent(this, "whatsapp");
+
+      return openPopUpWindow(share_url, width, height);
     }
   }
 };