Skip to content

Instantly share code, notes, and snippets.

@qstudio

qstudio/q-share.js

Created November 12, 2020 22:36
Show Gist options
  • Save qstudio/55e191309b4bd9216a0dcdb93f69bbc9 to your computer and use it in GitHub Desktop.
Save qstudio/55e191309b4bd9216a0dcdb93f69bbc9 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
q-share.js
/* https://github.com/MaxArt2501/share-this */
"use strict";
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
!function (e, t) {
"object" == (typeof exports === "undefined" ? "undefined" : _typeof(exports)) && "undefined" != typeof module ? module.exports = t() : "function" == typeof define && define.amd ? define(t) : (e = e || self).ShareThis = t();
}(void 0, function () {
"use strict";
var e;
function t(t, n) {
return e || (e = function (e) {
for (var t = "atchesSelector", n = 0, r = ["matches", "m" + t, "webkitM" + t, "mozM" + t, "msM" + t, "oM" + t]; n < r.length; n++) {
var o = r[n];
if (e[o]) return o;
}
}(t)), t[e](n);
}
function n(e, n) {
for (var r = e; r && (1 !== r.nodeType || !t(r, n));) {
r = r.parentNode;
}
return r;
}
function r(e) {
return "function" == typeof e;
}
function o(e, t, n) {
var r = n.document,
o = r.defaultView,
i = function (e) {
if (e.isCollapsed) return !0;
var t = e.anchorNode.compareDocumentPosition(e.focusNode);
return t ? (4 & t) > 0 : e.anchorOffset < e.focusOffset;
}(o.getSelection()),
a = function (e, t) {
var n,
r = e.getClientRects(),
o = [].slice.bind(r);
if (t) {
for (var i = 1 / 0, a = r.length; a--;) {
var c = r[a];
if (c.left > i) break;
i = c.left;
}
n = o(a + 1);
} else {
for (var u = -1 / 0, f = 0; f < r.length; f++) {
var s = r[f];
if (s.right < u) break;
u = s.right;
}
n = o(0, f);
}
return {
top: Math.min.apply(Math, n.map(function (e) {
return e.top;
})),
bottom: Math.max.apply(Math, n.map(function (e) {
return e.bottom;
})),
left: n[0].left,
right: n[n.length - 1].right
};
}(t, i),
c = function (e) {
var t = e.document.body;
return ("static" === e.getComputedStyle(t).position ? t.parentNode : t).getBoundingClientRect();
}(o),
u = e.style;
i ? u.right = r.documentElement.clientWidth - a.right + c.left + "px" : u.left = a.left - c.left + "px", u.width = a.right - a.left + "px", u.height = a.bottom - a.top + "px", u.top = a.top - c.top + "px", u.position = "absolute", e.className = n.popoverClass;
}
var i = "data-share-via";
function a(e) {
return {
createPopover: function createPopover() {
var t = e.createElement("div");
return t.addEventListener("click", function (e) {
!function (e, t) {
var o = n(t.target, "[" + i + "]");
if (o) {
var a = function (e, t) {
for (var n = 0; n < e.length; n++) {
var r = e[n];
if (r.name === t) return r;
}
}(e, o.getAttribute(i));
a && r(a.action) && a.action(t, o);
}
}(this.sharers, e);
}), t;
},
attachPopover: function attachPopover(t) {
e.body.appendChild(t);
},
removePopover: function removePopover(e) {
var t = e.parentNode;
t && t.removeChild(e);
}
};
}
var c,
u = function u(e, t, n, r) {
var o = e.shareUrl || e.document.defaultView.location;
return "<ul>" + t.map(function (e) {
return '<li data-share-via="' + e.name + '">' + e.render.call(e, n, r, o) + "</li>";
}).join("") + "</ul>";
},
f = ["selectionchange", "mouseup", "touchend", "touchcancel"];
return function (e) {
var t = (Object.assign || function (e, t) {
if (t && "object" == _typeof(t)) for (var n in t) {
e[n] = t[n];
}
return e;
})({
document: document,
selector: "body",
sharers: [],
popoverClass: "share-this-popover",
transformer: function transformer(e) {
return e.trim().replace(/\s+/g, " ");
}
}, e || {}),
i = !1,
s = !1,
l = c,
p = c,
d = c,
v = c;
return {
init: function init() {
return !i && (l = t.document, (p = l.defaultView).getSelection ? (f.forEach(h), p.addEventListener("resize", g), v = a(l), i = !0) : (console.warn("share-this: Selection API isn't supported"), !1));
},
destroy: function destroy() {
return !(!i || s) && (f.forEach(m), p.removeEventListener("resize", g), C(), l = c, p = c, s = !0);
},
reposition: function reposition() {
return d && o(d, y(), t), !!d;
}
};
function h(e) {
l.addEventListener(e, b);
}
function m(e) {
l.removeEventListener(e, b);
}
function g() {
d && o(d, y(), t);
}
function b(e) {
var n = e.type;
!d != ("selectionchange" === n) && setTimeout(function () {
if (p) {
var e = y();
e ? function (e) {
var n = !d,
i = e.toString(),
a = t.transformer(i),
f = t.sharers.filter(function (e, t, n) {
var o = n.active;
return r(o) ? o(e, t) : o === c || o;
}.bind(null, a, i));
f.length ? (n && (d = v.createPopover()), d.sharers = f, d.innerHTML = u(t, f, a, i), o(d, e, t), n && (v.attachPopover(d), r(t.onOpen) && t.onOpen(d, a, i))) : d && C();
}(e) : C();
}
}, 10);
}
function y() {
var e = p.getSelection(),
r = e.rangeCount && e.getRangeAt(0);
if (r) {
var o = function (e, t) {
var r = e.cloneRange();
if (e.collapsed || !t) return r;
var o = n(e.startContainer, t);
return o ? function (e, t) {
var n = e.compareDocumentPosition(t);
return !n || (16 & n) > 0;
}(o, e.endContainer) || r.setEnd(o, o.childNodes.length) : (o = n(e.endContainer, t)) ? r.setStart(o, 0) : r.collapse(), r;
}(r, t.selector);
if (!o.collapsed && o.getClientRects().length) return o;
}
}
function C() {
d && (v.removePopover(d), d = c, r(t.onClose) && t.onClose());
}
};
});
// extend q
jQuery.extend( q, {
// share ##
'share': {
// init share-this ##
'init': function( selector, options ){
// not on mobile -- @todo, make passable option 'no_mobile'... ##
if ( q.h.is_mobile() ) return false;
// save passed params ##
q.prop.set( 'share_selector', selector );
q.prop.set( 'share_options', options );
// define sharers and callback function ##
var sharers = {
'facebook': q.share.facebook,
'email': q.share.email,
'twitter': q.share.twitter,
};
// save active sharers ##
q.prop.set( 'share_sharers', sharers );
// selector ##
var selector = selector || ".the-content";
// init ##
ShareThis({
'sharers': q.share.sharers(), // sharers ##
'selector': selector // share selector
}).init();
// track events ##
q.share.listener();
},
// check if passed / merged share options are allowed and return to init ##
'sharers': function(){
var sharers = q.prop.get( 'share_sharers');
var options = q.prop.get( 'share_options');
// q.log( options );
var active = [];
// loop over passed options ##
options.forEach( function( service ) {
// check if option value is allowed in defined sharers
if ( ! sharers.hasOwnProperty( service ) ) {
// q.log( 'BAD: '+service );
return false;
}
active.push( sharers[service] );
// q.log( 'GOOD: '+service );
// q.log( sharers[service] );
});
// q.log( active );
// kick back to init ##
return active;
},
// add event listener ##
'listener': function(){
// binder ###
q.$(document).on( 'click', '[data-share-url]', function(e){
e.preventDefault;
// q.log( 'url: '+q.$(this).data('share-url') );
q.share.popover( q.$(this).data('share-url') );
q.share.hide();
q.share.clear();
});
},
// hide ##
'hide': function(){
q.$('.share-this-popover').hide();
},
// open fixed popover window ##
'popover': function( url, title, width, height ){
var
title = title || 'Share',
width = width || 900,
height = height || 600,
left = ( q.$(window).width() / 2 ) - ( height / 2 ),
top = ( q.$(window).height() / 2) - ( width / 2 )
;
// return window.open ( url, title, "width="+width+", height="+width+", top="+top+", left="+left+"");
window.open(
url,
title,
"resizable=no, toolbar=no, scrollbars=no, menubar=no, status=no, directories=no, width=" + width + ", height=" + height + ", left=" + left + ", top=" + top +"");
},
// clear selected text ##
'clear': function() {
if (window.getSelection) {
window.getSelection().removeAllRanges();
} else if (document.selection) {
document.selection.empty();
}
},
// facebook sharer ##
'facebook': {
'render': function(text, rawText, refUrl) {
// var url = this.url( refUrl );
return '<a href="#/share/facebook" rel="noopener nofollow noreferrer" data-share-url="'+this.url( refUrl )+'">'
+ "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"currentColor\" d=\"M504 256C504 119 393 8 256 8S8 119 8 256c0 123.78 90.69 226.38 209.25 245V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.28c-30.8 0-40.41 19.12-40.41 38.73V256h68.78l-11 71.69h-57.78V501C413.31 482.38 504 379.78 504 256z\" /></svg></a>";
},
'url': function( refUrl) {
return 'https://www.facebook.com/sharer/sharer.php?u='+encodeURIComponent(refUrl);
},
},
// email share ##
'email': {
'render': function(text, rawText, refUrl) {
// const url = this.url(text, refUrl);
return '<a href="#/share/email" data-share-url="'+this.url(text, refUrl)+'" rel="noopener nofollow noreferrer">'
+ "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"-9 -9 96 96\">"
+ "<path d=\"M1 12c-.553 0-1 .447-1 1v52c0 .553.447 1 1 1h76c.553 0 1-.447 1-1V13"
+ "c0-.553-.447-1-1-1H1zm68.816 6L39 40.594 8.184 18h61.632zM72 60H6V23.84"
+ "l29.452 21.593 3.548 2.6 3.548-2.6L72 23.838V60z\" fill=\"currentcolor\"/>"
+ "</svg></a>";
},
'url': function(text, refUrl) {
return 'mailto:?body='+encodeURIComponent(text)+'%0a%0a'+encodeURIComponent(refUrl);
}
},
// twitter sharer ##
'twitter': {
'prop': function( get) {
switch( get ){
case 'limit': return 120 ; // max length ##
}
},
'render': function(text, rawText, refUrl) {
var shareText = this.text(text);
var url = this.url(shareText, refUrl);
return '<a href="#/share/twitter" data-share-url="'+url+'" rel="noopener nofollow noreferrer">'
+ "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"-2 -2 20 20\">"
+ "<path d=\"M16 3.038c-.59.26-1.22.437-1.885.517.677-.407 1.198-1.05 1.443-1.816-.634.37-1.337.64"
+ "-2.085.79-.598-.64-1.45-1.04-2.396-1.04-1.812 0-3.282 1.47-3.282 3.28 0 .26.03.51.085.75-2.728"
+ "-.13-5.147-1.44-6.766-3.42C.83 2.58.67 3.14.67 3.75c0 1.14.58 2.143 1.46 2.732-.538-.017-1.045"
+ "-.165-1.487-.41v.04c0 1.59 1.13 2.918 2.633 3.22-.276.074-.566.114-.865.114-.21 0-.41-.02-.61"
+ "-.058.42 1.304 1.63 2.253 3.07 2.28-1.12.88-2.54 1.404-4.07 1.404-.26 0-.52-.015-.78-.045 1.46"
+ ".93 3.18 1.474 5.04 1.474 6.04 0 9.34-5 9.34-9.33 0-.14 0-.28-.01-.42.64-.46 1.2-1.04 1.64-1.7z\" fill=\"currentcolor\"/>"
+ "</svg></a>";
},
'text': function(text) {
var chunk = text.trim();
if (chunk.length > q.share.twitter.prop('limit' ) - 2) {
chunk = chunk.slice(0, q.share.twitter.prop('limit' ) - 3).trim() + "\u2026";
}
return '\u201c'+chunk+'\u201d';
},
'url': function(text, refUrl) {
return 'https://twitter.com/intent/tweet?text='+encodeURIComponent(text)+'&url='+encodeURIComponent(refUrl);
},
}
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment