source: ether_statistics/web/resources/js/classesForJQuery/ComplexButton.js @ 569

//********************************************************
// Class Button
// Display a button
//
// use jQuery
// str value: Value to display in the button
// dom parent: in which dom element to draw the button
// int id: id of the dom element
// func onclick: callback function when button clicked
// str specificClass
// classNameToAdd : use to avoid button's style for button_left, button_right and button_middle when button.css is used with pagination.css
// useLonelyMidleImage : if true, we use image for parts left and right, otherwise, we only use an image for the middle
//********************************************************

var ComplexButton = Class.create( {

    initialize: function( param )
    {
        // Init
        this.id = param.id ? param.id : "";
        this.parent = param.parent ? param.parent : false;
        this.value = param.value ? param.value : "";
        this.specificClass = param.specificClass ? param.specificClass : false;
        this.callbackOnClick = param.onClick ? param.onClick : false;
        this.classNameToAdd = param.classNameToAdd ? param.classNameToAdd : false;
        this.useLonelyMidleImage = param.useLonelyMidleImage ? param.useLonelyMidleImage : false;
        this.boolDisabled = false;
        this.boolSelected = false;
        this.boolDisplayed = false;

        // Create button elements
        this.divContainer = $( document.createElement( "div" ) );
        this.divContainer.attr( {id:this.id, class:"complexButton"} );
        if( this.specificClass )
            this.divContainer.addClass( this.specificClass );
        if( this.parent )
            this.parent.append( this.divContainer );

        this.divLeft = $( document.createElement( "div" ) );
        if( this.classNameToAdd )
            this.divLeft.addClass( "complexButton_left_" + this.classNameToAdd );
        else if( !this.useLonelyMidleImage )
            this.divLeft.addClass( "complexButton_left" );
        this.divContainer.append( this.divLeft );

        this.divMiddle = $( document.createElement( "div" ) );
        this.divMiddle.attr( {id:"button_middle"} );
        if( this.classNameToAdd )
            this.divMiddle.addClass( "complexButton_middle_" + this.classNameToAdd );
        else if( this.useLonelyMidleImage )
            this.divMiddle.addClass( "complexButton_lonely_middle" );
        else
            this.divMiddle.addClass( "complexButton_middle" );
        this.divContainer.append( this.divMiddle );

        this.divText = $( document.createElement( "div" ) );
        this.divText.attr( {id:"button_text"} );
        this.divText.addClass( "complexButton_text" );
        this.divText.html( this.value );
        this.divMiddle.append( this.divText );

        this.divRight = $( document.createElement( "div" ) );
        if( this.classNameToAdd )
            this.divRight.addClass( "complexButton_right_" + this.classNameToAdd );
        else if( !this.useLonelyMidleImage )
            this.divRight.addClass( "complexButton_right" );
        this.divContainer.append( this.divRight );

        // Define button events
        this.divContainer.bind( 'click', this, this.onClick );
    },

    // Actions ********************************************************

    appendChild :function( parent )
    {
        this.parent = parent;
        this.parent.append( this.divContainer );
    },

    setDisabled:function( value )
    {
        if( value )
            this.disable();
        else
            this.enable();
    },

    disable : function()
    {
        this.boolDisabled = true;
        this.divContainer.addClassName( "disable" );
    },

    enable : function()
    {
        this.boolDisabled = false;
        this.divContainer.removeClassName( "disable" );
    },

    setSelected : function( value )
    {
        this.boolSelected = value;
        if( this.boolSelected )
            this.divContainer.addClassName( "selected" );
        else
            this.divContainer.removeClassName( "selected" );
    },

    show : function()
    {
        this.boolDisplayed = true;
        this.divContainer.style.display = "";
    },

    hide : function()
    {
        this.boolDisplayed = false;
        this.divContainer.style.display = "none";
    },

    // Getter / Setter ********************************************************

    getContainer: function()
    {
        return this.divContainer;
    },

    getDisable : function()
    {
        return this.boolDisabled;
    },

    getSelect: function()
    {
        return this.boolSelected;
    },

    setValue : function( value )
    {
        this.value = value;
        this.divText.html( this.value );
    },

    setCallbackOnClick : function( value )
    {
        this.callbackOnClick = value;
    },

    // Events ********************************************************

    onClick : function( event )
    {
        var contextEvent = event.data;
        if( !contextEvent.getDisable() && (undefined == event.detail || 1 == event.detail) && contextEvent.callbackOnClick )
            contextEvent.callbackOnClick();
    }
} );