Hi all,

I found a few threads related to jQuery OOP, but since I'm pretty new
to OOP maybe I just was not understanding a few things.

I pasted some code below, and it's my attempt at OOP, but is there a
way to make this code more jQuery like? Or just better in general? All
suggestions are welcome.

Thanks.

function jsWindow (opts){
        var settings = $.extend(
                {
                        title: 'Window',
                        width: 400,
                        dialogClass: 'jsWindow'
                },
                opts
        );

        this.width = settings.width;
        this.height = settings.height;
        this.title = settings.title;

        var self = this; // reference to object
        var $self; // will be used as reference to jQuery HTML element upon
this.create.window()

        this.create = {
                window: function(){
                        $window = $('<div></div>');

                        $window
                                .addClass(settings.dialogClass)
                                .css( { width: settings.width} )
                                .append('<h2></h2>')
                                        .find('h2')
                                        .text(settings.title)
                                .end()
                                .append('<div></div>')
                                        .find('div')
                                        .addClass('content')
                                .end()
                                .append('<div></div>')
                                        .find('div')
                                        .eq(1)
                                        .addClass('buttons');

                        $self = $window;
                        return $window;
                },

                button: function (buttonType, buttonText, callback){
                        callback = (typeof(callback) == 'undefined') ? 
function(){} :
callback;
                        var $button = $('<button></button>');

                        $button
                                .addClass(buttonType + 'Class')
                                .text(buttonText)
                                .click(
                                        function(){
                                                callback();
                                                self.close();
                                        }
                                );

                        return $button;
                }
        }

        this.add = {
                button: function(btn){
                        $self.find('div.buttons').append(btn);
                }
        }

        this.set = {
                title: function(string){
                        self.title = string;
                },

                width: function(integer){
                        self.width = integer;
                        $self.css({ width: integer });
                },

                height: function(integer){
                        self.height = integer;
                        $self.css({ height: integer });
                },

                position: function(oTop, oLeft){
                        $self.css(
                                {
                                        position: 'absolute',
                                        top: oTop,
                                        left: oLeft
                                }
                        );
                },

                content: function(oContent, oType){
                        switch (oType){
                                case 'url':
                                        
$self.find('div.content').load(oContent);
                                break;

                                case 'html':
                                        
$self.find('div.content').html(oContent);
                                break;

                                default:
                                        
$self.find('div.content').html(oContent);
                                break;
                        }
                }
        }

        this.center = function(){
                var viewWidth = $(window).width();
                var viewHeight = $(window).height();
                oLeft = (cleanInt(viewWidth, 'px') / 2) - (cleanInt(self.width,
'px') / 2);
                oTop = (cleanInt(viewHeight, 'px') / 2) - 
(cleanInt($self.height(),
'px') / 2);

                self.set.position(oTop, oLeft);
        }

        this.open = function (fx, speed){
                if (typeof(fx) == 'undefined') {
                        $self.appendTo('body').show();
                }
                else {
                        $self.appendTo('body').hide().animate(fx, speed);
                }
        }

        this.close = function(fx, speed){
                if (typeof(fx) == 'undefined') {
                        $self.remove();
                }
                else {
                        $self.animate(fx, speed, function(){ $(this).remove() 
});
                }
        }



        function cleanInt(oString, unit){
                if (typeof(oString) == 'string'){
                        var index = oString.indexOf(unit);
                        var clean = (index != -1) ? 
parseInt(oString.substring(0, index)) :
parseInt(oString);
                        return clean;
                }
                else {
                        return oString;
                }
        }
}

Reply via email to