/**
 * This class represents the zoom capabilities of the Gigapan Explorer application. 
 * <br><br>
 * <a href="mailto:ehudsons@andrew.cmu.edu">Ellen Hudson-Snyder</a>, 
 * <a href="mailto:evedar@andrew.cmu.edu">Elvin Vedar</a>,
 * <a href="mailto:cbalz@andrew.cmu.edu">Christopher M. Balz</a>.
 * <br><br>CVS Version Info:<br>
 *  $Id: ZoomPad.js,v 1.6 2005/11/22 05:28:13 evedar Exp $     
 * <br><br>
 * @inherits-from <code>AbstractWidget</code>
 * @listens-to-event <code>onclick</code> from the <code>zoomInButton</code> document image object.
 * @listens-to-event <code>onclick</code> from the <code>zoomOutButton</code> document image object.
 * @listens-to-event <code>ondisablezoomin</code> from the <code>plate</code> document object
 * @listens-to-event <code>ondisablezoomout</code> from the <code>plate</code> document object
 * @listens-to-event <code>onenablezoomout</code> from the <code>plate</code> document object
 * @listens-to-event <code>onenablezoomout</code> from the <code>plate</code> document object
 * @emits-event <code>onzoomin</code>.
 * @emits-event <code>onzoomout</code>.
 * @object-prop <code>strZoomInButtonId</code>  The zoom-in button.
 * @object-prop <code>strZoomOutButtonId</code>  The zoom-out button.
 * @object-prop <code>strZoomInButtonImgId</code>  The zoom-in button image.
 * @object-prop <code>strZoomOutButtonImgId</code>  The zoom-out button image.
 * @author Team GigaToasted (Fall-2005-CMU-NASA/Google-Practicum Subteam) 
 * @version 1.0
 * <br><br>
 */


// Set the prototype chain for efficient inheritance:
ZoomPad.prototype = new AbstractWidget();


/**
 * Create a <code>ZoomPad</code> object.
 * @param objParent object  The parent, if any, of this object.
 */
function ZoomPad(objParent) {
    this.superC("zoomPad", objParent); // Complete the inheritance.  

    this.strZoomInButtonId = "zoomInButton";
    this.strZoomOutButtonId = "zoomOutButton";
    this.strZoomInButtonImgId = "zoomInButtonImg";
    this.strZoomOutButtonImgId = "zoomOutButtonImg";

    this.getHtml = ZoomPad_getHtml;
    this.receiveEvent = ZoomPad_receiveEvent;
    this.onzoomin = ZoomPad_onzoomin;
    this.onzoomout = ZoomPad_onzoomout;
    this.ondisablezoomout = ZoomPad_ondisablezoomout;
    this.ondisablezoomin = ZoomPad_ondisablezoomin;
    this.onenablezoomout = ZoomPad_onenablezoomout;
    this.onenablezoomin = ZoomPad_onenablezoomin;

    // Register events:
    self.gloScope.registerEvent(this.strId, this, this.strZoomInButtonId,  "onclick");
    self.gloScope.registerEvent(this.strId, this, this.strZoomOutButtonId, "onclick");
    self.gloScope.registerEvent(this.strId, this, "plate", "ondisablezoomin");
    self.gloScope.registerEvent(this.strId, this, "plate", "ondisablezoomout");
    self.gloScope.registerEvent(this.strId, this, "plate", "onenablezoomin");
    self.gloScope.registerEvent(this.strId, this, "plate", "onenablezoomout");
}



/**
 * Return the HTML of the navigation pad widget its child widgets or elements.    
 * @return <code>string</code>  A string representing the HTML of the 
 *                 object managed by the widget and its child widgets.
 */
function ZoomPad_getHtml() {


    /**
     * Return the HTML of the zoom in button.
     * @param objMe <code>Object</code> Reference to class
     * @return <code>string</code>  A string representing the HTML of the zoom in button.
     */
    function _getHtml_zoomInButton(objMe) {
        var strHtml =
            "<a href='#Dummy' id='" + objMe.strZoomInButtonId + "' " +
            "onclick='self.Environment.handleEvent(this.id, \"onclick\", null);'>" +
            "<img id='" + objMe.strZoomInButtonImgId + "'src='images/control_panel/ZoomIn.jpg' style=\"border-style: none\"/></a>";

        return strHtml;
    }


    /**
     * Return the HTML of the zoom out button.
     * @param objMe <code>Object</code> Reference to class
     * @return <code>string</code>  A string representing the HTML of the zoom out button.
     */
    function _getHtml_zoomOutButton(objMe) {
        var strHtml =
            "<a href='#Dummy' id='" + objMe.strZoomOutButtonId + "' " +
            "onclick='self.Environment.handleEvent(this.id, \"onclick\", null);'>" +
            "<img id='" + objMe.strZoomOutButtonImgId + "' src='images/control_panel/ZoomOut.jpg' style=\"border-style: none\"/></a>";

        return strHtml;
    }


    var strHtml = 
        "<div class='zoomPad'>" +
                _getHtml_zoomInButton(this) + "<br>" +
                _getHtml_zoomOutButton(this) +
        "</div>";

    return strHtml;
}


/**
 * This method receives any events that this object listens to and 
 * routes them to the proper methods. 
 * @param pStrEventSourceElementId  <code>string</code> The i.d. of the document object model from
 *                                  which the event sprang.
 * @param pStrEventType  <code>string</code> The event type of the object (e.g., 'onclick', etc).
 * @param pObjEvent  <code>string</code> The event object itself.
 */
function ZoomPad_receiveEvent(pStrEventSourceElementId, pStrEventType, pObjEvent) { 
    if (pStrEventType == "onclick") {
        if (pStrEventSourceElementId == this.strZoomInButtonId) {
            this.onzoomin();
        }
        else if (pStrEventSourceElementId == this.strZoomOutButtonId) {
            this.onzoomout();
        }
    }
    else if (pStrEventType == "ondisablezoomin") {
        this.ondisablezoomin();
    }
    else if (pStrEventType == "ondisablezoomout") {
        this.ondisablezoomout();
    }
    else if (pStrEventType == "onenablezoomout") {
        this.onenablezoomout();
    }
    else if (pStrEventType == "onenablezoomin") {
        this.onenablezoomin();
    }
}


/**
 * This method is an event handler and emits the <code>onzoomin</code> event.
 */
function ZoomPad_onzoomin() {
     self.Environment.handleEvent(this.strId, 'onzoomin', null);
}


/**
 * This method is an event handler and emits the <code>onzoomout</code> event.
 */
function ZoomPad_onzoomout() {
     self.Environment.handleEvent(this.strId, 'onzoomout', null);
}


/**
 * Disable the zoom out button.
 */
function ZoomPad_ondisablezoomout() {
    window.document.getElementById(this.strZoomOutButtonImgId).src='images/control_panel/ZoomOutDisabled.jpg';
    window.document.getElementById(this.strZoomOutButtonId).onclick=function() { return false; };
    window.document.getElementById(this.strZoomOutButtonId).style.cursor='default';
}


/**
 * Disable the zoom in button.
 */
function ZoomPad_ondisablezoomin() {
    window.document.getElementById(this.strZoomInButtonImgId).src='images/control_panel/ZoomInDisabled.jpg';
    window.document.getElementById(this.strZoomInButtonId).onclick=function() { return false; };
    window.document.getElementById(this.strZoomInButtonId).style.cursor='default';
}


/**
 * Enable the zoom in button.
 */
function ZoomPad_onenablezoomin() {
    window.document.getElementById(this.strZoomInButtonImgId).src='images/control_panel/ZoomIn.jpg';
    window.document.getElementById(this.strZoomInButtonId).onclick=new Function("self.Environment.handleEvent('" +
                                   this.strZoomInButtonId +"', \"onclick\", null); return true;");
    window.document.getElementById(this.strZoomInButtonId).style.cursor='pointer';
}


/**
 * Enable the zoom out button.
 */
function ZoomPad_onenablezoomout() {
    window.document.getElementById(this.strZoomOutButtonImgId).src='images/control_panel/ZoomOut.jpg';
    window.document.getElementById(this.strZoomOutButtonId).onclick=new Function("self.Environment.handleEvent('" +
                                   this.strZoomOutButtonId +"', \"onclick\", null); return true;");
    window.document.getElementById(this.strZoomOutButtonId).style.cursor='pointer';
}


