MediaWiki:InlineDisqussions.js

/* * inlineDisqussions * By Tsachi Shlidor ( @shlidor ) * Inspired by http://mystrd.at/articles/multiple-disqus-threads-on-one-page/ * * USAGE: * *      disqus_shortname = 'your_disqus_shortname'; *      $(document).ready(function { *         $("p").inlineDisqussions(options); *       }); * * See https://github.com/tsi/inlineDisqussions for more info. */

// Disqus global vars. var disqus_shortname; var disqus_identifier; var disqus_url;

(function($) {

var settings = {};

$.fn.extend({   inlineDisqussions: function(options) {

// Set up defaults var defaults = { identifier: 'disqussion', displayCount: true, highlighted: false, position: 'right', background: 'white', maxWidth: 9999 };

// Overwrite default options with user provided ones. settings = $.extend({}, defaults, options);

// Append #disqus_thread to body if it doesn't exist yet. if ($('#disqussions_wrapper').length === 0) { $(' ').appendTo($('body')); }     if ($('#disqus_thread').length === 0) { $(' ').appendTo('#disqussions_wrapper'); }     else { mainThreadHandler; }     if (settings.highlighted) { $(' ').appendTo($('body')); }

// Attach a discussion to each paragraph. $(this).each(function(i) {       disqussionNotesHandler(i, $(this));      });

// Display comments count. if (settings.displayCount) { loadDisqusCounter; }

// Hide the discussion. $('html').click(function(event) {       if($(event.target).parents('#disqussions_wrapper, .main-disqussion-link-wrp').length === 0) {          hideDisqussion;        }      });

} });

var disqussionNotesHandler = function(i, node) {

var identifier; // You can force a specific identifier by adding an attribute to the paragraph. if (node.attr('data-disqus-identifier')) { identifier = node.attr('data-disqus-identifier'); }   else { while ($('[data-disqus-identifier="' + window.location.pathname + settings.identifier + '-' + i + '"]').length > 0) { i++; }     identifier = window.location.pathname + settings.identifier + '-' + i;    }

// Create the discussion note. var cls = settings.highlighted ? 'disqussion-link disqussion-highlight' : 'disqussion-link'; var a = $('') .attr('href', window.location.pathname + settings.identifier + '-' + i + '#disqus_thread') .attr('data-disqus-identifier', identifier) .attr('data-disqus-url', window.location.href + settings.identifier + '-' + i)     .attr('data-disqus-position', settings.position) .text('+') .wrap(' ') .parent .appendTo('#disqussions_wrapper'); a.css({     'top': node.offset.top,      'left': settings.position == 'right' ? node.offset.left + node.outerWidth : node.offset.left - a.outerWidth    });

node.attr('data-disqus-identifier', identifier).mouseover(function {       a.addClass("hovered");    }).mouseout(function {        a.removeClass("hovered");    });

// Load the relative discussion. a.delegate('a.disqussion-link', "click", function(e) {     e.preventDefault;

if ($(this).is('.active')) { e.stopPropagation; hideDisqussion; }     else { loadDisqus($(this), function(source) {         relocateDisqussion(source);        }); }

});

};

var mainThreadHandler = function {

// Create the discussion note. if ($('a.main-disqussion-link').length === 0) {

var a = $('') .attr('href', window.location.pathname + '#disqus_thread') .text('Comments') .wrap('') .parent .insertBefore('#disqus_thread');

// Load the relative discussion. a.delegate('a.main-disqussion-link', "click", function(e) {       e.preventDefault;

if ($(this).is('.active')) { e.stopPropagation; }       else { loadDisqus($(this), function(source) {           relocateDisqussion(source, true);          }); }

});

}

};

var loadDisqus = function(source, callback) {

disqus_identifier = source.attr('data-disqus-identifier'); disqus_url = source.attr('data-disqus-url');

if (window.DISQUS) { // If Disqus exists, call it's reset method with new parameters. DISQUS.reset({       reload: true,        config: function  {          this.page.identifier = disqus_identifier;          this.page.url = disqus_url;        }      });

} else {

// Append the Disqus embed script to. var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = '//' + disqus_shortname + '.disqus.com/embed.js'; $('head').append(s);

}

// Add 'active' class. $('a.disqussion-link, a.main-disqussion-link').removeClass('active').filter(source).addClass('active');

// Highlight if (source.is('.disqussion-highlight')) { highlightDisqussion(disqus_identifier); }

callback(source);

};

var loadDisqusCounter = function {

// Append the Disqus count script to. if (!$('script[src*="disqus.com/count.js"]').length) { var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = '//' + disqus_shortname + '.disqus.com/count.js';

$('head').append(s);

var limit = 0; var timer = setInterval(function {       limit++;        // After script is loaded, show bubles with numbers.        if (typeof(DISQUSWIDGETS) === 'object') {          $('.disqussion-link').filter(function { return $(this).text.match(/[1-9]/g); }).addClass("has-comments");         clearInterval(timer);        }        // Don't run forever.        if (limit > 10) {          clearInterval(timer);        }      }, 1000)

}

};

var relocateDisqussion = function(el, main) {

// Move the discussion to the right position. var css = {}; if (main === true) { $('#disqus_thread').removeClass("positioned"); css = { 'position': 'static', 'width': 'auto' };   }    else { $('#disqus_thread').addClass("positioned"); css = { 'position': 'absolute' };   }    css.backgroundColor = settings.background;

var animate = {}; if (el.attr('data-disqus-position') == 'right') { animate = { "top": el.offset.top, "left": el.offset.left + el.outerWidth, "width": Math.min(parseInt($(window).width - (el.offset.left + el.outerWidth), 10), settings.maxWidth) };   }    else if (el.attr('data-disqus-position') == 'left') { animate = { "top": el.offset.top, "left": el.offset.left - Math.min(parseInt(el.offset.left, 10), settings.maxWidth), "width": Math.min(parseInt(el.offset.left, 10), settings.maxWidth) };   }

$('#disqus_thread').stop.fadeIn('fast').animate(animate, "fast").css(css);

};

var hideDisqussion = function {

$('#disqus_thread').stop.fadeOut('fast'); $('a.disqussion-link').removeClass('active');

// settings.highlighted $('#disqussions_overlay').fadeOut('fast'); $('body').removeClass('disqussion-highlight'); $('[data-disqus-identifier]').removeClass('disqussion-highlighted');

};

var highlightDisqussion = function(identifier) {

$('body').addClass('disqussion-highlight'); $('#disqussions_overlay').fadeIn('fast'); $('[data-disqus-identifier]') .removeClass('disqussion-highlighted') .filter('[data-disqus-identifier="' + identifier + '"]:not(".disqussion-link")') .addClass('disqussion-highlighted');

};

})(jQuery);