// Call ActionButton to wire an HTML button (typically an <img> tag) to an action (QAction).

// Params:

//   id - the id of the button.  Ex:  <img id="buttonId" .../>

//   upImg - the path to the "up" image for the button.

//   downImg - the path to the "down" image for the button.  Note: not yet working...

//   disabledImg - the path to the "disabled" image for the button.

//   action - the targeted action

//

function ActionButton(id, upImg, downImg, disabledImg, action) {

    this.id = id;

    this.upImg = upImg;

    this.downImg = downImg;

    this.disabledImg = disabledImg;

    this.action = action;

    this.isDown = false;

    //window.chrome.alert("ActionButton");

    // attach this object to the item as "button" for later access

    // delete/cleanup existing button (if any) and attach this as button

    dom = document.getElementById(this.id);

    if(dom.button) {

        delete dom.button;

    }

    dom.button = this;

    this.element = function() {

        return document.getElementById(this.id);

    }

    this.updateButton = function() {

        //window.chrome.alert("ActionButton::updateButton " + this);

        if(this.action.enabled) {

            if(this.isDown) {

                this.element().src = this.downImg;

            }

            else {

                this.element().src = this.upImg;

            }

        }

        else {

            this.element().src = this.disabledImg;

        }

    }

    // Make sure we can find the element.

    if(!this.element()) {

        alert("ActionButton: element not found, " + id);

        return;

    }

    // --------------------------------

    // Callback for changes in the action's state.

    onActionChanged = function() {

//          window.chrome.alert("ActionButton::on action changed " +

//                              " this=" + this +

//                              " action=" + this.action     +

//                              " id=" + this.id     +

//                              " enabled=" + this.action.enabled +

//                              " src=" + this.element().src);

        this.updateButton();

    }

// Commented out because onclick is not reliable.  Slight movements between mouse down

// and mouse up seem to cancel the onclick.

//    this.onClick = function() {

//        window.chrome.alert("ActionButton::onClick: " + this);

//        if(this.action.enabled) {

//            this.action.trigger();

//        }

//        else {

//            window.chrome.alert("ActionButton::onClick: not enabled");

//        }

//    }

    this.onMouseDown = function() {

        //window.chrome.alert("ActionButton::onMouseDown " + this);

        if(!this.isDown) {

        this.isDown = true;

        this.updateButton.call(this);

      if((this.id == 'zoomBarBtnIn') || (this.id == 'zoomBarBtnOut') || (this.id == 'zoomIn') || (this.id == 'zoomOut'))

    	    this.action.trigger();

        }

    }

    this.onMouseUp = function() {

        //window.chrome.alert("ActionButton::onMouseUp " + this);

        if(this.isDown) {

        this.isDown = false;

        this.updateButton.call(this);

        // Trigger the action.

        this.action.trigger();

    }

    }

    this.onMouseOut = function() {

        //window.chrome.alert("ActionButton::onMouseOut " + this);

        if (this.isDown ) {

            this.isDown = false;

            this.updateButton.call(this);

        if((this.id == 'zoomBarBtnIn') || (this.id == 'zoomBarBtnOut') || (this.id == 'zoomIn') || (this.id == 'zoomOut'))

            this.action.trigger();

        }

    }

    // Connect to the action's "changed" signal.  Note: don't use bind here, causes crash in

    // scope chain code (but only for first document that is loaded...).

    this.action.changed.connect(createDelegate(this, onActionChanged));

    // Set up element event handlers.

    this.element().onmousedown = this.onMouseDown.bind(this);

    this.element().onmouseup = this.onMouseUp.bind(this);

    this.element().onmouseout = this.onMouseOut.bind(this);

//    this.element().onclick = this.onClick.bind(this);

    // Set the initial state of the button.

    this.updateButton();

}