Create options for each object of jquery plugin - jquery-plugins

Question

I need your help again :)
I'm trying to do a plugin with jQuery specifications.
So I started reading this: http://docs.jquery.com/Plugins/Authoring
The document is cool and give nice patterns to follow.
But i have a problem with my plugin.
My plugin appends a div and bind some events to diferents features.
Sometimes i need to accés to the options var but... the problem is, if i do the opt var global it take the last object created options.
And if i put it in the init method, i can't use it in other actions.
I need each new object can acces only his own option set.
(function( $ ) {
//plugin methods
var methods = {
init : function( options ) {
//default options
var opt = $.extend({
'id' : 'test',
'title' : 'Test window',
'type' : 'normal',
'text' : 'test test! <br/> 123',
'shines' : '',
'head_shines' : '',
'body_shines' : '',
'bottom_bar' : true
}, options);
//shine or not shine? that's the matter
if (opt.shines != '') {
opt.shines = "shiny";
opt.head_shines = " shine_head";
opt.body_shines = " shine_body";
}
//maintaining Chainability
return this.each(function() {
var $this = $(this); // $this is now JQuery object
//creating the bottom bar
if (opt.bottom_bar == true && $("#bottom_bar").length == 0) {
$this.append('<div id="bottom_bar"></div>');
}
//creating the new window
$this.append("<div style='display: none;' class='window "+opt.shines+"' id='"+opt.id+"'>...boring html...</div>");
//append new window to the bar
$("#bottom_bar").append("<div style='display: none' class='section' id='s_"+opt.id+"'>"+opt.title+"</div>");
//get a object of the window to interact with
var $window = $("#"+opt.id);
//show the windows
$window.fadeIn().draggable();
$("#s_"+opt.id).fadeIn();
//attach the events to the windows
$window.find('.close').one('click.ventana', methods.close);
$window.find('.max').on('click.ventana', methods.maximize);
$window.find('.min').on('click.ventana', methods.minimize);
$("#s_"+opt.id).on('click.ventana', methods.minimizeBar);
});
},
close : function() {},
maximize : function() {}, //i want acces my opts here!
minimize : function() {},
minimizeBar: function() {} //or here... etc
}; //end methods
//creating the plugin
$.fn.ventana = function( method ) {
if ( methods[method] ) { //if we call a method...
return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ) );
} else if ( typeof method == 'object' || !method ) { //if not, we use init
return methods.init.apply( this, arguments);
} else { //method don't exists (console error)
$.error( 'Method ' + method + ' does not exists in jQuery.ventana');
}
};
}) ( jQuery );
The problem is, if i put where is the first comment:
//plugin methods
this:
//globals define
var opt;
I only get the last object opts...
Example creating new windows
$('body').ventana( {
'id' : 'master',
'title' : 'Afegir Finestres',
'text' : 'test'
});
$('body').ventana( {
'id' : 'master1',
'title' : 'Afegir Finestres1',
});
I just gonna get the master1 opts in both objects

Answer 1

You could use data to store the options object to be retrieved later.
// store it
$this.data("options", opt);
// ...
// use it later
var opt = $this.data("options");