Misterzym
/
vue-share-buttons
mirror of https://github.com/misterzym/vue-share-buttons
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Changed property name

dependabot/npm_and_yarn/lodash-4.17.19
Alexandrshy 6 years ago
parent
7f632a859c
commit
b1d322d1e8
27 changed files with 387 additions and 501 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      .gitignore
  2. 2
      package.json
  3. 78
      src/VueShareBttons.vue
  4. 35
      src/components/BloggerButton.vue
  5. 29
      src/components/DiggButton.vue
  6. 34
      src/components/EmailButton.vue
  7. 30
      src/components/EvernoteButton.vue
  8. 29
      src/components/FacebookButton.vue
  9. 36
      src/components/FacebookMessengerButton.vue
  10. 31
      src/components/HatenaButton.vue
  11. 31
      src/components/InstapaperButton.vue
  12. 29
      src/components/LinkedInButton.vue
  13. 31
      src/components/LiveJournalButton.vue
  14. 33
      src/components/OdnoklassnikiButton.vue
  15. 37
      src/components/PinterestButton.vue
  16. 34
      src/components/PocketButton.vue
  17. 38
      src/components/RedditButton.vue
  18. 38
      src/components/RenrenButton.vue
  19. 38
      src/components/TelegramButton.vue
  20. 39
      src/components/TumblrButton.vue
  21. 31
      src/components/TwitterButton.vue
  22. 36
      src/components/ViberButton.vue
  23. 35
      src/components/VkontakteButton.vue
  24. 37
      src/components/WeiboButton.vue
  25. 28
      src/components/WhatsAppButton.vue
  26. 34
      src/components/XingButton.vue
  27. 31
      src/style/facebookMessengerButton.css

4
.gitignore vendored
Unescape View File

@ -19,3 +19,7 @@ yarn-error.log*
*.njsproj
*.sln
*.sw*
# Customer
/src/main.js
/public

2
package.json
Unescape View File

@ -1,6 +1,6 @@
{
"name": "vue-share-buttons",
"version": "0.1.7",
"version": "1.0.0",
"private": false,
"license": "MIT",
"homepage": "https://github.com/Alexandrshy/vue-share-buttons",

78
src/VueShareBttons.vue
Unescape View File

@ -188,31 +188,93 @@
shareTitle="Comment"
btnText
></facebook-button>
<facebook-button v-bind:hasIcon="false" shareTitle="Comment"></facebook-button>
<facebook-button class="share-button--circle" shareTitle="Comment"></facebook-button>
<facebook-button class="share-button--circle" shareTitle="Comment" btnText></facebook-button>
<facebook-button class="share-button--circle" shareTitle="Comment" v-bind:hasIcon="false"></facebook-button>
<facebook-button class="share-button--outline" shareTitle="Comment"></facebook-button>
<facebook-button v-bind:hasIcon="false" shareTitle="Comment" hasCounter></facebook-button>
<facebook-button class="share-button--circle" shareTitle="Comment" hasCounter></facebook-button>
<facebook-button class="share-button--circle" shareTitle="Comment" btnText hasCounter></facebook-button>
<facebook-button
class="share-button--circle"
shareTitle="Comment"
v-bind:hasIcon="false"
hasCounter
></facebook-button>
<facebook-button class="share-button--outline" shareTitle="Comment" hasCounter></facebook-button>
<facebook-button
class="share-button--outline"
v-bind:isBlank="false"
shareText="Twiiter share good work"
shareTitle="Comment"
btnText
hasCounter
></facebook-button>
<facebook-button
class="share-button--outline"
shareTitle="Comment"
v-bind:hasIcon="false"
hasCounter
></facebook-button>
<facebook-button class="share-button--outline" hasCounter></facebook-button>
<facebook-button
class="share-button--circle share-button--outline"
shareTitle="Comment"
hasCounter
></facebook-button>
<facebook-button class="share-button--outline" shareTitle="Comment" v-bind:hasIcon="false"></facebook-button>
<facebook-button class="share-button--circle share-button--outline" shareTitle="Comment"></facebook-button>
<facebook-button
class="share-button--circle share-button--outline"
shareTitle="Comment"
btnText
hasCounter
></facebook-button>
<facebook-button
class="share-button--circle share-button--outline"
shareTitle="Comment"
v-bind:hasIcon="false"
hasCounter
></facebook-button>
</div>
<div class="share-buttons-group">
<facebook-messenger-button shareTitle="Comment"></facebook-messenger-button>
<facebook-messenger-button
v-bind:isBlank="false"
shareText="Twiiter share good work"
shareTitle="Comment"
btnText
></facebook-messenger-button>
<facebook-messenger-button v-bind:hasIcon="false" shareTitle="Comment"></facebook-messenger-button>
<facebook-messenger-button class="share-button--circle" shareTitle="Comment"></facebook-messenger-button>
<facebook-messenger-button class="share-button--circle" shareTitle="Comment" btnText></facebook-messenger-button>
<facebook-messenger-button
class="share-button--circle"
shareTitle="Comment"
v-bind:hasIcon="false"
></facebook-messenger-button>
<facebook-messenger-button class="share-button--outline" shareTitle="Comment"></facebook-messenger-button>
<facebook-messenger-button
class="share-button--outline"
v-bind:isBlank="false"
shareText="Twiiter share good work"
shareTitle="Comment"
btnText
></facebook-messenger-button>
<facebook-messenger-button
class="share-button--outline"
shareTitle="Comment"
v-bind:hasIcon="false"
></facebook-messenger-button>
<facebook-messenger-button
class="share-button--circle share-button--outline"
shareTitle="Comment"
></facebook-messenger-button>
<facebook-messenger-button
class="share-button--circle share-button--outline"
shareTitle="Comment"
btnText
></facebook-messenger-button>
<facebook-messenger-button
class="share-button--circle share-button--outline"
shareTitle="Comment"
v-bind:hasIcon="false"
></facebook-messenger-button>
</div>
<div class="share-buttons-group">
<linkedIn-button shareTitle="Comment"></linkedIn-button>
<linkedIn-button
@ -676,6 +738,7 @@ import WeiboButton from "./components/WeiboButton";
import EvernoteButton from "./components/EvernoteButton";
import VkontakteButton from "./components/VkontakteButton";
import FacebookButton from "./components/FacebookButton";
import FacebookMessengerButton from "./components/FacebookMessengerButton";
import LinkedInButton from "./components/LinkedInButton";
import TumblrButton from "./components/TumblrButton";
import PinterestButton from "./components/PinterestButton";
@ -702,6 +765,7 @@ export default {
EvernoteButton,
VkontakteButton,
FacebookButton,
FacebookMessengerButton,
LinkedInButton,
TumblrButton,
PinterestButton,

35
src/components/BloggerButton.vue
Unescape View File

@ -2,14 +2,12 @@
<button
class="share-button share-button--blogger"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:title="title"
:description="description"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
@ -36,25 +34,26 @@ export default {
name: "BloggerShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
title: { type: String, default: "" },
description: { type: String, default: getDocumentTitle },
btnText: { type: String, default: "Blogger" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "Blogger" });
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `https://www.blogger.com/blog-this.g?u=${
this.$props.shareUrl
}&n=${encodeURIComponent(this.$props.shareTitle)}&t=${encodeURIComponent(
this.$props.shareDescription
this.$props.url
}&n=${encodeURIComponent(this.$props.title)}&t=${encodeURIComponent(
this.$props.description
)}`;
return this.$props.isBlank

29
src/components/DiggButton.vue
Unescape View File

@ -2,14 +2,10 @@
<button
class="share-button share-button--digg"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
@ -25,25 +21,16 @@
<script>
import Icon from "./icon/Icon.vue";
import {
getDocumentHref,
getDocumentTitle,
eventEmit,
createWindow
} from "../helpers";
import { getDocumentHref, eventEmit, createWindow } from "../helpers";
export default {
name: "DiggShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
btnText: { type: String, default: "Digg" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
},
@ -52,7 +39,7 @@ export default {
eventEmit(this, "onShare", { name: "Digg" });
const configWindow = createWindow();
const url = `http://digg.com/submit?url=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}`;
return this.$props.isBlank

34
src/components/EmailButton.vue
Unescape View File

@ -2,16 +2,9 @@
<button
class="share-button share-button--email"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
>
<icon
@ -31,39 +24,24 @@
<script>
import Icon from "./icon/Icon.vue";
import {
getDocumentHref,
getDocumentTitle,
eventEmit,
createWindow
} from "../helpers";
import { getDocumentHref, eventEmit } from "../helpers";
export default {
name: "EmailShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
btnText: { type: String, default: "Email" },
windowWidth: { type: Number },
windowHeight: { type: Number },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
hasIcon: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "Email" });
const configWindow = createWindow();
const url = `mailto:?subject=Share%20Link&body=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}`;
return this.$props.isBlank
? window.open(url, "__blank")
: window.open(url, "Share this", configWindow);
return window.open(url);
}
}
};

30
src/components/EvernoteButton.vue
Unescape View File

@ -2,13 +2,11 @@
<button
class="share-button share-button--evernote"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareDescription="shareDescription"
:shareTitle="shareTitle"
:url="url"
:description="description"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
@ -35,24 +33,24 @@ export default {
name: "EvernoteShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
description: { type: String, default: getDocumentTitle },
btnText: { type: String, default: "Evernote" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "Evernote" });
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `https://www.evernote.com/clip.action?url=${encodeURIComponent(
this.$props.shareUrl
)}&title=${encodeURIComponent(this.$props.shareDescription)}`;
this.$props.url
)}&title=${encodeURIComponent(this.$props.description)}`;
return this.$props.isBlank
? window.open(url, "__blank")

29
src/components/FacebookButton.vue
Unescape View File

@ -2,13 +2,10 @@
<button
class="share-button share-button--facebook"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareDescription="shareDescription"
:shareTitle="shareTitle"
:url="url"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:hasCounter="hasCounter"
:digitsCounter="digitsCounter"
@ -30,7 +27,6 @@
import Icon from "./icon/Icon.vue";
import {
getDocumentHref,
getDocumentTitle,
eventEmit,
createWindow,
getRandomNumber,
@ -41,14 +37,10 @@ export default {
name: "FacebookShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
btnText: { type: String, default: "Facebook" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
hasCounter: { type: Boolean, default: false },
digitsCounter: { type: Number, default: 0 },
@ -68,9 +60,12 @@ export default {
} else {
eventEmit(this, "onShare", { name: "Facebook" });
}
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `https://www.facebook.com/sharer/sharer.php?u=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}`;
return this.$props.isBlank
@ -83,7 +78,7 @@ export default {
this.$props.keyCounter || `Facebook_${getRandomNumber()}`;
const script = document.createElement("script");
script.src = `https://graph.facebook.com?id=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}&callback=${callback}`;
document.body.appendChild(script);

36
src/components/FacebookMessengerButton.vue
Unescape View File

@ -2,15 +2,10 @@
<button
class="share-button share-button--facebookMessenger"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareDescription="shareDescription"
:shareTitle="shareTitle"
:appID="appID"
:url="url"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
>
<icon iconName="FacebookMessenger" class="share-button__icon" v-if="hasIcon === true">
@ -24,40 +19,25 @@
<script>
import Icon from "./icon/Icon.vue";
import {
getDocumentHref,
getDocumentTitle,
eventEmit,
createWindow
} from "../helpers";
import { getDocumentHref, eventEmit } from "../helpers";
export default {
name: "FacebookMessengerShareButton",
components: { Icon },
props: {
appID: { type: String },
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
btnText: { type: String, default: "FacebookMessenger" },
windowWidth: { type: Number },
windowHeight: { type: Number },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
url: { type: String, default: getDocumentHref },
btnText: { type: String, default: "Messenger" },
hasIcon: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "FacebookMessenger" });
const configWindow = createWindow();
const url = `fb-messenger://share/?link=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}&app_id=${this.$props.appID}`;
return this.$props.isBlank
? window.open(url, "__blank")
: window.open(url, "Share this", configWindow);
return window.open(url);
}
}
};

31
src/components/HatenaButton.vue
Unescape View File

@ -2,14 +2,11 @@
<button
class="share-button share-button--hatena"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:description="description"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
@ -36,24 +33,24 @@ export default {
name: "HatenaShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
description: { type: String, default: getDocumentTitle },
btnText: { type: String, default: "Hatena" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "Hatena" });
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `http://b.hatena.ne.jp/bookmarklet?url=${encodeURIComponent(
this.$props.shareUrl
)}&btitle=${encodeURIComponent(this.$props.shareDescription)}`;
this.$props.url
)}&btitle=${encodeURIComponent(this.$props.description)}`;
return this.$props.isBlank
? window.open(url, "__blank")

31
src/components/InstapaperButton.vue
Unescape View File

@ -2,14 +2,11 @@
<button
class="share-button share-button--instapaper"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:description="description"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
@ -36,24 +33,24 @@ export default {
name: "InstapaperShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
description: { type: String, default: getDocumentTitle },
btnText: { type: String, default: "Instapaper" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "Instapaper" });
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `https://www.instapaper.com/edit?url=${encodeURIComponent(
this.$props.shareUrl
)}&title=${encodeURIComponent(this.$props.shareDescription)}`;
this.$props.url
)}&title=${encodeURIComponent(this.$props.description)}`;
return this.$props.isBlank
? window.open(url, "__blank")

29
src/components/LinkedInButton.vue
Unescape View File

@ -2,13 +2,10 @@
<button
class="share-button share-button--linkedIn"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareDescription="shareDescription"
:shareTitle="shareTitle"
:url="url"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:hasCounter="hasCounter"
:digitsCounter="digitsCounter"
@ -30,7 +27,6 @@
import Icon from "./icon/Icon.vue";
import {
getDocumentHref,
getDocumentTitle,
eventEmit,
createWindow,
getRandomNumber,
@ -41,14 +37,10 @@ export default {
name: "LinkedInShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
btnText: { type: String, default: "LinkedIn" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
hasCounter: { type: Boolean, default: false },
digitsCounter: { type: Number, default: 0 },
@ -68,9 +60,12 @@ export default {
} else {
eventEmit(this, "onShare", { name: "LinkedIn" });
}
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `https://www.linkedin.com/shareArticle?url=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}`;
return this.$props.isBlank
@ -83,7 +78,7 @@ export default {
this.$props.keyCounter || `LinkedIn_${getRandomNumber()}`;
const script = document.createElement("script");
script.src = `https://www.linkedin.com/countserv/count/share?url=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}&callback=${callback}`;
document.body.appendChild(script);

31
src/components/LiveJournalButton.vue
Unescape View File

@ -2,14 +2,11 @@
<button
class="share-button share-button--livejournal"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:description="description"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
@ -36,24 +33,24 @@ export default {
name: "LiveJournalShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
description: { type: String, default: getDocumentTitle },
btnText: { type: String, default: "LiveJournal" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "LiveJournal" });
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `https://livejournal.com/update.bml?event=${encodeURIComponent(
this.$props.shareDescription
)}&subject=${encodeURIComponent(this.$props.shareUrl)}`;
this.$props.description
)}&subject=${encodeURIComponent(this.$props.url)}`;
return this.$props.isBlank
? window.open(url, "__blank")

33
src/components/OdnoklassnikiButton.vue
Unescape View File

@ -2,14 +2,11 @@
<button
class="share-button share-button--odnoklassniki"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:description="description"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:hasCounter="hasCounter"
:digitsCounter="digitsCounter"
@ -40,14 +37,11 @@ export default {
name: "OdnoklassnikiShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
description: { type: String, default: getDocumentTitle },
btnText: { type: String, default: "Odnoklassniki" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
hasCounter: { type: Boolean, default: false },
digitsCounter: { type: Number, default: 0 },
@ -66,10 +60,13 @@ export default {
} else {
eventEmit(this, "onShare", { name: "Odnoklassniki" });
}
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `https://www.odnoklassniki.ru/dk?st.cmd=addShare&st.s=1&st._surl=${encodeURIComponent(
this.$props.shareUrl
)}&st.comments=${encodeURIComponent(this.$props.shareTitle)}`;
this.$props.url
)}&st.comments=${encodeURIComponent(this.$props.description)}`;
return this.$props.isBlank
? window.open(url, "__blank")
@ -83,7 +80,7 @@ export default {
const script = document.createElement("script");
script.src = `https://connect.ok.ru/dk?st.cmd=extLike&uid=1&ref=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}`;
document.body.appendChild(script);

37
src/components/PinterestButton.vue
Unescape View File

@ -2,14 +2,12 @@
<button
class="share-button share-button--pinterest"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:description="description"
:picture="picture"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:hasCounter="hasCounter"
:digitsCounter="digitsCounter"
@ -42,14 +40,12 @@ export default {
name: "PinterestShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
description: { type: String, default: getDocumentTitle },
picture: { type: String, default: "" },
btnText: { type: String, default: "Pinterest" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number },
modalHeight: { type: Number },
hasIcon: { type: Boolean, default: true },
hasCounter: { type: Boolean, default: false },
digitsCounter: { type: Number, default: 0 },
@ -69,12 +65,15 @@ export default {
} else {
eventEmit(this, "onShare", { name: "Pinterest" });
}
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `https://www.pinterest.com/pin/create/button/?canonicalUrl=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}&description=${encodeURIComponent(
this.$props.shareDescription
)}&media=${encodeURIComponent(this.$props.sharePic)}`;
this.$props.description
)}&media=${encodeURIComponent(this.$props.picture)}`;
return this.$props.isBlank
? window.open(url, "__blank")
@ -86,7 +85,7 @@ export default {
this.$props.keyCounter || `Pinterest_${getRandomNumber()}`;
const script = document.createElement("script");
script.src = `https://api.pinterest.com/v1/urls/count.json?url=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}&callback=${callback}`;
document.body.appendChild(script);

34
src/components/PocketButton.vue
Unescape View File

@ -2,14 +2,10 @@
<button
class="share-button share-button--pocket"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
@ -25,34 +21,28 @@
<script>
import Icon from "./icon/Icon.vue";
import {
getDocumentHref,
getDocumentTitle,
eventEmit,
createWindow
} from "../helpers";
import { getDocumentHref, eventEmit, createWindow } from "../helpers";
export default {
name: "PocketShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
btnText: { type: String, default: "Pocket" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number },
modalHeight: { type: Number },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "Pocket" });
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `https://getpocket.com/edit?url=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}`;
return this.$props.isBlank

38
src/components/RedditButton.vue
Unescape View File

@ -2,14 +2,11 @@
<button
class="share-button share-button--reddit"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:title="title"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
@ -25,35 +22,30 @@
<script>
import Icon from "./icon/Icon.vue";
import {
getDocumentHref,
getDocumentTitle,
eventEmit,
createWindow
} from "../helpers";
import { getDocumentHref, eventEmit, createWindow } from "../helpers";
export default {
name: "RedditShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
title: { type: String, default: "" },
btnText: { type: String, default: "Reddit" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number },
modalHeight: { type: Number },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "Reddit" });
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `https://reddit.com/submit?url=${encodeURIComponent(
this.$props.shareUrl
)}&title=${encodeURIComponent(this.$props.shareTitle)}`;
this.$props.url
)}&title=${encodeURIComponent(this.$props.title)}`;
return this.$props.isBlank
? window.open(url, "__blank")

38
src/components/RenrenButton.vue
Unescape View File

@ -2,14 +2,11 @@
<button
class="share-button share-button--renren"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:title="title"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
@ -28,35 +25,30 @@
<script>
import Icon from "./icon/Icon.vue";
import {
getDocumentHref,
getDocumentTitle,
eventEmit,
createWindow
} from "../helpers";
import { getDocumentHref, eventEmit, createWindow } from "../helpers";
export default {
name: "RenrenShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
title: { type: String, default: "" },
btnText: { type: String, default: "Renren" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "Renren" });
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `http://share.renren.com/share/buttonshare.do?link=${encodeURIComponent(
this.$props.shareUrl
)}&title=${encodeURIComponent(this.$props.shareTitle)}`;
this.$props.url
)}&title=${encodeURIComponent(this.$props.title)}`;
return this.$props.isBlank
? window.open(url, "__blank")

38
src/components/TelegramButton.vue
Unescape View File

@ -2,16 +2,10 @@
<button
class="share-button share-button--telegram"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:description="description"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
>
<icon iconName="Telegram" class="share-button__icon" v-if="hasIcon === true">
@ -27,39 +21,25 @@
<script>
import Icon from "./icon/Icon.vue";
import {
getDocumentHref,
getDocumentTitle,
eventEmit,
createWindow
} from "../helpers";
import { getDocumentHref, getDocumentTitle, eventEmit } from "../helpers";
export default {
name: "TelegramShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
description: { type: String, default: getDocumentTitle },
btnText: { type: String, default: "Telegram" },
windowWidth: { type: Number },
windowHeight: { type: Number },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
hasIcon: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "Telegram" });
const configWindow = createWindow();
const url = `https://telegram.me/share/url?url=${encodeURIComponent(
this.$props.shareUrl
)}&text=${encodeURIComponent(this.$props.shareDescription)}`;
this.$props.url
)}&text=${encodeURIComponent(this.$props.description)}`;
return this.$props.isBlank
? window.open(url, "__blank")
: window.open(url, "Share this", configWindow);
return window.open(url);
}
}
};

39
src/components/TumblrButton.vue
Unescape View File

@ -2,14 +2,12 @@
<button
class="share-button share-button--tumblr"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:title="title"
:description="description"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:hasCounter="hasCounter"
:digitsCounter="digitsCounter"
@ -42,14 +40,12 @@ export default {
name: "TumblrShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
title: { type: String, default: "" },
description: { type: String, default: getDocumentTitle },
btnText: { type: String, default: "Tumblr" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
hasCounter: { type: Boolean, default: false },
digitsCounter: { type: Number, default: 0 },
@ -69,14 +65,15 @@ export default {
} else {
eventEmit(this, "onShare", { name: "Tumblr" });
}
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `https://www.tumblr.com/widgets/share/tool?canonicalUrl=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}&title=${encodeURIComponent(
this.$props.shareTitle
)}&caption=${encodeURIComponent(
this.$props.shareDescription
)}&posttype=link`;
this.$props.title
)}&caption=${encodeURIComponent(this.$props.description)}&posttype=link`;
return this.$props.isBlank
? window.open(url, "__blank")
@ -87,7 +84,7 @@ export default {
const callback = this.$props.keyCounter || `Tumblr_${getRandomNumber()}`;
const script = document.createElement("script");
script.src = `https://api.tumblr.com/v2/share/stats?url=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}&callback=${callback}`;
document.body.appendChild(script);

31
src/components/TwitterButton.vue
Unescape View File

@ -2,14 +2,11 @@
<button
class="share-button share-button--twitter"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:description="description"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
@ -36,24 +33,24 @@ export default {
name: "TwitterShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
description: { type: String, default: getDocumentTitle },
btnText: { type: String, default: "Twitter" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "Twitter" });
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `https://twitter.com/share?url=${encodeURIComponent(
this.$props.shareUrl
)}&text=${encodeURIComponent(this.$props.shareDescription)}`;
this.$props.url
)}&text=${encodeURIComponent(this.$props.description)}`;
return this.$props.isBlank
? window.open(url, "__blank")

36
src/components/ViberButton.vue
Unescape View File

@ -2,16 +2,9 @@
<button
class="share-button share-button--viber"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
>
<icon iconName="Viber" class="share-button__icon" v-if="hasIcon === true">
@ -37,39 +30,22 @@
<script>
import Icon from "./icon/Icon.vue";
import {
getDocumentHref,
getDocumentTitle,
eventEmit,
createWindow
} from "../helpers";
import { getDocumentHref, eventEmit } from "../helpers";
export default {
name: "ViberShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
btnText: { type: String, default: "Viber" },
windowWidth: { type: Number },
windowHeight: { type: Number },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
hasIcon: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "Viber" });
const configWindow = createWindow();
const url = `viber://forward?text=${encodeURIComponent(
this.$props.shareUrl
)}`;
const url = `viber://forward?text=${encodeURIComponent(this.$props.url)}`;
return this.$props.isBlank
? window.open(url, "__blank")
: window.open(url, "Share this", configWindow);
return window.open(url);
}
}
};

35
src/components/VkontakteButton.vue
Unescape View File

@ -2,13 +2,12 @@
<button
class="share-button share-button--vk"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareDescription="shareDescription"
:shareTitle="shareTitle"
:url="url"
:description="description"
:title="title"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:hasCounter="hasCounter"
:digitsCounter="digitsCounter"
@ -40,14 +39,13 @@ export default {
name: "VkontakteShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
url: { type: String, default: getDocumentHref },
title: { type: String, default: "" },
description: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
btnText: { type: String, default: "Vkontakte" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
hasCounter: { type: Boolean, default: false },
digitsCounter: { type: Number, default: 0 },
@ -66,13 +64,16 @@ export default {
} else {
eventEmit(this, "onShare", { name: "vk" });
}
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `https://vk.com/share.php?url=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}&title=${encodeURIComponent(
this.$props.shareTitle
this.$props.title
)}&comment=${encodeURIComponent(
this.$props.shareDescription
this.$props.description
)}&image=${encodeURIComponent(this.$props.sharePic)}&noparse=true`;
return this.$props.isBlank
@ -91,7 +92,7 @@ export default {
const script = document.createElement("script");
script.src = `https://vk.com/share.php?act=count&index=${getRandomNumber()}&url=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}`;
document.body.appendChild(script);

37
src/components/WeiboButton.vue
Unescape View File

@ -2,14 +2,13 @@
<button
class="share-button share-button--weibo"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:title="title"
:description="description"
:picture="picture"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
@ -36,26 +35,28 @@ export default {
name: "WeiboShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
title: { type: String, default: "" },
description: { type: String, default: getDocumentTitle },
picture: { type: String, default: "" },
btnText: { type: String, default: "Weibo" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "Weibo" });
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `http://service.weibo.com/share/share.php?url=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}&title=${encodeURIComponent(
this.$props.shareTitle
)}&pic=${encodeURIComponent(this.$props.sharePic)}`;
this.$props.title
)}&pic=${encodeURIComponent(this.$props.picture)}`;
return this.$props.isBlank
? window.open(url, "__blank")

28
src/components/WhatsAppButton.vue
Unescape View File

@ -2,16 +2,9 @@
<button
class="share-button share-button--whatsApp"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
>
<icon iconName="WhatsApp" class="share-button__icon" v-if="hasIcon === true">
@ -25,39 +18,24 @@
<script>
import Icon from "./icon/Icon.vue";
import {
getDocumentHref,
getDocumentTitle,
eventEmit,
createWindow
} from "../helpers";
import { getDocumentHref, eventEmit } from "../helpers";
export default {
name: "WhatsAppShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
btnText: { type: String, default: "WhatsApp" },
windowWidth: { type: Number },
windowHeight: { type: Number },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
hasIcon: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "WhatsApp" });
const configWindow = createWindow();
const url = `whatsapp://send?text=${encodeURIComponent(
this.$props.shareUrl
)}`;
return this.$props.isBlank
? window.open(url, "__blank")
: window.open(url, "Share this", configWindow);
return window.open(url);
}
}
};

34
src/components/XingButton.vue
Unescape View File

@ -2,14 +2,10 @@
<button
class="share-button share-button--xing"
type="button"
:class="className"
:shareUrl="shareUrl"
:shareTitle="shareTitle"
:shareDescription="shareDescription"
:sharePic="sharePic"
:url="url"
:btnText="btnText"
:windowWidth="windowWidth"
:windowHeight="windowHeight"
:modalWidth="modalWidth"
:modalHeight="modalHeight"
:hasIcon="hasIcon"
:isBlank="isBlank"
@click="openShareWindow"
@ -25,34 +21,28 @@
<script>
import Icon from "./icon/Icon.vue";
import {
getDocumentHref,
getDocumentTitle,
eventEmit,
createWindow
} from "../helpers";
import { getDocumentHref, eventEmit, createWindow } from "../helpers";
export default {
name: "XingShareButton",
components: { Icon },
props: {
className: { type: String },
shareUrl: { type: String, default: getDocumentHref },
shareTitle: { type: String, default: "" },
shareDescription: { type: String, default: getDocumentTitle },
sharePic: { type: String, default: "" },
url: { type: String, default: getDocumentHref },
btnText: { type: String, default: "Xing" },
windowWidth: { type: Number },
windowHeight: { type: Number },
modalWidth: { type: Number, default: 500 },
modalHeight: { type: Number, default: 500 },
hasIcon: { type: Boolean, default: true },
isBlank: { type: Boolean, default: true }
},
methods: {
openShareWindow() {
eventEmit(this, "onShare", { name: "Xing" });
const configWindow = createWindow();
const configWindow = createWindow(
this.$props.modalWidth,
this.$props.modalHeight
);
const url = `https://www.xing.com/social_plugins/share?url=${encodeURIComponent(
this.$props.shareUrl
this.$props.url
)}`;
return this.$props.isBlank

31
src/style/facebookMessengerButton.css
Unescape View File

@ -1,51 +1,56 @@
/* Facebook */
.share-button--facebook {
/* facebookMessenger */
.share-button--facebookMessenger {
background-color: hsla(221, 44%, 41%, 1);
}
.share-button--facebook:focus {
.share-button--facebookMessenger:focus {
box-shadow: 0 0 0 3px hsla(221, 38%, 66%, 0.4);
}
.share-button--facebook:hover {
.share-button--facebookMessenger:hover {
background-color: hsla(221, 44%, 41%, 0.9);
}
.share-button--facebook .share-button__icon path {
.share-button--facebookMessenger .share-button__icon path {
fill: #fff;
}
.share-button--facebook.share-button--outline {
.share-button--facebookMessenger.share-button--outline {
background-color: transparent;
border-color: hsl(221, 44%, 41%, 1);
}
.share-button--facebook.share-button--outline:hover {
.share-button--facebookMessenger.share-button--outline:hover {
background-color: transparent;
border-color: hsla(221, 44%, 41%, 0.9);
}
.share-button--facebook.share-button--outline .share-button__text {
.share-button--facebookMessenger.share-button--outline .share-button__text {
color: hsla(221, 44%, 41%, 1);
}
.share-button--facebook.share-button--outline:hover .share-button__text {
.share-button--facebookMessenger.share-button--outline:hover
.share-button__text {
color: hsla(221, 44%, 41%, 0.9);
}
.share-button--facebook.share-button--outline .share-button__icon path {
.share-button--facebookMessenger.share-button--outline
.share-button__icon
path {
fill: hsla(221, 44%, 41%, 1);
}
.share-button--facebook.share-button--outline:hover .share-button__icon path {
.share-button--facebookMessenger.share-button--outline:hover
.share-button__icon
path {
fill: hsla(221, 44%, 41%, 0.9);
}
.share-button--facebook.share-button--painted {
.share-button--facebookMessenger.share-button--painted {
background-color: transparent;
border-color: hsla(220, 21%, 31%, 1);
}
.share-button--facebook.share-button--painted::before {
.share-button--facebookMessenger.share-button--painted::before {
background-color: hsla(221, 44%, 41%, 1);
}

Write Preview
Loading…
Cancel
Save