home *** CD-ROM | disk | FTP | other *** search
/ PC Online 1999 February / PCO_0299.ISO / filesbbs / w9x / visdhtml.exe / visual / components / button / button.js next >
Encoding:
JavaScript  |  1998-03-30  |  8.0 KB  |  268 lines
  1. /**
  2.  * button.js 
  3.  * author: gary smith 15 Nov 97
  4.  * @see: dialog.js
  5.  * modified: 30 Nov 97 
  6.  * for sample code (still under construction)
  7.  */
  8.  
  9. /**
  10.  * Constructs a Button object 
  11.  */
  12.  
  13. function Button() {
  14.     this.buttonValue = "Button";
  15.     this.buttonAction = "";
  16.     this.buttonPageX = 0;
  17.     this.buttonPageY = 0;
  18.     this.buttonWidth = 0;
  19.     this.buttonHeight = 0;
  20.     this.buttonColor = "#CDB79E";
  21.     this.buttonHeightColor = "#999999";
  22.     this.buttonWrap = false;
  23.     this.buttonParentLayer = null;
  24.  
  25.     //methods
  26.     this.showButton = showButton;
  27.     this.exampleButton = exampleButton;
  28.     this.setButtonValue = setButtonValue; 
  29.     this.setButtonAction = setButtonAction; 
  30.     this.setButtonPageX  = setButtonPageX;
  31.     this.setButtonPageY  = setButtonPageY;
  32.     this.setButtonWidth  = setButtonWidth;
  33.     this.setButtonHeight = setButtonHeight;
  34.     this.setButtonColor  = setButtonColor;
  35.     this.setButtonWrap   = setButtonWrap;
  36.     this.setButtonParentLayer = setButtonParentLayer;
  37.  
  38.     //button methods
  39.     this.onButton = onButton;
  40.     this.onButton_MouseOver = onButton_MouseOver;
  41.     this.onButton_MouseOut = onButton_MouseOut;
  42.  
  43.     this.DragButton = DragButton;
  44.     this.startDragButton = startDragButton;
  45.     this.endDragButton = endDragButton;
  46.     this.setDragButton = setDragButton;
  47.     this.nsButtonObject = nsButtonObject;
  48.     this.nsButtonObject();
  49. }
  50. function showButton() {
  51.     var label = this.buttonValue;
  52.     var value = '<NOBR> '+ this.buttonValue +' </NOBR>';
  53.     if(this.buttonWrap) 
  54.         value = this.buttonValue;
  55.     var l = makeLayer(label, value, this.buttonParentLayer, this.buttonWidth,this.buttonHeight, this.buttonPageX,this.buttonPageY, '#000000', "hide");
  56.     l.clip.width += 4;
  57.     l.clip.height += 4;
  58.     l.lite  = makeLayer(label, "", l, l.clip.width -1, l.clip.height -1, 0,0, '#FFFFFF');
  59.     l.dark  = makeLayer(label, "", l, l.clip.width -2, l.clip.height -2, 1,1, '#666666');
  60.     l.shade = makeLayer(label, "", l, l.clip.width -3, l.clip.height -3, 1,1, '#CCCCCC');
  61.     l.main = makeLayer(label, value, l, l.clip.width -4, l.clip.height -4, 2,2, this.buttonColor);
  62.     if(!this.buttonFocusValue) 
  63.         this.buttonFocusValue = '<FONT COLOR="white">'+ value +'</FONT>';
  64.     l.hilite = makeLayer(label, this.buttonFocusValue, l, l.clip.width -4, l.clip.height -4, 2,2, this.buttonHeightColor, "hide");
  65.     l.focus = makeLayer(label, "", l, l.clip.width -4, l.clip.height -4, 2,2);
  66.     l.visibility = "inherit";
  67.     l.focus.focus = true;
  68.     l.main.saveBgColor = this.buttonColor;
  69.     l.hilite.saveBgColor = this.buttonHiliteColor;
  70.     l.main.onMouseOver = this.onButton_MouseOver;
  71.     l.focus.onMouseOver = this.onButton_MouseOver;
  72.     l.focus.onMouseOut  =  this.onButton_MouseOut;
  73.     l.hilite.onMouseOut =  this.onButton_MouseOut;
  74.     l.focus.onFocus     = this.onButton;
  75.     l.hilite.onFocus    = this.onButton;
  76.     l.focus.buttonAction = this.buttonAction;
  77.     l.hilite.buttonAction = this.buttonAction;
  78.     l.that = this;
  79.     //return l;
  80.     this.l = l;
  81. }
  82.  
  83. function onButton(e) {
  84.     if(this.focus) {
  85.         this.parentLayer.hilite.visibility = "hide";
  86.         this.visibility = "hide";
  87.     } else {
  88.         this.parentLayer.focus.visibility = "inherit";
  89.         this.visibility = "hide";
  90.     }
  91.     eval( this.buttonAction );
  92.     window.NbuttonLabel = null;
  93.     //this.bgColor=this.color;
  94. }
  95.  
  96. function onButton_MouseOver(e) {
  97.     //this.bgColor='#0000CD';
  98.     this.parentLayer.hilite.visibility = "inherit";
  99. }
  100.  
  101. function onButton_MouseOut(e) {
  102.     if(this.focus)
  103.         this.parentLayer.hilite.visibility = "hide";
  104.     else
  105.         this.visibility = "hide";
  106. }
  107.  
  108. function setButtonValue(str) { 
  109.     this.buttonValue = str; 
  110. }
  111.  
  112. function setButtonFocusValue(str) { 
  113.     this.buttonFocusValue = str; 
  114. }
  115.  
  116. function setButtonAction(str) { 
  117.     this.buttonAction = str; 
  118. }
  119.  
  120. function setButtonPageX(i) {
  121.     this.buttonPageX = i; 
  122. }
  123.  
  124. function setButtonPageY(i) {
  125.     this.buttonPageY = i; 
  126. }
  127.  
  128. function setButtonWidth(i) {
  129.     this.buttonWidth = i; 
  130. }
  131.  
  132. function setButtonHeight(i) {
  133.     this.buttonHeight = i; 
  134. }
  135.  
  136. function setButtonColor(str) {
  137.     this.buttonColor = str; 
  138. }
  139.  
  140. function setButtonHeightColor(str) {
  141.     this.buttonHeightColor = str; 
  142. }
  143.  
  144. function setButtonWrap(boo) {
  145.     this.buttonWrap = boo; 
  146. }
  147.  
  148. function setButtonParentLayer(str) {
  149.     this.buttonParentLayer = str; 
  150. }
  151.  
  152. function setDragButton(l) {
  153.     d = this;
  154.     d.dragLayer = l.dragLayer;
  155.     d.captureEvents(Event.MOUSEUP|Event.MOUSEDOWN|Event.MOUSEDRAG);
  156.     d.onmousedown=startDragButton;
  157.     d.onmouseup=endDragButton;
  158. }
  159. function DragButton(e) {
  160.     //java.lang.System.out.println(e.pageX +" - "+ window.innerWidth);
  161.     if(e.pageX > -5 && e.pageY > -5 && e.pageX < window.innerWidth && e.pageY < window.innerHeight) {
  162.         d.dragLayer.moveBy(e.pageX-d.offX,e.pageY-d.offY);
  163.     } else {
  164.         windowMetamorph(e, this);
  165.     }
  166.     d.offX = e.pageX;
  167.     d.offY = e.pageY;
  168.     d.dragged = true;
  169. }
  170.  
  171. function windowMetamorph(e, l) {
  172.     //under construction
  173.     //java.lang.System.out.println("e.pageY=" + e.pageY);
  174.     //java.lang.System.out.println("value=" + l.that.buttonValue);
  175.     if(!window.morphWin) 
  176.         window.morphWin = {};
  177.     if(!window.morphWin.close) {
  178.          var width = l.that.buttonWidth;
  179.          var height = l.that.buttonHeight;
  180.          var x = window.screenX -100;
  181.          var y = l.pageY + window.screenY + window.outerHeight - window.innerHeight -20;
  182.          window.morphWin = window.open("",'morph','outerWidth='+ width +',outerHeight='+ height +',left='+ x +',top='+ y);
  183.          window.morphWin.document.open("text/html");
  184.          window.morphWin.document.writeln(l.that.buttonValue);
  185.          window.morphWin.document.close();
  186.          //e.that.buttonValue;
  187.     }
  188. }
  189.  
  190. function startDragButton(e) {
  191.     //java.lang.System.out.println("this=" + this);
  192.     d.dragLayer.captureEvents(Event.MOUSEMOVE);
  193.     d.dragLayer.onmousemove=DragButton; 
  194.     d.offX=e.pageX;
  195.     d.offY=e.pageY;
  196. }
  197. function endDragButton(e) {
  198.     d.dragLayer.onmousemove=0;
  199.     if(d.dragged == true) {
  200.         d.dragLayer.visibility="hide"; 
  201.         setTimeout('if(d.dragLayer) d.dragLayer.visibility="inherit";',1);
  202.         d.dragLayer.releaseEvents(Event.MOUSEDOWN|Event.MOUSEUP|Event.MOUSEMOVE|Event.MOUSEDRAG);
  203.         d.dragged = false;
  204.         if(e.pageY < 0) 
  205.             d.dragLayer.top = -5;
  206.         //if(e.pageX > window.width) d.dragLayer.top = window.width -20;
  207.     }
  208. }
  209.  
  210. function nsButtonObject() {
  211.     if(!window.nsButtonObjects) {
  212.         window.nsButtonObjects = new Array();
  213.         window.nsButtonObjects[0] = this;
  214.     } else {
  215.         window.nsButtonObjects[window.nsButtonObjects.length++] = this;
  216.     }
  217. }
  218.  
  219. function resetButton(e) {
  220.     for(var i=0; i < window.nsButtonObjects.length; i++) {
  221.         if(window.nsButtonObjects[i].that) 
  222.             window.nsButtonObjects[i].openButton();
  223.     }
  224. }
  225.  
  226. function exampleButton(str) {
  227.     var sample = (str || 'Change document bgColor!');
  228.     var myButton = new Button();
  229.     //var myLayer = makeLayer('id', "<BR>testing.........<P>testing<P>", null, 0,0, 1,1, 'green');
  230.     //myButton.setButtonParentLayer(myLayer);
  231.     myButton.setButtonValue(sample);
  232.     myButton.setButtonAction('window.document.bgColor="red";');
  233.     myButton.setButtonPageX(10);
  234.     myButton.setButtonPageY(10);
  235.     //myButton.setButtonWidth(200);
  236.     //myButton.setButtonHeight();
  237.     //myButton.setButtonColor('red');
  238.     //myButton.setButtonWrap(true);
  239.     myButton.showButton();
  240. }
  241.  
  242. function makeLayer(label, content, parentLyr, width, height, x, y, color, viso) {
  243.     //java.lang.System.out.println(""+ parentLyr);
  244.     if(!content) 
  245.         content = " ";
  246.     if(parentLyr) 
  247.         var l = new Layer(width, parentLyr);
  248.     else 
  249.         var l = new Layer(width);
  250.     l.document.ids.font14.fontSize = 14;
  251.     l.document.ids.sysFont.fontSize = 12;
  252.     l.document.ids.sysFont.fontFamily = "Arial, Espy, sans-serif";
  253.     l.document.open("text/html");
  254.     l.document.writeln(content);
  255.     l.document.close();
  256.     l.label = label;
  257.     l.moveTo(x,y);
  258.     if(color) 
  259.         l.bgColor = color;
  260.     if(width)
  261.         l.clip.width = width;
  262.     if(height) 
  263.         l.clip.height = height;
  264.     if(!viso) 
  265.         l.visibility = "inherit";
  266.     return l;
  267. }
  268.