MzRotateImage.js
上传用户:yatiankong
上传日期:2014-05-16
资源大小:5604k
文件大小:5k
源码类别:

Applet

开发平台:

Java

  1. /*---------------------------------------------------------------------------*
  2. |  Subject:    Rotate AD
  3. |  NameSpace:  System.Web.UI.WebControls.MzRotateImage
  4. |  Author:     meizz
  5. |  Created:    2006-11-11
  6. |  Version:    2006-12-06
  7. |-----------------------------------
  8. |  MSN: huangfr@msn.com QQ:112889082 Copyright (c) meizz
  9. |  http://www.meizz.com/jsframework/ MIT-style license
  10. |  The above copyright notice and this permission notice shall be
  11. |  included in all copies or substantial portions of the Software
  12. *---------------------------------------------------------------------------*/
  13. //Using("System.Data.MzDataProvider");
  14. //Using("System.Web.Forms.MzBehavior");
  15. //node{url, target, summary, img, alt}
  16. function MzRotateImage()
  17. {
  18.   MzDataProvider.call(this); this.stateChangeHandle(1);
  19.   this.width = 280;
  20.   this.height= 187;
  21.   this.timer = null;
  22.   this.interval = 3000;
  23.   this.duration = 2000;
  24.   this.activeIndex = 1;
  25.   this.currentIndex = 0;
  26.   this.floatControlBar = false;
  27.   this.useFilter = System.ie && MzBrowser.version>=5.5;
  28. }
  29. MzRotateImage.Extends(MzDataProvider, "MzRotateImage");
  30. System.loadCssFile(System.resourcePath +"/MzRotateImage.css", "MzRotateImage_CSS");
  31. MzRotateImage.prototype.render=function()
  32. {
  33.   this.dataInit();  this.images=new Array();
  34.   var d = this.nodes = this.rootNode.childNodes;
  35.   for(var i=0; i<d.length; i++)
  36.   {
  37.     this.images[i] = new Image();
  38.     this.images[i].src = d[i].get("img");
  39.   }
  40.   var id=this.id="MzRotateImage_"+this.hashCode,s=[];
  41.   var width  = this.width  = parseInt(this.width);
  42.   var height = this.height = parseInt(this.height);
  43.   s.push("<div id='"+id+"' style='width:"+width+"px;' class='MzRotateImage'>");
  44.   s.push("<div id='"+id+"_ImageBox' class='MzRotateImage_ImageBox' style='height:"+ height +"px'>");
  45.   if(this.useFilter) { if(d.length>0) //filter: revealTrans
  46.   {
  47.     var alt = d[0].get("alt"), src = this.images[0].src;
  48.     s.push("<a href='#'><img alt='"+ alt +"' src='"+src+"' ");if(d.length>1)
  49.     s.push("style='filter:revealTrans(duration="+(this.duration/1000)+")'");
  50.     s.push(" id='"+ id +"_img' style='border: none' /></a>");}
  51.   }
  52.   else { for(i=0; i<d.length; i++) //new MzBehavior.Rotate()
  53.   {
  54.     s.push("<div id='"+id+"_item_"+i+"' style='width: "+width+"px;");
  55.     if (i>0) s.push(" display: none;");
  56.     s.push(" height: "+ height +"px; overflow: hidden;'>");
  57.     s.push("<a href='"+ (d[i].get("url") || "#")+"'");
  58.     s.push(" target='"+ (d[i].get("target") || "_self") +"'>");
  59.     s.push("<img alt='"+(d[i].get("alt") || "") +"'");
  60.     s.push(" src='"+ this.images[i].src +"' /></a></div>");}
  61.   }
  62.   s.push("</div><div style='width: "+ width +"px; ");
  63.   s.push((this.floatControlBar?"margin-top: -16px":"") +"' ");
  64.   s.push(" id='"+id+"_ControlBar' class='MzRotateImage_ControlBar'>");
  65.   for(i=0;i<d.length;i++)s.push("<input type='button' value='"+(i+1)+"'/>");
  66.   s.push("</div>"); s.push("</div>"); s = s.join("");
  67.   this.stateChangeHandle(2); this._onload();
  68.   return s;
  69. };
  70. MzRotateImage.prototype.stateChangeHandle=function(n)
  71. {
  72.   this.readyState = n||0;
  73.   this.dispatchEvent(new System.Event("onreadystatechange"));
  74. };
  75. MzRotateImage.prototype._onload=function()
  76. {
  77.   var me=this;
  78.   if(MzElement.check(this.id))
  79.   {
  80.     this.stateChangeHandle(4);
  81.     
  82.     if(this.useFilter) this.timer=
  83.       setTimeout(function(){me.filter();}, me.interval+me.duration);
  84.     else
  85.     {
  86.       this._rotate = new MzBehavior.Rotate(me.id +"_ImageBox",
  87.         {interval:me.interval,duration:me.duration});
  88.       this._rotate.addEventListeners("onchange", function(e)
  89.       {
  90.         me.activeIndex  = e.target.activeIndex;
  91.         me.currentIndex = e.target.currentIndex;
  92.         e= new System.Event("onchange"); e.target=me;
  93.         me.dispatchEvent(e);
  94.       });
  95.     }
  96.     
  97.     var A = MzElement.check(this.id+"_ControlBar").getElementsByTagName("INPUT");
  98.     A[this.currentIndex].className = "active";
  99.     this.addEventListeners("onchange", function(e)
  100.     {
  101.       for(var i=0; i<A.length; i++) A[i].className="";
  102.       A[e.target.activeIndex].className = "active";
  103.     });
  104.     for(var i=0; i<A.length; i++)
  105.     {
  106.       var f=new Function("Instance('"+ this.hashCode +"').focus("+ i +")");
  107.       A[i].onmouseover = f; A[i].onclick = f;
  108.     }
  109.   }
  110.   else setTimeout(function(){me._onload();}, 10);
  111. };
  112. MzRotateImage.prototype.focus=function(n)
  113. {
  114.   clearTimeout(this.timer);
  115.   if(this.useFilter){this.activeIndex=n; this.filter();}
  116.   else if(this._rotate) this._rotate.focus(n);
  117. };
  118. MzRotateImage.prototype.filter=function()
  119. {
  120.   var me = this;
  121.   if(me.dispatchEvent(new System.Event("onchange")))
  122.   {
  123.     var img; if(img=MzElement.check(me.id +"_img")){
  124.     img.filters.revealTrans.Transition=23;
  125.     img.filters.revealTrans.apply();
  126.     var a = img.parentNode;
  127.     var N=me.activeIndex;
  128.     this.currentIndex = N;
  129.     this.activeIndex = N+1>=me.nodes.length ? 0 : N+1;
  130.     a.href = (me.nodes[N].get("url") || "#");
  131.     a.target = (me.nodes[N].get("target") || "_self");
  132.     img.src=me.images[N].src;
  133.     img.filters.revealTrans.play();}
  134.   }
  135.   this.timer=setTimeout(function(){me.filter();}, me.interval+me.duration);
  136. };