Committer: vvasin
LJSUP-14013: Refactoring of LJShare. Fix existed code for 'use strict'.U trunk/htdocs/js/share.js
Modified: trunk/htdocs/js/share.js
===================================================================
--- trunk/htdocs/js/share.js 2012-10-23 07:53:39 UTC (rev 23183)
+++ trunk/htdocs/js/share.js 2012-10-23 08:19:50 UTC (rev 23184)
@@ -1,336 +1,330 @@
-(function( window, $ ) {
-
/**
-*
+*
* Livejournal sharing script.
-*
+*
* Usage:
-*
+*
* .. Somewhere in the head ..
* <script type="text/javascript">
-* //show only three links in popup by default
-* LJShare.init({"ml":{"close":"Close","title":"Share"},"links":["facebook","twitter","email"]})
+* //show only three links in popup by default
+* LJShare.init({"ml":{"close":"Close","title":"Share"},"links":["facebook","twitter","email"]})
* </script>
-*
+*
* .. Somewhere on the page ..
* <a href="#">share</a>
* <script type="text/javascript">
-* LJShare.link( {
-* "url":"http://community.livejournal.com/news/750.html",
-* "title":"Some title",
-* "description":"Some description",
-* "links": [ "twitter", "vkontakte", "moimir" ] //we want custom buttons there
-* });
+* LJShare.link( {
+* "url":"http://community.livejournal.com/news/750.html",
+* "title":"Some title",
+* "description":"Some description",
+* "links": [ "twitter", "vkontakte", "moimir" ] //we want custom buttons there
+* });
* </script>
*
* You can attach single links:
* LJShare.entry( { url: "http://some.url.com/", title: "Post title", description: "Post description" } )
-* .attach( '#link_selector', 'service_name' )
-* .attach( jQuery( '#another_selector' ), 'service_name2' ) //we can pass nodes or jquery collections
-* .link( '#selector', [ "twitter", "vkontakte", "moimir"] ); //also we can attach popup
-*
+* .attach( '#link_selector', 'service_name' )
+* .attach( jQuery( '#another_selector' ), 'service_name2' ) //we can pass nodes or jquery collections
+* .link( '#selector', [ "twitter", "vkontakte", "moimir"] ); //also we can attach popup
+*
*/
-function preload( srcArr ) {
- for( var i = 0; i < srcArr.length; ++i ) {
- ( new Image() ).src = Site.imgprefix + srcArr[ i ] + '?v=1';
- }
-}
+;(function ($) {
+ 'use strict';
-function prepareOptions( opts ) {
- var defaults = {
- title: '',
- description: '',
- url: ''
- };
+ var imgPrefix = Site.imgprefix,
+ LJShare = {};
- var options = jQuery.extend( {}, defaults, opts );
+ function preload( src ) {
+ var img = new Image();
+ img.src = imgPrefix + src + '?v=1';
+ }
- //we encode strings two times, because they are decoded once on the livejournal endpoint
- options.url = encodeURIComponent( encodeURIComponent( options.url ) );
- options.title = encodeURIComponent( encodeURIComponent( options.title ) );
- options.description = encodeURIComponent( encodeURIComponent( options.description ) );
- return options;
-}
+ function prepareOptions( opts ) {
+ var options = $.extend({ title: '', description: '', url: '' }, opts);
-preload( [
- '/popup-cls.gif',
- '/popup-arr.gif',
- '/icons/sharethis.gif'
-] );
+ //we encode strings two times, because they are decoded once on the livejournal endpoint
+ options.url = encodeURIComponent( encodeURIComponent( options.url ) );
+ options.title = encodeURIComponent( encodeURIComponent( options.title ) );
+ options.description = encodeURIComponent( encodeURIComponent( options.description ) );
+ return options;
+ }
-function pollForWindowClose(w, service, link) {
- if (w.closed) {
+ [ '/popup-cls.gif', '/popup-arr.gif', '/icons/sharethis.gif' ].forEach(preload);
- /**
- * Callback will be fired when external sharing popup will be closed
- * sharing script will poll for this, so expect some delay.
- *
- * @name LJShare#popupClosed
- * @param {String} service The name of service which window was closed.
- * @event
- */
- var event = jQuery.Event('popupClosed', { service: service, shareLink: link });
- LJShare.dispatchMessage(event);
- } else {
- setTimeout(pollForWindowClose.bind(null, w, service, link), 200);
- }
-}
+ function pollForWindowClose(w, service, link) {
+ if (w.closed) {
-var selectors = {
- close: ".i-popup-close",
- links: ".b-sharethis-services a",
- arrow: ".i-popup-arr"
-};
+ /**
+ * Callback will be fired when external sharing popup will be closed
+ * sharing script will poll for this, so expect some delay.
+ *
+ * @name LJShare#popupClosed
+ * @param {String} service The name of service which window was closed.
+ * @event
+ */
+ var event = jQuery.Event('popupClosed', { service: service, shareLink: link });
+ LJShare.dispatchMessage(event);
+ } else {
+ setTimeout(pollForWindowClose.bind(null, w, service, link), 200);
+ }
+ }
-// four arrow positions availible
-var arrow_opts = {
- className: "i-popup-arr",
- position: {
- tl: "i-popup-arrtl",
- tr: "i-popup-arrtr",
- bl: "i-popup-arrbl",
- br: "i-popup-arrbr"
- }
-};
+ var selectors = {
+ close: ".i-popup-close",
+ links: ".b-sharethis-services a",
+ arrow: ".i-popup-arr"
+ };
-var template = {
- //here we take values from global_options.ml object
- start: '<div class="b-sharethis">' +
- '<div class="b-sharethis-head">{title}</div>' +
- '<div class="b-sharethis-services">',
- //here we take values from an object made from service object. Availible vars: name, url, title.
- item: '<span class="b-sharethis-{name}"><a href="{url}" data-service={name}>{title}</a></span>',
- //here we take values from global_options.ml object
- end: '</div>' +
- '</div>'
-};
+ // four arrow positions availible
+ var arrow_opts = {
+ className: "i-popup-arr",
+ position: {
+ tl: "i-popup-arrtl",
+ tr: "i-popup-arrtr",
+ bl: "i-popup-arrbl",
+ br: "i-popup-arrbr"
+ }
+ };
-//buildLink takes values passed to the url with link method ( title, post url, description )
-var default_options = {
- ml: {
- close: "Close",
- title: "Share"
- },
- services: {
- livejournal: {
- title: 'LiveJournal', bindLink: 'http://www.livejournal.com/update.bml?repost_type=c&repost={url}', openInTab: true
- },
- facebook: {
- title: 'Facebook', bindLink: 'http://www.facebook.com/sharer.php?u={url}'
- },
- twitter: {
- title: 'Twitter', bindLink: 'http://twitter.com/share?url={url}&text={title}'
- },
- vkontakte: {
- title: 'Vkontakte', bindLink: 'http://vkontakte.ru/share.php?url={url}'
- },
- moimir: {
- title: 'Moi Mir', bindLink: 'http://connect.mail.ru/share?url={url}'
- },
- stumbleupon: {
- title: 'Stumbleupon', bindLink: 'http://www.stumbleupon.com/submit?url={url}', openInTab: true
- },
- digg: {
- title: 'Digg', bindLink: 'http://digg.com/submit?url={url}', openInTab: true
- },
- email: {
- title: 'E-mail', bindLink: 'http://api.addthis.com/oexchange/0.8/forward/email/offer?username=internal&url={url}&title={title}', height: 600
- },
- tumblr: {
- title: 'Tumblr', bindLink: 'http://www.tumblr.com/share?v=3&u={url}'
- },
- odnoklassniki: {
- title: 'Odnoklassniki', bindLink: 'http://www.odnoklassniki.ru/dk?st.cmd=addShare&st.s=1&st._surl={url}'
- }
- },
- //list of links wich will be shown, when user will click on share link. Can be overriden in init and link methods.
- links: [ 'livejournal', 'facebook', 'twitter', 'vkontakte', 'odnoklassniki', 'moimir', 'email', 'digg', 'tumblr', 'stumbleupon' ],
- showOn: 'click'
-};
+ var template = {
+ //here we take values from global_options.ml object
+ start: '<div class="b-sharethis">' +
+ '<div class="b-sharethis-head">{title}</div>' +
+ '<div class="b-sharethis-services">',
+ //here we take values from an object made from service object. Availible vars: name, url, title.
+ item: '<span class="b-sharethis-{name}"><a href="{url}" data-service={name}>{title}</a></span>',
+ //here we take values from global_options.ml object
+ end: '</div>' +
+ '</div>'
+ };
-var global_options = $.extend( true, {}, default_options );
+ //buildLink takes values passed to the url with link method ( title, post url, description )
+ var default_options = {
+ ml: {
+ close: "Close",
+ title: "Share"
+ },
+ services: {
+ livejournal: {
+ title: 'LiveJournal', bindLink: 'http://www.livejournal.com/update.bml?repost_type=c&repost={url}', openInTab: true
+ },
+ facebook: {
+ title: 'Facebook', bindLink: 'http://www.facebook.com/sharer.php?u={url}'
+ },
+ twitter: {
+ title: 'Twitter', bindLink: 'http://twitter.com/share?url={url}&text={title}'
+ },
+ vkontakte: {
+ title: 'Vkontakte', bindLink: 'http://vkontakte.ru/share.php?url={url}'
+ },
+ moimir: {
+ title: 'Moi Mir', bindLink: 'http://connect.mail.ru/share?url={url}'
+ },
+ stumbleupon: {
+ title: 'Stumbleupon', bindLink: 'http://www.stumbleupon.com/submit?url={url}', openInTab: true
+ },
+ digg: {
+ title: 'Digg', bindLink: 'http://digg.com/submit?url={url}', openInTab: true
+ },
+ email: {
+ title: 'E-mail', bindLink: 'http://api.addthis.com/oexchange/0.8/forward/email/offer?username=internal&url={url}&title={title}', height: 600
+ },
+ tumblr: {
+ title: 'Tumblr', bindLink: 'http://www.tumblr.com/share?v=3&u={url}'
+ },
+ odnoklassniki: {
+ title: 'Odnoklassniki', bindLink: 'http://www.odnoklassniki.ru/dk?st.cmd=addShare&st.s=1&st._surl={url}'
+ }
+ },
+ //list of links wich will be shown, when user will click on share link. Can be overriden in init and link methods.
+ links: [ 'livejournal', 'facebook', 'twitter', 'vkontakte', 'odnoklassniki', 'moimir', 'email', 'digg', 'tumblr', 'stumbleupon' ],
+ showOn: 'click'
+ };
-window.LJShare = {};
-LJ.addPubSub(LJShare); //we add messaging system to notify external scripts about popups being closed.
+ var global_options = $.extend( true, {}, default_options );
-/**
-* Overrides default options for current page.
-*
-* @param Object opts Options object, may contain the following fields:
-* ml - translation strings to use;
-* services - An Object, that contains configuration fields for services links;
-* links - array of links that will be shown to the user in popup.
-*/
-window.LJShare.init = function( opts ) {
- if( opts ) {
- global_options = $.extend( true, {}, default_options, opts );
- global_options.links = opts.links || global_options.links;
- }
-};
+ // we add messaging system to notify external scripts about popups being closed.
+ LJ.addPubSub(LJShare);
-/**
-* Bind share popup to the latest link found on the page
-*
-* @param Object opts Options object, may contain the following fields:
-* title, description, url - parameters of the page you want to share;
-* links - array of links that will be shown to the user in popup.
-* @param String|Node|Jquery collection Node the popup has to be attached to. Default id a:last
-*/
-window.LJShare.link = function( opts, node ) {
- if( opts && opts.share_uniq_id ) {
- var id = opts.share_uniq_id;
- delete opts.share_uniq_id;
- LJShare.link( opts, $( '#' + id ) );
- return;
- }
+ /**
+ * Overrides default options for current page.
+ *
+ * @param Object opts Options object, may contain the following fields:
+ * ml - translation strings to use;
+ * services - An Object, that contains configuration fields for services links;
+ * links - array of links that will be shown to the user in popup.
+ */
+ LJShare.init = function( opts ) {
+ if( opts ) {
+ global_options = $.extend( true, {}, default_options, opts );
+ global_options.links = opts.links || global_options.links;
+ }
+ };
- var a = node || $( 'a:last' ),
- linkImg = a.find( 'img' ),
- link = (linkImg.length) ? linkImg : a,
- url = a.attr( 'href' ),
- options = prepareOptions( $.extend( {}, { url: url } , opts ) ),
- dom;
+ /**
+ * Bind share popup to the latest link found on the page
+ *
+ * @param Object opts Options object, may contain the following fields:
+ * title, description, url - parameters of the page you want to share;
+ * links - array of links that will be shown to the user in popup.
+ * @param String|Node|Jquery collection Node the popup has to be attached to. Default id a:last
+ */
+ LJShare.link = function ( opts, node ) {
+ if( opts && opts.share_uniq_id ) {
+ var id = opts.share_uniq_id;
+ delete opts.share_uniq_id;
+ LJShare.link( opts, $( '#' + id ) );
+ return;
+ }
- a.attr( 'href', 'javascript:void(0)' );
+ var a = node || $( 'a:last' ),
+ linkImg = a.find( 'img' ),
+ link = (linkImg.length) ? linkImg : a,
+ url = a.attr( 'href' ),
+ options = prepareOptions( $.extend( {}, { url: url } , opts ) ),
+ dom;
- var links = ( opts.links ) ? opts.links : global_options.links;
+ a.on('click', function (e) { e.preventDefault(); });
- function buildDom( initHidden ) {
- initHidden = initHidden || false;
- var str = [ template.start.supplant(global_options.ml) ],
- serviceName, serviceObj;
+ var links = ( opts.links ) ? opts.links : global_options.links;
- for( var i = 0; i < links.length; ++i ) {
- serviceName = links[i];
- serviceObj = global_options.services[ serviceName ];
+ function buildDom( initHidden ) {
+ var bubbleOptions = null;
- str.push( template.item.supplant({
- name: serviceName,
- title: serviceObj.title,
- url: serviceObj.bindLink.supplant(options)
- } ) );
- }
+ initHidden = initHidden || false;
+ var str = [ template.start.supplant(global_options.ml) ],
+ serviceName, serviceObj;
- str.push(template.end.supplant(global_options.ml));
+ for( var i = 0; i < links.length; ++i ) {
+ serviceName = links[i];
+ serviceObj = global_options.services[ serviceName ];
- bubbleOptions = {
- target: link,
- showOn: options.showOn || global_options.showOn
- };
+ str.push( template.item.supplant({
+ name: serviceName,
+ title: serviceObj.title,
+ url: serviceObj.bindLink.supplant(options)
+ } ) );
+ }
- if( options.showOn === "hover" ) {
- bubbleOptions.closeControl = false;
- }
+ str.push(template.end.supplant(global_options.ml));
- dom = $( str.join( ' ' ) )
- .hide()
- .bubble( bubbleOptions );
+ bubbleOptions = {
+ target: link,
+ showOn: options.showOn || global_options.showOn
+ };
- if( !initHidden ) {
- dom
- .bubble( 'show' );
- }
- }
+ if( options.showOn === "hover" ) {
+ bubbleOptions.closeControl = false;
+ }
- function bindControls() {
- dom.find( selectors.links ).click( function( ev )
- {
- dom.bubble('hide');
- var service = $( this ).attr( 'data-service' );
+ dom = $( str.join( ' ' ) )
+ .hide()
+ .bubble( bubbleOptions );
- LJShare.openPopupEvent(this, ev, options, service);
- } );
- }
+ if( !initHidden ) {
+ dom
+ .bubble( 'show' );
+ }
+ }
- if( options.showOn === "hover" ) {
- if( !dom ) {
- buildDom( true );
- bindControls();
- }
- }
+ function bindControls() {
+ dom.find( selectors.links ).click( function( ev ) {
+ dom.bubble('hide');
+ var service = $( this ).attr( 'data-service' );
- link.one( 'click', function( ev ) {
- ev.stopPropagation();
-
- if( !dom ) {
- buildDom();
- bindControls();
- }
- } );
+ LJShare.openPopupEvent(this, ev, options, service);
+ });
+ }
- return this;
-};
+ if( options.showOn === "hover" ) {
+ if( !dom ) {
+ buildDom( true );
+ bindControls();
+ }
+ }
-/**
- * open popup functionality was exposed to allow the modification of its behavior
- * by external scripts
- */
-window.LJShare.openPopupEvent = function(el, ev, options, service) {
- var width, height;
+ link.one( 'click', function( ev ) {
+ ev.stopPropagation();
- if( global_options.services[ service ].openInTab ) {
- if( $.browser.msie ) {
- ev.preventDefault();
- width = $( window ).width();
- height = $( window ).height();
- window.open( el.href, null, 'toolbar=yes,menubar=yes,status=1,location=yes,scrollbars=yes,resizable=yes,width=' + width + ',height=' + height );
- } else {
- //other browsers just open link in new tab
- el.target = "_blank";
- }
- } else {
- ev.preventDefault();
- width = global_options.services[ service ].width || 640;
- height = global_options.services[ service ].height || 480;
- w = window.open(el.href, 'sharer', 'toolbar=0,status=0,width=' + width + ',height=' + height + ',scrollbars=yes,resizable=yes');
- //double encoded url?!
- pollForWindowClose(w, service, decodeURIComponent(decodeURIComponent(options.url)));
- }
-};
+ if( !dom ) {
+ buildDom();
+ bindControls();
+ }
+ });
-window.LJShare.entry = function( opts ) {
- var defaults = {
- title: '',
- description: '',
- url: ''
- };
+ return this;
+ };
- var options = prepareOptions( opts );
+ /**
+ * open popup functionality was exposed to allow the modification of its behavior
+ * by external scripts
+ */
+ LJShare.openPopupEvent = function(el, ev, options, service) {
+ var width, height, w;
- return {
- attach: function( node, service ) {
- var link = jQuery( node ),
- serviceObj = global_options.services[ service ];
+ if( global_options.services[ service ].openInTab ) {
+ if( $.browser.msie ) {
+ ev.preventDefault();
+ width = $( window ).width();
+ height = $( window ).height();
+ window.open( el.href, null, 'toolbar=yes,menubar=yes,status=1,location=yes,scrollbars=yes,resizable=yes,width=' + width + ',height=' + height );
+ } else {
+ //other browsers just open link in new tab
+ el.target = "_blank";
+ }
+ } else {
+ ev.preventDefault();
+ width = global_options.services[ service ].width || 640;
+ height = global_options.services[ service ].height || 480;
+ w = window.open(el.href, 'sharer', 'toolbar=0,status=0,width=' + width + ',height=' + height + ',scrollbars=yes,resizable=yes');
+ //double encoded url?!
+ pollForWindowClose(w, service, decodeURIComponent(decodeURIComponent(options.url)));
+ }
+ };
- if( service in global_options.services ) {
- link.each( function() {
- var url = serviceObj.bindLink.supplant(options);
- if ( service.openInTab ) {
- this.url = url;
- this.target = "_blank";
- } else {
- $( this ).click( function( ev ) {
- var width = service.width || 640;
- var height = service.height || 480;
- window.open( url, 'sharer', 'toolbar=0,status=0,width=' + width + ',height=' + height + ',scrollbars=yes,resizable=yes');
- ev.preventDefault();
- } );
- }
- } );
- }
+ LJShare.entry = function (opts) {
+ var defaults = {
+ title: '',
+ description: '',
+ url: ''
+ };
- return this;
- },
+ var options = prepareOptions( opts );
- link: function( node, links ) {
- var opts = jQuery.extend( {}, options, links ? { links: links } : null );
- LJShare.link( opts, ( node ) ? jQuery( node ) : null );
+ return {
+ attach: function( node, service ) {
+ var link = jQuery( node ),
+ serviceObj = global_options.services[ service ];
- return this;
- }
- };
+ if ( service in global_options.services ) {
+ link.each( function() {
+ var url = serviceObj.bindLink.supplant(options);
+ if ( service.openInTab ) {
+ this.url = url;
+ this.target = "_blank";
+ } else {
+ $( this ).click( function( ev ) {
+ var width = service.width || 640;
+ var height = service.height || 480;
+ window.open( url, 'sharer', 'toolbar=0,status=0,width=' + width + ',height=' + height + ',scrollbars=yes,resizable=yes');
+ ev.preventDefault();
+ } );
+ }
+ } );
+ }
-};
+ return this;
+ },
-} )( window, jQuery );
+ link: function( node, links ) {
+ var opts = $.extend( {}, options, links ? { links: links } : null );
+ LJShare.link( opts, ( node ) ? jQuery( node ) : null );
+
+ return this;
+ }
+ };
+ };
+
+ window.LJShare = LJShare;
+}(jQuery));
