Skip to content

Instantly share code, notes, and snippets.

@arnogues
Last active October 14, 2019 16:16
Show Gist options
  • Save arnogues/8415089 to your computer and use it in GitHub Desktop.
Save arnogues/8415089 to your computer and use it in GitHub Desktop.
Js prototype with jquery plugin integration
<div id="mydiv" data-pluginname-options="{foo:'bar', buzz:2, icanhas:true}" data-pluginname-optionname="foo">
</div>
/**
*
*/
(function ($) {
PluginName = function () {
this.init.apply(this, arguments);
};
PluginName.prototype = {
constructor: PluginName.prototype.constructor,
options: {
},
init: function (element, options) {
//main element
this.$element = element;
//set options
this.options = this.setOptions(options);
this.setElements();
this.setEvents();
},
setElements: function () {
console.log('setElements');
},
setEvents: function () {
console.log('setEvents');
},
setOptions:function(options) {
var options = $.extend(true, {}, this.options, options);
//check options on the node
var pluginnameRe = new RegExp('^pluginName');
var data = this.$element.data();
for (var i in data) {
if(i.indexOf('pluginName')==0 && data.hasOwnProperty(i)) {
}
}
}
};
//jquery plugin implementation
$.fn.pluginName = function(options) {
return this.each(function() {
if(!$(this).data('PluginName'))
$(this).data('PluginName', new PluginName(this, options));
});
};
})(jQuery);
//Init as jquery plugin
$('div').pluginName({
'foo':'bar'
});
//Init by using new
new PluginName($('div'), {
'foo':'bar'
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment