ajaxmail.js

有关ajax的开发方法以及源码,希望对大家有所帮组。

            "\n\n\n\n\n" + this.message.from + "said: \n" + this.message.message);
    
    },
    
    forward: function () {
        this.navigate("forward");
    },
    
    /**
     * Initializes DOM pointers and other property values.
     * @scope protected
     */
    init: function () {
        var colAllElements = document.getElementsByTagName("*");
        if (colAllElements.length == 0) {
            colAllElements = document.all;
        }
        
        for (var i=0; i < colAllElements.length; i++) {
            if (colAllElements[i].id.length > 0) {
                this[colAllElements[i].id] = colAllElements[i];
            }
        }
         
        //assign event handlers        
        this.imgPrev.onclick = function () {
            oMailbox.prevPage();
        };
        
        this.imgNext.onclick = function () {
            oMailbox.nextPage();
        };
        
        this.spnCompose.onclick = function () {
            oMailbox.compose();
        };
        
        this.spnInbox.onclick = function () {
            if (oMailbox.info.folder == INBOX) {
                oMailbox.refreshFolder(INBOX);
            } else {
                oMailbox.switchFolder(INBOX);
            }
        };
        
        this.spnTrash.onclick = function () {
            if (oMailbox.info.folder == TRASH) {
                oMailbox.refreshFolder(TRASH);
            } else {
                oMailbox.switchFolder(TRASH);
            }
        };        
        this.spnEmpty.onclick = function () {
            oMailbox.emptyTrash();
        };        
        this.spnReply.onclick = function () {
            oMailbox.reply(false);
        };        
        this.spnReplyAll.onclick = function () {
            oMailbox.reply(true);
        };        
        this.spnForward.onclick = function () {
            oMailbox.forward();
        };
        this.spnCancel.onclick = function () {
            oMailbox.cancelReply();
        };        
        this.spnSend.onclick = function () {
            oMailbox.sendMail();
        };
    },
        
    /**
     * Initializes and loads the mailbox with the initial page.
     * @scope protected
     */
    load: function () {
        this.init();
        this.getMessages(INBOX, 1);        
    },
    
    /**
     * Renders the messages on the screen.
     * @scope protected
     */
    renderFolder: function () {;
        var tblMain = this.tblMain;

        //remove all child nodes
        while (tblMain.tBodies[0].hasChildNodes()) {
            tblMain.tBodies[0].removeChild(tblMain.tBodies[0].firstChild);
        }                

        //create document fragment to store new DOM objects
        var oFragment = document.createDocumentFragment();

        //add a new row for each message
        if (this.info.messages.length) {
            for (var i=0; i < this.info.messages.length; i++) {
                var oMessage = this.info.messages[i];
                var oNewTR = this.trTemplate.cloneNode(true);
                oNewTR.id = "tr" + oMessage.id;
                oNewTR.onclick = readMail;
                
                if (oMessage.unread) {
                    oNewTR.className = "new";
                }
                
                var colCells = oNewTR.getElementsByTagName("td");
                var imgAction = colCells[0].childNodes[0];
                imgAction.id = oMessage.id;
                if (this.info.folder == TRASH) {
                    imgAction.onclick = restoreMail;
                    imgAction.src = sRestoreIcon;
                    imgAction.title = sRestore;
                } else {
                    imgAction.onclick = deleteMail;
                    imgAction.src = sDeleteIcon;
                    imgAction.title = sDelete;
                }
                
                colCells[1].appendChild(document.createTextNode(cleanupEmail(oMessage.from)));
                colCells[2].firstChild.style.visibility = oMessage.hasAttachments ? "visible" : "hidden";
                colCells[3].appendChild(document.createTextNode(htmlEncode(oMessage.subject)));
                colCells[4].appendChild(document.createTextNode(oMessage.date));
                oFragment.appendChild(oNewTR);           
            }
        } else {
            var oNewTR = this.trNoMessages.cloneNode(true);
            oFragment.appendChild(oNewTR);
        }

        //add the message rows
        tblMain.tBodies[0].appendChild(oFragment);
        
        //only change folder name if it's different
        if (this.hFolderTitle.innerHTML != aFolders[this.info.folder]) {
            this.hFolderTitle.innerHTML = aFolders[this.info.folder];
        }
        
        //update unread message count for Inbox
        this.updateUnreadCount(this.info.unreadCount);
             
        //set up the message count (hide if there are no messages)
        this.spnItems.style.visibility = this.info.messages.length ? "visible" : "hidden";
        this.spnItems.innerHTML = this.info.firstMessage + "-" + (this.info.firstMessage + this.info.messages.length - 1) + " of " + this.info.messageCount;

        //determine show/hide of pagination images
        if (this.info.pageCount > 1) {
            this.imgNext.style.visibility = this.info.page < this.info.pageCount ? "visible" : "hidden";
            this.imgPrev.style.visibility = this.info.page > 1 ? "visible" : "hidden";
        } else {
            this.imgNext.style.visibility = "hidden";
            this.imgPrev.style.visibility = "hidden";
        }              
        
        this.divFolder.style.display = "block";
        this.divReadMail.style.display = "none";        
        this.divComposeMail.style.display = "none";        
    },
    
    renderMessage: function () {
        this.hSubject.innerHTML = htmlEncode(this.message.subject);
        this.divMessageFrom.innerHTML = sFrom + " " + htmlEncode(this.message.from);
        this.divMessageTo.innerHTML = sTo + " " + htmlEncode(this.message.to);
        this.divMessageCC.innerHTML = this.message.cc.length ? sCC + " " + htmlEncode(this.message.cc) : "";
        this.divMessageBCC.innerHTML = this.message.bcc.length ? sBCC + " " + htmlEncode(this.message.bcc) : "";
        this.divMessageDate.innerHTML = this.message.date;
        this.divMessageBody.innerHTML = this.message.message;
        
        if (this.message.hasAttachments) {
            this.ulAttachments.style.display = "";
            
            var oFragment = document.createDocumentFragment();
            
            for (var i=0; i < this.message.attachments.length; i++) {
                var oLI = document.createElement("li");
                oLI.className = "attachment";
                oLI.innerHTML = "<a href=\"" + sAjaxMailAttachmentURL + "?id=" + this.message.attachments[i].id + "\" target=\"_blank\">" + this.message.attachments[i].filename + "</a> (" + this.message.attachments[i].size + ")";
                oFragment.appendChild(oLI);
            }
            
            this.ulAttachments.appendChild(oFragment);
            this.liAttachments.style.display = "";
        } else {
            this.ulAttachments.style.display = "none";
            this.liAttachments.style.display = "none";
            this.ulAttachments.innerHTML = "";
        }
        
        this.updateUnreadCount(this.message.unreadCount);
        this.divFolder.style.display = "none";
        this.divReadMail.style.display = "block";
        this.divComposeMail.style.display = "none";
    },
    
    /**
     * Sets up the screen to reply to an e-mail.
     * @scope protected
     * @param blnAll Set to true for "reply to all"
     */
    reply: function (blnAll) {
        this.navigate("reply" + (blnAll ? "all" : ""));
    },
    
    /**
     * Shows a message on the screen.
     * @scope protected
     * @param sType The type of message to display.
     * @param sMessage The message to display.
     */
    showNotice: function (sType, sMessage) {
        var divNotice = this.divNotice;
        divNotice.className = sType;
        divNotice.innerHTML = sMessage;
        divNotice.style.visibility = "visible";
        setTimeout(function () {
            divNotice.style.visibility = "hidden";
        }, iShowNoticeTime);    
    },
    
    /**
     * Updates the count of unread messages displayed on
     * the screen.
     * @scope protected
     * @param iCount The number of unread messages.
     */
    updateUnreadCount: function (iCount) {
        this.spnUnreadMail.innerHTML = iCount > 0 ? " (" + iCount + ")" : "";
    }
};

/*-------------------------------------------------------
 * Callback Functions
 *-------------------------------------------------------*/

/**
 * Callback function to execute a client-server request and display
 * a notification about the result.
 * @scope protected.
 * @param sInfo The information returned from the server.
 */
function execute(sInfo) {
    if (oMailbox.nextNotice) {
        oMailbox.showNotice("info", oMailbox.nextNotice);
        oMailbox.nextNotice = null;
    }
    oMailbox.setProcessing(false);
}

/**
 * Callback function to execute a client-server request and then
 * load and display new mail information.
 * @scope protected.
 * @param sInfo The information returned from the server.
 */
function loadAndRender(sInfo) {

    oMailbox.loadInfo(sInfo);
    oMailbox.renderFolder();
    
    if (oMailbox.nextNotice) {
        oMailbox.showNotice("info", oMailbox.nextNotice);
        oMailbox.nextNotice = null;
    }
    oMailbox.setProcessing(false);        
}

/**
 * The callback function when attempting to send an e-mail.
 * @scope protected
 * @param sData The data returned from the server.
 */
function sendConfirmation(sData) {
    var oResponse = JSON.parse(sData);
    if (oResponse.error) {
        alert("An error occurred:\n" + oResponse.message);
    } else {
        oMailbox.showNotice("info", oResponse.message);
        oMailbox.divComposeMail.style.display = "none";
        oMailbox.divReadMail.style.display = "none";
        oMailbox.divFolder.style.display = "block";
    }
    oMailbox.divComposeMailForm.style.display  = "block";
    oMailbox.divComposeMailStatus.style.display = "none";        
    oMailbox.setProcessing(false);
}

/*-------------------------------------------------------
 * Event Handlers and Function Pointers
 *-------------------------------------------------------*/


function deleteMail() {
    oMailbox.deleteMessage(this.id); 
}

function restoreMail() {
    oMailbox.restoreMessage(this.id); 
}

function readMail() {
    oMailbox.readMessage(this.id.substring(2));
}






/*-------------------------------------------------------
 * Helper Functions/Data
 *-------------------------------------------------------*/

var reNameAndEmail = /(.*?)<(.*?)>/i;

function cleanupEmail(sText) {
    if (reNameAndEmail.test(sText)) {
        return RegExp.$1.replace(/"/g, "");
    } else {
        return sText;
    }
}

function htmlEncode(sText) {
    if (sText) {
        return sText.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;")
    } else {
        return "";
    }
}

function getRequestBody(oForm) {
    var aParams = new Array();
    
    for (var i=0 ; i < oForm.elements.length; i++) {
        var sParam = encodeURIComponent(oForm.elements[i].name);
        sParam += "=";
        sParam += encodeURIComponent(oForm.elements[i].value);
        aParams.push(sParam);
    } 
    
    return aParams.join("&");        
}
        
//assign the mailbox to load when the page has completed loading
window.onload = function () {
    oMailbox.load();
};