', {'class': 'social-likes_single-w'}));
+ var wrapper = container.parent();
+
+ var defaultLeft = parseInt(container.css('left'), 10),
+ defaultTop = parseInt(container.css('top'), 10);
+
+ container.hide();
+
+ var button = $('
', {
+ 'class': getElementClassNames('button', 'single'),
+ 'text': container.data('single-title') || 'Share'
+ });
+ button.prepend($('
', {'class': getElementClassNames('icon', 'single')}));
+ wrapper.append(button);
+
+ var close = $('', {
+ 'class': prefix + 'close',
+ 'html': '×'
+ });
+ container.append(close);
+
+ this.number = 0;
+
+ button.click(function() {
+ container.css({ left: defaultLeft, top: defaultTop });
+ showInViewport(container, 20);
+ closeOnClick(container);
+
+ return false;
+ });
+ close.click(function() {
+ container.fadeOut(fadeSpeed);
+ });
+
+ this.wrapper = wrapper;
+ },
+ updateCounter: function(e, number) {
+ if (!number) return;
+
+ this.number += number;
+ this.getCounterElem().text(this.number);
+ },
+ getCounterElem: function() {
+ var counterElem = this.wrapper.find('.' + prefix + 'counter_single');
+ if (!counterElem.length) {
+ counterElem = $('', {
+ 'class': getElementClassNames('counter', 'single')
+ });
+ this.wrapper.append(counterElem);
+ }
+ return counterElem;
+ }
+};
+
+
+function Button(widget, options) {
+ this.widget = widget;
+ this.options = $.extend({}, options);
+ this.detectService();
+ if (this.service) {
+ this.init();
+ }
+}
+
+Button.prototype = {
+ init: function() {
+ this.detectParams();
+ this.initHtml();
+
+ if (this.options.pageCounters) {
+ if (this.options.counterNumber) {
+ this.updateCounter(this.options.counterNumber);
+ }
+ else {
+ counters.fetch(this.service, this.options.pageUrl)
+ .done($.proxy(this.updateCounter, this));
+ }
+ }
+ },
+
+ detectService: function() {
+ var classes = this.widget[0].classList || this.widget[0].className.split(' ');
+ for (var classIdx = 0; classIdx < classes.length; classIdx++) {
+ var cls = classes[classIdx];
+ if (services[cls]) {
+ this.service = cls;
+ $.extend(this.options, services[cls]);
+ return;
+ }
+ }
+ },
+
+ detectParams: function() {
+ // Custom page counter URL or number
+ var counter = this.widget.data('counter');
+ if (counter) {
+ var number = parseInt(counter);
+ if (isNaN(number))
+ this.options.counterUrl = counter;
+ else
+ this.options.counterNumber = number;
+ }
+ },
+
+ initHtml: function() {
+ var options = this.options,
+ widget = this.widget;
+ var isLink = !!options.clickUrl;
+
+ widget.removeClass(this.service);
+ widget.addClass(this.getElementClassNames('widget'));
+
+ // Old initialization HTML
+ var a = widget.find('a');
+ if (a.length) {
+ this.cloneDataAttrs(a, widget);
+ }
+
+ // Button
+ var button = $(isLink ? '' : '', {
+ 'class': this.getElementClassNames('button'),
+ 'text': widget.text()
+ });
+ if (isLink) {
+ var url = makeUrl(options.clickUrl, {
+ url: options.pageUrl,
+ title: options.pageTitle
+ });
+ button.attr('href', url);
+ }
+ else {
+ button.click($.proxy(this.click, this));
+ }
+
+ // Icon
+ button.prepend($('', {'class': this.getElementClassNames('icon')}));
+
+ widget.empty().append(button);
+ this.button = button;
+ },
+
+ cloneDataAttrs: function(source, destination) {
+ var data = source.data();
+ for (var key in data) if (data.hasOwnProperty(key)) {
+ destination.data(key, data[key]);
+ }
+ },
+
+ getElementClassNames: function(elem) {
+ return getElementClassNames(elem, this.service);
+ },
+
+ updateCounter: function(number) {
+ number = parseInt(number, 10);
+ if (!number) return;
+
+ var counterElem = $('', {
+ 'class': this.getElementClassNames('counter'),
+ 'text': number
+ });
+ this.widget.append(counterElem);
+
+ this.widget.trigger('counter.social-likes', number);
+ },
+
+ click: function(e) {
+ var options = this.options;
+ if ($.isFunction(options.click)) {
+ options.click.call(this, e);
+ }
+ else {
+ var url = makeUrl(options.popupUrl, {
+ url: options.pageUrl,
+ title: options.pageTitle
+ });
+ url = this.addAdditionalParamsToUrl(url);
+ this.openPopup(url, {
+ width: options.pupupWidth,
+ height: options.popupHeight
+ });
+ }
+ return false;
+ },
+
+ addAdditionalParamsToUrl: function(url) {
+ var params = this.options.additionalParams;
+ if (!params) return url;
+
+ var query = {};
+ for (var paramIdx = 0; paramIdx < params.length; paramIdx++) {
+ var key = params[paramIdx],
+ value = this.widget.data(key);
+ if (value) {
+ query[key] = value;
+ }
+ }
+
+ var glue = (url.indexOf('?') === -1 ? '?' : '&');
+ return url + glue + $.param(query);
+ },
+
+ openPopup: function(url, params) {
+ var left = Math.round(screen.width/2 - params.width/2),
+ top = 0;
+ if (screen.height > params.height) {
+ top = Math.round(screen.height/3 - params.height/2);
+ }
+
+ var win = window.open(url, 'sl_' + this.service, 'left=' + left + ',top=' + top + ',' +
+ 'width=' + params.width + ',height=' + params.height + ',personalbar=0,toolbar=0,scrollbars=1,resizable=1');
+ if (win) {
+ win.focus();
+ } else {
+ location.href = url;
+ }
+ }
+};
+
+
+/**
+ * Helpers
+ */
+
+function makeUrl(url, context) {
+ for (var key in context) if (context.hasOwnProperty(key)) {
+ url = url.replace('{' + key + '}', encodeURIComponent(context[key]));
+ }
+ return url;
+}
+
+function template(tmpl, context) {
+ for (var key in context) if (context.hasOwnProperty(key)) {
+ tmpl = tmpl.replace('{' + key + '}', context[key]);
+ }
+ return tmpl;
+}
+
+function getElementClassNames(elem, mod) {
+ var cls = prefix + elem;
+ return cls + ' ' + cls + '_' + mod;
+}
+
+function closeOnClick(elem) {
+ var doc = $(document),
+ clickEvent = 'click.social-likes' + Math.random();
+ doc.on(clickEvent, function(e) {
+ if (!$(e.target).closest(elem).length) {
+ elem.fadeOut(fadeSpeed);
+ doc.off(clickEvent);
+ }
+ });
+}
+
+function showInViewport(elem, offset) {
+ if (document.documentElement.getBoundingClientRect) {
+ var left = parseInt(elem.css('left'), 10),
+ top = parseInt(elem.css('top'), 10);
+ elem.css('visibility', 'hidden').show();
+
+ var rect = elem[0].getBoundingClientRect();
+ if (rect.left < offset)
+ elem.css('left', offset - rect.left + left);
+ else if (rect.right > window.innerWidth - offset)
+ elem.css('left', window.innerWidth - rect.right - offset + left);
+
+ if (rect.top < offset)
+ elem.css('top', offset - rect.top + top);
+ else if (rect.bottom > window.innerHeight - offset)
+ elem.css('top', window.innerHeight - rect.bottom - offset + top);
+
+ elem.hide().css('visibility', 'visible');
+ }
+ elem.fadeIn(fadeSpeed);
+}
+
+
+/**
+ * Auto initialization
+ */
+$(function() {
+ $('.social-likes').socialLikes();
+});
+
}));
\ No newline at end of file