Tooltipster

To create a Tooltipster plugin, use the $.tooltipster._plugin() method. A plugin can provide functionality at the core level (accessible via $.tooltipster.methodName) or the instance level (accessible via instance.methodName).

Plugin Structure

• Core level: Use the core object to define methods that act on all tooltips. Use __init to receive the core reference.
• Instance level: Use the instance object to define methods for specific tooltips. Use __init to receive the instance reference and __destroy to clean up listeners.
• Options: Use __defaults within the instance object to define default configuration values.

Best Practices

• UMD Compliance: Wrap your plugin in a UMD (Universal Module Definition) pattern to support AMD, CommonJS, and global script loading.
• Chaining: Public methods should return the object they are attached to (either the core or the instance) to allow method chaining.
• Namespacing: Namespace your event listeners (e.g., pluginName-randomID) and unbind them in the __destroy method to prevent conflicts.
• File Naming: If your plugin is named myNamespace.myPlugin, name the file tooltipster-myPlugin.js.

(function(root, factory) {
    if (typeof define === 'function' && define.amd) {
        define(['tooltipster'], function($) {
            return (factory($));
        });
    }
    else if (typeof exports === 'object') {
        module.exports = factory(require('tooltipster'));
    }
    else {
        factory(jQuery);
    }
}(this, function($) {

    var pluginName = 'NAMESPACE.PLUGINNAME';
    
    $.tooltipster._plugin({
        name: pluginName,
        core: {
            __init: function(core) {
                this.__core = core;
            },
            MYCOREPUBLICMETHOD: function() {
                return this.__core;
            }
        },
        instance: {
            __defaults: function() {
                return {
                     /* YOUR DEFAULT OPTIONS HERE */
                };
            },
            __init: function(instance) {
                var self = this;
                self.__instance = instance;
                self.__namespace = pluginName + '-' + Math.round(Math.random() * 1000000);
                self.__reloadOptions();
                
                self.__instance._on('options.' + self.__namespace, function() {
                    self.__reloadOptions();
                });
            },
            __destroy: function() {
                this.__instance._off('.' + self.__namespace);
            },
            __reloadOptions: function() {
                this.__options = this.__instance._optionsExtract(pluginName, this.__defaults());
            },
            MYPUBLICINSTANCEMETHOD: function(){
                return this.__instance;
            }
        }
    });
}));

To add new options, use the instance._optionsExtract protected method. This allows users to provide options either directly or via a namespace.

Usage Pattern:

1. Define your default options.
2. Call instance._optionsExtract(pluginName, defaultOptions) to retrieve the user's configuration.
3. To handle runtime changes via instance.option(), listen for the options.[namespace] event to reload your settings.

Example:

var pluginName = 'namespace.myPlugin';

$.tooltipster._plugin({
    name: pluginName,
    instance: {
        __init: function(instance) {
            var self = this;
            self.__instance = instance;
            self.__namespace = pluginName + '-' + Math.round(Math.random() * 1000000);
            
            self.__reloadOptions();
            
            // Reload options if the user changes them via instance.option()
            self.__instance._on('options.' + self.__namespace, function() {
                self.__reloadOptions();
            });
        },
        __destroy: function() {
            // Unbind listeners using the unique namespace
            this.__instance._off('.' + self.__namespace);
        },
        __reloadOptions: function() {
            var defaultOptions = {
                myNewOption: 'value',
                myNewOption2: 'value'
            };
            this.__myOwnOptions = this.__instance._optionsExtract(pluginName, defaultOptions);
        }
    }
});

var pluginName = 'namespace.myPlugin';

$.tooltipster._plugin({
    name: pluginName,
    instance: {
        __init: function(instance) {
            
            var defaultOptions = {
                    myNewOption: 'value',
                    myNewOption2: 'value'
                },
                myOwnOptions = instance._optionsExtract(pluginName, defaultOptions);
        }
    }
});

To create a plugin, use the $.tooltipster._plugin method. You can define logic at the core level (for managing multiple tooltips) or the instance level (for logic specific to a single tooltip).

Use the following naming conventions for methods:

• Public: No underscore prefix (e.g., myMethod). Accessible by users.
• Protected: Single underscore prefix (e.g., _myMethod). Intended for use by other plugins.
• Private: Double underscore prefix (e.g., __myMethod). Internal to your plugin only.

Use a namespaced name (e.g., namespace.pluginName) to prevent conflicts with other plugins.

$.tooltipster._plugin({
    name: 'namespace.pluginName',
    core: {
        __init: function(core) { ... },
        myNewCoreMethod: function() { ... },
        __somePrivateMethod: function() { ... }
    },
    instance: {
        __init: function(instance) { ... },
        __destroy: function() { ... },
        myNewInstanceMethod: function() { ... },
        __somePrivateMethod: function() { ... }
    }
});