Last active
April 15, 2020 10:34
-
-
Save krizpoon/cdae7b43d9ef76494877 to your computer and use it in GitHub Desktop.
jQuery Plugin
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
Make a jQuery plugin | |
@param string name - Name of plugin | |
@param string extend - Name of parent plugin to extend | |
@param function onInit(element, instance) - a function that initialize the plugin instance on the element. To export methods, assign the functions to the instance. | |
@param object defaults - a set of default values which can be accessed through instance.options | |
Example: | |
// Defining a plugin: | |
TSCreatePlugin($, 'hello', null, function onInit(elem, instance) { | |
var privateVar = 'secret'; | |
function privateFunction() {} | |
instance.foo = 'bar'; | |
instance.greet = function(name) { console.log(this.options.greetMessage + ', ' + name + '! I\'m a ' + elem.prop('tagName') + '.'); } | |
instance.onDestroy = function() { delete this.foo; } | |
}, {greetMessage:'Hello'}); | |
Usage: | |
$(elem).hello({greetMessage:'Hola'}); // Initialize an instance associated with elem, may not be necessary for some plugins. | |
$(elem).hello('greet', 'Guest'); // Invoke plugin methods | |
$(elem).hello('foo'); // Get a property of the plugin instance | |
$(elem).hello('destroy'); // Remove the plugin instance, calling instance.onDestroy if provided | |
Note: It may not be a nice idea to invoke a plugin method without initializing the plugin instance previously because the arguments provided will be treated as initialization options. | |
*/ | |
function TSCreatePlugin($, name, extend, onInit, defaults) { | |
$.fn[name] = function(cmd, options) { | |
var instanceKey = 'handy-plugin-'+name; | |
var instance = this.data(instanceKey); | |
var superInstance = null; | |
if (cmd === undefined || typeof cmd == 'object') { | |
options = cmd; | |
cmd = null; | |
} | |
// special command: destroy | |
if (cmd == 'destroy') { | |
if (instance && typeof instance['onDestroy'] == 'function') { | |
instance.onDestroy(); | |
} | |
this.removeData(instanceKey); | |
return this; | |
} | |
// special command: get the controller instance | |
if (cmd == 'controller') { | |
return instance; | |
} | |
// init instance | |
if (!instance) { | |
// super init | |
if (extend && typeof this[extend] == 'function') { | |
this[extend](cmd, options); | |
superInstance = this[extend]('controller'); | |
} | |
// create instance | |
instance = $.extend({}, superInstance); | |
this.data(instanceKey, instance); | |
// merge options with default settings | |
var optionsObject = typeof options == 'object'? options: null; | |
instance.options = $.extend({}, defaults || {}, optionsObject || {}); | |
// init instance | |
onInit(this, instance, superInstance); | |
} | |
// invoking methods / getting properties | |
var args = []; for (var i = 1; i < arguments.length; i++) args.push(arguments[i]); | |
if (typeof instance[cmd] == 'function') { | |
var ret = instance[cmd].apply(instance, args); | |
if (ret !== undefined) return ret; | |
} else if (instance[cmd] !== undefined) { | |
return instance[cmd]; | |
} | |
return this; | |
}; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment