您需要先安装一个扩展,例如 篡改猴、Greasemonkey 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 Userscripts ,之后才能安装此脚本。
您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。
您需要先安装用户脚本管理器扩展后才能安装此脚本。
Encapulates and extends many HTML forms elements.
当前为
此脚本不应直接安装。它是供其他脚本使用的外部库,要使用该库请加入元指令 // @require https://update.cn-greasyfork.org/scripts/418/1300/JS%20Forms%20Library%20B.js
// ==UserScript== // @name JS Forms Library B // @namespace MerricksdadJSFormsLibraryB // @description Encapulates and extends many HTML forms elements. // @license http://creativecommons.org/licenses/by-nc-nd/3.0/us/ // @include file:///C:/Users/Charlie/Desktop/* // @version 0.0.0.12 // @copyright Charlie Ewing except where noted // ==/UserScript== //this script requires some functions in the WM Common Library //this script needs access to a pre-defined JSON object (function() { var sandbox=this; //element helper functions sandbox.elementOuterWidth=function(e){ return parseInt(e.offsetWidth||0); }; sandbox.elementOuterHeight=function(e){ return parseInt(e.offsetHeight||0); }; sandbox.elementInnerWidth=function(e){ var curWidth = e.style.width; e.style.width="0"; var difference = elementOuterWidth(e); e.style.width=curWidth; return elementOuterWidth(e)-difference; }; sandbox.elementInnerHeight=function(e){ var curHeight = e.style.height; e.style.height="0"; var difference = elementOuterHeight(e); e.style.height=curHeight; return elementOuterHeight(e)-difference; }; //forms library B sandbox.jsForms = { colorData:{ webSafe:[], system:["ActiveBorder","ActiveCaption","ActiveCaptionText","AppWorkspace","ButtonFace","ButtonHighlight","ButtonShadow","Control","ControlDark","ControlDarkDark","ControlLight","ControlLightLight","ControlText","Desktop","GradientActiveCaption","GradientInactiveCaption","GrayText","Highlight","HighlightText","HotTrack","InactiveBorder","InactiveCaption","InactiveCaptionText","Info","InfoText","Menu","MenuBar","MenuHighlight","MenuText","ScrollBar","Transparent","Window","WindowFrame","WindowText"], colorWords:["AliceBlue","AntiqueWhite","Aqua","Aquamarine","Azure","Beige","Bisque","Black","BlanchedAlmond","Blue","BlueViolet","Brown","BurlyWood","CadetBlue","Chartreuse","Chocolate","Coral","CornflowerBlue","Cornsilk","Crimson","Cyan","DarkBlue","DarkCyan","DarkGoldenrod","DarkGray","DarkGreen","DarkKhaki","DarkMagenta","DarkOliveGreen","DarkOrange","DarkOrchid","DarkRed","DarkSalmon","DarkSeaGreen","DarkSlateBlue","DarkSlateGray","DarkTurquoise","DarkViolet","DeepPink","DeepSkyBlue","DimGray","DodgerBlue","Firebrick","FloralWhite","ForestGreen","Fuchsia","Gainsboro","GhostWhite","Gold","Goldenrod","Gray","Green","GreenYellow","Honeydew","HotPink","IndianRed","Indigo","Ivory","Khaki","Lavender","LavenderBlush","LawnGreen","LemonChiffon","LightBlue","LightCoral","LightCyan","LightGoldenrodYellow","LightGray","LightGreen","LightPink","LightSalmon","LightSeaGreen","LightSkyBlue","LightSlateGray","LightSteelBlue","LightYellow","Lime","LimeGreen","Linen","Magenta","Maroon","MediumAquamarine","MediumBlue","MediumOrchid","MediumPurple","MediumSeaGreen","MediumSlateBlue","MediumSpringGreen","MediumTurquoise","MediumVioletRed","MidnightBlue","MintCream","MistyRose","Moccasin","NavajoWhite","Navy","OldLace","Olive","OliveDrab","Orange","OrangeRed","Orchid","PaleGoldenrod","PaleGreen","PaleTurquoise","PaleVioletRed","PapayaWhip","PeachPuff","Peru","Pink","Plum","PowderBlue","Purple","Red","RosyBrown","RoyalBlue","SaddleBrown","Salmon","SandyBrown","SeaGreen","SeaShell","Sienna","Silver","SkyBlue","SlateBlue","SlateGray","Snow","SpringGreen","SteelBlue","Tan","Teal","Thistle","Tomato","Turquoise","Violet","Wheat","White","WhiteSmoke","Yellow","YellowGreen"], custom:[ {name:"Attribute",value:"rgba(255, 0, 0, 0.75)"}, {name:"BlueWindow",value:"rgba(156, 246, 255, 0.75)"}, {name:"Bookmark",value:"rgba(191, 210, 249, 0.75)"}, {name:"BookmarkText",value:"rgba(128, 128, 128, 0.75)"}, {name:"Breakpoint",value:"rgba(150, 58, 70, 0.75)"}, {name:"BreakpointText",value:"rgba(255, 219, 163, 0.75)"}, {name:"BrownText",value:"rgba(88, 60, 31, 0.75)"}, {name:"Buy",value:"rgba(83, 196, 251, 0.75)"}, {name:"Caret",value:"rgba(128, 0, 255, 0.75)"}, {name:"CDATA",value:"rgba(255, 128, 0, 0.75)"}, {name:"Close",value:"rgba(195, 70, 58, 0.75)"}, {name:"Comment",value:"rgba(0, 100, 0, 0.75)"}, {name:"CurrentLine",value:"rgba(232, 232, 232, 0.75)"}, {name:"Experimental",value:"rgba(156, 244, 156, 0.75)"}, {name:"GoTo",value:"rgba(102, 204, 51, 0.75)"}, {name:"GreenWindow",value:"rgba(207, 255, 180, 0.75)"}, {name:"Hint",value:"rgba(174, 129, 235, 0.75)"}, {name:"ID",value:"rgba(0, 128, 255, 0.75)"}, {name:"InactiveSelected",value:"rgba(191, 205, 219, 0.75)"}, {name:"InactiveSelectedText",value:"rgba(67, 78, 84, 0.75)"}, {name:"ItemDone",value:"#91FF91"}, {name:"ItemFailed",value:"#FF7171"}, {name:"ItemProcessing",value:"#FFFF7D"}, {name:"Keyword",value:"rgba(0, 0, 255, 0.75)"}, {name:"LineNumber",value:"rgba(43, 145, 175, 0.75)"}, {name:"Number",value:"rgba(255, 0, 0, 0.75)"}, {name:"PRE",value:"rgba(246, 246, 242, 0.75)"}, {name:"QuoteText",value:"rgba(85, 85, 85, 0.75)"}, {name:"Regex",value:"rgba(128, 0, 255, 0.75)"}, {name:"SelectedText",value:"rgba(192, 192, 192, 0.75)"}, {name:"SmartHightlighting",value:"rgba(0, 255, 0, 0.75)"}, {name:"String",value:"rgba(163, 21, 21, 0.75)"}, {name:"Tag",value:"rgba(0, 0, 255, 0.75)"}, {name:"TanWindow",value:"rgba(255, 233, 180, 0.75)"}, {name:"TrackChange",value:"rgba(108, 226, 108, 0.75)"}, {name:"Unsaved",value:"rgba(255, 238, 98, 0.75)"}, {name:"Value",value:"rgba(0, 0, 0, 0.75)"} ] }, globalStyle:function(){ //control element styles return ".jsfButton {"+ //"display: block;"+ "width: 17px;"+ "border: 1px solid buttonshadow;"+ "border-radius: 15%;"+ "padding: 0px;"+ "line-height: 0;"+ "font-size: 16px;"+ "box-shadow: 0 5px 10px buttonhighlight inset, 0 3px 10px buttonhighlight inset,0 -5px 10px buttonshadow inset, 1px 1px 0 buttonhighlight inset, -1px -1px 0 buttonhighlight inset;"+ "vertical-align: middle;"+ "background-color: buttonface;"+ "position:relative;"+ "}\n"+ ".jsfButton:hover {"+ "border: 1px solid highlight;"+ "box-shadow: 0 5px 10px buttonhighlight inset, 0 3px 10px buttonhighlight inset,0 -3px 10px highlight inset, 1px 1px 0 buttonhighlight inset, -1px -1px 0 buttonhighlight inset;"+ "}\n"+ ".jsfButton>span {position:absolute;}\n"+ //tab styles ".jsfTabControl>.tabs {display:block;}\n"+ ".jsfTabControl>.pages {overflow:auto; display:block; padding:3px; border-radius: 0 5px 5px 5px; border: 1px solid; z-index:1; position:relative; top:-1px; background-color:buttonface; padding:5px;}\n"+ ".jsfTabControl>.pages>div {display:block; height:100%;}\n"+ ".jsfTab {z-index:0; top:2px; background-color:buttonshadow; display:inline-block;border:1px solid; border-bottom:none; border-radius:5px 5px 0 0; padding: 4px 8px; position:relative;}\n"+ ".jsfTab.selected {z-index:999; top:0; background-color:buttonface;}\n"+ ".jsfTab>img {vertical-align:middle; width:16px; height:16px; padding-right:4px; display:inline-block;}\n"+ ".jsfTab>div {vertical-align:middle; display:inline-block;}\n"+ //left side tabs variant ".jsfTabControl.alignLeft>.tabs {display:inline-block; vertical-align:top;}\n"+ ".jsfTabControl.alignLeft>.pages {display:inline-block; vertical-align:top; left:-1px; top:0;}\n"+ ".jsfTabControl.alignLeft>.tabs>.jsfTab {border-radius:5px 0 0 5px; border:1px solid; border-right:none; display:block; left:2px; top:0;}\n"+ ".jsfTabControl.alignLeft>.tabs>.jsfTab.selected {left:0;}\n"+ ".jsfTabControl.alignLeft>.tabs>.jsfTab>img {}\n"+ ".jsfTabControl.alignLeft>.tabs>.jsfTab>div {}\n"+ //right side tabs variant ".jsfTabControl.alignRight>.tabs {display:inline-block; vertical-align:top;}\n"+ ".jsfTabControl.alignRight>.pages {display:inline-block; vertical-align:top; right:-1px; top:0; border-radius:5px 0 5px 5px;}\n"+ ".jsfTabControl.alignRight>.tabs>.jsfTab {border-radius:0 5px 5px 0; border:1px solid; border-left:none; display:block; right:2px; top:0;}\n"+ ".jsfTabControl.alignRight>.tabs>.jsfTab.selected {right:0;}\n"+ ".jsfTabControl.alignRight>.tabs>.jsfTab>img {}\n"+ ".jsfTabControl.alignRight>.tabs>.jsfTab>div {}\n"+ //bottom tabs variant ".jsfTabControl.alignBottom>.tabs {}\n"+ ".jsfTabControl.alignBottom>.pages {border-radius:5px 5px 5px 0; top:1px;}\n"+ ".jsfTabControl.alignBottom>.tabs>.jsfTab {border:1px solid; border-top:none; border-radius:0 0 5px 5px; top:-2px;}\n"+ ".jsfTabControl.alignBottom>.tabs>.jsfTab.selected {top:0;}\n"+ ".jsfTabControl.alignBottom>.tabs>.jsfTab>img {}\n"+ ".jsfTabControl.alignBottom>.tabs>.jsfTab>div {}\n"+ //coolbar top variant ".jsfTabControl.coolBar>.tabs {background-color:window;}\n"+ ".jsfTabControl.coolBar>.pages {top:0; border-radius:0; border:none; border-top:solid 1px windowframe; box-shadow:inset 0 1px buttonhighlight; padding: 15px 11px;}\n"+ ".jsfTabControl.coolBar>.tabs>.jsfTab {margin-left:2px; top:0px; background-color:transparent; border-radius:0; border:none; text-align:center;}\n"+ ".jsfTabControl.coolBar>.tabs>.jsfTab:first-child {margin-left:11px;}\n"+ ".jsfTabControl.coolBar>.tabs>.jsfTab.selected {background-color:activecaption;}\n"+ ".jsfTabControl.coolBar.hotTrack>.tabs>.jsfTab.selected:hover {background-color:activecaption;}\n"+ ".jsfTabControl.coolBar>.tabs>.jsfTab>img {width:32px; height:32px; padding-right:0px;}\n"+ ".jsfTabControl.coolBar>.tabs>.jsfTab>div {display:block; padding-top:5px;}\n"+ //coolbar left variant ".jsfTabControl.coolBar.alignLeft>.tabs {}\n"+ ".jsfTabControl.coolBar.alignLeft>.pages {left:0; border:none; border-left:solid 1px windowframe; box-shadow:inset 1px 0 buttonhighlight;}\n"+ ".jsfTabControl.coolBar.alignLeft>.tabs>.jsfTab {left:0px; margin-left:0px; margin-top:2px;}\n"+ ".jsfTabControl.coolBar.alignLeft>.tabs>.jsfTab:first-child {margin-left:0px; margin-top:11px;}\n"+ ".jsfTabControl.coolBar.alignLeft>.tabs>.jsfTab.selected {}\n"+ ".jsfTabControl.coolBar.alignLeft>.tabs>.jsfTab>img {}\n"+ ".jsfTabControl.coolBar.alignLeft>.tabs>.jsfTab>div {}\n"+ //coolbar right variant ".jsfTabControl.coolBar.alignRight>.tabs {}\n"+ ".jsfTabControl.coolBar.alignRight>.pages {left:0; border:none; border-right:solid 1px windowframe; box-shadow:inset -1px 0 buttonhighlight;}\n"+ ".jsfTabControl.coolBar.alignRight>.tabs>.jsfTab {left:0px; margin-left:0px; margin-top:2px;}\n"+ ".jsfTabControl.coolBar.alignRight>.tabs>.jsfTab:first-child {margin-left:0px; margin-top:11px;}\n"+ ".jsfTabControl.coolBar.alignRight>.tabs>.jsfTab.selected {}\n"+ ".jsfTabControl.coolBar.alignRight>.tabs>.jsfTab>img {}\n"+ ".jsfTabControl.coolBar.alignRight>.tabs>.jsfTab>div {}\n"+ //coolbar bottom variant ".jsfTabControl.coolBar.alignBottom>.tabs {}\n"+ ".jsfTabControl.coolBar.alignBottom>.pages {border:none; border-bottom:solid 1px windowframe; box-shadow:inset 0 -1px buttonhighlight;}\n"+ ".jsfTabControl.coolBar.alignBottom>.tabs>.jsfTab {}\n"+ ".jsfTabControl.coolBar.alignBottom>.tabs>.jsfTab:first-child {}\n"+ ".jsfTabControl.coolBar.alignBottom>.tabs>.jsfTab.selected {}\n"+ ".jsfTabControl.coolBar.alignBottom>.tabs>.jsfTab>img {}\n"+ ".jsfTabControl.coolBar.alignBottom>.tabs>.jsfTab>div {}\n"+ //hottracking variant ".hotTrack>.tabs>.jsfTab:hover {background-color:inactivecaption;}\n"+ ".hotTrack>.tabs>.jsfTab.selected:hover {background-color:buttonface;}\n"+ //draw styles ".jsfblock {display:block !important;}\n"+ ".jsftableRow {display:table-row !important;}\n"+ ".jsftableCell {display:table-cell !important;}\n"+ ".jsfinlineBlock {display:inline-block !important;}\n"+ ".jsfinline {display:inline !important;}\n"+ ".jsftable {display:table !important;}\n"+ ".jsfhidden {display:none !important;}\n"+ ".jsfBlock {display:block !important;}\n"+ ".jsfTableRow {display:table-row !important;}\n"+ ".jsfTableCell {display:table-cell !important;}\n"+ ".jsfInlineBlock {display:inline-block !important;}\n"+ ".jsfInline {display:inline !important;}\n"+ ".jsfTable {display:table !important;}\n"+ ".jsfHidden {display:none !important;}\n"+ //form docking ".jsfDockTop {position:absolute !important; top:0px !important;}\n"+ ".jsfDockBottom {position:absolute !important; bottom:0px !important;}\n"+ ".jsfDockRight {position:absolute !important; right:0px !important;}\n"+ ".jsfDockLeft {position:absolute !important; left:0px !important;}\n"+ ""//leave here }, //basic constructor createElement:function(type,params){try{ if (type=="createElement") { log("jsForms.createElement: Whoa! That would create an infinite loop."); return null; } else if (exists(jsForms[type])) { return new jsForms[type](params); } }catch(e){log("jsForms.createElement: "+e);}}, //basic parts for every element basicElement:function(params){try{ var self=this; params=params||{}; //defaults this._enabled=true; this.parent=null; //container element this.tag=null; this.causesValidation=true; //events this.onCreated=null; //set the accessibility of the element this.__defineGetter__("enabled", function(){ return this._enabled; }); this.__defineSetter__("enabled", function(v){ this._enabled = cBool(v); if (this.node) this.node.enabled=this.enabled; }); //enable/disable commands this.enable=function(){this.enabled=true;}; this.disable=function(){this.enabled=false;}; //init for (var p in params) this[p]=params[p]; //return it if (self.causesValidation && self.onCreated) doAction(function(){self.onCreated(self);}); return self; }catch(e){log("jsForms.basicElement.init: "+e);}}, //basic parts for visual elements visualElement:function(params){try{ var self=this; params=params||{}; //attach basics self=extend(self,new jsForms.basicElement() ); //defaults this._backColor=""; this._foreColor=""; this._font="";//"Bebas Neue","League Gothic",Haettenschweiler,"Arial Narrow",sans-serif this._cursor=""; this._visible=true; this._position={top:"",left:"",right:"",bottom:""}; this._size={height:"",width:""}; this._maximumSize={height:"",width:""}; this._minimumSize={height:"",width:""}; this._margin={top:"",left:"",right:"",bottom:""}; this._padding={top:"",left:"",right:"",bottom:""}; this._node=null; this.backgroundNode=null; this.borderNode=null; //_backgroundImage: url //_backgroundImageLayout: "", time, stretch, center, zoom this._borderStyle="None"; //[None, FixedSingle, Fixed3D] this._drawStyle="inline-block"; this._borderCSS="1px solid #646464"; this._borderRadius={topLeft:"",topRight:"",bottomRight:"",bottomLeft:""}; this._toolTipText=""; this._dock="none"; //events this.onClick=null; this.onFocus=null; this.onBlur=null; //add css className this.addClassName=function(s){try{ if (!isArray(s)) s=[s]; var css=this.node.className; for (var w=0,len=s.length;(w<len);w++) { var word=s[w]; this.node.className=css.addWord("jsf"+word); } }catch(e){log("jsForms.visualElement.addClassName: "+e);}}; //remove css className this.removeClassName=function(s){try{ if (!isArray(s)) s=[s]; var css=this.node.className; for (var w=0,len=s.length;(w<len);w++) { var word=s[w]; this.node.className=css.removeWord("jsf"+word); } }catch(e){log("jsForms.visualElement.addClassName: "+e);}}; //autoFit parent element this.__defineGetter__("dock", function(){ return this._dock; }); this.__defineSetter__("dock", function(v){try{ this._dock = (v=v.toString()); //clear classes this.removeClassName(["dockTop","dockBottom","dockFill","dockRight","dockLeft"]); //calculate display, height, width and position var d, w, h, p=this.node.parentNode||null; switch(v) { case "none": //use given heights and widths d=this._drawStyle; w=this.size.width||""; h=this.size.height||""; break; case "fill": //fully dock with parent object if (!p) return; d="block"; w=""; h=elementInnerHeight(p)-(this.outerHeight-this.innerHeight)+"px"; break; case "fillAndShare": //dock with parent object //using any space left by other children //this assumes all siblings are blocks if (!p) return; d="block"; w=""; //detect maximum possible height h= //parent inner height elementInnerHeight(p) //minus the outer requirements for this element -(this.outerHeight-this.innerHeight); //detect sibling elements' heights var sibH=0; for (var s in p.childNodes){ sib=p.childNodes[s]; if (sib!=this.node) { sibH+=elementOuterHeight(sib); } } h=(h-sibH)+"px"; break; case "top": //dock to the top of the parent d="block"; w=""; h=this.size.height||""; this.addClassName("dockTop"); break; case "bottom": //dock to the bottom of the parent d="block"; w=""; h=this.size.height||""; this.addClassName("dockBottom"); break; case "right": //dock to the right of the parent d=this._drawStyle; w=this.size.width||""; h=elementInnerHeight(p)-(this.outerHeight-this.innerHeight)+"px"; this.addClassName("dockRight"); break; case "left": //dock to the right of the parent d=this._drawStyle; w=this.size.width||""; h=elementInnerHeight(p)-(this.outerHeight-this.innerHeight)+"px"; this.addClassName("dockLeft"); break; } //apply non-class changes this.node.style.display=d; this.node.style.width=w; this.node.style.height=h; }catch(e){log("jsForms.visualElement.autoFit: "+e);}}); //set css background color this.__defineGetter__("backColor", function(){ return this._backColor; }); this.__defineSetter__("backColor", function(v){try{ this._backColor = (v.toString()); if (this.backgroundNode) this.backgroundNode.style.backgroundColor=this.backColor; }catch(e){log("jsForms.visualElement.backColor: "+e);}}); //set draw style (display) this.__defineGetter__("drawStyle", function(){ return this._drawStyle; }); this.__defineSetter__("drawStyle", function(v){try{ this._drawStyle = (v.toString()); this.dock=this._dock; }catch(e){log("jsForms.visualElement.drawStyle: "+e);}}); //set tooltiptext/title this.__defineGetter__("toolTipText", function(){ return this._toolTipText; }); this.__defineSetter__("toolTipText", function(v){try{ this._toolTipText = (v.toString()); if (this.node) this.node.title=this._toolTipText; }catch(e){log("jsForms.visualElement.toolTipText: "+e);}}); //set css foreground color this.__defineGetter__("foreColor", function(){ return this._foreColor; }); this.__defineSetter__("foreColor", function(v){try{ this._foreColor = (v.toString()); if (this.node) this.node.style.color=this.foreColor; }catch(e){log("jsForms.visualElement.foreColor: "+e);}}); //set the font used in both the box and the list this.__defineGetter__("font", function(){ return this._font; }); this.__defineSetter__("font", function(v){try{ this._font = (v.toString()); if (this.node) this.node.style.fontFamily=this.font; }catch(e){log("jsForms.visualElement.font: "+e);}}); //set the node element css class this.__defineGetter__("className", function(){ return this.node.className; }); this.__defineSetter__("className", function(v){try{ if (this.node) this.node.className=v; }catch(e){log("jsForms.visualElement.className: "+e);}}); //set the cursor used in the element this.__defineGetter__("cursor", function(){ return this._cursor; }); this.__defineSetter__("cursor", function(v){try{ this._cursor = (v.toString()); if (this.node) this.node.style.cursor=this.cursor; }catch(e){log("jsForms.visualElement.cursor: "+e);}}); //set if the dropdown is visible this.__defineGetter__("visible", function(){ return this._visible; }); this.__defineSetter__("visible", function(v){try{ this._visible = cBool(v); //log(this._visible); if (this._visible) this.removeClassName("hidden"); else this.addClassName("hidden"); }catch(e){log("jsForms.visualElement.visible: "+e);}}); //set the location based on the upper left of the container box //values are copied from the passed object so that a reference to the //passed object does not remain this.__defineGetter__("position", function(){ return this._position; }); this.__defineSetter__("position", function(v){try{ if (isObject(v)) { this._position.top=v.top||""; this._position.left=v.left||""; this._position.right=v.right||""; this._position.bottom=v.bottom||""; } else { //value was not an object log("jsForms.visualElement.position.set: input was not an object"); this._position={top:"",left:"",right:"",bottom:""} } if (this.node) { this.node.style.top=this.position.top; this.node.style.left=this.position.left; this.node.style.right=this.position.right; this.node.style.bottom=this.position.bottom; } }catch(e){log("jsForms.visualElement.position: "+e);}}); //set the height and width of the box this.__defineGetter__("size", function(){ return this._size; }); this.__defineSetter__("size", function(v){try{ if (isObject(v)) { this._size.height=v.height||""; this._size.width=v.width||""; } else { //value was not an object log("jsForms.visualElement.size.set: input was not an object"); this._size={height:"",width:""} } //now use the dock function to finish sizing this.dock = this._dock; }catch(e){log("jsForms.visualElement.size: "+e);}}); //set the max height and width of the box this.__defineGetter__("maximumSize", function(){ return this._maximumSize; }); this.__defineSetter__("maximumSize", function(v){try{ if (isObject(v)) { this._maximumSize.height=v.height||""; this._maximumSize.width=v.width||""; } else { //value was not an object log("jsForms.visualElement.maximumSize.set: input was not an object"); this._maximumSize={height:"",width:""} } if (this.node) { this.node.style.maxHeight=this.maximumSize.height; this.node.style.maxWidth=this.maximumSize.width; } }catch(e){log("jsForms.visualElement.maximumSize: "+e);}}); //set the min height and width of the box this.__defineGetter__("minimumSize", function(){ return this._minimumSize; }); this.__defineSetter__("minimumSize", function(v){try{ if (isObject(v)) { this._minimumSize.height=v.height||""; this._minimumSize.width=v.width||""; } else { //value was not an object log("jsForms.visualElement.minimumSize.set: input was not an object"); this._minimumSize={height:"",width:""} } if (this.node) { this.node.style.minHeight=this.minimumSize.height; this.node.style.minWidth=this.minimumSize.width; } }catch(e){log("jsForms.visualElement.minimumSize: "+e);}}); //set the margins of the object {top, left, right, bottom} this.__defineGetter__("margin", function(){ return this._margin; }); this.__defineSetter__("margin", function(v){try{ if (isObject(v)) { this._margin.top=v.top||""; this._margin.left=v.left||""; this._margin.right=v.right||""; this._margin.bottom=v.bottom||""; } else { //value was not an object log("jsForms.visualElement.margin.set: input was not an object"); this._margin={top:"",left:"",right:"",bottom:""} } if (this.node) { this.node.style.margin= this.margin.top+" "+ this.margin.right+" "+ this.margin.bottom+" "+ this.margin.left; } }catch(e){log("jsForms.visualElement.margin: "+e);}}); //set the padding of the object {top, left, right, bottom} this.__defineGetter__("padding", function(){ return this._padding; }); this.__defineSetter__("padding", function(v){try{ if (isObject(v)) { this._padding.top=v.top||""; this._padding.left=v.left||""; this._padding.right=v.right||""; this._padding.bottom=v.bottom||""; } else { //value was not an object log("jsForms.visualElement.padding.set: input was not an object"); this._padding={top:"",left:"",right:"",bottom:""} } if (this.node) { this.node.style.paddingTop=this.padding.top; this.node.style.paddingLeft=this.padding.left; this.node.style.paddingRight=this.padding.right; this.node.style.paddingBottom=this.padding.bottom; } }catch(e){log("jsForms.visualElement.padding: "+e);}}); //set the border radius of the object this.__defineGetter__("borderRadius", function(){ return this._borderRadius; }); this.__defineSetter__("borderRadius", function(v){try{ if (isObject(v)) { this._borderRadius.topLeft=v.topLeft||""; this._borderRadius.bottomLeft=v.bottomLeft||""; this._borderRadius.topRight=v.topRight||""; this._borderRadius.bottomRight=v.bottomRight||""; } else { //value was not an object log("jsForms.visualElement.borderRadius.set: input was not an object"); this._borderRadius={topLeft:"",bottomLeft:"",topRight:"",bottomRight:""} } if (this.borderNode) { this.borderNode.style.borderTopLeftRadius=this.borderRadius.topLeft; this.borderNode.style.borderTopRightRadius=this.borderRadius.topRight; this.borderNode.style.borderBottomLeftRadius=this.borderRadius.bottomLeft; this.borderNode.style.borderBottomRightRadius=this.borderRadius.bottomRight; } }catch(e){log("jsForms.visualElement.borderRadius: "+e);}}); //set the border style of the element this.__defineGetter__("borderStyle", function(){ return this._borderStyle; }); this.__defineSetter__("borderStyle", function(v){try{ this._borderStyle = (v.toString()); if (this.borderNode){ this.borderNode.style.border=( (this._borderStyle=="Fixed3D")?"2px inset buttonface": (this._borderStyle=="FixedSingle")?this._borderCSS: "none" ); } }catch(e){log("jsForms.visualElement.borderStyle: "+e);}}); //set default border css for borderStyle FixedSingle this.__defineGetter__("borderCSS", function(){ return this._borderCSS; }); this.__defineSetter__("borderCSS", function(v){try{ this._borderCSS = (v.toString()); this.borderStyle = this._borderStyle; }catch(e){log("jsForms.visualElement.borderCSS: "+e);}}); //return the dom node this.__defineGetter__("node", function(){ return this._node; }); //calculate inner and outer actual sizes this.__defineGetter__("outerWidth", function(){ return elementOuterWidth(this._node); }); this.__defineGetter__("innerWidth", function(){ return elementInnerWidth(this._node); }); this.__defineGetter__("outerHeight", function(){ return elementOuterHeight(this._node); }); this.__defineGetter__("innerHeight", function(){ return elementInnerHeight(this._node); }); //show/hide the visual element this.show=function(){ this.visible=true; }; this.hide=function(){ this.visible=false; }; //draw the housing this._node=createElement("div",{ style:( "display:"+this._drawStyle+";"+ "vertical-align:middle;"+ ""//leave here ) }); //set nodes for bordering and background this.borderNode=this._node; this.backgroundNode=this._node; //init for (var p in params) this[p]=params[p]; //confirm(JSON.stringify(this)); //return it if (self.causesValidation && self.onCreated) doAction(function(){self.onCreated(self);}); return self; }catch(e){log("jsForms.visualElement.init: "+e);}}, //icon specific parts icon:function(params){try{ var self=this; params=params||{}; //attach basic elements self=extend(self,new jsForms.visualElement() ); //defaults this._src=null; this._defaultImage=null; this._altImage=null; this.imageNode=null; this.node.style.overflow="hidden"; this._selectedImage="_src"; //set the image this.__defineGetter__("src", function(){ return this._src; }); this.__defineSetter__("_src", function(v){try{ this._src = (v.toString()); if (this._selectedImage=="_src") this.redraw(); }catch(e){log("jsForms.icon.src: "+e);}}); //set the default image this.__defineGetter__("defaultImage", function(){ return this._defaultImage; }); this.__defineSetter__("defaultImage", function(v){try{ this._defaultImage = (v.toString()); if (this._selectedImage=="_defaultImage") this.redraw(); }catch(e){log("jsForms.icon.defaultImage: "+e);}}); //set the alt image this.__defineGetter__("altImage", function(){ return this._altImage; }); this.__defineSetter__("altImage", function(v){try{ this._altImage = (v.toString()); if (this._selectedImage=="_altImage") this.redraw(); }catch(e){log("jsForms.icon.altImage: "+e);}}); //show different images this.showPrimary=function(){ this._selectedImage="_src"; this.redraw(); }; this.showDefault=function(){ this._selectedImage="_defaultImage"; this.redraw(); }; this.showAlt=function(){ this._selectedImage="_altImage"; this.redraw(); }; //redraw this.redraw=function(){try{ if (this.imageNode) { this.imageNode.src=(this[this._selectedImage]||this._defaultImage); } }catch(e){log("jsForms.icon.src: "+e);}}; //draw it if (this.node){ this.node.appendChild( this.imageNode=createElement("img",{ style:( "width:inherit;"+ "height:inherit;"+ ""//leave here ), }) ); } //init for (var p in params) {try{ //separate event functions if (p.startsWith("on")) { //apply event functions to intended objects if (["onCreated"].inArray(p)) { this[p]=params[p]; } else this.imageNode[p.toLowerCase()]=params[p]; } else this[p]=params[p]; }catch(e){log("jsForms.icon.init (params): "+e);}}; //confirm(JSON.stringify(this)); /*/preload images new Image().src = this._altImage; new Image().src = this._defaultImage; new Image().src = this._src; */ //return it if (self.causesValidation && self.onCreated) doAction(function(){self.onCreated(self);}); return self; }catch(e){log("jsForms.icon.init: "+e);}}, //textbox specific parts textBox:function(params){try{ var self=this; params=params||{}; //attach basic elements self=extend(self,new jsForms.visualElement() ); //defaults this._text=""; this._emptyText=""; this._maxLength=32767; this.textNode=null; this.borderNode=null; this.backgroundNode=null; this._borderStyle="FixedSingle"; //this._drawStyle="block"; //events this.onChange=null; //set the text shown in the box this.__defineGetter__("text", function(){ return this._text; }); this.__defineSetter__("text", function(v){try{ this._text = (v.toString()); if (this.textNode) this.textNode.value=v; if (this.causesValidation && this.onChange) {var caller=this; doAction(function(){caller.onChange(caller);})}; }catch(e){log("jsForms.textBox.text: "+e);}}); //text to display when text="" this.__defineGetter__("emptyText", function(){ return this._emptyText; }); this.__defineSetter__("emptyText", function(v){try{ this._emptyText = (v.toString()); if (this.node) this.node.title=this.emptyText; }catch(e){log("jsForms.textBox.emptyText: "+e);}}); //set the max number of characters that can be entered in the box this.__defineGetter__("maxLength", function(){ return this._maxLength; }); this.__defineSetter__("maxLength", function(v){try{ this._maxLength = parseInt(v); if (this.node) this.node.maxLength=this.maxLength; }catch(e){log("jsForms.textBox.maxLength: "+e);}}); //get the default value as text this.__defineGetter__("value", function(){ return this._text; }); //draw it this._node.appendChild( this.textNode=createElement("input",{ maxLength:this._maxLength, value:this._text, title:this._emptyText, enabled:this._enabled, style:( "display:"+this._drawStyle+";"+ "width:inherit;"+ "height:inherit;"+ "minWidth:inherit;"+ "minHeight:inherit;"+ "maxWidth:inherit;"+ "maxHeight:inherit;"+ "margin-top:inherit;"+ "margin-left:inherit;"+ "margin-right:inherit;"+ "margin-bottom:inherit;"+ "top:inherit;"+ "left:inherit;"+ "right:inherit;"+ "bottom:inherit;"+ "cursor:inherit;"+ //"font-family:inherit;"+ //"background-color:"+this._backColor+";"+ "color:inherit;"+ /*"border:"+( (this.borderStyle=="Fixed3D")?"": (this.borderStyle=="FixedSingle")?this.borderCSS: "none" )+";"+ "border-top-left-radius:"+this.borderRadius.topLeft+";"+ "border-top-right-radius:"+this.borderRadius.bottomLeft+";"+ "border-bottom-left-radius:"+this.borderRadius.topRight+";"+ "border-bottom-right-radius:"+this.borderRadius.bottomRight+";"+ */ ""//leave here ), onclick:self.onClick, ondblclick:self.onDoubleClick, onmousedown:self.onMouseDown, onmouseup:self.onMouseUp, onmousemove:self.onMouseMove, onmouseover:self.onMouseOver, onmouseout:self.onMouseOut, onkeydown:self.onKeyDown, onkeypress:self.onKeyPress, onkeyup:self.onKeyPress, onblur:self.onBlur, onfocus:self.onFocus, onselect:self.onSelect, onchange:function(){ self.text=this.value; }, }) ); //set nodes for bordering and background this.borderNode=this.textNode; this.backgroundNode=this.textNode; //init for (var p in params) this[p]=params[p]; //confirm(JSON.stringify(this)); //return it if (this.causesValidation && this.onCreated) doAction(function(){this.onCreated(this);}); return this; }catch(e){log("jsForms.textBox.init: "+e);}}, //numeric up/down specific parts spinBox:function(params){try{ var self=this; params=params||{}; //attach basic elements self=extend(self,new jsForms.textBox() ); //defaults //this._hexadecimal=false; //this._thousandsSeparator=false; this._upDownAlign="right"; //this._decimalPlaces=0; this._increment=1; this._maximum=100; this._minimum=0; this._rollOver=false; //start at the other end if past boundary //set the max value this.__defineGetter__("maximum", function(){ return this._maximum; }); this.__defineSetter__("maximum", function(v){try{ this._maximum = parseInt(v); }catch(e){log("jsForms.spinBox.maximum: "+e);}}); //set the min value this.__defineGetter__("minimum", function(){ return this._minimum; }); this.__defineSetter__("minimum", function(v){try{ this._minimum = parseInt(v); }catch(e){log("jsForms.spinBox.minimum: "+e);}}); //set the increment value this.__defineGetter__("increment", function(){ return this._increment; }); this.__defineSetter__("increment", function(v){try{ this._increment = parseInt(v); }catch(e){log("jsForms.spinBox.increment: "+e);}}); //set the rollOver flag this.__defineGetter__("rollOver", function(){ return this._rollOver; }); this.__defineSetter__("rollOver", function(v){try{ this._rollOver = cBool(v); }catch(e){log("jsForms.spinBox.rollOver: "+e);}}); //up and down functions this.up=function(){ this.change(this._increment); }; this.down=function(){ this.change(-(this._increment)); }; this.change=function(n){ var v=parseInt(this.text),hasChanged=false; v=v+n; //validate boundaries if ((v<=this._maximum)&&(v>=this._minimum)){ hasChanged=true; } else { if (this._rollOver) { //perform rollover if (v>this._maximum) v=this._minimum; else v=this._maximum; hasChanged=true; } } if (hasChanged){ //format output //v=v.toString(); //v=v.format("#,##0"); //print it this.text=v; } }; //append buttons to the textbox portion this.node.style.position="relative"; this.textNode.style.textAlign=(this._upDownAlign=="left")?"right":"left"; this.textNode.style.verticalAlign="middle"; this.node.appendChild( this.buttonNode=createElement("div",{ style:( "vertical-align: middle;"+ "position: relative;"+ "display: inline-block;"+ ""//leave here ), },[ this.incrementNode=createElement("button",{ className:"jsfButton jsfblock", title:"Up", onclick:function(){ self.up(); }, },[ createElement("span",{ textContent:"\u25B4", }) ]), this.decrementNode=createElement("button",{ className:"jsfButton jsfblock", title:"Down", onclick:function(){ self.down(); }, },[ createElement("span",{ textContent:"\u25BE", }) ]) ]) ); //init for (var p in params) this[p]=params[p]; //resize its buttons this.fixSizes=function(){ var self=this; var btn=this.incrementNode; var h=elementOuterHeight(this.textNode); var i=elementOuterHeight(btn)-elementInnerHeight(btn); if (!isNaN(h) && !isNaN(i) && h>0){ //resize buttons btn.style.height=(h/2)-i+"px"; self.decrementNode.style.height= btn.style.height; //move child text to center var span=btn.childNodes[0]; span.style.left= Math.floor(( elementInnerWidth(btn)-elementOuterWidth(span))/2 )+"px"; span.style.bottom= Math.floor(( elementInnerHeight(btn)-elementOuterHeight(span))/2 )+"px"; var span=self.decrementNode.childNodes[0]; span.style.left= Math.floor( (elementInnerWidth(self.decrementNode)-elementOuterWidth(span))/2 )+"px"; span.style.bottom= Math.floor( (elementInnerHeight(self.decrementNode)-elementOuterHeight(span))/2 )+"px"; } else { setTimeout(function(){self.fixSizes();},100); } }; this.fixSizes(); //return it if (self.causesValidation && self.onCreated) doAction(function(){self.onCreated(self);}); return self; }catch(e){log("jsForms.spinBox.init: "+e);}}, //checkbox specific parts checkBox:function(params){try{ var self=this; params=params||{}; //attach basic elements self=extend(self,new jsForms.visualElement() ); //defaults this._checked=false; this._text=""; this._value=""; //_threeState: see checkedState //_checkedState: [unchecked, checked, indeterminate] this._autoCheck=true; //check on label click this.checkNode=null; this.labelNode=null; this._highlightSelected=false; //this._image=""; //this._textCheckRelation="After"; //[Above, Below, Before, After] //this._textImageRelation="After"; //[Above, Below, Before, After] //events this.onChecked=null; this.onUnchecked=null; //set visible text of the checkbox this.__defineGetter__("text", function(){ return this._text; }); this.__defineSetter__("text", function(v){try{ this._text = (v.toString()); if (this.labelNode) this.labelNode.textContent=this._text; }catch(e){log("jsForms.checkBox.text: "+e);}}); //set underlying value of the checkbox this.__defineGetter__("value", function(){ return this._value; }); this.__defineSetter__("value", function(v){try{ this._value = v; if (this.checkNode) this.checkNode.value=this._value; }catch(e){log("jsForms.checkBox.value: "+e);}}); this.doAutoCheck=function(){try{ click(self.checkNode); if (self.onLabelClick) self.onLabelClick(); }catch(e){log("jsForms.checkBox.doAutoCheck: "+e);}}; //set autocheck on label click this.__defineGetter__("autoCheck", function(){ return this._autoCheck; }); this.__defineSetter__("autoCheck", function(v){try{ this._autoCheck = cBool(v); this.labelNode.onclick=(!this._autoCheck)?this.onLabelClick:this.doAutoCheck; }catch(e){log("jsForms.checkBox.autoCheck: "+e);}}); //set highlight on checked this.__defineGetter__("highlightSelected", function(){ return this._highlightSelected; }); this.__defineSetter__("highlightSelected", function(v){try{ this._highlightSelected = cBool(v); if (this.node) { this.node.style.backgroundColor=(this._highlightSelected)?((this._checked)?"highlight":this.backColor):this.backColor; this.node.style.color=(this._highlightSelected)?((this._checked)?"highlighttext":this.foreColor):this.foreColor; } }catch(e){log("jsForms.checkBox.highlightSelected: "+e);}}); //set checked state this.__defineGetter__("checked", function(){ return this._checked; }); this.__defineSetter__("checked", function(v){try{ this._checked = cBool(v); if (this.checkNode) this.checkNode.checked=this._checked; if (this.node) { this.node.style.backgroundColor=(this._highlightSelected)?((this._checked)?"highlight":this.backColor):this.backColor; this.node.style.color=(this._highlightSelected)?((this._checked)?"highlighttext":this.foreColor):this.foreColor; } if (this.causesValidation){ var caller=this; if (this.onChecked && this._checked) doAction(function(){caller.onChecked(caller);}); if (this.onUnchecked && !this._checked) doAction(function(){caller.onChecked(caller);}); if (this.onChange) doAction(function(){caller.onChange(caller);}); /*confirm("-onchange"); window.setTimeout(function(){ confirm("-onchange delay"); caller.onChange(caller); },1000);*/ //} } }catch(e){log("jsForms.checkBox.checked: "+e);}}); //register the initial params for (var p in params) this[p]=params[p]; //draw it this.node.appendChild( this.checkNode=createElement("input",{ type: "checkbox", value: this._value, checked: this._checked, style:( "margin-right: 4px;"+ "vertical-align: middle;"+ "" //leave here ), onclick:self.onClick, ondblclick:self.onDoubleClick, onmousedown:self.onMouseDown, onmouseup:self.onMouseUp, onmousemove:self.onMouseMove, onmouseover:self.onMouseOver, onmouseout:self.onMouseOut, onkeydown:self.onKeyDown, onkeypress:self.onKeyPress, onkeyup:self.onKeyPress, onblur:self.onBlur, onfocus:self.onFocus, onchange:function(){ self.checked=this.checked; }, }) ); this.node.appendChild( this.labelNode=createElement("label",{ textContent:this._text, style:( "margin-right: 4px;"+ "vertical-align: middle;"+ "font-weight: normal;"+ "color: inherit;"+ "" //leave here ), onclick:(this._autoCheck)?self.doAutoCheck:self.onLabelClick, ondblclick:self.onLabelDoubleClick, onmousedown:self.onMouseDown, onmouseup:self.onMouseUp, onmousemove:self.onMouseMove, onmouseover:self.onMouseOver, onmouseout:self.onMouseOut, onkeydown:self.onKeyDown, onkeypress:self.onKeyPress, onkeyup:self.onKeyPress, onblur:self.onBlur, onfocus:self.onFocus, }) ); //return it if (self.causesValidation && self.onCreated) doAction(function(){self.onCreated(self);}); return self; }catch(e){log("jsForms.checkBox.init: "+e);}}, //toolBox for containing tool icons toolBox:function(params){try{ var self=this; params=params||{}; //attach basic elements self=extend(self,new jsForms.listBox({items:params.items}) ); delete params.items; //defaults this.node.style.position="absolute"; this.drawStyle="block"; //this.node.style.overflow=""; //make it expand as needed this.position={top:"0px",right:"0px"}; //init for (var p in params) this[p]=params[p]; //confirm(JSON.stringify(this)); //return it if (self.causesValidation && self.onCreated) doAction(function(){self.onCreated(self);}); return self; }catch(e){log("jsForms.toolBox.init: "+e);}}, //listbox specific parts listBox:function(params){try{ var self=this; params=params||{}; //attach basic elements self=extend(self, new jsForms.visualElement() ); //defaults this._maxItems=32767; this._maxSelectedItems=32767; this._sorted=false; this._sortBy=["text"]; this._sortOrder="asc"; this.listNode=this.node; this._items=[]; this._firstItemSelectsAll=false; this._explicitClose=false; this._valueMember="value"; this._highlightSelected=false; this.node.style.overflow="scroll"; this._allowMoveChildren=false; //events this.onItemSelected=null; this.onItemChecked=null; this.onItemUnselected=null; this.onItemUnchecked=null; this.onMaxItemsSelected=null; //set the max number of items to show in the list this.__defineGetter__("maxItems", function(){ return this._maxItems; }); this.__defineSetter__("maxItems", function(v){try{ this._maxItems = parseInt(v); }catch(e){log("jsForms.listBox.maxItems: "+e);}}); //set the max number of items that can be selected this.__defineGetter__("maxSelectedItems", function(){ return this._maxSelectedItems; }); this.__defineSetter__("maxSelectedItems", function(v){try{ this._maxSelectedItems = parseInt(v); }catch(e){log("jsForms.listBox.maxSelectedItems: "+e);}}); //set if the list is to be sorted this.__defineGetter__("sorted", function(){ return this._sorted; }); this.__defineSetter__("sorted", function(v){try{ this._sorted = cBool(v); if (this._sorted) this.sort(); }catch(e){log("jsForms.listBox.sorted: "+e);}}); //set if the list children can be moved around this.__defineGetter__("allowMoveChildren", function(){ return this._allowMoveChildren; }); this.__defineSetter__("allowMoveChilden", function(v){try{ this._allowMoveChildren = cBool(v); //add||remove tools for each child for (var i=0,child;(child=this.items[i]);i++){ if (this._allowMoveChildren) { //add item to toolbox } else { //remove item from toolbox } } }catch(e){log("jsForms.listBox.allowMoveChildren: "+e);}}); //set highlight if selected this.__defineGetter__("highlightSelected", function(){ return this._highlightSelected; }); this.__defineSetter__("highlightSelected", function(v){try{ this._highlightSelected = cBool(v); for (var i=0,child;(child=this.items[i]);i++){ child.highlightSelected=this._highlightSelected; } }catch(e){log("jsForms.listBox.highlightSelected: "+e);}}); //set the parameters by which the list is to be sorted this.__defineGetter__("sortBy", function(){ return this._sortBy; }); this.__defineSetter__("sortBy", function(v){try{ if (isArray(v) || isString(v)) { this._sortBy = v; if (this._sorted) this.sort(); } else { log("jsForms.listBox.sortBy: Expected array or string, found "+typeof v); } }catch(e){log("jsForms.listBox.sortBy: "+e);}}); //set the direction by which the sorting is done this.__defineGetter__("sortOrder", function(){ return this._sortOrder; }); this.__defineSetter__("sortOrder", function(v){try{ this._sortOrder = v.toString(); if (this._sorted) this.sort(); }catch(e){log("jsForms.listBox.sortOrder: "+e);}}); //get the items list of the list this.__defineGetter__("items", function(){ return this._items; }); this.__defineSetter__("items", function(v){try{ this._items = v; }catch(e){log("jsForms.listBox.items: "+e);}}); //alias for items list this.__defineGetter__("options", function(){ return this._items; }); //set the parameter of the sub item that is to be used as a value this.__defineGetter__("valueMember", function(){ return this._valueMember; }); this.__defineSetter__("valueMember", function(v){try{ this._valueMember = (v.toString()); }catch(e){log("jsForms.listBox.valueMember: "+e);}}); //an object to display at the end of the //...list that can be clicked to close a dropdown this.__defineGetter__("explicitClose", function(){ return this._explicitClose; }); this.__defineSetter__("explicitClose", function(v){try{ this._explicitClose = cBool(v); }catch(e){log("jsForms.listBox.explicitClose: "+e);}}); //set if the special selectAll option appears this.__defineGetter__("firstItemSelectsAll", function(){ return this._firstItemSelectsAll; }); this.__defineSetter__("firstItemSelectsAll", function(v){try{ this._firstItemSelectsAll = cBool(v); }catch(e){log("jsForms.listBox.firstItemSelectsAll: "+e);}}); //get the default value as text this.__defineGetter__("value", function(){try{ var ret=[]; var sel=this.selectedItems; for (var i=0,child;(child=sel[i]);i++){ ret.push(child[this._valueMember]); } return ret; }catch(e){log("jsForms.listBox.value: "+e);}}); //get an array of selected options/checkboxes this.__defineGetter__("selectedItems", function(){try{ var ret=[]; for (var i=0,child;(child=this.items[i]);i++){ if (exists(child.selected)) { //check for option types that are selected if (child.selected) ret.push(child); } else if (exists(child.checked)) { //check for checkbox types that are checked if (child.checked) ret.push(child); } } return ret; }catch(e){log("jsForms.listBox.selectedItems: "+e);}}); //sort the list and redraw //p accepts {direction:string, by:array:string} //sorting is done using by[len-1] to by[0] so that //...sorting by ["lastName","firstName"] results in //...items being sorted by lastName first in the output this.sort=function(p){try{ var params=p||{}; params.by=params.by||this._sortBy||["text"]; if (!isArray(params.by)) params.by=[].push(params.by); params.direction=params.direction||this._sortOrder||"asc"; //var arrList=methodsToArray(this._items); var arrList=this._items; var dir=params.direction.toLowerCase(); //for each passed sort by entry, sort the list for (var i=this.params.by.length,by;(by=this.params.by[i]);i--){ arrList.sort(function(a,b){ if (["ascending","asc"].inArray(dir)) return a[by]>=b[by]; if (["descending","desc"].inArray(dir)) return a[by]<=b[by]; return true; }); }; //this._items=arrayToMethods(arrList); this._items=arrList; this.redraw(); }catch(e){log("jsForms.listBox.sort: "+e);}}; //redraw the list of items this.redraw=function(){try{ //clear all items for (var n in this.node){ remove(n); } //append selectall button if needed if (this._firstItemSelectsAll) { this.node.appendChild(this._selectAllNode); } //redraw in current order for (var i=0,child;(child=this.items[i]);i++){ this.node.appendChild(child.node||child); } //append explicitclose button if needed if (this._explicitClose){ this.node.appendChild(this._explicitCloseNode); } }catch(e){log("jsForms.listBox.redraw: "+e);}}; //generic close function, to be replaced by parent objects this.close=function(){ this.visible=false; }; //collapse the list down to a single element this.collapse=function(){try{ this.node.style.height=this.items[0].node.offsetHeight; this.node.style.overflowX="hidden"; this.node.style.overflowY="hidden"; }catch(e){log("jsForms.listBox.collapse: "+e);}}; //expand the list to the specified size this.expand=function(){try{ this.node.style.height=this.size.height; this.node.style.overflowX="hidden"; this.node.style.overflowY="scroll"; }catch(e){log("jsForms.listBox.expand: "+e);}}; //update visual details, such as border this.borderStyle="FixedSingle"; //register the initial params for (var p in params) {try{ this[p]=params[p]; }catch(e){log("jsForms.listBox.init(params "+p+"): "+e);}}; //modify children for (var i=0,child;(child=this.items[i]);i++){try{ //append onchange value to every list item child.onChange=function(){ if (self.causesValidation && self.onChange) { doAction(function(){self.onChange(self);}); } }; //change the drawstyle of each listitem (child.node||child).style.display="block"; //set the highlightSelected attribute child.highlightSelected=this._highlightSelected; }catch(e){log("jsForms.listBox.init(modify children): "+e);}}; //create the maybe-needed explicit close button this._explicitCloseNode=createElement("button",{ textContent:"Close", style:( "float:right;"+ ""//leave here ), onclick:function(){ if (self.close) doAction(function(){self.close();}); }, }); //create the maybe-needed select all node var o=new jsForms.checkBox({ text:"Select All", onChange:function(){ for (var i=0,child;(child=self._items[i]);i++){ if (exists(child.selected)) child.selected=this.checked; if (exists(child.checked)) child.checked=this.checked; } }, }); this._selectAllNode=o.node; o.labelNode.style.fontWeight="bold"; //draw it this.node.style.overflowX="hidden"; this.node.style.overflowY="scroll"; this.redraw(); //return it if (self.causesValidation && self.onCreated) doAction(function(){self.onCreated(self);}); return self; }catch(e){log("jsForms.listBox.init: "+e);}}, //combobox, dropdown, select-multi comboBox:function(params){try{ var self=this; params=params||{}; //attach basic elements self=extend(self,new jsForms.textBox() ); //defaults this._dropDownStyle="dropDown"; this._dropDownZIndex="999"; this.node.style.position="relative"; this.textNode.style.verticalAlign="middle"; this.textNode.disabled=true; //prevent typing in the box //sub items try{ this._dropDown=new jsForms.listBox({ parent:this, items:params.items, onChange:function(){ self.text=this.value; //confirm(this.value); }, firstItemSelectsAll:params.firstItemSelectsAll, explicitClose:params.explicitClose, backColor:params.backColor||"window", //size:{width:"100%"}, highlightSelected:params.highlightSelected, size:params.dropDownSize, drawStyle:"block", }); //close the dropdown by default if (this._dropDownStyle!="simple") this._dropDown.hide(); this._dropDown.node.style.zIndex=this._dropDownZIndex; this._dropDown.node.style.position="absolute"; //set the text based on what was passed as selected this.text=this._dropDown.value; }catch(e){log("jsForms.comboBox.init(create list): "+e);}; //scrap items we don't want appended to this object delete params.items; delete params.explicitClose; delete params.firstItemSelectsAll; delete params.highlightSelected; delete params.dropDownSize; //get the dropdown sub object this.__defineGetter__("dropDown", function(){ return this._dropDown; }); //set the dropdown visual style //simple: no dropdown, elements shown directly below all the time //dropdown: dropdown, elements in hidden list, allow typing in top box //dropdownList: same as dropdown minus typing in top box this.__defineGetter__("dropDownStyle", function(){ return this._dropDownStyle; }); this.__defineSetter__("dropDownStyle", function(v){try{ this._dropDownStyle = (v.toString()); this._dropDown.visible=((this._dropDownStyle=="simple")?true:false); }catch(e){log("jsForms.comboBox.dropDownStyle: "+e);}}); //set the z-index of the dropdown portion when open this.__defineGetter__("dropDownZIndex", function(){ return this._dropDownZIndex; }); this.__defineSetter__("dropDownZIndex", function(v){try{ this._dropDownZIndex = parseInt(v); this._dropDown.node.style.zIndex=this._dropDownZIndex; }catch(e){log("jsForms.comboBox.dropDownZIndex: "+e);}}); //redefine value: get the dropdown value array this.__defineGetter__("value", function(){ return this._dropDown.value; }); //show/hide dropdown this.showDropDown=function(){ this._dropDown.show(); this.buttonTextNode.textContent="\u25B4"; }; this.hideDropDown=function(){ this._dropDown.hide(); this.buttonTextNode.textContent="\u25BE"; }; this.toggleDropDown=function(){ var dd=this._dropDown; if (dd.visible) this.hideDropDown(); else this.showDropDown(); }; //register the initial params for (var p in params) this[p]=params[p]; //append a button to the textbox portion this.node.appendChild( this.buttonNode=createElement("button",{ className:"jsfButton jsfinlineBlock", onclick:function(){ self.toggleDropDown(); }, },[ this.buttonTextNode=createElement("span",{ textContent:"\u25BE", }) ]) ); //append the dropdown list this.node.appendChild(this._dropDown.node); //resize its parts this.fixSizes=function(){ var self=this; //resize dropdown button var btn=this.buttonNode; var h=elementOuterHeight(this.textNode); var i=elementOuterHeight(btn)-elementInnerHeight(btn); if (!isNaN(h) && !isNaN(i) && h>0){ btn.style.height=(h-i)+"px"; var span=btn.childNodes[0]; span.style.left= Math.floor(( elementInnerWidth(btn)-elementOuterWidth(span))/2 )+"px"; span.style.bottom= Math.floor(( elementInnerHeight(btn)-elementOuterHeight(span))/2 )+"px"; } else { setTimeout(function(){self.fixSizes();},100); } //resize dropdown this._dropDown.node.style.width= this.innerWidth- (this._dropDown.outerWidth-this._dropDown.innerWidth)+ "px"; }; this.fixSizes(); //return it if (self.causesValidation && self.onCreated) doAction(function(){self.onCreated(self);}); return self; }catch(e){log("jsForms.comboBox.init: "+e);}}, //css color picker colorPicker:function(params){try{ var self=this; params=params||{}; //attach basic elements self=extend(self,new jsForms.textBox() ); //defaults this._dropDownStyle="dropDown"; this._dropDownZIndex="999"; //functions var spanClick=function(){ self.text=this.getAttribute("data-ft"); self.hideDropDowns(); self.colorBox.style.backgroundColor=self.text; }; var makeSpans=function(data,e){ var ret=[]; if (isArrayAndNotEmpty(data)) for (var i=0,d;(d=data[i]);i++){ var value=(typeof d == "object")?d.value:d; var name=(typeof d == "object")?d.name:d; ret.push(createElement("span",{ onclick:spanClick, style:( //"color: white !important;"+ //"text-shadow: 0px 0px 1px black,0px 0px 1px black,0px 0px 1px black,0px 0px 1px black,0px 0px 1px black;"+ //"font-weight:bold;"+ "display:block;"+ ""//leave here ), "data-ft":value, },[ createElement("div",{ style:( "background-color:"+value+" !important;"+ "margin:0px 6px 0px 3px;"+ "border:1px solid black;"+ "width:20px; height:10px;"+ "vertical-align:baseline;"+ "display:inline-block;"+ ""//leave here ), }), createElement("text",name) ])); } return ret; }; //sub items var shareStyle=( "background-color:"+(params.backColor||"window")+";"+ "height:"+params.dropDownSize.height+";"+ "z-index:"+this._dropDownZIndex+";"+ "position:absolute;"+ "display:none;"+ "overflow-x:hidden;"+ "overflow-y:auto;"+ ""//leave here ); try{ this._webSafe=createElement("div",{ style:shareStyle, }, makeSpans(jsForms.colorData.webSafe) ); }catch(e){log("jsForms.colorPicker.init(webSafe): "+e);}; try{ this._colorWords=createElement("div",{ style:shareStyle, }, makeSpans(jsForms.colorData.colorWords) ); }catch(e){log("jsForms.colorPicker.init(colorWords): "+e);}; try{ this._system=createElement("div",{ style:shareStyle, }, makeSpans(jsForms.colorData.system) ); }catch(e){log("jsForms.colorPicker.init(system): "+e);}; try{ this._custom=createElement("div",{ style:shareStyle, }, makeSpans(jsForms.colorData.custom) ); }catch(e){log("jsForms.colorPicker.init(custom): "+e);}; delete params.dropDownSize; //set the z-index of the dropdown portion when open this.__defineGetter__("dropDownZIndex", function(){ return this._dropDownZIndex; }); this.__defineSetter__("dropDownZIndex", function(v){try{ this._dropDownZIndex = parseInt(v); this._webSafe.style.zIndex=this._dropDownZIndex; this._system.style.zIndex=this._dropDownZIndex; this._colorNames.style.zIndex=this._dropDownZIndex; this._custom.style.zIndex=this._dropDownZIndex; }catch(e){log("jsForms.colorPicker.dropDownZIndex: "+e);}}); //redefine value: get the dropdown value array this.__defineGetter__("value", function(){ return this.textNode.value; }); //resize the dropdown to fit our control this.resizeDropDown=function(e){ var w=this.innerWidth- ( elementOuterWidth(this[e])-elementInnerWidth(this[e]) )+ "px"; //confirm(w); this[e].style.width=w; }; //show/hide dropdown this.showDropDown=function(e){ this.hideDropDowns(); this.resizeDropDown(e); this[e].style.display="block" }; this.hideDropDowns=function(){ this._webSafe.style.display="none"; this._system.style.display="none"; this._colorWords.style.display="none"; this._custom.style.display="none"; }; this.toggleDropDown=function(e){ var hidden=(this[e].style.display=="none"); if (hidden) this.showDropDown(e); else this.hideDropDowns(); }; //init for (var p in params) this[p]=params[p]; //append a button to the textbox portion this.node.style.position="relative"; this.node.appendChild( createElement("button",{ style:( "position: relative;"+ "font-size: 18px;"+ "padding: 0px;"+ "line-height: 0px;"+ "border: 1px solid buttonshadow;"+ "height:16px; width:17px;"+ "background-color: buttonface;"+ "box-shadow:1px 1px buttonhighlight inset, -1px -1px buttonhighlight inset;"+ "vertical-align:middle;"+ ""//leave here ), onclick:function(){ self.toggleDropDown("_webSafe"); }, },[ createElement("span",{ textContent:"\u25BE", style:( "position: relative;"+ "left:-3px;"+ ""//leave here ) }) ]) ); this.node.appendChild( createElement("button",{ style:( "position: relative;"+ "font-size: 18px;"+ "padding: 0px;"+ "line-height: 0px;"+ "border: 1px solid buttonshadow;"+ "height:16px; width:17px;"+ "background-color: buttonface;"+ "box-shadow:1px 1px buttonhighlight inset, -1px -1px buttonhighlight inset;"+ "vertical-align:middle;"+ ""//leave here ), onclick:function(){ self.toggleDropDown("_colorWords"); }, },[ createElement("span",{ textContent:"\u25BE", style:( "position: relative;"+ "left:-3px;"+ ""//leave here ) }) ]) ); this.node.appendChild( createElement("button",{ style:( "position: relative;"+ "font-size: 18px;"+ "padding: 0px;"+ "line-height: 0px;"+ "border: 1px solid buttonshadow;"+ "height:16px; width:17px;"+ "background-color: buttonface;"+ "box-shadow:1px 1px buttonhighlight inset, -1px -1px buttonhighlight inset;"+ "vertical-align:middle;"+ ""//leave here ), onclick:function(){ self.toggleDropDown("_system"); }, },[ createElement("span",{ textContent:"\u25BE", style:( "position: relative;"+ "left:-3px;"+ ""//leave here ) }) ]) ); this.node.appendChild( createElement("button",{ style:( "position: relative;"+ "font-size: 18px;"+ "padding: 0px;"+ "line-height: 0px;"+ "border: 1px solid buttonshadow;"+ "height:16px; width:17px;"+ "background-color: buttonface;"+ "box-shadow:1px 1px buttonhighlight inset, -1px -1px buttonhighlight inset;"+ "vertical-align:middle;"+ ""//leave here ), onclick:function(){ self.toggleDropDown("_custom"); }, },[ createElement("span",{ textContent:"\u25BE", style:( "position: relative;"+ "left:-3px;"+ ""//leave here ) }) ]) ); //append the dropdown list this.node.appendChild(this._webSafe); this.node.appendChild(this._colorWords); this.node.appendChild(this._system); this.node.appendChild(this._custom); //append the colorbox before the textbox this.colorBox=createElement("div",{ style:( "background-color:"+this.text+";"+ "margin:0px 6px 0px 3px;"+ "border:1px solid black;"+ "width:20px; height:10px;"+ "vertical-align:middle;"+ "display:inline-block;"+ ""//leave here ), }); this.node.insertBefore(this.colorBox,this.textNode); this.textNode.style.verticalAlign="middle"; var oldOnChange=this.textNode.onchange||null; this.textNode.onchange=function(){ self.text=this.value; self.colorBox.style.backgroundColor=this.value; }; //return it if (self.causesValidation && self.onCreated) doAction(function(){self.onCreated(self);}); return self; }catch(e){log("jsForms.colorPicker.init: "+e);}}, //tabcontrol inner control tabPage:function(params){try{ var self=this; params=params||{}; //attach basic elements self=extend(self,new jsForms.visualElement() ); //make sure we know our parent this.parent=params.parent||null; delete params.parent; //defaults this._text=""; this._image=""; //this._autoScroll=true; this._showImage=true; this.buttonNode=null; this.imageNode=null; this.textNode=null; this.pageNode=null; this._drawStyle="block"; //set the text shown in the tab button this.__defineGetter__("text", function(){ return this._text; }); this.__defineSetter__("text", function(v){try{ this._text = (v.toString()); if (this.textNode) this.textNode.textContent=this._text; }catch(e){log("jsForms.tabPage.text: "+e);}}); //return if the parent knows we are selected this.__defineGetter__("selected", function(){ return (this.parent._selectedTab===this); }); //set the image shown in the tab button this.__defineGetter__("image", function(){ return this._image; }); this.__defineSetter__("image", function(v){try{ this._image = ((v||"").toString()); if (this.imageNode) { this.imageNode.src=this._image; this.imageNode.className= this.imageNode.className[((this._showImage && (this._image||this._imageClass))?"remove":"add")+"Word"]("jsfHidden"); } }catch(e){log("jsForms.tabPage.image: "+e);}}); //image className this.__defineGetter__("imageClass", function(){ return this._imageClass; }); this.__defineSetter__("imageClass", function(v){try{ var oldClass=this._imageClass; this._imageClass = ((v||"").toString()); if (this.imageNode) { this.imageNode.className= this.imageNode.className.removeWord(oldClass).addWord(this._imageClass); } }catch(e){log("jsForms.tabPage.imageClass: "+e);}}); //show/hide the tab button image this.__defineGetter__("showImage", function(){ return this._showImage; }); this.__defineSetter__("showImage", function(v){try{ this._showImage = cBool(v); if (this.imageNode) { this.imageNode.className= this.imageNode.className[((this._showImage && (this._image||this._imageClass))?"remove":"add")+"Word"]("jsfHidden"); } }catch(e){log("jsForms.tabPage.showImage: "+e);}}); //select tab this.select=function(){ this.parent.selectTab(this); } //init var selected=params.selected||false; delete params.selected; var content=params.content||null; delete params.content; for (var p in params) this[p]=params[p]; //draw it if (this.parent) { //add button to parent node this.parent.tabsNode.appendChild( this.buttonNode=createElement("div",{ className:"jsfTab", style:( ""//leave here ), onclick:function(){self.select();}, },[ this.imageNode=createElement("img",{ className:this._imageClass+((this._showImage && (this._image||this._imageClass))?"":" jsfHidden"), style:( ""//leave here ), src:this._image||"", }), this.textNode=createElement("div",{ textContent:this._text.upperWords(), style:( ""//leave here ), }), ]) ); //add page to parent node if (content) { if (!isArray(content)) content=[content]; for (var i=0,contentNode;(contentNode=content[i]);i++){ this.node.appendChild(contentNode); } } this.parent.pagesNode.appendChild(this.node); this.pageNode=this.node; //make selected if needed this.hide(); this.dock=this._dock; if (selected) this.select(); } //return it if (self.causesValidation && self.onCreated) doAction(function(){self.onCreated(self);}); return self; }catch(e){log("jsForms.tabPage.init: "+e);}}, //tabcontrol uppermost control tabControl:function(params){try{ var self=this; params=params||{}; //attach basic elements self=extend(self,new jsForms.visualElement() ); //defaults this._alignment="top"; //[top, left, right, bottom] //this._appearance="normal"; //[normal,buttons,flat buttons] this._hotTrack=true; //mouseover glow on buttons this._multiLine=false; //allow multiple lines of tabs //this._sizeMode="normal"; //[normal,fixed,filltoright] this._shareSinglePage=false; //all tabs use the same pageNode this.tabs=[]; this.tabsNode=null; this.pagesNode=null; this._selectedTab=null; this.node.className=this.node.className.addWord("jsfTabControl hotTrack"); this.sharedPageNode=null; //container for shared tabPage this.preventAutoSelectTab=false; //subStyle this.__defineGetter__("subStyle", function(){ return this._subStyle; }); this.__defineSetter__("subStyle", function(v){try{ this.node.className=this.node.className.removeWord(this._subStyle); this._subStyle = (v.toString()); this.node.className=this.node.className.addWord(this._subStyle); }catch(e){log("jsForms.tabControl.subStyle: "+e);}}); //tabs alignment this.__defineGetter__("alignment", function(){ return this._alignment; }); this.__defineSetter__("alignment", function(v){try{ this._alignment = (v.toString().toLowerCase().upperWords()); //remove all alignment css words this.node.className=this.node.className.removeWord(["alignTop","alignLeft","alignBottom","alignRight"]); this.node.className=this.node.className.addWord("align"+this._alignment); this.redraw(); }catch(e){log("jsForms.tabControl.alignment: "+e);}}); //tab bar hot tracking this.__defineGetter__("hotTrack", function(){ return this._hotTrack; }); this.__defineSetter__("hotTrack", function(v){try{ this._hotTrack = cBool(v); this.node.className=this.node.className[((this._hotTrack)?"add":"remove")+"Word"]("hotTrack"); }catch(e){log("jsForms.tabControl.hotTrack: "+e);}}); //use a single tabPage for all tabs this.__defineGetter__("shareSinglePage", function(){ return this._shareSinglePage; }); this.__defineSetter__("shareSinglePage", function(v){try{ this._shareSinglePage = cBool(v); }catch(e){log("jsForms.tabControl.shareSinglePage: "+e);}}); //select tab by index or by passed object this.selectTab=function(v){try{ var lastSelected=this._selectedTab; switch(typeof v){ case "object": this._selectedTab=v; break; case "number": this._selectedTab=this.tabs[v]; break; } //move the selected tab forward, unselected backward if (lastSelected) { if (!this._shareSinglePage) lastSelected.hide(); with (lastSelected.buttonNode) { className=className.removeWord("selected"); } } if (!this._shareSinglePage) this._selectedTab.show(); with (this._selectedTab.buttonNode) { className=className.addWord("selected"); } //do onSelect event if (this._selectedTab.onSelect) { this._selectedTab.onSelect(this._selectedTab); } }catch(e){log("jsForms.tabControl.selectTab: "+e);}}; //capture the sizes we need for this tabcontrol //and redraw its borders this.redraw=function(){try{ //reset self first this.dock=this._dock; //pages fit this minus the tabs bar this.pagesNode.style.height= (this._alignment=="Top" || this._alignment=="Bottom")?( this.innerHeight - elementOuterHeight(this.tabsNode) - ( elementOuterHeight(this.pagesNode) - elementInnerHeight(this.pagesNode) ) + "px" ):( this.innerHeight -( elementOuterHeight(this.pagesNode) - elementInnerHeight(this.pagesNode) ) + "px" ); this.pagesNode.style.width= (this._alignment=="Left" || this._alignment=="Right")?( this.innerWidth - elementOuterWidth(this.tabsNode) - ( elementOuterWidth(this.pagesNode) - elementInnerWidth(this.pagesNode) ) + "px" ):("");//automatic //order the tabs in relation to the pages based on alignment if (this._alignment=="Bottom" || this._alignment=="Right"){ this.node.insertBefore(this.pagesNode,this.tabsNode); } else { this.node.insertBefore(this.tabsNode,this.pagesNode); } }catch(e){log("jsForms.tabControl.redraw: "+e);}}; //addTab using tab construction params this.addTab=function(params){try{ params.parent=this; var tab; this.tabs.push(tab=new jsForms.tabPage(params)); return tab; }catch(e){log("jsForms.tabControl.addTab: "+e);}}; //removeTab using tab object reference this.removeTab=function(tab){try{ this.tabs.removeByValue(tab); remove(tab.node); }catch(e){log("jsForms.tabControl.removeTab: "+e);}}; //create tab button container this.node.appendChild( this.tabsNode=createElement("div",{ className:"tabs", style:( ((!this._multiLine)?"overflow: hidden;":"")+ //(!this._multiLine)?"height:24px;":""+ //"width:"+(parseInt(this.size.width)-5)+"px;"+ ""//leave here ), }) ); //append tab page container this.node.appendChild( this.pagesNode=createElement("div",{ className:"pages", style:( ((this._autoFit)?"display:block;":"")+ //(!this._multiLine && this.size.height)?"height:"+(parseInt(this.size.height)-32)+"px;":""+ ""//leave here ), }) ); //append a shared tabPage if required this._shareSinglePage=params.shareSinglePage||false; if (this._shareSinglePage){ var content=params.sharedContent; delete params.sharedContent; if (content) { if (!isArray(content)) content=[content]; } this.pagesNode.appendChild( this.sharedPageNode=createElement("div",{},content) ); } //init the tabs if (isArrayAndNotEmpty(params.tabs)) { for (var i=0,tab;(tab=params.tabs[i]);i++) { this.addTab(tab); } //select an initial tab if none already selected var autoTab=!(params.preventAutoSelectTab||false); if (autoTab && !this._selectedTab) this.selectTab(0); } delete params.tabs; //init the rest for (var p in params) this[p]=params[p]; //draw this.alignment=this._alignment; //and it redraws here //return it if (self.causesValidation && self.onCreated) doAction(function(){self.onCreated(self);}); return self; }catch(e){log("jsForms.tabControl.init: "+e);}}, //coolBar version of tabcontrol coolBar:function(params){try{ var self=this; params=params||{}; params.hotTrack=true; params.subStyle="coolBar"; //attach basic elements //this is basically the exact same thing as a tabcontrol self=extend(self,new jsForms.tabControl(params) ); //return it if (self.causesValidation && self.onCreated) doAction(function(){self.onCreated(self);}); return self; }catch(e){log("jsForms.coolBar.init: "+e);}}, //treeview inner controls treeNode:function(params){try{ var self=this; params=params||{}; //attach basic elements self=extend(self,new jsForms.visualElement() ); //defaults this._text=""; this._checked=false; this._image=""; this._selected=false; this.TreeView=null; //fullPath //getNodeCount //full count of child tree nodes //level //depth in the tree //remove //isEditing //toggle (expanded/collapsed) //edit label this.beginEdit=function(){ }; this.endEdit=function(){ }; //expand/collapse (with children) this.expand=function(ignoreChildren){ }; this.collapse=function(ignoreChildren){ }; //copy this.clone=function(){ }; //open parent nodes and scroll into view this.ensureVisible=function(){ }; //init for (var p in params) this[p]=params[p]; //return it if (self.causesValidation && self.onCreated) doAction(function(){self.onCreated(self);}); return self; }catch(e){log("jsForms.treeNode.init: "+e);}}, //treeview uppermost control treeView:function(params){try{ var self=this; params=params||{}; //attach basic elements self=extend(self, new jsForms.visualElement() ); //defaults this._checkBoxes=false; //show checkboxes at nodes this._fullRowSelect=false; //highlight the entire child this._hotTracking=true; this._indent="28px"; this._labelEdit=false; //allow edit of labels on node this._nodes=[]; this._pathSeparator="\\"; this._scrollable=true; this._showLines=false; //show node lines this._showPlusMinus=true; this._showRootLines=true; this._sortBy="value"; this._sortOrder="asc"; //get the dropdown sub object this.__defineGetter__("hasChildren", function(){ return (this._nodes.length>0); }); //add remove nodes this.addRoot=function(node){ //draw it //add it this._nodes.push(node); }; //expand/collapse nodes this.collapseAll=function(){ for (var i=0,child;(child=this._nodes[i]);i++) child.collapseAll(); }; this.expandAll=function(){ for (var i=0,child;(child=this._nodes[i]);i++) child.expandAll(); }; //sort nodes this.sort=function(){ }; //init for (var p in params) this[p]=params[p]; //return it if (self.causesValidation && self.onCreated) doAction(function(){self.onCreated(self);}); return self; }catch(e){log("jsForms.treeView.init: "+e);}}, }; /*to do list dropDown: simplified comboBox with only one item selectable checkedListBox: uses listBox and assumes checks based on bound data or simple input checkedDropDown: uses comboBox and assumes checks bindToData function checkbox: check-image-text ordering/layout checkbox: check hidden */ //JSON-ready testing page if (window.location.href.match(/^(http:\/\/www\.facebook\.com\/test)/) || window.location.href.match(/^(file:\/\/\/C:\/Users\/Charlie\/Desktop)/) ) { var textBox = new jsForms.textBox({ text:"hello world", backColor:"window", foreColor:"windowtext", font:'"Bebas Neue","League Gothic",Haettenschweiler,"Arial Narrow",sans-serif', //borderStyle:"Fixed3D", borderRadius:{topLeft:"5px", bottomRight:"5px"}, onChange:function(o){ confirm(o.text); }, }); document.documentElement.appendChild(textBox.node,document.documentElement.childNodes[0]); var spinBox = new jsForms.spinBox({ text:"3", backColor:"window", foreColor:"windowtext", minimum:0, maximum:10, rollOver:true, increment:1, }); document.documentElement.appendChild(spinBox.node,document.documentElement.childNodes[0]); var checkBox = new jsForms.checkBox({ text:"hello world", value:"1", checked:true, font:'"Bebas Neue","League Gothic",Haettenschweiler,"Arial Narrow",sans-serif', onChange:function(o){ confirm(o.checked); }, }); document.documentElement.appendChild(checkBox.node,document.documentElement.childNodes[0]); var listBox = new jsForms.listBox({ font:'"Bebas Neue","League Gothic",Haettenschweiler,"Arial Narrow",sans-serif', onChange:function(o){ //confirm(o.value); }, items:[ new jsForms.checkBox({text:"hello world"}), new jsForms.checkBox({text:"hello moon"}), new jsForms.checkBox({text:"goodnight moon"}), ], borderStyle:"Fixed3D", firstItemSelectsAll:true, explicitClose:true, }); document.documentElement.appendChild(listBox.node,document.documentElement.childNodes[0]); var postParts = { //derived from post.testData //this stuff is created in the main.which call //so if that is not called yet, each will be undefined "title":"The title of a post contains the bold text, usually including the poster's name, at the top of the post.", "msg":"The msg of a post is the part the poster added as a comment.", "caption":"The caption of a post is one of two lines just below the title.", "desc":"The desc of a post is one of two lines just below the title.", "link":"The link of a post is just the ORIGINAL link text, not the url.", "url":"The url of a post is the address to which the post redirects the user when clicked.", "img":"The img of a post is the url of the icon that displays with the post.", "fromName":"The fromName is the name of the poster.", "fromID":"The fromID is the ID of the poster.", "targetName":"The targetName is a list of targets the poster intended the post to display to.", "targetID":"The targetID is a list of targets' IDs that the poster intended the post to display to.", "canvas":"The canvas of a post is location of the game code.", "likeName":"The likeName is a list of names of users who liked this post.", "likeID":"The likeID is a list of IDs of users who liked the post.", "comments":"The comments is a list of all comments made to the post, excluding the initial msg.", "commentorName":"The commentorName is a list of names of all commentors.", "commentorID":"The commentorID is a list of IDs of all commentors.", "body":"The body of a post is a compilation of the title, caption, and desc.", "either":"The either of a post is the compilation of the link and body.", "html":"The html of a post is the compilation of ALL visible FB attributes.", //right from the post object "which":"The which of a post is its identified codename. The codename starts with an appID and ends with something the sidekick developer uses to key the bonus type.", "idText":"The identified link text of a post.", "date":"The date of a post is its creation time on FB. This time is read as a unix date.", //read as unix time "status":"The status of a post is the return code created by the sidekick.", "priority":"The priority of a post is set by the prioritizer.", "appID":"The appID of the game for which this post belongs.", "appName":"The appName of the game for which this post belongs, as reported by the FB database.", "isStale":"Reports if a post is older than the user-set older limit.", "isScam":"Reports if a post is suspected of being a scam. Usually if the canvas and appName do not match.", "isCollect":"Reports if the post is set to be collected.", "isExcluded":"Reports if the post has been set as excluded.", "isFailed":"Reports if the post is set as having already failed.", "isAccepted":"Reports if the post is set as having already been successfully collected.", "isPaused":"Reports if the post's bonus type or app has been paused by the prioritizer. Paused objects to not process for collection.", "isPinned":"Reports if the post is marked as being pinned.", "isLiked":"Reports if the post has been identified as already being liked by the current user.", "isMyPost":"Reports if the post belongs to the current user.", "isUndefined":"Reports if the post does not match any id given by the sidekick.", "isWishlist":"Reports if the post is deemed a whichlist request.", "isTimeout":"Reports if the post has been marked as a timed out collection try.", "isW2W":"Reports if the post is a Wall-To-Wall post, meaning that it was posted to a specific user's wall.", "isForMe":"Reports if the W2W post targets the current user." }; var search=["body"]; var comboBox = new jsForms.comboBox({ font:'"Bebas Neue","League Gothic",Haettenschweiler,"Arial Narrow",sans-serif', onChange:function(o){ GM_log("combo changed"); }, items:(function(){ var ret=[]; for (var i in postParts){ ret.push(new jsForms.checkBox({ text:i, value:i, toolTipText:postParts[i], checked:(search.inArray(i)), size:{width:"200%"}, })); } return ret; })(), borderStyle:"Fixed3D", borderRadius:{topLeft:"1px", bottomRight:"1px",topRight:"1px",bottomLeft:"1px"}, explicitClose:true, highlightSelected:true, dropDownSize:{height:"200px"}, sorted:true, }); document.documentElement.appendChild(comboBox.node,document.documentElement.childNodes[0]); //just a divider document.documentElement.appendChild(createElement("div")); var myConsole={}; var tabControl = new jsForms.tabControl({ //font:'"Bebas Neue","League Gothic",Haettenschweiler,"Arial Narrow",sans-serif', tabs:[ { text:"Tabs", image:"file:///C:/Users/Charlie/Documents/From%20Disk%202/Wikia%20Frontwall/selLast.png", //selected:true, content:createElement("div",{},[ createElement("label",{textContent:"Alignment: "}), createElement("select",{ onchange:function(){ tabControl.alignment=this.value; }, },optionsFromArray([ "Top","Right","Bottom","Left" ])), createElement("br"), createElement("label",{textContent:"hotTrack: "}), createElement("select",{ onchange:function(){ tabControl.hotTrack=this.value; }, },optionsFromArray([ "false","true" ])), createElement("br"), createElement("label",{textContent:"subStyle: "}), createElement("select",{ onchange:function(){ tabControl.subStyle=this.value; }, },optionsFromArray([ "normal","coolBar" ])), ]) }, { text:"red phone", image:"file:///C:/Users/Charlie/Documents/From%20Disk%202/Wikia%20Frontwall/red%20phone%20128.png", }, { text:"firefox", image:"file:///C:/Users/Charlie/Documents/From%20Disk%202/Wikia%20Frontwall/firefox_icon.png", }, ], dock:"fill", }); (myConsole.phoneTab=tabControl.tabs[1]).node.appendChild( new jsForms.textBox().node ); (myConsole.ffTab=tabControl.tabs[2]).node.textContent="FireFox is the best!"; document.documentElement.appendChild( createElement("div",{ style:( "height:500px;"+ ""//leave here ), },[ tabControl.node ]) ); tabControl.redraw(); var colorPicker = new jsForms.colorPicker({ borderStyle:"none", dropDownSize:{height:"200px"}, sorted:true, text:"", }); document.documentElement.appendChild(colorPicker.node,document.documentElement.childNodes[0]); }; //add own css try{addGlobalStyle(jsForms.globalStyle(),"jsForms");}catch(e){log("jsForms.addGlobalStyle: "+e);}; })();