window.js

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

  // updateDrag event
   _updateDrag: function(event) {
      var pointer = [Event.pointerX(event), Event.pointerY(event)];    
      var dx = pointer[0] - this.pointer[0];
      var dy = pointer[1] - this.pointer[1];
      
      // Resize case, update width/height
      if (this.doResize) {
         this.setSize(this.widthOrg + dx , this.heightOrg + dy);
         
      dx = this.width - this.widthOrg
      dy = this.height - this.heightOrg
         
        // Check if it's a right position, update it to keep upper-left corner at the same position
         if (! this.useLeft) 
            this.element.setStyle({right: (this.rightOrg -dx) + 'px'});
         // Check if it's a bottom position, update it to keep upper-left corner at the same position
         if (! this.useTop) 
            this.element.setStyle({bottom: (this.bottomOrg -dy) + 'px'});
            
         Windows.notify("onResize", this);
      }
      // Move case, update top/left
      else {
        this.pointer = pointer;
        
         if (this.useLeft) 
            this.element.setStyle({left: parseFloat(this.element.getStyle('left')) + dx + 'px'});
         else 
            this.element.setStyle({right: parseFloat(this.element.getStyle('right')) - dx + 'px'});
         
         if (this.useTop) 
            this.element.setStyle({top: parseFloat(this.element.getStyle('top')) + dy + 'px'});
        else 
            this.element.setStyle({bottom: parseFloat(this.element.getStyle('bottom')) - dy + 'px'});
      }
      if (this.iefix) 
         this._fixIEOverlapping(); 
         
      this._removeStoreLocation();
    Event.stop(event);
   },

    // endDrag callback
    _endDrag: function(event) {
      // Remove temporary div over iframes
      WindowUtilities.enableScreen('__invisible__');
      
      if (this.doResize)
         Windows.notify("onEndResize", this);
      else
         Windows.notify("onEndMove", this);
      
      // Release event observing
      Event.stopObserving(document, "mouseup", this.eventMouseUp,false);
    Event.stopObserving(document, "mousemove", this.eventMouseMove, false);

      // Store new location/size if need be
      this._saveCookie()

    Event.stop(event);
    
    // Restore selection
    document.body.ondrag = null;
    document.body.onselectstart = null;
  },

   _keyPress: function(event) {
      //Dialog.cancelCallback();
   },
   
   // Creates HTML window code
   _createWindow: function(id) {
     var className = this.options.className;
      var win = document.createElement("div");
      win.setAttribute('id', id);
      win.className = "dialog";

      var content;
      if (this.options.url)
         content= "<iframe name=\"" + id + "_content\"  id=\"" + id + "_content\" src=\"" + this.options.url + "\"> </iframe>";
      else
         content ="<div id=\"" + id + "_content\" class=\"" +className + "_content\"> </div>";
         
      var closeDiv = this.options.closable ? "<div class='"+ className +"_close' id='"+ id +"_close' onmouseup='Windows.close(\""+ id +"\")'> </div>" : "";
      var minDiv = this.options.minimizable ? "<div class='"+ className + "_minimize' id='"+ id +"_minimize' onmouseup='Windows.minimize(\""+ id +"\")'> </div>" : "";
      var maxDiv = this.options.maximizable ? "<div class='"+ className + "_maximize' id='"+ id +"_maximize' onmouseup='Windows.maximize(\""+ id +"\")'> </div>" : "";
      var detDiv = this.options.detachable ? "<div class='"+ className + "_detach' id='"+ id +"_detach' onmouseup='detachIMWindow(\""+ id.replace(/_im/, '') +"\")'> </div>" : "";
      var seAttributes = this.options.resizable ? "class='" + className + "_sizer' id='" + id + "_sizer'" : "class='"  + className + "_se'";
      
    win.innerHTML = closeDiv + minDiv + maxDiv + detDiv + "\
      <table id='"+ id +"_row1' class=\"top table_window\">\
        <tr>\
          <td class='"+ className +"_nw' id='" + id + "_nw'>&nbsp;</td>\
          <td class='"+ className +"_n' id='" + id + "_n'><div id='"+ id +"_top' class='"+ className +"_title title_window'>"+ this.options.title +"</div></td>\
          <td class='"+ className +"_ne' id='" + id + "_ne'>&nbsp;</td>\
        </tr>\
      </table>\
      <table id='"+ id +"_row2' class=\"mid table_window\">\
        <tr>\
          <td class='"+ className +"_w'></td>\
            <td id='"+ id +"_table_content' class='"+ className +"_content' valign='top'>"+ content +"</td>\
          <td class='"+ className +"_e'></td>\
        </tr>\
      </table>\
        <table id='"+ id +"_row3' class=\"bot table_window\">\
        <tr>\
          <td class='"+ className +"_sw'>&nbsp;</td>\
            <td class='"+ className +"_s'><div id='"+ id +"_bottom' class='status_bar'>&nbsp;</div></td>\
            <td " + seAttributes + ">&nbsp;</td>\
        </tr>\
      </table>\
    ";
    
      Element.hide(win);
      this.options.parent.insertBefore(win, this.options.parent.firstChild);
      Event.observe($(id + "_content"), "load", this.options.onload);
      return win;
   },
   
   // Sets window location
   setLocation: function(top, left) {
     if (top < 0)
       top = 0;
    if (left < 0)
      left= 0
      this.element.setStyle({top: top + 'px'});
      this.element.setStyle({left: left + 'px'});
      this.useLeft = true;
      this.useTop = true;
   },
   
   // Gets window location
   getLocation: function() {
     return {top: this.element.getStyle('top'), left: this.element.getStyle('left')};
   },
      
   // Gets window size
   getSize: function() {
     return {width: this.width, height: this.height};
   },
      
   // Sets window size
   setSize: function(width, height) {    
     width = parseFloat(width);
     height = parseFloat(height);
     
      // Check min and max size
      if (width < this.options.minWidth)
         width = this.options.minWidth;

      if (height < this.options.minHeight)
         height = this.options.minHeight;
         
      if (this.options. maxHeight && height > this.options. maxHeight)
         height = this.options. maxHeight;

      if (this.options. maxWidth && width > this.options. maxWidth)
         width = this.options. maxWidth;

     this.width = width;
      this.height = height;
      this.element.setStyle({width: width + this.widthW + this.widthE + "px"})
      this.element.setStyle({height: height  + this.heightN + this.heightS + "px"})

      // Update content height
      var content = $(this.element.id + '_content')
      content.setStyle({height: height  + 'px'});
      content.setStyle({width: width  + 'px'});
   },
   
   updateHeight: function() {
    this.setSize(this.width, this.content.scrollHeight)
   },
   
   updateWidth: function() {
    this.setSize(this.content.scrollWidth, this.height)
   },
   
   // Brings window to front
   toFront: function() {
    if($(Windows.focusedWindow.element.id + '_nw') && typeof(Windows.focusedWindow) != 'undefined' && typeof(Windows.focusedWindow) != 'null' && Windows.focusedWindow.element.id != 'modal_dialog') {
       $(Windows.focusedWindow.element.id + '_nw').setStyle({background: "transparent url(images/default/top_left_inactive.gif) no-repeat 0 0"});
       $(Windows.focusedWindow.element.id + '_n').setStyle({background: "transparent url(images/default/top_mid_inactive.gif) repeat-x 0 0"});
       $(Windows.focusedWindow.element.id + '_ne').setStyle({background: "transparent url(images/default/top_right_inactive.gif) no-repeat 0 0"});
       if(Windows.focusedWindow.options.detachable) $(Windows.focusedWindow.element.id + '_detach').setStyle({background: "transparent url(images/default/detach_inactive.gif) no-repeat 0 0"});
       if(Windows.focusedWindow.options.minimizable) $(Windows.focusedWindow.element.id + '_minimize').setStyle({background: "transparent url(images/default/minimize_inactive.gif) no-repeat 0 0"});
       if(Windows.focusedWindow.options.maximizable) $(Windows.focusedWindow.element.id + '_maximize').setStyle({background: "transparent url(images/default/maximize_inactive.gif) no-repeat 0 0"});
       if(Windows.focusedWindow.options.closable) $(Windows.focusedWindow.element.id + '_close').setStyle({background: "transparent url(images/default/close_inactive.gif) no-repeat 0 0"});
    }
    
    this.setZIndex(Windows.maxZIndex + 20);

    if(this.element.id != 'modal_dialog') {
       $(this.element.id + '_nw').setStyle({background: "transparent url(images/default/top_left.gif) no-repeat 0 0"});
       $(this.element.id + '_n').setStyle({background: "transparent url(images/default/top_mid.gif) repeat-x 0 0"});
       $(this.element.id + '_ne').setStyle({background: "transparent url(images/default/top_right.gif) no-repeat 0 0"});
       if(this.options.detachable) $(this.element.id + '_detach').setStyle({background: "transparent url(images/default/detach.gif) no-repeat 0 0"});
       if(this.options.minimizable) $(this.element.id + '_minimize').setStyle({background: "transparent url(images/default/minimize.gif) no-repeat 0 0"});
       if(this.options.maximizable) $(this.element.id + '_maximize').setStyle({background: "transparent url(images/default/maximize.gif) no-repeat 0 0"});
       if(this.options.closable) $(this.element.id + '_close').setStyle({background: "transparent url(images/default/close.gif) no-repeat 0 0"});
    }
    
    Windows.notify("onFocus", this);
   },
   
   // Displays window modal state or not
   show: function(modal) {
      if (modal) {
         WindowUtilities.disableScreen(this.options.className, 'overlay_modal', this.getId());
         this.modal = true;         
         this.setZIndex(Windows.maxZIndex + 20);
         Windows.unsetOverflow(this);
         Event.observe(document, "keypress", this.eventKeyPress);            
      }
      
      // To restore overflow if need be
      if (this.oldStyle)
        this.getContent().setStyle({overflow: this.oldStyle});
         
      if (! this.width || !this.height) {
      var size = WindowUtilities._computeSize(this.content.innerHTML, this.content.id, this.width, this.height, 0)
        if (this.height)
          this.width = size + 5
        else
          this.height = size + 5
      }

      this.setSize(this.width, this.height);
      if (this.centered)
        this._center(this.centerTop, this.centerLeft);      
        
      if (this.options.showEffect != Element.show && this.options.showEffectOptions )
         this.options.showEffect(this.element, this.options.showEffectOptions);   
      else
         this.options.showEffect(this.element);   
         
    this._checkIEOverlapping();
    Windows.notify("onShow", this);    
   },
   
   // Displays window modal state or not at the center of the page
   showCenter: function(modal, top, left) {
    this.centered = true;
    this.centerTop = top;
    this.centerLeft = left;

      this.show(modal);
   },
   
   isVisible: function() {
     return this.element.visible();
   },
   
   _center: function(top, left) {
      var windowScroll = WindowUtilities.getWindowScroll();    
      var pageSize = WindowUtilities.getPageSize();    

    if (!top)
      top = (pageSize.windowHeight - (this.height + this.heightN + this.heightS))/2;
    top += windowScroll.top
    
    if (!left)
      left = (pageSize.windowWidth - (this.width + this.widthW + this.widthE))/2;
    left += windowScroll.left 
    
    this.setLocation(top, left);
    this.toFront();
   },
   
   _recenter: function(event) {
     if (this.modal) {
        var pageSize = WindowUtilities.getPageSize();
        // set height of Overlay to take up whole page and show
        if ($('overlay_modal')) {
          $('overlay_modal').style.height = (pageSize.pageHeight + 'px');
          $('overlay_modal').style.width = (pageSize.pageWidth + 'px');
      }      
        if (this.centered)
          this._center(this.centerTop, this.centerLeft);      
     }
   },
   
   // Hides window
   hide: function() {
      if (this.modal) {
         WindowUtilities.enableScreen();
         Windows.resetOverflow();
         Event.stopObserving(document, "keypress", this.eventKeyPress);         
      }
      // To avoid bug on scrolling bar
     this.oldStyle = this.getContent().getStyle('overflow') || "auto"
      this.getContent().setStyle({overflow: "hidden"});

      this.options.hideEffect(this.element, this.options.hideEffectOptions);   

       if(this.iefix) 
         this.iefix.hide();
      Windows.notify("onHide", this);
   },

  minimize: function() {
    var r2 = $(this.getId() + "_row2");
    var dh = r2.getDimensions().height;
    
    if (r2.visible()) {
      var h  = this.element.getHeight() - dh
      r2.hide()
        this.element.setStyle({height: h + "px"})
        if (! this.useTop) {
          var bottom = parseFloat(this.element.getStyle('bottom'));
           this.element.setStyle({bottom: (bottom + dh) + 'px'});
        }
    } 
    else {
      var h  = this.element.getHeight() + dh;
      this.element.setStyle({height: h + "px"})
        if (! this.useTop) {