initialize.js

ajax 聊天室,实现多人聊天,无刷新!

      $('fontColorList').style.display = 'none';
      toWin = '';
   } else {
      $('fontColorList').style.left = (parseInt(IMWindows[win].getLocation()['left']) + parseInt($(win + '_setFontColor').offsetLeft)) + 'px';
      $('fontColorList').style.top = (parseInt(IMWindows[win].getLocation()['top']) + parseInt(IMWindows[win].getSize()['height']) - 46) + 'px';
      $('fontColorList').style.zIndex = Windows.maxZIndex + 20;
      $('fontColorList').style.display = 'block';
      toWin = win;
   }
}

function login_dialog() {
   clearInputs();
   main_dialog_show('login');
   setTimeout("$('username').focus();", 125);
}

function register_dialog() {
   clearInputs();
   main_dialog_show('register');
   setTimeout("$('newusername').focus();", 125);
}


function forgot_pass_dialog() {
   clearInputs();
   main_dialog_show('forgotPass');
   setTimeout("$('resetto').focus();", 125);
}

function main_dialog_show(dialog) {
   $('login_error_msg').style.display       = 'none';
   $('register_error_msg').style.display    = 'none';
   $('forgotpass_error_msg').style.display  = 'none';

   $('loginDialog').style.display      = 'none';
   $('registerDialog').style.display   = 'none';
   $('login_error_msg').style.display  = 'none';
   $('forgotPassDialog').style.display = 'none';

   $(dialog+'Dialog').style.display    = 'block';
}

function handleInput(e, func) {
   var asc = document.all ? event.keyCode : e.which;
   
   if(asc == 13) {
      func();
      return false;
   }
   
   return true;
}

function new_im_dialog() {
   var newIMWin;
    if($('newIM')) {
      Windows.getWindow('newIM').toFront();
      return;
   }  
 
   newIMWin = new Window('newIM',
                         {className: "dialog", width: 240, height: 120, resizable: false,
                          title: "New Instant Message...", draggable: true, closable: true, maximizable: false, minimizable: false, detachable: false,
                          minWidth: 240, minHeight: 120, showEffectOptions: {duration: 0}, hideEffectOptions: {duration: 0}});
   newIMWin.getContent().innerHTML = '<div class="dialog_info" style="padding:3px;">Please enter the username of the person you would like to IM.</div> \
                                      <span id="newim_error_msg" style="display:block;width:100%;padding-top:5px;padding-bottom:10px;color:#ff0000;font-weight:bold;text-align:center;">&nbsp;</span> \
                                      <div id="newim_box" style="padding-left:30px;width:100%;"> \
                                      <div style="display:block;float:left;margin-right:5px;padding-top:4px;">Username:</div><input type="text" style="width:120px;" id="sendto" name="sendto" onkeypress="handleInput(event, function() { newIMWindow(); })" /> \
                                      </div> \
                                      <div id="newim_buttons"> \
                                      <img src="images/' + windowCSS + '/openim.png" onclick="newIMWindow();"  onmouseover="buttonHover(this);" onmouseout="buttonNormal(this);" onmousedown="buttonDown(this);" onmouseup="buttonNormal(this);" /> \
                                      <img src="images/' + windowCSS + '/cancel.png" onclick="Windows.close(\'newIM\');"  onmouseover="buttonHover(this);" onmouseout="buttonNormal(this);" onmousedown="buttonDown(this);" onmouseup="buttonNormal(this);" /> \
                                      </div>';
   $('newim_buttons').style.position = 'absolute';
   $('newim_buttons').style.top      = '110px';
   $('newim_buttons').style.left     = '25px';
   newIMWin.setDestroyOnClose();
   newIMWin.showCenter();
   setTimeout("$('sendto').focus();", 125);
}

function new_room_dialog() {
   var newRoomWin;
   if($('newRoom')) {
      Windows.getWindow('newRoom').toFront();
      return;
   }
   
   newRoomWin = new Window('newRoom',
                           {className: "dialog", width: 240, height: 120, resizable: false,
                            title: "Join a Chatroom...", draggable: true, closable: true, maximizable: false, minimizable: false, detachable: false,
                            minWidth: 240, minHeight: 120, showEffectOptions: {duration: 0}, hideEffectOptions: {duration: 0}});
   newRoomWin.getContent().innerHTML = '<div class="dialog_info" style="padding:3px;">Please enter the name of the room you would like to join.</div> \
                                        <span id="newroom_error_msg" style="display:block;width:100%;padding-top:5px;padding-bottom:10px;color:#ff0000;font-weight:bold;text-align:center;">&nbsp;</span> \
                                        <div id="newroom_box" style="padding-left:25px;width:100%;"> \
                                        <div style="display:block;float:left;margin-right:5px;padding-top:4px;">Room Name:</div><input type="text" style="width:120px;" id="roomname" name="roomname" onkeypress="handleInput(event, function() { joinRoom($(\'roomname\').value); })" /> \
                                        </div> \
                                        <div id="newroom_buttons"> \
                                        <img src="images/' + windowCSS + '/join.png" onclick="joinRoom($(\'roomname\').value);"  onmouseover="buttonHover(this);" onmouseout="buttonNormal(this);" onmousedown="buttonDown(this);" onmouseup="buttonNormal(this);" /> \
                                        <img src="images/' + windowCSS + '/cancel.png" onclick="Windows.close(\'newRoom\');"  onmouseover="buttonHover(this);" onmouseout="buttonNormal(this);" onmousedown="buttonDown(this);" onmouseup="buttonNormal(this);" /> \
                                        </div>';
   $('newroom_buttons').style.position = 'absolute';
   $('newroom_buttons').style.top      = '110px';
   $('newroom_buttons').style.left     = '25px';
   newRoomWin.setDestroyOnClose();
   newRoomWin.showCenter();
   setTimeout("$('roomname').focus();", 125);
}

function new_buddy_dialog() {
   var newBuddyWin;
   if($('newBuddy')) {
      Windows.getWindow('newBuddy').toFront();
      return;
   }
   
   newBuddyWin = new Window('newBuddy',
                            {className: "dialog", width: 240, height: 160, resizable: false,
                             title: "Add a Buddy", draggable: true, closable: true, maximizable: false, minimizable: false, detachable: false,
                             minWidth: 240, minHeight: 120, showEffectOptions: {duration: 0}, hideEffectOptions: {duration: 0}});
   newBuddyWin.getContent().innerHTML = '<div class="dialog_info" style="padding:3px;">Please enter the name of the user you would like to add to your buddylist.</div> \
                                         <span id="newbuddy_error_msg" style="display:block;width:100%;padding-top:5px;padding-bottom:10px;color:#ff0000;font-weight:bold;text-align:center;">&nbsp;</span> \
                                         <div id="newbuddy_box" style="padding-left:22px;width:100%;"> \
                                         <div style="display:block;float:left;margin-right:24px;padding-top:4px;">Username:</div><input type="text" style="width:110px;" id="newBuddyUsername" name="newBuddyUsername" onkeypress="handleInput(event, function() { addNewBuddyToList($(\'newBuddyUsername\').value, $(\'newBuddyGroup\').value); })" /><br /> \
                                         <div style="display:block;float:left;margin-right:5px;padding-top:4px;">Add to Group:</div><input type="text" style="width:110px;" id="newBuddyGroup" name="newBuddyGroup" value="Friends" onfocus="this.select();" onkeypress="handleInput(event, function() { addNewBuddyToList($(\'newBuddyUsername\').value, $(\'newBuddyGroup\').value); })" /> \
                                         </div> \
                                         <div id="newbuddy_buttons"> \
                                         <img src="images/' + windowCSS + '/addbuddy_btn.png" onclick="addNewBuddyToList($(\'newBuddyUsername\').value, $(\'newBuddyGroup\').value);"  onmouseover="buttonHover(this);" onmouseout="buttonNormal(this);" onmousedown="buttonDown(this);" onmouseup="buttonNormal(this);" /> \
                                         <img src="images/' + windowCSS + '/cancel.png" onclick="Windows.close(\'newBuddy\');"  onmouseover="buttonHover(this);" onmouseout="buttonNormal(this);" onmousedown="buttonDown(this);" onmouseup="buttonNormal(this);" /> \
                                         </div>';
   $('newbuddy_buttons').style.position = 'absolute';
   $('newbuddy_buttons').style.top      = '150px';
   $('newbuddy_buttons').style.left     = '25px';
   newBuddyWin.setDestroyOnClose();
   newBuddyWin.showCenter();
   setTimeout("$('newBuddyUsername').focus();", 125);
}

function remove_buddy_dialog() {
   var delBuddyWin;
   if(curSelected == '' || curSelected.length == 0)
      return;
   
   if($('delBuddy')) {
      Windows.getWindow('delBuddy').toFront();
      return;
   }
   
   delBuddyWin = new Window('delBuddy',
                           {className: "dialog", width: 240, height: 70, resizable: false,
                            title: "Remove a Buddy", draggable: true, closable: true, maximizable: false, minimizable: false, detachable: false,
                            minWidth: 240, minHeight:70, showEffectOptions: {duration: 0}, hideEffectOptions: {duration: 0}});
   delBuddyWin.getContent().innerHTML = '<div class="dialog_info" style="padding:3px;">Are you sure you want to remove buddy "<b>' + curSelected + '</b>" from your buddylist?</div> \
                                         <div id="delbuddy_buttons"> \
                                         <img src="images/' + windowCSS + '/ok.png" onclick="deleteBuddyFromList(curSelected);Windows.close(\'delBuddy\');"  onmouseover="buttonHover(this);" onmouseout="buttonNormal(this);" onmousedown="buttonDown(this);" onmouseup="buttonNormal(this);" /> \
                                         <img src="images/' + windowCSS + '/cancel.png" onclick="Windows.close(\'delBuddy\');"  onmouseover="buttonHover(this);" onmouseout="buttonNormal(this);" onmousedown="buttonDown(this);" onmouseup="buttonNormal(this);" /> \
                                         </div>';
   $('delbuddy_buttons').style.position = 'absolute';
   $('delbuddy_buttons').style.top      = '60px';
   $('delbuddy_buttons').style.left     = '25px';
   delBuddyWin.setDestroyOnClose();
   delBuddyWin.showCenter();
}

function remove_group_dialog(group) {
   var delGroupWin;  
   if($('delGroup')) {
      Windows.getWindow('delGroup').toFront();
      return;
   }
   
   delGroupWin = new Window('delGroup',
                           {className: "dialog", width: 240, height: 70, resizable: false,
                            title: "Remove a Group", draggable: true, closable: true, maximizable: false, minimizable: false, detachable: false,
                            minWidth: 240, minHeight:70, showEffectOptions: {duration: 0}, hideEffectOptions: {duration: 0}});
   delGroupWin.getContent().innerHTML = '<div class="dialog_info" style="padding:3px;">Are you sure you want to remove group "<b>' + group + '</b>" (and all users in it) from your buddylist?</div> \
                                         <div id="delgroup_buttons"> \
                                         <img src="images/' + windowCSS + '/ok.png" onclick="deleteGroupFromList(\'' + group + '\');Windows.close(\'delGroup\');"  onmouseover="buttonHover(this);" onmouseout="buttonNormal(this);" onmousedown="buttonDown(this);" onmouseup="buttonNormal(this);" /> \
                                         <img src="images/' + windowCSS + '/cancel.png" onclick="Windows.close(\'delGroup\');"  onmouseover="buttonHover(this);" onmouseout="buttonNormal(this);" onmousedown="buttonDown(this);" onmouseup="buttonNormal(this);" /> \
                                         </div>';
   $('delgroup_buttons').style.position = 'absolute';
   $('delgroup_buttons').style.top      = '60px';
   $('delgroup_buttons').style.left     = '25px';
   delGroupWin.setDestroyOnClose();
   delGroupWin.showCenter();
}

function change_pass_dialog() {
   var changePassWin;
   if($('changePass')) {
      Windows.getWindow('changePass').toFront();
      return;
   }
   
   changePassWin = new Window('changePass',
                            {className: "dialog", width: 240, height: 160, resizable: false,
                             title: "Change Password", draggable: true, closable: true, maximizable: false, minimizable: false, detachable: false,
                             minWidth: 240, minHeight: 120, showEffectOptions: {duration: 0}, hideEffectOptions: {duration: 0}});
   changePassWin.getContent().innerHTML = '<div class="dialog_info" style="padding:3px;">To change your password, please your current password, then your new password.</div> \
                                         <span id="changepass_error_msg" style="display:block;width:100%;padding-top:5px;padding-bottom:10px;color:#ff0000;font-weight:bold;text-align:center;">&nbsp;</span> \
                                         <div id="changepass_box" style="padding-left:12px;width:100%;"> \
                                         <div style="display:block;float:left;margin-right:5px;padding-top:4px;">Current Password:</div><input type="password" style="width:110px;" id="currentpw" name="currentpw" onkeypress="handleInput(event, function() { changePass(); })" /><br /> \
                                         <div style="display:block;float:left;margin-right:20px;padding-top:4px;">New Password:</div><input type="password" style="width:110px;" id="newpw" name="newpw" onkeypress="handleInput(event, function() { changePass(); })" /> \
                                         <div style="display:block;float:left;margin-right:4px;padding-top:4px;">Confirm Password:</div><input type="password" style="width:110px;" id="confirmpw" name="confirmpw" onkeypress="handleInput(event, function() { changePass(); })" /> \
                                         </div> \
                                         <div id="changepass_buttons"> \
                                         <img src="images/' + windowCSS + '/change.png" onclick="changePass();"  onmouseover="buttonHover(this);" onmouseout="buttonNormal(this);" onmousedown="buttonDown(this);" onmouseup="buttonNormal(this);" /> \
                                         <img src="images/' + windowCSS + '/cancel.png" onclick="Windows.close(\'changePass\');"  onmouseover="buttonHover(this);" onmouseout="buttonNormal(this);" onmousedown="buttonDown(this);" onmouseup="buttonNormal(this);" /> \
                                         </div>';
   $('changepass_buttons').style.position = 'absolute';
   $('changepass_buttons').style.top      = '150px';
   $('changepass_buttons').style.left     = '25px';
   changePassWin.setDestroyOnClose();
   changePassWin.showCenter();
   setTimeout("$('currentpw').focus();", 125);
}