diff --git a/Readme.md b/Readme.md
index b94dfbf..80b8d3e 100644
--- a/Readme.md
+++ b/Readme.md
@@ -68,7 +68,7 @@ If you want to remove button titles add `social-likes_notext` class to make it l
### Options
-Options define via HTML data attributes.
+Options define via HTML data attributes or JavaScript parameters object.
`url`
@@ -104,6 +104,14 @@ Examples:
```
+```js
+$('.social-likes').socialLikes({
+ url: 'https://github.com/sapegin/social-likes/',
+ title: 'Beautiful “like” buttons with counters for popular social networks',
+ counters: true
+});
+```
+
### Services specific options
#### Twitter
diff --git a/src/demo.html b/src/demo.html
index b94fb7d..68571a2 100644
--- a/src/demo.html
+++ b/src/demo.html
@@ -4,7 +4,7 @@
Social Likes
-
+
@@ -132,7 +132,7 @@ body {
Google+
Pinterest
-
+
Facebook
Мой мир
@@ -211,6 +211,20 @@ sl.on('counter.social-likes', function(event, service, number) {
console.log('Counter', service, number);
});
sl.socialLikes();
+
+
+ Manual initialization with JavaScript options
+
+
+
User button & custom count
diff --git a/src/social-likes.js b/src/social-likes.js
index 3cc9796..cb662f4 100644
--- a/src/social-likes.js
+++ b/src/social-likes.js
@@ -19,7 +19,7 @@
else {
factory(jQuery);
}
-}(function($) { 'use strict';
+}(function($, undefined) { 'use strict';
var prefix = 'social-likes';
var classPrefix = prefix + '__';
@@ -165,16 +165,16 @@ var counters = {
/**
* jQuery plugin
*/
-$.fn.socialLikes = function() {
+$.fn.socialLikes = function(opts) {
return this.each(function() {
- new SocialLikes($(this));
+ new SocialLikes($(this), opts);
});
};
-function SocialLikes(container) {
+function SocialLikes(container, opts) {
this.container = container;
- this.init();
+ this.init(opts);
}
SocialLikes.prototype = {
@@ -194,19 +194,23 @@ SocialLikes.prototype = {
showCounters: {
attr: 'counters',
defaultValue: 'yes',
- convert: function(value) { return value === 'yes'; }
+ convert: function(value) { return value === true || value === 'yes'; }
},
showZeroes: {
attr: 'zeroes',
defaultValue: 'no',
- convert: function(value) { return value === 'yes'; }
+ convert: function(value) { return value === true || value === 'yes'; }
+ },
+ singleTitle: {
+ attr: 'single-title',
+ defaultValue: 'Share'
}
},
- init: function() {
+ init: function(opts) {
// Add class in case of manual initialization
this.container.addClass(prefix);
- this.readOptions();
+ this.readOptions(opts);
this.single = this.container.hasClass(prefix + '_single');
this.initUserButtons();
@@ -220,12 +224,15 @@ SocialLikes.prototype = {
new Button($(this), options);
});
},
- readOptions: function() {
+ readOptions: function(opts) {
+ opts = opts || {};
this.options = {};
+
for (var key in this.optionsMap) {
var option = this.optionsMap[key];
- var value = this.container.data(option.attr);
- if (!value) {
+ var value = opts[option.attr] !== undefined ? opts[option.attr] : this.container.data(option.attr);
+
+ if (value === undefined) {
if ($.isFunction(option.defaultValue)) {
value = $.proxy(option.defaultValue, this)();
}
@@ -256,7 +263,7 @@ SocialLikes.prototype = {
var button = $('', {
'class': getElementClassNames('button', 'single'),
- 'text': container.data('single-title') || 'Share'
+ 'text': this.options.singleTitle
});
button.prepend($('', {'class': getElementClassNames('icon', 'single')}));
wrapper.append(button);