// Scroll2 Object // new version of the scroll object featuring horizontal scrolling and better code design // 19990613 // Modified by Jordi Ministral. Now it allows resizing, loading and content writing. // Only works when in 'default' mode, no Inline content and buffer active in Ie. I must // confess I didn't care about the other modes because I don't use them // Automatically refreshes content after scrolling when content contains a form, so // the form is properly displayed. // I havenīt been able to resize it in Netscape without reloading the page. Any ideas // are gratefully welcome // Actually the file is 25K. Once it has been totally completed and debugged ( if this is possible ) // it should be compressed. The resizing methods don't look nice, but again I had those // fearsome deadlines. ( Actually I work with these things, and there's people high above me // expecting results ) // Copyright (C) 1999 Dan Steinman // Distributed under the terms of the GNU Library General Public License // Available at http://www.dansteinman.com/dynapi/ function Scroll(x,y,width,height,frame,name) { this.name=(name!=null)? name : "Scroll"+(Scroll.count++) this.x=x this.y=y this.w=width this.h=height this.frame=frame this.obj=this.name+"Object" eval(this.obj+"=this") Scroll.list[Scroll.list.length]=this this.urlLoaded = false; } {var p=Scroll.prototype p.useV=true p.useH=false p.drawBorder=false p.vis=null p.z=null p.cornerImg="" p.imgSet=ScrollImgSet p.setDim=ScrollSetDim p.setDim(20,20,30) p.makeObjects=ScrollMakeObjects p.build=ScrollBuild p.activate=ScrollActivate p.moveBars=ScrollWindowMoveBars p.moveWindowH=ScrollBarMoveWindowH p.moveWindowV=ScrollBarMoveWindowV p.resize=ScrollResize p.load=ScrollLoad p.setContent=ScrollSetContent p.showBlock=ScrollShowBlock p.ScrollEnd = ScrollScrollEnd p.onScrollEnd = new Function()} //myscroll.imgSet('',16, 16, 37, -1, 2, -1, 2, 1, 1) function ScrollImgSet(dir,barW,arrowH,boxH,bvy,bvh,bhx,bhw,dny,rtx,sdv,sdh) { var a=arguments for (var i=4;i<12;i++) if (a[i]==null) a[i]=0 this.setDim(barW,arrowH,boxH) if (this.useV) { this.dim.barV[1]+=a[4] this.dim.barV[3]+=a[5] this.dim.dn[1]+=(this.useH)?a[8]:0 } if (this.useH) { this.dim.barH[0]+=a[6] this.dim.barH[2]+=a[7] this.dim.rt[0]+=a[9] } this.makeObjects(dir) if (this.useV) { this.barV.setImages('scroll-bgv.gif','scroll-boxv.gif',a[10]?'scroll-sdv.gif':null,dir) this.upImg.setImages('scroll-up0.gif','scroll-up1.gif',dir) this.dnImg.setImages('scroll-dn0.gif','scroll-dn1.gif',dir) } if (this.useH) { this.barH.setImages('scroll-bgh.gif','scroll-boxh.gif',a[11]?'scroll-sdh.gif':null,dir) this.ltImg.setImages('scroll-lt0.gif','scroll-lt1.gif',dir) this.rtImg.setImages('scroll-rt0.gif','scroll-rt1.gif',dir) } if (this.useV && this.useH) this.cornerImg=dir+'scroll-corner.gif' this.window.border=0 } function ScrollSetDim(barW,arrowH,boxH) { this.dim=new Object() if (this.useV) { this.dim.barV=new Array(this.w,arrowH,barW,this.h-2*arrowH,barW,boxH) this.dim.up=new Array(this.w,0,barW,arrowH) this.dim.dn=new Array(this.w,this.h-arrowH,barW,arrowH) } if (this.useH) { this.dim.barH=new Array(arrowH,this.h,this.w-2*arrowH,barW,boxH,barW) this.dim.lt=new Array(0,this.h,arrowH,barW) this.dim.rt=new Array(this.w-arrowH,this.h,arrowH,barW) } } function ScrollMakeObjects(dir) { var a if (this.useV) { a=this.dim.barV; this.barV=new ScrollBar(a[0],a[1],a[2],a[3],a[4],a[5]) this.barV.grandPa = this; this.barV.onScroll=new Function(this.obj+'.moveWindowV()') a=this.dim.up; this.upImg=new ButtonImage(a[0],a[1],a[2],a[3]) this.upImg.grandPa = this; a=this.dim.dn; this.dnImg=new ButtonImage(a[0],a[1],a[2],a[3]) this.dnImg.grandPa = this; this.upImg.onDown=new Function(this.obj+'.window.up()') this.upImg.onUp=new Function(this.obj+'.window.stop()') this.dnImg.onDown=new Function(this.obj+'.window.down()') this.dnImg.onUp=new Function(this.obj+'.window.stop()') } if (this.useH) { a=this.dim.barH; this.barH=new ScrollBar(a[0],a[1],a[2],a[3],a[4],a[5]) this.barH.grandPa = this; this.barH.onScroll=new Function(this.obj+'.moveWindowH()') a=this.dim.lt; this.ltImg=new ButtonImage(a[0],a[1],a[2],a[3]) this.ltImg.grandPa = this; a=this.dim.rt; this.rtImg=new ButtonImage(a[0],a[1],a[2],a[3]) this.rtImg.grandPa = this; this.ltImg.onDown=new Function(this.obj+'.window.left()') this.ltImg.onUp=new Function(this.obj+'.window.stop()') this.rtImg.onDown=new Function(this.obj+'.window.right()') this.rtImg.onUp=new Function(this.obj+'.window.stop()') } this.window=new ScrollWindow(0,0,this.w,this.h,this.frame) this.window.onScroll=new Function(this.obj+'.moveBars()') } function ScrollResize(nW,nH) { if(!this.activated) this.activate(false) this.lyr.resize(nW,nH) if(this.barV) { // Scrollbar this.barV.h=nH-2*this.dim.up[3]-(this.Cornerlyr?this.Cornerlyr.h:0) this.barV.offsetHeight=this.barV.h-this.barV.boxH this.barV.offsetWidth=this.barV.w-this.barV.boxW if(!this.barV.lyr) this.barV.activate() this.barV.lyr.resize(this.barV.lyr.w,this.barV.h+2) this.barV.lyrc.resize(this.barV.lyr.w,this.barV.h+2) this.barV.lyr.moveTo(nW-this.barV.w,null) // Down button if(!this.dnImg.lyr) this.dnImg.activate() this.dnImg.lyr.moveTo(nW-this.dnImg.lyr.w,this.barV.h+this.upImg.lyr.h) // Up button if(!this.upImg.lyr) this.upImg.activate() this.upImg.lyr.moveTo(nW-this.upImg.lyr.w,null) } if(this.barH) { // Scrollbar this.barH.w=nW-2*this.dim.up[2]-(this.Cornerlyr?this.Cornerlyr.w:0) this.barH.offsetHeight=this.barH.h-this.barH.boxH this.barH.offsetWidth=this.barH.w-this.barH.boxW if(!this.barH.lyr) this.barH.activate() this.barH.lyr.resize(this.barH.w+2,this.barH.lyr.h) this.barH.lyrc.resize(this.barH.w+2,this.barH.lyr.h) this.barH.lyr.moveTo(null,nH-this.barH.h) // Left button if(!this.ltImg.lyr) this.ltImg.activate() this.ltImg.lyr.moveTo(null,nH-this.ltImg.lyr.h) // Right button if(!this.rtImg.lyr) this.rtImg.activate() this.rtImg.lyr.moveTo(this.barH.w+this.ltImg.lyr.w,nH-this.rtImg.lyr.h) } if (this.Cornerlyr) this.Cornerlyr.moveTo(nW-this.Cornerlyr.w,nH-this.Cornerlyr.h) // Resize scrollwindow and it's contents. Please work ... if(this.barV) nW -= this.barV.w; if(this.barH) nH -= this.barH.h; this.window.resize(nW,nH) if(!this.urlLoaded) this.activate(false); } function ScrollScrollEnd() { if(this.window.hasForms) { this.window.contentlyr.hide(); setTimeout(this.obj+".window.contentlyr.show();",0); } this.onScrollEnd(); } function ScrollBuild() { this.window.build() this.css=css(this.name,this.x,this.y,null,null,null,this.vis,this.z)+this.window.css if (this.cornerImg!="") this.css+=css(this.name+'Corner',this.w,this.h,this.barV.w,this.barH.h) if (this.drawBorder) { this.css+=css(this.name+'CornerT',0,0,this.w,1,'black')+css(this.name+'CornerL',0,0,1,this.h,'black') if (!this.useH) this.css+=css(this.name+'CornerB',0,this.h-1,this.w,1,'black') } this.divStart='
\n' if (this.useV) { this.barV.boxvis='hidden' this.barV.build() this.upImg.build() this.dnImg.build() this.css+=this.barV.css+this.upImg.css+this.dnImg.css this.divStart+=this.barV.div+this.upImg.div+this.dnImg.div } if (this.useH) { this.barH.boxvis='hidden' this.barH.build() this.ltImg.build() this.rtImg.build() this.css+=this.barH.css+this.ltImg.css+this.rtImg.css this.divStart+=this.barH.div+this.ltImg.div+this.rtImg.div } if (this.cornerImg!="") this.divStart+='
\n' this.divStart+=this.window.divStart this.divEnd=this.window.divEnd if (this.drawBorder) this.divEnd+='
\n' this.divEnd+='\n
' this.div=this.divStart+this.divEnd } function ScrollActivate(gotop,w,h,reset) { if (!this.activated) { this.lyr=new DynLayer(this.name) if (this.cornerImg!="") this.Cornerlyr=new DynLayer(this.name+'Corner') if (this.useV) { this.barV.activate() this.upImg.activate() this.dnImg.activate() } if (this.useH) { this.barH.activate() this.ltImg.activate() this.rtImg.activate() } } this.window.activate(w,h,reset) if(gotop) this.window.contentlyr.moveTo(this.window.marginT,this.window.marginL); if (this.useV) { if (gotop || reset) this.barV.boxlyr.moveTo(null,0) if (!this.window.enableVScroll) { this.barV.boxlyr.hide(); this.window.contentlyr.moveTo(this.window.marginT,null);} else this.barV.boxlyr.css.visibility="inherit" } if (this.useH) { if (gotop || reset) this.barH.boxlyr.moveTo(0,null) if (!this.window.enableHScroll) { this.barH.boxlyr.hide(); this.window.contentlyr.moveTo(null,this.window.marginL);} else this.barH.boxlyr.css.visibility="inherit" } if(is.ie) { this.window.contentlyr.css.backgroundColor=this.window.getBG(); this.window.lyr.css.backgroundColor=this.window.getBG(); } else this.window.lyr.doc.bgColor = this.window.getBG(); this.activated=true } function ScrollLoad(url) { this.urlLoaded=true; this.window.load(url) } function ScrollSetContent(cnt,gotop) { this.urlLoaded=false; this.window.setContent(cnt,gotop); this.activate(gotop); } function ScrollShowBlock(i) { this.window.showBlock(i,this.obj+'.activate()') } function ScrollWindowMoveBars() { if (this.useV && this.window.enableVScroll) this.barV.boxlyr.moveTo(null,this.window.getYfactor()*this.barV.offsetHeight) if (this.useH && this.window.enableHScroll) this.barH.boxlyr.moveTo(this.window.getXfactor()*this.barH.offsetWidth,null) } function ScrollBarMoveWindowV() { if (this.window.enableVScroll) this.window.contentlyr.moveTo(null,-this.barV.getYfactor()*this.window.offsetHeight+this.window.marginT) } function ScrollBarMoveWindowH() { if (this.window.enableHScroll) this.window.contentlyr.moveTo(-this.barH.getXfactor()*this.window.offsetWidth+this.window.marginL,null) } function ScrollTestActive() { if (is.ie) return false for (var i=0;i0) this.css+=css(this.name+'BorderT',0,0,w,b,bc)+css(this.name+'BorderB',0,h-b,w,b,bc)+css(this.name+'BorderL',0,0,b,h,bc)+css(this.name+'BorderR',w-b,0,b,h,bc) if (this.inlineBlocks) { this.css+=css(this.name+'Content',0,0,w-2*b,null) this.css+=css(this.name+'Block0',ml,mt,w-2*b-ml-mr,null,this.bgColor) for (var i=1;i\n':'' this.divStart+='
'+ '
' if (is.ie && !this.usebuffer) this.divStart+='\n' else this.divStart+='
' this.divEnd='
' if (is.ns || this.usebuffer) this.divEnd+='
' if (this.border>0) this.divEnd+='
\n' this.divEnd+='
' this.div=this.divStart+this.divEnd } function ScrollWindowResize(nW,nH) { var ml=this.marginL var mr=this.marginR var mt=this.marginT var mb=this.marginB this.w=nW this.h=nH if(!this.activated) this.activate(nW,nH,false) this.lyr.resize(nW,nH); this.screenlyr.resize(nW-2*this.border,nH-2*this.border) if(!this.somethingLoaded) return; if(is.ie && this.usebuffer) { // I donīt know how to resize the layer without setting the bottom value in Ie. // So I set the width and any height, calculate the new ContentHeight and // reclip again. Don't like it but can't see a way around the problem unless someone // know how to partially set the clipping values in Ie this.contentlyr.resize(nW-2*this.border-ml-mr,0) this.activate() } else { // Netscape version this.contentlyr.resize(nW-2*this.border-ml-mr,null) if(this.urlLoaded) this.reload(0); else if(this.content!="") { this.setContent(this.content); this.activate(); } } } function ScrollWindowActivate(w,h) { if (!this.activated) { this.lyr=new DynLayer(this.name) this.screenlyr=new DynLayer(this.name+'Screen') this.blocklyr=new Array() this.blockActive=0 } if (this.inlineBlocks) { DynLayerInit() for (var i=0;i0) this.enableHScroll=(this.offsetWidth>0) this.onScroll() this.onLoad() this.activated=true // This line allows us to detect if the loaded content include a form. // As it is known, when a layer contains a form and it is moved, forms tend to // disappear or misplace. This can be fixed by hiding and showing the layer // Instead of having the user say if there's going to be a form inside, I check // form the document.forms array and set the flag this.hasForms = this.contentlyr.doc.forms.length>0; } function ScrollWindowLoad(url) { this.somethingLoaded = true this.urlLoaded=true; if (url != this.url) { this.historyLoc+=1 this.historyLen=this.historyLoc this.history[this.historyLen]=url } this.reload(0) } function ScrollWindowBack() { if (this.historyLoc>0) this.reload(-1) } function ScrollWindowForward() { if (this.historyLoc' : '' var shade=shadeImg? '
\n' : '' this.css=css(name,x,y,w,h,bgColor,null,null,bg)+ css(name+'Box',0,0,boxW,boxH,boxColor,boxvis)+ css(name+'C',0,0,w,h) if (shadeImg) this.css+=css(name+'Shade',0,0) this.div='
'+shade+'
'+box+'
\n' } } function ScrollBarActivate() { this.lyr=new DynLayer(this.name) this.boxlyr=new DynLayer(this.name+'Box') this.boxlyr.slideInit() this.boxlyr.onSlide=new Function(this.obj+'.onScroll()') this.lyrc=new DynLayer(this.name+'C') this.lyrc.elm.scrollbar=this.obj if (is.ns) this.lyrc.elm.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP) this.lyrc.elm.onmousedown=ScrollBarMouseSDown this.lyrc.elm.onmousemove=ScrollBarMouseSMove this.lyrc.elm.onmouseup=ScrollBarMouseSUp this.lyrc.elm.onmouseover=new Function(this.obj+'.active=true') this.lyrc.elm.onmouseout=ScrollBarMouseSOut } function ScrollBarMouseSDown(e) {eval(this.scrollbar+'.mousedown('+(is.ns?e.layerX:event.offsetX)+','+(is.ns?e.layerY:event.offsetY)+')');return false} function ScrollBarMouseSMove(e) {eval(this.scrollbar+'.mousemove('+(is.ns?e.layerX:event.offsetX)+','+(is.ns?e.layerY:event.offsetY)+')');return false} function ScrollBarMouseSUp(e) {eval(this.scrollbar+'.mouseup()'); return false} function ScrollBarMouseSOut(e) {eval(this.scrollbar+'.mouseout();'+this.scrollbar+'.active=false');return false} function ScrollBarMouseDown(x,y) { this.mouseIsDown=true if (x>this.boxlyr.x && x<=this.boxlyr.x+this.boxlyr.w && y>this.boxlyr.y && y<=this.boxlyr.y+this.boxlyr.h) { this.dragX=x-this.boxlyr.x this.dragY=y-this.boxlyr.y this.dragActive=true } else if (!this.boxlyr.slideActive) { var newx=x-this.boxW/2 var newy=y-this.boxH/2 if (newx<0) newx=0 if (newx>=this.offsetWidth) newx=this.offsetWidth if (newy<0) newy=0 if (newy>=this.offsetHeight) newy=this.offsetHeight this.boxlyr.slideTo(newx,newy,this.inc,this.speed,this.obj+'.finishSlide()') } } function ScrollBarFinishSlide() { if (this.mouseIsDown) { this.dragX=this.boxW/2 this.dragY=this.boxH/2 this.dragActive=true } } function ScrollBarMouseMove(x,y) { if (!this.dragActive || this.boxlyr.slideActive) return var newx=x-this.dragX var newy=y-this.dragY if (x-this.dragX<0) newx=0 if (x-this.dragX>=this.offsetWidth) newx=this.offsetWidth if (y-this.dragY<0) newy=0 if (y-this.dragY>=this.offsetHeight) newy=this.offsetHeight this.boxlyr.moveTo(newx,newy) this.onScroll() } function ScrollBarMouseUp() { this.mouseIsDown=false this.dragActive=false this.boxlyr.slideActive=false if(this.grandPa) this.grandPa.ScrollEnd(); } function ScrollBarMouseOut() { this.mouseIsDown=false this.dragActive=false this.boxlyr.slideActive=false } function ScrollBarGetXfactor() { return 1-(this.offsetWidth-this.boxlyr.x)/this.offsetWidth||0 } function ScrollBarGetYfactor() { return 1-(this.offsetHeight-this.boxlyr.y)/this.offsetHeight||0 } ScrollBar.count=0 function ButtonImage(x,y,w,h) { this.x = x this.y = y this.w = w this.h = h this.name = "ButtonImage"+(ButtonImage.count++) this.obj = this.name+"Object" eval(this.obj+"=this") } {var p = ButtonImage.prototype p.setImages = ButtonImageSetImages p.build = ButtonImageBuild p.activate = ButtonImageActivate p.down = ButtonImageDown p.up = ButtonImageUp p.out = ButtonImageOut p.change = ButtonImageChange p.onDown = new Function() p.onUp = new Function()} function ButtonImageSetImages(off,on,dir) { this.i0 = new Image() this.i = this.i0.src = (dir||'')+off this.i1 = new Image() this.i1.src = (dir||'')+on } function ButtonImageBuild() { with(this) { this.css = css(name,x,y,w,h)+css(name+'C',0,0,w,h) this.div = '
\n' } } function ButtonImageActivate() { this.lyr = new DynLayer(this.name) this.clyr = new DynLayer(this.name+'C') if (is.ns) this.clyr.elm.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP) this.clyr.elm.onmousedown = new Function(this.obj+".down(); return false;") this.clyr.elm.onmouseup = new Function(this.obj+".up(); return false;") this.clyr.elm.onmouseout = new Function(this.obj+".out(); return false;") } function ButtonImageDown() {this.change(this.i1);this.onDown()} function ButtonImageUp() {this.change(this.i0);this.onUp(); if(this.grandPa) this.grandPa.ScrollEnd();} function ButtonImageOut() {this.change(this.i0);this.onUp();} function ButtonImageChange(img) {this.lyr.doc.images[this.name+"Img"].src = img.src} ButtonImage.count = 0
Make your own free website on Tripod.com