| 1 |
(function () { |
| 2 |
'use strict'; |
| 3 |
|
| 4 |
var NETWORKS = { |
| 5 |
twitter: { label: 'X', brand: '#000000', url: function(u,t){ return 'https://twitter.com/intent/tweet?url='+u+'&text='+t; } }, |
| 6 |
facebook: { label: 'Facebook', brand: '#1877f2', url: function(u){ return 'https://www.facebook.com/sharer/sharer.php?u='+u; } }, |
| 7 |
linkedin: { label: 'LinkedIn', brand: '#0a66c2', url: function(u,t){ return 'https://www.linkedin.com/shareArticle?mini=true&url='+u+'&title='+t; } }, |
| 8 |
pinterest: { label: 'Pinterest', brand: '#e60023', url: function(u,t){ return 'https://pinterest.com/pin/create/button/?url='+u+'&description='+t; } }, |
| 9 |
whatsapp: { label: 'WhatsApp', brand: '#25d366', url: function(u,t){ return 'https://api.whatsapp.com/send?text='+t+'%20'+u; } }, |
| 10 |
telegram: { label: 'Telegram', brand: '#26a5e4', url: function(u,t){ return 'https://t.me/share/url?url='+u+'&text='+t; } }, |
| 11 |
reddit: { label: 'Reddit', brand: '#ff4500', url: function(u,t){ return 'https://www.reddit.com/submit?url='+u+'&title='+t; } }, |
| 12 |
email: { label: 'Email', brand: '#6b7280', url: function(u,t){ return 'mailto:?subject='+t+'&body='+u; } }, |
| 13 |
}; |
| 14 |
|
| 15 |
var ICONS = { |
| 16 |
twitter: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-4.714-6.231-5.401 6.231H2.742l7.737-8.837L2.25 2.25h7.008l4.262 5.632 4.724-5.632zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>', |
| 17 |
facebook: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M24 12.073C24 5.406 18.627 0 12 0S0 5.406 0 12.073C0 18.1 4.388 23.094 10.125 24v-8.437H7.078v-3.49h3.047V9.41c0-3.025 1.792-4.697 4.533-4.697 1.312 0 2.686.236 2.686.236v2.97h-1.513c-1.491 0-1.956.93-1.956 1.883v2.268h3.328l-.532 3.49h-2.796V24C19.612 23.094 24 18.1 24 12.073z"/></svg>', |
| 18 |
linkedin: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 01-2.063-2.065 2.064 2.064 0 112.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>', |
| 19 |
pinterest: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.373 0 0 5.373 0 12c0 5.084 3.163 9.426 7.627 11.174-.105-.949-.2-2.405.042-3.441.218-.937 1.407-5.965 1.407-5.965s-.359-.719-.359-1.782c0-1.668.967-2.914 2.171-2.914 1.023 0 1.518.769 1.518 1.69 0 1.029-.655 2.568-.994 3.995-.283 1.194.599 2.169 1.777 2.169 2.133 0 3.772-2.249 3.772-5.495 0-2.873-2.064-4.882-5.012-4.882-3.414 0-5.418 2.561-5.418 5.207 0 1.031.397 2.138.893 2.738a.36.36 0 01.083.345l-.333 1.36c-.053.22-.174.267-.402.161-1.499-.698-2.436-2.889-2.436-4.649 0-3.785 2.75-7.262 7.929-7.262 4.163 0 7.398 2.967 7.398 6.931 0 4.136-2.607 7.464-6.227 7.464-1.216 0-2.359-.632-2.75-1.378l-.748 2.853c-.271 1.043-1.002 2.35-1.492 3.146C9.57 23.812 10.763 24 12 24c6.627 0 12-5.373 12-12C24 5.373 18.627 0 12 0z"/></svg>', |
| 20 |
whatsapp: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z"/></svg>', |
| 21 |
telegram: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/></svg>', |
| 22 |
reddit: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0zm5.01 4.744c.688 0 1.25.561 1.25 1.249a1.25 1.25 0 0 1-2.498.056l-2.597-.547-.8 3.747c1.824.07 3.48.632 4.674 1.488.308-.309.73-.491 1.207-.491.968 0 1.754.786 1.754 1.754 0 .716-.435 1.333-1.01 1.614a3.111 3.111 0 0 1 .042.52c0 2.694-3.13 4.87-7.004 4.87-3.874 0-7.004-2.176-7.004-4.87 0-.183.015-.366.043-.534A1.748 1.748 0 0 1 4.028 12c0-.968.786-1.754 1.754-1.754.463 0 .898.196 1.207.49 1.207-.883 2.878-1.43 4.744-1.487l.885-4.182a.342.342 0 0 1 .14-.197.35.35 0 0 1 .238-.042l2.906.617a1.214 1.214 0 0 1 1.108-.701zM9.25 12C8.561 12 8 12.562 8 13.25c0 .687.561 1.248 1.25 1.248.687 0 1.248-.561 1.248-1.249 0-.688-.561-1.249-1.249-1.249zm5.5 0c-.687 0-1.248.561-1.248 1.25 0 .687.561 1.248 1.249 1.248.688 0 1.249-.561 1.249-1.249 0-.687-.562-1.249-1.25-1.249zm-5.466 3.99a.327.327 0 0 0-.231.094.33.33 0 0 0 0 .463c.842.842 2.484.913 2.961.913.477 0 2.105-.056 2.961-.913a.361.361 0 0 0 .029-.463.33.33 0 0 0-.464 0c-.547.533-1.684.73-2.512.73-.828 0-1.979-.196-2.512-.73a.326.326 0 0 0-.232-.095z"/></svg>', |
| 23 |
email: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/></svg>', |
| 24 |
}; |
| 25 |
|
| 26 |
function initShareWrap(wrap) { |
| 27 |
var d = wrap.dataset; |
| 28 |
var nets = (d.networks || '').split(',').filter(Boolean); |
| 29 |
var style = d.style || 'icon-text'; |
| 30 |
var size = parseInt(d.size, 10) || 38; |
| 31 |
var gap = parseInt(d.gap, 10) || 8; |
| 32 |
var radius = parseInt(d.radius, 10) || 8; |
| 33 |
var brand = d.brand !== '0'; |
| 34 |
var bg = d.bg || '#1d4ed8'; |
| 35 |
var icColor = d['iconColor'] || '#ffffff'; |
| 36 |
var fs = parseInt(d.fs, 10) || 13; |
| 37 |
var fw = d.fw || '600'; |
| 38 |
var showLbl = d.showLabel === '1'; |
| 39 |
var lbl = d.label || 'Share:'; |
| 40 |
|
| 41 |
var url = encodeURIComponent(window.location.href); |
| 42 |
var title = encodeURIComponent(document.title); |
| 43 |
|
| 44 |
var isPill = style === 'pill'; |
| 45 |
wrap.style.gap = gap + 'px'; |
| 46 |
|
| 47 |
if (showLbl) { |
| 48 |
var heading = document.createElement('span'); |
| 49 |
heading.className = 'bkbg-shs-heading'; |
| 50 |
heading.textContent = lbl; |
| 51 |
heading.style.fontSize = fs + 'px'; |
| 52 |
wrap.insertBefore(heading, wrap.firstChild); |
| 53 |
} |
| 54 |
|
| 55 |
nets.forEach(function (id) { |
| 56 |
var n = NETWORKS[id]; |
| 57 |
if (!n) return; |
| 58 |
var shareUrl = n.url(url, title); |
| 59 |
|
| 60 |
var a = document.createElement('a'); |
| 61 |
a.href = shareUrl; |
| 62 |
a.className = 'bkbg-shs-btn'; |
| 63 |
a.target = id === 'email' ? '_self' : '_blank'; |
| 64 |
a.rel = 'noopener noreferrer'; |
| 65 |
a.setAttribute('aria-label', n.label); |
| 66 |
a.style.cssText = [ |
| 67 |
'height:' + size + 'px', |
| 68 |
'min-width:' + (style === 'icon' ? size + 'px' : 'auto'), |
| 69 |
'width:' + (style === 'icon' ? size + 'px' : 'auto'), |
| 70 |
'padding:' + (style === 'icon' ? '0' : '0 12px'), |
| 71 |
'background:' + (brand ? n.brand : bg), |
| 72 |
'color:' + (brand ? '#ffffff' : icColor), |
| 73 |
'border-radius:' + (isPill ? (size / 2) + 'px' : radius + 'px'), |
| 74 |
'font-size:' + fs + 'px', |
| 75 |
'font-weight:' + fw, |
| 76 |
].join(';'); |
| 77 |
|
| 78 |
a.innerHTML = '<span style="width:16px;height:16px;display:flex;flex-shrink:0">' + (ICONS[id] || '') + '</span>' + |
| 79 |
(style !== 'icon' ? '<span>' + n.label + '</span>' : ''); |
| 80 |
|
| 81 |
wrap.appendChild(a); |
| 82 |
}); |
| 83 |
} |
| 84 |
|
| 85 |
document.addEventListener('DOMContentLoaded', function () { |
| 86 |
document.querySelectorAll('.bkbg-shs-wrap[data-networks]').forEach(initShareWrap); |
| 87 |
}); |
| 88 |
})(); |
| 89 |
|
