home *** CD-ROM | disk | FTP | other *** search
/ PC Online 1999 February / PCO_0299.ISO / filesbbs / w9x / visdhtml.exe / visual / components / scrollbar / scrollbar.js next >
Encoding:
JavaScript  |  1998-03-30  |  11.7 KB  |  318 lines
  1. /**
  2.  * scrollbar.js
  3.  * by gary smith
  4.  * sample code
  5.  * under construction.....
  6.  */
  7.  
  8. function ScrollBar(l) {
  9.     this.cScrollBarLayer = null;
  10.     this.cScrollBarParentLayer = null;
  11.     this.cScrollBarLayout = "vertical";
  12.     this.cScrollBarLeft = 0;
  13.     this.cScrollBarTop = 0;
  14.     this.cScrollBarWidth = null;
  15.     this.cScrollBarHeight = null;
  16.  
  17.     this.cScrollBarShow = cScrollBarShow;
  18.     this.setCScrollBarLayer = setCScrollBarLayer;
  19.     this.setCScrollBarParentLayer = setCScrollBarParentLayer;
  20.     this.setCScrollBarLeft = setCScrollBarLeft;
  21.     this.setCScrollBarTop = setCScrollBarTop;
  22.     this.setCScrollBarWidth = setCScrollBarWidth;
  23.     this.setCScrollBarHeight = setCScrollBarHeight;
  24.  
  25.     this.cScrollBarOnMouseOver = cScrollBarOnMouseOver;
  26.     this.cScrollBarAction = cScrollBarAction;
  27.  
  28.     this.cDrag = cDrag;
  29.     this.cDragStart = cDragStart;
  30.     this.cDragEnd = cDragEnd;
  31.     this.cDragSet = cDragSet;
  32.     this.cDragRestrict = cDragRestrict;
  33. }
  34.  
  35. function cScrollBarShow(l) {
  36.     var l = l || this.cScrollBarLayer;
  37.     this.cScrollBarLayer = l;
  38.     var p = this.cScrollBarParentLayer;
  39.     if (!l.height) {
  40.         java.lang.System.out.println("this.cScrollBarLayer.height=" + l.height);
  41.         //return;
  42.     }
  43.     if (this.cScrollBarLayout == "horizontal") {
  44.         var width = this.cScrollBarWidth || l.clip.width || 100;
  45.         var height = this.cScrollBarHeight || 15;
  46.         var left = this.cScrollBarLeft || l.left || 0;
  47.         var top = this.cScrollBarTop || l.top + l.clip.height || 0;
  48.         java.lang.System.out.println("width=" + width);
  49.         java.lang.System.out.println("height=" + height);
  50.         java.lang.System.out.println("left=" + left);
  51.         java.lang.System.out.println("top=" + top);
  52.  
  53.         var scrollbar = makeLayer("scrollbar", "", p, width,height, left,top, '#DDDDDD');
  54.         var up = makeLayer("up", "", scrollbar, height -1, height -1, 1, 1, '#000000');
  55.         var down = makeLayer("down", "", scrollbar, height -1, height -1, scrollbar.clip.width - height +1, 1, '#000000');
  56.         var scroller = makeLayer("scroller", "", scrollbar, height -1, height -1, height,1, '#000000');
  57.         up.direction = "left";
  58.         down.direction = "right";
  59.  
  60.         var foo1 = (l.width || 1000) / (l.clip.width - (height * 2) ); 
  61.         foo1 = (width / foo1) + 4;
  62.  
  63.         scroller.clip.width = foo1;
  64.         scroller.listener = this.cScrollBarAction;
  65.         scroller.cScrollBarLayer = l;
  66.         this.cDragRestrict("y");
  67.     } else {
  68.         var width = this.cScrollBarWidth || 15;
  69.         var height = this.cScrollBarHeight || l.clip.height || 100;
  70.         var left = this.cScrollBarLeft || l.left + l.clip.width || 0;
  71.         var top = this.cScrollBarTop || l.top || 0;
  72.  
  73.         java.lang.System.out.println("width=" + width);
  74.         java.lang.System.out.println("height=" + height);
  75.         java.lang.System.out.println("left=" + left);
  76.         java.lang.System.out.println("top=" + top);
  77.  
  78.         var scrollbar = makeLayer("scrollbar", "", p, width,height, left,top, '#DDDDDD');
  79.         var up = makeLayer("up", "", scrollbar, width -1, width -1, 1, 1, '#000000');
  80.         var down = makeLayer("down", "", scrollbar, width -1, width, 1, scrollbar.clip.height - width, '#000000');
  81.         var scroller = makeLayer("scroller", "", scrollbar, width -1,width -1, 1,width, '#000000');
  82.         up.direction = "up";
  83.         down.direction = "down";
  84.  
  85.         java.lang.System.out.println("width=" + width);
  86.         java.lang.System.out.println("h=" + l.height);
  87.         java.lang.System.out.println("ch=" + l.clip.height);
  88.  
  89.         var foo1 = (l.height || 3000) / (l.clip.height - (width * 2) ); 
  90.         java.lang.System.out.println("foo1=" + foo1);
  91.         foo1 = (height / foo1) + 4;
  92.         java.lang.System.out.println("foo1=" + foo1);
  93.         //foo1 = l.height / foo1;
  94.         //java.lang.System.out.println("foo1=" + foo1);
  95.         //var foo1 = 30;
  96.  
  97.         scroller.clip.height = foo1;
  98.         scroller.listener = this.cScrollBarAction;
  99.         scroller.cScrollBarLayer = l;
  100.         this.cDragRestrict("x");
  101.     }
  102.        
  103.     up.lite  = makeLayer("up", "", up, up.clip.width -1, up.clip.height -1, 0,0, '#FFFFFF');
  104.     up.dark  = makeLayer("up", "", up, up.clip.width -2, up.clip.height -2, 1,1, '#666666');
  105.     up.shade = makeLayer("up", "", up, up.clip.width -3, up.clip.height -3, 1,1, '#CCCCCC');
  106.     up.value = makeLayer("up", "", up, up.clip.width -4, up.clip.height -4, 2,2, '#C1CDCD');
  107.     up.value.captureEvents(Event.MOUSEUP|Event.MOUSEDOWN|Event.MOUSEDRAG);
  108.     up.value.onmousedown = this.cScrollBarAction;
  109.     ////up.value.onmouseup=this.cScrollBarDirection;
  110.     up.value.cScrollBarLayer = l;
  111.     up.value.direction = up.direction;
  112.  
  113.     down.lite  = makeLayer("down", "", down, down.clip.width -1, down.clip.height -1, 0,0, '#FFFFFF');
  114.     down.dark  = makeLayer("down", "", down, down.clip.width -2, down.clip.height -2, 1,1, '#666666');
  115.     down.shade = makeLayer("down", "", down, down.clip.width -3, down.clip.height -3, 1,1, '#CCCCCC');
  116.     down.value = makeLayer("down", "", down, down.clip.width -4, down.clip.height -4, 2,2, '#C1CDCD');
  117.     down.value.captureEvents(Event.MOUSEUP|Event.MOUSEDOWN|Event.MOUSEDRAG);
  118.     down.value.onmousedown=this.cScrollBarAction;
  119.     down.value.cScrollBarLayer = l;
  120.     down.value.direction = down.direction;
  121.  
  122.     //scroller.watch("top", this.cScrollBarAction);        
  123.     scroller.lite  = makeLayer("scroller", "", scroller, scroller.clip.width -1, scroller.clip.height -1, 0,0, '#FFFFFF');
  124.     scroller.dark  = makeLayer("scroller", "", scroller, scroller.clip.width -2, scroller.clip.height -2, 1,1, '#666666');
  125.     scroller.shade = makeLayer("scroller", "", scroller, scroller.clip.width -3, scroller.clip.height -3, 1,1, '#CCCCCC');
  126.     scroller.value = makeLayer("scroller", "", scroller, scroller.clip.width -4, scroller.clip.height -4, 2,2, '#C1CDCD');
  127.     scroller.value.that = this;
  128.     scroller.value.cDragSet = this.cDragSet;
  129.     scroller.value.onmouseover = this.cScrollBarOnMouseOver;
  130.     //scroller.value.onFocus = this.onDialogButton;
  131. }
  132.  
  133. function cScrollBarAction(e,x,y) {
  134. //    java.lang.System.out.println("top=" + this.cScrollBarLayer.top)
  135. //    java.lang.System.out.println("width=" + this.cScrollBarLayer.width);
  136. //    java.lang.System.out.println("height=" + this.cScrollBarLayer.height);
  137. //    java.lang.System.out.println("clip.height=" + this.cScrollBarLayer.clip.height);
  138.  
  139.     var l = this.cScrollBarLayer;
  140.     if (x) {
  141.         l.left += -x;
  142.         l.clip.left += x;
  143.         l.clip.right += x;
  144.     } else if (y) {
  145.         var foo1 = (l.height || 3000) / l.clip.height; 
  146.         if(foo1) y *= foo1;
  147.         l.top += -y;
  148.         l.clip.top += y;
  149.         l.clip.bottom += y;
  150.     } else if (this.direction == "up") {
  151.         l.top += 5;
  152.         l.clip.top += -5;
  153.         l.clip.bottom += -5;
  154.     } else if (this.direction == "down") {
  155.         l.top += -5;
  156.         l.clip.top += 5;
  157.         l.clip.bottom += 5;
  158.     } else if (this.direction == "right") {
  159.         l.left += -5;
  160.         l.clip.left += 5;
  161.         l.clip.right += 5;
  162.     } else if (this.direction == "left") {
  163.         l.left += 5;
  164.         l.clip.left += -5;
  165.         l.clip.right += -5;
  166.     } else {
  167.         java.lang.System.out.println("scroll direction=" + this.direction)
  168.     }
  169. }
  170.  
  171. function setCScrollBarLayer(l) {
  172.     this.cScrollBarLayer = l;
  173. }
  174. function setCScrollBarParentLayer(l) {
  175.     this.cScrollBarParentLayer = l;
  176. }
  177. function setCScrollBarLeft(i) {
  178.     this.cScrollBarLeft = i;
  179. }
  180. function setCScrollBarTop(i) {
  181.     this.cScrollBarTop = i;
  182. }
  183. function setCScrollBarWidth(i) {
  184.     this.cScrollBarWidth = i;
  185. }
  186. function setCScrollBarHeight(i) {
  187.     this.cScrollBarHeight = i;
  188. }
  189.  
  190. function cScrollBarOnMouseOver() {
  191.     this.cDragSet(this);
  192. }
  193.  
  194.  
  195.  
  196. function cDragSet(l) {
  197.     cDragObj = l.that;
  198.     cDragObj.cDragLayer = l.cDragLayer || l.parentLayer || l;
  199.     cDragObj.cDragLayer.captureEvents(Event.MOUSEUP|Event.MOUSEDOWN|Event.MOUSEDRAG);
  200.     cDragObj.cDragLayer.onmousedown=cDragStart;
  201.     cDragObj.cDragLayer.onmouseup=cDragEnd;
  202. }
  203.  
  204. function cDragRestrict(direction) {
  205.     this.cDragDirection = direction;
  206. }
  207.  
  208. function cDrag(e) {
  209.     var x = window.innerWidth;
  210.     var y = window.innerHeight;
  211.     if(e.pageX > -5 && e.pageY > -5 && e.pageX < x && e.pageY < y) {
  212.         //cDragObj.cDragLayer.moveBy(e.pageX-cDragObj.offX,e.pageY-cDragObj.offY);
  213.         x = e.pageX-cDragObj.offX;
  214.         y = e.pageY-cDragObj.offY;
  215.         if (cDragObj.cDragDirection == "x")
  216.             x = null;
  217.         if (cDragObj.cDragDirection == "y")
  218.             y = null;
  219.         cDragObj.cDragLayer.moveBy(x,y);
  220.         if (cDragObj.cDragLayer.listener)
  221.             cDragObj.cDragLayer.listener(e,x,y);
  222.     } else {
  223.         if(cDragObj.cDragLayer.that.dialogMorph) { 
  224.             cDragEnd(e);
  225.             dialogWinMorph(e, this);
  226.         }
  227.     }
  228.     cDragObj.offX = e.pageX;
  229.     cDragObj.offY = e.pageY;
  230.     cDragObj.dragged = true;
  231. }
  232.  
  233. function dialogWinMorph(e, l) {
  234.     //java.lang.System.out.println("value=" + l.that.dialogContent);
  235.     //java.lang.System.out.println("l.pageX=" + l.pageX);
  236.     if(!l.that) return;
  237.     if(!window.dialogWinMorphs) 
  238.         window.dialogWinMorphs = new Array();
  239.     java.lang.System.out.println("len=" + window.dialogWinMorphs.length);
  240.     l.that.win.base.visibility = "hide";
  241.     //if(!l.that.dialogMorphWin) l.that.dialogMorphWin = {};
  242.     //if(!l.that.dialogMorphWin.close) {
  243.         var width = l.that.dialogWidth +20;
  244.         var height = l.that.dialogHeight +20;
  245.         var y = l.pageY + window.screenY + window.outerHeight - window.innerHeight -20;
  246.         if(l.pageX > 0) 
  247.             var x = window.screenX + window.outerWidth;
  248.         else
  249.             var x = window.screenX - 100;
  250.         var id = window.dialogWinMorphs.length;
  251.         var win = window.open("",'win' + id,'outerWidth='+ width +',outerHeight='+ height +',left='+ x +',top='+ y);
  252.         win.document.open("text/html");
  253.         win.document.writeln('<BODY BGCOLOR="'+ l.that.dialogBgColor +'">');
  254.         win.document.writeln('<TITLE>'+ l.that.dialogTitle +'</TITLE>');
  255.         win.document.writeln(l.that.dialogContent +'</BODY>');
  256.         win.document.close();
  257.         NdialogLabel = null;
  258.         if(window.dev) 
  259.             win.dev = window.dev;
  260.         win.focus();
  261.         window.dialogWinMorphs[l.that.dialogTitle] = win;
  262.         window.dialogWinMorphs[id] = win;
  263.     //}
  264. }
  265.  
  266. function cDragStart(e) {
  267.     //java.lang.System.out.println("this=" + this);
  268.     cDragObj.cDragLayer.captureEvents(Event.MOUSEMOVE);
  269.     cDragObj.cDragLayer.onmousemove=cDrag; 
  270.     cDragObj.offX=e.pageX;
  271.     cDragObj.offY=e.pageY;
  272. }
  273.  
  274. function cDragEnd(e) {
  275.     cDragObj.cDragLayer.onmousemove=0;
  276.     if(cDragObj.dragged == true) {
  277.         if(cDragObj.refresh) {
  278.             cDragObj.cDragLayer.visibility="hide"; 
  279.             setTimeout('if(cDragObj.cDragLayer) cDragObj.cDragLayer.visibility="inherit";',1);
  280.         }
  281.         cDragObj.cDragLayer.releaseEvents(Event.MOUSEDOWN|Event.MOUSEUP|Event.MOUSEMOVE|Event.MOUSEDRAG);
  282.         cDragObj.dragged = false;
  283.         if(e.pageY < 0) 
  284.             cDragObj.cDragLayer.top = -5;
  285.         //if(e.pageX > window.width) cDragObj.cDragLayer.top = window.width -20;
  286.     }
  287. }
  288.  
  289.  
  290. function makeLayer(label, content, parentLyr, width, height, x, y, color, viso) {
  291.     if (!content)
  292.         content = " "; // 
  293.     if (parentLyr)
  294.         var l = new Layer(width || 0, parentLyr);
  295.     else
  296.         var l = new Layer(width || 0);
  297.     l.document.ids.font14.fontSize = 14;
  298.     l.document.ids.sysFont.fontSize = 12;
  299.     l.document.ids.sysFont.fontFamily = "Arial, Espy, sans-serif";
  300.     l.document.open("text/html");
  301.     l.document.writeln(content);
  302.     l.document.close();
  303.     l.label = label;
  304.     if (x)
  305.         l.left += x;
  306.     if (y)
  307.         l.top += y;
  308.     if (color)
  309.         l.bgColor = color;
  310.     if (width)
  311.         l.clip.width = width;
  312.     if (height)
  313.         l.clip.height = height;
  314.     if (!viso)
  315.         l.visibility = "inherit";
  316.     return l;
  317. }
  318.