Skip to content

Commit

Permalink
Share widget: Added site filter
Browse files Browse the repository at this point in the history
  • Loading branch information
pjackson28 committed Mar 11, 2014
1 parent f221bb3 commit 84966b5
Show file tree
Hide file tree
Showing 6 changed files with 122 additions and 22 deletions.
2 changes: 1 addition & 1 deletion site/data/i18n/fr.json
Expand Up @@ -20,7 +20,7 @@
"matches": "[MIXIN] correspondance(s) trouvées",
"menu": "Menu",
"menu-close": "Fermer le menu",
"overlay-close": "Fermer l'incrustation",
"overlay-close": "Fermer la fenêtre superposée",
"settings": "Paramètres",
"langs": "Langues",
"about": "À propos",
Expand Down
13 changes: 12 additions & 1 deletion site/pages/docs/ref/share/share-en.hbs
Expand Up @@ -4,7 +4,7 @@
"language": "en",
"description": "Facilitates sharing Web content on social media platforms.",
"altLangPrefix": "share",
"dateModified": "2014-02-26"
"dateModified": "2014-03-11"
}
---
<span class="wb-prettify all-pre hide"></span>
Expand Down Expand Up @@ -143,6 +143,17 @@
</dl>
</td>
</tr>
<tr>
<td><code>filter</code></td>
<td>Optional filter for the sites to display in the panel. Only the sites listed in the array will be displayed. If no sites are listed, then all sites will be displayed.</td>
<td>Add <code>"filter": ["site-1", "site-2", ... "site-n"]</code> to the <code>data-wet-boew</code> attribute.</td>
<td>
<dl>
<dt>None (default):</dt>
<dd>Sites are not filtered by default.</dd>
</dl>
</td>
</tr>
</tbody>
</table>
</section>
Expand Down
13 changes: 12 additions & 1 deletion site/pages/docs/ref/share/share-fr.hbs
Expand Up @@ -4,7 +4,7 @@
"language": "fr",
"description": "Permet à l'utilisateur de partager un contenu Web sur les plateformes de médias sociaux.",
"altLangPrefix": "share",
"dateModified": "2014-02-26"
"dateModified": "2014-03-11"
}
---
<span class="wb-prettify all-pre hide"></span>
Expand Down Expand Up @@ -145,6 +145,17 @@
</dl>
</td>
</tr>
<tr>
<td><code>filter</code></td>
<td>Optional filter for the sites to display in the panel. Only the sites listed in the array will be displayed. If no sites are listed, then all sites will be displayed.</td>
<td>Add <code>"filter": ["site-1", "site-2", ... "site-n"]</code> to the <code>data-wet-boew</code> attribute.</td>
<td>
<dl>
<dt>None (default):</dt>
<dd>Sites are not filtered by default.</dd>
</dl>
</td>
</tr>
</tbody>
</table>
</section>
Expand Down
46 changes: 37 additions & 9 deletions src/plugins/share/share-en.hbs
Expand Up @@ -6,7 +6,7 @@
"description": "Facilitates sharing Web content on social media platforms.",
"tag": "share",
"altLangPrefix": "share",
"dateModified": "2014-02-19"
"dateModified": "2014-03-11"
}
---
<section>
Expand Down Expand Up @@ -72,6 +72,27 @@

<hr />

<section>
<h2>Filter the displayed sites</h2>

<div class="wb-share" data-wet-boew='{"filter": ["twitter", "facebook"], "pnlId": "pnl4"}'></div>
<div class="text-right">
<strong>Add a second link:</strong>
<div class="wb-share link-only text-right" data-wet-boew='{"pnlId": "pnl4"}'></div>
</div>

<details>
<summary>View code</summary>
<pre class="wb-prettify"><code>&lt;div class="wb-share" data-wet-boew='{"filter": ["twitter", "facebook"], "pnlId": "pnl4"}'&gt;&lt;/div&gt;
&lt;div class="text-right"&gt;
&lt;strong&gt;Add a second link:&lt;/strong&gt;
&lt;div class="wb-share link-only text-right" data-wet-boew='{"pnlId": "pnl4"}'&gt;&lt;/div&gt;
&lt;/div&gt;</code></pre>
</details>
</section>

<hr />

<section>
<h2>Options</h2>
<table class="table table-striped">
Expand All @@ -86,61 +107,68 @@
</thead>
<tbody>
<tr>
<td>link-only</td>
<td><code>link-only</code></td>
<td>Class name</td>
<td>n/a</td>
<td><code>class="wb-share link-only"</code></td>
<td>Used to specify additional links for an existing panel.</td>
</tr>
<tr>
<td>pnlId</td>
<td><code>pnlId</code></td>
<td>String</td>
<td>n/a</td>
<td><code>data-wet-boew='{"pnlId": "pnl1"}'</code></td>
<td>Unique identifier for the panel. Only required if providing a second link for the same panel (needs to be specified on all <code>wb-share</code> calls for that panel).</td>
</tr>
<tr>
<td>type</td>
<td><code>type</code></td>
<td>"<code>page</code>", "<code>video</code>"</td>
<td>"<code>page</code>"</td>
<td><code>data-wet-boew='{"type": "video"}'</code></td>
<td>Type of content to share.</td>
</tr>
<tr>
<td>custType</td>
<td><code>custType</code></td>
<td>String</td>
<td>""</td>
<td><code>data-wet-boew='{"custType": "&#160;this comment"}'</code></td>
<td>Text to use after "Share" on the share button and the panel header (overrides the text associated to the type option).</td>
</tr>
<tr>
<td>title</td>
<td><code>title</code></td>
<td>String</td>
<td>Page title or the main <code>h1</code> text</td>
<td><code>data-wet-boew='{"title": "Page title"}'</code></td>
<td>Text to use instead of the page title or the main <code>h1</code> text. Recommended for the video type if the page title is not the title of the video.</td>
</tr>
<tr>
<td>url</td>
<td><code>url</code></td>
<td>URL</td>
<td>URL of the current page (excluding the hash and query string)</td>
<td><code>data-wet-boew='{"url": "http://page.url"}'</code></td>
<td>URL to use instead of the URL of the current page.</td>
</tr>
<tr>
<td>desc</td>
<td><code>desc</code></td>
<td>String</td>
<td>""</td>
<td><code>data-wet-boew='{"desc": "Description of the page."}'</code></td>
<td>Optional description of the item to share. <strong>Note:</strong> A separate description is not supported by all social media sites.</td>
</tr>
<tr>
<td>img</td>
<td><code>img</code></td>
<td>URL</td>
<td>""</td>
<td><code>data-wet-boew='{"img": "http://img.url"}'</code></td>
<td>Optional image for the item to share (mainly for Pinterest). <strong>Note:</strong> Very few social media sites support specifying a separate image through a URL request.</td>
</tr>
<tr>
<td><code>filter</code></td>
<td>Array</td>
<td>[]</td>
<td><code>data-wet-boew='{"filter": ["twitter", "facebook"]}'</code></td>
<td>Optional filter for the sites to display in the panel. Only the sites listed in the array will be displayed. If no sites are listed, then all sites will be displayed.</td>
</tr>
</tbody>
</table>
</section>
46 changes: 37 additions & 9 deletions src/plugins/share/share-fr.hbs
Expand Up @@ -6,7 +6,7 @@
"description": "Permet à l'utilisateur de partager un contenu Web sur les plateformes de médias sociaux.",
"tag": "share",
"altLangPrefix": "share",
"dateModified": "2014-02-19"
"dateModified": "2014-03-11"
}
---
<section>
Expand Down Expand Up @@ -72,6 +72,27 @@

<hr />

<section>
<h2>Filtrer les sites affichés</h2>

<div class="wb-share" data-wet-boew='{"filter": ["twitter", "facebook"], "pnlId": "pnl4"}'></div>
<div class="text-right">
<strong>Ajouter un deuxième lien&#160;:</strong>
<div class="wb-share link-only text-right" data-wet-boew='{"pnlId": "pnl4"}'></div>
</div>

<details>
<summary>Visualiser le code</summary>
<pre class="wb-prettify"><code>&lt;div class="wb-share" data-wet-boew='{"filter": ["twitter", "facebook"], "pnlId": "pnl4"}'&gt;&lt;/div&gt;
&lt;div class="text-right"&gt;
&lt;strong&gt;Ajouter un deuxième lien&#160;:&lt;/strong&gt;
&lt;div class="wb-share link-only text-right" data-wet-boew='{"pnlId": "pnl4"}'&gt;&lt;/div&gt;
&lt;/div&gt;</code></pre>
</details>
</section>

<hr />

<section>
<h2>Options</h2>
<table class="table table-striped">
Expand All @@ -86,61 +107,68 @@
</thead>
<tbody>
<tr>
<td>link-only</td>
<td><code>link-only</code></td>
<td>Nom de classe</td>
<td>s/o</td>
<td><code>class="wb-share link-only"</code></td>
<td>Permet de spécifier des liens supplémentaires pour un panneau existant.</td>
</tr>
<tr>
<td>pnlId</td>
<td><code>pnlId</code></td>
<td>Cha&icirc;ne</td>
<td>n/a</td>
<td><code>data-wet-boew='{"pnlId": "pnl1"}'</code></td>
<td>Identifiant unique pour le panneau. Seulement requis lors de l'ajout d'un deuxième lien pour le même panneau (doit être spécifié sur toutes les demandes <code>wb-share</code> pour le même panneau).</td>
</tr>
<tr>
<td>type</td>
<td><code>type</code></td>
<td>"<code>page</code>", "<code>video</code>"</td>
<td>"<code>page</code>"</td>
<td><code>data-wet-boew='{"type": "video"}'</code></td>
<td>Type de contenu à partager.</td>
</tr>
<tr>
<td>custType</td>
<td><code>custType</code></td>
<td>Cha&icirc;ne</td>
<td>""</td>
<td><code>data-wet-boew='{"custType": "&#160;this comment"}'</code></td>
<td>Texte à utiliser après "Partager" sur le bouton de partage et l'en-tête du panneau (remplace le texte associé à l'option de type).</td>
</tr>
<tr>
<td>title</td>
<td><code>title</code></td>
<td>Cha&icirc;ne</td>
<td>Titre de la page ou le texte de l'élément <code>h1</code> principal</td>
<td><code>data-wet-boew='{"title": "Page title"}'</code></td>
<td>Texte à utiliser à la place du titre de la page ou le texte de l'élément <code>h1</code> principal. Recommandé pour le type <code>video</code> si le titre de la page n'est pas le titre de la vidéo.</td>
</tr>
<tr>
<td>url</td>
<td><code>url</code></td>
<td>URL</td>
<td>URL de la page en cours (à l'exclusion du &#171;&#160;hash&#160;&#187; et la chaîne d'interrogation)</td>
<td><code>data-wet-boew='{"url": "http://page.url"}'</code></td>
<td>URL à utiliser à la place de l'URL de la page en cours.</td>
</tr>
<tr>
<td>desc</td>
<td><code>desc</code></td>
<td>Cha&icirc;ne</td>
<td>""</td>
<td><code>data-wet-boew='{"desc": "Description de la page."}'</code></td>
<td>Description facultative de l'élément à partager. <strong>Nota&#160;:</strong> Une description séparée n'est pas supporté par tous les sites de médias sociaux.</td>
</tr>
<tr>
<td>img</td>
<td><code>img</code></td>
<td>URL</td>
<td>""</td>
<td><code>data-wet-boew='{"img": "http://img.url"}'</code></td>
<td>Image facultative pour l'élément à partager (principalement pour Pinterest). <strong>Nota&#160;:</strong> Très peu de sites de médias sociaux prennent en charge la spécification d'une image séparée par une demande d'URL.</td>
</tr>
<tr>
<td><code>filter</code></td>
<td>Tableau</td>
<td>[]</td>
<td><code>data-wet-boew='{"filter": ["twitter", "facebook"]}'</code></td>
<td>Filtre facultatif pour les sites à afficher dans le panneau. Seuls les sites listés dans le tableau seront affichés. Si aucun des sites sont listés, tous les sites seront affichés.</td>
</tr>
</tbody>
</table>
</section>
24 changes: 23 additions & 1 deletion src/plugins/share/share.js
Expand Up @@ -44,6 +44,12 @@ var pluginName = "wb-share",
img: "",
desc: "",

// For filtering the sites that area displayed and controlling the order
// they are displayed. Empty array displays all sites in the default order.
// Otherwise, it displays the sites in the order in the array using the
// keys used by the sites object.
filter: [],

sites: {

// The definitions of the available bookmarking sites, in URL use
Expand Down Expand Up @@ -125,7 +131,8 @@ var pluginName = "wb-share",
var elm = event.target,
sites, heading, settings, panel, link, $share, $elm,
pageHref, pageTitle, pageImage, pageDescription, site,
siteProperties, url, shareText, id, pnlId, regex;
siteProperties, url, shareText, id, pnlId, regex,
filter, filterLen, filteredSites, i;

// Filter out any events triggered by descendants
// and only initialize the element once
Expand All @@ -149,6 +156,8 @@ var pluginName = "wb-share",
$elm = $( elm );
settings = $.extend( true, defaults, wb.getData( $elm, "wet-boew" ) );
sites = settings.sites;
filter = settings.filter;
filterLen = filter ? filter.length : 0;
heading = settings.hdLvl;

shareText = i18nText.shareText + ( settings.custType.length !== 0 ? settings.custType : i18nText[ settings.type ] );
Expand All @@ -169,6 +178,19 @@ var pluginName = "wb-share",
"'><header class='modal-header'><" + heading + " class='modal-title'>" +
shareText + "</" + heading + "></header><ul class='colcount-xs-2'>";

// If there is a site filter, then filter the sites in advance
window.console.log( filterLen );
if ( filterLen !== 0 ) {
filteredSites = {};
for ( i = 0; i !== filterLen; i += 1 ) {
site = filter[ i ];
filteredSites[ site ] = sites[ site ];
window.console.log( "Filter: " + site );
}
sites = filteredSites;
}

// Generate the panel
for ( site in sites ) {
siteProperties = sites[ site ];
url = siteProperties.url
Expand Down

0 comments on commit 84966b5

Please sign in to comment.