imagemap.js

来自「AJAXMAP,AJAX做的MAP,很好用,DLL控件,」· JavaScript 代码 · 共 178 行

// Register a new Namespace
Type.registerNamespace("MyServices");

// Define the constructor of the Location class
MyServices.Location = function (uiElement, uiBody, uiProgress) {
    // Call base class just for completeness
    MyServices.Location.initializeBase(this);
    
    this._uiElement = uiElement;
    this._uiBody = uiBody;
    this._uiProgress = uiProgress;
    this._xAxis = 0;
    this._yAxis = 0;
}

// Define the properties and methods of the Location class
// using the Prototype Design Pattern
MyServices.Location.prototype= {
    
    // Define UIElement Property
    get_uiElement:function() {
        // Get
        return this._uiElement;
    },
    set_uiElement:function(value) {
        // Set
        this._uiElement = value;
    },
    
    // Define UIBody Property
    get_uiBody:function() {
        // Get
        return this._uiBody;
    },
    set_uiBody:function(value) {
        // Set
        this._uiBody = value;
    },
    
    // Define UIProgress Property
    get_uiProgress:function() {
        // Get
        return this._uiProgress;
    },
    set_uiProgress:function(value) {
        // Set
        this._uiProgress = value;
    },

    // Define ShowPopupInfo method that is responsible
    // for calling the webservice, and setting the location
    // of the popup window.
    ShowPopupinfo:function(event, areaName) {
        // Call the AJAX Service
        MyServices.LocationService.GetAreaInfo(
            areaName,                                         // Parameter
            Function.createDelegate(this, this.OnCompleted),  // Success Callback
            this.OnError,                                     // Failure Callback
            this.OnTimeOut);    // TimeOut Callback
        
        // Set the location of the popup window
        this._xAxis = event.clientX;
        this._yAxis = event.clientY;
        
        // Show the Progress Bar
        var progress = $get(this.get_uiProgress());
        if (progress != null) {
            progress.style.visibility = "visible";
            progress.style.display = "block";
        }
    },
    
    // Define HidePopupInfo method that is used to hide
    // the UI popup window
    HidePopupInfo:function() {
        var uiElement = $get(this.get_uiElement());
        if (uiElement != null) {
            uiElement.style.visibility = "hidden";
            uiElement.style.display = "none";
        }
        
        // Hide the progress bar
        this.hideProgressBar();
    },
    
    // Define success callback function that will update the UI
    // with the data coming frmo the AJAX Service
    OnCompleted:function(result, userContext, methodName) {
        var uiElement = $get(this.get_uiElement());
        var uiBody = $get(this.get_uiBody());
        
        if (uiBody != null) {
            // Set the text inside the UI element
            // by creating a TextNode DOm object rather than
            // using innerHTML, innerText, or textContent, since
            // this is more standard compliant.
            var textNode = uiBody.firstChild;
            if(!textNode) {
                textNode = document.createTextNode(result);
                uiBody.appendChild(textNode);
            } 
            else {
                textNode.nodeValue = result;
            }
            
            // Show the UI element
            if (uiElement != null) {
                uiElement.style.visibility = "visible";
                uiElement.style.display = "inline";
                uiElement.style.left = this._xAxis + "px";
                uiElement.style.top = this._yAxis + "px";
            }
        }
        
        // Hide the progress bar
        this.hideProgressBar();
    },
    
    // Error callback function to alert
    // the user that some exceptions were thrown
    // during the asynchronous processing
    onError:function(result, userContext, methodName) {
        // Hide the progress bar
        this.hideProgressBar();
        
        var msg = result.get_exceptionType() + "\r\n";
        msg += result.get_message() + "\r\n";
        msg += result.get_stackTrace();
        alert(msg);
    },    
    
    // Timeout callabck function called
    // when the current asynchronous request
    // times out
    onTimeOut:function(result, userContext, methodName) {
        // Hide the progress bar
        this.hideProgressBar();
        
        alert("Request Timeout :" + result);
    },
    
    hideProgressBar: function() {      
        // Hide the Progress Bar
        var progress = $get(this.get_uiProgress());
        if (progress != null) {
            progress.style.visibility = "hidden";
            progress.style.display = "none";
        }
    }
}

// Register the class
MyServices.Location.registerClass("MyServices.Location");




var location = null;
function pageLoad(sender, args) {
    // Create a new instance of the class
    location = new MyServices.Location("modal", "modalBody", "updateProgress");
    
    // Hide the popup div
    location.HidePopupInfo();
}

// Method called by the page controls
// to update the UI with the information
// from the ajax service
function GetAreaInfo(event, args) {
    location.ShowPopupinfo(event, args);
}

function HidePopup() {
    // Hide the popup div
    location.HidePopupInfo();
}