UNPKG

shr-buttons

Version:

Simple, customizable sharing buttons

1 lines 11.7 kB
function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _defineProperties(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function _createClass(e,t,n){return t&&_defineProperties(e.prototype,t),n&&_defineProperties(e,n),e}function _defineProperty(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function _slicedToArray(e,t){return _arrayWithHoles(e)||_iterableToArrayLimit(e,t)||_nonIterableRest()}function _arrayWithHoles(e){if(Array.isArray(e))return e}function _iterableToArrayLimit(e,t){var n=[],r=!0,o=!1,i=void 0;try{for(var s,a=e[Symbol.iterator]();!(r=(s=a.next()).done)&&(n.push(s.value),!t||n.length!==t);r=!0);}catch(e){o=!0,i=e}finally{try{r||null==a.return||a.return()}finally{if(o)throw i}}return n}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}var getConstructor=function(e){return null!=e?e.constructor:null},instanceOf=function(e,t){return!!(e&&t&&e instanceof t)},isNullOrUndefined=function(e){return null==e},isObject=function(e){return getConstructor(e)===Object},isNumber=function(e){return getConstructor(e)===Number&&!Number.isNaN(e)},isString=function(e){return getConstructor(e)===String},isBoolean=function(e){return getConstructor(e)===Boolean},isFunction=function(e){return getConstructor(e)===Function},isArray=function(e){return Array.isArray(e)},isNodeList=function(e){return instanceOf(e,NodeList)},isElement=function(e){return instanceOf(e,Element)},isEvent=function(e){return instanceOf(e,Event)},isEmpty=function(e){return isNullOrUndefined(e)||(isString(e)||isArray(e)||isNodeList(e))&&!e.length||isObject(e)&&!Object.keys(e).length},is={nullOrUndefined:isNullOrUndefined,object:isObject,number:isNumber,string:isString,boolean:isBoolean,function:isFunction,array:isArray,nodeList:isNodeList,element:isElement,event:isEvent,empty:isEmpty},constants={facebook:{domain:"facebook.com",url:function(e){return"https://graph.facebook.com/?id=".concat(e,"&fields=og_object{engagement}")},shareCount:function(e){return e.og_object.engagement.count},popup:{width:640,height:360}},twitter:{domain:"twitter.com",url:function(){return null},shareCount:function(){return null},popup:{width:640,height:240}},pinterest:{domain:"pinterest.com",url:function(e){return"https://widgets.pinterest.com/v1/urls/count.json?url=".concat(e)},shareCount:function(e){return e.count},popup:{width:830,height:700}},github:{domain:"github.com",url:function(e,t){return"https://api.github.com/repos/".concat(e).concat(is.string(t)?"?access_token=".concat(t):"")},shareCount:function(e){return e.data.stargazers_count}},youtube:{domain:"youtube.com",url:function(e,t){return"https://www.googleapis.com/youtube/v3/channels?part=statistics&id=".concat(e,"&key=").concat(t)},shareCount:function(e){if(!is.empty(e.error))return null;var t=_slicedToArray(e.items,1)[0];return is.empty(t)?null:t.statistics.subscriberCount}}},defaults={debug:!1,wrapper:{className:"shr"},count:{className:"shr__count",displayZero:!1,format:!0,position:"after",increment:!0},tokens:{github:"",youtube:""},storage:{enabled:!0,key:"shr",ttl:3e5}};function getJSONP(e){return new Promise(function(t,n){var r="jsonp_callback_".concat(Math.round(1e5*Math.random())),o=document.createElement("script");o.addEventListener("error",function(e){return n(e)}),window[r]=function(e){delete window[r],document.body.removeChild(o),t(e)};var i=new URL(e);i.searchParams.set("callback",r),o.setAttribute("src",i.toString()),document.body.appendChild(o)})}var noop=function(){},Console=function(){function e(){var t=!!(0<arguments.length&&void 0!==arguments[0])&&arguments[0];_classCallCheck(this,e),this.enabled=window.console&&t,this.enabled&&this.log("Debugging enabled")}return _createClass(e,[{key:"log",get:function(){return this.enabled?Function.prototype.bind.call(console.log,console):noop}},{key:"warn",get:function(){return this.enabled?Function.prototype.bind.call(console.warn,console):noop}},{key:"error",get:function(){return this.enabled?Function.prototype.bind.call(console.error,console):noop}}]),e}();function matches(e,t){return function(){return Array.from(document.querySelectorAll(t)).includes(this)}.call(e,t)}function wrap(e,t){var n=e.length?e:[e];Array.from(n).reverse().forEach(function(e,n){var r=0<n?t.cloneNode(!0):t,o=e.parentNode,i=e.nextSibling;r.appendChild(e),i?o.insertBefore(r,i):o.appendChild(r)})}function setAttributes(e,t){!is.element(e)||is.empty(t)||Object.entries(t).filter(function(e){var t=_slicedToArray(e,2)[1];return!is.nullOrUndefined(t)}).forEach(function(t){var n=_slicedToArray(t,2),r=n[0],o=n[1];return e.setAttribute(r,o)})}function createElement(e,t,n){var r=document.createElement(e);return is.object(t)&&setAttributes(r,t),is.string(n)&&(r.innerText=n),r}function formatNumber(e){var t=/\./.test(1.1.toLocaleString())?".":",",n=new RegExp("\\".concat(t,"\\d+$"));return Math.round(e).toLocaleString().replace(n,"")}function extend(){for(var e=0<arguments.length&&void 0!==arguments[0]?arguments[0]:{},t=arguments.length,n=Array(1<t?t-1:0),r=1;r<t;r++)n[r-1]=arguments[r];if(!n.length)return e;var o=n.shift();return is.object(o)?(Object.keys(o).forEach(function(t){is.object(o[t])?(!Object.keys(e).includes(t)&&Object.assign(e,_defineProperty({},t,{})),extend(e[t],o[t])):Object.assign(e,_defineProperty({},t,o[t]))}),extend.apply(void 0,[e].concat(n))):e}var Storage=function(){function e(t,n){var r=!(2<arguments.length&&void 0!==arguments[2])||arguments[2];_classCallCheck(this,e),this.enabled=r&&e.supported,this.key=t,this.ttl=n}return _createClass(e,[{key:"get",value:function(t){if(!e.supported||!this.enabled)return null;var n=window.localStorage.getItem(this.key);if(is.empty(n))return null;var r=window.localStorage.getItem("".concat(this.key,"_ttl"));if(is.empty(r)||r<Date.now())return null;var o=JSON.parse(n);return is.string(t)&&t.length?o[t]:o}},{key:"set",value:function(t){if(e.supported&&this.enabled&&is.object(t)){var n=this.get();is.empty(n)&&(n={}),extend(n,t),window.localStorage.setItem(this.key,JSON.stringify(n)),window.localStorage.setItem("".concat(this.key,"_ttl"),Date.now()+this.ttl)}}}],[{key:"supported",get:function(){try{return"localStorage"in window&&(window.localStorage.setItem("___test","___test"),window.localStorage.removeItem("___test"),!0)}catch(e){return!1}}}]),e}();function getDomain(e){var t=new URL(e).hostname,n=t.split("."),r=n.length;return 2<r&&(t="".concat(n[r-2],".").concat(n[r-1]),2===n[r-2].length&&2===n[r-1].length&&(t="".concat(n[r-3],".").concat(t))),t}var Shr=function(){function e(t,n){var r=this;_classCallCheck(this,e),this.elements={count:null,trigger:null,popup:null},is.element(t)?this.elements.trigger=t:is.string(t)&&(this.elements.trigger=document.querySelector(t)),is.element(this.elements.trigger)&&is.empty(this.elements.trigger.shr)&&(this.config=extend({},defaults,n,{networks:constants}),this.console=new Console(this.config.debug),this.storage=new Storage(this.config.storage.key,this.config.storage.ttl,this.config.storage.enabled),this.getCount().then(function(e){return r.updateDisplay(e)}).catch(function(){}),this.listeners(!0),this.elements.trigger.shr=this)}return _createClass(e,[{key:"destroy",value:function(){this.listeners(!1)}},{key:"listeners",value:function(){var e=this,t=!!(0<arguments.length&&void 0!==arguments[0])&&arguments[0]?"addEventListener":"removeEventListener";this.elements.trigger[t]("click",function(t){return e.share(t)},!1)}},{key:"share",value:function(e){var t=this;this.openPopup(e);var n=this.config.count.increment;this.getCount().then(function(e){return t.updateDisplay(e,n)}).catch(function(){})}},{key:"openPopup",value:function(e){if(!is.empty(this.network)&&this.networkConfig.popup){is.event(e)&&e.preventDefault();var t=this.networkConfig.popup,n=t.width,r=t.height,o="shr-popup--".concat(this.network);if(this.popup&&!this.popup.closed)this.popup.focus(),this.console.log("Popup re-focused.");else{var i=void 0===window.screenLeft?window.screen.left:window.screenLeft,s=void 0===window.screenTop?window.screen.top:window.screenTop,a=window.screen.width/2-n/2+i,c=window.screen.height/2-r/2+s;this.popup=window.open(this.href,o,"top=".concat(c,",left=").concat(a,",width=").concat(n,",height=").concat(r)),!this.popup||this.popup.closed||!is.boolean(this.popup.closed)?this.console.error("Popup blocked."):(this.popup.focus(),this.console.log("Popup opened."))}}}},{key:"getCount",value:function(){var e=this,t=!(0<arguments.length&&void 0!==arguments[0])||arguments[0];return new Promise(function(n,r){var o=e.apiUrl;if(is.empty(o))r(new Error("No URL available for ".concat(e.network,".")));else{if(t){var i=e.storage.get(e.target);if(!is.empty(i)&&Object.keys(i).includes(e.network)){var s=i[e.network];return n(is.number(s)?s:0),void e.console.log("getCount for '".concat(e.target,"' for '").concat(e.network,"' resolved from cache."))}}getJSONP(o).then(function(t){var r=0,o=e.elements.trigger.getAttribute("data-shr-display");r=is.empty(o)?e.networkConfig.shareCount(t):t[o],is.empty(r)?r=0:(r=parseInt(r,10),!is.number(r)&&(r=0)),e.storage.set(_defineProperty({},e.target,_defineProperty({},e.network,r))),n(r)}).catch(r)}})}},{key:"updateDisplay",value:function(e){var t=!!(1<arguments.length&&void 0!==arguments[1])&&arguments[1],n=this.config,r=n.count,o=n.wrapper,i=t?e+1:e,s=r.position.toLowerCase();if(0<i||r.displayZero){var a=function(e){return Math.round(i/e*10)/10},c=formatNumber(i);r.format&&(1e6<i?c="".concat(a(1e6),"M"):1e3<i&&(c="".concat(a(1e3),"K"))),is.element(this.elements.count)?this.elements.count.textContent=c:(wrap(this.elements.trigger,createElement("span",{class:o.className})),this.elements.count=createElement("span",{class:"".concat(r.className," ").concat(r.className,"--").concat(s)},c),this.elements.trigger.insertAdjacentElement("after"===s?"afterend":"beforebegin",this.elements.count))}}},{key:"href",get:function(){return is.element(this.elements.trigger)?this.elements.trigger.href:null}},{key:"network",get:function(){var e=this;if(!is.element(this.elements.trigger))return null;var t=this.config.networks;return Object.keys(t).find(function(n){return getDomain(e.href)===t[n].domain})}},{key:"networkConfig",get:function(){return is.empty(this.network)?null:this.config.networks[this.network]}},{key:"target",get:function(){if(is.empty(this.network))return null;var e=new URL(this.href);switch(this.network){case"facebook":return e.searchParams.get("u");case"github":return e.pathname.substring(1);case"youtube":return e.pathname.split("/").pop();default:return e.searchParams.get("url")}}},{key:"apiUrl",get:function(){if(is.empty(this.network))return null;var e=this.config.tokens;switch(this.network){case"github":return this.networkConfig.url(this.target,e.github);case"youtube":return this.networkConfig.url(this.target,e.youtube);default:return this.networkConfig.url(encodeURIComponent(this.target))}}}],[{key:"setup",value:function(t){var n=1<arguments.length&&void 0!==arguments[1]?arguments[1]:{},r=null;if(is.string(t)?r=Array.from(document.querySelectorAll(t)):is.element(t)?r=[t]:is.nodeList(t)?r=Array.from(t):is.array(t)&&(r=t.filter(is.element)),is.empty(r))return null;var o=Object.assign({},defaults,n);is.string(t)&&o.watch&&new MutationObserver(function(n){Array.from(n).forEach(function(n){Array.from(n.addedNodes).forEach(function(n){is.element(n)&&matches(n,t)&&new e(n,o)})})}).observe(document.body,{childList:!0,subtree:!0});return r.map(function(t){return new e(t,n)})}}]),e}();export default Shr;