1
\$\begingroup\$

The user can provide a JSON object to configure the plugin when they initialise it. I want those options to be available whenever a plugin action is performed.

I have read the plugin documentation but I'd like to get confirmation that I am going about this the right way.

Plugin is initialised with:

$(selector).hide_and_peek("init", {options:here});

And individual methods may be called with:

$(selector).hide_and_peek("action", {options:here});

Here's the plugin definition:

(function( $ ) {

// Plugin definition.
$.fn.hide_and_peek = function(action,  options ) {

    //define plugin defaults.
    $.fn.hide_and_peek.defaults = {
        peek_offset: -10,
        peek_position: "bottom",
        default_shown: true,
        peek_show_duration:1000,
        peek_hide_duration:1000,
        center: true
    }; 

    //check to see if options are provided and extend if required.
    $.fn.hide_and_peek.custom = function(){
        if(typeof options === "undefined"){
            return $.fn.hide_and_peek.custom;
        }else{
            return $.fn.extend($.fn.hide_and_peek.custom,options);
        }
    }();

    //merge defaults and custom options
    var oOptions = $.fn.extend({}, $.fn.hide_and_peek.defaults, $.fn.hide_and_peek.custom);

    // *snip* Plugin implementation
})( jQuery );
\$\endgroup\$
1
\$\begingroup\$

I am writing (my first) jQuery plugin.

Congratulations!

The user can provide a JSON object to configure the plugin when they initialise it.

Terminology is wrong here. JSON is the transport format that looks like a JS object, but serialized into a string. What you use is just a JS object. They look the same because JSON was modeled after the JS literal notation, which (historically) was easily "unserialized" (turned back into an object) with eval. Proper parsers came in later on.

//check to see if options are provided and extend if required.
$.fn.hide_and_peek.custom = function(){
    if(typeof options === "undefined"){
        return $.fn.hide_and_peek.custom;
    }else{
        return $.fn.extend($.fn.hide_and_peek.custom,options);
    }
}();

//merge defaults and custom options
var oOptions = $.fn.extend({}, $.fn.hide_and_peek.defaults, $.fn.hide_and_peek.custom);

So I assume custom is another level of options, maybe set during setup and globally for all instances of the plugin. You don't need to check if it's undefined. You can just merge it in. jQuery will take care of it being undefined and will just skip over it.

// Last will take precedence
var oOptions = $.fn.extend({}, defaults, custom, options);
\$\endgroup\$
  • \$\begingroup\$ Thanks for the corrections re terminology. The custom is an artifact of what I'm trying to achieve. Because its all compartmentalised i think I might have the wrong idea of whats going on regarding scoping... I've ended up treating each call as what may be considered a "static" method in , and loading in the parameters for every call. I use custom to prevent any options that were set when the plugin was initialised being overwritten if a call is made with no options passed in. Ultimately though im just interested in oOptions containing the correct options for any instance. \$\endgroup\$ – James B Oct 27 '15 at 12:26
  • \$\begingroup\$ It looks like my plugin may actually be better suited as a jQueryUI plugin. \$\endgroup\$ – James B Oct 27 '15 at 13:24
  • \$\begingroup\$ @JamesB jQueryUI plugins are just jQuery plugins :P They're just a collection of UI-related plugins actually. Internally, they're the same. \$\endgroup\$ – Joseph Oct 27 '15 at 13:44
  • 1
    \$\begingroup\$ I should have been more specific. I refactored the plugin to make use of the JQ UI widget factory. This allowed me to take advantage of the stateful nature of jqui widgets. \$\endgroup\$ – James B Oct 27 '15 at 14:44

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.