endpoint-share-api-polyfill
Version:
This is a polyfill for the `Web Share API` that can be used in desktop too, so your users can share in their twitter, facebook, messenger, linkedin, sms, e-mail, print, telegram or whatsapp.
1,466 lines (444 loc) • 21.9 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<title>JSDoc: Class: SharePolyfill</title>
<script src="scripts/prettify/prettify.js"> </script>
<script src="scripts/prettify/lang-css.js"> </script>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
<link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>
<body>
<div id="main">
<h1 class="page-title">Class: SharePolyfill</h1>
<section>
<header>
<h2><span class="attribs"><span class="type-signature"></span></span>SharePolyfill<span class="signature">(options<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h2>
</header>
<article>
<div class="container-overview">
<h4 class="name" id="SharePolyfill"><span class="type-signature"></span>new SharePolyfill<span class="signature">(options<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>
<div class="description">
https://developer.mozilla.org/en-US/docs/Web/API/Web_Share_API
Setup a instance with custom options
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>options</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">optional options :)
<h6>Properties</h6>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>forcePolyfill</code></td>
<td class="type">
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
false
</td>
<td class="description last">allows you to override default navigator share</td>
</tr>
<tr>
<td class="name"><code>registerNativeTargets</code></td>
<td class="type">
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
false
</td>
<td class="description last">todo: allow us to extend native share and add our custom targets</td>
</tr>
<tr>
<td class="name"><code>defaultTargets</code></td>
<td class="type">
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
true
</td>
<td class="description last">weather to include the default targets in this share</td>
</tr>
<tr>
<td class="name"><code>shareTargets</code></td>
<td class="type">
<span class="param-type">Array.<<a href="ShareTarget.html">ShareTarget</a>></span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last">An array of additional share targets to add</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="share.js.html">share.js</a>, <a href="share.js.html#line537">line 537</a>
</li></ul></dd>
</dl>
</div>
<h3 class="subsection-title">Methods</h3>
<h4 class="name" id=".getDefaultShareTargets"><span class="type-signature">(static) </span>getDefaultShareTargets<span class="signature">()</span><span class="type-signature"></span></h4>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="share.js.html">share.js</a>, <a href="share.js.html#line305">line 305</a>
</li></ul></dd>
</dl>
<h5>Example</h5>
<pre class="prettyprint"><code>https://github.com/bradvin/social-share-urls
return {
'add.this': 'http://www.addthis.com/bookmark.php?url=' + url,
'blogger': 'https://www.blogger.com/blog-this.g?u=' + url + '&n=' + title + '&t=' + desc,
'buffer': 'https://buffer.com/add?text=' + text + '&url=' + url,
'diaspora': 'https://share.diasporafoundation.org/?title=' + title + '&url=' + url,
'douban': 'http://www.douban.com/recommend/?url=' + url + '&title=' + text,
'email': 'mailto:' + email_address + '?subject=' + title + '&body=' + desc,
'evernote': 'https://www.evernote.com/clip.action?url=' + url + '&title=' + text,
'getpocket': 'https://getpocket.com/edit?url=' + url,
'facebook': 'http://www.facebook.com/sharer.php?u=' + url,
'flattr': 'https://flattr.com/submit/auto?user_id=' + user_id + '&url=' + url + '&title=' + title + '&description=' + text + '&language=' + language + '&tags=' + hash_tags + '&hidden=HIDDEN&category=' + category,
'flipboard': 'https://share.flipboard.com/bookmarklet/popout?v=2&title=' + text + '&url=' + url,
'gmail': 'https://mail.google.com/mail/?view=cm&to=' + email_address + '&su=' + title + '&body=' + url + '&bcc=' + bcc_email_address + '&cc=' + cc_email_address,
'google.bookmarks': 'https://www.google.com/bookmarks/mark?op=edit&bkmk=' + url + '&title=' + title + '&annotation=' + text + '&labels=' + hash_tags + '',
'instapaper': 'http://www.instapaper.com/edit?url=' + url + '&title=' + title + '&description=' + desc,
'line.me': 'https://lineit.line.me/share/ui?url=' + url + '&text=' + text,
'linkedin': 'https://www.linkedin.com/sharing/share-offsite/?url=' + url,
'livejournal': 'http://www.livejournal.com/update.bml?subject=' + text + '&event=' + url,
'hacker.news': 'https://news.ycombinator.com/submitlink?u=' + url + '&t=' + title,
'ok.ru': 'https://connect.ok.ru/dk?st.cmd=WidgetSharePreview&st.shareUrl=' + url,
'pinterest': 'http://pinterest.com/pin/create/button/?url=' + url,
'qzone': 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=' + url,
'reddit': 'https://reddit.com/submit?url=' + url + '&title=' + title,
'renren': 'http://widget.renren.com/dialog/share?resourceUrl=' + url + '&srcUrl=' + url + '&title=' + text + '&description=' + desc,
'skype': 'https://web.skype.com/share?url=' + url + '&text=' + text,
'sms': 'sms:' + phone_number + '?body=' + text,
'surfingbird.ru': 'http://surfingbird.ru/share?url=' + url + '&description=' + desc + '&screenshot=' + image + '&title=' + title,
'telegram.me': 'https://t.me/share/url?url=' + url + '&text=' + text + '&to=' + phone_number,
'threema': 'threema://compose?text=' + text + '&id=' + user_id,
'tumblr': 'https://www.tumblr.com/widgets/share/tool?canonicalUrl=' + url + '&title=' + title + '&caption=' + desc + '&tags=' + hash_tags,
'twitter': 'https://twitter.com/intent/tweet?url=' + url + '&text=' + text + '&via=' + via + '&hashtags=' + hash_tags,
'vk': 'http://vk.com/share.php?url=' + url + '&title=' + title + '&comment=' + desc,
'weibo': 'http://service.weibo.com/share/share.php?url=' + url + '&appkey=&title=' + title + '&pic=&ralateUid=',
'whatsapp': 'https://api.whatsapp.com/send?text=' + text + '%20' + url,
'xing': 'https://www.xing.com/spi/shares/new?url=' + url,
'yahoo': 'http://compose.mail.yahoo.com/?to=' + email_address + '&subject=' + title + '&body=' + text,
};
}</code></pre>
<h4 class="name" id="_share"><span class="type-signature"></span>_share<span class="signature">(data, options)</span><span class="type-signature"> → {Promise}</span></h4>
<div class="description">
https://developer.mozilla.org/en-US/docs/Web/API/Navigator/share
This creates the share popup
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>data</code></td>
<td class="type">
</td>
<td class="description last">the share data
<h6>Properties</h6>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>url</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="description last">OFFICIAL A string representing a URL to be shared.</td>
</tr>
<tr>
<td class="name"><code>text</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="description last">OFFICIAL A string representing text to be shared.</td>
</tr>
<tr>
<td class="name"><code>title</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="description last">OFFICIAL A string representing a title to be shared. May be ignored by the target.</td>
</tr>
<tr>
<td class="name"><code>files</code></td>
<td class="type">
<span class="param-type">Array.<File></span>
</td>
<td class="description last">OFFICIAL An array of File objects representing files to be shared. See below for shareable file types.</td>
</tr>
<tr>
<td class="name"><code>desc</code></td>
<td class="type">
<span class="param-type">String</span>
</td>
<td class="description last">See ShareTarget.constructor for full unoffical target docs</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td class="name"><code>options</code></td>
<td class="type">
</td>
<td class="description last">optional options. can disable any target by name === false</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="share.js.html">share.js</a>, <a href="share.js.html#line808">line 808</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
- resolve undifined or reject Exception/Error
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">Promise</span>
</dd>
</dl>
<h4 class="name" id="registerShareTarget"><span class="type-signature"></span>registerShareTarget<span class="signature">(shareTarget)</span><span class="type-signature"></span></h4>
<div class="description">
https://web.dev/web-share-target/
Register a posible url if the one you want is not provided
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>shareTarget</code></td>
<td class="type">
<span class="param-type"><a href="ShareTarget.html">ShareTarget</a></span>
</td>
<td class="description last">an instance of share target object see docs;</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="share.js.html">share.js</a>, <a href="share.js.html#line1252">line 1252</a>
</li></ul></dd>
</dl>
<h4 class="name" id="share"><span class="type-signature"></span>share<span class="signature">(data, options<span class="signature-attributes">opt</span>)</span><span class="type-signature"> → {Promise}</span></h4>
<div class="description">
https://developer.mozilla.org/en-US/docs/Web/API/Navigator/share
Perform a share
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>data</code></td>
<td class="type">
<span class="param-type">ShareData</span>
</td>
<td class="attributes">
</td>
<td class="description last">An object containing data to share
Properties that are unknown to the user agent are ignored; share data is only assessed on properties understood by the user agent. All properties are optional but at least one known data property must be specified.
Possible values are:
<h6>Properties</h6>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>url</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last">A string representing a URL to be shared.</td>
</tr>
<tr>
<td class="name"><code>url</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last">A string representing text to be shared.</td>
</tr>
<tr>
<td class="name"><code>url</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last">A string representing a title to be shared. May be ignored by the target.</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td class="name"><code>options</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">SharePolyfill Extended Options ignored in native more and optional</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="share.js.html">share.js</a>, <a href="share.js.html#line766">line 766</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">Promise</span>
</dd>
</dl>
<h4 class="name" id="shareTo"><span class="type-signature"></span>shareTo<span class="signature">(name, data, options)</span><span class="type-signature"> → {*}</span></h4>
<div class="description">
This function is called by the share dialog thing, and is what actually triggers the ShareTarget action
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>name</code></td>
<td class="type">
</td>
<td class="description last"></td>
</tr>
<tr>
<td class="name"><code>data</code></td>
<td class="type">
</td>
<td class="description last"></td>
</tr>
<tr>
<td class="name"><code>options</code></td>
<td class="type">
</td>
<td class="description last"></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="share.js.html">share.js</a>, <a href="share.js.html#line1236">line 1236</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">*</span>
</dd>
</dl>
</article>
</section>
</div>
<nav>
<h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="SharePolyfill.html">SharePolyfill</a></li><li><a href="ShareTarget.html">ShareTarget</a></li></ul><h3>Global</h3><ul><li><a href="global.html#sharePolyfill">sharePolyfill</a></li></ul>
</nav>
<br class="clear">
<footer>
Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 3.6.11</a> on Sun Oct 29 2023 07:27:00 GMT-0600 (Mountain Daylight Saving Time)
</footer>
<script> prettyPrint(); </script>
<script src="scripts/linenumber.js"> </script>
</body>
</html>