- this.fireEvent('bodyresize', this, w, h);\r
- }\r
- this.syncShadow();\r
- },\r
-\r
- // private\r
- adjustBodyHeight : function(h){\r
- return h;\r
- },\r
-\r
- // private\r
- adjustBodyWidth : function(w){\r
- return w;\r
- },\r
-\r
- // private\r
- onPosition : function(){\r
- this.syncShadow();\r
- },\r
-\r
- \r
- getFrameWidth : function(){\r
- var w = this.el.getFrameWidth('lr');\r
-\r
- if(this.frame){\r
- var l = this.bwrap.dom.firstChild;\r
- w += (Ext.fly(l).getFrameWidth('l') + Ext.fly(l.firstChild).getFrameWidth('r'));\r
- var mc = this.bwrap.dom.firstChild.firstChild.firstChild;\r
- w += Ext.fly(mc).getFrameWidth('lr');\r
- }\r
- return w;\r
- },\r
-\r
- \r
- getFrameHeight : function(){\r
- var h = this.el.getFrameWidth('tb');\r
- h += (this.tbar ? this.tbar.getHeight() : 0) +\r
- (this.bbar ? this.bbar.getHeight() : 0);\r
-\r
- if(this.frame){\r
- var hd = this.el.dom.firstChild;\r
- var ft = this.bwrap.dom.lastChild;\r
- h += (hd.offsetHeight + ft.offsetHeight);\r
- var mc = this.bwrap.dom.firstChild.firstChild.firstChild;\r
- h += Ext.fly(mc).getFrameWidth('tb');\r
- }else{\r
- h += (this.header ? this.header.getHeight() : 0) +\r
- (this.footer ? this.footer.getHeight() : 0);\r
- }\r
- return h;\r
- },\r
-\r
- \r
- getInnerWidth : function(){\r
- return this.getSize().width - this.getFrameWidth();\r
- },\r
-\r
- \r
- getInnerHeight : function(){\r
- return this.getSize().height - this.getFrameHeight();\r
- },\r
-\r
- // private\r
- syncShadow : function(){\r
- if(this.floating){\r
- this.el.sync(true);\r
- }\r
- },\r
-\r
- // private\r
- getLayoutTarget : function(){\r
- return this.body;\r
- },\r
-\r
- \r
- setTitle : function(title, iconCls){\r
- this.title = title;\r
- if(this.header && this.headerAsText){\r
- this.header.child('span').update(title);\r
- }\r
- if(iconCls){\r
- this.setIconClass(iconCls);\r
- }\r
- this.fireEvent('titlechange', this, title);\r
- return this;\r
- },\r
-\r
- \r
- getUpdater : function(){\r
- return this.body.getUpdater();\r
- },\r
-\r
- \r
- load : function(){\r
- var um = this.body.getUpdater();\r
- um.update.apply(um, arguments);\r
- return this;\r
- },\r
-\r
- // private\r
- beforeDestroy : function(){\r
- if(this.header){\r
- this.header.removeAllListeners();\r
- if(this.headerAsText){\r
- Ext.Element.uncache(this.header.child('span'));\r
- }\r
- }\r
- Ext.Element.uncache(\r
- this.header,\r
- this.tbar,\r
- this.bbar,\r
- this.footer,\r
- this.body,\r
- this.bwrap\r
- );\r
- if(this.tools){\r
- for(var k in this.tools){\r
- Ext.destroy(this.tools[k]);\r
- }\r
- }\r
- if(this.buttons){\r
- for(var b in this.buttons){\r
- Ext.destroy(this.buttons[b]);\r
- }\r
- }\r
- Ext.destroy(\r
- this.topToolbar,\r
- this.bottomToolbar\r
- );\r
- Ext.Panel.superclass.beforeDestroy.call(this);\r
- },\r
-\r
- // private\r
- createClasses : function(){\r
- this.headerCls = this.baseCls + '-header';\r
- this.headerTextCls = this.baseCls + '-header-text';\r
- this.bwrapCls = this.baseCls + '-bwrap';\r
- this.tbarCls = this.baseCls + '-tbar';\r
- this.bodyCls = this.baseCls + '-body';\r
- this.bbarCls = this.baseCls + '-bbar';\r
- this.footerCls = this.baseCls + '-footer';\r
- },\r
-\r
- // private\r
- createGhost : function(cls, useShim, appendTo){\r
- var el = document.createElement('div');\r
- el.className = 'x-panel-ghost ' + (cls ? cls : '');\r
- if(this.header){\r
- el.appendChild(this.el.dom.firstChild.cloneNode(true));\r
- }\r
- Ext.fly(el.appendChild(document.createElement('ul'))).setHeight(this.bwrap.getHeight());\r
- el.style.width = this.el.dom.offsetWidth + 'px';;\r
- if(!appendTo){\r
- this.container.dom.appendChild(el);\r
- }else{\r
- Ext.getDom(appendTo).appendChild(el);\r
- }\r
- if(useShim !== false && this.el.useShim !== false){\r
- var layer = new Ext.Layer({shadow:false, useDisplay:true, constrain:false}, el);\r
- layer.show();\r
- return layer;\r
- }else{\r
- return new Ext.Element(el);\r
- }\r
- },\r
-\r
- // private\r
- doAutoLoad : function(){\r
- this.body.load(\r
- typeof this.autoLoad == 'object' ?\r
- this.autoLoad : {url: this.autoLoad});\r
- },\r
- \r
- \r
- getTool: function(id) {\r
- return this.tools[id];\r
- }\r
-\r
-\r
-});\r
-Ext.reg('panel', Ext.Panel);\r
-\r
-\r
-Ext.Window = Ext.extend(Ext.Panel, {\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- baseCls : 'x-window',\r
- \r
- resizable:true,\r
- \r
- draggable:true,\r
- \r
- closable : true,\r
- \r
- constrain:false,\r
- \r
- constrainHeader:false,\r
- \r
- plain:false,\r
- \r
- minimizable : false,\r
- \r
- maximizable : false,\r
- \r
- minHeight: 100,\r
- \r
- minWidth: 200,\r
- \r
- expandOnShow: true,\r
- \r
- closeAction: 'close',\r
- \r
- elements: 'header,body',\r
-\r
- // inherited docs, same default\r
- collapsible:false,\r
-\r
- // private\r
- initHidden : true,\r
- \r
- monitorResize : true,\r
- \r
- frame:true,\r
- \r
- floating:true,\r
-\r
- // private\r
- initComponent : function(){\r
- Ext.Window.superclass.initComponent.call(this);\r
- this.addEvents(\r
- \r
- \r
- \r
- 'resize',\r
- \r
- 'maximize',\r
- \r
- 'minimize',\r
- \r
- 'restore'\r
- );\r
- },\r
-\r
- // private\r
- getState : function(){\r
- return Ext.apply(Ext.Window.superclass.getState.call(this) || {}, this.getBox());\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- Ext.Window.superclass.onRender.call(this, ct, position);\r
-\r
- if(this.plain){\r
- this.el.addClass('x-window-plain');\r
- }\r
-\r
- // this element allows the Window to be focused for keyboard events\r
- this.focusEl = this.el.createChild({\r
- tag: "a", href:"#", cls:"x-dlg-focus",\r
- tabIndex:"-1", html: " "});\r
- this.focusEl.swallowEvent('click', true);\r
-\r
- this.proxy = this.el.createProxy("x-window-proxy");\r
- this.proxy.enableDisplayMode('block');\r
-\r
- if(this.modal){\r
- this.mask = this.container.createChild({cls:"ext-el-mask"}, this.el.dom);\r
- this.mask.enableDisplayMode("block");\r
- this.mask.hide();\r
- this.mask.on('click', this.focus, this);\r
- }\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- Ext.Window.superclass.initEvents.call(this);\r
- if(this.animateTarget){\r
- this.setAnimateTarget(this.animateTarget);\r
- }\r
-\r
- if(this.resizable){\r
- this.resizer = new Ext.Resizable(this.el, {\r
- minWidth: this.minWidth,\r
- minHeight:this.minHeight,\r
- handles: this.resizeHandles || "all",\r
- pinned: true,\r
- resizeElement : this.resizerAction\r
- });\r
- this.resizer.window = this;\r
- this.resizer.on("beforeresize", this.beforeResize, this);\r
- }\r
-\r
- if(this.draggable){\r
- this.header.addClass("x-window-draggable");\r
- }\r
- this.initTools();\r
-\r
- this.el.on("mousedown", this.toFront, this);\r
- this.manager = this.manager || Ext.WindowMgr;\r
- this.manager.register(this);\r
- this.hidden = true;\r
- if(this.maximized){\r
- this.maximized = false;\r
- this.maximize();\r
- }\r
- if(this.closable){\r
- var km = this.getKeyMap();\r
- km.on(27, this.onEsc, this);\r
- km.disable();\r
- }\r
- },\r
-\r
- initDraggable : function(){\r
- \r
- this.dd = new Ext.Window.DD(this);\r
- },\r
-\r
- // private\r
- onEsc : function(){\r
- this[this.closeAction]();\r
- },\r
-\r
- // private\r
- beforeDestroy : function(){\r
- this.hide();\r
- if(this.doAnchor){\r
- Ext.EventManager.removeResizeListener(this.doAnchor, this);\r
- Ext.EventManager.un(window, 'scroll', this.doAnchor, this);\r
- }\r
- Ext.destroy(\r
- this.focusEl,\r
- this.resizer,\r
- this.dd,\r
- this.proxy,\r
- this.mask\r
- );\r
- Ext.Window.superclass.beforeDestroy.call(this);\r
- },\r
-\r
- // private\r
- onDestroy : function(){\r
- if(this.manager){\r
- this.manager.unregister(this);\r
- }\r
- Ext.Window.superclass.onDestroy.call(this);\r
- },\r
-\r
- // private\r
- initTools : function(){\r
- if(this.minimizable){\r
- this.addTool({\r
- id: 'minimize',\r
- handler: this.minimize.createDelegate(this, [])\r
- });\r
- }\r
- if(this.maximizable){\r
- this.addTool({\r
- id: 'maximize',\r
- handler: this.maximize.createDelegate(this, [])\r
- });\r
- this.addTool({\r
- id: 'restore',\r
- handler: this.restore.createDelegate(this, []),\r
- hidden:true\r
- });\r
- this.header.on('dblclick', this.toggleMaximize, this);\r
- }\r
- if(this.closable){\r
- this.addTool({\r
- id: 'close',\r
- handler: this[this.closeAction].createDelegate(this, [])\r
- });\r
- }\r
- },\r
-\r
- // private\r
- resizerAction : function(){\r
- var box = this.proxy.getBox();\r
- this.proxy.hide();\r
- this.window.handleResize(box);\r
- return box;\r
- },\r
-\r
- // private\r
- beforeResize : function(){\r
- this.resizer.minHeight = Math.max(this.minHeight, this.getFrameHeight() + 40); // 40 is a magic minimum content size?\r
- this.resizer.minWidth = Math.max(this.minWidth, this.getFrameWidth() + 40);\r
- this.resizeBox = this.el.getBox();\r
- },\r
-\r
- // private\r
- updateHandles : function(){\r
- if(Ext.isIE && this.resizer){\r
- this.resizer.syncHandleHeight();\r
- this.el.repaint();\r
- }\r
- },\r
-\r
- // private\r
- handleResize : function(box){\r
- var rz = this.resizeBox;\r
- if(rz.x != box.x || rz.y != box.y){\r
- this.updateBox(box);\r
- }else{\r
- this.setSize(box);\r
- }\r
- this.focus();\r
- this.updateHandles();\r
- this.saveState();\r
- if(this.layout){\r
- this.doLayout();\r
- }\r
- this.fireEvent("resize", this, box.width, box.height);\r
- },\r
-\r
- \r
- focus : function(){\r
- var f = this.focusEl, db = this.defaultButton, t = typeof db;\r
- if(t != 'undefined'){\r
- if(t == 'number'){\r
- f = this.buttons[db];\r
- }else if(t == 'string'){\r
- f = Ext.getCmp(db);\r
- }else{\r
- f = db;\r
- }\r
- }\r
- f.focus.defer(10, f);\r
- },\r
-\r
- \r
- setAnimateTarget : function(el){\r
- el = Ext.get(el);\r
- this.animateTarget = el;\r
- },\r
-\r
- // private\r
- beforeShow : function(){\r
- delete this.el.lastXY;\r
- delete this.el.lastLT;\r
- if(this.x === undefined || this.y === undefined){\r
- var xy = this.el.getAlignToXY(this.container, 'c-c');\r
- var pos = this.el.translatePoints(xy[0], xy[1]);\r
- this.x = this.x === undefined? pos.left : this.x;\r
- this.y = this.y === undefined? pos.top : this.y;\r
- }\r
- this.el.setLeftTop(this.x, this.y);\r
-\r
- if(this.expandOnShow){\r
- this.expand(false);\r
- }\r
-\r
- if(this.modal){\r
- Ext.getBody().addClass("x-body-masked");\r
- this.mask.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));\r
- this.mask.show();\r
- }\r
- },\r
-\r
- \r
- show : function(animateTarget, cb, scope){\r
- if(!this.rendered){\r
- this.render(Ext.getBody());\r
- }\r
- if(this.hidden === false){\r
- this.toFront();\r
- return;\r
- }\r
- if(this.fireEvent("beforeshow", this) === false){\r
- return;\r
- }\r
- if(cb){\r
- this.on('show', cb, scope, {single:true});\r
- }\r
- this.hidden = false;\r
- if(animateTarget !== undefined){\r
- this.setAnimateTarget(animateTarget);\r
- }\r
- this.beforeShow();\r
- if(this.animateTarget){\r
- this.animShow();\r
- }else{\r
- this.afterShow();\r
- }\r
- },\r
-\r
- // private\r
- afterShow : function(){\r
- this.proxy.hide();\r
- this.el.setStyle('display', 'block');\r
- this.el.show();\r
- if(this.maximized){\r
- this.fitContainer();\r
- }\r
- if(Ext.isMac && Ext.isGecko){ // work around stupid FF 2.0/Mac scroll bar bug\r
- this.cascade(this.setAutoScroll);\r
- }\r
-\r
- if(this.monitorResize || this.modal || this.constrain || this.constrainHeader){\r
- Ext.EventManager.onWindowResize(this.onWindowResize, this);\r
- }\r
- this.doConstrain();\r
- if(this.layout){\r
- this.doLayout();\r
- }\r
- if(this.keyMap){\r
- this.keyMap.enable();\r
- }\r
- this.toFront();\r
- this.updateHandles();\r
- this.fireEvent("show", this);\r
- },\r
-\r
- // private\r
- animShow : function(){\r
- this.proxy.show();\r
- this.proxy.setBox(this.animateTarget.getBox());\r
- this.proxy.setOpacity(0);\r
- var b = this.getBox(false);\r
- b.callback = this.afterShow;\r
- b.scope = this;\r
- b.duration = .25;\r
- b.easing = 'easeNone';\r
- b.opacity = .5;\r
- b.block = true;\r
- this.el.setStyle('display', 'none');\r
- this.proxy.shift(b);\r
- },\r
-\r
- \r
- hide : function(animateTarget, cb, scope){\r
- if(this.activeGhost){ // drag active?\r
- this.hide.defer(100, this, [animateTarget, cb, scope]);\r
- return;\r
- }\r
- if(this.hidden || this.fireEvent("beforehide", this) === false){\r
- return;\r
- }\r
- if(cb){\r
- this.on('hide', cb, scope, {single:true});\r
- }\r
- this.hidden = true;\r
- if(animateTarget !== undefined){\r
- this.setAnimateTarget(animateTarget);\r
- }\r
- if(this.animateTarget){\r
- this.animHide();\r
- }else{\r
- this.el.hide();\r
- this.afterHide();\r
- }\r
- },\r
-\r
- // private\r
- afterHide : function(){\r
- this.proxy.hide();\r
- if(this.monitorResize || this.modal || this.constrain || this.constrainHeader){\r
- Ext.EventManager.removeResizeListener(this.onWindowResize, this);\r
- }\r
- if(this.modal){\r
- this.mask.hide();\r
- Ext.getBody().removeClass("x-body-masked");\r
- }\r
- if(this.keyMap){\r
- this.keyMap.disable();\r
- }\r
- this.fireEvent("hide", this);\r
- },\r
-\r
- // private\r
- animHide : function(){\r
- this.proxy.setOpacity(.5);\r
- this.proxy.show();\r
- var tb = this.getBox(false);\r
- this.proxy.setBox(tb);\r
- this.el.hide();\r
- var b = this.animateTarget.getBox();\r
- b.callback = this.afterHide;\r
- b.scope = this;\r
- b.duration = .25;\r
- b.easing = 'easeNone';\r
- b.block = true;\r
- b.opacity = 0;\r
- this.proxy.shift(b);\r
- },\r
-\r
- // private\r
- onWindowResize : function(){\r
- if(this.maximized){\r
- this.fitContainer();\r
- }\r
- if(this.modal){\r
- this.mask.setSize('100%', '100%');\r
- var force = this.mask.dom.offsetHeight;\r
- this.mask.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));\r
- }\r
- this.doConstrain();\r
- },\r
-\r
- // private\r
- doConstrain : function(){\r
- if(this.constrain || this.constrainHeader){\r
- var offsets;\r
- if(this.constrain){\r
- offsets = {\r
- right:this.el.shadowOffset,\r
- left:this.el.shadowOffset,\r
- bottom:this.el.shadowOffset\r
- };\r
- }else {\r
- var s = this.getSize();\r
- offsets = {\r
- right:-(s.width - 100),\r
- bottom:-(s.height - 25)\r
- };\r
- }\r
-\r
- var xy = this.el.getConstrainToXY(this.container, true, offsets);\r
- if(xy){\r
- this.setPosition(xy[0], xy[1]);\r
- }\r
- }\r
- },\r
-\r
- // private - used for dragging\r
- ghost : function(cls){\r
- var ghost = this.createGhost(cls);\r
- var box = this.getBox(true);\r
- ghost.setLeftTop(box.x, box.y);\r
- ghost.setWidth(box.width);\r
- this.el.hide();\r
- this.activeGhost = ghost;\r
- return ghost;\r
- },\r
-\r
- // private\r
- unghost : function(show, matchPosition){\r
- if(show !== false){\r
- this.el.show();\r
- this.focus();\r
- if(Ext.isMac && Ext.isGecko){ // work around stupid FF 2.0/Mac scroll bar bug\r
- this.cascade(this.setAutoScroll);\r
- }\r
- }\r
- if(matchPosition !== false){\r
- this.setPosition(this.activeGhost.getLeft(true), this.activeGhost.getTop(true));\r
- }\r
- this.activeGhost.hide();\r
- this.activeGhost.remove();\r
- delete this.activeGhost;\r
- },\r
-\r
- \r
- minimize : function(){\r
- this.fireEvent('minimize', this);\r
- },\r
-\r
- \r
- close : function(){\r
- if(this.fireEvent("beforeclose", this) !== false){\r
- this.hide(null, function(){\r
- this.fireEvent('close', this);\r
- this.destroy();\r
- }, this);\r
- }\r
- },\r
-\r
- \r
- maximize : function(){\r
- if(!this.maximized){\r
- this.expand(false);\r
- this.restoreSize = this.getSize();\r
- this.restorePos = this.getPosition(true);\r
- if (this.maximizable){\r
- this.tools.maximize.hide();\r
- this.tools.restore.show();\r
- }\r
- this.maximized = true;\r
- this.el.disableShadow();\r
-\r
- if(this.dd){\r
- this.dd.lock();\r
- }\r
- if(this.collapsible){\r
- this.tools.toggle.hide();\r
- }\r
- this.el.addClass('x-window-maximized');\r
- this.container.addClass('x-window-maximized-ct');\r
-\r
- this.setPosition(0, 0);\r
- this.fitContainer();\r
- this.fireEvent('maximize', this);\r
- }\r
- },\r
-\r
- \r
- restore : function(){\r
- if(this.maximized){\r
- this.el.removeClass('x-window-maximized');\r
- this.tools.restore.hide();\r
- this.tools.maximize.show();\r
- this.setPosition(this.restorePos[0], this.restorePos[1]);\r
- this.setSize(this.restoreSize.width, this.restoreSize.height);\r
- delete this.restorePos;\r
- delete this.restoreSize;\r
- this.maximized = false;\r
- this.el.enableShadow(true);\r
-\r
- if(this.dd){\r
- this.dd.unlock();\r
- }\r
- if(this.collapsible){\r
- this.tools.toggle.show();\r
- }\r
- this.container.removeClass('x-window-maximized-ct');\r
-\r
- this.doConstrain();\r
- this.fireEvent('restore', this);\r
- }\r
- },\r
-\r
- \r
- toggleMaximize : function(){\r
- this[this.maximized ? 'restore' : 'maximize']();\r
- },\r
-\r
- // private\r
- fitContainer : function(){\r
- var vs = this.container.getViewSize();\r
- this.setSize(vs.width, vs.height);\r
- },\r
-\r
- // private\r
- // z-index is managed by the WindowManager and may be overwritten at any time\r
- setZIndex : function(index){\r
- if(this.modal){\r
- this.mask.setStyle("z-index", index);\r
- }\r
- this.el.setZIndex(++index);\r
- index += 5;\r
-\r
- if(this.resizer){\r
- this.resizer.proxy.setStyle("z-index", ++index);\r
- }\r
-\r
- this.lastZIndex = index;\r
- },\r
-\r
- \r
- alignTo : function(element, position, offsets){\r
- var xy = this.el.getAlignToXY(element, position, offsets);\r
- this.setPagePosition(xy[0], xy[1]);\r
- return this;\r
- },\r
-\r
- \r
- anchorTo : function(el, alignment, offsets, monitorScroll){\r
- if(this.doAnchor){\r
- Ext.EventManager.removeResizeListener(this.doAnchor, this);\r
- Ext.EventManager.un(window, 'scroll', this.doAnchor, this);\r
- }\r
- this.doAnchor = function(){\r
- this.alignTo(el, alignment, offsets);\r
- };\r
- Ext.EventManager.onWindowResize(this.doAnchor, this);\r
- \r
- var tm = typeof monitorScroll;\r
- if(tm != 'undefined'){\r
- Ext.EventManager.on(window, 'scroll', this.doAnchor, this,\r
- {buffer: tm == 'number' ? monitorScroll : 50});\r
- }\r
- this.doAnchor();\r
- return this;\r
- },\r
-\r
- \r
- toFront : function(e){\r
- if(this.manager.bringToFront(this)){\r
- if(!e || !e.getTarget().focus){\r
- this.focus();\r
- }\r
- }\r
- return this;\r
- },\r
-\r
- \r
- setActive : function(active){\r
- if(active){\r
- if(!this.maximized){\r
- this.el.enableShadow(true);\r
- }\r
- this.fireEvent('activate', this);\r
- }else{\r
- this.el.disableShadow();\r
- this.fireEvent('deactivate', this);\r
- }\r
- },\r
-\r
- \r
- toBack : function(){\r
- this.manager.sendToBack(this);\r
- return this;\r
- },\r
-\r
- \r
- center : function(){\r
- var xy = this.el.getAlignToXY(this.container, 'c-c');\r
- this.setPagePosition(xy[0], xy[1]);\r
- return this;\r
- }\r
-\r
- \r
-});\r
-Ext.reg('window', Ext.Window);\r
-\r
-// private - custom Window DD implementation\r
-Ext.Window.DD = function(win){\r
- this.win = win;\r
- Ext.Window.DD.superclass.constructor.call(this, win.el.id, 'WindowDD-'+win.id);\r
- this.setHandleElId(win.header.id);\r
- this.scroll = false;\r
-};\r
-\r
-Ext.extend(Ext.Window.DD, Ext.dd.DD, {\r
- moveOnly:true,\r
- headerOffsets:[100, 25],\r
- startDrag : function(){\r
- var w = this.win;\r
- this.proxy = w.ghost();\r
- if(w.constrain !== false){\r
- var so = w.el.shadowOffset;\r
- this.constrainTo(w.container, {right: so, left: so, bottom: so});\r
- }else if(w.constrainHeader !== false){\r
- var s = this.proxy.getSize();\r
- this.constrainTo(w.container, {right: -(s.width-this.headerOffsets[0]), bottom: -(s.height-this.headerOffsets[1])});\r
- }\r
- },\r
- b4Drag : Ext.emptyFn,\r
-\r
- onDrag : function(e){\r
- this.alignElWithMouse(this.proxy, e.getPageX(), e.getPageY());\r
- },\r
-\r
- endDrag : function(e){\r
- this.win.unghost();\r
- this.win.saveState();\r
- }\r
-});\r
-\r
-\r
-Ext.WindowGroup = function(){\r
- var list = {};\r
- var accessList = [];\r
- var front = null;\r
-\r
- // private\r
- var sortWindows = function(d1, d2){\r
- return (!d1._lastAccess || d1._lastAccess < d2._lastAccess) ? -1 : 1;\r
- };\r
-\r
- // private\r
- var orderWindows = function(){\r
- var a = accessList, len = a.length;\r
- if(len > 0){\r
- a.sort(sortWindows);\r
- var seed = a[0].manager.zseed;\r
- for(var i = 0; i < len; i++){\r
- var win = a[i];\r
- if(win && !win.hidden){\r
- win.setZIndex(seed + (i*10));\r
- }\r
- }\r
- }\r
- activateLast();\r
- };\r
-\r
- // private\r
- var setActiveWin = function(win){\r
- if(win != front){\r
- if(front){\r
- front.setActive(false);\r
- }\r
- front = win;\r
- if(win){\r
- win.setActive(true);\r
- }\r
- }\r
- };\r
-\r
- // private\r
- var activateLast = function(){\r
- for(var i = accessList.length-1; i >=0; --i) {\r
- if(!accessList[i].hidden){\r
- setActiveWin(accessList[i]);\r
- return;\r
- }\r
- }\r
- // none to activate\r
- setActiveWin(null);\r
- };\r
-\r
- return {\r
- \r
- zseed : 9000,\r
-\r
- // private\r
- register : function(win){\r
- list[win.id] = win;\r
- accessList.push(win);\r
- win.on('hide', activateLast);\r
- },\r
-\r
- // private\r
- unregister : function(win){\r
- delete list[win.id];\r
- win.un('hide', activateLast);\r
- accessList.remove(win);\r
- },\r
-\r
- \r
- get : function(id){\r
- return typeof id == "object" ? id : list[id];\r
- },\r
-\r
- \r
- bringToFront : function(win){\r
- win = this.get(win);\r
- if(win != front){\r
- win._lastAccess = new Date().getTime();\r
- orderWindows();\r
- return true;\r
- }\r
- return false;\r
- },\r
-\r
- \r
- sendToBack : function(win){\r
- win = this.get(win);\r
- win._lastAccess = -(new Date().getTime());\r
- orderWindows();\r
- return win;\r
- },\r
-\r
- \r
- hideAll : function(){\r
- for(var id in list){\r
- if(list[id] && typeof list[id] != "function" && list[id].isVisible()){\r
- list[id].hide();\r
- }\r
- }\r
- },\r
-\r
- \r
- getActive : function(){\r
- return front;\r
- },\r
-\r
- \r
- getBy : function(fn, scope){\r
- var r = [];\r
- for(var i = accessList.length-1; i >=0; --i) {\r
- var win = accessList[i];\r
- if(fn.call(scope||win, win) !== false){\r
- r.push(win);\r
- }\r
- }\r
- return r;\r
- },\r
-\r
- \r
- each : function(fn, scope){\r
- for(var id in list){\r
- if(list[id] && typeof list[id] != "function"){\r
- if(fn.call(scope || list[id], list[id]) === false){\r
- return;\r
- }\r
- }\r
- }\r
- }\r
- };\r
-};\r
-\r
-\r
-\r
-Ext.WindowMgr = new Ext.WindowGroup();\r
-\r
-Ext.dd.PanelProxy = function(panel, config){\r
- this.panel = panel;\r
- this.id = this.panel.id +'-ddproxy';\r
- Ext.apply(this, config);\r
-};\r
-\r
-Ext.dd.PanelProxy.prototype = {\r
- \r
- insertProxy : true,\r
-\r
- // private overrides\r
- setStatus : Ext.emptyFn,\r
- reset : Ext.emptyFn,\r
- update : Ext.emptyFn,\r
- stop : Ext.emptyFn,\r
- sync: Ext.emptyFn,\r
-\r
- \r
- getEl : function(){\r
- return this.ghost;\r
- },\r
-\r
- \r
- getGhost : function(){\r
- return this.ghost;\r
- },\r
-\r
- \r
- getProxy : function(){\r
- return this.proxy;\r
- },\r
-\r
- \r
- hide : function(){\r
- if(this.ghost){\r
- if(this.proxy){\r
- this.proxy.remove();\r
- delete this.proxy;\r
- }\r
- this.panel.el.dom.style.display = '';\r
- this.ghost.remove();\r
- delete this.ghost;\r
- }\r
- },\r
-\r
- \r
- show : function(){\r
- if(!this.ghost){\r
- this.ghost = this.panel.createGhost(undefined, undefined, Ext.getBody());\r
- this.ghost.setXY(this.panel.el.getXY())\r
- if(this.insertProxy){\r
- this.proxy = this.panel.el.insertSibling({cls:'x-panel-dd-spacer'});\r
- this.proxy.setSize(this.panel.getSize());\r
- }\r
- this.panel.el.dom.style.display = 'none';\r
- }\r
- },\r
-\r
- // private\r
- repair : function(xy, callback, scope){\r
- this.hide();\r
- if(typeof callback == "function"){\r
- callback.call(scope || this);\r
- }\r
- },\r
-\r
- \r
- moveProxy : function(parentNode, before){\r
- if(this.proxy){\r
- parentNode.insertBefore(this.proxy.dom, before);\r
- }\r
- }\r
-};\r
-\r
-// private - DD implementation for Panels\r
-Ext.Panel.DD = function(panel, cfg){\r
- this.panel = panel;\r
- this.dragData = {panel: panel};\r
- this.proxy = new Ext.dd.PanelProxy(panel, cfg);\r
- Ext.Panel.DD.superclass.constructor.call(this, panel.el, cfg);\r
- var h = panel.header;\r
- if(h){\r
- this.setHandleElId(h.id);\r
- }\r
- (h ? h : this.panel.body).setStyle('cursor', 'move');\r
- this.scroll = false;\r
-};\r
-\r
-Ext.extend(Ext.Panel.DD, Ext.dd.DragSource, {\r
- showFrame: Ext.emptyFn,\r
- startDrag: Ext.emptyFn,\r
- b4StartDrag: function(x, y) {\r
- this.proxy.show();\r
- },\r
- b4MouseDown: function(e) {\r
- var x = e.getPageX();\r
- var y = e.getPageY();\r
- this.autoOffset(x, y);\r
- },\r
- onInitDrag : function(x, y){\r
- this.onStartDrag(x, y);\r
- return true;\r
- },\r
- createFrame : Ext.emptyFn,\r
- getDragEl : function(e){\r
- return this.proxy.ghost.dom;\r
- },\r
- endDrag : function(e){\r
- this.proxy.hide();\r
- this.panel.saveState();\r
- },\r
-\r
- autoOffset : function(x, y) {\r
- x -= this.startPageX;\r
- y -= this.startPageY;\r
- this.setDelta(x, y);\r
- }\r
-});\r
-\r
-Ext.state.Provider = function(){\r
- \r
- this.addEvents("statechange");\r
- this.state = {};\r
- Ext.state.Provider.superclass.constructor.call(this);\r
-};\r
-Ext.extend(Ext.state.Provider, Ext.util.Observable, {\r
- \r
- get : function(name, defaultValue){\r
- return typeof this.state[name] == "undefined" ?\r
- defaultValue : this.state[name];\r
- },\r
- \r
- \r
- clear : function(name){\r
- delete this.state[name];\r
- this.fireEvent("statechange", this, name, null);\r
- },\r
- \r
- \r
- set : function(name, value){\r
- this.state[name] = value;\r
- this.fireEvent("statechange", this, name, value);\r
- },\r
- \r
- \r
- decodeValue : function(cookie){\r
- var re = /^(a|n|d|b|s|o)\:(.*)$/;\r
- var matches = re.exec(unescape(cookie));\r
- if(!matches || !matches[1]) return; // non state cookie\r
- var type = matches[1];\r
- var v = matches[2];\r
- switch(type){\r
- case "n":\r
- return parseFloat(v);\r
- case "d":\r
- return new Date(Date.parse(v));\r
- case "b":\r
- return (v == "1");\r
- case "a":\r
- var all = [];\r
- var values = v.split("^");\r
- for(var i = 0, len = values.length; i < len; i++){\r
- all.push(this.decodeValue(values[i]));\r
- }\r
- return all;\r
- case "o":\r
- var all = {};\r
- var values = v.split("^");\r
- for(var i = 0, len = values.length; i < len; i++){\r
- var kv = values[i].split("=");\r
- all[kv[0]] = this.decodeValue(kv[1]);\r
- }\r
- return all;\r
- default:\r
- return v;\r
- }\r
- },\r
- \r
- \r
- encodeValue : function(v){\r
- var enc;\r
- if(typeof v == "number"){\r
- enc = "n:" + v;\r
- }else if(typeof v == "boolean"){\r
- enc = "b:" + (v ? "1" : "0");\r
- }else if(Ext.isDate(v)){\r
- enc = "d:" + v.toGMTString();\r
- }else if(Ext.isArray(v)){\r
- var flat = "";\r
- for(var i = 0, len = v.length; i < len; i++){\r
- flat += this.encodeValue(v[i]);\r
- if(i != len-1) flat += "^";\r
- }\r
- enc = "a:" + flat;\r
- }else if(typeof v == "object"){\r
- var flat = "";\r
- for(var key in v){\r
- if(typeof v[key] != "function" && v[key] !== undefined){\r
- flat += key + "=" + this.encodeValue(v[key]) + "^";\r
- }\r
- }\r
- enc = "o:" + flat.substring(0, flat.length-1);\r
- }else{\r
- enc = "s:" + v;\r
- }\r
- return escape(enc); \r
- }\r
-});\r
-\r
-\r
-Ext.state.Manager = function(){\r
- var provider = new Ext.state.Provider();\r
-\r
- return {\r
- \r
- setProvider : function(stateProvider){\r
- provider = stateProvider;\r
- },\r
-\r
- \r
- get : function(key, defaultValue){\r
- return provider.get(key, defaultValue);\r
- },\r
-\r
- \r
- set : function(key, value){\r
- provider.set(key, value);\r
- },\r
-\r
- \r
- clear : function(key){\r
- provider.clear(key);\r
- },\r
-\r
- \r
- getProvider : function(){\r
- return provider;\r
- }\r
- };\r
-}();\r
-\r
-\r
-Ext.state.CookieProvider = function(config){\r
- Ext.state.CookieProvider.superclass.constructor.call(this);\r
- this.path = "/";\r
- this.expires = new Date(new Date().getTime()+(1000*60*60*24*7)); //7 days\r
- this.domain = null;\r
- this.secure = false;\r
- Ext.apply(this, config);\r
- this.state = this.readCookies();\r
-};\r
-\r
-Ext.extend(Ext.state.CookieProvider, Ext.state.Provider, {\r
- // private\r
- set : function(name, value){\r
- if(typeof value == "undefined" || value === null){\r
- this.clear(name);\r
- return;\r
- }\r
- this.setCookie(name, value);\r
- Ext.state.CookieProvider.superclass.set.call(this, name, value);\r
- },\r
-\r
- // private\r
- clear : function(name){\r
- this.clearCookie(name);\r
- Ext.state.CookieProvider.superclass.clear.call(this, name);\r
- },\r
-\r
- // private\r
- readCookies : function(){\r
- var cookies = {};\r
- var c = document.cookie + ";";\r
- var re = /\s?(.*?)=(.*?);/g;\r
- var matches;\r
- while((matches = re.exec(c)) != null){\r
- var name = matches[1];\r
- var value = matches[2];\r
- if(name && name.substring(0,3) == "ys-"){\r
- cookies[name.substr(3)] = this.decodeValue(value);\r
- }\r
- }\r
- return cookies;\r
- },\r
-\r
- // private\r
- setCookie : function(name, value){\r
- document.cookie = "ys-"+ name + "=" + this.encodeValue(value) +\r
- ((this.expires == null) ? "" : ("; expires=" + this.expires.toGMTString())) +\r
- ((this.path == null) ? "" : ("; path=" + this.path)) +\r
- ((this.domain == null) ? "" : ("; domain=" + this.domain)) +\r
- ((this.secure == true) ? "; secure" : "");\r
- },\r
-\r
- // private\r
- clearCookie : function(name){\r
- document.cookie = "ys-" + name + "=null; expires=Thu, 01-Jan-70 00:00:01 GMT" +\r
- ((this.path == null) ? "" : ("; path=" + this.path)) +\r
- ((this.domain == null) ? "" : ("; domain=" + this.domain)) +\r
- ((this.secure == true) ? "; secure" : "");\r
- }\r
-});\r
-\r
-Ext.DataView = Ext.extend(Ext.BoxComponent, {\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- selectedClass : "x-view-selected",\r
- \r
- emptyText : "",\r
-\r
- \r
- deferEmptyText: true,\r
- \r
- trackOver: false,\r
-\r
- //private\r
- last: false,\r
-\r
-\r
- // private\r
- initComponent : function(){\r
- Ext.DataView.superclass.initComponent.call(this);\r
- if(typeof this.tpl == "string"){\r
- this.tpl = new Ext.XTemplate(this.tpl);\r
- }\r
-\r
- this.addEvents(\r
- \r
- "beforeclick",\r
- \r
- "click",\r
- \r
- "mouseenter",\r
- \r
- "mouseleave",\r
- \r
- "containerclick",\r
- \r
- "dblclick",\r
- \r
- "contextmenu",\r
- \r
- "selectionchange",\r
-\r
- \r
- "beforeselect"\r
- );\r
-\r
- this.all = new Ext.CompositeElementLite();\r
- this.selected = new Ext.CompositeElementLite();\r
- },\r
-\r
- // private\r
- onRender : function(){\r
- if(!this.el){\r
- this.el = document.createElement('div');\r
- this.el.id = this.id;\r
- }\r
- Ext.DataView.superclass.onRender.apply(this, arguments);\r
- },\r
-\r
- // private\r
- afterRender : function(){\r
- Ext.DataView.superclass.afterRender.call(this);\r
-\r
- this.el.on({\r
- "click": this.onClick,\r
- "dblclick": this.onDblClick,\r
- "contextmenu": this.onContextMenu,\r
- scope:this\r
- });\r
-\r
- if(this.overClass || this.trackOver){\r
- this.el.on({\r
- "mouseover": this.onMouseOver,\r
- "mouseout": this.onMouseOut,\r
- scope:this\r
- });\r
- }\r
-\r
- if(this.store){\r
- this.setStore(this.store, true);\r
- }\r
- },\r
-\r
- \r
- refresh : function(){\r
- this.clearSelections(false, true);\r
- this.el.update("");\r
- var records = this.store.getRange();\r
- if(records.length < 1){\r
- if(!this.deferEmptyText || this.hasSkippedEmptyText){\r
- this.el.update(this.emptyText);\r
- }\r
- this.hasSkippedEmptyText = true;\r
- this.all.clear();\r
- return;\r
- }\r
- this.tpl.overwrite(this.el, this.collectData(records, 0));\r
- this.all.fill(Ext.query(this.itemSelector, this.el.dom));\r
- this.updateIndexes(0);\r
- },\r
-\r
- \r
- prepareData : function(data){\r
- return data;\r
- },\r
-\r
- \r
- collectData : function(records, startIndex){\r
- var r = [];\r
- for(var i = 0, len = records.length; i < len; i++){\r
- r[r.length] = this.prepareData(records[i].data, startIndex+i, records[i]);\r
- }\r
- return r;\r
- },\r
-\r
- // private\r
- bufferRender : function(records){\r
- var div = document.createElement('div');\r
- this.tpl.overwrite(div, this.collectData(records));\r
- return Ext.query(this.itemSelector, div);\r
- },\r
-\r
- // private\r
- onUpdate : function(ds, record){\r
- var index = this.store.indexOf(record);\r
- var sel = this.isSelected(index);\r
- var original = this.all.elements[index];\r
- var node = this.bufferRender([record], index)[0];\r
-\r
- this.all.replaceElement(index, node, true);\r
- if(sel){\r
- this.selected.replaceElement(original, node);\r
- this.all.item(index).addClass(this.selectedClass);\r
- }\r
- this.updateIndexes(index, index);\r
- },\r
-\r
- // private\r
- onAdd : function(ds, records, index){\r
- if(this.all.getCount() == 0){\r
- this.refresh();\r
- return;\r
- }\r
- var nodes = this.bufferRender(records, index), n, a = this.all.elements;\r
- if(index < this.all.getCount()){\r
- n = this.all.item(index).insertSibling(nodes, 'before', true);\r
- a.splice.apply(a, [index, 0].concat(nodes));\r
- }else{\r
- n = this.all.last().insertSibling(nodes, 'after', true);\r
- a.push.apply(a, nodes);\r
- }\r
- this.updateIndexes(index);\r
- },\r
-\r
- // private\r
- onRemove : function(ds, record, index){\r
- this.deselect(index);\r
- this.all.removeElement(index, true);\r
- this.updateIndexes(index);\r
- },\r
-\r
- \r
- refreshNode : function(index){\r
- this.onUpdate(this.store, this.store.getAt(index));\r
- },\r
-\r
- // private\r
- updateIndexes : function(startIndex, endIndex){\r
- var ns = this.all.elements;\r
- startIndex = startIndex || 0;\r
- endIndex = endIndex || ((endIndex === 0) ? 0 : (ns.length - 1));\r
- for(var i = startIndex; i <= endIndex; i++){\r
- ns[i].viewIndex = i;\r
- }\r
- },\r
- \r
- \r
- getStore : function(){\r
- return this.store;\r
- },\r
-\r
- \r
- setStore : function(store, initial){\r
- if(!initial && this.store){\r
- this.store.un("beforeload", this.onBeforeLoad, this);\r
- this.store.un("datachanged", this.refresh, this);\r
- this.store.un("add", this.onAdd, this);\r
- this.store.un("remove", this.onRemove, this);\r
- this.store.un("update", this.onUpdate, this);\r
- this.store.un("clear", this.refresh, this);\r
- }\r
- if(store){\r
- store = Ext.StoreMgr.lookup(store);\r
- store.on("beforeload", this.onBeforeLoad, this);\r
- store.on("datachanged", this.refresh, this);\r
- store.on("add", this.onAdd, this);\r
- store.on("remove", this.onRemove, this);\r
- store.on("update", this.onUpdate, this);\r
- store.on("clear", this.refresh, this);\r
- }\r
- this.store = store;\r
- if(store){\r
- this.refresh();\r
- }\r
- },\r
-\r
- \r
- findItemFromChild : function(node){\r
- return Ext.fly(node).findParent(this.itemSelector, this.el);\r
- },\r
-\r
- // private\r
- onClick : function(e){\r
- var item = e.getTarget(this.itemSelector, this.el);\r
- if(item){\r
- var index = this.indexOf(item);\r
- if(this.onItemClick(item, index, e) !== false){\r
- this.fireEvent("click", this, index, item, e);\r
- }\r
- }else{\r
- if(this.fireEvent("containerclick", this, e) !== false){\r
- this.clearSelections();\r
- }\r
- }\r
- },\r
-\r
- // private\r
- onContextMenu : function(e){\r
- var item = e.getTarget(this.itemSelector, this.el);\r
- if(item){\r
- this.fireEvent("contextmenu", this, this.indexOf(item), item, e);\r
- }\r
- },\r
-\r
- // private\r
- onDblClick : function(e){\r
- var item = e.getTarget(this.itemSelector, this.el);\r
- if(item){\r
- this.fireEvent("dblclick", this, this.indexOf(item), item, e);\r
- }\r
- },\r
-\r
- // private\r
- onMouseOver : function(e){\r
- var item = e.getTarget(this.itemSelector, this.el);\r
- if(item && item !== this.lastItem){\r
- this.lastItem = item;\r
- Ext.fly(item).addClass(this.overClass);\r
- this.fireEvent("mouseenter", this, this.indexOf(item), item, e);\r
- }\r
- },\r
-\r
- // private\r
- onMouseOut : function(e){\r
- if(this.lastItem){\r
- if(!e.within(this.lastItem, true, true)){\r
- Ext.fly(this.lastItem).removeClass(this.overClass);\r
- this.fireEvent("mouseleave", this, this.indexOf(this.lastItem), this.lastItem, e);\r
- delete this.lastItem;\r
- }\r
- }\r
- },\r
-\r
- // private\r
- onItemClick : function(item, index, e){\r
- if(this.fireEvent("beforeclick", this, index, item, e) === false){\r
- return false;\r
- }\r
- if(this.multiSelect){\r
- this.doMultiSelection(item, index, e);\r
- e.preventDefault();\r
- }else if(this.singleSelect){\r
- this.doSingleSelection(item, index, e);\r
- e.preventDefault();\r
- }\r
- return true;\r
- },\r
-\r
- // private\r
- doSingleSelection : function(item, index, e){\r
- if(e.ctrlKey && this.isSelected(index)){\r
- this.deselect(index);\r
- }else{\r
- this.select(index, false);\r
- }\r
- },\r
-\r
- // private\r
- doMultiSelection : function(item, index, e){\r
- if(e.shiftKey && this.last !== false){\r
- var last = this.last;\r
- this.selectRange(last, index, e.ctrlKey);\r
- this.last = last; // reset the last\r
- }else{\r
- if((e.ctrlKey||this.simpleSelect) && this.isSelected(index)){\r
- this.deselect(index);\r
- }else{\r
- this.select(index, e.ctrlKey || e.shiftKey || this.simpleSelect);\r
- }\r
- }\r
- },\r
-\r
- \r
- getSelectionCount : function(){\r
- return this.selected.getCount()\r
- },\r
-\r
- \r
- getSelectedNodes : function(){\r
- return this.selected.elements;\r
- },\r
-\r
- \r
- getSelectedIndexes : function(){\r
- var indexes = [], s = this.selected.elements;\r
- for(var i = 0, len = s.length; i < len; i++){\r
- indexes.push(s[i].viewIndex);\r
- }\r
- return indexes;\r
- },\r
-\r
- \r
- getSelectedRecords : function(){\r
- var r = [], s = this.selected.elements;\r
- for(var i = 0, len = s.length; i < len; i++){\r
- r[r.length] = this.store.getAt(s[i].viewIndex);\r
- }\r
- return r;\r
- },\r
-\r
- \r
- getRecords : function(nodes){\r
- var r = [], s = nodes;\r
- for(var i = 0, len = s.length; i < len; i++){\r
- r[r.length] = this.store.getAt(s[i].viewIndex);\r
- }\r
- return r;\r
- },\r
-\r
- \r
- getRecord : function(node){\r
- return this.store.getAt(node.viewIndex);\r
- },\r
-\r
- \r
- clearSelections : function(suppressEvent, skipUpdate){\r
- if((this.multiSelect || this.singleSelect) && this.selected.getCount() > 0){\r
- if(!skipUpdate){\r
- this.selected.removeClass(this.selectedClass);\r
- }\r
- this.selected.clear();\r
- this.last = false;\r
- if(!suppressEvent){\r
- this.fireEvent("selectionchange", this, this.selected.elements);\r
- }\r
- }\r
- },\r
-\r
- \r
- isSelected : function(node){\r
- return this.selected.contains(this.getNode(node));\r
- },\r
-\r
- \r
- deselect : function(node){\r
- if(this.isSelected(node)){\r
- node = this.getNode(node);\r
- this.selected.removeElement(node);\r
- if(this.last == node.viewIndex){\r
- this.last = false;\r
- }\r
- Ext.fly(node).removeClass(this.selectedClass);\r
- this.fireEvent("selectionchange", this, this.selected.elements);\r
- }\r
- },\r
-\r
- \r
- select : function(nodeInfo, keepExisting, suppressEvent){\r
- if(Ext.isArray(nodeInfo)){\r
- if(!keepExisting){\r
- this.clearSelections(true);\r
- }\r
- for(var i = 0, len = nodeInfo.length; i < len; i++){\r
- this.select(nodeInfo[i], true, true);\r
- }\r
- if(!suppressEvent){\r
- this.fireEvent("selectionchange", this, this.selected.elements);\r
- }\r
- } else{\r
- var node = this.getNode(nodeInfo);\r
- if(!keepExisting){\r
- this.clearSelections(true);\r
- }\r
- if(node && !this.isSelected(node)){\r
- if(this.fireEvent("beforeselect", this, node, this.selected.elements) !== false){\r
- Ext.fly(node).addClass(this.selectedClass);\r
- this.selected.add(node);\r
- this.last = node.viewIndex;\r
- if(!suppressEvent){\r
- this.fireEvent("selectionchange", this, this.selected.elements);\r
- }\r
- }\r
- }\r
- }\r
- },\r
-\r
- \r
- selectRange : function(start, end, keepExisting){\r
- if(!keepExisting){\r
- this.clearSelections(true);\r
- }\r
- this.select(this.getNodes(start, end), true);\r
- },\r
-\r
- \r
- getNode : function(nodeInfo){\r
- if(typeof nodeInfo == "string"){\r
- return document.getElementById(nodeInfo);\r
- }else if(typeof nodeInfo == "number"){\r
- return this.all.elements[nodeInfo];\r
- }\r
- return nodeInfo;\r
- },\r
-\r
- \r
- getNodes : function(start, end){\r
- var ns = this.all.elements;\r
- start = start || 0;\r
- end = typeof end == "undefined" ? Math.max(ns.length - 1, 0) : end;\r
- var nodes = [], i;\r
- if(start <= end){\r
- for(i = start; i <= end && ns[i]; i++){\r
- nodes.push(ns[i]);\r
- }\r
- } else{\r
- for(i = start; i >= end && ns[i]; i--){\r
- nodes.push(ns[i]);\r
- }\r
- }\r
- return nodes;\r
- },\r
-\r
- \r
- indexOf : function(node){\r
- node = this.getNode(node);\r
- if(typeof node.viewIndex == "number"){\r
- return node.viewIndex;\r
- }\r
- return this.all.indexOf(node);\r
- },\r
-\r
- // private\r
- onBeforeLoad : function(){\r
- if(this.loadingText){\r
- this.clearSelections(false, true);\r
- this.el.update('<div class="loading-indicator">'+this.loadingText+'</div>');\r
- this.all.clear();\r
- }\r
- },\r
-\r
- onDestroy : function(){\r
- Ext.DataView.superclass.onDestroy.call(this);\r
- this.setStore(null);\r
- }\r
-});\r
-\r
-Ext.reg('dataview', Ext.DataView);\r
-\r
-Ext.ColorPalette = function(config){\r
- Ext.ColorPalette.superclass.constructor.call(this, config);\r
- this.addEvents(\r
- \r
- 'select'\r
- );\r
-\r
- if(this.handler){\r
- this.on("select", this.handler, this.scope, true);\r
- }\r
-};\r
-Ext.extend(Ext.ColorPalette, Ext.Component, {\r
- \r
- \r
- itemCls : "x-color-palette",\r
- \r
- value : null,\r
- clickEvent:'click',\r
- // private\r
- ctype: "Ext.ColorPalette",\r
-\r
- \r
- allowReselect : false,\r
-\r
- \r
- colors : [\r
- "000000", "993300", "333300", "003300", "003366", "000080", "333399", "333333",\r
- "800000", "FF6600", "808000", "008000", "008080", "0000FF", "666699", "808080",\r
- "FF0000", "FF9900", "99CC00", "339966", "33CCCC", "3366FF", "800080", "969696",\r
- "FF00FF", "FFCC00", "FFFF00", "00FF00", "00FFFF", "00CCFF", "993366", "C0C0C0",\r
- "FF99CC", "FFCC99", "FFFF99", "CCFFCC", "CCFFFF", "99CCFF", "CC99FF", "FFFFFF"\r
- ],\r
-\r
- // private\r
- onRender : function(container, position){\r
- var t = this.tpl || new Ext.XTemplate(\r
- '<tpl for="."><a href="#" class="color-{.}" hidefocus="on"><em><span style="background:#{.}" unselectable="on"> </span></em></a></tpl>'\r
- );\r
- var el = document.createElement("div");\r
- el.id = this.getId();\r
- el.className = this.itemCls;\r
- t.overwrite(el, this.colors);\r
- container.dom.insertBefore(el, position);\r
- this.el = Ext.get(el);\r
- this.el.on(this.clickEvent, this.handleClick, this, {delegate: "a"});\r
- if(this.clickEvent != 'click'){\r
- this.el.on('click', Ext.emptyFn, this, {delegate: "a", preventDefault:true});\r
- }\r
- },\r
-\r
- // private\r
- afterRender : function(){\r
- Ext.ColorPalette.superclass.afterRender.call(this);\r
- if(this.value){\r
- var s = this.value;\r
- this.value = null;\r
- this.select(s);\r
- }\r
- },\r
-\r
- // private\r
- handleClick : function(e, t){\r
- e.preventDefault();\r
- if(!this.disabled){\r
- var c = t.className.match(/(?:^|\s)color-(.{6})(?:\s|$)/)[1];\r
- this.select(c.toUpperCase());\r
- }\r
- },\r
-\r
- \r
- select : function(color){\r
- color = color.replace("#", "");\r
- if(color != this.value || this.allowReselect){\r
- var el = this.el;\r
- if(this.value){\r
- el.child("a.color-"+this.value).removeClass("x-color-palette-sel");\r
- }\r
- el.child("a.color-"+color).addClass("x-color-palette-sel");\r
- this.value = color;\r
- this.fireEvent("select", this, color);\r
- }\r
- }\r
-\r
- \r
-});\r
-Ext.reg('colorpalette', Ext.ColorPalette);\r
-\r
-Ext.DatePicker = Ext.extend(Ext.Component, {\r
- \r
- todayText : "Today",\r
- \r
- okText : " OK ", //   to give the user extra clicking room\r
- \r
- cancelText : "Cancel",\r
- \r
- todayTip : "{0} (Spacebar)",\r
- \r
- minText : "This date is before the minimum date",\r
- \r
- maxText : "This date is after the maximum date",\r
- \r
- format : "m/d/y",\r
- \r
- disabledDaysText : "Disabled",\r
- \r
- disabledDatesText : "Disabled",\r
- \r
- constrainToViewport : true,\r
- \r
- monthNames : Date.monthNames,\r
- \r
- dayNames : Date.dayNames,\r
- \r
- nextText: 'Next Month (Control+Right)',\r
- \r
- prevText: 'Previous Month (Control+Left)',\r
- \r
- monthYearText: 'Choose a month (Control+Up/Down to move years)',\r
- \r
- startDay : 0,\r
- \r
- showToday : true,\r
- \r
- \r
- \r
- \r
- \r
-\r
- // private\r
- initComponent : function(){\r
- Ext.DatePicker.superclass.initComponent.call(this);\r
-\r
- this.value = this.value ?\r
- this.value.clearTime() : new Date().clearTime();\r
-\r
- this.addEvents(\r
- \r
- 'select'\r
- );\r
-\r
- if(this.handler){\r
- this.on("select", this.handler, this.scope || this);\r
- }\r
-\r
- this.initDisabledDays();\r
- },\r
-\r
- // private\r
- initDisabledDays : function(){\r
- if(!this.disabledDatesRE && this.disabledDates){\r
- var dd = this.disabledDates;\r
- var re = "(?:";\r
- for(var i = 0; i < dd.length; i++){\r
- re += dd[i];\r
- if(i != dd.length-1) re += "|";\r
- }\r
- this.disabledDatesRE = new RegExp(re + ")");\r
- }\r
- },\r
- \r
- \r
- setDisabledDates : function(dd){\r
- if(Ext.isArray(dd)){\r
- this.disabledDates = dd;\r
- this.disabledDatesRE = null;\r
- }else{\r
- this.disabledDatesRE = dd;\r
- }\r
- this.initDisabledDays();\r
- this.update(this.value, true);\r
- },\r
- \r
- \r
- setDisabledDays : function(dd){\r
- this.disabledDays = dd;\r
- this.update(this.value, true);\r
- },\r
- \r
- \r
- setMinDate : function(dt){\r
- this.minDate = dt;\r
- this.update(this.value, true);\r
- },\r
- \r
- \r
- setMaxDate : function(dt){\r
- this.maxDate = dt;\r
- this.update(this.value, true);\r
- },\r
-\r
- \r
- setValue : function(value){\r
- var old = this.value;\r
- this.value = value.clearTime(true);\r
- if(this.el){\r
- this.update(this.value);\r
- }\r
- },\r
-\r
- \r
- getValue : function(){\r
- return this.value;\r
- },\r
-\r
- // private\r
- focus : function(){\r
- if(this.el){\r
- this.update(this.activeDate);\r
- }\r
- },\r
-\r
- // private\r
- onRender : function(container, position){\r
- var m = [\r
- '<table cellspacing="0">',\r
- '<tr><td class="x-date-left"><a href="#" title="', this.prevText ,'"> </a></td><td class="x-date-middle" align="center"></td><td class="x-date-right"><a href="#" title="', this.nextText ,'"> </a></td></tr>',\r
- '<tr><td colspan="3"><table class="x-date-inner" cellspacing="0"><thead><tr>'];\r
- var dn = this.dayNames;\r
- for(var i = 0; i < 7; i++){\r
- var d = this.startDay+i;\r
- if(d > 6){\r
- d = d-7;\r
- }\r
- m.push("<th><span>", dn[d].substr(0,1), "</span></th>");\r
- }\r
- m[m.length] = "</tr></thead><tbody><tr>";\r
- for(var i = 0; i < 42; i++) {\r
- if(i % 7 == 0 && i != 0){\r
- m[m.length] = "</tr><tr>";\r
- }\r
- m[m.length] = '<td><a href="#" hidefocus="on" class="x-date-date" tabIndex="1"><em><span></span></em></a></td>';\r
- }\r
- m.push('</tr></tbody></table></td></tr>', \r
- this.showToday ? '<tr><td colspan="3" class="x-date-bottom" align="center"></td></tr>' : '', \r
- '</table><div class="x-date-mp"></div>');\r
-\r
- var el = document.createElement("div");\r
- el.className = "x-date-picker";\r
- el.innerHTML = m.join("");\r
-\r
- container.dom.insertBefore(el, position);\r
-\r
- this.el = Ext.get(el);\r
- this.eventEl = Ext.get(el.firstChild);\r
-\r
- this.leftClickRpt = new Ext.util.ClickRepeater(this.el.child("td.x-date-left a"), {\r
- handler: this.showPrevMonth,\r
- scope: this,\r
- preventDefault:true,\r
- stopDefault:true\r
- });\r
-\r
- this.rightClickRpt = new Ext.util.ClickRepeater(this.el.child("td.x-date-right a"), {\r
- handler: this.showNextMonth,\r
- scope: this,\r
- preventDefault:true,\r
- stopDefault:true\r
- });\r
-\r
- this.eventEl.on("mousewheel", this.handleMouseWheel, this);\r
-\r
- this.monthPicker = this.el.down('div.x-date-mp');\r
- this.monthPicker.enableDisplayMode('block');\r
- \r
- var kn = new Ext.KeyNav(this.eventEl, {\r
- "left" : function(e){\r
- e.ctrlKey ?\r
- this.showPrevMonth() :\r
- this.update(this.activeDate.add("d", -1));\r
- },\r
-\r
- "right" : function(e){\r
- e.ctrlKey ?\r
- this.showNextMonth() :\r
- this.update(this.activeDate.add("d", 1));\r
- },\r
-\r
- "up" : function(e){\r
- e.ctrlKey ?\r
- this.showNextYear() :\r
- this.update(this.activeDate.add("d", -7));\r
- },\r
-\r
- "down" : function(e){\r
- e.ctrlKey ?\r
- this.showPrevYear() :\r
- this.update(this.activeDate.add("d", 7));\r
- },\r
-\r
- "pageUp" : function(e){\r
- this.showNextMonth();\r
- },\r
-\r
- "pageDown" : function(e){\r
- this.showPrevMonth();\r
- },\r
-\r
- "enter" : function(e){\r
- e.stopPropagation();\r
- return true;\r
- },\r
-\r
- scope : this\r
- });\r
-\r
- this.eventEl.on("click", this.handleDateClick, this, {delegate: "a.x-date-date"});\r
-\r
- this.el.unselectable();\r
- \r
- this.cells = this.el.select("table.x-date-inner tbody td");\r
- this.textNodes = this.el.query("table.x-date-inner tbody span");\r
-\r
- this.mbtn = new Ext.Button({\r
- text: " ",\r
- tooltip: this.monthYearText,\r
- renderTo: this.el.child("td.x-date-middle", true)\r
- });\r
-\r
- this.mbtn.on('click', this.showMonthPicker, this);\r
- this.mbtn.el.child(this.mbtn.menuClassTarget).addClass("x-btn-with-menu");\r
-\r
- if(this.showToday){\r
- this.todayKeyListener = this.eventEl.addKeyListener(Ext.EventObject.SPACE, this.selectToday, this);\r
- var today = (new Date()).dateFormat(this.format);\r
- this.todayBtn = new Ext.Button({\r
- renderTo: this.el.child("td.x-date-bottom", true),\r
- text: String.format(this.todayText, today),\r
- tooltip: String.format(this.todayTip, today),\r
- handler: this.selectToday,\r
- scope: this\r
- });\r
- }\r
- \r
- if(Ext.isIE){\r
- this.el.repaint();\r
- }\r
- this.update(this.value);\r
- },\r
-\r
- // private\r
- createMonthPicker : function(){\r
- if(!this.monthPicker.dom.firstChild){\r
- var buf = ['<table border="0" cellspacing="0">'];\r
- for(var i = 0; i < 6; i++){\r
- buf.push(\r
- '<tr><td class="x-date-mp-month"><a href="#">', this.monthNames[i].substr(0, 3), '</a></td>',\r
- '<td class="x-date-mp-month x-date-mp-sep"><a href="#">', this.monthNames[i+6].substr(0, 3), '</a></td>',\r
- i == 0 ?\r
- '<td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-prev"></a></td><td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-next"></a></td></tr>' :\r
- '<td class="x-date-mp-year"><a href="#"></a></td><td class="x-date-mp-year"><a href="#"></a></td></tr>'\r
- );\r
- }\r
- buf.push(\r
- '<tr class="x-date-mp-btns"><td colspan="4"><button type="button" class="x-date-mp-ok">',\r
- this.okText,\r
- '</button><button type="button" class="x-date-mp-cancel">',\r
- this.cancelText,\r
- '</button></td></tr>',\r
- '</table>'\r
- );\r
- this.monthPicker.update(buf.join(''));\r
- this.monthPicker.on('click', this.onMonthClick, this);\r
- this.monthPicker.on('dblclick', this.onMonthDblClick, this);\r
-\r
- this.mpMonths = this.monthPicker.select('td.x-date-mp-month');\r
- this.mpYears = this.monthPicker.select('td.x-date-mp-year');\r
-\r
- this.mpMonths.each(function(m, a, i){\r
- i += 1;\r
- if((i%2) == 0){\r
- m.dom.xmonth = 5 + Math.round(i * .5);\r
- }else{\r
- m.dom.xmonth = Math.round((i-1) * .5);\r
- }\r
- });\r
- }\r
- },\r
-\r
- // private\r
- showMonthPicker : function(){\r
- this.createMonthPicker();\r
- var size = this.el.getSize();\r
- this.monthPicker.setSize(size);\r
- this.monthPicker.child('table').setSize(size);\r
-\r
- this.mpSelMonth = (this.activeDate || this.value).getMonth();\r
- this.updateMPMonth(this.mpSelMonth);\r
- this.mpSelYear = (this.activeDate || this.value).getFullYear();\r
- this.updateMPYear(this.mpSelYear);\r
-\r
- this.monthPicker.slideIn('t', {duration:.2});\r
- },\r
-\r
- // private\r
- updateMPYear : function(y){\r
- this.mpyear = y;\r
- var ys = this.mpYears.elements;\r
- for(var i = 1; i <= 10; i++){\r
- var td = ys[i-1], y2;\r
- if((i%2) == 0){\r
- y2 = y + Math.round(i * .5);\r
- td.firstChild.innerHTML = y2;\r
- td.xyear = y2;\r
- }else{\r
- y2 = y - (5-Math.round(i * .5));\r
- td.firstChild.innerHTML = y2;\r
- td.xyear = y2;\r
- }\r
- this.mpYears.item(i-1)[y2 == this.mpSelYear ? 'addClass' : 'removeClass']('x-date-mp-sel');\r
- }\r
- },\r
-\r
- // private\r
- updateMPMonth : function(sm){\r
- this.mpMonths.each(function(m, a, i){\r
- m[m.dom.xmonth == sm ? 'addClass' : 'removeClass']('x-date-mp-sel');\r
- });\r
- },\r
-\r
- // private\r
- selectMPMonth: function(m){\r
- \r
- },\r
-\r
- // private\r
- onMonthClick : function(e, t){\r
- e.stopEvent();\r
- var el = new Ext.Element(t), pn;\r
- if(el.is('button.x-date-mp-cancel')){\r
- this.hideMonthPicker();\r
- }\r
- else if(el.is('button.x-date-mp-ok')){\r
- var d = new Date(this.mpSelYear, this.mpSelMonth, (this.activeDate || this.value).getDate());\r
- if(d.getMonth() != this.mpSelMonth){\r
- // "fix" the JS rolling date conversion if needed\r
- d = new Date(this.mpSelYear, this.mpSelMonth, 1).getLastDateOfMonth();\r
- }\r
- this.update(d);\r
- this.hideMonthPicker();\r
- }\r
- else if(pn = el.up('td.x-date-mp-month', 2)){\r
- this.mpMonths.removeClass('x-date-mp-sel');\r
- pn.addClass('x-date-mp-sel');\r
- this.mpSelMonth = pn.dom.xmonth;\r
- }\r
- else if(pn = el.up('td.x-date-mp-year', 2)){\r
- this.mpYears.removeClass('x-date-mp-sel');\r
- pn.addClass('x-date-mp-sel');\r
- this.mpSelYear = pn.dom.xyear;\r
- }\r
- else if(el.is('a.x-date-mp-prev')){\r
- this.updateMPYear(this.mpyear-10);\r
- }\r
- else if(el.is('a.x-date-mp-next')){\r
- this.updateMPYear(this.mpyear+10);\r
- }\r
- },\r
-\r
- // private\r
- onMonthDblClick : function(e, t){\r
- e.stopEvent();\r
- var el = new Ext.Element(t), pn;\r
- if(pn = el.up('td.x-date-mp-month', 2)){\r
- this.update(new Date(this.mpSelYear, pn.dom.xmonth, (this.activeDate || this.value).getDate()));\r
- this.hideMonthPicker();\r
- }\r
- else if(pn = el.up('td.x-date-mp-year', 2)){\r
- this.update(new Date(pn.dom.xyear, this.mpSelMonth, (this.activeDate || this.value).getDate()));\r
- this.hideMonthPicker();\r
- }\r
- },\r
-\r
- // private\r
- hideMonthPicker : function(disableAnim){\r
- if(this.monthPicker){\r
- if(disableAnim === true){\r
- this.monthPicker.hide();\r
- }else{\r
- this.monthPicker.slideOut('t', {duration:.2});\r
- }\r
- }\r
- },\r
-\r
- // private\r
- showPrevMonth : function(e){\r
- this.update(this.activeDate.add("mo", -1));\r
- },\r
-\r
- // private\r
- showNextMonth : function(e){\r
- this.update(this.activeDate.add("mo", 1));\r
- },\r
-\r
- // private\r
- showPrevYear : function(){\r
- this.update(this.activeDate.add("y", -1));\r
- },\r
-\r
- // private\r
- showNextYear : function(){\r
- this.update(this.activeDate.add("y", 1));\r
- },\r
-\r
- // private\r
- handleMouseWheel : function(e){\r
- var delta = e.getWheelDelta();\r
- if(delta > 0){\r
- this.showPrevMonth();\r
- e.stopEvent();\r
- } else if(delta < 0){\r
- this.showNextMonth();\r
- e.stopEvent();\r
- }\r
- },\r
-\r
- // private\r
- handleDateClick : function(e, t){\r
- e.stopEvent();\r
- if(t.dateValue && !Ext.fly(t.parentNode).hasClass("x-date-disabled")){\r
- this.setValue(new Date(t.dateValue));\r
- this.fireEvent("select", this, this.value);\r
- }\r
- },\r
-\r
- // private\r
- selectToday : function(){\r
- if(this.todayBtn && !this.todayBtn.disabled){\r
- this.setValue(new Date().clearTime());\r
- this.fireEvent("select", this, this.value);\r
- }\r
- },\r
-\r
- // private\r
- update : function(date, forceRefresh){\r
- var vd = this.activeDate;\r
- this.activeDate = date;\r
- if(!forceRefresh && vd && this.el){\r
- var t = date.getTime();\r
- if(vd.getMonth() == date.getMonth() && vd.getFullYear() == date.getFullYear()){\r
- this.cells.removeClass("x-date-selected");\r
- this.cells.each(function(c){\r
- if(c.dom.firstChild.dateValue == t){\r
- c.addClass("x-date-selected");\r
- setTimeout(function(){\r
- try{c.dom.firstChild.focus();}catch(e){}\r
- }, 50);\r
- return false;\r
- }\r
- });\r
- return;\r
- }\r
- }\r
- var days = date.getDaysInMonth();\r
- var firstOfMonth = date.getFirstDateOfMonth();\r
- var startingPos = firstOfMonth.getDay()-this.startDay;\r
-\r
- if(startingPos <= this.startDay){\r
- startingPos += 7;\r
- }\r
-\r
- var pm = date.add("mo", -1);\r
- var prevStart = pm.getDaysInMonth()-startingPos;\r
-\r
- var cells = this.cells.elements;\r
- var textEls = this.textNodes;\r
- days += startingPos;\r
-\r
- // convert everything to numbers so it's fast\r
- var day = 86400000;\r
- var d = (new Date(pm.getFullYear(), pm.getMonth(), prevStart)).clearTime();\r
- var today = new Date().clearTime().getTime();\r
- var sel = date.clearTime().getTime();\r
- var min = this.minDate ? this.minDate.clearTime() : Number.NEGATIVE_INFINITY;\r
- var max = this.maxDate ? this.maxDate.clearTime() : Number.POSITIVE_INFINITY;\r
- var ddMatch = this.disabledDatesRE;\r
- var ddText = this.disabledDatesText;\r
- var ddays = this.disabledDays ? this.disabledDays.join("") : false;\r
- var ddaysText = this.disabledDaysText;\r
- var format = this.format;\r
- \r
- if(this.showToday){\r
- var td = new Date().clearTime();\r
- var disable = (td < min || td > max || \r
- (ddMatch && format && ddMatch.test(td.dateFormat(format))) || \r
- (ddays && ddays.indexOf(td.getDay()) != -1));\r
- \r
- this.todayBtn.setDisabled(disable);\r
- this.todayKeyListener[disable ? 'disable' : 'enable']();\r
- }\r
-\r
- var setCellClass = function(cal, cell){\r
- cell.title = "";\r
- var t = d.getTime();\r
- cell.firstChild.dateValue = t;\r
- if(t == today){\r
- cell.className += " x-date-today";\r
- cell.title = cal.todayText;\r
- }\r
- if(t == sel){\r
- cell.className += " x-date-selected";\r
- setTimeout(function(){\r
- try{cell.firstChild.focus();}catch(e){}\r
- }, 50);\r
- }\r
- // disabling\r
- if(t < min) {\r
- cell.className = " x-date-disabled";\r
- cell.title = cal.minText;\r
- return;\r
- }\r
- if(t > max) {\r
- cell.className = " x-date-disabled";\r
- cell.title = cal.maxText;\r
- return;\r
- }\r
- if(ddays){\r
- if(ddays.indexOf(d.getDay()) != -1){\r
- cell.title = ddaysText;\r
- cell.className = " x-date-disabled";\r
- }\r
- }\r
- if(ddMatch && format){\r
- var fvalue = d.dateFormat(format);\r
- if(ddMatch.test(fvalue)){\r
- cell.title = ddText.replace("%0", fvalue);\r
- cell.className = " x-date-disabled";\r
- }\r
- }\r
- };\r
-\r
- var i = 0;\r
- for(; i < startingPos; i++) {\r
- textEls[i].innerHTML = (++prevStart);\r
- d.setDate(d.getDate()+1);\r
- cells[i].className = "x-date-prevday";\r
- setCellClass(this, cells[i]);\r
- }\r
- for(; i < days; i++){\r
- var intDay = i - startingPos + 1;\r
- textEls[i].innerHTML = (intDay);\r
- d.setDate(d.getDate()+1);\r
- cells[i].className = "x-date-active";\r
- setCellClass(this, cells[i]);\r
- }\r
- var extraDays = 0;\r
- for(; i < 42; i++) {\r
- textEls[i].innerHTML = (++extraDays);\r
- d.setDate(d.getDate()+1);\r
- cells[i].className = "x-date-nextday";\r
- setCellClass(this, cells[i]);\r
- }\r
-\r
- this.mbtn.setText(this.monthNames[date.getMonth()] + " " + date.getFullYear());\r
-\r
- if(!this.internalRender){\r
- var main = this.el.dom.firstChild;\r
- var w = main.offsetWidth;\r
- this.el.setWidth(w + this.el.getBorderWidth("lr"));\r
- Ext.fly(main).setWidth(w);\r
- this.internalRender = true;\r
- // opera does not respect the auto grow header center column\r
- // then, after it gets a width opera refuses to recalculate\r
- // without a second pass\r
- if(Ext.isOpera && !this.secondPass){\r
- main.rows[0].cells[1].style.width = (w - (main.rows[0].cells[0].offsetWidth+main.rows[0].cells[2].offsetWidth)) + "px";\r
- this.secondPass = true;\r
- this.update.defer(10, this, [date]);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- beforeDestroy : function() {\r
- if(this.rendered){\r
- Ext.destroy(\r
- this.leftClickRpt,\r
- this.rightClickRpt,\r
- this.monthPicker,\r
- this.eventEl,\r
- this.mbtn,\r
- this.todayBtn\r
- );\r
- }\r
- }\r
-\r
- \r
-});\r
-Ext.reg('datepicker', Ext.DatePicker);\r
-\r
-Ext.TabPanel = Ext.extend(Ext.Panel, {\r
- \r
- \r
- \r
- monitorResize : true,\r
- \r
- deferredRender : true,\r
- \r
- tabWidth: 120,\r
- \r
- minTabWidth: 30,\r
- \r
- resizeTabs:false,\r
- \r
- enableTabScroll: false,\r
- \r
- scrollIncrement : 0,\r
- \r
- scrollRepeatInterval : 400,\r
- \r
- scrollDuration : .35,\r
- \r
- animScroll : true,\r
- \r
- tabPosition: 'top',\r
- \r
- baseCls: 'x-tab-panel',\r
- \r
- autoTabs : false,\r
- \r
- autoTabSelector:'div.x-tab',\r
- \r
- activeTab : null,\r
- \r
- tabMargin : 2,\r
- \r
- plain: false,\r
- \r
- wheelIncrement : 20,\r
-\r
- \r
- idDelimiter : '__',\r
-\r
- // private\r
- itemCls : 'x-tab-item',\r
-\r
- // private config overrides\r
- elements: 'body',\r
- headerAsText: false,\r
- frame: false,\r
- hideBorders:true,\r
-\r
- // private\r
- initComponent : function(){\r
- this.frame = false;\r
- Ext.TabPanel.superclass.initComponent.call(this);\r
- this.addEvents(\r
- \r
- 'beforetabchange',\r
- \r
- 'tabchange',\r
- \r
- 'contextmenu'\r
- );\r
- this.setLayout(new Ext.layout.CardLayout({\r
- deferredRender: this.deferredRender\r
- }));\r
- if(this.tabPosition == 'top'){\r
- this.elements += ',header';\r
- this.stripTarget = 'header';\r
- }else {\r
- this.elements += ',footer';\r
- this.stripTarget = 'footer';\r
- }\r
- if(!this.stack){\r
- this.stack = Ext.TabPanel.AccessStack();\r
- }\r
- this.initItems();\r
- },\r
-\r
- // private\r
- render : function(){\r
- Ext.TabPanel.superclass.render.apply(this, arguments);\r
- if(this.activeTab !== undefined){\r
- var item = this.activeTab;\r
- delete this.activeTab;\r
- this.setActiveTab(item);\r
- }\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- Ext.TabPanel.superclass.onRender.call(this, ct, position);\r
-\r
- if(this.plain){\r
- var pos = this.tabPosition == 'top' ? 'header' : 'footer';\r
- this[pos].addClass('x-tab-panel-'+pos+'-plain');\r
- }\r
-\r
- var st = this[this.stripTarget];\r
-\r
- this.stripWrap = st.createChild({cls:'x-tab-strip-wrap', cn:{\r
- tag:'ul', cls:'x-tab-strip x-tab-strip-'+this.tabPosition}});\r
-\r
- var beforeEl = (this.tabPosition=='bottom' ? this.stripWrap : null);\r
- this.stripSpacer = st.createChild({cls:'x-tab-strip-spacer'}, beforeEl);\r
- this.strip = new Ext.Element(this.stripWrap.dom.firstChild);\r
-\r
- this.edge = this.strip.createChild({tag:'li', cls:'x-tab-edge'});\r
- this.strip.createChild({cls:'x-clear'});\r
-\r
- this.body.addClass('x-tab-panel-body-'+this.tabPosition);\r
-\r
- if(!this.itemTpl){\r
- var tt = new Ext.Template(\r
- '<li class="{cls}" id="{id}"><a class="x-tab-strip-close" onclick="return false;"></a>',\r
- '<a class="x-tab-right" href="#" onclick="return false;"><em class="x-tab-left">',\r
- '<span class="x-tab-strip-inner"><span class="x-tab-strip-text {iconCls}">{text}</span></span>',\r
- '</em></a></li>'\r
- );\r
- tt.disableFormats = true;\r
- tt.compile();\r
- Ext.TabPanel.prototype.itemTpl = tt;\r
- }\r
-\r
- this.items.each(this.initTab, this);\r
- },\r
-\r
- // private\r
- afterRender : function(){\r
- Ext.TabPanel.superclass.afterRender.call(this);\r
- if(this.autoTabs){\r
- this.readTabs(false);\r
- }\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- Ext.TabPanel.superclass.initEvents.call(this);\r
- this.on('add', this.onAdd, this);\r
- this.on('remove', this.onRemove, this);\r
-\r
- this.strip.on('mousedown', this.onStripMouseDown, this);\r
- this.strip.on('contextmenu', this.onStripContextMenu, this);\r
- if(this.enableTabScroll){\r
- this.strip.on('mousewheel', this.onWheel, this);\r
- }\r
- },\r
-\r
- // private\r
- findTargets : function(e){\r
- var item = null;\r
- var itemEl = e.getTarget('li', this.strip);\r
- if(itemEl){\r
- item = this.getComponent(itemEl.id.split(this.idDelimiter)[1]);\r
- if(item.disabled){\r
- return {\r
- close : null,\r
- item : null,\r
- el : null\r
- };\r
- }\r
- }\r
- return {\r
- close : e.getTarget('.x-tab-strip-close', this.strip),\r
- item : item,\r
- el : itemEl\r
- };\r
- },\r
-\r
- // private\r
- onStripMouseDown : function(e){\r
- if(e.button != 0){\r
- return;\r
- }\r
- e.preventDefault();\r
- var t = this.findTargets(e);\r
- if(t.close){\r
- this.remove(t.item);\r
- return;\r
- }\r
- if(t.item && t.item != this.activeTab){\r
- this.setActiveTab(t.item);\r
- }\r
- },\r
-\r
- // private\r
- onStripContextMenu : function(e){\r
- e.preventDefault();\r
- var t = this.findTargets(e);\r
- if(t.item){\r
- this.fireEvent('contextmenu', this, t.item, e);\r
- }\r
- },\r
-\r
- \r
- readTabs : function(removeExisting){\r
- if(removeExisting === true){\r
- this.items.each(function(item){\r
- this.remove(item);\r
- }, this);\r
- }\r
- var tabs = this.el.query(this.autoTabSelector);\r
- for(var i = 0, len = tabs.length; i < len; i++){\r
- var tab = tabs[i];\r
- var title = tab.getAttribute('title');\r
- tab.removeAttribute('title');\r
- this.add({\r
- title: title,\r
- el: tab\r
- });\r
- }\r
- },\r
-\r
- // private\r
- initTab : function(item, index){\r
- var before = this.strip.dom.childNodes[index];\r
- var cls = item.closable ? 'x-tab-strip-closable' : '';\r
- if(item.disabled){\r
- cls += ' x-item-disabled';\r
- }\r
- if(item.iconCls){\r
- cls += ' x-tab-with-icon';\r
- }\r
- if(item.tabCls){\r
- cls += ' ' + item.tabCls;\r
- }\r
-\r
- var p = {\r
- id: this.id + this.idDelimiter + item.getItemId(),\r
- text: item.title,\r
- cls: cls,\r
- iconCls: item.iconCls || ''\r
- };\r
- var el = before ?\r
- this.itemTpl.insertBefore(before, p) :\r
- this.itemTpl.append(this.strip, p);\r
-\r
- Ext.fly(el).addClassOnOver('x-tab-strip-over');\r
-\r
- if(item.tabTip){\r
- Ext.fly(el).child('span.x-tab-strip-text', true).qtip = item.tabTip;\r
- }\r
- item.tabEl = el;\r
-\r
- item.on('disable', this.onItemDisabled, this);\r
- item.on('enable', this.onItemEnabled, this);\r
- item.on('titlechange', this.onItemTitleChanged, this);\r
- item.on('iconchange', this.onItemIconChanged, this);\r
- item.on('beforeshow', this.onBeforeShowItem, this);\r
- },\r
-\r
- // private\r
- onAdd : function(tp, item, index){\r
- this.initTab(item, index);\r
- if(this.items.getCount() == 1){\r
- this.syncSize();\r
- }\r
- this.delegateUpdates();\r
- },\r
-\r
- // private\r
- onBeforeAdd : function(item){\r
- var existing = item.events ? (this.items.containsKey(item.getItemId()) ? item : null) : this.items.get(item);\r
- if(existing){\r
- this.setActiveTab(item);\r
- return false;\r
- }\r
- Ext.TabPanel.superclass.onBeforeAdd.apply(this, arguments);\r
- var es = item.elements;\r
- item.elements = es ? es.replace(',header', '') : es;\r
- item.border = (item.border === true);\r
- },\r
-\r
- // private\r
- onRemove : function(tp, item){\r
- Ext.destroy(Ext.get(this.getTabEl(item)));\r
- this.stack.remove(item);\r
- item.un('disable', this.onItemDisabled, this);\r
- item.un('enable', this.onItemEnabled, this);\r
- item.un('titlechange', this.onItemTitleChanged, this);\r
- item.un('iconchange', this.onItemIconChanged, this);\r
- item.un('beforeshow', this.onBeforeShowItem, this);\r
- if(item == this.activeTab){\r
- var next = this.stack.next();\r
- if(next){\r
- this.setActiveTab(next);\r
- }else if(this.items.getCount() > 0){\r
- this.setActiveTab(0);\r
- }else{\r
- this.activeTab = null;\r
- }\r
- }\r
- this.delegateUpdates();\r
- },\r
-\r
- // private\r
- onBeforeShowItem : function(item){\r
- if(item != this.activeTab){\r
- this.setActiveTab(item);\r
- return false;\r
- }\r
- },\r
-\r
- // private\r
- onItemDisabled : function(item){\r
- var el = this.getTabEl(item);\r
- if(el){\r
- Ext.fly(el).addClass('x-item-disabled');\r
- }\r
- this.stack.remove(item);\r
- },\r
-\r
- // private\r
- onItemEnabled : function(item){\r
- var el = this.getTabEl(item);\r
- if(el){\r
- Ext.fly(el).removeClass('x-item-disabled');\r
- }\r
- },\r
-\r
- // private\r
- onItemTitleChanged : function(item){\r
- var el = this.getTabEl(item);\r
- if(el){\r
- Ext.fly(el).child('span.x-tab-strip-text', true).innerHTML = item.title;\r
- }\r
- },\r
- \r
- //private\r
- onItemIconChanged: function(item, iconCls, oldCls){\r
- var el = this.getTabEl(item);\r
- if(el){\r
- Ext.fly(el).child('span.x-tab-strip-text').replaceClass(oldCls, iconCls);\r
- }\r
- },\r
-\r
- \r
- getTabEl : function(item){\r
- var itemId = (typeof item === 'number')?this.items.items[item].getItemId() : item.getItemId();\r
- return document.getElementById(this.id+this.idDelimiter+itemId);\r
- },\r
-\r
- // private\r
- onResize : function(){\r
- Ext.TabPanel.superclass.onResize.apply(this, arguments);\r
- this.delegateUpdates();\r
- },\r
-\r
- \r
- beginUpdate : function(){\r
- this.suspendUpdates = true;\r
- },\r
-\r
- \r
- endUpdate : function(){\r
- this.suspendUpdates = false;\r
- this.delegateUpdates();\r
- },\r
-\r
- \r
- hideTabStripItem : function(item){\r
- item = this.getComponent(item);\r
- var el = this.getTabEl(item);\r
- if(el){\r
- el.style.display = 'none';\r
- this.delegateUpdates();\r
- }\r
- this.stack.remove(item);\r
- },\r
-\r
- \r
- unhideTabStripItem : function(item){\r
- item = this.getComponent(item);\r
- var el = this.getTabEl(item);\r
- if(el){\r
- el.style.display = '';\r
- this.delegateUpdates();\r
- }\r
- },\r
-\r
- // private\r
- delegateUpdates : function(){\r
- if(this.suspendUpdates){\r
- return;\r
- }\r
- if(this.resizeTabs && this.rendered){\r
- this.autoSizeTabs();\r
- }\r
- if(this.enableTabScroll && this.rendered){\r
- this.autoScrollTabs();\r
- }\r
- },\r
-\r
- // private\r
- autoSizeTabs : function(){\r
- var count = this.items.length;\r
- var ce = this.tabPosition != 'bottom' ? 'header' : 'footer';\r
- var ow = this[ce].dom.offsetWidth;\r
- var aw = this[ce].dom.clientWidth;\r
-\r
- if(!this.resizeTabs || count < 1 || !aw){ // !aw for display:none\r
- return;\r
- }\r
-\r
- var each = Math.max(Math.min(Math.floor((aw-4) / count) - this.tabMargin, this.tabWidth), this.minTabWidth); // -4 for float errors in IE\r
- this.lastTabWidth = each;\r
- var lis = this.stripWrap.dom.getElementsByTagName('li');\r
- for(var i = 0, len = lis.length-1; i < len; i++) { // -1 for the "edge" li\r
- var li = lis[i];\r
- var inner = li.childNodes[1].firstChild.firstChild;\r
- var tw = li.offsetWidth;\r
- var iw = inner.offsetWidth;\r
- inner.style.width = (each - (tw-iw)) + 'px';\r
- }\r
- },\r
-\r
- // private\r
- adjustBodyWidth : function(w){\r
- if(this.header){\r
- this.header.setWidth(w);\r
- }\r
- if(this.footer){\r
- this.footer.setWidth(w);\r
- }\r
- return w;\r
- },\r
-\r
- \r
- setActiveTab : function(item){\r
- item = this.getComponent(item);\r
- if(!item || this.fireEvent('beforetabchange', this, item, this.activeTab) === false){\r
- return;\r
- }\r
- if(!this.rendered){\r
- this.activeTab = item;\r
- return;\r
- }\r
- if(this.activeTab != item){\r
- if(this.activeTab){\r
- var oldEl = this.getTabEl(this.activeTab);\r
- if(oldEl){\r
- Ext.fly(oldEl).removeClass('x-tab-strip-active');\r
- }\r
- this.activeTab.fireEvent('deactivate', this.activeTab);\r
- }\r
- var el = this.getTabEl(item);\r
- Ext.fly(el).addClass('x-tab-strip-active');\r
- this.activeTab = item;\r
- this.stack.add(item);\r
-\r
- this.layout.setActiveItem(item);\r
- if(this.layoutOnTabChange && item.doLayout){\r
- item.doLayout();\r
- }\r
- if(this.scrolling){\r
- this.scrollToTab(item, this.animScroll);\r
- }\r
-\r
- item.fireEvent('activate', item);\r
- this.fireEvent('tabchange', this, item);\r
- }\r
- },\r
-\r
- \r
- getActiveTab : function(){\r
- return this.activeTab || null;\r
- },\r
-\r
- \r
- getItem : function(item){\r
- return this.getComponent(item);\r
- },\r
-\r
- // private\r
- autoScrollTabs : function(){\r
- this.pos = this.tabPosition=='bottom' ? this.footer : this.header;\r
- var count = this.items.length;\r
- var ow = this.pos.dom.offsetWidth;\r
- var tw = this.pos.dom.clientWidth;\r
-\r
- var wrap = this.stripWrap;\r
- var wd = wrap.dom;\r
- var cw = wd.offsetWidth;\r
- var pos = this.getScrollPos();\r
- var l = this.edge.getOffsetsTo(this.stripWrap)[0] + pos;\r
-\r
- if(!this.enableTabScroll || count < 1 || cw < 20){ // 20 to prevent display:none issues\r
- return;\r
- }\r
- if(l <= tw){\r
- wd.scrollLeft = 0;\r
- wrap.setWidth(tw);\r
- if(this.scrolling){\r
- this.scrolling = false;\r
- this.pos.removeClass('x-tab-scrolling');\r
- this.scrollLeft.hide();\r
- this.scrollRight.hide();\r
- if(Ext.isAir || Ext.isSafari){\r
- wd.style.marginLeft = '';\r
- wd.style.marginRight = '';\r
- }\r
- }\r
- }else{\r
- if(!this.scrolling){\r
- this.pos.addClass('x-tab-scrolling');\r
- if(Ext.isAir || Ext.isSafari){\r
- wd.style.marginLeft = '18px';\r
- wd.style.marginRight = '18px';\r
- }\r
- }\r
- tw -= wrap.getMargins('lr');\r
- wrap.setWidth(tw > 20 ? tw : 20);\r
- if(!this.scrolling){\r
- if(!this.scrollLeft){\r
- this.createScrollers();\r
- }else{\r
- this.scrollLeft.show();\r
- this.scrollRight.show();\r
- }\r
- }\r
- this.scrolling = true;\r
- if(pos > (l-tw)){ // ensure it stays within bounds\r
- wd.scrollLeft = l-tw;\r
- }else{ // otherwise, make sure the active tab is still visible\r
- this.scrollToTab(this.activeTab, false);\r
- }\r
- this.updateScrollButtons();\r
- }\r
- },\r
-\r
- // private\r
- createScrollers : function(){\r
- this.pos.addClass('x-tab-scrolling-' + this.tabPosition);\r
- var h = this.stripWrap.dom.offsetHeight;\r
-\r
- // left\r
- var sl = this.pos.insertFirst({\r
- cls:'x-tab-scroller-left'\r
- });\r
- sl.setHeight(h);\r
- sl.addClassOnOver('x-tab-scroller-left-over');\r
- this.leftRepeater = new Ext.util.ClickRepeater(sl, {\r
- interval : this.scrollRepeatInterval,\r
- handler: this.onScrollLeft,\r
- scope: this\r
- });\r
- this.scrollLeft = sl;\r
-\r
- // right\r
- var sr = this.pos.insertFirst({\r
- cls:'x-tab-scroller-right'\r
- });\r
- sr.setHeight(h);\r
- sr.addClassOnOver('x-tab-scroller-right-over');\r
- this.rightRepeater = new Ext.util.ClickRepeater(sr, {\r
- interval : this.scrollRepeatInterval,\r
- handler: this.onScrollRight,\r
- scope: this\r
- });\r
- this.scrollRight = sr;\r
- },\r
-\r
- // private\r
- getScrollWidth : function(){\r
- return this.edge.getOffsetsTo(this.stripWrap)[0] + this.getScrollPos();\r
- },\r
-\r
- // private\r
- getScrollPos : function(){\r
- return parseInt(this.stripWrap.dom.scrollLeft, 10) || 0;\r
- },\r
-\r
- // private\r
- getScrollArea : function(){\r
- return parseInt(this.stripWrap.dom.clientWidth, 10) || 0;\r
- },\r
-\r
- // private\r
- getScrollAnim : function(){\r
- return {duration:this.scrollDuration, callback: this.updateScrollButtons, scope: this};\r
- },\r
-\r
- // private\r
- getScrollIncrement : function(){\r
- return this.scrollIncrement || (this.resizeTabs ? this.lastTabWidth+2 : 100);\r
- },\r
-\r
- \r
-\r
- scrollToTab : function(item, animate){\r
- if(!item){ return; }\r
- var el = this.getTabEl(item);\r
- var pos = this.getScrollPos(), area = this.getScrollArea();\r
- var left = Ext.fly(el).getOffsetsTo(this.stripWrap)[0] + pos;\r
- var right = left + el.offsetWidth;\r
- if(left < pos){\r
- this.scrollTo(left, animate);\r
- }else if(right > (pos + area)){\r
- this.scrollTo(right - area, animate);\r
- }\r
- },\r
-\r
- // private\r
- scrollTo : function(pos, animate){\r
- this.stripWrap.scrollTo('left', pos, animate ? this.getScrollAnim() : false);\r
- if(!animate){\r
- this.updateScrollButtons();\r
- }\r
- },\r
-\r
- onWheel : function(e){\r
- var d = e.getWheelDelta()*this.wheelIncrement*-1;\r
- e.stopEvent();\r
-\r
- var pos = this.getScrollPos();\r
- var newpos = pos + d;\r
- var sw = this.getScrollWidth()-this.getScrollArea();\r
-\r
- var s = Math.max(0, Math.min(sw, newpos));\r
- if(s != pos){\r
- this.scrollTo(s, false);\r
- }\r
- },\r
-\r
- // private\r
- onScrollRight : function(){\r
- var sw = this.getScrollWidth()-this.getScrollArea();\r
- var pos = this.getScrollPos();\r
- var s = Math.min(sw, pos + this.getScrollIncrement());\r
- if(s != pos){\r
- this.scrollTo(s, this.animScroll);\r
- }\r
- },\r
-\r
- // private\r
- onScrollLeft : function(){\r
- var pos = this.getScrollPos();\r
- var s = Math.max(0, pos - this.getScrollIncrement());\r
- if(s != pos){\r
- this.scrollTo(s, this.animScroll);\r
- }\r
- },\r
-\r
- // private\r
- updateScrollButtons : function(){\r
- var pos = this.getScrollPos();\r
- this.scrollLeft[pos == 0 ? 'addClass' : 'removeClass']('x-tab-scroller-left-disabled');\r
- this.scrollRight[pos >= (this.getScrollWidth()-this.getScrollArea()) ? 'addClass' : 'removeClass']('x-tab-scroller-right-disabled');\r
- },\r
-\r
- // private\r
- beforeDestroy : function() {\r
- if(this.items){\r
- this.items.each(function(item){\r
- if(item && item.tabEl){\r
- Ext.get(item.tabEl).removeAllListeners();\r
- item.tabEl = null;\r
- }\r
- }, this);\r
- }\r
- if(this.strip){\r
- this.strip.removeAllListeners();\r
- }\r
- Ext.TabPanel.superclass.beforeDestroy.apply(this);\r
- }\r
-\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
-\r
-});\r
-Ext.reg('tabpanel', Ext.TabPanel);\r
-\r
-\r
-Ext.TabPanel.prototype.activate = Ext.TabPanel.prototype.setActiveTab;\r
-\r
-// private utility class used by TabPanel\r
-Ext.TabPanel.AccessStack = function(){\r
- var items = [];\r
- return {\r
- add : function(item){\r
- items.push(item);\r
- if(items.length > 10){\r
- items.shift();\r
- }\r
- },\r
-\r
- remove : function(item){\r
- var s = [];\r
- for(var i = 0, len = items.length; i < len; i++) {\r
- if(items[i] != item){\r
- s.push(items[i]);\r
- }\r
- }\r
- items = s;\r
- },\r
-\r
- next : function(){\r
- return items.pop();\r
- }\r
- };\r
-};\r
-\r
-\r
-\r
-\r
-Ext.Button = Ext.extend(Ext.Component, {\r
- \r
- hidden : false,\r
- \r
- disabled : false,\r
- \r
- pressed : false,\r
- \r
-\r
- \r
-\r
- \r
-\r
- \r
- enableToggle: false,\r
- \r
- \r
- \r
- menuAlign : "tl-bl?",\r
-\r
- \r
- \r
- type : 'button',\r
-\r
- // private\r
- menuClassTarget: 'tr',\r
-\r
- \r
- clickEvent : 'click',\r
-\r
- \r
- handleMouseEvents : true,\r
-\r
- \r
- tooltipType : 'qtip',\r
-\r
- \r
- buttonSelector : "button:first-child",\r
-\r
- \r
- \r
-\r
- initComponent : function(){\r
- Ext.Button.superclass.initComponent.call(this);\r
-\r
- this.addEvents(\r
- \r
- "click",\r
- \r
- "toggle",\r
- \r
- 'mouseover',\r
- \r
- 'mouseout',\r
- \r
- 'menushow',\r
- \r
- 'menuhide',\r
- \r
- 'menutriggerover',\r
- \r
- 'menutriggerout'\r
- );\r
- if(this.menu){\r
- this.menu = Ext.menu.MenuMgr.get(this.menu);\r
- }\r
- if(typeof this.toggleGroup === 'string'){\r
- this.enableToggle = true;\r
- }\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- if(!this.template){\r
- if(!Ext.Button.buttonTemplate){\r
- // hideous table template\r
- Ext.Button.buttonTemplate = new Ext.Template(\r
- '<table border="0" cellpadding="0" cellspacing="0" class="x-btn-wrap"><tbody><tr>',\r
- '<td class="x-btn-left"><i> </i></td><td class="x-btn-center"><em unselectable="on"><button class="x-btn-text" type="{1}">{0}</button></em></td><td class="x-btn-right"><i> </i></td>',\r
- "</tr></tbody></table>");\r
- }\r
- this.template = Ext.Button.buttonTemplate;\r
- }\r
- var btn, targs = [this.text || ' ', this.type];\r
-\r
- if(position){\r
- btn = this.template.insertBefore(position, targs, true);\r
- }else{\r
- btn = this.template.append(ct, targs, true);\r
- }\r
- var btnEl = btn.child(this.buttonSelector);\r
- btnEl.on('focus', this.onFocus, this);\r
- btnEl.on('blur', this.onBlur, this);\r
-\r
- this.initButtonEl(btn, btnEl);\r
-\r
- if(this.menu){\r
- this.el.child(this.menuClassTarget).addClass("x-btn-with-menu");\r
- }\r
- Ext.ButtonToggleMgr.register(this);\r
- },\r
-\r
- // private\r
- initButtonEl : function(btn, btnEl){\r
-\r
- this.el = btn;\r
- btn.addClass("x-btn");\r
-\r
- if(this.id){\r
- this.el.dom.id = this.el.id = this.id;\r
- }\r
- if(this.icon){\r
- btnEl.setStyle('background-image', 'url(' +this.icon +')');\r
- }\r
- if(this.iconCls){\r
- btnEl.addClass(this.iconCls);\r
- if(!this.cls){\r
- btn.addClass(this.text ? 'x-btn-text-icon' : 'x-btn-icon');\r
- }\r
- }\r
- if(this.tabIndex !== undefined){\r
- btnEl.dom.tabIndex = this.tabIndex;\r
- }\r
- if(this.tooltip){\r
- if(typeof this.tooltip == 'object'){\r
- Ext.QuickTips.register(Ext.apply({\r
- target: btnEl.id\r
- }, this.tooltip));\r
- } else {\r
- btnEl.dom[this.tooltipType] = this.tooltip;\r
- }\r
- }\r
-\r
- if(this.pressed){\r
- this.el.addClass("x-btn-pressed");\r
- }\r
-\r
- if(this.handleMouseEvents){\r
- btn.on("mouseover", this.onMouseOver, this);\r
- // new functionality for monitoring on the document level\r
- //btn.on("mouseout", this.onMouseOut, this);\r
- btn.on("mousedown", this.onMouseDown, this);\r
- }\r
-\r
- if(this.menu){\r
- this.menu.on("show", this.onMenuShow, this);\r
- this.menu.on("hide", this.onMenuHide, this);\r
- }\r
-\r
- if(this.repeat){\r
- var repeater = new Ext.util.ClickRepeater(btn,\r
- typeof this.repeat == "object" ? this.repeat : {}\r
- );\r
- repeater.on("click", this.onClick, this);\r
- }\r
-\r
- btn.on(this.clickEvent, this.onClick, this);\r
- },\r
-\r
- // private\r
- afterRender : function(){\r
- Ext.Button.superclass.afterRender.call(this);\r
- if(Ext.isIE6){\r
- this.autoWidth.defer(1, this);\r
- }else{\r
- this.autoWidth();\r
- }\r
- },\r
-\r
- \r
- setIconClass : function(cls){\r
- if(this.el){\r
- this.el.child(this.buttonSelector).replaceClass(this.iconCls, cls);\r
- }\r
- this.iconCls = cls;\r
- },\r
-\r
- // private\r
- beforeDestroy: function(){\r
- if(this.rendered){\r
- var btnEl = this.el.child(this.buttonSelector);\r
- if(btnEl){\r
- if(this.tooltip){\r
- Ext.QuickTips.unregister(btnEl);\r
- }\r
- btnEl.removeAllListeners();\r
- }\r
- }\r
- if(this.menu){\r
- Ext.destroy(this.menu);\r
- }\r
- },\r
-\r
- // private\r
- onDestroy : function(){\r
- if(this.rendered){\r
- Ext.ButtonToggleMgr.unregister(this);\r
- }\r
- },\r
-\r
- // private\r
- autoWidth : function(){\r
- if(this.el){\r
- this.el.setWidth("auto");\r
- if(Ext.isIE7 && Ext.isStrict){\r
- var ib = this.el.child(this.buttonSelector);\r
- if(ib && ib.getWidth() > 20){\r
- ib.clip();\r
- ib.setWidth(Ext.util.TextMetrics.measure(ib, this.text).width+ib.getFrameWidth('lr'));\r
- }\r
- }\r
- if(this.minWidth){\r
- if(this.el.getWidth() < this.minWidth){\r
- this.el.setWidth(this.minWidth);\r
- }\r
- }\r
- }\r
- },\r
-\r
- \r
- setHandler : function(handler, scope){\r
- this.handler = handler;\r
- this.scope = scope;\r
- },\r
-\r
- \r
- setText : function(text){\r
- this.text = text;\r
- if(this.el){\r
- this.el.child("td.x-btn-center " + this.buttonSelector).update(text);\r
- }\r
- this.autoWidth();\r
- },\r
-\r
- \r
- getText : function(){\r
- return this.text;\r
- },\r
-\r
- \r
- toggle : function(state){\r
- state = state === undefined ? !this.pressed : state;\r
- if(state != this.pressed){\r
- if(state){\r
- this.el.addClass("x-btn-pressed");\r
- this.pressed = true;\r
- this.fireEvent("toggle", this, true);\r
- }else{\r
- this.el.removeClass("x-btn-pressed");\r
- this.pressed = false;\r
- this.fireEvent("toggle", this, false);\r
- }\r
- if(this.toggleHandler){\r
- this.toggleHandler.call(this.scope || this, this, state);\r
- }\r
- }\r
- },\r
-\r
- \r
- focus : function(){\r
- this.el.child(this.buttonSelector).focus();\r
- },\r
-\r
- // private\r
- onDisable : function(){\r
- if(this.el){\r
- if(!Ext.isIE6 || !this.text){\r
- this.el.addClass(this.disabledClass);\r
- }\r
- this.el.dom.disabled = true;\r
- }\r
- this.disabled = true;\r
- },\r
-\r
- // private\r
- onEnable : function(){\r
- if(this.el){\r
- if(!Ext.isIE6 || !this.text){\r
- this.el.removeClass(this.disabledClass);\r
- }\r
- this.el.dom.disabled = false;\r
- }\r
- this.disabled = false;\r
- },\r
-\r
- \r
- showMenu : function(){\r
- if(this.menu){\r
- this.menu.show(this.el, this.menuAlign);\r
- }\r
- return this;\r
- },\r
-\r
- \r
- hideMenu : function(){\r
- if(this.menu){\r
- this.menu.hide();\r
- }\r
- return this;\r
- },\r
-\r
- \r
- hasVisibleMenu : function(){\r
- return this.menu && this.menu.isVisible();\r
- },\r
-\r
- // private\r
- onClick : function(e){\r
- if(e){\r
- e.preventDefault();\r
- }\r
- if(e.button != 0){\r
- return;\r
- }\r
- if(!this.disabled){\r
- if(this.enableToggle && (this.allowDepress !== false || !this.pressed)){\r
- this.toggle();\r
- }\r
- if(this.menu && !this.menu.isVisible() && !this.ignoreNextClick){\r
- this.showMenu();\r
- }\r
- this.fireEvent("click", this, e);\r
- if(this.handler){\r
- //this.el.removeClass("x-btn-over");\r
- this.handler.call(this.scope || this, this, e);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- isMenuTriggerOver : function(e, internal){\r
- return this.menu && !internal;\r
- },\r
-\r
- // private\r
- isMenuTriggerOut : function(e, internal){\r
- return this.menu && !internal;\r
- },\r
-\r
- // private\r
- onMouseOver : function(e){\r
- if(!this.disabled){\r
- var internal = e.within(this.el, true);\r
- if(!internal){\r
- this.el.addClass("x-btn-over");\r
- if(!this.monitoringMouseOver){\r
- Ext.getDoc().on('mouseover', this.monitorMouseOver, this);\r
- this.monitoringMouseOver = true;\r
- }\r
- this.fireEvent('mouseover', this, e);\r
- }\r
- if(this.isMenuTriggerOver(e, internal)){\r
- this.fireEvent('menutriggerover', this, this.menu, e);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- monitorMouseOver : function(e){\r
- if(e.target != this.el.dom && !e.within(this.el)){\r
- if(this.monitoringMouseOver){\r
- Ext.getDoc().un('mouseover', this.monitorMouseOver, this);\r
- this.monitoringMouseOver = false;\r
- }\r
- this.onMouseOut(e);\r
- }\r
- },\r
-\r
- // private\r
- onMouseOut : function(e){\r
- var internal = e.within(this.el) && e.target != this.el.dom;\r
- this.el.removeClass("x-btn-over");\r
- this.fireEvent('mouseout', this, e);\r
- if(this.isMenuTriggerOut(e, internal)){\r
- this.fireEvent('menutriggerout', this, this.menu, e);\r
- }\r
- },\r
- // private\r
- onFocus : function(e){\r
- if(!this.disabled){\r
- this.el.addClass("x-btn-focus");\r
- }\r
- },\r
- // private\r
- onBlur : function(e){\r
- this.el.removeClass("x-btn-focus");\r
- },\r
-\r
- // private\r
- getClickEl : function(e, isUp){\r
- return this.el;\r
- },\r
-\r
- // private\r
- onMouseDown : function(e){\r
- if(!this.disabled && e.button == 0){\r
- this.getClickEl(e).addClass("x-btn-click");\r
- Ext.getDoc().on('mouseup', this.onMouseUp, this);\r
- }\r
- },\r
- // private\r
- onMouseUp : function(e){\r
- if(e.button == 0){\r
- this.getClickEl(e, true).removeClass("x-btn-click");\r
- Ext.getDoc().un('mouseup', this.onMouseUp, this);\r
- }\r
- },\r
- // private\r
- onMenuShow : function(e){\r
- this.ignoreNextClick = 0;\r
- this.el.addClass("x-btn-menu-active");\r
- this.fireEvent('menushow', this, this.menu);\r
- },\r
- // private\r
- onMenuHide : function(e){\r
- this.el.removeClass("x-btn-menu-active");\r
- this.ignoreNextClick = this.restoreClick.defer(250, this);\r
- this.fireEvent('menuhide', this, this.menu);\r
- },\r
-\r
- // private\r
- restoreClick : function(){\r
- this.ignoreNextClick = 0;\r
- }\r
-\r
-\r
-\r
- \r
-});\r
-Ext.reg('button', Ext.Button);\r
-\r
-// Private utility class used by Button\r
-Ext.ButtonToggleMgr = function(){\r
- var groups = {};\r
-\r
- function toggleGroup(btn, state){\r
- if(state){\r
- var g = groups[btn.toggleGroup];\r
- for(var i = 0, l = g.length; i < l; i++){\r
- if(g[i] != btn){\r
- g[i].toggle(false);\r
- }\r
- }\r
- }\r
- }\r
-\r
- return {\r
- register : function(btn){\r
- if(!btn.toggleGroup){\r
- return;\r
- }\r
- var g = groups[btn.toggleGroup];\r
- if(!g){\r
- g = groups[btn.toggleGroup] = [];\r
- }\r
- g.push(btn);\r
- btn.on("toggle", toggleGroup);\r
- },\r
-\r
- unregister : function(btn){\r
- if(!btn.toggleGroup){\r
- return;\r
- }\r
- var g = groups[btn.toggleGroup];\r
- if(g){\r
- g.remove(btn);\r
- btn.un("toggle", toggleGroup);\r
- }\r
- }\r
- };\r
-}();\r
-\r
-Ext.SplitButton = Ext.extend(Ext.Button, {\r
- // private\r
- arrowSelector : 'button:last',\r
-\r
- // private\r
- initComponent : function(){\r
- Ext.SplitButton.superclass.initComponent.call(this);\r
- \r
- this.addEvents("arrowclick");\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- // this is one sweet looking template!\r
- var tpl = new Ext.Template(\r
- '<table cellspacing="0" class="x-btn-menu-wrap x-btn"><tr><td>',\r
- '<table cellspacing="0" class="x-btn-wrap x-btn-menu-text-wrap"><tbody>',\r
- '<tr><td class="x-btn-left"><i> </i></td><td class="x-btn-center"><button class="x-btn-text" type="{1}">{0}</button></td></tr>',\r
- "</tbody></table></td><td>",\r
- '<table cellspacing="0" class="x-btn-wrap x-btn-menu-arrow-wrap"><tbody>',\r
- '<tr><td class="x-btn-center"><button class="x-btn-menu-arrow-el" type="button"> </button></td><td class="x-btn-right"><i> </i></td></tr>',\r
- "</tbody></table></td></tr></table>"\r
- );\r
- var btn, targs = [this.text || ' ', this.type];\r
- if(position){\r
- btn = tpl.insertBefore(position, targs, true);\r
- }else{\r
- btn = tpl.append(ct, targs, true);\r
- }\r
- var btnEl = btn.child(this.buttonSelector);\r
-\r
- this.initButtonEl(btn, btnEl);\r
- this.arrowBtnTable = btn.child("table:last");\r
- if(this.arrowTooltip){\r
- btn.child(this.arrowSelector).dom[this.tooltipType] = this.arrowTooltip;\r
- }\r
- },\r
-\r
- // private\r
- autoWidth : function(){\r
- if(this.el){\r
- var tbl = this.el.child("table:first");\r
- var tbl2 = this.el.child("table:last");\r
- this.el.setWidth("auto");\r
- tbl.setWidth("auto");\r
- if(Ext.isIE7 && Ext.isStrict){\r
- var ib = this.el.child(this.buttonSelector);\r
- if(ib && ib.getWidth() > 20){\r
- ib.clip();\r
- ib.setWidth(Ext.util.TextMetrics.measure(ib, this.text).width+ib.getFrameWidth('lr'));\r
- }\r
- }\r
- if(this.minWidth){\r
- if((tbl.getWidth()+tbl2.getWidth()) < this.minWidth){\r
- tbl.setWidth(this.minWidth-tbl2.getWidth());\r
- }\r
- }\r
- this.el.setWidth(tbl.getWidth()+tbl2.getWidth());\r
- } \r
- },\r
-\r
- \r
- setArrowHandler : function(handler, scope){\r
- this.arrowHandler = handler;\r
- this.scope = scope; \r
- },\r
-\r
- // private\r
- onClick : function(e){\r
- e.preventDefault();\r
- if(!this.disabled){\r
- if(e.getTarget(".x-btn-menu-arrow-wrap")){\r
- if(this.menu && !this.menu.isVisible() && !this.ignoreNextClick){\r
- this.showMenu();\r
- }\r
- this.fireEvent("arrowclick", this, e);\r
- if(this.arrowHandler){\r
- this.arrowHandler.call(this.scope || this, this, e);\r
- }\r
- }else{\r
- if(this.enableToggle){\r
- this.toggle();\r
- }\r
- this.fireEvent("click", this, e);\r
- if(this.handler){\r
- this.handler.call(this.scope || this, this, e);\r
- }\r
- }\r
- }\r
- },\r
-\r
- // private\r
- getClickEl : function(e, isUp){\r
- if(!isUp){\r
- return (this.lastClickEl = e.getTarget("table", 10, true));\r
- }\r
- return this.lastClickEl;\r
- },\r
-\r
- // private\r
- onDisable : function(){\r
- if(this.el){\r
- if(!Ext.isIE6){\r
- this.el.addClass("x-item-disabled");\r
- }\r
- this.el.child(this.buttonSelector).dom.disabled = true;\r
- this.el.child(this.arrowSelector).dom.disabled = true;\r
- }\r
- this.disabled = true;\r
- },\r
-\r
- // private\r
- onEnable : function(){\r
- if(this.el){\r
- if(!Ext.isIE6){\r
- this.el.removeClass("x-item-disabled");\r
- }\r
- this.el.child(this.buttonSelector).dom.disabled = false;\r
- this.el.child(this.arrowSelector).dom.disabled = false;\r
- }\r
- this.disabled = false;\r
- },\r
-\r
- // private\r
- isMenuTriggerOver : function(e){\r
- return this.menu && e.within(this.arrowBtnTable) && !e.within(this.arrowBtnTable, true);\r
- },\r
-\r
- // private\r
- isMenuTriggerOut : function(e, internal){\r
- return this.menu && !e.within(this.arrowBtnTable);\r
- },\r
-\r
- // private\r
- onDestroy : function(){\r
- Ext.destroy(this.arrowBtnTable);\r
- Ext.SplitButton.superclass.onDestroy.call(this);\r
- }\r
-});\r
-\r
-// backwards compat\r
-Ext.MenuButton = Ext.SplitButton;\r
-\r
-\r
-Ext.reg('splitbutton', Ext.SplitButton);\r
-\r
-Ext.CycleButton = Ext.extend(Ext.SplitButton, {\r
- \r
- \r
- \r
- \r
- \r
-\r
- // private\r
- getItemText : function(item){\r
- if(item && this.showText === true){\r
- var text = '';\r
- if(this.prependText){\r
- text += this.prependText;\r
- }\r
- text += item.text;\r
- return text;\r
- }\r
- return undefined;\r
- },\r
-\r
- \r
- setActiveItem : function(item, suppressEvent){\r
- if(typeof item != 'object'){\r
- item = this.menu.items.get(item);\r
- }\r
- if(item){\r
- if(!this.rendered){\r
- this.text = this.getItemText(item);\r
- this.iconCls = item.iconCls;\r
- }else{\r
- var t = this.getItemText(item);\r
- if(t){\r
- this.setText(t);\r
- }\r
- this.setIconClass(item.iconCls);\r
- }\r
- this.activeItem = item;\r
- if(!item.checked){\r
- item.setChecked(true, true);\r
- }\r
- if(this.forceIcon){\r
- this.setIconClass(this.forceIcon);\r
- }\r
- if(!suppressEvent){\r
- this.fireEvent('change', this, item);\r
- }\r
- }\r
- },\r
-\r
- \r
- getActiveItem : function(){\r
- return this.activeItem;\r
- },\r
-\r
- // private\r
- initComponent : function(){\r
- this.addEvents(\r
- \r
- "change"\r
- );\r
-\r
- if(this.changeHandler){\r
- this.on('change', this.changeHandler, this.scope||this);\r
- delete this.changeHandler;\r
- }\r
-\r
- this.itemCount = this.items.length;\r
-\r
- this.menu = {cls:'x-cycle-menu', items:[]};\r
- var checked;\r
- for(var i = 0, len = this.itemCount; i < len; i++){\r
- var item = this.items[i];\r
- item.group = item.group || this.id;\r
- item.itemIndex = i;\r
- item.checkHandler = this.checkHandler;\r
- item.scope = this;\r
- item.checked = item.checked || false;\r
- this.menu.items.push(item);\r
- if(item.checked){\r
- checked = item;\r
- }\r
- }\r
- this.setActiveItem(checked, true);\r
- Ext.CycleButton.superclass.initComponent.call(this);\r
-\r
- this.on('click', this.toggleSelected, this);\r
- },\r
-\r
- // private\r
- checkHandler : function(item, pressed){\r
- if(pressed){\r
- this.setActiveItem(item);\r
- }\r
- },\r
-\r
- \r
- toggleSelected : function(){\r
- this.menu.render();\r
- \r
- var nextIdx, checkItem;\r
- for (var i = 1; i < this.itemCount; i++) {\r
- nextIdx = (this.activeItem.itemIndex + i) % this.itemCount;\r
- // check the potential item\r
- checkItem = this.menu.items.itemAt(nextIdx);\r
- // if its not disabled then check it.\r
- if (!checkItem.disabled) {\r
- checkItem.setChecked(true);\r
- break;\r
- }\r
- }\r
- }\r
-});\r
-Ext.reg('cycle', Ext.CycleButton);\r
- \r
- Ext.Toolbar = function(config){\r
- if(Ext.isArray(config)){\r
- config = {buttons:config};\r
- }\r
- Ext.Toolbar.superclass.constructor.call(this, config);\r
-};\r
-\r
-(function(){\r
-\r
-var T = Ext.Toolbar;\r
-\r
-Ext.extend(T, Ext.BoxComponent, {\r
-\r
- trackMenus : true,\r
-\r
- // private\r
- initComponent : function(){\r
- T.superclass.initComponent.call(this);\r
-\r
- if(this.items){\r
- this.buttons = this.items;\r
- }\r
- \r
- this.items = new Ext.util.MixedCollection(false, function(o){\r
- return o.itemId || o.id || Ext.id();\r
- });\r
- },\r
-\r
- // private\r
- autoCreate: {\r
- cls:'x-toolbar x-small-editor',\r
- html:'<table cellspacing="0"><tr></tr></table>'\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- this.el = ct.createChild(Ext.apply({ id: this.id },this.autoCreate), position);\r
- this.tr = this.el.child("tr", true);\r
- },\r
-\r
- // private\r
- afterRender : function(){\r
- T.superclass.afterRender.call(this);\r
- if(this.buttons){\r
- this.add.apply(this, this.buttons);\r
- delete this.buttons;\r
- }\r
- },\r
-\r
- \r
- add : function(){\r
- var a = arguments, l = a.length;\r
- for(var i = 0; i < l; i++){\r
- var el = a[i];\r
- if(el.isFormField){ // some kind of form field\r
- this.addField(el);\r
- }else if(el.render){ // some kind of Toolbar.Item\r
- this.addItem(el);\r
- }else if(typeof el == "string"){ // string\r
- if(el == "separator" || el == "-"){\r
- this.addSeparator();\r
- }else if(el == " "){\r
- this.addSpacer();\r
- }else if(el == "->"){\r
- this.addFill();\r
- }else{\r
- this.addText(el);\r
- }\r
- }else if(el.tagName){ // element\r
- this.addElement(el);\r
- }else if(typeof el == "object"){ // must be button config?\r
- if(el.xtype){\r
- this.addField(Ext.ComponentMgr.create(el, 'button'));\r
- }else{\r
- this.addButton(el);\r
- }\r
- }\r
- }\r
- },\r
- \r
- \r
- addSeparator : function(){\r
- return this.addItem(new T.Separator());\r
- },\r
-\r
- \r
- addSpacer : function(){\r
- return this.addItem(new T.Spacer());\r
- },\r
-\r
- \r
- addFill : function(){\r
- return this.addItem(new T.Fill());\r
- },\r
-\r
- \r
- addElement : function(el){\r
- return this.addItem(new T.Item(el));\r
- },\r
- \r
- \r
- addItem : function(item){\r
- var td = this.nextBlock();\r
- this.initMenuTracking(item);\r
- item.render(td);\r
- this.items.add(item);\r
- return item;\r
- },\r
- \r
- \r
- addButton : function(config){\r
- if(Ext.isArray(config)){\r
- var buttons = [];\r
- for(var i = 0, len = config.length; i < len; i++) {\r
- buttons.push(this.addButton(config[i]));\r
- }\r
- return buttons;\r
- }\r
- var b = config;\r
- if(!(config instanceof T.Button)){\r
- b = config.split ? \r
- new T.SplitButton(config) :\r
- new T.Button(config);\r
- }\r
- var td = this.nextBlock();\r
- this.initMenuTracking(b);\r
- b.render(td);\r
- this.items.add(b);\r
- return b;\r
- },\r
-\r
- // private\r
- initMenuTracking : function(item){\r
- if(this.trackMenus && item.menu){\r
- item.on({\r
- 'menutriggerover' : this.onButtonTriggerOver,\r
- 'menushow' : this.onButtonMenuShow,\r
- 'menuhide' : this.onButtonMenuHide,\r
- scope: this\r
- })\r
- }\r
- },\r
-\r
- \r
- addText : function(text){\r
- return this.addItem(new T.TextItem(text));\r
- },\r
- \r
- \r
- insertButton : function(index, item){\r
- if(Ext.isArray(item)){\r
- var buttons = [];\r
- for(var i = 0, len = item.length; i < len; i++) {\r
- buttons.push(this.insertButton(index + i, item[i]));\r
- }\r
- return buttons;\r
- }\r
- if (!(item instanceof T.Button)){\r
- item = new T.Button(item);\r
- }\r
- var td = document.createElement("td");\r
- this.tr.insertBefore(td, this.tr.childNodes[index]);\r
- this.initMenuTracking(item);\r
- item.render(td);\r
- this.items.insert(index, item);\r
- return item;\r
- },\r
- \r
- \r
- addDom : function(config, returnEl){\r
- var td = this.nextBlock();\r
- Ext.DomHelper.overwrite(td, config);\r
- var ti = new T.Item(td.firstChild);\r
- ti.render(td);\r
- this.items.add(ti);\r
- return ti;\r
- },\r
-\r
- \r
- addField : function(field){\r
- var td = this.nextBlock();\r
- field.render(td);\r
- var ti = new T.Item(td.firstChild);\r
- ti.render(td);\r
- this.items.add(field);\r
- return ti;\r
- },\r
-\r
- // private\r
- nextBlock : function(){\r
- var td = document.createElement("td");\r
- this.tr.appendChild(td);\r
- return td;\r
- },\r
-\r
- // private\r
- onDestroy : function(){\r
- Ext.Toolbar.superclass.onDestroy.call(this);\r
- if(this.rendered){\r
- if(this.items){ // rendered?\r
- Ext.destroy.apply(Ext, this.items.items);\r
- }\r
- Ext.Element.uncache(this.tr);\r
- }\r
- },\r
-\r
- // private\r
- onDisable : function(){\r
- this.items.each(function(item){\r
- if(item.disable){\r
- item.disable();\r
- }\r
- });\r
- },\r
-\r
- // private\r
- onEnable : function(){\r
- this.items.each(function(item){\r
- if(item.enable){\r
- item.enable();\r
- }\r
- });\r
- },\r
-\r
- // private\r
- onButtonTriggerOver : function(btn){\r
- if(this.activeMenuBtn && this.activeMenuBtn != btn){\r
- this.activeMenuBtn.hideMenu();\r
- btn.showMenu();\r
- this.activeMenuBtn = btn;\r
- }\r
- },\r
-\r
- // private\r
- onButtonMenuShow : function(btn){\r
- this.activeMenuBtn = btn;\r
- },\r
-\r
- // private\r
- onButtonMenuHide : function(btn){\r
- delete this.activeMenuBtn;\r
- }\r
-\r
- \r
-});\r
-Ext.reg('toolbar', Ext.Toolbar);\r
-\r
-\r
-T.Item = function(el){\r
- this.el = Ext.getDom(el);\r
- this.id = Ext.id(this.el);\r
- this.hidden = false;\r
-};\r
-\r
-T.Item.prototype = {\r
- \r
- \r
- getEl : function(){\r
- return this.el; \r
- },\r
-\r
- // private\r
- render : function(td){\r
- this.td = td;\r
- td.appendChild(this.el);\r
- },\r
- \r
- \r
- destroy : function(){\r
- if(this.el){\r
- var el = Ext.get(this.el);\r
- Ext.destroy(el);\r
- }\r
- Ext.removeNode(this.td);\r
- },\r
- \r
- \r
- show: function(){\r
- this.hidden = false;\r
- this.td.style.display = "";\r
- },\r
- \r
- \r
- hide: function(){\r
- this.hidden = true;\r
- this.td.style.display = "none";\r
- },\r
- \r
- \r
- setVisible: function(visible){\r
- if(visible) {\r
- this.show();\r
- }else{\r
- this.hide();\r
- }\r
- },\r
- \r
- \r
- focus : function(){\r
- Ext.fly(this.el).focus();\r
- },\r
- \r
- \r
- disable : function(){\r
- Ext.fly(this.td).addClass("x-item-disabled");\r
- this.disabled = true;\r
- this.el.disabled = true;\r
- },\r
- \r
- \r
- enable : function(){\r
- Ext.fly(this.td).removeClass("x-item-disabled");\r
- this.disabled = false;\r
- this.el.disabled = false;\r
- }\r
-};\r
-Ext.reg('tbitem', T.Item);\r
-\r
-\r
-\r
-T.Separator = function(){\r
- var s = document.createElement("span");\r
- s.className = "ytb-sep";\r
- T.Separator.superclass.constructor.call(this, s);\r
-};\r
-Ext.extend(T.Separator, T.Item, {\r
- enable:Ext.emptyFn,\r
- disable:Ext.emptyFn,\r
- focus:Ext.emptyFn\r
-});\r
-Ext.reg('tbseparator', T.Separator);\r
-\r
-\r
-T.Spacer = function(){\r
- var s = document.createElement("div");\r
- s.className = "ytb-spacer";\r
- T.Spacer.superclass.constructor.call(this, s);\r
-};\r
-Ext.extend(T.Spacer, T.Item, {\r
- enable:Ext.emptyFn,\r
- disable:Ext.emptyFn,\r
- focus:Ext.emptyFn\r
-});\r
-\r
-Ext.reg('tbspacer', T.Spacer);\r
-\r
-\r
-T.Fill = Ext.extend(T.Spacer, {\r
- // private\r
- render : function(td){\r
- td.style.width = '100%';\r
- T.Fill.superclass.render.call(this, td);\r
- }\r
-});\r
-Ext.reg('tbfill', T.Fill);\r
-\r
-\r
-T.TextItem = function(t){\r
- var s = document.createElement("span");\r
- s.className = "ytb-text";\r
- s.innerHTML = t.text ? t.text : t;\r
- T.TextItem.superclass.constructor.call(this, s);\r
-};\r
-Ext.extend(T.TextItem, T.Item, {\r
- enable:Ext.emptyFn,\r
- disable:Ext.emptyFn,\r
- focus:Ext.emptyFn\r
-});\r
-Ext.reg('tbtext', T.TextItem);\r
-\r
-\r
-\r
-T.Button = Ext.extend(Ext.Button, {\r
- hideParent : true,\r
-\r
- onDestroy : function(){\r
- T.Button.superclass.onDestroy.call(this);\r
- if(this.container){\r
- this.container.remove();\r
- }\r
- }\r
-});\r
-Ext.reg('tbbutton', T.Button);\r
-\r
-\r
-T.SplitButton = Ext.extend(Ext.SplitButton, {\r
- hideParent : true,\r
-\r
- onDestroy : function(){\r
- T.SplitButton.superclass.onDestroy.call(this);\r
- if(this.container){\r
- this.container.remove();\r
- }\r
- }\r
-});\r
-\r
-Ext.reg('tbsplit', T.SplitButton);\r
-// backwards compat\r
-T.MenuButton = T.SplitButton;\r
-\r
-})();\r
-\r
-\r
-Ext.PagingToolbar = Ext.extend(Ext.Toolbar, {\r
- \r
- \r
- \r
- pageSize: 20,\r
- \r
- displayMsg : 'Displaying {0} - {1} of {2}',\r
- \r
- emptyMsg : 'No data to display',\r
- \r
- beforePageText : "Page",\r
- \r
- afterPageText : "of {0}",\r
- \r
- firstText : "First Page",\r
- \r
- prevText : "Previous Page",\r
- \r
- nextText : "Next Page",\r
- \r
- lastText : "Last Page",\r
- \r
- refreshText : "Refresh",\r
-\r
- \r
- paramNames : {start: 'start', limit: 'limit'},\r
-\r
- // private\r
- initComponent : function(){\r
- this.addEvents(\r
- \r
- 'change',\r
- \r
- 'beforechange'\r
- );\r
- Ext.PagingToolbar.superclass.initComponent.call(this);\r
- this.cursor = 0;\r
- this.bind(this.store);\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- Ext.PagingToolbar.superclass.onRender.call(this, ct, position);\r
- this.first = this.addButton({\r
- tooltip: this.firstText,\r
- iconCls: "x-tbar-page-first",\r
- disabled: true,\r
- handler: this.onClick.createDelegate(this, ["first"])\r
- });\r
- this.prev = this.addButton({\r
- tooltip: this.prevText,\r
- iconCls: "x-tbar-page-prev",\r
- disabled: true,\r
- handler: this.onClick.createDelegate(this, ["prev"])\r
- });\r
- this.addSeparator();\r
- this.add(this.beforePageText);\r
- this.field = Ext.get(this.addDom({\r
- tag: "input",\r
- type: "text",\r
- size: "3",\r
- value: "1",\r
- cls: "x-tbar-page-number"\r
- }).el);\r
- this.field.on("keydown", this.onPagingKeydown, this);\r
- this.field.on("focus", function(){this.dom.select();});\r
- this.field.on("blur", this.onPagingBlur, this);\r
- this.afterTextEl = this.addText(String.format(this.afterPageText, 1));\r
- this.field.setHeight(18);\r
- this.addSeparator();\r
- this.next = this.addButton({\r
- tooltip: this.nextText,\r
- iconCls: "x-tbar-page-next",\r
- disabled: true,\r
- handler: this.onClick.createDelegate(this, ["next"])\r
- });\r
- this.last = this.addButton({\r
- tooltip: this.lastText,\r
- iconCls: "x-tbar-page-last",\r
- disabled: true,\r
- handler: this.onClick.createDelegate(this, ["last"])\r
- });\r
- this.addSeparator();\r
- this.loading = this.addButton({\r
- tooltip: this.refreshText,\r
- iconCls: "x-tbar-loading",\r
- handler: this.onClick.createDelegate(this, ["refresh"])\r
- });\r
-\r
- if(this.displayInfo){\r
- this.displayEl = Ext.fly(this.el.dom).createChild({cls:'x-paging-info'});\r
- }\r
- if(this.dsLoaded){\r
- this.onLoad.apply(this, this.dsLoaded);\r
- }\r
- },\r
-\r
- // private\r
- updateInfo : function(){\r
- if(this.displayEl){\r
- var count = this.store.getCount();\r
- var msg = count == 0 ?\r
- this.emptyMsg :\r
- String.format(\r
- this.displayMsg,\r
- this.cursor+1, this.cursor+count, this.store.getTotalCount()\r
- );\r
- this.displayEl.update(msg);\r
- }\r
- },\r
-\r
- // private\r
- onLoad : function(store, r, o){\r
- if(!this.rendered){\r
- this.dsLoaded = [store, r, o];\r
- return;\r
- }\r
- this.cursor = o.params ? o.params[this.paramNames.start] : 0;\r
- var d = this.getPageData(), ap = d.activePage, ps = d.pages;\r
-\r
- this.afterTextEl.el.innerHTML = String.format(this.afterPageText, d.pages);\r
- this.field.dom.value = ap;\r
- this.first.setDisabled(ap == 1);\r
- this.prev.setDisabled(ap == 1);\r
- this.next.setDisabled(ap == ps);\r
- this.last.setDisabled(ap == ps);\r
- this.loading.enable();\r
- this.updateInfo();\r
- this.fireEvent('change', this, d);\r
- },\r
-\r
- // private\r
- getPageData : function(){\r
- var total = this.store.getTotalCount();\r
- return {\r
- total : total,\r
- activePage : Math.ceil((this.cursor+this.pageSize)/this.pageSize),\r
- pages : total < this.pageSize ? 1 : Math.ceil(total/this.pageSize)\r
- };\r
- },\r
-\r
- // private\r
- onLoadError : function(){\r
- if(!this.rendered){\r
- return;\r
- }\r
- this.loading.enable();\r
- },\r
-\r
- // private\r
- readPage : function(d){\r
- var v = this.field.dom.value, pageNum;\r
- if (!v || isNaN(pageNum = parseInt(v, 10))) {\r
- this.field.dom.value = d.activePage;\r
- return false;\r
- }\r
- return pageNum;\r
- },\r
-\r
- //private\r
- onPagingBlur: function(e){\r
- this.field.dom.value = this.getPageData().activePage;\r
- },\r
-\r
- // private\r
- onPagingKeydown : function(e){\r
- var k = e.getKey(), d = this.getPageData(), pageNum;\r
- if (k == e.RETURN) {\r
- e.stopEvent();\r
- pageNum = this.readPage(d);\r
- if(pageNum !== false){\r
- pageNum = Math.min(Math.max(1, pageNum), d.pages) - 1;\r
- this.doLoad(pageNum * this.pageSize);\r
- }\r
- }else if (k == e.HOME || k == e.END){\r
- e.stopEvent();\r
- pageNum = k == e.HOME ? 1 : d.pages;\r
- this.field.dom.value = pageNum;\r
- }else if (k == e.UP || k == e.PAGEUP || k == e.DOWN || k == e.PAGEDOWN){\r
- e.stopEvent();\r
- if(pageNum = this.readPage(d)){\r
- var increment = e.shiftKey ? 10 : 1;\r
- if(k == e.DOWN || k == e.PAGEDOWN){\r
- increment *= -1;\r
- }\r
- pageNum += increment;\r
- if(pageNum >= 1 & pageNum <= d.pages){\r
- this.field.dom.value = pageNum;\r
- }\r
- }\r
- }\r
- },\r
-\r
- // private\r
- beforeLoad : function(){\r
- if(this.rendered && this.loading){\r
- this.loading.disable();\r
- }\r
- },\r
-\r
- // private\r
- doLoad : function(start){\r
- var o = {}, pn = this.paramNames;\r
- o[pn.start] = start;\r
- o[pn.limit] = this.pageSize;\r
- if(this.fireEvent('beforechange', this, o) !== false){\r
- this.store.load({params:o});\r
- }\r
- },\r
-\r
- \r
- changePage: function(page){\r
- this.doLoad(((page-1) * this.pageSize).constrain(0, this.store.getTotalCount()));\r
- },\r
-\r
- // private\r
- onClick : function(which){\r
- var store = this.store;\r
- switch(which){\r
- case "first":\r
- this.doLoad(0);\r
- break;\r
- case "prev":\r
- this.doLoad(Math.max(0, this.cursor-this.pageSize));\r
- break;\r
- case "next":\r
- this.doLoad(this.cursor+this.pageSize);\r
- break;\r
- case "last":\r
- var total = store.getTotalCount();\r
- var extra = total % this.pageSize;\r
- var lastStart = extra ? (total - extra) : total-this.pageSize;\r
- this.doLoad(lastStart);\r
- break;\r
- case "refresh":\r
- this.doLoad(this.cursor);\r
- break;\r
- }\r
- },\r
-\r
- \r
- unbind : function(store){\r
- store = Ext.StoreMgr.lookup(store);\r
- store.un("beforeload", this.beforeLoad, this);\r
- store.un("load", this.onLoad, this);\r
- store.un("loadexception", this.onLoadError, this);\r
- this.store = undefined;\r
- },\r
-\r
- \r
- bind : function(store){\r
- store = Ext.StoreMgr.lookup(store);\r
- store.on("beforeload", this.beforeLoad, this);\r
- store.on("load", this.onLoad, this);\r
- store.on("loadexception", this.onLoadError, this);\r
- this.store = store;\r
- },\r
-\r
- // private\r
- onDestroy : function(){\r
- if(this.store){\r
- this.unbind(this.store);\r
- }\r
- Ext.PagingToolbar.superclass.onDestroy.call(this);\r
- }\r
-});\r
-Ext.reg('paging', Ext.PagingToolbar);\r
-\r
-Ext.Resizable = function(el, config){\r
- this.el = Ext.get(el);\r
- \r
- if(config && config.wrap){\r
- config.resizeChild = this.el;\r
- this.el = this.el.wrap(typeof config.wrap == "object" ? config.wrap : {cls:"xresizable-wrap"});\r
- this.el.id = this.el.dom.id = config.resizeChild.id + "-rzwrap";\r
- this.el.setStyle("overflow", "hidden");\r
- this.el.setPositioning(config.resizeChild.getPositioning());\r
- config.resizeChild.clearPositioning();\r
- if(!config.width || !config.height){\r
- var csize = config.resizeChild.getSize();\r
- this.el.setSize(csize.width, csize.height);\r
- }\r
- if(config.pinned && !config.adjustments){\r
- config.adjustments = "auto";\r
- }\r
- }\r
-\r
- \r
- this.proxy = this.el.createProxy({tag: "div", cls: "x-resizable-proxy", id: this.el.id + "-rzproxy"}, Ext.getBody());\r
- this.proxy.unselectable();\r
- this.proxy.enableDisplayMode('block');\r
-\r
- Ext.apply(this, config);\r
- \r
- if(this.pinned){\r
- this.disableTrackOver = true;\r
- this.el.addClass("x-resizable-pinned");\r
- }\r
- // if the element isn't positioned, make it relative\r
- var position = this.el.getStyle("position");\r
- if(position != "absolute" && position != "fixed"){\r
- this.el.setStyle("position", "relative");\r
- }\r
- if(!this.handles){ // no handles passed, must be legacy style\r
- this.handles = 's,e,se';\r
- if(this.multiDirectional){\r
- this.handles += ',n,w';\r
- }\r
- }\r
- if(this.handles == "all"){\r
- this.handles = "n s e w ne nw se sw";\r
- }\r
- var hs = this.handles.split(/\s*?[,;]\s*?| /);\r
- var ps = Ext.Resizable.positions;\r
- for(var i = 0, len = hs.length; i < len; i++){\r
- if(hs[i] && ps[hs[i]]){\r
- var pos = ps[hs[i]];\r
- this[pos] = new Ext.Resizable.Handle(this, pos, this.disableTrackOver, this.transparent);\r
- }\r
- }\r
- // legacy\r
- this.corner = this.southeast;\r
- \r
- if(this.handles.indexOf("n") != -1 || this.handles.indexOf("w") != -1){\r
- this.updateBox = true;\r
- } \r
- \r
- this.activeHandle = null;\r
- \r
- if(this.resizeChild){\r
- if(typeof this.resizeChild == "boolean"){\r
- this.resizeChild = Ext.get(this.el.dom.firstChild, true);\r
- }else{\r
- this.resizeChild = Ext.get(this.resizeChild, true);\r
- }\r
- }\r
- \r
- if(this.adjustments == "auto"){\r
- var rc = this.resizeChild;\r
- var hw = this.west, he = this.east, hn = this.north, hs = this.south;\r
- if(rc && (hw || hn)){\r
- rc.position("relative");\r
- rc.setLeft(hw ? hw.el.getWidth() : 0);\r
- rc.setTop(hn ? hn.el.getHeight() : 0);\r
- }\r
- this.adjustments = [\r
- (he ? -he.el.getWidth() : 0) + (hw ? -hw.el.getWidth() : 0),\r
- (hn ? -hn.el.getHeight() : 0) + (hs ? -hs.el.getHeight() : 0) -1 \r
- ];\r
- }\r
- \r
- if(this.draggable){\r
- this.dd = this.dynamic ? \r
- this.el.initDD(null) : this.el.initDDProxy(null, {dragElId: this.proxy.id});\r
- this.dd.setHandleElId(this.resizeChild ? this.resizeChild.id : this.el.id);\r
- }\r
- \r
- // public events\r
- this.addEvents(\r
- "beforeresize",\r
- "resize"\r
- );\r
- \r
- if(this.width !== null && this.height !== null){\r
- this.resizeTo(this.width, this.height);\r
- }else{\r
- this.updateChildSize();\r
- }\r
- if(Ext.isIE){\r
- this.el.dom.style.zoom = 1;\r
- }\r
- Ext.Resizable.superclass.constructor.call(this);\r
-};\r
-\r
-Ext.extend(Ext.Resizable, Ext.util.Observable, {\r
- resizeChild : false,\r
- adjustments : [0, 0],\r
- minWidth : 5,\r
- minHeight : 5,\r
- maxWidth : 10000,\r
- maxHeight : 10000,\r
- enabled : true,\r
- animate : false,\r
- duration : .35,\r
- dynamic : false,\r
- handles : false,\r
- multiDirectional : false,\r
- disableTrackOver : false,\r
- easing : 'easeOutStrong',\r
- widthIncrement : 0,\r
- heightIncrement : 0,\r
- pinned : false,\r
- width : null,\r
- height : null,\r
- preserveRatio : false,\r
- transparent: false,\r
- minX: 0,\r
- minY: 0,\r
- draggable: false,\r
-\r
- \r
- \r
-\r
- \r
- \r
- \r
- \r
- resizeTo : function(width, height){\r
- this.el.setSize(width, height);\r
- this.updateChildSize();\r
- this.fireEvent("resize", this, width, height, null);\r
- },\r
-\r
- // private\r
- startSizing : function(e, handle){\r
- this.fireEvent("beforeresize", this, e);\r
- if(this.enabled){ // 2nd enabled check in case disabled before beforeresize handler\r
-\r
- if(!this.overlay){\r
- this.overlay = this.el.createProxy({tag: "div", cls: "x-resizable-overlay", html: " "}, Ext.getBody());\r
- this.overlay.unselectable();\r
- this.overlay.enableDisplayMode("block");\r
- this.overlay.on("mousemove", this.onMouseMove, this);\r
- this.overlay.on("mouseup", this.onMouseUp, this);\r
- }\r
- this.overlay.setStyle("cursor", handle.el.getStyle("cursor"));\r
-\r
- this.resizing = true;\r
- this.startBox = this.el.getBox();\r
- this.startPoint = e.getXY();\r
- this.offsets = [(this.startBox.x + this.startBox.width) - this.startPoint[0],\r
- (this.startBox.y + this.startBox.height) - this.startPoint[1]];\r
-\r
- this.overlay.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));\r
- this.overlay.show();\r
-\r
- if(this.constrainTo) {\r
- var ct = Ext.get(this.constrainTo);\r
- this.resizeRegion = ct.getRegion().adjust(\r
- ct.getFrameWidth('t'),\r
- ct.getFrameWidth('l'),\r
- -ct.getFrameWidth('b'),\r
- -ct.getFrameWidth('r')\r
- );\r
- }\r
-\r
- this.proxy.setStyle('visibility', 'hidden'); // workaround display none\r
- this.proxy.show();\r
- this.proxy.setBox(this.startBox);\r
- if(!this.dynamic){\r
- this.proxy.setStyle('visibility', 'visible');\r
- }\r
- }\r
- },\r
-\r
- // private\r
- onMouseDown : function(handle, e){\r
- if(this.enabled){\r
- e.stopEvent();\r
- this.activeHandle = handle;\r
- this.startSizing(e, handle);\r
- } \r
- },\r
-\r
- // private\r
- onMouseUp : function(e){\r
- var size = this.resizeElement();\r
- this.resizing = false;\r
- this.handleOut();\r
- this.overlay.hide();\r
- this.proxy.hide();\r
- this.fireEvent("resize", this, size.width, size.height, e);\r
- },\r
-\r
- // private\r
- updateChildSize : function(){\r
- if(this.resizeChild){\r
- var el = this.el;\r
- var child = this.resizeChild;\r
- var adj = this.adjustments;\r
- if(el.dom.offsetWidth){\r
- var b = el.getSize(true);\r
- child.setSize(b.width+adj[0], b.height+adj[1]);\r
- }\r
- // Second call here for IE\r
- // The first call enables instant resizing and\r
- // the second call corrects scroll bars if they\r
- // exist\r
- if(Ext.isIE){\r
- setTimeout(function(){\r
- if(el.dom.offsetWidth){\r
- var b = el.getSize(true);\r
- child.setSize(b.width+adj[0], b.height+adj[1]);\r
- }\r
- }, 10);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- snap : function(value, inc, min){\r
- if(!inc || !value) return value;\r
- var newValue = value;\r
- var m = value % inc;\r
- if(m > 0){\r
- if(m > (inc/2)){\r
- newValue = value + (inc-m);\r
- }else{\r
- newValue = value - m;\r
- }\r
- }\r
- return Math.max(min, newValue);\r
- },\r
-\r
- \r
- resizeElement : function(){\r
- var box = this.proxy.getBox();\r
- if(this.updateBox){\r
- this.el.setBox(box, false, this.animate, this.duration, null, this.easing);\r
- }else{\r
- this.el.setSize(box.width, box.height, this.animate, this.duration, null, this.easing);\r
- }\r
- this.updateChildSize();\r
- if(!this.dynamic){\r
- this.proxy.hide();\r
- }\r
- return box;\r
- },\r
-\r
- // private\r
- constrain : function(v, diff, m, mx){\r
- if(v - diff < m){\r
- diff = v - m; \r
- }else if(v - diff > mx){\r
- diff = mx - v; \r
- }\r
- return diff; \r
- },\r
-\r
- // private\r
- onMouseMove : function(e){\r
- if(this.enabled){\r
- try{// try catch so if something goes wrong the user doesn't get hung\r
-\r
- if(this.resizeRegion && !this.resizeRegion.contains(e.getPoint())) {\r
- return;\r
- }\r
-\r
- //var curXY = this.startPoint;\r
- var curSize = this.curSize || this.startBox;\r
- var x = this.startBox.x, y = this.startBox.y;\r
- var ox = x, oy = y;\r
- var w = curSize.width, h = curSize.height;\r
- var ow = w, oh = h;\r
- var mw = this.minWidth, mh = this.minHeight;\r
- var mxw = this.maxWidth, mxh = this.maxHeight;\r
- var wi = this.widthIncrement;\r
- var hi = this.heightIncrement;\r
- \r
- var eventXY = e.getXY();\r
- var diffX = -(this.startPoint[0] - Math.max(this.minX, eventXY[0]));\r
- var diffY = -(this.startPoint[1] - Math.max(this.minY, eventXY[1]));\r
- \r
- var pos = this.activeHandle.position;\r
- \r
- switch(pos){\r
- case "east":\r
- w += diffX; \r
- w = Math.min(Math.max(mw, w), mxw);\r
- break;\r
- case "south":\r
- h += diffY;\r
- h = Math.min(Math.max(mh, h), mxh);\r
- break;\r
- case "southeast":\r
- w += diffX; \r
- h += diffY;\r
- w = Math.min(Math.max(mw, w), mxw);\r
- h = Math.min(Math.max(mh, h), mxh);\r
- break;\r
- case "north":\r
- diffY = this.constrain(h, diffY, mh, mxh);\r
- y += diffY;\r
- h -= diffY;\r
- break;\r
- case "west":\r
- diffX = this.constrain(w, diffX, mw, mxw);\r
- x += diffX;\r
- w -= diffX;\r
- break;\r
- case "northeast":\r
- w += diffX; \r
- w = Math.min(Math.max(mw, w), mxw);\r
- diffY = this.constrain(h, diffY, mh, mxh);\r
- y += diffY;\r
- h -= diffY;\r
- break;\r
- case "northwest":\r
- diffX = this.constrain(w, diffX, mw, mxw);\r
- diffY = this.constrain(h, diffY, mh, mxh);\r
- y += diffY;\r
- h -= diffY;\r
- x += diffX;\r
- w -= diffX;\r
- break;\r
- case "southwest":\r
- diffX = this.constrain(w, diffX, mw, mxw);\r
- h += diffY;\r
- h = Math.min(Math.max(mh, h), mxh);\r
- x += diffX;\r
- w -= diffX;\r
- break;\r
- }\r
- \r
- var sw = this.snap(w, wi, mw);\r
- var sh = this.snap(h, hi, mh);\r
- if(sw != w || sh != h){\r
- switch(pos){\r
- case "northeast":\r
- y -= sh - h;\r
- break;\r
- case "north":\r
- y -= sh - h;\r
- break;\r
- case "southwest":\r
- x -= sw - w;\r
- break;\r
- case "west":\r
- x -= sw - w;\r
- break;\r
- case "northwest":\r
- x -= sw - w;\r
- y -= sh - h;\r
- break;\r
- }\r
- w = sw;\r
- h = sh;\r
- }\r
- \r
- if(this.preserveRatio){\r
- switch(pos){\r
- case "southeast":\r
- case "east":\r
- h = oh * (w/ow);\r
- h = Math.min(Math.max(mh, h), mxh);\r
- w = ow * (h/oh);\r
- break;\r
- case "south":\r
- w = ow * (h/oh);\r
- w = Math.min(Math.max(mw, w), mxw);\r
- h = oh * (w/ow);\r
- break;\r
- case "northeast":\r
- w = ow * (h/oh);\r
- w = Math.min(Math.max(mw, w), mxw);\r
- h = oh * (w/ow);\r
- break;\r
- case "north":\r
- var tw = w;\r
- w = ow * (h/oh);\r
- w = Math.min(Math.max(mw, w), mxw);\r
- h = oh * (w/ow);\r
- x += (tw - w) / 2;\r
- break;\r
- case "southwest":\r
- h = oh * (w/ow);\r
- h = Math.min(Math.max(mh, h), mxh);\r
- var tw = w;\r
- w = ow * (h/oh);\r
- x += tw - w;\r
- break;\r
- case "west":\r
- var th = h;\r
- h = oh * (w/ow);\r
- h = Math.min(Math.max(mh, h), mxh);\r
- y += (th - h) / 2;\r
- var tw = w;\r
- w = ow * (h/oh);\r
- x += tw - w;\r
- break;\r
- case "northwest":\r
- var tw = w;\r
- var th = h;\r
- h = oh * (w/ow);\r
- h = Math.min(Math.max(mh, h), mxh);\r
- w = ow * (h/oh);\r
- y += th - h;\r
- x += tw - w;\r
- break;\r
- \r
- }\r
- }\r
- this.proxy.setBounds(x, y, w, h);\r
- if(this.dynamic){\r
- this.resizeElement();\r
- }\r
- }catch(e){}\r
- }\r
- },\r
-\r
- // private\r
- handleOver : function(){\r
- if(this.enabled){\r
- this.el.addClass("x-resizable-over");\r
- }\r
- },\r
-\r
- // private\r
- handleOut : function(){\r
- if(!this.resizing){\r
- this.el.removeClass("x-resizable-over");\r
- }\r
- },\r
- \r
- \r
- getEl : function(){\r
- return this.el;\r
- },\r
- \r
- \r
- getResizeChild : function(){\r
- return this.resizeChild;\r
- },\r
- \r
- \r
- destroy : function(removeEl){\r
- if(this.dd){\r
- this.dd.destroy();\r
- }\r
- if(this.overlay){\r
- Ext.destroy(this.overlay);\r
- this.overlay = null;\r
- }\r
- Ext.destroy(this.proxy);\r
- this.proxy = null;\r
- \r
- var ps = Ext.Resizable.positions;\r
- for(var k in ps){\r
- if(typeof ps[k] != "function" && this[ps[k]]){\r
- this[ps[k]].destroy();\r
- }\r
- }\r
- if(removeEl){\r
- this.el.update("");\r
- Ext.destroy(this.el);\r
- this.el = null;\r
- }\r
- },\r
-\r
- syncHandleHeight : function(){\r
- var h = this.el.getHeight(true);\r
- if(this.west){\r
- this.west.el.setHeight(h);\r
- }\r
- if(this.east){\r
- this.east.el.setHeight(h);\r
- }\r
- }\r
-});\r
-\r
-// private\r
-// hash to map config positions to true positions\r
-Ext.Resizable.positions = {\r
- n: "north", s: "south", e: "east", w: "west", se: "southeast", sw: "southwest", nw: "northwest", ne: "northeast"\r
-};\r
-\r
-// private\r
-Ext.Resizable.Handle = function(rz, pos, disableTrackOver, transparent){\r
- if(!this.tpl){\r
- // only initialize the template if resizable is used\r
- var tpl = Ext.DomHelper.createTemplate(\r
- {tag: "div", cls: "x-resizable-handle x-resizable-handle-{0}"}\r
- );\r
- tpl.compile();\r
- Ext.Resizable.Handle.prototype.tpl = tpl;\r
- }\r
- this.position = pos;\r
- this.rz = rz;\r
- this.el = this.tpl.append(rz.el.dom, [this.position], true);\r
- this.el.unselectable();\r
- if(transparent){\r
- this.el.setOpacity(0);\r
- }\r
- this.el.on("mousedown", this.onMouseDown, this);\r
- if(!disableTrackOver){\r
- this.el.on("mouseover", this.onMouseOver, this);\r
- this.el.on("mouseout", this.onMouseOut, this);\r
- }\r
-};\r
-\r
-// private\r
-Ext.Resizable.Handle.prototype = {\r
- // private\r
- afterResize : function(rz){\r
- // do nothing \r
- },\r
- // private\r
- onMouseDown : function(e){\r
- this.rz.onMouseDown(this, e);\r
- },\r
- // private\r
- onMouseOver : function(e){\r
- this.rz.handleOver(this, e);\r
- },\r
- // private\r
- onMouseOut : function(e){\r
- this.rz.handleOut(this, e);\r
- },\r
- // private\r
- destroy : function(){\r
- Ext.destroy(this.el);\r
- this.el = null;\r
- }\r
-};\r
-\r
-\r
-\r
-\r
-\r
-Ext.Editor = function(field, config){\r
- this.field = field;\r
- Ext.Editor.superclass.constructor.call(this, config);\r
-};\r
-\r
-Ext.extend(Ext.Editor, Ext.Component, {\r
- \r
- \r
- \r
- \r
- \r
- value : "",\r
- \r
- alignment: "c-c?",\r
- \r
- shadow : "frame",\r
- \r
- constrain : false,\r
- \r
- swallowKeys : true,\r
- \r
- completeOnEnter : false,\r
- \r
- cancelOnEsc : false,\r
- \r
- updateEl : false,\r
-\r
- initComponent : function(){\r
- Ext.Editor.superclass.initComponent.call(this);\r
- this.addEvents(\r
- \r
- "beforestartedit",\r
- \r
- "startedit",\r
- \r
- "beforecomplete",\r
- \r
- "complete",\r
- \r
- "canceledit",\r
- \r
- "specialkey"\r
- );\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- this.el = new Ext.Layer({\r
- shadow: this.shadow,\r
- cls: "x-editor",\r
- parentEl : ct,\r
- shim : this.shim,\r
- shadowOffset:4,\r
- id: this.id,\r
- constrain: this.constrain\r
- });\r
- this.el.setStyle("overflow", Ext.isGecko ? "auto" : "hidden");\r
- if(this.field.msgTarget != 'title'){\r
- this.field.msgTarget = 'qtip';\r
- }\r
- this.field.inEditor = true;\r
- this.field.render(this.el);\r
- if(Ext.isGecko){\r
- this.field.el.dom.setAttribute('autocomplete', 'off');\r
- }\r
- this.field.on("specialkey", this.onSpecialKey, this);\r
- if(this.swallowKeys){\r
- this.field.el.swallowEvent(['keydown','keypress']);\r
- }\r
- this.field.show();\r
- this.field.on("blur", this.onBlur, this);\r
- if(this.field.grow){\r
- this.field.on("autosize", this.el.sync, this.el, {delay:1});\r
- }\r
- },\r
-\r
- // private\r
- onSpecialKey : function(field, e){\r
- var key = e.getKey();\r
- if(this.completeOnEnter && key == e.ENTER){\r
- e.stopEvent();\r
- this.completeEdit();\r
- }else if(this.cancelOnEsc && key == e.ESC){\r
- this.cancelEdit();\r
- }else{\r
- this.fireEvent('specialkey', field, e);\r
- }\r
- if(this.field.triggerBlur && (key == e.ENTER || key == e.ESC || key == e.TAB)){\r
- this.field.triggerBlur();\r
- }\r
- },\r
-\r
- \r
- startEdit : function(el, value){\r
- if(this.editing){\r
- this.completeEdit();\r
- }\r
- this.boundEl = Ext.get(el);\r
- var v = value !== undefined ? value : this.boundEl.dom.innerHTML;\r
- if(!this.rendered){\r
- this.render(this.parentEl || document.body);\r
- }\r
- if(this.fireEvent("beforestartedit", this, this.boundEl, v) === false){\r
- return;\r
- }\r
- this.startValue = v;\r
- this.field.setValue(v);\r
- this.doAutoSize();\r
- this.el.alignTo(this.boundEl, this.alignment);\r
- this.editing = true;\r
- this.show();\r
- },\r
-\r
- // private\r
- doAutoSize : function(){\r
- if(this.autoSize){\r
- var sz = this.boundEl.getSize();\r
- switch(this.autoSize){\r
- case "width":\r
- this.setSize(sz.width, "");\r
- break;\r
- case "height":\r
- this.setSize("", sz.height);\r
- break;\r
- default:\r
- this.setSize(sz.width, sz.height);\r
- }\r
- }\r
- },\r
-\r
- \r
- setSize : function(w, h){\r
- delete this.field.lastSize;\r
- this.field.setSize(w, h);\r
- if(this.el){\r
- if(Ext.isGecko2 || Ext.isOpera){\r
- // prevent layer scrollbars\r
- this.el.setSize(w, h);\r
- }\r
- this.el.sync();\r
- }\r
- },\r
-\r
- \r
- realign : function(){\r
- this.el.alignTo(this.boundEl, this.alignment);\r
- },\r
-\r
- \r
- completeEdit : function(remainVisible){\r
- if(!this.editing){\r
- return;\r
- }\r
- var v = this.getValue();\r
- if(this.revertInvalid !== false && !this.field.isValid()){\r
- v = this.startValue;\r
- this.cancelEdit(true);\r
- }\r
- if(String(v) === String(this.startValue) && this.ignoreNoChange){\r
- this.editing = false;\r
- this.hide();\r
- return;\r
- }\r
- if(this.fireEvent("beforecomplete", this, v, this.startValue) !== false){\r
- this.editing = false;\r
- if(this.updateEl && this.boundEl){\r
- this.boundEl.update(v);\r
- }\r
- if(remainVisible !== true){\r
- this.hide();\r
- }\r
- this.fireEvent("complete", this, v, this.startValue);\r
- }\r
- },\r
-\r
- // private\r
- onShow : function(){\r
- this.el.show();\r
- if(this.hideEl !== false){\r
- this.boundEl.hide();\r
- }\r
- this.field.show();\r
- if(Ext.isIE && !this.fixIEFocus){ // IE has problems with focusing the first time\r
- this.fixIEFocus = true;\r
- this.deferredFocus.defer(50, this);\r
- }else{\r
- this.field.focus();\r
- }\r
- this.fireEvent("startedit", this.boundEl, this.startValue);\r
- },\r
-\r
- deferredFocus : function(){\r
- if(this.editing){\r
- this.field.focus();\r
- }\r
- },\r
-\r
- \r
- cancelEdit : function(remainVisible){\r
- if(this.editing){\r
- var v = this.getValue();\r
- this.setValue(this.startValue);\r
- if(remainVisible !== true){\r
- this.hide();\r
- }\r
- this.fireEvent("canceledit", this, v, this.startValue);\r
- }\r
- },\r
-\r
- // private\r
- onBlur : function(){\r
- if(this.allowBlur !== true && this.editing){\r
- this.completeEdit();\r
- }\r
- },\r
-\r
- // private\r
- onHide : function(){\r
- if(this.editing){\r
- this.completeEdit();\r
- return;\r
- }\r
- this.field.blur();\r
- if(this.field.collapse){\r
- this.field.collapse();\r
- }\r
- this.el.hide();\r
- if(this.hideEl !== false){\r
- this.boundEl.show();\r
- }\r
- },\r
-\r
- \r
- setValue : function(v){\r
- this.field.setValue(v);\r
- },\r
-\r
- \r
- getValue : function(){\r
- return this.field.getValue();\r
- },\r
-\r
- beforeDestroy : function(){\r
- Ext.destroy(this.field);\r
- this.field = null;\r
- }\r
-});\r
-Ext.reg('editor', Ext.Editor);\r
-\r
-Ext.MessageBox = function(){\r
- var dlg, opt, mask, waitTimer;\r
- var bodyEl, msgEl, textboxEl, textareaEl, progressBar, pp, iconEl, spacerEl;\r
- var buttons, activeTextEl, bwidth, iconCls = '';\r
-\r
- // private\r
- var handleButton = function(button){\r
- if(dlg.isVisible()){\r
- dlg.hide();\r
- Ext.callback(opt.fn, opt.scope||window, [button, activeTextEl.dom.value, opt], 1);\r
- }\r
- };\r
-\r
- // private\r
- var handleHide = function(){\r
- if(opt && opt.cls){\r
- dlg.el.removeClass(opt.cls);\r
- }\r
- progressBar.reset();\r
- };\r
-\r
- // private\r
- var handleEsc = function(d, k, e){\r
- if(opt && opt.closable !== false){\r
- dlg.hide();\r
- }\r
- if(e){\r
- e.stopEvent();\r
- }\r
- };\r
-\r
- // private\r
- var updateButtons = function(b){\r
- var width = 0;\r
- if(!b){\r
- buttons["ok"].hide();\r
- buttons["cancel"].hide();\r
- buttons["yes"].hide();\r
- buttons["no"].hide();\r
- return width;\r
- }\r
- dlg.footer.dom.style.display = '';\r
- for(var k in buttons){\r
- if(typeof buttons[k] != "function"){\r
- if(b[k]){\r
- buttons[k].show();\r
- buttons[k].setText(typeof b[k] == "string" ? b[k] : Ext.MessageBox.buttonText[k]);\r
- width += buttons[k].el.getWidth()+15;\r
- }else{\r
- buttons[k].hide();\r
- }\r
- }\r
- }\r
- return width;\r
- };\r
-\r
- return {\r
- \r
- getDialog : function(titleText){\r
- if(!dlg){\r
- dlg = new Ext.Window({\r
- autoCreate : true,\r
- title:titleText,\r
- resizable:false,\r
- constrain:true,\r
- constrainHeader:true,\r
- minimizable : false,\r
- maximizable : false,\r
- stateful: false,\r
- modal: true,\r
- shim:true,\r
- buttonAlign:"center",\r
- width:400,\r
- height:100,\r
- minHeight: 80,\r
- plain:true,\r
- footer:true,\r
- closable:true,\r
- close : function(){\r
- if(opt && opt.buttons && opt.buttons.no && !opt.buttons.cancel){\r
- handleButton("no");\r
- }else{\r
- handleButton("cancel");\r
- }\r
- }\r
- });\r
- buttons = {};\r
- var bt = this.buttonText;\r
- //TODO: refactor this block into a buttons config to pass into the Window constructor\r
- buttons["ok"] = dlg.addButton(bt["ok"], handleButton.createCallback("ok"));\r
- buttons["yes"] = dlg.addButton(bt["yes"], handleButton.createCallback("yes"));\r
- buttons["no"] = dlg.addButton(bt["no"], handleButton.createCallback("no"));\r
- buttons["cancel"] = dlg.addButton(bt["cancel"], handleButton.createCallback("cancel"));\r
- buttons["ok"].hideMode = buttons["yes"].hideMode = buttons["no"].hideMode = buttons["cancel"].hideMode = 'offsets';\r
- dlg.render(document.body);\r
- dlg.getEl().addClass('x-window-dlg');\r
- mask = dlg.mask;\r
- bodyEl = dlg.body.createChild({\r
- html:'<div class="ext-mb-icon"></div><div class="ext-mb-content"><span class="ext-mb-text"></span><br /><div class="ext-mb-fix-cursor"><input type="text" class="ext-mb-input" /><textarea class="ext-mb-textarea"></textarea></div></div>'\r
- });\r
- iconEl = Ext.get(bodyEl.dom.firstChild);\r
- var contentEl = bodyEl.dom.childNodes[1];\r
- msgEl = Ext.get(contentEl.firstChild);\r
- textboxEl = Ext.get(contentEl.childNodes[2].firstChild);\r
- textboxEl.enableDisplayMode();\r
- textboxEl.addKeyListener([10,13], function(){\r
- if(dlg.isVisible() && opt && opt.buttons){\r
- if(opt.buttons.ok){\r
- handleButton("ok");\r
- }else if(opt.buttons.yes){\r
- handleButton("yes");\r
- }\r
- }\r
- });\r
- textareaEl = Ext.get(contentEl.childNodes[2].childNodes[1]);\r
- textareaEl.enableDisplayMode();\r
- progressBar = new Ext.ProgressBar({\r
- renderTo:bodyEl\r
- });\r
- bodyEl.createChild({cls:'x-clear'});\r
- }\r
- return dlg;\r
- },\r
-\r
- \r
- updateText : function(text){\r
- if(!dlg.isVisible() && !opt.width){\r
- dlg.setSize(this.maxWidth, 100); // resize first so content is never clipped from previous shows\r
- }\r
- msgEl.update(text || ' ');\r
-\r
- var iw = iconCls != '' ? (iconEl.getWidth() + iconEl.getMargins('lr')) : 0;\r
- var mw = msgEl.getWidth() + msgEl.getMargins('lr');\r
- var fw = dlg.getFrameWidth('lr');\r
- var bw = dlg.body.getFrameWidth('lr');\r
- if (Ext.isIE && iw > 0){\r
- //3 pixels get subtracted in the icon CSS for an IE margin issue,\r
- //so we have to add it back here for the overall width to be consistent\r
- iw += 3;\r
- }\r
- var w = Math.max(Math.min(opt.width || iw+mw+fw+bw, this.maxWidth),\r
- Math.max(opt.minWidth || this.minWidth, bwidth || 0));\r
-\r
- if(opt.prompt === true){\r
- activeTextEl.setWidth(w-iw-fw-bw);\r
- }\r
- if(opt.progress === true || opt.wait === true){\r
- progressBar.setSize(w-iw-fw-bw);\r
- }\r
- if(Ext.isIE && w == bwidth){\r
- w += 4; //Add offset when the content width is smaller than the buttons. \r
- }\r
- dlg.setSize(w, 'auto').center();\r
- return this;\r
- },\r
-\r
- \r
- updateProgress : function(value, progressText, msg){\r
- progressBar.updateProgress(value, progressText);\r
- if(msg){\r
- this.updateText(msg);\r
- }\r
- return this;\r
- },\r
-\r
- \r
- isVisible : function(){\r
- return dlg && dlg.isVisible();\r
- },\r
-\r
- \r
- hide : function(){\r
- var proxy = dlg.activeGhost;\r
- if(this.isVisible() || proxy) {\r
- dlg.hide();\r
- handleHide();\r
- if (proxy) {\r
- proxy.hide();\r
- } \r
- }\r
- return this;\r
- },\r
-\r
- \r
- show : function(options){\r
- if(this.isVisible()){\r
- this.hide();\r
- }\r
- opt = options;\r
- var d = this.getDialog(opt.title || " ");\r
-\r
- d.setTitle(opt.title || " ");\r
- var allowClose = (opt.closable !== false && opt.progress !== true && opt.wait !== true);\r
- d.tools.close.setDisplayed(allowClose);\r
- activeTextEl = textboxEl;\r
- opt.prompt = opt.prompt || (opt.multiline ? true : false);\r
- if(opt.prompt){\r
- if(opt.multiline){\r
- textboxEl.hide();\r
- textareaEl.show();\r
- textareaEl.setHeight(typeof opt.multiline == "number" ?\r
- opt.multiline : this.defaultTextHeight);\r
- activeTextEl = textareaEl;\r
- }else{\r
- textboxEl.show();\r
- textareaEl.hide();\r
- }\r
- }else{\r
- textboxEl.hide();\r
- textareaEl.hide();\r
- }\r
- activeTextEl.dom.value = opt.value || "";\r
- if(opt.prompt){\r
- d.focusEl = activeTextEl;\r
- }else{\r
- var bs = opt.buttons;\r
- var db = null;\r
- if(bs && bs.ok){\r
- db = buttons["ok"];\r
- }else if(bs && bs.yes){\r
- db = buttons["yes"];\r
- }\r
- if (db){\r
- d.focusEl = db;\r
- }\r
- }\r
- if(opt.iconCls){\r
- d.setIconClass(opt.iconCls);\r
- }\r
- this.setIcon(opt.icon);\r
- bwidth = updateButtons(opt.buttons);\r
- progressBar.setVisible(opt.progress === true || opt.wait === true);\r
- this.updateProgress(0, opt.progressText);\r
- this.updateText(opt.msg);\r
- if(opt.cls){\r
- d.el.addClass(opt.cls);\r
- }\r
- d.proxyDrag = opt.proxyDrag === true;\r
- d.modal = opt.modal !== false;\r
- d.mask = opt.modal !== false ? mask : false;\r
- if(!d.isVisible()){\r
- // force it to the end of the z-index stack so it gets a cursor in FF\r
- document.body.appendChild(dlg.el.dom);\r
- d.setAnimateTarget(opt.animEl);\r
- d.show(opt.animEl);\r
- }\r
-\r
- //workaround for window internally enabling keymap in afterShow\r
- d.on('show', function(){\r
- if(allowClose === true){\r
- d.keyMap.enable();\r
- }else{\r
- d.keyMap.disable();\r
- }\r
- }, this, {single:true});\r
-\r
- if(opt.wait === true){\r
- progressBar.wait(opt.waitConfig);\r
- }\r
- return this;\r
- },\r
-\r
- \r
- setIcon : function(icon){\r
- if(icon && icon != ''){\r
- iconEl.removeClass('x-hidden');\r
- iconEl.replaceClass(iconCls, icon);\r
- iconCls = icon;\r
- }else{\r
- iconEl.replaceClass(iconCls, 'x-hidden');\r
- iconCls = '';\r
- }\r
- return this;\r
- },\r
-\r
- \r
- progress : function(title, msg, progressText){\r
- this.show({\r
- title : title,\r
- msg : msg,\r
- buttons: false,\r
- progress:true,\r
- closable:false,\r
- minWidth: this.minProgressWidth,\r
- progressText: progressText\r
- });\r
- return this;\r
- },\r
-\r
- \r
- wait : function(msg, title, config){\r
- this.show({\r
- title : title,\r
- msg : msg,\r
- buttons: false,\r
- closable:false,\r
- wait:true,\r
- modal:true,\r
- minWidth: this.minProgressWidth,\r
- waitConfig: config\r
- });\r
- return this;\r
- },\r
-\r
- \r
- alert : function(title, msg, fn, scope){\r
- this.show({\r
- title : title,\r
- msg : msg,\r
- buttons: this.OK,\r
- fn: fn,\r
- scope : scope\r
- });\r
- return this;\r
- },\r
-\r
- \r
- confirm : function(title, msg, fn, scope){\r
- this.show({\r
- title : title,\r
- msg : msg,\r
- buttons: this.YESNO,\r
- fn: fn,\r
- scope : scope,\r
- icon: this.QUESTION\r
- });\r
- return this;\r
- },\r
-\r
- \r
- prompt : function(title, msg, fn, scope, multiline, value){\r
- this.show({\r
- title : title,\r
- msg : msg,\r
- buttons: this.OKCANCEL,\r
- fn: fn,\r
- minWidth:250,\r
- scope : scope,\r
- prompt:true,\r
- multiline: multiline,\r
- value: value\r
- });\r
- return this;\r
- },\r
-\r
- \r
- OK : {ok:true},\r
- \r
- CANCEL : {cancel:true},\r
- \r
- OKCANCEL : {ok:true, cancel:true},\r
- \r
- YESNO : {yes:true, no:true},\r
- \r
- YESNOCANCEL : {yes:true, no:true, cancel:true},\r
- \r
- INFO : 'ext-mb-info',\r
- \r
- WARNING : 'ext-mb-warning',\r
- \r
- QUESTION : 'ext-mb-question',\r
- \r
- ERROR : 'ext-mb-error',\r
-\r
- \r
- defaultTextHeight : 75,\r
- \r
- maxWidth : 600,\r
- \r
- minWidth : 100,\r
- \r
- minProgressWidth : 250,\r
- \r
- buttonText : {\r
- ok : "OK",\r
- cancel : "Cancel",\r
- yes : "Yes",\r
- no : "No"\r
- }\r
- };\r
-}();\r
-\r
-\r
-Ext.Msg = Ext.MessageBox;\r
-\r
-Ext.Tip = Ext.extend(Ext.Panel, {\r
- \r
- \r
- \r
- minWidth : 40,\r
- \r
- maxWidth : 300,\r
- \r
- shadow : "sides",\r
- \r
- defaultAlign : "tl-bl?",\r
- autoRender: true,\r
- quickShowInterval : 250,\r
-\r
- // private panel overrides\r
- frame:true,\r
- hidden:true,\r
- baseCls: 'x-tip',\r
- floating:{shadow:true,shim:true,useDisplay:true,constrain:false},\r
- autoHeight:true,\r
-\r
- // private\r
- initComponent : function(){\r
- Ext.Tip.superclass.initComponent.call(this);\r
- if(this.closable && !this.title){\r
- this.elements += ',header';\r
- }\r
- },\r
-\r
- // private\r
- afterRender : function(){\r
- Ext.Tip.superclass.afterRender.call(this);\r
- if(this.closable){\r
- this.addTool({\r
- id: 'close',\r
- handler: this.hide,\r
- scope: this\r
- });\r
- }\r
- },\r
-\r
- \r
- showAt : function(xy){\r
- Ext.Tip.superclass.show.call(this);\r
- if(this.measureWidth !== false && (!this.initialConfig || typeof this.initialConfig.width != 'number')){\r
- this.doAutoWidth();\r
- }\r
- if(this.constrainPosition){\r
- xy = this.el.adjustForConstraints(xy);\r
- }\r
- this.setPagePosition(xy[0], xy[1]);\r
- },\r
-\r
- // protected\r
- doAutoWidth : function(){\r
- var bw = this.body.getTextWidth();\r
- if(this.title){\r
- bw = Math.max(bw, this.header.child('span').getTextWidth(this.title));\r
- }\r
- bw += this.getFrameWidth() + (this.closable ? 20 : 0) + this.body.getPadding("lr");\r
- this.setWidth(bw.constrain(this.minWidth, this.maxWidth));\r
- \r
- // IE7 repaint bug on initial show\r
- if(Ext.isIE7 && !this.repainted){\r
- this.el.repaint();\r
- this.repainted = true;\r
- }\r
- },\r
-\r
- \r
- showBy : function(el, pos){\r
- if(!this.rendered){\r
- this.render(Ext.getBody());\r
- }\r
- this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign));\r
- },\r
-\r
- initDraggable : function(){\r
- this.dd = new Ext.Tip.DD(this, typeof this.draggable == 'boolean' ? null : this.draggable);\r
- this.header.addClass('x-tip-draggable');\r
- }\r
-});\r
-\r
-// private - custom Tip DD implementation\r
-Ext.Tip.DD = function(tip, config){\r
- Ext.apply(this, config);\r
- this.tip = tip;\r
- Ext.Tip.DD.superclass.constructor.call(this, tip.el.id, 'WindowDD-'+tip.id);\r
- this.setHandleElId(tip.header.id);\r
- this.scroll = false;\r
-};\r
-\r
-Ext.extend(Ext.Tip.DD, Ext.dd.DD, {\r
- moveOnly:true,\r
- scroll:false,\r
- headerOffsets:[100, 25],\r
- startDrag : function(){\r
- this.tip.el.disableShadow();\r
- },\r
- endDrag : function(e){\r
- this.tip.el.enableShadow(true);\r
- }\r
-});\r
-\r
-Ext.ToolTip = Ext.extend(Ext.Tip, {\r
- \r
- \r
- \r
- showDelay: 500,\r
- \r
- hideDelay: 200,\r
- \r
- dismissDelay: 5000,\r
- \r
- mouseOffset: [15,18],\r
- \r
- trackMouse : false,\r
- constrainPosition: true,\r
-\r
- // private\r
- initComponent: function(){\r
- Ext.ToolTip.superclass.initComponent.call(this);\r
- this.lastActive = new Date();\r
- this.initTarget();\r
- },\r
-\r
- // private\r
- initTarget : function(){\r
- if(this.target){\r
- this.target = Ext.get(this.target);\r
- this.target.on('mouseover', this.onTargetOver, this);\r
- this.target.on('mouseout', this.onTargetOut, this);\r
- this.target.on('mousemove', this.onMouseMove, this);\r
- }\r
- },\r
-\r
- // private\r
- onMouseMove : function(e){\r
- this.targetXY = e.getXY();\r
- if(!this.hidden && this.trackMouse){\r
- this.setPagePosition(this.getTargetXY());\r
- }\r
- },\r
-\r
- // private\r
- getTargetXY : function(){\r
- return [this.targetXY[0]+this.mouseOffset[0], this.targetXY[1]+this.mouseOffset[1]];\r
- },\r
-\r
- // private\r
- onTargetOver : function(e){\r
- if(this.disabled || e.within(this.target.dom, true)){\r
- return;\r
- }\r
- this.clearTimer('hide');\r
- this.targetXY = e.getXY();\r
- this.delayShow();\r
- },\r
-\r
- // private\r
- delayShow : function(){\r
- if(this.hidden && !this.showTimer){\r
- if(this.lastActive.getElapsed() < this.quickShowInterval){\r
- this.show();\r
- }else{\r
- this.showTimer = this.show.defer(this.showDelay, this);\r
- }\r
- }else if(!this.hidden && this.autoHide !== false){\r
- this.show();\r
- }\r
- },\r
-\r
- // private\r
- onTargetOut : function(e){\r
- if(this.disabled || e.within(this.target.dom, true)){\r
- return;\r
- }\r
- this.clearTimer('show');\r
- if(this.autoHide !== false){\r
- this.delayHide();\r
- }\r
- },\r
-\r
- // private\r
- delayHide : function(){\r
- if(!this.hidden && !this.hideTimer){\r
- this.hideTimer = this.hide.defer(this.hideDelay, this);\r
- }\r
- },\r
-\r
- \r
- hide: function(){\r
- this.clearTimer('dismiss');\r
- this.lastActive = new Date();\r
- Ext.ToolTip.superclass.hide.call(this);\r
- },\r
-\r
- \r
- show : function(){\r
- this.showAt(this.getTargetXY());\r
- },\r
-\r
- // inherit docs\r
- showAt : function(xy){\r
- this.lastActive = new Date();\r
- this.clearTimers();\r
- Ext.ToolTip.superclass.showAt.call(this, xy);\r
- if(this.dismissDelay && this.autoHide !== false){\r
- this.dismissTimer = this.hide.defer(this.dismissDelay, this);\r
- }\r
- },\r
-\r
- // private\r
- clearTimer : function(name){\r
- name = name + 'Timer';\r
- clearTimeout(this[name]);\r
- delete this[name];\r
- },\r
-\r
- // private\r
- clearTimers : function(){\r
- this.clearTimer('show');\r
- this.clearTimer('dismiss');\r
- this.clearTimer('hide');\r
- },\r
-\r
- // private\r
- onShow : function(){\r
- Ext.ToolTip.superclass.onShow.call(this);\r
- Ext.getDoc().on('mousedown', this.onDocMouseDown, this);\r
- },\r
-\r
- // private\r
- onHide : function(){\r
- Ext.ToolTip.superclass.onHide.call(this);\r
- Ext.getDoc().un('mousedown', this.onDocMouseDown, this);\r
- },\r
-\r
- // private\r
- onDocMouseDown : function(e){\r
- if(this.autoHide !== false && !e.within(this.el.dom)){\r
- this.disable();\r
- this.enable.defer(100, this);\r
- }\r
- },\r
-\r
- // private\r
- onDisable : function(){\r
- this.clearTimers();\r
- this.hide();\r
- },\r
-\r
- // private\r
- adjustPosition : function(x, y){\r
- // keep the position from being under the mouse\r
- var ay = this.targetXY[1], h = this.getSize().height;\r
- if(this.constrainPosition && y <= ay && (y+h) >= ay){\r
- y = ay-h-5;\r
- }\r
- return {x : x, y: y};\r
- },\r
-\r
- // private\r
- onDestroy : function(){\r
- Ext.ToolTip.superclass.onDestroy.call(this);\r
- if(this.target){\r
- this.target.un('mouseover', this.onTargetOver, this);\r
- this.target.un('mouseout', this.onTargetOut, this);\r
- this.target.un('mousemove', this.onMouseMove, this);\r
- }\r
- }\r
-});\r
-\r
-Ext.QuickTip = Ext.extend(Ext.ToolTip, {\r
- \r
- \r
- interceptTitles : false,\r
-\r
- // private\r
- tagConfig : {\r
- namespace : "ext",\r
- attribute : "qtip",\r
- width : "qwidth",\r
- target : "target",\r
- title : "qtitle",\r
- hide : "hide",\r
- cls : "qclass",\r
- align : "qalign"\r
- },\r
-\r
- // private\r
- initComponent : function(){\r
- this.target = this.target || Ext.getDoc();\r
- this.targets = this.targets || {};\r
- Ext.QuickTip.superclass.initComponent.call(this);\r
- },\r
-\r
- \r
- register : function(config){\r
- var cs = Ext.isArray(config) ? config : arguments;\r
- for(var i = 0, len = cs.length; i < len; i++){\r
- var c = cs[i];\r
- var target = c.target;\r
- if(target){\r
- if(Ext.isArray(target)){\r
- for(var j = 0, jlen = target.length; j < jlen; j++){\r
- this.targets[Ext.id(target[j])] = c;\r
- }\r
- } else{\r
- this.targets[Ext.id(target)] = c;\r
- }\r
- }\r
- }\r
- },\r
-\r
- \r
- unregister : function(el){\r
- delete this.targets[Ext.id(el)];\r
- },\r
-\r
- // private\r
- onTargetOver : function(e){\r
- if(this.disabled){\r
- return;\r
- }\r
- this.targetXY = e.getXY();\r
- var t = e.getTarget();\r
- if(!t || t.nodeType !== 1 || t == document || t == document.body){\r
- return;\r
- }\r
- if(this.activeTarget && t == this.activeTarget.el){\r
- this.clearTimer('hide');\r
- this.show();\r
- return;\r
- }\r
- if(t && this.targets[t.id]){\r
- this.activeTarget = this.targets[t.id];\r
- this.activeTarget.el = t;\r
- this.delayShow();\r
- return;\r
- }\r
- var ttp, et = Ext.fly(t), cfg = this.tagConfig;\r
- var ns = cfg.namespace;\r
- if(this.interceptTitles && t.title){\r
- ttp = t.title;\r
- t.qtip = ttp;\r
- t.removeAttribute("title");\r
- e.preventDefault();\r
- } else{\r
- ttp = t.qtip || et.getAttributeNS(ns, cfg.attribute);\r
- }\r
- if(ttp){\r
- var autoHide = et.getAttributeNS(ns, cfg.hide);\r
- this.activeTarget = {\r
- el: t,\r
- text: ttp,\r
- width: et.getAttributeNS(ns, cfg.width),\r
- autoHide: autoHide != "user" && autoHide !== 'false',\r
- title: et.getAttributeNS(ns, cfg.title),\r
- cls: et.getAttributeNS(ns, cfg.cls),\r
- align: et.getAttributeNS(ns, cfg.align)\r
- };\r
- this.delayShow();\r
- }\r
- },\r
-\r
- // private\r
- onTargetOut : function(e){\r
- this.clearTimer('show');\r
- if(this.autoHide !== false){\r
- this.delayHide();\r
- }\r
- },\r
-\r
- // inherit docs\r
- showAt : function(xy){\r
- var t = this.activeTarget;\r
- if(t){\r
- if(!this.rendered){\r
- this.render(Ext.getBody());\r
- this.activeTarget = t;\r
- }\r
- if(t.width){\r
- this.setWidth(t.width);\r
- this.body.setWidth(this.adjustBodyWidth(t.width - this.getFrameWidth()));\r
- this.measureWidth = false;\r
- } else{\r
- this.measureWidth = true;\r
- }\r
- this.setTitle(t.title || '');\r
- this.body.update(t.text);\r
- this.autoHide = t.autoHide;\r
- this.dismissDelay = t.dismissDelay || this.dismissDelay;\r
- if(this.lastCls){\r
- this.el.removeClass(this.lastCls);\r
- delete this.lastCls;\r
- }\r
- if(t.cls){\r
- this.el.addClass(t.cls);\r
- this.lastCls = t.cls;\r
- }\r
- if(t.align){ // TODO: this doesn't seem to work consistently\r
- xy = this.el.getAlignToXY(t.el, t.align);\r
- this.constrainPosition = false;\r
- } else{\r
- this.constrainPosition = true;\r
- }\r
- }\r
- Ext.QuickTip.superclass.showAt.call(this, xy);\r
- },\r
-\r
- // inherit docs\r
- hide: function(){\r
- delete this.activeTarget;\r
- Ext.QuickTip.superclass.hide.call(this);\r
- }\r
-});\r
-\r
-Ext.QuickTips = function(){\r
- var tip, locks = [];\r
- return {\r
- \r
- init : function(autoRender){\r
- if(!tip){\r
- if(!Ext.isReady){\r
- Ext.onReady(function(){\r
- Ext.QuickTips.init(autoRender);\r
- });\r
- return;\r
- }\r
- tip = new Ext.QuickTip({elements:'header,body'});\r
- if(autoRender !== false){\r
- tip.render(Ext.getBody());\r
- }\r
- }\r
- },\r
-\r
- \r
- enable : function(){\r
- if(tip){\r
- locks.pop();\r
- if(locks.length < 1){\r
- tip.enable();\r
- }\r
- }\r
- },\r
-\r
- \r
- disable : function(){\r
- if(tip){\r
- tip.disable();\r
- }\r
- locks.push(1);\r
- },\r
-\r
- \r
- isEnabled : function(){\r
- return tip !== undefined && !tip.disabled;\r
- },\r
-\r
- \r
- getQuickTip : function(){\r
- return tip;\r
- },\r
-\r
- \r
- register : function(){\r
- tip.register.apply(tip, arguments);\r
- },\r
-\r
- \r
- unregister : function(){\r
- tip.unregister.apply(tip, arguments);\r
- },\r
-\r
- \r
- tips :function(){\r
- tip.register.apply(tip, arguments);\r
- }\r
- }\r
-}();\r
-\r
-Ext.tree.TreePanel = Ext.extend(Ext.Panel, {\r
- rootVisible : true,\r
- animate: Ext.enableFx,\r
- lines : true,\r
- enableDD : false,\r
- hlDrop : Ext.enableFx,\r
- pathSeparator: "/",\r
-\r
- initComponent : function(){\r
- Ext.tree.TreePanel.superclass.initComponent.call(this);\r
-\r
- if(!this.eventModel){\r
- this.eventModel = new Ext.tree.TreeEventModel(this);\r
- }\r
- \r
- // initialize the loader\r
- var l = this.loader;\r
- if(!l){\r
- l = new Ext.tree.TreeLoader({\r
- dataUrl: this.dataUrl\r
- });\r
- }else if(typeof l == 'object' && !l.load){\r
- l = new Ext.tree.TreeLoader(l);\r
- }\r
- this.loader = l;\r
- \r
- this.nodeHash = {};\r
-\r
- \r
- if(this.root){\r
- this.setRootNode(this.root);\r
- }\r
-\r
- this.addEvents(\r
-\r
- \r
- "append",\r
- \r
- "remove",\r
- \r
- "movenode",\r
- \r
- "insert",\r
- \r
- "beforeappend",\r
- \r
- "beforeremove",\r
- \r
- "beforemovenode",\r
- \r
- "beforeinsert",\r
-\r
- \r
- "beforeload",\r
- \r
- "load",\r
- \r
- "textchange",\r
- \r
- "beforeexpandnode",\r
- \r
- "beforecollapsenode",\r
- \r
- "expandnode",\r
- \r
- "disabledchange",\r
- \r
- "collapsenode",\r
- \r
- "beforeclick",\r
- \r
- "click",\r
- \r
- "checkchange",\r
- \r
- "dblclick",\r
- \r
- "contextmenu",\r
- \r
- "beforechildrenrendered",\r
- \r
- "startdrag",\r
- \r
- "enddrag",\r
- \r
- "dragdrop",\r
- \r
- "beforenodedrop",\r
- \r
- "nodedrop",\r
- \r
- "nodedragover"\r
- );\r
- if(this.singleExpand){\r
- this.on("beforeexpandnode", this.restrictExpand, this);\r
- }\r
- },\r
-\r
- // private\r
- proxyNodeEvent : function(ename, a1, a2, a3, a4, a5, a6){\r
- if(ename == 'collapse' || ename == 'expand' || ename == 'beforecollapse' || ename == 'beforeexpand' || ename == 'move' || ename == 'beforemove'){\r
- ename = ename+'node';\r
- }\r
- // args inline for performance while bubbling events\r
- return this.fireEvent(ename, a1, a2, a3, a4, a5, a6);\r
- },\r
-\r
-\r
- \r
- getRootNode : function(){\r
- return this.root;\r
- },\r
-\r
- \r
- setRootNode : function(node){\r
- if(!node.render){ // attributes passed\r
- node = this.loader.createNode(node);\r
- }\r
- this.root = node;\r
- node.ownerTree = this;\r
- node.isRoot = true;\r
- this.registerNode(node);\r
- if(!this.rootVisible){\r
- var uiP = node.attributes.uiProvider;\r
- node.ui = uiP ? new uiP(node) : new Ext.tree.RootTreeNodeUI(node); \r
- }\r
- return node;\r
- },\r
-\r
- \r
- getNodeById : function(id){\r
- return this.nodeHash[id];\r
- },\r
-\r
- // private\r
- registerNode : function(node){\r
- this.nodeHash[node.id] = node;\r
- },\r
-\r
- // private\r
- unregisterNode : function(node){\r
- delete this.nodeHash[node.id];\r
- },\r
-\r
- // private\r
- toString : function(){\r
- return "[Tree"+(this.id?" "+this.id:"")+"]";\r
- },\r
-\r
- // private\r
- restrictExpand : function(node){\r
- var p = node.parentNode;\r
- if(p){\r
- if(p.expandedChild && p.expandedChild.parentNode == p){\r
- p.expandedChild.collapse();\r
- }\r
- p.expandedChild = node;\r
- }\r
- },\r
-\r
- \r
- getChecked : function(a, startNode){\r
- startNode = startNode || this.root;\r
- var r = [];\r
- var f = function(){\r
- if(this.attributes.checked){\r
- r.push(!a ? this : (a == 'id' ? this.id : this.attributes[a]));\r
- }\r
- }\r
- startNode.cascade(f);\r
- return r;\r
- },\r
-\r
- \r
- getEl : function(){\r
- return this.el;\r
- },\r
-\r
- \r
- getLoader : function(){\r
- return this.loader;\r
- },\r
-\r
- \r
- expandAll : function(){\r
- this.root.expand(true);\r
- },\r
-\r
- \r
- collapseAll : function(){\r
- this.root.collapse(true);\r
- },\r
-\r
- \r
- getSelectionModel : function(){\r
- if(!this.selModel){\r
- this.selModel = new Ext.tree.DefaultSelectionModel();\r
- }\r
- return this.selModel;\r
- },\r
-\r
- \r
- expandPath : function(path, attr, callback){\r
- attr = attr || "id";\r
- var keys = path.split(this.pathSeparator);\r
- var curNode = this.root;\r
- if(curNode.attributes[attr] != keys[1]){ // invalid root\r
- if(callback){\r
- callback(false, null);\r
- }\r
- return;\r
- }\r
- var index = 1;\r
- var f = function(){\r
- if(++index == keys.length){\r
- if(callback){\r
- callback(true, curNode);\r
- }\r
- return;\r
- }\r
- var c = curNode.findChild(attr, keys[index]);\r
- if(!c){\r
- if(callback){\r
- callback(false, curNode);\r
- }\r
- return;\r
- }\r
- curNode = c;\r
- c.expand(false, false, f);\r
- };\r
- curNode.expand(false, false, f);\r
- },\r
-\r
- \r
- selectPath : function(path, attr, callback){\r
- attr = attr || "id";\r
- var keys = path.split(this.pathSeparator);\r
- var v = keys.pop();\r
- if(keys.length > 0){\r
- var f = function(success, node){\r
- if(success && node){\r
- var n = node.findChild(attr, v);\r
- if(n){\r
- n.select();\r
- if(callback){\r
- callback(true, n);\r
- }\r
- }else if(callback){\r
- callback(false, n);\r
- }\r
- }else{\r
- if(callback){\r
- callback(false, n);\r
- }\r
- }\r
- };\r
- this.expandPath(keys.join(this.pathSeparator), attr, f);\r
- }else{\r
- this.root.select();\r
- if(callback){\r
- callback(true, this.root);\r
- }\r
- }\r
- },\r
-\r
- \r
- getTreeEl : function(){\r
- return this.body;\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- Ext.tree.TreePanel.superclass.onRender.call(this, ct, position);\r
- this.el.addClass('x-tree');\r
- this.innerCt = this.body.createChild({tag:"ul",\r
- cls:"x-tree-root-ct " +\r
- (this.useArrows ? 'x-tree-arrows' : this.lines ? "x-tree-lines" : "x-tree-no-lines")});\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- Ext.tree.TreePanel.superclass.initEvents.call(this);\r
-\r
- if(this.containerScroll){\r
- Ext.dd.ScrollManager.register(this.body);\r
- }\r
- if((this.enableDD || this.enableDrop) && !this.dropZone){\r
- \r
- this.dropZone = new Ext.tree.TreeDropZone(this, this.dropConfig || {\r
- ddGroup: this.ddGroup || "TreeDD", appendOnly: this.ddAppendOnly === true\r
- });\r
- }\r
- if((this.enableDD || this.enableDrag) && !this.dragZone){\r
- \r
- this.dragZone = new Ext.tree.TreeDragZone(this, this.dragConfig || {\r
- ddGroup: this.ddGroup || "TreeDD",\r
- scroll: this.ddScroll\r
- });\r
- }\r
- this.getSelectionModel().init(this);\r
- },\r
-\r
- // private\r
- afterRender : function(){\r
- Ext.tree.TreePanel.superclass.afterRender.call(this);\r
- this.root.render();\r
- if(!this.rootVisible){\r
- this.root.renderChildren();\r
- }\r
- },\r
-\r
- onDestroy : function(){\r
- if(this.rendered){\r
- this.body.removeAllListeners();\r
- Ext.dd.ScrollManager.unregister(this.body);\r
- if(this.dropZone){\r
- this.dropZone.unreg();\r
- }\r
- if(this.dragZone){\r
- this.dragZone.unreg();\r
- }\r
- }\r
- this.root.destroy();\r
- this.nodeHash = null;\r
- Ext.tree.TreePanel.superclass.onDestroy.call(this);\r
- }\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
-\r
-\r
-\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
-});\r
-\r
-Ext.tree.TreePanel.nodeTypes = {};\r
-\r
-Ext.reg('treepanel', Ext.tree.TreePanel);\r
-Ext.tree.TreeEventModel = function(tree){\r
- this.tree = tree;\r
- this.tree.on('render', this.initEvents, this);\r
-}\r
-\r
-Ext.tree.TreeEventModel.prototype = {\r
- initEvents : function(){\r
- var el = this.tree.getTreeEl();\r
- el.on('click', this.delegateClick, this);\r
- if(this.tree.trackMouseOver !== false){\r
- el.on('mouseover', this.delegateOver, this);\r
- el.on('mouseout', this.delegateOut, this);\r
- }\r
- el.on('dblclick', this.delegateDblClick, this);\r
- el.on('contextmenu', this.delegateContextMenu, this);\r
- },\r
-\r
- getNode : function(e){\r
- var t;\r
- if(t = e.getTarget('.x-tree-node-el', 10)){\r
- var id = Ext.fly(t, '_treeEvents').getAttributeNS('ext', 'tree-node-id');\r
- if(id){\r
- return this.tree.getNodeById(id);\r
- }\r
- }\r
- return null;\r
- },\r
-\r
- getNodeTarget : function(e){\r
- var t = e.getTarget('.x-tree-node-icon', 1);\r
- if(!t){\r
- t = e.getTarget('.x-tree-node-el', 6);\r
- }\r
- return t;\r
- },\r
-\r
- delegateOut : function(e, t){\r
- if(!this.beforeEvent(e)){\r
- return;\r
- }\r
- if(e.getTarget('.x-tree-ec-icon', 1)){\r
- var n = this.getNode(e);\r
- this.onIconOut(e, n);\r
- if(n == this.lastEcOver){\r
- delete this.lastEcOver;\r
- }\r
- }\r
- if((t = this.getNodeTarget(e)) && !e.within(t, true)){\r
- this.onNodeOut(e, this.getNode(e));\r
- }\r
- },\r
-\r
- delegateOver : function(e, t){\r
- if(!this.beforeEvent(e)){\r
- return;\r
- }\r
- if(this.lastEcOver){ // prevent hung highlight\r
- this.onIconOut(e, this.lastEcOver);\r
- delete this.lastEcOver;\r
- }\r
- if(e.getTarget('.x-tree-ec-icon', 1)){\r
- this.lastEcOver = this.getNode(e);\r
- this.onIconOver(e, this.lastEcOver);\r
- }\r
- if(t = this.getNodeTarget(e)){\r
- this.onNodeOver(e, this.getNode(e));\r
- }\r
- },\r
-\r
- delegateClick : function(e, t){\r
- if(!this.beforeEvent(e)){\r
- return;\r
- }\r
-\r
- if(e.getTarget('input[type=checkbox]', 1)){\r
- this.onCheckboxClick(e, this.getNode(e));\r
- }\r
- else if(e.getTarget('.x-tree-ec-icon', 1)){\r
- this.onIconClick(e, this.getNode(e));\r
- }\r
- else if(this.getNodeTarget(e)){\r
- this.onNodeClick(e, this.getNode(e));\r
- }\r
- },\r
-\r
- delegateDblClick : function(e, t){\r
- if(this.beforeEvent(e) && this.getNodeTarget(e)){\r
- this.onNodeDblClick(e, this.getNode(e));\r
- }\r
- },\r
-\r
- delegateContextMenu : function(e, t){\r
- if(this.beforeEvent(e) && this.getNodeTarget(e)){\r
- this.onNodeContextMenu(e, this.getNode(e));\r
- }\r
- },\r
-\r
- onNodeClick : function(e, node){\r
- node.ui.onClick(e);\r
- },\r
-\r
- onNodeOver : function(e, node){\r
- node.ui.onOver(e);\r
- },\r
-\r
- onNodeOut : function(e, node){\r
- node.ui.onOut(e);\r
- },\r
-\r
- onIconOver : function(e, node){\r
- node.ui.addClass('x-tree-ec-over');\r
- },\r
-\r
- onIconOut : function(e, node){\r
- node.ui.removeClass('x-tree-ec-over');\r
- },\r
-\r
- onIconClick : function(e, node){\r
- node.ui.ecClick(e);\r
- },\r
-\r
- onCheckboxClick : function(e, node){\r
- node.ui.onCheckChange(e);\r
- },\r
-\r
- onNodeDblClick : function(e, node){\r
- node.ui.onDblClick(e);\r
- },\r
-\r
- onNodeContextMenu : function(e, node){\r
- node.ui.onContextMenu(e);\r
- },\r
-\r
- beforeEvent : function(e){\r
- if(this.disabled){\r
- e.stopEvent();\r
- return false;\r
- }\r
- return true;\r
- },\r
-\r
- disable: function(){\r
- this.disabled = true;\r
- },\r
-\r
- enable: function(){\r
- this.disabled = false;\r
- }\r
-};\r
-\r
-Ext.tree.DefaultSelectionModel = function(config){\r
- this.selNode = null;\r
- \r
- this.addEvents(\r
- \r
- "selectionchange",\r
-\r
- \r
- "beforeselect"\r
- );\r
-\r
- Ext.apply(this, config);\r
- Ext.tree.DefaultSelectionModel.superclass.constructor.call(this);\r
-};\r
-\r
-Ext.extend(Ext.tree.DefaultSelectionModel, Ext.util.Observable, {\r
- init : function(tree){\r
- this.tree = tree;\r
- tree.getTreeEl().on("keydown", this.onKeyDown, this);\r
- tree.on("click", this.onNodeClick, this);\r
- },\r
- \r
- onNodeClick : function(node, e){\r
- this.select(node);\r
- },\r
- \r
- \r
- select : function(node){\r
- var last = this.selNode;\r
- if(last != node && this.fireEvent('beforeselect', this, node, last) !== false){\r
- if(last){\r
- last.ui.onSelectedChange(false);\r
- }\r
- this.selNode = node;\r
- node.ui.onSelectedChange(true);\r
- this.fireEvent("selectionchange", this, node, last);\r
- }\r
- return node;\r
- },\r
- \r
- \r
- unselect : function(node){\r
- if(this.selNode == node){\r
- this.clearSelections();\r
- } \r
- },\r
- \r
- \r
- clearSelections : function(){\r
- var n = this.selNode;\r
- if(n){\r
- n.ui.onSelectedChange(false);\r
- this.selNode = null;\r
- this.fireEvent("selectionchange", this, null);\r
- }\r
- return n;\r
- },\r
- \r
- \r
- getSelectedNode : function(){\r
- return this.selNode; \r
- },\r
- \r
- \r
- isSelected : function(node){\r
- return this.selNode == node; \r
- },\r
-\r
- \r
- selectPrevious : function(){\r
- var s = this.selNode || this.lastSelNode;\r
- if(!s){\r
- return null;\r
- }\r
- var ps = s.previousSibling;\r
- if(ps){\r
- if(!ps.isExpanded() || ps.childNodes.length < 1){\r
- return this.select(ps);\r
- } else{\r
- var lc = ps.lastChild;\r
- while(lc && lc.isExpanded() && lc.childNodes.length > 0){\r
- lc = lc.lastChild;\r
- }\r
- return this.select(lc);\r
- }\r
- } else if(s.parentNode && (this.tree.rootVisible || !s.parentNode.isRoot)){\r
- return this.select(s.parentNode);\r
- }\r
- return null;\r
- },\r
-\r
- \r
- selectNext : function(){\r
- var s = this.selNode || this.lastSelNode;\r
- if(!s){\r
- return null;\r
- }\r
- if(s.firstChild && s.isExpanded()){\r
- return this.select(s.firstChild);\r
- }else if(s.nextSibling){\r
- return this.select(s.nextSibling);\r
- }else if(s.parentNode){\r
- var newS = null;\r
- s.parentNode.bubble(function(){\r
- if(this.nextSibling){\r
- newS = this.getOwnerTree().selModel.select(this.nextSibling);\r
- return false;\r
- }\r
- });\r
- return newS;\r
- }\r
- return null;\r
- },\r
-\r
- onKeyDown : function(e){\r
- var s = this.selNode || this.lastSelNode;\r
- // undesirable, but required\r
- var sm = this;\r
- if(!s){\r
- return;\r
- }\r
- var k = e.getKey();\r
- switch(k){\r
- case e.DOWN:\r
- e.stopEvent();\r
- this.selectNext();\r
- break;\r
- case e.UP:\r
- e.stopEvent();\r
- this.selectPrevious();\r
- break;\r
- case e.RIGHT:\r
- e.preventDefault();\r
- if(s.hasChildNodes()){\r
- if(!s.isExpanded()){\r
- s.expand();\r
- }else if(s.firstChild){\r
- this.select(s.firstChild, e);\r
- }\r
- }\r
- break;\r
- case e.LEFT:\r
- e.preventDefault();\r
- if(s.hasChildNodes() && s.isExpanded()){\r
- s.collapse();\r
- }else if(s.parentNode && (this.tree.rootVisible || s.parentNode != this.tree.getRootNode())){\r
- this.select(s.parentNode, e);\r
- }\r
- break;\r
- };\r
- }\r
-});\r
-\r
-\r
-Ext.tree.MultiSelectionModel = function(config){\r
- this.selNodes = [];\r
- this.selMap = {};\r
- this.addEvents(\r
- \r
- "selectionchange"\r
- );\r
- Ext.apply(this, config);\r
- Ext.tree.MultiSelectionModel.superclass.constructor.call(this);\r
-};\r
-\r
-Ext.extend(Ext.tree.MultiSelectionModel, Ext.util.Observable, {\r
- init : function(tree){\r
- this.tree = tree;\r
- tree.getTreeEl().on("keydown", this.onKeyDown, this);\r
- tree.on("click", this.onNodeClick, this);\r
- },\r
- \r
- onNodeClick : function(node, e){\r
- this.select(node, e, e.ctrlKey);\r
- },\r
- \r
- \r
- select : function(node, e, keepExisting){\r
- if(keepExisting !== true){\r
- this.clearSelections(true);\r
- }\r
- if(this.isSelected(node)){\r
- this.lastSelNode = node;\r
- return node;\r
- }\r
- this.selNodes.push(node);\r
- this.selMap[node.id] = node;\r
- this.lastSelNode = node;\r
- node.ui.onSelectedChange(true);\r
- this.fireEvent("selectionchange", this, this.selNodes);\r
- return node;\r
- },\r
- \r
- \r
- unselect : function(node){\r
- if(this.selMap[node.id]){\r
- node.ui.onSelectedChange(false);\r
- var sn = this.selNodes;\r
- var index = sn.indexOf(node);\r
- if(index != -1){\r
- this.selNodes.splice(index, 1);\r
- }\r
- delete this.selMap[node.id];\r
- this.fireEvent("selectionchange", this, this.selNodes);\r
- }\r
- },\r
- \r
- \r
- clearSelections : function(suppressEvent){\r
- var sn = this.selNodes;\r
- if(sn.length > 0){\r
- for(var i = 0, len = sn.length; i < len; i++){\r
- sn[i].ui.onSelectedChange(false);\r
- }\r
- this.selNodes = [];\r
- this.selMap = {};\r
- if(suppressEvent !== true){\r
- this.fireEvent("selectionchange", this, this.selNodes);\r
- }\r
- }\r
- },\r
- \r
- \r
- isSelected : function(node){\r
- return this.selMap[node.id] ? true : false; \r
- },\r
- \r
- \r
- getSelectedNodes : function(){\r
- return this.selNodes; \r
- },\r
-\r
- onKeyDown : Ext.tree.DefaultSelectionModel.prototype.onKeyDown,\r
-\r
- selectNext : Ext.tree.DefaultSelectionModel.prototype.selectNext,\r
-\r
- selectPrevious : Ext.tree.DefaultSelectionModel.prototype.selectPrevious\r
-});\r
-\r
-Ext.tree.TreeNode = function(attributes){\r
- attributes = attributes || {};\r
- if(typeof attributes == "string"){\r
- attributes = {text: attributes};\r
- }\r
- this.childrenRendered = false;\r
- this.rendered = false;\r
- Ext.tree.TreeNode.superclass.constructor.call(this, attributes);\r
- this.expanded = attributes.expanded === true;\r
- this.isTarget = attributes.isTarget !== false;\r
- this.draggable = attributes.draggable !== false && attributes.allowDrag !== false;\r
- this.allowChildren = attributes.allowChildren !== false && attributes.allowDrop !== false;\r
-\r
- \r
- this.text = attributes.text;\r
- \r
- this.disabled = attributes.disabled === true;\r
-\r
- this.addEvents(\r
- \r
- "textchange",\r
- \r
- "beforeexpand",\r
- \r
- "beforecollapse",\r
- \r
- "expand",\r
- \r
- "disabledchange",\r
- \r
- "collapse",\r
- \r
- "beforeclick",\r
- \r
- "click",\r
- \r
- "checkchange",\r
- \r
- "dblclick",\r
- \r
- "contextmenu",\r
- \r
- "beforechildrenrendered"\r
- );\r
-\r
- var uiClass = this.attributes.uiProvider || this.defaultUI || Ext.tree.TreeNodeUI;\r
-\r
- \r
- this.ui = new uiClass(this);\r
-};\r
-Ext.extend(Ext.tree.TreeNode, Ext.data.Node, {\r
- preventHScroll: true,\r
- \r
- isExpanded : function(){\r
- return this.expanded;\r
- },\r
-\r
-\r
- getUI : function(){\r
- return this.ui;\r
- },\r
-\r
- getLoader : function(){\r
- var owner;\r
- return this.loader || ((owner = this.getOwnerTree()) && owner.loader ? owner.loader : new Ext.tree.TreeLoader());\r
- },\r
-\r
- // private override\r
- setFirstChild : function(node){\r
- var of = this.firstChild;\r
- Ext.tree.TreeNode.superclass.setFirstChild.call(this, node);\r
- if(this.childrenRendered && of && node != of){\r
- of.renderIndent(true, true);\r
- }\r
- if(this.rendered){\r
- this.renderIndent(true, true);\r
- }\r
- },\r
-\r
- // private override\r
- setLastChild : function(node){\r
- var ol = this.lastChild;\r
- Ext.tree.TreeNode.superclass.setLastChild.call(this, node);\r
- if(this.childrenRendered && ol && node != ol){\r
- ol.renderIndent(true, true);\r
- }\r
- if(this.rendered){\r
- this.renderIndent(true, true);\r
- }\r
- },\r
-\r
- // these methods are overridden to provide lazy rendering support\r
- // private override\r
- appendChild : function(n){\r
- if(!n.render && !Ext.isArray(n)){\r
- n = this.getLoader().createNode(n);\r
- }\r
- var node = Ext.tree.TreeNode.superclass.appendChild.call(this, n);\r
- if(node && this.childrenRendered){\r
- node.render();\r
- }\r
- this.ui.updateExpandIcon();\r
- return node;\r
- },\r
-\r
- // private override\r
- removeChild : function(node){\r
- this.ownerTree.getSelectionModel().unselect(node);\r
- Ext.tree.TreeNode.superclass.removeChild.apply(this, arguments);\r
- // if it's been rendered remove dom node\r
- if(this.childrenRendered){\r
- node.ui.remove();\r
- }\r
- if(this.childNodes.length < 1){\r
- this.collapse(false, false);\r
- }else{\r
- this.ui.updateExpandIcon();\r
- }\r
- if(!this.firstChild && !this.isHiddenRoot()) {\r
- this.childrenRendered = false;\r
- }\r
- return node;\r
- },\r
-\r
- // private override\r
- insertBefore : function(node, refNode){\r
- if(!node.render){ \r
- node = this.getLoader().createNode(node);\r
- }\r
- var newNode = Ext.tree.TreeNode.superclass.insertBefore.apply(this, arguments);\r
- if(newNode && refNode && this.childrenRendered){\r
- node.render();\r
- }\r
- this.ui.updateExpandIcon();\r
- return newNode;\r
- },\r
-\r
- \r
- setText : function(text){\r
- var oldText = this.text;\r
- this.text = text;\r
- this.attributes.text = text;\r
- if(this.rendered){ // event without subscribing\r
- this.ui.onTextChange(this, text, oldText);\r
- }\r
- this.fireEvent("textchange", this, text, oldText);\r
- },\r
-\r
- \r
- select : function(){\r
- this.getOwnerTree().getSelectionModel().select(this);\r
- },\r
-\r
- \r
- unselect : function(){\r
- this.getOwnerTree().getSelectionModel().unselect(this);\r
- },\r
-\r
- \r
- isSelected : function(){\r
- return this.getOwnerTree().getSelectionModel().isSelected(this);\r
- },\r
-\r
- \r
- expand : function(deep, anim, callback){\r
- if(!this.expanded){\r
- if(this.fireEvent("beforeexpand", this, deep, anim) === false){\r
- return;\r
- }\r
- if(!this.childrenRendered){\r
- this.renderChildren();\r
- }\r
- this.expanded = true;\r
- if(!this.isHiddenRoot() && (this.getOwnerTree().animate && anim !== false) || anim){\r
- this.ui.animExpand(function(){\r
- this.fireEvent("expand", this);\r
- if(typeof callback == "function"){\r
- callback(this);\r
- }\r
- if(deep === true){\r
- this.expandChildNodes(true);\r
- }\r
- }.createDelegate(this));\r
- return;\r
- }else{\r
- this.ui.expand();\r
- this.fireEvent("expand", this);\r
- if(typeof callback == "function"){\r
- callback(this);\r
- }\r
- }\r
- }else{\r
- if(typeof callback == "function"){\r
- callback(this);\r
- }\r
- }\r
- if(deep === true){\r
- this.expandChildNodes(true);\r
- }\r
- },\r
-\r
- isHiddenRoot : function(){\r
- return this.isRoot && !this.getOwnerTree().rootVisible;\r
- },\r
-\r
- \r
- collapse : function(deep, anim){\r
- if(this.expanded && !this.isHiddenRoot()){\r
- if(this.fireEvent("beforecollapse", this, deep, anim) === false){\r
- return;\r
- }\r
- this.expanded = false;\r
- if((this.getOwnerTree().animate && anim !== false) || anim){\r
- this.ui.animCollapse(function(){\r
- this.fireEvent("collapse", this);\r
- if(deep === true){\r
- this.collapseChildNodes(true);\r
- }\r
- }.createDelegate(this));\r
- return;\r
- }else{\r
- this.ui.collapse();\r
- this.fireEvent("collapse", this);\r
- }\r
- }\r
- if(deep === true){\r
- var cs = this.childNodes;\r
- for(var i = 0, len = cs.length; i < len; i++) {\r
- cs[i].collapse(true, false);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- delayedExpand : function(delay){\r
- if(!this.expandProcId){\r
- this.expandProcId = this.expand.defer(delay, this);\r
- }\r
- },\r
-\r
- // private\r
- cancelExpand : function(){\r
- if(this.expandProcId){\r
- clearTimeout(this.expandProcId);\r
- }\r
- this.expandProcId = false;\r
- },\r
-\r
- \r
- toggle : function(){\r
- if(this.expanded){\r
- this.collapse();\r
- }else{\r
- this.expand();\r
- }\r
- },\r
-\r
- \r
- ensureVisible : function(callback){\r
- var tree = this.getOwnerTree();\r
- tree.expandPath(this.parentNode ? this.parentNode.getPath() : this.getPath(), false, function(){\r
- var node = tree.getNodeById(this.id); // Somehow if we don't do this, we lose changes that happened to node in the meantime\r
- tree.getTreeEl().scrollChildIntoView(node.ui.anchor);\r
- Ext.callback(callback);\r
- }.createDelegate(this));\r
- },\r
-\r
- \r
- expandChildNodes : function(deep){\r
- var cs = this.childNodes;\r
- for(var i = 0, len = cs.length; i < len; i++) {\r
- cs[i].expand(deep);\r
- }\r
- },\r
-\r
- \r
- collapseChildNodes : function(deep){\r
- var cs = this.childNodes;\r
- for(var i = 0, len = cs.length; i < len; i++) {\r
- cs[i].collapse(deep);\r
- }\r
- },\r
-\r
- \r
- disable : function(){\r
- this.disabled = true;\r
- this.unselect();\r
- if(this.rendered && this.ui.onDisableChange){ // event without subscribing\r
- this.ui.onDisableChange(this, true);\r
- }\r
- this.fireEvent("disabledchange", this, true);\r
- },\r
-\r
- \r
- enable : function(){\r
- this.disabled = false;\r
- if(this.rendered && this.ui.onDisableChange){ // event without subscribing\r
- this.ui.onDisableChange(this, false);\r
- }\r
- this.fireEvent("disabledchange", this, false);\r
- },\r
-\r
- // private\r
- renderChildren : function(suppressEvent){\r
- if(suppressEvent !== false){\r
- this.fireEvent("beforechildrenrendered", this);\r
- }\r
- var cs = this.childNodes;\r
- for(var i = 0, len = cs.length; i < len; i++){\r
- cs[i].render(true);\r
- }\r
- this.childrenRendered = true;\r
- },\r
-\r
- // private\r
- sort : function(fn, scope){\r
- Ext.tree.TreeNode.superclass.sort.apply(this, arguments);\r
- if(this.childrenRendered){\r
- var cs = this.childNodes;\r
- for(var i = 0, len = cs.length; i < len; i++){\r
- cs[i].render(true);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- render : function(bulkRender){\r
- this.ui.render(bulkRender);\r
- if(!this.rendered){\r
- // make sure it is registered\r
- this.getOwnerTree().registerNode(this);\r
- this.rendered = true;\r
- if(this.expanded){\r
- this.expanded = false;\r
- this.expand(false, false);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- renderIndent : function(deep, refresh){\r
- if(refresh){\r
- this.ui.childIndent = null;\r
- }\r
- this.ui.renderIndent();\r
- if(deep === true && this.childrenRendered){\r
- var cs = this.childNodes;\r
- for(var i = 0, len = cs.length; i < len; i++){\r
- cs[i].renderIndent(true, refresh);\r
- }\r
- }\r
- },\r
-\r
- beginUpdate : function(){\r
- this.childrenRendered = false;\r
- },\r
-\r
- endUpdate : function(){\r
- if(this.expanded && this.rendered){\r
- this.renderChildren();\r
- }\r
- },\r
-\r
- destroy : function(){\r
- if(this.childNodes){\r
- for(var i = 0,l = this.childNodes.length; i < l; i++){\r
- this.childNodes[i].destroy();\r
- }\r
- this.childNodes = null;\r
- }\r
- if(this.ui.destroy){\r
- this.ui.destroy();\r
- }\r
- }\r
-});\r
-\r
-Ext.tree.TreePanel.nodeTypes.node = Ext.tree.TreeNode;\r
-\r
- Ext.tree.AsyncTreeNode = function(config){\r
- this.loaded = config && config.loaded === true;\r
- this.loading = false;\r
- Ext.tree.AsyncTreeNode.superclass.constructor.apply(this, arguments);\r
- \r
- this.addEvents('beforeload', 'load');\r
- \r
- \r
-};\r
-Ext.extend(Ext.tree.AsyncTreeNode, Ext.tree.TreeNode, {\r
- expand : function(deep, anim, callback){\r
- if(this.loading){ // if an async load is already running, waiting til it's done\r
- var timer;\r
- var f = function(){\r
- if(!this.loading){ // done loading\r
- clearInterval(timer);\r
- this.expand(deep, anim, callback);\r
- }\r
- }.createDelegate(this);\r
- timer = setInterval(f, 200);\r
- return;\r
- }\r
- if(!this.loaded){\r
- if(this.fireEvent("beforeload", this) === false){\r
- return;\r
- }\r
- this.loading = true;\r
- this.ui.beforeLoad(this);\r
- var loader = this.loader || this.attributes.loader || this.getOwnerTree().getLoader();\r
- if(loader){\r
- loader.load(this, this.loadComplete.createDelegate(this, [deep, anim, callback]));\r
- return;\r
- }\r
- }\r
- Ext.tree.AsyncTreeNode.superclass.expand.call(this, deep, anim, callback);\r
- },\r
- \r
- \r
- isLoading : function(){\r
- return this.loading; \r
- },\r
- \r
- loadComplete : function(deep, anim, callback){\r
- this.loading = false;\r
- this.loaded = true;\r
- this.ui.afterLoad(this);\r
- this.fireEvent("load", this);\r
- this.expand(deep, anim, callback);\r
- },\r
- \r
- \r
- isLoaded : function(){\r
- return this.loaded;\r
- },\r
- \r
- hasChildNodes : function(){\r
- if(!this.isLeaf() && !this.loaded){\r
- return true;\r
- }else{\r
- return Ext.tree.AsyncTreeNode.superclass.hasChildNodes.call(this);\r
- }\r
- },\r
-\r
- \r
- reload : function(callback){\r
- this.collapse(false, false);\r
- while(this.firstChild){\r
- this.removeChild(this.firstChild).destroy();\r
- }\r
- this.childrenRendered = false;\r
- this.loaded = false;\r
- if(this.isHiddenRoot()){\r
- this.expanded = false;\r
- }\r
- this.expand(false, false, callback);\r
- }\r
-});\r
-\r
-Ext.tree.TreePanel.nodeTypes.async = Ext.tree.AsyncTreeNode;\r
-\r
-Ext.tree.TreeNodeUI = function(node){\r
- this.node = node;\r
- this.rendered = false;\r
- this.animating = false;\r
- this.wasLeaf = true;\r
- this.ecc = 'x-tree-ec-icon x-tree-elbow';\r
- this.emptyIcon = Ext.BLANK_IMAGE_URL;\r
-};\r
-\r
-Ext.tree.TreeNodeUI.prototype = {\r
- // private\r
- removeChild : function(node){\r
- if(this.rendered){\r
- this.ctNode.removeChild(node.ui.getEl());\r
- } \r
- },\r
-\r
- // private\r
- beforeLoad : function(){\r
- this.addClass("x-tree-node-loading");\r
- },\r
-\r
- // private\r
- afterLoad : function(){\r
- this.removeClass("x-tree-node-loading");\r
- },\r
-\r
- // private\r
- onTextChange : function(node, text, oldText){\r
- if(this.rendered){\r
- this.textNode.innerHTML = text;\r
- }\r
- },\r
-\r
- // private\r
- onDisableChange : function(node, state){\r
- this.disabled = state;\r
- if (this.checkbox) {\r
- this.checkbox.disabled = state;\r
- } \r
- if(state){\r
- this.addClass("x-tree-node-disabled");\r
- }else{\r
- this.removeClass("x-tree-node-disabled");\r
- } \r
- },\r
-\r
- // private\r
- onSelectedChange : function(state){\r
- if(state){\r
- this.focus();\r
- this.addClass("x-tree-selected");\r
- }else{\r
- //this.blur();\r
- this.removeClass("x-tree-selected");\r
- }\r
- },\r
-\r
- // private\r
- onMove : function(tree, node, oldParent, newParent, index, refNode){\r
- this.childIndent = null;\r
- if(this.rendered){\r
- var targetNode = newParent.ui.getContainer();\r
- if(!targetNode){//target not rendered\r
- this.holder = document.createElement("div");\r
- this.holder.appendChild(this.wrap);\r
- return;\r
- }\r
- var insertBefore = refNode ? refNode.ui.getEl() : null;\r
- if(insertBefore){\r
- targetNode.insertBefore(this.wrap, insertBefore);\r
- }else{\r
- targetNode.appendChild(this.wrap);\r
- }\r
- this.node.renderIndent(true);\r
- }\r
- },\r
-\r
-\r
- addClass : function(cls){\r
- if(this.elNode){\r
- Ext.fly(this.elNode).addClass(cls);\r
- }\r
- },\r
-\r
-\r
- removeClass : function(cls){\r
- if(this.elNode){\r
- Ext.fly(this.elNode).removeClass(cls); \r
- }\r
- },\r
-\r
- // private\r
- remove : function(){\r
- if(this.rendered){\r
- this.holder = document.createElement("div");\r
- this.holder.appendChild(this.wrap);\r
- } \r
- },\r
-\r
- // private\r
- fireEvent : function(){\r
- return this.node.fireEvent.apply(this.node, arguments); \r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- this.node.on("move", this.onMove, this);\r
-\r
- if(this.node.disabled){\r
- this.addClass("x-tree-node-disabled");\r
- if (this.checkbox) {\r
- this.checkbox.disabled = true;\r
- } \r
- }\r
- if(this.node.hidden){\r
- this.hide();\r
- }\r
- var ot = this.node.getOwnerTree();\r
- var dd = ot.enableDD || ot.enableDrag || ot.enableDrop;\r
- if(dd && (!this.node.isRoot || ot.rootVisible)){\r
- Ext.dd.Registry.register(this.elNode, {\r
- node: this.node,\r
- handles: this.getDDHandles(),\r
- isHandle: false\r
- });\r
- }\r
- },\r
-\r
- // private\r
- getDDHandles : function(){\r
- return [this.iconNode, this.textNode, this.elNode];\r
- },\r
-\r
-\r
- hide : function(){\r
- this.node.hidden = true;\r
- if(this.wrap){\r
- this.wrap.style.display = "none";\r
- }\r
- },\r
-\r
-\r
- show : function(){\r
- this.node.hidden = false;\r
- if(this.wrap){\r
- this.wrap.style.display = "";\r
- } \r
- },\r
-\r
- // private\r
- onContextMenu : function(e){\r
- if (this.node.hasListener("contextmenu") || this.node.getOwnerTree().hasListener("contextmenu")) {\r
- e.preventDefault();\r
- this.focus();\r
- this.fireEvent("contextmenu", this.node, e);\r
- }\r
- },\r
-\r
- // private\r
- onClick : function(e){\r
- if(this.dropping){\r
- e.stopEvent();\r
- return;\r
- }\r
- if(this.fireEvent("beforeclick", this.node, e) !== false){\r
- var a = e.getTarget('a');\r
- if(!this.disabled && this.node.attributes.href && a){\r
- this.fireEvent("click", this.node, e);\r
- return;\r
- }else if(a && e.ctrlKey){\r
- e.stopEvent();\r
- }\r
- e.preventDefault();\r
- if(this.disabled){\r
- return;\r
- }\r
-\r
- if(this.node.attributes.singleClickExpand && !this.animating && this.node.isExpandable()){\r
- this.node.toggle();\r
- }\r
-\r
- this.fireEvent("click", this.node, e);\r
- }else{\r
- e.stopEvent();\r
- }\r
- },\r
-\r
- // private\r
- onDblClick : function(e){\r
- e.preventDefault();\r
- if(this.disabled){\r
- return;\r
- }\r
- if(this.checkbox){\r
- this.toggleCheck();\r
- }\r
- if(!this.animating && this.node.isExpandable()){\r
- this.node.toggle();\r
- }\r
- this.fireEvent("dblclick", this.node, e);\r
- },\r
-\r
- onOver : function(e){\r
- this.addClass('x-tree-node-over');\r
- },\r
-\r
- onOut : function(e){\r
- this.removeClass('x-tree-node-over');\r
- },\r
-\r
- // private\r
- onCheckChange : function(){\r
- var checked = this.checkbox.checked;\r
- // fix for IE6\r
- this.checkbox.defaultChecked = checked;\r
- this.node.attributes.checked = checked;\r
- this.fireEvent('checkchange', this.node, checked);\r
- },\r
-\r
- // private\r
- ecClick : function(e){\r
- if(!this.animating && this.node.isExpandable()){\r
- this.node.toggle();\r
- }\r
- },\r
-\r
- // private\r
- startDrop : function(){\r
- this.dropping = true;\r
- },\r
- \r
- // delayed drop so the click event doesn't get fired on a drop\r
- endDrop : function(){ \r
- setTimeout(function(){\r
- this.dropping = false;\r
- }.createDelegate(this), 50); \r
- },\r
-\r
- // private\r
- expand : function(){\r
- this.updateExpandIcon();\r
- this.ctNode.style.display = "";\r
- },\r
-\r
- // private\r
- focus : function(){\r
- if(!this.node.preventHScroll){\r
- try{this.anchor.focus();\r
- }catch(e){}\r
- }else{\r
- try{\r
- var noscroll = this.node.getOwnerTree().getTreeEl().dom;\r
- var l = noscroll.scrollLeft;\r
- this.anchor.focus();\r
- noscroll.scrollLeft = l;\r
- }catch(e){}\r
- }\r
- },\r
-\r
-\r
- toggleCheck : function(value){\r
- var cb = this.checkbox;\r
- if(cb){\r
- cb.checked = (value === undefined ? !cb.checked : value);\r
- this.onCheckChange();\r
- }\r
- },\r
-\r
- // private\r
- blur : function(){\r
- try{\r
- this.anchor.blur();\r
- }catch(e){} \r
- },\r
-\r
- // private\r
- animExpand : function(callback){\r
- var ct = Ext.get(this.ctNode);\r
- ct.stopFx();\r
- if(!this.node.isExpandable()){\r
- this.updateExpandIcon();\r
- this.ctNode.style.display = "";\r
- Ext.callback(callback);\r
- return;\r
- }\r
- this.animating = true;\r
- this.updateExpandIcon();\r
- \r
- ct.slideIn('t', {\r
- callback : function(){\r
- this.animating = false;\r
- Ext.callback(callback);\r
- },\r
- scope: this,\r
- duration: this.node.ownerTree.duration || .25\r
- });\r
- },\r
-\r
- // private\r
- highlight : function(){\r
- var tree = this.node.getOwnerTree();\r
- Ext.fly(this.wrap).highlight(\r
- tree.hlColor || "C3DAF9",\r
- {endColor: tree.hlBaseColor}\r
- );\r
- },\r
-\r
- // private\r
- collapse : function(){\r
- this.updateExpandIcon();\r
- this.ctNode.style.display = "none";\r
- },\r
-\r
- // private\r
- animCollapse : function(callback){\r
- var ct = Ext.get(this.ctNode);\r
- ct.enableDisplayMode('block');\r
- ct.stopFx();\r
-\r
- this.animating = true;\r
- this.updateExpandIcon();\r
-\r
- ct.slideOut('t', {\r
- callback : function(){\r
- this.animating = false;\r
- Ext.callback(callback);\r
- },\r
- scope: this,\r
- duration: this.node.ownerTree.duration || .25\r
- });\r
- },\r
-\r
- // private\r
- getContainer : function(){\r
- return this.ctNode; \r
- },\r
-\r
- // private\r
- getEl : function(){\r
- return this.wrap; \r
- },\r
-\r
- // private\r
- appendDDGhost : function(ghostNode){\r
- ghostNode.appendChild(this.elNode.cloneNode(true));\r
- },\r
-\r
- // private\r
- getDDRepairXY : function(){\r
- return Ext.lib.Dom.getXY(this.iconNode);\r
- },\r
-\r
- // private\r
- onRender : function(){\r
- this.render(); \r
- },\r
-\r
- // private\r
- render : function(bulkRender){\r
- var n = this.node, a = n.attributes;\r
- var targetNode = n.parentNode ? \r
- n.parentNode.ui.getContainer() : n.ownerTree.innerCt.dom;\r
- \r
- if(!this.rendered){\r
- this.rendered = true;\r
-\r
- this.renderElements(n, a, targetNode, bulkRender);\r
-\r
- if(a.qtip){\r
- if(this.textNode.setAttributeNS){\r
- this.textNode.setAttributeNS("ext", "qtip", a.qtip);\r
- if(a.qtipTitle){\r
- this.textNode.setAttributeNS("ext", "qtitle", a.qtipTitle);\r
- }\r
- }else{\r
- this.textNode.setAttribute("ext:qtip", a.qtip);\r
- if(a.qtipTitle){\r
- this.textNode.setAttribute("ext:qtitle", a.qtipTitle);\r
- }\r
- } \r
- }else if(a.qtipCfg){\r
- a.qtipCfg.target = Ext.id(this.textNode);\r
- Ext.QuickTips.register(a.qtipCfg);\r
- }\r
- this.initEvents();\r
- if(!this.node.expanded){\r
- this.updateExpandIcon(true);\r
- }\r
- }else{\r
- if(bulkRender === true) {\r
- targetNode.appendChild(this.wrap);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- renderElements : function(n, a, targetNode, bulkRender){\r
- // add some indent caching, this helps performance when rendering a large tree\r
- this.indentMarkup = n.parentNode ? n.parentNode.ui.getChildIndent() : '';\r
-\r
- var cb = typeof a.checked == 'boolean';\r
-\r
- var href = a.href ? a.href : Ext.isGecko ? "" : "#";\r
- var buf = ['<li class="x-tree-node"><div ext:tree-node-id="',n.id,'" class="x-tree-node-el x-tree-node-leaf x-unselectable ', a.cls,'" unselectable="on">',\r
- '<span class="x-tree-node-indent">',this.indentMarkup,"</span>",\r
- '<img src="', this.emptyIcon, '" class="x-tree-ec-icon x-tree-elbow" />',\r
- '<img src="', a.icon || this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on" />',\r
- cb ? ('<input class="x-tree-node-cb" type="checkbox" ' + (a.checked ? 'checked="checked" />' : '/>')) : '',\r
- '<a hidefocus="on" class="x-tree-node-anchor" href="',href,'" tabIndex="1" ',\r
- a.hrefTarget ? ' target="'+a.hrefTarget+'"' : "", '><span unselectable="on">',n.text,"</span></a></div>",\r
- '<ul class="x-tree-node-ct" style="display:none;"></ul>',\r
- "</li>"].join('');\r
-\r
- var nel;\r
- if(bulkRender !== true && n.nextSibling && (nel = n.nextSibling.ui.getEl())){\r
- this.wrap = Ext.DomHelper.insertHtml("beforeBegin", nel, buf);\r
- }else{\r
- this.wrap = Ext.DomHelper.insertHtml("beforeEnd", targetNode, buf);\r
- }\r
- \r
- this.elNode = this.wrap.childNodes[0];\r
- this.ctNode = this.wrap.childNodes[1];\r
- var cs = this.elNode.childNodes;\r
- this.indentNode = cs[0];\r
- this.ecNode = cs[1];\r
- this.iconNode = cs[2];\r
- var index = 3;\r
- if(cb){\r
- this.checkbox = cs[3];\r
- // fix for IE6\r
- this.checkbox.defaultChecked = this.checkbox.checked; \r
- index++;\r
- }\r
- this.anchor = cs[index];\r
- this.textNode = cs[index].firstChild;\r
- },\r
-\r
-\r
- getAnchor : function(){\r
- return this.anchor;\r
- },\r
- \r
-\r
- getTextEl : function(){\r
- return this.textNode;\r
- },\r
- \r
-\r
- getIconEl : function(){\r
- return this.iconNode;\r
- },\r
-\r
-\r
- isChecked : function(){\r
- return this.checkbox ? this.checkbox.checked : false; \r
- },\r
-\r
- // private\r
- updateExpandIcon : function(){\r
- if(this.rendered){\r
- var n = this.node, c1, c2;\r
- var cls = n.isLast() ? "x-tree-elbow-end" : "x-tree-elbow";\r
- if(n.isExpandable()){\r
- if(n.expanded){\r
- cls += "-minus";\r
- c1 = "x-tree-node-collapsed";\r
- c2 = "x-tree-node-expanded";\r
- }else{\r
- cls += "-plus";\r
- c1 = "x-tree-node-expanded";\r
- c2 = "x-tree-node-collapsed";\r
- }\r
- if(this.wasLeaf){\r
- this.removeClass("x-tree-node-leaf");\r
- this.wasLeaf = false;\r
- }\r
- if(this.c1 != c1 || this.c2 != c2){\r
- Ext.fly(this.elNode).replaceClass(c1, c2);\r
- this.c1 = c1; this.c2 = c2;\r
- }\r
- }else{\r
- if(!this.wasLeaf){\r
- Ext.fly(this.elNode).replaceClass("x-tree-node-expanded", "x-tree-node-leaf");\r
- delete this.c1;\r
- delete this.c2;\r
- this.wasLeaf = true;\r
- }\r
- }\r
- var ecc = "x-tree-ec-icon "+cls;\r
- if(this.ecc != ecc){\r
- this.ecNode.className = ecc;\r
- this.ecc = ecc;\r
- }\r
- }\r
- },\r
-\r
- // private\r
- getChildIndent : function(){\r
- if(!this.childIndent){\r
- var buf = [];\r
- var p = this.node;\r
- while(p){\r
- if(!p.isRoot || (p.isRoot && p.ownerTree.rootVisible)){\r
- if(!p.isLast()) {\r
- buf.unshift('<img src="'+this.emptyIcon+'" class="x-tree-elbow-line" />');\r
- } else {\r
- buf.unshift('<img src="'+this.emptyIcon+'" class="x-tree-icon" />');\r
- }\r
- }\r
- p = p.parentNode;\r
- }\r
- this.childIndent = buf.join("");\r
- }\r
- return this.childIndent;\r
- },\r
-\r
- // private\r
- renderIndent : function(){\r
- if(this.rendered){\r
- var indent = "";\r
- var p = this.node.parentNode;\r
- if(p){\r
- indent = p.ui.getChildIndent();\r
- }\r
- if(this.indentMarkup != indent){ // don't rerender if not required\r
- this.indentNode.innerHTML = indent;\r
- this.indentMarkup = indent;\r
- }\r
- this.updateExpandIcon();\r
- }\r
- },\r
-\r
- destroy : function(){\r
- if(this.elNode){\r
- Ext.dd.Registry.unregister(this.elNode.id);\r
- }\r
- delete this.elNode;\r
- delete this.ctNode;\r
- delete this.indentNode;\r
- delete this.ecNode;\r
- delete this.iconNode;\r
- delete this.checkbox;\r
- delete this.anchor;\r
- delete this.textNode;\r
- \r
- if (this.holder){\r
- delete this.wrap;\r
- Ext.removeNode(this.holder);\r
- delete this.holder;\r
- }else{\r
- Ext.removeNode(this.wrap);\r
- delete this.wrap;\r
- }\r
- }\r
-};\r
-\r
-\r
-Ext.tree.RootTreeNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {\r
- // private\r
- render : function(){\r
- if(!this.rendered){\r
- var targetNode = this.node.ownerTree.innerCt.dom;\r
- this.node.expanded = true;\r
- targetNode.innerHTML = '<div class="x-tree-root-node"></div>';\r
- this.wrap = this.ctNode = targetNode.firstChild;\r
- }\r
- },\r
- collapse : Ext.emptyFn,\r
- expand : Ext.emptyFn\r
-});\r
-\r
-Ext.tree.TreeLoader = function(config){\r
- this.baseParams = {};\r
- Ext.apply(this, config);\r
-\r
- this.addEvents(\r
- \r
- "beforeload",\r
- \r
- "load",\r
- \r
- "loadexception"\r
- );\r
-\r
- Ext.tree.TreeLoader.superclass.constructor.call(this);\r
-};\r
-\r
-Ext.extend(Ext.tree.TreeLoader, Ext.util.Observable, {\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- uiProviders : {},\r
-\r
- \r
- clearOnLoad : true,\r
-\r
- \r
- load : function(node, callback){\r
- if(this.clearOnLoad){\r
- while(node.firstChild){\r
- node.removeChild(node.firstChild);\r
- }\r
- }\r
- if(this.doPreload(node)){ // preloaded json children\r
- if(typeof callback == "function"){\r
- callback();\r
- }\r
- }else if(this.dataUrl||this.url){\r
- this.requestData(node, callback);\r
- }\r
- },\r
-\r
- doPreload : function(node){\r
- if(node.attributes.children){\r
- if(node.childNodes.length < 1){ // preloaded?\r
- var cs = node.attributes.children;\r
- node.beginUpdate();\r
- for(var i = 0, len = cs.length; i < len; i++){\r
- var cn = node.appendChild(this.createNode(cs[i]));\r
- if(this.preloadChildren){\r
- this.doPreload(cn);\r
- }\r
- }\r
- node.endUpdate();\r
- }\r
- return true;\r
- }else {\r
- return false;\r
- }\r
- },\r
-\r
- getParams: function(node){\r
- var buf = [], bp = this.baseParams;\r
- for(var key in bp){\r
- if(typeof bp[key] != "function"){\r
- buf.push(encodeURIComponent(key), "=", encodeURIComponent(bp[key]), "&");\r
- }\r
- }\r
- buf.push("node=", encodeURIComponent(node.id));\r
- return buf.join("");\r
- },\r
-\r
- requestData : function(node, callback){\r
- if(this.fireEvent("beforeload", this, node, callback) !== false){\r
- this.transId = Ext.Ajax.request({\r
- method:this.requestMethod,\r
- url: this.dataUrl||this.url,\r
- success: this.handleResponse,\r
- failure: this.handleFailure,\r
- scope: this,\r
- argument: {callback: callback, node: node},\r
- params: this.getParams(node)\r
- });\r
- }else{\r
- // if the load is cancelled, make sure we notify\r
- // the node that we are done\r
- if(typeof callback == "function"){\r
- callback();\r
- }\r
- }\r
- },\r
-\r
- isLoading : function(){\r
- return !!this.transId;\r
- },\r
-\r
- abort : function(){\r
- if(this.isLoading()){\r
- Ext.Ajax.abort(this.transId);\r
- }\r
- },\r
-\r
- \r
- createNode : function(attr){\r
- // apply baseAttrs, nice idea Corey!\r
- if(this.baseAttrs){\r
- Ext.applyIf(attr, this.baseAttrs);\r
- }\r
- if(this.applyLoader !== false){\r
- attr.loader = this;\r
- }\r
- if(typeof attr.uiProvider == 'string'){\r
- attr.uiProvider = this.uiProviders[attr.uiProvider] || eval(attr.uiProvider);\r
- }\r
- if(attr.nodeType){\r
- return new Ext.tree.TreePanel.nodeTypes[attr.nodeType](attr);\r
- }else{\r
- return attr.leaf ?\r
- new Ext.tree.TreeNode(attr) :\r
- new Ext.tree.AsyncTreeNode(attr);\r
- }\r
- },\r
-\r
- processResponse : function(response, node, callback){\r
- var json = response.responseText;\r
- try {\r
- var o = eval("("+json+")");\r
- node.beginUpdate();\r
- for(var i = 0, len = o.length; i < len; i++){\r
- var n = this.createNode(o[i]);\r
- if(n){\r
- node.appendChild(n);\r
- }\r
- }\r
- node.endUpdate();\r
- if(typeof callback == "function"){\r
- callback(this, node);\r
- }\r
- }catch(e){\r
- this.handleFailure(response);\r
- }\r
- },\r
-\r
- handleResponse : function(response){\r
- this.transId = false;\r
- var a = response.argument;\r
- this.processResponse(response, a.node, a.callback);\r
- this.fireEvent("load", this, a.node, response);\r
- },\r
-\r
- handleFailure : function(response){\r
- this.transId = false;\r
- var a = response.argument;\r
- this.fireEvent("loadexception", this, a.node, response);\r
- if(typeof a.callback == "function"){\r
- a.callback(this, a.node);\r
- }\r
- }\r
-});\r
-\r
-Ext.tree.TreeFilter = function(tree, config){\r
- this.tree = tree;\r
- this.filtered = {};\r
- Ext.apply(this, config);\r
-};\r
-\r
-Ext.tree.TreeFilter.prototype = {\r
- clearBlank:false,\r
- reverse:false,\r
- autoClear:false,\r
- remove:false,\r
-\r
- \r
- filter : function(value, attr, startNode){\r
- attr = attr || "text";\r
- var f;\r
- if(typeof value == "string"){\r
- var vlen = value.length;\r
- // auto clear empty filter\r
- if(vlen == 0 && this.clearBlank){\r
- this.clear();\r
- return;\r
- }\r
- value = value.toLowerCase();\r
- f = function(n){\r
- return n.attributes[attr].substr(0, vlen).toLowerCase() == value;\r
- };\r
- }else if(value.exec){ // regex?\r
- f = function(n){\r
- return value.test(n.attributes[attr]);\r
- };\r
- }else{\r
- throw 'Illegal filter type, must be string or regex';\r
- }\r
- this.filterBy(f, null, startNode);\r
- },\r
- \r
- \r
- filterBy : function(fn, scope, startNode){\r
- startNode = startNode || this.tree.root;\r
- if(this.autoClear){\r
- this.clear();\r
- }\r
- var af = this.filtered, rv = this.reverse;\r
- var f = function(n){\r
- if(n == startNode){\r
- return true;\r
- }\r
- if(af[n.id]){\r
- return false;\r
- }\r
- var m = fn.call(scope || n, n);\r
- if(!m || rv){\r
- af[n.id] = n;\r
- n.ui.hide();\r
- return false;\r
- }\r
- return true;\r
- };\r
- startNode.cascade(f);\r
- if(this.remove){\r
- for(var id in af){\r
- if(typeof id != "function"){\r
- var n = af[id];\r
- if(n && n.parentNode){\r
- n.parentNode.removeChild(n);\r
- }\r
- }\r
- } \r
- }\r
- },\r
- \r
- \r
- clear : function(){\r
- var t = this.tree;\r
- var af = this.filtered;\r
- for(var id in af){\r
- if(typeof id != "function"){\r
- var n = af[id];\r
- if(n){\r
- n.ui.show();\r
- }\r
- }\r
- }\r
- this.filtered = {}; \r
- }\r
-};\r
-\r
-\r
-Ext.tree.TreeSorter = function(tree, config){\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- Ext.apply(this, config);\r
- tree.on("beforechildrenrendered", this.doSort, this);\r
- tree.on("append", this.updateSort, this);\r
- tree.on("insert", this.updateSort, this);\r
- tree.on("textchange", this.updateSortParent, this);\r
- \r
- var dsc = this.dir && this.dir.toLowerCase() == "desc";\r
- var p = this.property || "text";\r
- var sortType = this.sortType;\r
- var fs = this.folderSort;\r
- var cs = this.caseSensitive === true;\r
- var leafAttr = this.leafAttr || 'leaf';\r
-\r
- this.sortFn = function(n1, n2){\r
- if(fs){\r
- if(n1.attributes[leafAttr] && !n2.attributes[leafAttr]){\r
- return 1;\r
- }\r
- if(!n1.attributes[leafAttr] && n2.attributes[leafAttr]){\r
- return -1;\r
- }\r
- }\r
- var v1 = sortType ? sortType(n1) : (cs ? n1.attributes[p] : n1.attributes[p].toUpperCase());\r
- var v2 = sortType ? sortType(n2) : (cs ? n2.attributes[p] : n2.attributes[p].toUpperCase());\r
- if(v1 < v2){\r
- return dsc ? +1 : -1;\r
- }else if(v1 > v2){\r
- return dsc ? -1 : +1;\r
- }else{\r
- return 0;\r
- }\r
- };\r
-};\r
-\r
-Ext.tree.TreeSorter.prototype = {\r
- doSort : function(node){\r
- node.sort(this.sortFn);\r
- },\r
- \r
- compareNodes : function(n1, n2){\r
- return (n1.text.toUpperCase() > n2.text.toUpperCase() ? 1 : -1);\r
- },\r
- \r
- updateSort : function(tree, node){\r
- if(node.childrenRendered){\r
- this.doSort.defer(1, this, [node]);\r
- }\r
- },\r
- \r
- updateSortParent : function(node){\r
- var p = node.parentNode;\r
- if(p && p.childrenRendered){\r
- this.doSort.defer(1, this, [p]);\r
- }\r
- }\r
-};\r
-\r
-if(Ext.dd.DropZone){\r
- \r
-Ext.tree.TreeDropZone = function(tree, config){\r
- \r
- this.allowParentInsert = false;\r
- \r
- this.allowContainerDrop = false;\r
- \r
- this.appendOnly = false;\r
- Ext.tree.TreeDropZone.superclass.constructor.call(this, tree.innerCt, config);\r
- \r
- this.tree = tree;\r
- \r
- this.dragOverData = {};\r
- // private\r
- this.lastInsertClass = "x-tree-no-status";\r
-};\r
-\r
-Ext.extend(Ext.tree.TreeDropZone, Ext.dd.DropZone, {\r
- \r
- ddGroup : "TreeDD",\r
-\r
- \r
- expandDelay : 1000,\r
-\r
- // private\r
- expandNode : function(node){\r
- if(node.hasChildNodes() && !node.isExpanded()){\r
- node.expand(false, null, this.triggerCacheRefresh.createDelegate(this));\r
- }\r
- },\r
-\r
- // private\r
- queueExpand : function(node){\r
- this.expandProcId = this.expandNode.defer(this.expandDelay, this, [node]);\r
- },\r
-\r
- // private\r
- cancelExpand : function(){\r
- if(this.expandProcId){\r
- clearTimeout(this.expandProcId);\r
- this.expandProcId = false;\r
- }\r
- },\r
-\r
- // private\r
- isValidDropPoint : function(n, pt, dd, e, data){\r
- if(!n || !data){ return false; }\r
- var targetNode = n.node;\r
- var dropNode = data.node;\r
- // default drop rules\r
- if(!(targetNode && targetNode.isTarget && pt)){\r
- return false;\r
- }\r
- if(pt == "append" && targetNode.allowChildren === false){\r
- return false;\r
- }\r
- if((pt == "above" || pt == "below") && (targetNode.parentNode && targetNode.parentNode.allowChildren === false)){\r
- return false;\r
- }\r
- if(dropNode && (targetNode == dropNode || dropNode.contains(targetNode))){\r
- return false;\r
- }\r
- // reuse the object\r
- var overEvent = this.dragOverData;\r
- overEvent.tree = this.tree;\r
- overEvent.target = targetNode;\r
- overEvent.data = data;\r
- overEvent.point = pt;\r
- overEvent.source = dd;\r
- overEvent.rawEvent = e;\r
- overEvent.dropNode = dropNode;\r
- overEvent.cancel = false; \r
- var result = this.tree.fireEvent("nodedragover", overEvent);\r
- return overEvent.cancel === false && result !== false;\r
- },\r
-\r
- // private\r
- getDropPoint : function(e, n, dd){\r
- var tn = n.node;\r
- if(tn.isRoot){\r
- return tn.allowChildren !== false ? "append" : false; // always append for root\r
- }\r
- var dragEl = n.ddel;\r
- var t = Ext.lib.Dom.getY(dragEl), b = t + dragEl.offsetHeight;\r
- var y = Ext.lib.Event.getPageY(e);\r
- var noAppend = tn.allowChildren === false || tn.isLeaf();\r
- if(this.appendOnly || tn.parentNode.allowChildren === false){\r
- return noAppend ? false : "append";\r
- }\r
- var noBelow = false;\r
- if(!this.allowParentInsert){\r
- noBelow = tn.hasChildNodes() && tn.isExpanded();\r
- }\r
- var q = (b - t) / (noAppend ? 2 : 3);\r
- if(y >= t && y < (t + q)){\r
- return "above";\r
- }else if(!noBelow && (noAppend || y >= b-q && y <= b)){\r
- return "below";\r
- }else{\r
- return "append";\r
- }\r
- },\r
-\r
- // private\r
- onNodeEnter : function(n, dd, e, data){\r
- this.cancelExpand();\r
- },\r
-\r
- // private\r
- onNodeOver : function(n, dd, e, data){\r
- var pt = this.getDropPoint(e, n, dd);\r
- var node = n.node;\r
- \r
- // auto node expand check\r
- if(!this.expandProcId && pt == "append" && node.hasChildNodes() && !n.node.isExpanded()){\r
- this.queueExpand(node);\r
- }else if(pt != "append"){\r
- this.cancelExpand();\r
- }\r
- \r
- // set the insert point style on the target node\r
- var returnCls = this.dropNotAllowed;\r
- if(this.isValidDropPoint(n, pt, dd, e, data)){\r
- if(pt){\r
- var el = n.ddel;\r
- var cls;\r
- if(pt == "above"){\r
- returnCls = n.node.isFirst() ? "x-tree-drop-ok-above" : "x-tree-drop-ok-between";\r
- cls = "x-tree-drag-insert-above";\r
- }else if(pt == "below"){\r
- returnCls = n.node.isLast() ? "x-tree-drop-ok-below" : "x-tree-drop-ok-between";\r
- cls = "x-tree-drag-insert-below";\r
- }else{\r
- returnCls = "x-tree-drop-ok-append";\r
- cls = "x-tree-drag-append";\r
- }\r
- if(this.lastInsertClass != cls){\r
- Ext.fly(el).replaceClass(this.lastInsertClass, cls);\r
- this.lastInsertClass = cls;\r
- }\r
- }\r
- }\r
- return returnCls;\r
- },\r
-\r
- // private\r
- onNodeOut : function(n, dd, e, data){\r
- this.cancelExpand();\r
- this.removeDropIndicators(n);\r
- },\r
-\r
- // private\r
- onNodeDrop : function(n, dd, e, data){\r
- var point = this.getDropPoint(e, n, dd);\r
- var targetNode = n.node;\r
- targetNode.ui.startDrop();\r
- if(!this.isValidDropPoint(n, point, dd, e, data)){\r
- targetNode.ui.endDrop();\r
- return false;\r
- }\r
- // first try to find the drop node\r
- var dropNode = data.node || (dd.getTreeNode ? dd.getTreeNode(data, targetNode, point, e) : null);\r
- var dropEvent = {\r
- tree : this.tree,\r
- target: targetNode,\r
- data: data,\r
- point: point,\r
- source: dd,\r
- rawEvent: e,\r
- dropNode: dropNode,\r
- cancel: !dropNode,\r
- dropStatus: false\r
- };\r
- var retval = this.tree.fireEvent("beforenodedrop", dropEvent);\r
- if(retval === false || dropEvent.cancel === true || !dropEvent.dropNode){\r
- targetNode.ui.endDrop();\r
- return dropEvent.dropStatus;\r
- }\r
- // allow target changing\r
- targetNode = dropEvent.target;\r
- if(point == "append" && !targetNode.isExpanded()){\r
- targetNode.expand(false, null, function(){\r
- this.completeDrop(dropEvent);\r
- }.createDelegate(this));\r
- }else{\r
- this.completeDrop(dropEvent);\r
- }\r
- return true;\r
- },\r
-\r
- // private\r
- completeDrop : function(de){\r
- var ns = de.dropNode, p = de.point, t = de.target;\r
- if(!Ext.isArray(ns)){\r
- ns = [ns];\r
- }\r
- var n;\r
- for(var i = 0, len = ns.length; i < len; i++){\r
- n = ns[i];\r
- if(p == "above"){\r
- t.parentNode.insertBefore(n, t);\r
- }else if(p == "below"){\r
- t.parentNode.insertBefore(n, t.nextSibling);\r
- }else{\r
- t.appendChild(n);\r
- }\r
- }\r
- n.ui.focus();\r
- if(Ext.enableFx && this.tree.hlDrop){\r
- n.ui.highlight();\r
- }\r
- t.ui.endDrop();\r
- this.tree.fireEvent("nodedrop", de);\r
- },\r
-\r
- // private\r
- afterNodeMoved : function(dd, data, e, targetNode, dropNode){\r
- if(Ext.enableFx && this.tree.hlDrop){\r
- dropNode.ui.focus();\r
- dropNode.ui.highlight();\r
- }\r
- this.tree.fireEvent("nodedrop", this.tree, targetNode, data, dd, e);\r
- },\r
-\r
- // private\r
- getTree : function(){\r
- return this.tree;\r
- },\r
-\r
- // private\r
- removeDropIndicators : function(n){\r
- if(n && n.ddel){\r
- var el = n.ddel;\r
- Ext.fly(el).removeClass([\r
- "x-tree-drag-insert-above",\r
- "x-tree-drag-insert-below",\r
- "x-tree-drag-append"]);\r
- this.lastInsertClass = "_noclass";\r
- }\r
- },\r
-\r
- // private\r
- beforeDragDrop : function(target, e, id){\r
- this.cancelExpand();\r
- return true;\r
- },\r
-\r
- // private\r
- afterRepair : function(data){\r
- if(data && Ext.enableFx){\r
- data.node.ui.highlight();\r
- }\r
- this.hideProxy();\r
- } \r
-});\r
-\r
-}\r
-\r
-if(Ext.dd.DragZone){\r
-Ext.tree.TreeDragZone = function(tree, config){\r
- Ext.tree.TreeDragZone.superclass.constructor.call(this, tree.getTreeEl(), config);\r
- \r
- this.tree = tree;\r
-};\r
-\r
-Ext.extend(Ext.tree.TreeDragZone, Ext.dd.DragZone, {\r
- \r
- ddGroup : "TreeDD",\r
-\r
- // private\r
- onBeforeDrag : function(data, e){\r
- var n = data.node;\r
- return n && n.draggable && !n.disabled;\r
- },\r
-\r
- // private\r
- onInitDrag : function(e){\r
- var data = this.dragData;\r
- this.tree.getSelectionModel().select(data.node);\r
- this.tree.eventModel.disable();\r
- this.proxy.update("");\r
- data.node.ui.appendDDGhost(this.proxy.ghost.dom);\r
- this.tree.fireEvent("startdrag", this.tree, data.node, e);\r
- },\r
-\r
- // private\r
- getRepairXY : function(e, data){\r
- return data.node.ui.getDDRepairXY();\r
- },\r
-\r
- // private\r
- onEndDrag : function(data, e){\r
- this.tree.eventModel.enable.defer(100, this.tree.eventModel);\r
- this.tree.fireEvent("enddrag", this.tree, data.node, e);\r
- },\r
-\r
- // private\r
- onValidDrop : function(dd, e, id){\r
- this.tree.fireEvent("dragdrop", this.tree, this.dragData.node, dd, e);\r
- this.hideProxy();\r
- },\r
-\r
- // private\r
- beforeInvalidDrop : function(e, id){\r
- // this scrolls the original position back into view\r
- var sm = this.tree.getSelectionModel();\r
- sm.clearSelections();\r
- sm.select(this.dragData.node);\r
- },\r
- \r
- // private\r
- afterRepair : function(){\r
- if (Ext.enableFx && this.tree.hlDrop) {\r
- Ext.Element.fly(this.dragData.ddel).highlight(this.hlColor || "c3daf9");\r
- }\r
- this.dragging = false;\r
- }\r
-});\r
-}\r
-\r
-Ext.tree.TreeEditor = function(tree, fc, config){\r
- fc = fc || {};\r
- var field = fc.events ? fc : new Ext.form.TextField(fc);\r
- Ext.tree.TreeEditor.superclass.constructor.call(this, field, config);\r
-\r
- this.tree = tree;\r
-\r
- if(!tree.rendered){\r
- tree.on('render', this.initEditor, this);\r
- }else{\r
- this.initEditor(tree);\r
- }\r
-};\r
-\r
-Ext.extend(Ext.tree.TreeEditor, Ext.Editor, {\r
- \r
- alignment: "l-l",\r
- // inherit\r
- autoSize: false,\r
- \r
- hideEl : false,\r
- \r
- cls: "x-small-editor x-tree-editor",\r
- \r
- shim:false,\r
- // inherit\r
- shadow:"frame",\r
- \r
- maxWidth: 250,\r
- \r
- editDelay : 350,\r
-\r
- initEditor : function(tree){\r
- tree.on('beforeclick', this.beforeNodeClick, this);\r
- tree.on('dblclick', this.onNodeDblClick, this);\r
- this.on('complete', this.updateNode, this);\r
- this.on('beforestartedit', this.fitToTree, this);\r
- this.on('startedit', this.bindScroll, this, {delay:10});\r
- this.on('specialkey', this.onSpecialKey, this);\r
- },\r
-\r
- // private\r
- fitToTree : function(ed, el){\r
- var td = this.tree.getTreeEl().dom, nd = el.dom;\r
- if(td.scrollLeft > nd.offsetLeft){ // ensure the node left point is visible\r
- td.scrollLeft = nd.offsetLeft;\r
- }\r
- var w = Math.min(\r
- this.maxWidth,\r
- (td.clientWidth > 20 ? td.clientWidth : td.offsetWidth) - Math.max(0, nd.offsetLeft-td.scrollLeft) - 5);\r
- this.setSize(w, '');\r
- },\r
-\r
- // private\r
- triggerEdit : function(node, defer){\r
- this.completeEdit();\r
- if(node.attributes.editable !== false){\r
- \r
- this.editNode = node;\r
- if(this.tree.autoScroll){\r
- node.ui.getEl().scrollIntoView(this.tree.body);\r
- }\r
- this.autoEditTimer = this.startEdit.defer(this.editDelay, this, [node.ui.textNode, node.text]);\r
- return false;\r
- }\r
- },\r
-\r
- // private\r
- bindScroll : function(){\r
- this.tree.getTreeEl().on('scroll', this.cancelEdit, this);\r
- },\r
-\r
- // private\r
- beforeNodeClick : function(node, e){\r
- clearTimeout(this.autoEditTimer);\r
- if(this.tree.getSelectionModel().isSelected(node)){\r
- e.stopEvent();\r
- return this.triggerEdit(node);\r
- }\r
- },\r
-\r
- onNodeDblClick : function(node, e){\r
- clearTimeout(this.autoEditTimer);\r
- },\r
-\r
- // private\r
- updateNode : function(ed, value){\r
- this.tree.getTreeEl().un('scroll', this.cancelEdit, this);\r
- this.editNode.setText(value);\r
- },\r
-\r
- // private\r
- onHide : function(){\r
- Ext.tree.TreeEditor.superclass.onHide.call(this);\r
- if(this.editNode){\r
- this.editNode.ui.focus.defer(50, this.editNode.ui);\r
- }\r
- },\r
-\r
- // private\r
- onSpecialKey : function(field, e){\r
- var k = e.getKey();\r
- if(k == e.ESC){\r
- e.stopEvent();\r
- this.cancelEdit();\r
- }else if(k == e.ENTER && !e.hasModifier()){\r
- e.stopEvent();\r
- this.completeEdit();\r
- }\r
- }\r
-});\r
-\r
-Ext.menu.Menu = function(config){\r
- if(Ext.isArray(config)){\r
- config = {items:config};\r
- }\r
- Ext.apply(this, config);\r
- this.id = this.id || Ext.id();\r
- this.addEvents(\r
- \r
- 'beforeshow',\r
- \r
- 'beforehide',\r
- \r
- 'show',\r
- \r
- 'hide',\r
- \r
- 'click',\r
- \r
- 'mouseover',\r
- \r
- 'mouseout',\r
- \r
- 'itemclick'\r
- );\r
- Ext.menu.MenuMgr.register(this);\r
- Ext.menu.Menu.superclass.constructor.call(this);\r
- var mis = this.items;\r
- \r
-\r
- this.items = new Ext.util.MixedCollection();\r
- if(mis){\r
- this.add.apply(this, mis);\r
- }\r
-};\r
-\r
-Ext.extend(Ext.menu.Menu, Ext.util.Observable, {\r
- \r
- \r
- \r
- minWidth : 120,\r
- \r
- shadow : "sides",\r
- \r
- subMenuAlign : "tl-tr?",\r
- \r
- defaultAlign : "tl-bl?",\r
- \r
- allowOtherMenus : false,\r
- \r
- ignoreParentClicks : false,\r
-\r
- // private\r
- hidden:true,\r
-\r
- // private\r
- createEl : function(){\r
- return new Ext.Layer({\r
- cls: "x-menu",\r
- shadow:this.shadow,\r
- constrain: false,\r
- parentEl: this.parentEl || document.body,\r
- zindex:15000\r
- });\r
- },\r
-\r
- // private\r
- render : function(){\r
- if(this.el){\r
- return;\r
- }\r
- var el = this.el = this.createEl();\r
-\r
- if(!this.keyNav){\r
- this.keyNav = new Ext.menu.MenuNav(this);\r
- }\r
- if(this.plain){\r
- el.addClass("x-menu-plain");\r
- }\r
- if(this.cls){\r
- el.addClass(this.cls);\r
- }\r
- // generic focus element\r
- this.focusEl = el.createChild({\r
- tag: "a", cls: "x-menu-focus", href: "#", onclick: "return false;", tabIndex:"-1"\r
- });\r
- var ul = el.createChild({tag: "ul", cls: "x-menu-list"});\r
- ul.on("click", this.onClick, this);\r
- ul.on("mouseover", this.onMouseOver, this);\r
- ul.on("mouseout", this.onMouseOut, this);\r
- this.items.each(function(item){\r
- var li = document.createElement("li");\r
- li.className = "x-menu-list-item";\r
- ul.dom.appendChild(li);\r
- item.render(li, this);\r
- }, this);\r
- this.ul = ul;\r
- this.autoWidth();\r
- },\r
-\r
- // private\r
- autoWidth : function(){\r
- var el = this.el, ul = this.ul;\r
- if(!el){\r
- return;\r
- }\r
- var w = this.width;\r
- if(w){\r
- el.setWidth(w);\r
- }else if(Ext.isIE){\r
- el.setWidth(this.minWidth);\r
- var t = el.dom.offsetWidth; // force recalc\r
- el.setWidth(ul.getWidth()+el.getFrameWidth("lr"));\r
- }\r
- },\r
-\r
- // private\r
- delayAutoWidth : function(){\r
- if(this.el){\r
- if(!this.awTask){\r
- this.awTask = new Ext.util.DelayedTask(this.autoWidth, this);\r
- }\r
- this.awTask.delay(20);\r
- }\r
- },\r
-\r
- // private\r
- findTargetItem : function(e){\r
- var t = e.getTarget(".x-menu-list-item", this.ul, true);\r
- if(t && t.menuItemId){\r
- return this.items.get(t.menuItemId);\r
- }\r
- },\r
-\r
- // private\r
- onClick : function(e){\r
- var t;\r
- if(t = this.findTargetItem(e)){\r
- if(t.menu && this.ignoreParentClicks){\r
- t.expandMenu();\r
- }else{\r
- t.onClick(e);\r
- this.fireEvent("click", this, t, e);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- setActiveItem : function(item, autoExpand){\r
- if(item != this.activeItem){\r
- if(this.activeItem){\r
- this.activeItem.deactivate();\r
- }\r
- this.activeItem = item;\r
- item.activate(autoExpand);\r
- }else if(autoExpand){\r
- item.expandMenu();\r
- }\r
- },\r
-\r
- // private\r
- tryActivate : function(start, step){\r
- var items = this.items;\r
- for(var i = start, len = items.length; i >= 0 && i < len; i+= step){\r
- var item = items.get(i);\r
- if(!item.disabled && item.canActivate){\r
- this.setActiveItem(item, false);\r
- return item;\r
- }\r
- }\r
- return false;\r
- },\r
-\r
- // private\r
- onMouseOver : function(e){\r
- var t;\r
- if(t = this.findTargetItem(e)){\r
- if(t.canActivate && !t.disabled){\r
- this.setActiveItem(t, true);\r
- }\r
- }\r
- this.over = true;\r
- this.fireEvent("mouseover", this, e, t);\r
- },\r
-\r
- // private\r
- onMouseOut : function(e){\r
- var t;\r
- if(t = this.findTargetItem(e)){\r
- if(t == this.activeItem && t.shouldDeactivate(e)){\r
- this.activeItem.deactivate();\r
- delete this.activeItem;\r
- }\r
- }\r
- this.over = false;\r
- this.fireEvent("mouseout", this, e, t);\r
- },\r
-\r
- \r
- isVisible : function(){\r
- return this.el && !this.hidden;\r
- },\r
-\r
- \r
- show : function(el, pos, parentMenu){\r
- this.parentMenu = parentMenu;\r
- if(!this.el){\r
- this.render();\r
- }\r
- this.fireEvent("beforeshow", this);\r
- this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign), parentMenu, false);\r
- },\r
-\r
- \r
- showAt : function(xy, parentMenu, _e){\r
- this.parentMenu = parentMenu;\r
- if(!this.el){\r
- this.render();\r
- }\r
- if(_e !== false){\r
- this.fireEvent("beforeshow", this);\r
- xy = this.el.adjustForConstraints(xy);\r
- }\r
- this.el.setXY(xy);\r
- this.el.show();\r
- this.hidden = false;\r
- this.focus();\r
- this.fireEvent("show", this);\r
- },\r
-\r
-\r
-\r
- focus : function(){\r
- if(!this.hidden){\r
- this.doFocus.defer(50, this);\r
- }\r
- },\r
-\r
- doFocus : function(){\r
- if(!this.hidden){\r
- this.focusEl.focus();\r
- }\r
- },\r
-\r
- \r
- hide : function(deep){\r
- if(this.el && this.isVisible()){\r
- this.fireEvent("beforehide", this);\r
- if(this.activeItem){\r
- this.activeItem.deactivate();\r
- this.activeItem = null;\r
- }\r
- this.el.hide();\r
- this.hidden = true;\r
- this.fireEvent("hide", this);\r
- }\r
- if(deep === true && this.parentMenu){\r
- this.parentMenu.hide(true);\r
- }\r
- },\r
-\r
- \r
- add : function(){\r
- var a = arguments, l = a.length, item;\r
- for(var i = 0; i < l; i++){\r
- var el = a[i];\r
- if(el.render){ // some kind of Item\r
- item = this.addItem(el);\r
- }else if(typeof el == "string"){ // string\r
- if(el == "separator" || el == "-"){\r
- item = this.addSeparator();\r
- }else{\r
- item = this.addText(el);\r
- }\r
- }else if(el.tagName || el.el){ // element\r
- item = this.addElement(el);\r
- }else if(typeof el == "object"){ // must be menu item config?\r
- Ext.applyIf(el, this.defaults);\r
- item = this.addMenuItem(el);\r
- }\r
- }\r
- return item;\r
- },\r
-\r
- \r
- getEl : function(){\r
- if(!this.el){\r
- this.render();\r
- }\r
- return this.el;\r
- },\r
-\r
- \r
- addSeparator : function(){\r
- return this.addItem(new Ext.menu.Separator());\r
- },\r
-\r
- \r
- addElement : function(el){\r
- return this.addItem(new Ext.menu.BaseItem(el));\r
- },\r
-\r
- \r
- addItem : function(item){\r
- this.items.add(item);\r
- if(this.ul){\r
- var li = document.createElement("li");\r
- li.className = "x-menu-list-item";\r
- this.ul.dom.appendChild(li);\r
- item.render(li, this);\r
- this.delayAutoWidth();\r
- }\r
- return item;\r
- },\r
-\r
- \r
- addMenuItem : function(config){\r
- if(!(config instanceof Ext.menu.Item)){\r
- if(typeof config.checked == "boolean"){ // must be check menu item config?\r
- config = new Ext.menu.CheckItem(config);\r
- }else{\r
- config = new Ext.menu.Item(config);\r
- }\r
- }\r
- return this.addItem(config);\r
- },\r
-\r
- \r
- addText : function(text){\r
- return this.addItem(new Ext.menu.TextItem(text));\r
- },\r
-\r
- \r
- insert : function(index, item){\r
- this.items.insert(index, item);\r
- if(this.ul){\r
- var li = document.createElement("li");\r
- li.className = "x-menu-list-item";\r
- this.ul.dom.insertBefore(li, this.ul.dom.childNodes[index]);\r
- item.render(li, this);\r
- this.delayAutoWidth();\r
- }\r
- return item;\r
- },\r
-\r
- \r
- remove : function(item){\r
- this.items.removeKey(item.id);\r
- item.destroy();\r
- },\r
-\r
- \r
- removeAll : function(){\r
- if(this.items){\r
- var f;\r
- while(f = this.items.first()){\r
- this.remove(f);\r
- }\r
- }\r
- },\r
-\r
- \r
- destroy : function(){\r
- this.beforeDestroy();\r
- Ext.menu.MenuMgr.unregister(this);\r
- if (this.keyNav) {\r
- this.keyNav.disable();\r
- }\r
- this.removeAll();\r
- if (this.ul) {\r
- this.ul.removeAllListeners();\r
- }\r
- if (this.el) {\r
- this.el.destroy();\r
- }\r
- },\r
-\r
- // private\r
- beforeDestroy : Ext.emptyFn\r
-\r
-});\r
-\r
-// MenuNav is a private utility class used internally by the Menu\r
-Ext.menu.MenuNav = function(menu){\r
- Ext.menu.MenuNav.superclass.constructor.call(this, menu.el);\r
- this.scope = this.menu = menu;\r
-};\r
-\r
-Ext.extend(Ext.menu.MenuNav, Ext.KeyNav, {\r
- doRelay : function(e, h){\r
- var k = e.getKey();\r
- if(!this.menu.activeItem && e.isNavKeyPress() && k != e.SPACE && k != e.RETURN){\r
- this.menu.tryActivate(0, 1);\r
- return false;\r
- }\r
- return h.call(this.scope || this, e, this.menu);\r
- },\r
-\r
- up : function(e, m){\r
- if(!m.tryActivate(m.items.indexOf(m.activeItem)-1, -1)){\r
- m.tryActivate(m.items.length-1, -1);\r
- }\r
- },\r
-\r
- down : function(e, m){\r
- if(!m.tryActivate(m.items.indexOf(m.activeItem)+1, 1)){\r
- m.tryActivate(0, 1);\r
- }\r
- },\r
-\r
- right : function(e, m){\r
- if(m.activeItem){\r
- m.activeItem.expandMenu(true);\r
- }\r
- },\r
-\r
- left : function(e, m){\r
- m.hide();\r
- if(m.parentMenu && m.parentMenu.activeItem){\r
- m.parentMenu.activeItem.activate();\r
- }\r
- },\r
-\r
- enter : function(e, m){\r
- if(m.activeItem){\r
- e.stopPropagation();\r
- m.activeItem.onClick(e);\r
- m.fireEvent("click", this, m.activeItem);\r
- return true;\r
- }\r
- }\r
-});\r
-\r
-Ext.menu.MenuMgr = function(){\r
- var menus, active, groups = {}, attached = false, lastShow = new Date();\r
-\r
- // private - called when first menu is created\r
- function init(){\r
- menus = {};\r
- active = new Ext.util.MixedCollection();\r
- Ext.getDoc().addKeyListener(27, function(){\r
- if(active.length > 0){\r
- hideAll();\r
- }\r
- });\r
- }\r
-\r
- // private\r
- function hideAll(){\r
- if(active && active.length > 0){\r
- var c = active.clone();\r
- c.each(function(m){\r
- m.hide();\r
- });\r
- }\r
- }\r
-\r
- // private\r
- function onHide(m){\r
- active.remove(m);\r
- if(active.length < 1){\r
- Ext.getDoc().un("mousedown", onMouseDown);\r
- attached = false;\r
- }\r
- }\r
-\r
- // private\r
- function onShow(m){\r
- var last = active.last();\r
- lastShow = new Date();\r
- active.add(m);\r
- if(!attached){\r
- Ext.getDoc().on("mousedown", onMouseDown);\r
- attached = true;\r
- }\r
- if(m.parentMenu){\r
- m.getEl().setZIndex(parseInt(m.parentMenu.getEl().getStyle("z-index"), 10) + 3);\r
- m.parentMenu.activeChild = m;\r
- }else if(last && last.isVisible()){\r
- m.getEl().setZIndex(parseInt(last.getEl().getStyle("z-index"), 10) + 3);\r
- }\r
- }\r
-\r
- // private\r
- function onBeforeHide(m){\r
- if(m.activeChild){\r
- m.activeChild.hide();\r
- }\r
- if(m.autoHideTimer){\r
- clearTimeout(m.autoHideTimer);\r
- delete m.autoHideTimer;\r
- }\r
- }\r
-\r
- // private\r
- function onBeforeShow(m){\r
- var pm = m.parentMenu;\r
- if(!pm && !m.allowOtherMenus){\r
- hideAll();\r
- }else if(pm && pm.activeChild){\r
- pm.activeChild.hide();\r
- }\r
- }\r
-\r
- // private\r
- function onMouseDown(e){\r
- if(lastShow.getElapsed() > 50 && active.length > 0 && !e.getTarget(".x-menu")){\r
- hideAll();\r
- }\r
- }\r
-\r
- // private\r
- function onBeforeCheck(mi, state){\r
- if(state){\r
- var g = groups[mi.group];\r
- for(var i = 0, l = g.length; i < l; i++){\r
- if(g[i] != mi){\r
- g[i].setChecked(false);\r
- }\r
- }\r
- }\r
- }\r
-\r
- return {\r
-\r
- \r
- hideAll : function(){\r
- hideAll(); \r
- },\r
-\r
- // private\r
- register : function(menu){\r
- if(!menus){\r
- init();\r
- }\r
- menus[menu.id] = menu;\r
- menu.on("beforehide", onBeforeHide);\r
- menu.on("hide", onHide);\r
- menu.on("beforeshow", onBeforeShow);\r
- menu.on("show", onShow);\r
- var g = menu.group;\r
- if(g && menu.events["checkchange"]){\r
- if(!groups[g]){\r
- groups[g] = [];\r
- }\r
- groups[g].push(menu);\r
- menu.on("checkchange", onCheck);\r
- }\r
- },\r
-\r
- \r
- get : function(menu){\r
- if(typeof menu == "string"){ // menu id\r
- if(!menus){ // not initialized, no menus to return\r
- return null;\r
- }\r
- return menus[menu];\r
- }else if(menu.events){ // menu instance\r
- return menu;\r
- }else if(typeof menu.length == 'number'){ // array of menu items?\r
- return new Ext.menu.Menu({items:menu});\r
- }else{ // otherwise, must be a config\r
- return new Ext.menu.Menu(menu);\r
- }\r
- },\r
-\r
- // private\r
- unregister : function(menu){\r
- delete menus[menu.id];\r
- menu.un("beforehide", onBeforeHide);\r
- menu.un("hide", onHide);\r
- menu.un("beforeshow", onBeforeShow);\r
- menu.un("show", onShow);\r
- var g = menu.group;\r
- if(g && menu.events["checkchange"]){\r
- groups[g].remove(menu);\r
- menu.un("checkchange", onCheck);\r
- }\r
- },\r
-\r
- // private\r
- registerCheckable : function(menuItem){\r
- var g = menuItem.group;\r
- if(g){\r
- if(!groups[g]){\r
- groups[g] = [];\r
- }\r
- groups[g].push(menuItem);\r
- menuItem.on("beforecheckchange", onBeforeCheck);\r
- }\r
- },\r
-\r
- // private\r
- unregisterCheckable : function(menuItem){\r
- var g = menuItem.group;\r
- if(g){\r
- groups[g].remove(menuItem);\r
- menuItem.un("beforecheckchange", onBeforeCheck);\r
- }\r
- },\r
-\r
- getCheckedItem : function(groupId){\r
- var g = groups[groupId];\r
- if(g){\r
- for(var i = 0, l = g.length; i < l; i++){\r
- if(g[i].checked){\r
- return g[i];\r
- }\r
- }\r
- }\r
- return null;\r
- },\r
-\r
- setCheckedItem : function(groupId, itemId){\r
- var g = groups[groupId];\r
- if(g){\r
- for(var i = 0, l = g.length; i < l; i++){\r
- if(g[i].id == itemId){\r
- g[i].setChecked(true);\r
- }\r
- }\r
- }\r
- return null;\r
- }\r
- };\r
-}();\r
-\r
-\r
-Ext.menu.BaseItem = function(config){\r
- Ext.menu.BaseItem.superclass.constructor.call(this, config);\r
-\r
- this.addEvents(\r
- \r
- 'click',\r
- \r
- 'activate',\r
- \r
- 'deactivate'\r
- );\r
-\r
- if(this.handler){\r
- this.on("click", this.handler, this.scope);\r
- }\r
-};\r
-\r
-Ext.extend(Ext.menu.BaseItem, Ext.Component, {\r
- \r
- \r
- \r
- canActivate : false,\r
- \r
- activeClass : "x-menu-item-active",\r
- \r
- hideOnClick : true,\r
- \r
- hideDelay : 100,\r
-\r
- // private\r
- ctype: "Ext.menu.BaseItem",\r
-\r
- // private\r
- actionMode : "container",\r
-\r
- // private\r
- render : function(container, parentMenu){\r
- \r
- this.parentMenu = parentMenu;\r
- Ext.menu.BaseItem.superclass.render.call(this, container);\r
- this.container.menuItemId = this.id;\r
- },\r
-\r
- // private\r
- onRender : function(container, position){\r
- this.el = Ext.get(this.el);\r
- if(this.id){\r
- this.el.id = this.id;\r
- }\r
- container.dom.appendChild(this.el.dom);\r
- },\r
-\r
- \r
- setHandler : function(handler, scope){\r
- if(this.handler){\r
- this.un("click", this.handler, this.scope);\r
- }\r
- this.on("click", this.handler = handler, this.scope = scope);\r
- },\r
-\r
- // private\r
- onClick : function(e){\r
- if(!this.disabled && this.fireEvent("click", this, e) !== false\r
- && this.parentMenu.fireEvent("itemclick", this, e) !== false){\r
- this.handleClick(e);\r
- }else{\r
- e.stopEvent();\r
- }\r
- },\r
-\r
- // private\r
- activate : function(){\r
- if(this.disabled){\r
- return false;\r
- }\r
- var li = this.container;\r
- li.addClass(this.activeClass);\r
- this.region = li.getRegion().adjust(2, 2, -2, -2);\r
- this.fireEvent("activate", this);\r
- return true;\r
- },\r
-\r
- // private\r
- deactivate : function(){\r
- this.container.removeClass(this.activeClass);\r
- this.fireEvent("deactivate", this);\r
- },\r
-\r
- // private\r
- shouldDeactivate : function(e){\r
- return !this.region || !this.region.contains(e.getPoint());\r
- },\r
-\r
- // private\r
- handleClick : function(e){\r
- if(this.hideOnClick){\r
- this.parentMenu.hide.defer(this.hideDelay, this.parentMenu, [true]);\r
- }\r
- },\r
-\r
- // private\r
- expandMenu : function(autoActivate){\r
- // do nothing\r
- },\r
-\r
- // private\r
- hideMenu : function(){\r
- // do nothing\r
- }\r
-});\r
-\r
-Ext.menu.TextItem = function(cfg){\r
- if(typeof cfg == 'string'){\r
- cfg = {text: cfg}\r
- }\r
- Ext.menu.TextItem.superclass.constructor.call(this, cfg);\r
-};\r
-\r
-Ext.extend(Ext.menu.TextItem, Ext.menu.BaseItem, {\r
- \r
- \r
- hideOnClick : false,\r
- \r
- itemCls : "x-menu-text",\r
-\r
- // private\r
- onRender : function(){\r
- var s = document.createElement("span");\r
- s.className = this.itemCls;\r
- s.innerHTML = this.text;\r
- this.el = s;\r
- Ext.menu.TextItem.superclass.onRender.apply(this, arguments);\r
- }\r
-});\r
-\r
-Ext.menu.Separator = function(config){\r
- Ext.menu.Separator.superclass.constructor.call(this, config);\r
-};\r
-\r
-Ext.extend(Ext.menu.Separator, Ext.menu.BaseItem, {\r
- \r
- itemCls : "x-menu-sep",\r
- \r
- hideOnClick : false,\r
-\r
- // private\r
- onRender : function(li){\r
- var s = document.createElement("span");\r
- s.className = this.itemCls;\r
- s.innerHTML = " ";\r
- this.el = s;\r
- li.addClass("x-menu-sep-li");\r
- Ext.menu.Separator.superclass.onRender.apply(this, arguments);\r
- }\r
-});\r
-\r
-Ext.menu.Item = function(config){\r
- Ext.menu.Item.superclass.constructor.call(this, config);\r
- if(this.menu){\r
- this.menu = Ext.menu.MenuMgr.get(this.menu);\r
- }\r
-};\r
-Ext.extend(Ext.menu.Item, Ext.menu.BaseItem, {\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- itemCls : "x-menu-item",\r
- \r
- canActivate : true,\r
- \r
- showDelay: 200,\r
- // doc'd in BaseItem\r
- hideDelay: 200,\r
-\r
- // private\r
- ctype: "Ext.menu.Item",\r
-\r
- // private\r
- onRender : function(container, position){\r
- var el = document.createElement("a");\r
- el.hideFocus = true;\r
- el.unselectable = "on";\r
- el.href = this.href || "#";\r
- if(this.hrefTarget){\r
- el.target = this.hrefTarget;\r
- }\r
- el.className = this.itemCls + (this.menu ? " x-menu-item-arrow" : "") + (this.cls ? " " + this.cls : "");\r
- el.innerHTML = String.format(\r
- '<img src="{0}" class="x-menu-item-icon {2}" />{1}',\r
- this.icon || Ext.BLANK_IMAGE_URL, this.itemText||this.text, this.iconCls || '');\r
- this.el = el;\r
- Ext.menu.Item.superclass.onRender.call(this, container, position);\r
- },\r
-\r
- \r
- setText : function(text){\r
- this.text = text;\r
- if(this.rendered){\r
- this.el.update(String.format(\r
- '<img src="{0}" class="x-menu-item-icon {2}">{1}',\r
- this.icon || Ext.BLANK_IMAGE_URL, this.text, this.iconCls || ''));\r
- this.parentMenu.autoWidth();\r
- }\r
- },\r
-\r
- \r
- setIconClass : function(cls){\r
- var oldCls = this.iconCls;\r
- this.iconCls = cls;\r
- if(this.rendered){\r
- this.el.child('img.x-menu-item-icon').replaceClass(oldCls, this.iconCls);\r
- }\r
- },\r
- \r
- //private\r
- beforeDestroy: function(){\r
- if (this.menu){\r
- this.menu.destroy();\r
- }\r
- Ext.menu.Item.superclass.beforeDestroy.call(this);\r
- },\r
-\r
- // private\r
- handleClick : function(e){\r
- if(!this.href){ // if no link defined, stop the event automatically\r
- e.stopEvent();\r
- }\r
- Ext.menu.Item.superclass.handleClick.apply(this, arguments);\r
- },\r
-\r
- // private\r
- activate : function(autoExpand){\r
- if(Ext.menu.Item.superclass.activate.apply(this, arguments)){\r
- this.focus();\r
- if(autoExpand){\r
- this.expandMenu();\r
- }\r
- }\r
- return true;\r
- },\r
-\r
- // private\r
- shouldDeactivate : function(e){\r
- if(Ext.menu.Item.superclass.shouldDeactivate.call(this, e)){\r
- if(this.menu && this.menu.isVisible()){\r
- return !this.menu.getEl().getRegion().contains(e.getPoint());\r
- }\r
- return true;\r
- }\r
- return false;\r
- },\r
-\r
- // private\r
- deactivate : function(){\r
- Ext.menu.Item.superclass.deactivate.apply(this, arguments);\r
- this.hideMenu();\r
- },\r
-\r
- // private\r
- expandMenu : function(autoActivate){\r
- if(!this.disabled && this.menu){\r
- clearTimeout(this.hideTimer);\r
- delete this.hideTimer;\r
- if(!this.menu.isVisible() && !this.showTimer){\r
- this.showTimer = this.deferExpand.defer(this.showDelay, this, [autoActivate]);\r
- }else if (this.menu.isVisible() && autoActivate){\r
- this.menu.tryActivate(0, 1);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- deferExpand : function(autoActivate){\r
- delete this.showTimer;\r
- this.menu.show(this.container, this.parentMenu.subMenuAlign || "tl-tr?", this.parentMenu);\r
- if(autoActivate){\r
- this.menu.tryActivate(0, 1);\r
- }\r
- },\r
-\r
- // private\r
- hideMenu : function(){\r
- clearTimeout(this.showTimer);\r
- delete this.showTimer;\r
- if(!this.hideTimer && this.menu && this.menu.isVisible()){\r
- this.hideTimer = this.deferHide.defer(this.hideDelay, this);\r
- }\r
- },\r
-\r
- // private\r
- deferHide : function(){\r
- delete this.hideTimer;\r
- if(this.menu.over){\r
- this.parentMenu.setActiveItem(this, false);\r
- }else{\r
- this.menu.hide();\r
- }\r
- }\r
-});\r
-\r
-Ext.menu.CheckItem = function(config){\r
- Ext.menu.CheckItem.superclass.constructor.call(this, config);\r
- this.addEvents(\r
- \r
- "beforecheckchange" ,\r
- \r
- "checkchange"\r
- );\r
- \r
- if(this.checkHandler){\r
- this.on('checkchange', this.checkHandler, this.scope);\r
- }\r
- Ext.menu.MenuMgr.registerCheckable(this);\r
-};\r
-Ext.extend(Ext.menu.CheckItem, Ext.menu.Item, {\r
- \r
- \r
- itemCls : "x-menu-item x-menu-check-item",\r
- \r
- groupClass : "x-menu-group-item",\r
-\r
- \r
- checked: false,\r
-\r
- // private\r
- ctype: "Ext.menu.CheckItem",\r
-\r
- // private\r
- onRender : function(c){\r
- Ext.menu.CheckItem.superclass.onRender.apply(this, arguments);\r
- if(this.group){\r
- this.el.addClass(this.groupClass);\r
- }\r
- if(this.checked){\r
- this.checked = false;\r
- this.setChecked(true, true);\r
- }\r
- },\r
-\r
- // private\r
- destroy : function(){\r
- Ext.menu.MenuMgr.unregisterCheckable(this);\r
- Ext.menu.CheckItem.superclass.destroy.apply(this, arguments);\r
- },\r
-\r
- \r
- setChecked : function(state, suppressEvent){\r
- if(this.checked != state && this.fireEvent("beforecheckchange", this, state) !== false){\r
- if(this.container){\r
- this.container[state ? "addClass" : "removeClass"]("x-menu-item-checked");\r
- }\r
- this.checked = state;\r
- if(suppressEvent !== true){\r
- this.fireEvent("checkchange", this, state);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- handleClick : function(e){\r
- if(!this.disabled && !(this.checked && this.group)){// disable unselect on radio item\r
- this.setChecked(!this.checked);\r
- }\r
- Ext.menu.CheckItem.superclass.handleClick.apply(this, arguments);\r
- }\r
-});\r
-\r
-Ext.menu.Adapter = function(component, config){\r
- Ext.menu.Adapter.superclass.constructor.call(this, config);\r
- this.component = component;\r
-};\r
-Ext.extend(Ext.menu.Adapter, Ext.menu.BaseItem, {\r
- // private\r
- canActivate : true,\r
-\r
- // private\r
- onRender : function(container, position){\r
- this.component.render(container);\r
- this.el = this.component.getEl();\r
- },\r
-\r
- // private\r
- activate : function(){\r
- if(this.disabled){\r
- return false;\r
- }\r
- this.component.focus();\r
- this.fireEvent("activate", this);\r
- return true;\r
- },\r
-\r
- // private\r
- deactivate : function(){\r
- this.fireEvent("deactivate", this);\r
- },\r
-\r
- // private\r
- disable : function(){\r
- this.component.disable();\r
- Ext.menu.Adapter.superclass.disable.call(this);\r
- },\r
-\r
- // private\r
- enable : function(){\r
- this.component.enable();\r
- Ext.menu.Adapter.superclass.enable.call(this);\r
- }\r
-});\r
-\r
-Ext.menu.DateItem = function(config){\r
- Ext.menu.DateItem.superclass.constructor.call(this, new Ext.DatePicker(config), config);\r
- \r
- this.picker = this.component;\r
- this.addEvents('select');\r
- \r
- this.picker.on("render", function(picker){\r
- picker.getEl().swallowEvent("click");\r
- picker.container.addClass("x-menu-date-item");\r
- });\r
-\r
- this.picker.on("select", this.onSelect, this);\r
-};\r
-\r
-Ext.extend(Ext.menu.DateItem, Ext.menu.Adapter, {\r
- // private\r
- onSelect : function(picker, date){\r
- this.fireEvent("select", this, date, picker);\r
- Ext.menu.DateItem.superclass.handleClick.call(this);\r
- }\r
-});\r
-\r
-Ext.menu.ColorItem = function(config){\r
- Ext.menu.ColorItem.superclass.constructor.call(this, new Ext.ColorPalette(config), config);\r
- \r
- this.palette = this.component;\r
- this.relayEvents(this.palette, ["select"]);\r
- if(this.selectHandler){\r
- this.on('select', this.selectHandler, this.scope);\r
- }\r
-};\r
-Ext.extend(Ext.menu.ColorItem, Ext.menu.Adapter);\r
-\r
-Ext.menu.DateMenu = function(config){\r
- Ext.menu.DateMenu.superclass.constructor.call(this, config);\r
- this.plain = true;\r
- var di = new Ext.menu.DateItem(config);\r
- this.add(di);\r
- \r
- this.picker = di.picker;\r
- \r
- this.relayEvents(di, ["select"]);\r
-\r
- this.on('beforeshow', function(){\r
- if(this.picker){\r
- this.picker.hideMonthPicker(true);\r
- }\r
- }, this);\r
-};\r
-Ext.extend(Ext.menu.DateMenu, Ext.menu.Menu, {\r
- cls:'x-date-menu',\r
-\r
- // private\r
- beforeDestroy : function() {\r
- this.picker.destroy();\r
- }\r
-});\r
-\r
-Ext.menu.ColorMenu = function(config){\r
- Ext.menu.ColorMenu.superclass.constructor.call(this, config);\r
- this.plain = true;\r
- var ci = new Ext.menu.ColorItem(config);\r
- this.add(ci);\r
- \r
- this.palette = ci.palette;\r
- \r
- this.relayEvents(ci, ["select"]);\r
-};\r
-Ext.extend(Ext.menu.ColorMenu, Ext.menu.Menu, {\r
- //private\r
- beforeDestroy: function(){\r
- this.palette.destroy();\r
- }\r
-});\r
-\r
-Ext.form.Field = Ext.extend(Ext.BoxComponent, {\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
-\r
- \r
- invalidClass : "x-form-invalid",\r
- \r
- invalidText : "The value in this field is invalid",\r
- \r
- focusClass : "x-form-focus",\r
- \r
- validationEvent : "keyup",\r
- \r
- validateOnBlur : true,\r
- \r
- validationDelay : 250,\r
- \r
- defaultAutoCreate : {tag: "input", type: "text", size: "20", autocomplete: "off"},\r
- \r
- fieldClass : "x-form-field",\r
- \r
- msgTarget : 'qtip',\r
- \r
- msgFx : 'normal',\r
- \r
- readOnly : false,\r
- \r
- disabled : false,\r
-\r
- // private\r
- isFormField : true,\r
-\r
- // private\r
- hasFocus : false,\r
-\r
- // private\r
- initComponent : function(){\r
- Ext.form.Field.superclass.initComponent.call(this);\r
- this.addEvents(\r
- \r
- 'focus',\r
- \r
- 'blur',\r
- \r
- 'specialkey',\r
- \r
- 'change',\r
- \r
- 'invalid',\r
- \r
- 'valid'\r
- );\r
- },\r
-\r
- \r
- getName: function(){\r
- return this.rendered && this.el.dom.name ? this.el.dom.name : (this.hiddenName || '');\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- Ext.form.Field.superclass.onRender.call(this, ct, position);\r
- if(!this.el){\r
- var cfg = this.getAutoCreate();\r
- if(!cfg.name){\r
- cfg.name = this.name || this.id;\r
- }\r
- if(this.inputType){\r
- cfg.type = this.inputType;\r
- }\r
- this.el = ct.createChild(cfg, position);\r
- }\r
- var type = this.el.dom.type;\r
- if(type){\r
- if(type == 'password'){\r
- type = 'text';\r
- }\r
- this.el.addClass('x-form-'+type);\r
- }\r
- if(this.readOnly){\r
- this.el.dom.readOnly = true;\r
- }\r
- if(this.tabIndex !== undefined){\r
- this.el.dom.setAttribute('tabIndex', this.tabIndex);\r
- }\r
-\r
- this.el.addClass([this.fieldClass, this.cls]);\r
- },\r
-\r
- // private\r
- initValue : function(){\r
- if(this.value !== undefined){\r
- this.setValue(this.value);\r
- }else if(this.el.dom.value.length > 0 && this.el.dom.value != this.emptyText){\r
- this.setValue(this.el.dom.value);\r
- }\r
- // reference to original value for reset\r
- this.originalValue = this.getValue();\r
- },\r
-\r
- \r
- isDirty : function() {\r
- if(this.disabled) {\r
- return false;\r
- }\r
- return String(this.getValue()) !== String(this.originalValue);\r
- },\r
-\r
- // private\r
- afterRender : function(){\r
- Ext.form.Field.superclass.afterRender.call(this);\r
- this.initEvents();\r
- this.initValue();\r
- },\r
-\r
- // private\r
- fireKey : function(e){\r
- if(e.isSpecialKey()){\r
- this.fireEvent("specialkey", this, e);\r
- }\r
- },\r
-\r
- \r
- reset : function(){\r
- this.setValue(this.originalValue);\r
- this.clearInvalid();\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- this.el.on(Ext.isIE || Ext.isSafari3 ? "keydown" : "keypress", this.fireKey, this);\r
- this.el.on("focus", this.onFocus, this);\r
-\r
- // fix weird FF/Win editor issue when changing OS window focus\r
- var o = this.inEditor && Ext.isWindows && Ext.isGecko ? {buffer:10} : null;\r
- this.el.on("blur", this.onBlur, this, o);\r
- },\r
-\r
- // private\r
- onFocus : function(){\r
- if(this.focusClass){\r
- this.el.addClass(this.focusClass);\r
- }\r
- if(!this.hasFocus){\r
- this.hasFocus = true;\r
- this.startValue = this.getValue();\r
- this.fireEvent("focus", this);\r
- }\r
- },\r
-\r
- // private\r
- beforeBlur : Ext.emptyFn,\r
-\r
- // private\r
- onBlur : function(){\r
- this.beforeBlur();\r
- if(this.focusClass){\r
- this.el.removeClass(this.focusClass);\r
- }\r
- this.hasFocus = false;\r
- if(this.validationEvent !== false && this.validateOnBlur && this.validationEvent != "blur"){\r
- this.validate();\r
- }\r
- var v = this.getValue();\r
- if(String(v) !== String(this.startValue)){\r
- this.fireEvent('change', this, v, this.startValue);\r
- }\r
- this.fireEvent("blur", this);\r
- },\r
-\r
- \r
- isValid : function(preventMark){\r
- if(this.disabled){\r
- return true;\r
- }\r
- var restore = this.preventMark;\r
- this.preventMark = preventMark === true;\r
- var v = this.validateValue(this.processValue(this.getRawValue()));\r
- this.preventMark = restore;\r
- return v;\r
- },\r
-\r
- \r
- validate : function(){\r
- if(this.disabled || this.validateValue(this.processValue(this.getRawValue()))){\r
- this.clearInvalid();\r
- return true;\r
- }\r
- return false;\r
- },\r
-\r
- // protected - should be overridden by subclasses if necessary to prepare raw values for validation\r
- processValue : function(value){\r
- return value;\r
- },\r
-\r
- // private\r
- // Subclasses should provide the validation implementation by overriding this\r
- validateValue : function(value){\r
- return true;\r
- },\r
-\r
- \r
- markInvalid : function(msg){\r
- if(!this.rendered || this.preventMark){ // not rendered\r
- return;\r
- }\r
- this.el.addClass(this.invalidClass);\r
- msg = msg || this.invalidText;\r
-\r
- switch(this.msgTarget){\r
- case 'qtip':\r
- this.el.dom.qtip = msg;\r
- this.el.dom.qclass = 'x-form-invalid-tip';\r
- if(Ext.QuickTips){ // fix for floating editors interacting with DND\r
- Ext.QuickTips.enable();\r
- }\r
- break;\r
- case 'title':\r
- this.el.dom.title = msg;\r
- break;\r
- case 'under':\r
- if(!this.errorEl){\r
- var elp = this.getErrorCt();\r
- if(!elp){ // field has no container el\r
- this.el.dom.title = msg;\r
- break;\r
- }\r
- this.errorEl = elp.createChild({cls:'x-form-invalid-msg'});\r
- this.errorEl.setWidth(elp.getWidth(true)-20);\r
- }\r
- this.errorEl.update(msg);\r
- Ext.form.Field.msgFx[this.msgFx].show(this.errorEl, this);\r
- break;\r
- case 'side':\r
- if(!this.errorIcon){\r
- var elp = this.getErrorCt();\r
- if(!elp){ // field has no container el\r
- this.el.dom.title = msg;\r
- break;\r
- }\r
- this.errorIcon = elp.createChild({cls:'x-form-invalid-icon'});\r
- }\r
- this.alignErrorIcon();\r
- this.errorIcon.dom.qtip = msg;\r
- this.errorIcon.dom.qclass = 'x-form-invalid-tip';\r
- this.errorIcon.show();\r
- this.on('resize', this.alignErrorIcon, this);\r
- break;\r
- default:\r
- var t = Ext.getDom(this.msgTarget);\r
- t.innerHTML = msg;\r
- t.style.display = this.msgDisplay;\r
- break;\r
- }\r
- this.fireEvent('invalid', this, msg);\r
- },\r
-\r
- // private\r
- getErrorCt : function(){\r
- return this.el.findParent('.x-form-element', 5, true) || // use form element wrap if available\r
- this.el.findParent('.x-form-field-wrap', 5, true); // else direct field wrap\r
- },\r
-\r
- // private\r
- alignErrorIcon : function(){\r
- this.errorIcon.alignTo(this.el, 'tl-tr', [2, 0]);\r
- },\r
-\r
- \r
- clearInvalid : function(){\r
- if(!this.rendered || this.preventMark){ // not rendered\r
- return;\r
- }\r
- this.el.removeClass(this.invalidClass);\r
- switch(this.msgTarget){\r
- case 'qtip':\r
- this.el.dom.qtip = '';\r
- break;\r
- case 'title':\r
- this.el.dom.title = '';\r
- break;\r
- case 'under':\r
- if(this.errorEl){\r
- Ext.form.Field.msgFx[this.msgFx].hide(this.errorEl, this);\r
- }\r
- break;\r
- case 'side':\r
- if(this.errorIcon){\r
- this.errorIcon.dom.qtip = '';\r
- this.errorIcon.hide();\r
- this.un('resize', this.alignErrorIcon, this);\r
- }\r
- break;\r
- default:\r
- var t = Ext.getDom(this.msgTarget);\r
- t.innerHTML = '';\r
- t.style.display = 'none';\r
- break;\r
- }\r
- this.fireEvent('valid', this);\r
- },\r
-\r
- \r
- getRawValue : function(){\r
- var v = this.rendered ? this.el.getValue() : Ext.value(this.value, '');\r
- if(v === this.emptyText){\r
- v = '';\r
- }\r
- return v;\r
- },\r
-\r
- \r
- getValue : function(){\r
- if(!this.rendered) {\r
- return this.value;\r
- }\r
- var v = this.el.getValue();\r
- if(v === this.emptyText || v === undefined){\r
- v = '';\r
- }\r
- return v;\r
- },\r
-\r
- \r
- setRawValue : function(v){\r
- return this.el.dom.value = (v === null || v === undefined ? '' : v);\r
- },\r
-\r
- \r
- setValue : function(v){\r
- this.value = v;\r
- if(this.rendered){\r
- this.el.dom.value = (v === null || v === undefined ? '' : v);\r
- this.validate();\r
- }\r
- },\r
-\r
- // private\r
- adjustSize : function(w, h){\r
- var s = Ext.form.Field.superclass.adjustSize.call(this, w, h);\r
- s.width = this.adjustWidth(this.el.dom.tagName, s.width);\r
- return s;\r
- },\r
-\r
- // private\r
- adjustWidth : function(tag, w){\r
- tag = tag.toLowerCase();\r
- if(typeof w == 'number' && !Ext.isSafari){\r
- if(Ext.isIE && (tag == 'input' || tag == 'textarea')){\r
- if(tag == 'input' && !Ext.isStrict){\r
- return this.inEditor ? w : w - 3;\r
- }\r
- if(tag == 'input' && Ext.isStrict){\r
- return w - (Ext.isIE6 ? 4 : 1);\r
- }\r
- if(tag == 'textarea' && Ext.isStrict){\r
- return w-2;\r
- }\r
- }else if(Ext.isOpera && Ext.isStrict){\r
- if(tag == 'input'){\r
- return w + 2;\r
- }\r
- if(tag == 'textarea'){\r
- return w-2;\r
- }\r
- }\r
- }\r
- return w;\r
- }\r
-\r
- \r
- \r
-\r
- \r
-});\r
-\r
-Ext.form.MessageTargets = {\r
- 'qtip' : {\r
- mark: function(f){\r
- this.el.dom.qtip = msg;\r
- this.el.dom.qclass = 'x-form-invalid-tip';\r
- if(Ext.QuickTips){ // fix for floating editors interacting with DND\r
- Ext.QuickTips.enable();\r
- }\r
- },\r
- clear: function(f){\r
- this.el.dom.qtip = '';\r
- }\r
- },\r
- 'title' : {\r
- mark: function(f){\r
- this.el.dom.title = msg;\r
- },\r
- clear: function(f){\r
- this.el.dom.title = '';\r
- }\r
- },\r
- 'under' : {\r
- mark: function(f){\r
- if(!this.errorEl){\r
- var elp = this.getErrorCt();\r
- if(!elp){ // field has no container el\r
- this.el.dom.title = msg;\r
- return;\r
- }\r
- this.errorEl = elp.createChild({cls:'x-form-invalid-msg'});\r
- this.errorEl.setWidth(elp.getWidth(true)-20);\r
- }\r
- this.errorEl.update(msg);\r
- Ext.form.Field.msgFx[this.msgFx].show(this.errorEl, this);\r
- },\r
- clear: function(f){\r
- if(this.errorEl){\r
- Ext.form.Field.msgFx[this.msgFx].hide(this.errorEl, this);\r
- }else{\r
- this.el.dom.title = '';\r
- }\r
- }\r
- },\r
- 'side' : {\r
- mark: function(f){\r
- if(!this.errorIcon){\r
- var elp = this.getErrorCt();\r
- if(!elp){ // field has no container el\r
- this.el.dom.title = msg;\r
- return;\r
- }\r
- this.errorIcon = elp.createChild({cls:'x-form-invalid-icon'});\r
- }\r
- this.alignErrorIcon();\r
- this.errorIcon.dom.qtip = msg;\r
- this.errorIcon.dom.qclass = 'x-form-invalid-tip';\r
- this.errorIcon.show();\r
- this.on('resize', this.alignErrorIcon, this);\r
- },\r
- clear: function(f){\r
- if(this.errorIcon){\r
- this.errorIcon.dom.qtip = '';\r
- this.errorIcon.hide();\r
- this.un('resize', this.alignErrorIcon, this);\r
- }else{\r
- this.el.dom.title = '';\r
- }\r
- }\r
- },\r
- 'around' : {\r
- mark: function(f){\r
-\r
- },\r
- clear: function(f){\r
-\r
- }\r
- }\r
-};\r
-\r
-\r
-// anything other than normal should be considered experimental\r
-Ext.form.Field.msgFx = {\r
- normal : {\r
- show: function(msgEl, f){\r
- msgEl.setDisplayed('block');\r
- },\r
-\r
- hide : function(msgEl, f){\r
- msgEl.setDisplayed(false).update('');\r
- }\r
- },\r
-\r
- slide : {\r
- show: function(msgEl, f){\r
- msgEl.slideIn('t', {stopFx:true});\r
- },\r
-\r
- hide : function(msgEl, f){\r
- msgEl.slideOut('t', {stopFx:true,useDisplay:true});\r
- }\r
- },\r
-\r
- slideRight : {\r
- show: function(msgEl, f){\r
- msgEl.fixDisplay();\r
- msgEl.alignTo(f.el, 'tl-tr');\r
- msgEl.slideIn('l', {stopFx:true});\r
- },\r
-\r
- hide : function(msgEl, f){\r
- msgEl.slideOut('l', {stopFx:true,useDisplay:true});\r
- }\r
- }\r
-};\r
-Ext.reg('field', Ext.form.Field);\r
-\r
-\r
-Ext.form.TextField = Ext.extend(Ext.form.Field, {\r
- \r
- \r
- \r
- grow : false,\r
- \r
- growMin : 30,\r
- \r
- growMax : 800,\r
- \r
- vtype : null,\r
- \r
- maskRe : null,\r
- \r
- disableKeyFilter : false,\r
- \r
- allowBlank : true,\r
- \r
- minLength : 0,\r
- \r
- maxLength : Number.MAX_VALUE,\r
- \r
- minLengthText : "The minimum length for this field is {0}",\r
- \r
- maxLengthText : "The maximum length for this field is {0}",\r
- \r
- selectOnFocus : false,\r
- \r
- blankText : "This field is required",\r
- \r
- validator : null,\r
- \r
- regex : null,\r
- \r
- regexText : "",\r
- \r
- emptyText : null,\r
- \r
- emptyClass : 'x-form-empty-field',\r
-\r
- \r
-\r
- initComponent : function(){\r
- Ext.form.TextField.superclass.initComponent.call(this);\r
- this.addEvents(\r
- \r
- 'autosize',\r
-\r
- \r
- 'keydown',\r
- \r
- 'keyup',\r
- \r
- 'keypress'\r
- );\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- Ext.form.TextField.superclass.initEvents.call(this);\r
- if(this.validationEvent == 'keyup'){\r
- this.validationTask = new Ext.util.DelayedTask(this.validate, this);\r
- this.el.on('keyup', this.filterValidation, this);\r
- }\r
- else if(this.validationEvent !== false){\r
- this.el.on(this.validationEvent, this.validate, this, {buffer: this.validationDelay});\r
- }\r
- if(this.selectOnFocus || this.emptyText){\r
- this.on("focus", this.preFocus, this);\r
- this.el.on('mousedown', function(){\r
- if(!this.hasFocus){\r
- this.el.on('mouseup', function(e){\r
- e.preventDefault();\r
- }, this, {single:true});\r
- }\r
- }, this);\r
- if(this.emptyText){\r
- this.on('blur', this.postBlur, this);\r
- this.applyEmptyText();\r
- }\r
- }\r
- if(this.maskRe || (this.vtype && this.disableKeyFilter !== true && (this.maskRe = Ext.form.VTypes[this.vtype+'Mask']))){\r
- this.el.on("keypress", this.filterKeys, this);\r
- }\r
- if(this.grow){\r
- this.el.on("keyup", this.onKeyUpBuffered, this, {buffer:50});\r
- this.el.on("click", this.autoSize, this);\r
- }\r
-\r
- if(this.enableKeyEvents){\r
- this.el.on("keyup", this.onKeyUp, this);\r
- this.el.on("keydown", this.onKeyDown, this);\r
- this.el.on("keypress", this.onKeyPress, this);\r
- }\r
- },\r
-\r
- processValue : function(value){\r
- if(this.stripCharsRe){\r
- var newValue = value.replace(this.stripCharsRe, '');\r
- if(newValue !== value){\r
- this.setRawValue(newValue);\r
- return newValue;\r
- }\r
- }\r
- return value;\r
- },\r
-\r
- filterValidation : function(e){\r
- if(!e.isNavKeyPress()){\r
- this.validationTask.delay(this.validationDelay);\r
- }\r
- },\r
- \r
- //private\r
- onDisable: function(){\r
- Ext.form.TextField.superclass.onDisable.call(this);\r
- if(Ext.isIE){\r
- this.el.dom.unselectable = 'on';\r
- }\r
- },\r
- \r
- //private\r
- onEnable: function(){\r
- Ext.form.TextField.superclass.onEnable.call(this);\r
- if(Ext.isIE){\r
- this.el.dom.unselectable = '';\r
- }\r
- },\r
-\r
- // private\r
- onKeyUpBuffered : function(e){\r
- if(!e.isNavKeyPress()){\r
- this.autoSize();\r
- }\r
- },\r
-\r
- // private\r
- onKeyUp : function(e){\r
- this.fireEvent('keyup', this, e);\r
- },\r
-\r
- // private\r
- onKeyDown : function(e){\r
- this.fireEvent('keydown', this, e);\r
- },\r
-\r
- // private\r
- onKeyPress : function(e){\r
- this.fireEvent('keypress', this, e);\r
- },\r
-\r
- \r
- reset : function(){\r
- Ext.form.TextField.superclass.reset.call(this);\r
- this.applyEmptyText();\r
- },\r
-\r
- applyEmptyText : function(){\r
- if(this.rendered && this.emptyText && this.getRawValue().length < 1 && !this.hasFocus){\r
- this.setRawValue(this.emptyText);\r
- this.el.addClass(this.emptyClass);\r
- }\r
- },\r
-\r
- // private\r
- preFocus : function(){\r
- if(this.emptyText){\r
- if(this.el.dom.value == this.emptyText){\r
- this.setRawValue('');\r
- }\r
- this.el.removeClass(this.emptyClass);\r
- }\r
- if(this.selectOnFocus){\r
- this.el.dom.select();\r
- }\r
- },\r
-\r
- // private\r
- postBlur : function(){\r
- this.applyEmptyText();\r
- },\r
-\r
- // private\r
- filterKeys : function(e){\r
- if(e.ctrlKey){\r
- return;\r
- }\r
- var k = e.getKey();\r
- if(Ext.isGecko && (e.isNavKeyPress() || k == e.BACKSPACE || (k == e.DELETE && e.button == -1))){\r
- return;\r
- }\r
- var c = e.getCharCode(), cc = String.fromCharCode(c);\r
- if(!Ext.isGecko && e.isSpecialKey() && !cc){\r
- return;\r
- }\r
- if(!this.maskRe.test(cc)){\r
- e.stopEvent();\r
- }\r
- },\r
-\r
- setValue : function(v){\r
- if(this.emptyText && this.el && v !== undefined && v !== null && v !== ''){\r
- this.el.removeClass(this.emptyClass);\r
- }\r
- Ext.form.TextField.superclass.setValue.apply(this, arguments);\r
- this.applyEmptyText();\r
- this.autoSize();\r
- },\r
-\r
- \r
- validateValue : function(value){\r
- if(value.length < 1 || value === this.emptyText){ // if it's blank\r
- if(this.allowBlank){\r
- this.clearInvalid();\r
- return true;\r
- }else{\r
- this.markInvalid(this.blankText);\r
- return false;\r
- }\r
- }\r
- if(value.length < this.minLength){\r
- this.markInvalid(String.format(this.minLengthText, this.minLength));\r
- return false;\r
- }\r
- if(value.length > this.maxLength){\r
- this.markInvalid(String.format(this.maxLengthText, this.maxLength));\r
- return false;\r
- }\r
- if(this.vtype){\r
- var vt = Ext.form.VTypes;\r
- if(!vt[this.vtype](value, this)){\r
- this.markInvalid(this.vtypeText || vt[this.vtype +'Text']);\r
- return false;\r
- }\r
- }\r
- if(typeof this.validator == "function"){\r
- var msg = this.validator(value);\r
- if(msg !== true){\r
- this.markInvalid(msg);\r
- return false;\r
- }\r
- }\r
- if(this.regex && !this.regex.test(value)){\r
- this.markInvalid(this.regexText);\r
- return false;\r
- }\r
- return true;\r
- },\r
-\r
- \r
- selectText : function(start, end){\r
- var v = this.getRawValue();\r
- var doFocus = false;\r
- if(v.length > 0){\r
- start = start === undefined ? 0 : start;\r
- end = end === undefined ? v.length : end;\r
- var d = this.el.dom;\r
- if(d.setSelectionRange){\r
- d.setSelectionRange(start, end);\r
- }else if(d.createTextRange){\r
- var range = d.createTextRange();\r
- range.moveStart("character", start);\r
- range.moveEnd("character", end-v.length);\r
- range.select();\r
- }\r
- doFocus = Ext.isGecko || Ext.isOpera;\r
- }else{\r
- doFocus = true;\r
- }\r
- if(doFocus){\r
- this.focus();\r
- }\r
- },\r
-\r
- \r
- autoSize : function(){\r
- if(!this.grow || !this.rendered){\r
- return;\r
- }\r
- if(!this.metrics){\r
- this.metrics = Ext.util.TextMetrics.createInstance(this.el);\r
- }\r
- var el = this.el;\r
- var v = el.dom.value;\r
- var d = document.createElement('div');\r
- d.appendChild(document.createTextNode(v));\r
- v = d.innerHTML;\r
- Ext.removeNode(d);\r
- d = null;\r
- v += " ";\r
- var w = Math.min(this.growMax, Math.max(this.metrics.getWidth(v) + 10, this.growMin));\r
- this.el.setWidth(w);\r
- this.fireEvent("autosize", this, w);\r
- }\r
-});\r
-Ext.reg('textfield', Ext.form.TextField);\r
-\r
-\r
-Ext.form.TriggerField = Ext.extend(Ext.form.TextField, {\r
- \r
- \r
- defaultAutoCreate : {tag: "input", type: "text", size: "16", autocomplete: "off"},\r
- \r
- hideTrigger:false,\r
-\r
- \r
- autoSize: Ext.emptyFn,\r
- // private\r
- monitorTab : true,\r
- // private\r
- deferHeight : true,\r
- // private\r
- mimicing : false,\r
-\r
- // private\r
- onResize : function(w, h){\r
- Ext.form.TriggerField.superclass.onResize.call(this, w, h);\r
- if(typeof w == 'number'){\r
- this.el.setWidth(this.adjustWidth('input', w - this.trigger.getWidth()));\r
- }\r
- this.wrap.setWidth(this.el.getWidth()+this.trigger.getWidth());\r
- },\r
-\r
- // private\r
- adjustSize : Ext.BoxComponent.prototype.adjustSize,\r
-\r
- // private\r
- getResizeEl : function(){\r
- return this.wrap;\r
- },\r
-\r
- // private\r
- getPositionEl : function(){\r
- return this.wrap;\r
- },\r
-\r
- // private\r
- alignErrorIcon : function(){\r
- if(this.wrap){\r
- this.errorIcon.alignTo(this.wrap, 'tl-tr', [2, 0]);\r
- }\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- Ext.form.TriggerField.superclass.onRender.call(this, ct, position);\r
- this.wrap = this.el.wrap({cls: "x-form-field-wrap"});\r
- this.trigger = this.wrap.createChild(this.triggerConfig ||\r
- {tag: "img", src: Ext.BLANK_IMAGE_URL, cls: "x-form-trigger " + this.triggerClass});\r
- if(this.hideTrigger){\r
- this.trigger.setDisplayed(false);\r
- }\r
- this.initTrigger();\r
- if(!this.width){\r
- this.wrap.setWidth(this.el.getWidth()+this.trigger.getWidth());\r
- }\r
- },\r
-\r
- afterRender : function(){\r
- Ext.form.TriggerField.superclass.afterRender.call(this);\r
- var y;\r
- if(Ext.isIE && !this.hideTrigger && this.el.getY() != (y = this.trigger.getY())){\r
- this.el.position();\r
- this.el.setY(y);\r
- }\r
- },\r
-\r
- // private\r
- initTrigger : function(){\r
- this.trigger.on("click", this.onTriggerClick, this, {preventDefault:true});\r
- this.trigger.addClassOnOver('x-form-trigger-over');\r
- this.trigger.addClassOnClick('x-form-trigger-click');\r
- },\r
-\r
- // private\r
- onDestroy : function(){\r
- if(this.trigger){\r
- this.trigger.removeAllListeners();\r
- this.trigger.remove();\r
- }\r
- if(this.wrap){\r
- this.wrap.remove();\r
- }\r
- Ext.form.TriggerField.superclass.onDestroy.call(this);\r
- },\r
-\r
- // private\r
- onFocus : function(){\r
- Ext.form.TriggerField.superclass.onFocus.call(this);\r
- if(!this.mimicing){\r
- this.wrap.addClass('x-trigger-wrap-focus');\r
- this.mimicing = true;\r
- Ext.get(Ext.isIE ? document.body : document).on("mousedown", this.mimicBlur, this, {delay: 10});\r
- if(this.monitorTab){\r
- this.el.on("keydown", this.checkTab, this);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- checkTab : function(e){\r
- if(e.getKey() == e.TAB){\r
- this.triggerBlur();\r
- }\r
- },\r
-\r
- // private\r
- onBlur : function(){\r
- // do nothing\r
- },\r
-\r
- // private\r
- mimicBlur : function(e){\r
- if(!this.wrap.contains(e.target) && this.validateBlur(e)){\r
- this.triggerBlur();\r
- }\r
- },\r
-\r
- // private\r
- triggerBlur : function(){\r
- this.mimicing = false;\r
- Ext.get(Ext.isIE ? document.body : document).un("mousedown", this.mimicBlur, this);\r
- if(this.monitorTab && this.el){\r
- this.el.un("keydown", this.checkTab, this);\r
- }\r
- this.beforeBlur();\r
- if(this.wrap){\r
- this.wrap.removeClass('x-trigger-wrap-focus');\r
- }\r
- Ext.form.TriggerField.superclass.onBlur.call(this);\r
- },\r
-\r
- beforeBlur : Ext.emptyFn, \r
-\r
- // private\r
- // This should be overriden by any subclass that needs to check whether or not the field can be blurred.\r
- validateBlur : function(e){\r
- return true;\r
- },\r
-\r
- // private\r
- onDisable : function(){\r
- Ext.form.TriggerField.superclass.onDisable.call(this);\r
- if(this.wrap){\r
- this.wrap.addClass(this.disabledClass);\r
- this.el.removeClass(this.disabledClass);\r
- }\r
- },\r
-\r
- // private\r
- onEnable : function(){\r
- Ext.form.TriggerField.superclass.onEnable.call(this);\r
- if(this.wrap){\r
- this.wrap.removeClass(this.disabledClass);\r
- }\r
- },\r
-\r
- // private\r
- onShow : function(){\r
- if(this.wrap){\r
- this.wrap.dom.style.display = '';\r
- this.wrap.dom.style.visibility = 'visible';\r
- }\r
- },\r
-\r
- // private\r
- onHide : function(){\r
- this.wrap.dom.style.display = 'none';\r
- },\r
-\r
- \r
- onTriggerClick : Ext.emptyFn\r
-\r
- \r
- \r
- \r
-});\r
-\r
-// TwinTriggerField is not a public class to be used directly. It is meant as an abstract base class\r
-// to be extended by an implementing class. For an example of implementing this class, see the custom\r
-// SearchField implementation here: http://extjs.com/deploy/ext/examples/form/custom.html\r
-Ext.form.TwinTriggerField = Ext.extend(Ext.form.TriggerField, {\r
- initComponent : function(){\r
- Ext.form.TwinTriggerField.superclass.initComponent.call(this);\r
-\r
- this.triggerConfig = {\r
- tag:'span', cls:'x-form-twin-triggers', cn:[\r
- {tag: "img", src: Ext.BLANK_IMAGE_URL, cls: "x-form-trigger " + this.trigger1Class},\r
- {tag: "img", src: Ext.BLANK_IMAGE_URL, cls: "x-form-trigger " + this.trigger2Class}\r
- ]};\r
- },\r
-\r
- getTrigger : function(index){\r
- return this.triggers[index];\r
- },\r
-\r
- initTrigger : function(){\r
- var ts = this.trigger.select('.x-form-trigger', true);\r
- this.wrap.setStyle('overflow', 'hidden');\r
- var triggerField = this;\r
- ts.each(function(t, all, index){\r
- t.hide = function(){\r
- var w = triggerField.wrap.getWidth();\r
- this.dom.style.display = 'none';\r
- triggerField.el.setWidth(w-triggerField.trigger.getWidth());\r
- };\r
- t.show = function(){\r
- var w = triggerField.wrap.getWidth();\r
- this.dom.style.display = '';\r
- triggerField.el.setWidth(w-triggerField.trigger.getWidth());\r
- };\r
- var triggerIndex = 'Trigger'+(index+1);\r
-\r
- if(this['hide'+triggerIndex]){\r
- t.dom.style.display = 'none';\r
- }\r
- t.on("click", this['on'+triggerIndex+'Click'], this, {preventDefault:true});\r
- t.addClassOnOver('x-form-trigger-over');\r
- t.addClassOnClick('x-form-trigger-click');\r
- }, this);\r
- this.triggers = ts.elements;\r
- },\r
-\r
- onTrigger1Click : Ext.emptyFn,\r
- onTrigger2Click : Ext.emptyFn\r
-});\r
-Ext.reg('trigger', Ext.form.TriggerField);\r
-\r
-Ext.form.TextArea = Ext.extend(Ext.form.TextField, {\r
- \r
- growMin : 60,\r
- \r
- growMax: 1000,\r
- growAppend : ' \n ',\r
- growPad : 0,\r
-\r
- enterIsSpecial : false,\r
-\r
- \r
- preventScrollbars: false,\r
- \r
-\r
- // private\r
- onRender : function(ct, position){\r
- if(!this.el){\r
- this.defaultAutoCreate = {\r
- tag: "textarea",\r
- style:"width:100px;height:60px;",\r
- autocomplete: "off"\r
- };\r
- }\r
- Ext.form.TextArea.superclass.onRender.call(this, ct, position);\r
- if(this.grow){\r
- this.textSizeEl = Ext.DomHelper.append(document.body, {\r
- tag: "pre", cls: "x-form-grow-sizer"\r
- });\r
- if(this.preventScrollbars){\r
- this.el.setStyle("overflow", "hidden");\r
- }\r
- this.el.setHeight(this.growMin);\r
- }\r
- },\r
-\r
- onDestroy : function(){\r
- if(this.textSizeEl){\r
- Ext.removeNode(this.textSizeEl);\r
- }\r
- Ext.form.TextArea.superclass.onDestroy.call(this);\r
- },\r
-\r
- fireKey : function(e){\r
- if(e.isSpecialKey() && (this.enterIsSpecial || (e.getKey() != e.ENTER || e.hasModifier()))){\r
- this.fireEvent("specialkey", this, e);\r
- }\r
- },\r
-\r
- // private\r
- onKeyUp : function(e){\r
- if(!e.isNavKeyPress() || e.getKey() == e.ENTER){\r
- this.autoSize();\r
- }\r
- Ext.form.TextArea.superclass.onKeyUp.call(this, e);\r
- },\r
-\r
- \r
- autoSize : function(){\r
- if(!this.grow || !this.textSizeEl){\r
- return;\r
- }\r
- var el = this.el;\r
- var v = el.dom.value;\r
- var ts = this.textSizeEl;\r
- ts.innerHTML = '';\r
- ts.appendChild(document.createTextNode(v));\r
- v = ts.innerHTML;\r
-\r
- Ext.fly(ts).setWidth(this.el.getWidth());\r
- if(v.length < 1){\r
- v = "  ";\r
- }else{\r
- if(Ext.isIE){\r
- v = v.replace(/\n/g, '<p> </p>');\r
- }\r
- v += this.growAppend;\r
- }\r
- ts.innerHTML = v;\r
- var h = Math.min(this.growMax, Math.max(ts.offsetHeight, this.growMin)+this.growPad);\r
- if(h != this.lastHeight){\r
- this.lastHeight = h;\r
- this.el.setHeight(h);\r
- this.fireEvent("autosize", this, h);\r
- }\r
- }\r
-});\r
-Ext.reg('textarea', Ext.form.TextArea);\r
-\r
-Ext.form.NumberField = Ext.extend(Ext.form.TextField, {\r
- \r
- \r
- fieldClass: "x-form-field x-form-num-field",\r
- \r
- allowDecimals : true,\r
- \r
- decimalSeparator : ".",\r
- \r
- decimalPrecision : 2,\r
- \r
- allowNegative : true,\r
- \r
- minValue : Number.NEGATIVE_INFINITY,\r
- \r
- maxValue : Number.MAX_VALUE,\r
- \r
- minText : "The minimum value for this field is {0}",\r
- \r
- maxText : "The maximum value for this field is {0}",\r
- \r
- nanText : "{0} is not a valid number",\r
- \r
- baseChars : "0123456789",\r
-\r
- // private\r
- initEvents : function(){\r
- Ext.form.NumberField.superclass.initEvents.call(this);\r
- var allowed = this.baseChars+'';\r
- if(this.allowDecimals){\r
- allowed += this.decimalSeparator;\r
- }\r
- if(this.allowNegative){\r
- allowed += "-";\r
- }\r
- this.stripCharsRe = new RegExp('[^'+allowed+']', 'gi');\r
- var keyPress = function(e){\r
- var k = e.getKey();\r
- if(!Ext.isIE && (e.isSpecialKey() || k == e.BACKSPACE || k == e.DELETE)){\r
- return;\r
- }\r
- var c = e.getCharCode();\r
- if(allowed.indexOf(String.fromCharCode(c)) === -1){\r
- e.stopEvent();\r
- }\r
- };\r
- this.el.on("keypress", keyPress, this);\r
- },\r
-\r
- // private\r
- validateValue : function(value){\r
- if(!Ext.form.NumberField.superclass.validateValue.call(this, value)){\r
- return false;\r
- }\r
- if(value.length < 1){ // if it's blank and textfield didn't flag it then it's valid\r
- return true;\r
- }\r
- value = String(value).replace(this.decimalSeparator, ".");\r
- if(isNaN(value)){\r
- this.markInvalid(String.format(this.nanText, value));\r
- return false;\r
- }\r
- var num = this.parseValue(value);\r
- if(num < this.minValue){\r
- this.markInvalid(String.format(this.minText, this.minValue));\r
- return false;\r
- }\r
- if(num > this.maxValue){\r
- this.markInvalid(String.format(this.maxText, this.maxValue));\r
- return false;\r
- }\r
- return true;\r
- },\r
-\r
- getValue : function(){\r
- return this.fixPrecision(this.parseValue(Ext.form.NumberField.superclass.getValue.call(this)));\r
- },\r
-\r
- setValue : function(v){\r
- v = typeof v == 'number' ? v : parseFloat(String(v).replace(this.decimalSeparator, "."));\r
- v = isNaN(v) ? '' : String(v).replace(".", this.decimalSeparator);\r
- Ext.form.NumberField.superclass.setValue.call(this, v);\r
- },\r
-\r
- // private\r
- parseValue : function(value){\r
- value = parseFloat(String(value).replace(this.decimalSeparator, "."));\r
- return isNaN(value) ? '' : value;\r
- },\r
-\r
- // private\r
- fixPrecision : function(value){\r
- var nan = isNaN(value);\r
- if(!this.allowDecimals || this.decimalPrecision == -1 || nan || !value){\r
- return nan ? '' : value;\r
- }\r
- return parseFloat(parseFloat(value).toFixed(this.decimalPrecision));\r
- },\r
-\r
- beforeBlur : function(){\r
- var v = this.parseValue(this.getRawValue());\r
- if(v || v === 0){\r
- this.setValue(this.fixPrecision(v));\r
- }\r
- }\r
-});\r
-Ext.reg('numberfield', Ext.form.NumberField);\r
-\r
-Ext.form.DateField = Ext.extend(Ext.form.TriggerField, {\r
- \r
- format : "m/d/Y",\r
- \r
- altFormats : "m/d/Y|n/j/Y|n/j/y|m/j/y|n/d/y|m/j/Y|n/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d",\r
- \r
- disabledDaysText : "Disabled",\r
- \r
- disabledDatesText : "Disabled",\r
- \r
- minText : "The date in this field must be equal to or after {0}",\r
- \r
- maxText : "The date in this field must be equal to or before {0}",\r
- \r
- invalidText : "{0} is not a valid date - it must be in the format {1}",\r
- \r
- triggerClass : 'x-form-date-trigger',\r
- \r
- showToday : true,\r
- \r
- \r
- \r
- \r
- \r
-\r
- // private\r
- defaultAutoCreate : {tag: "input", type: "text", size: "10", autocomplete: "off"},\r
-\r
- initComponent : function(){\r
- Ext.form.DateField.superclass.initComponent.call(this);\r
- \r
- this.addEvents(\r
- \r
- 'select'\r
- );\r
- \r
- if(typeof this.minValue == "string"){\r
- this.minValue = this.parseDate(this.minValue);\r
- }\r
- if(typeof this.maxValue == "string"){\r
- this.maxValue = this.parseDate(this.maxValue);\r
- }\r
- this.disabledDatesRE = null;\r
- this.initDisabledDays();\r
- },\r
-\r
- // private\r
- initDisabledDays : function(){\r
- if(this.disabledDates){\r
- var dd = this.disabledDates;\r
- var re = "(?:";\r
- for(var i = 0; i < dd.length; i++){\r
- re += dd[i];\r
- if(i != dd.length-1) re += "|";\r
- }\r
- this.disabledDatesRE = new RegExp(re + ")");\r
- }\r
- },\r
-\r
- \r
- setDisabledDates : function(dd){\r
- this.disabledDates = dd;\r
- this.initDisabledDays();\r
- if(this.menu){\r
- this.menu.picker.setDisabledDates(this.disabledDatesRE);\r
- }\r
- },\r
-\r
- \r
- setDisabledDays : function(dd){\r
- this.disabledDays = dd;\r
- if(this.menu){\r
- this.menu.picker.setDisabledDays(dd);\r
- }\r
- },\r
-\r
- \r
- setMinValue : function(dt){\r
- this.minValue = (typeof dt == "string" ? this.parseDate(dt) : dt);\r
- if(this.menu){\r
- this.menu.picker.setMinDate(this.minValue);\r
- }\r
- },\r
-\r
- \r
- setMaxValue : function(dt){\r
- this.maxValue = (typeof dt == "string" ? this.parseDate(dt) : dt);\r
- if(this.menu){\r
- this.menu.picker.setMaxDate(this.maxValue);\r
- }\r
- },\r
-\r
- // private\r
- validateValue : function(value){\r
- value = this.formatDate(value);\r
- if(!Ext.form.DateField.superclass.validateValue.call(this, value)){\r
- return false;\r
- }\r
- if(value.length < 1){ // if it's blank and textfield didn't flag it then it's valid\r
- return true;\r
- }\r
- var svalue = value;\r
- value = this.parseDate(value);\r
- if(!value){\r
- this.markInvalid(String.format(this.invalidText, svalue, this.format));\r
- return false;\r
- }\r
- var time = value.getTime();\r
- if(this.minValue && time < this.minValue.getTime()){\r
- this.markInvalid(String.format(this.minText, this.formatDate(this.minValue)));\r
- return false;\r
- }\r
- if(this.maxValue && time > this.maxValue.getTime()){\r
- this.markInvalid(String.format(this.maxText, this.formatDate(this.maxValue)));\r
- return false;\r
- }\r
- if(this.disabledDays){\r
- var day = value.getDay();\r
- for(var i = 0; i < this.disabledDays.length; i++) {\r
- if(day === this.disabledDays[i]){\r
- this.markInvalid(this.disabledDaysText);\r
- return false;\r
- }\r
- }\r
- }\r
- var fvalue = this.formatDate(value);\r
- if(this.disabledDatesRE && this.disabledDatesRE.test(fvalue)){\r
- this.markInvalid(String.format(this.disabledDatesText, fvalue));\r
- return false;\r
- }\r
- return true;\r
- },\r
-\r
- // private\r
- // Provides logic to override the default TriggerField.validateBlur which just returns true\r
- validateBlur : function(){\r
- return !this.menu || !this.menu.isVisible();\r
- },\r
-\r
- \r
- getValue : function(){\r
- return this.parseDate(Ext.form.DateField.superclass.getValue.call(this)) || "";\r
- },\r
-\r
- \r
- setValue : function(date){\r
- Ext.form.DateField.superclass.setValue.call(this, this.formatDate(this.parseDate(date)));\r
- },\r
-\r
- // private\r
- parseDate : function(value){\r
- if(!value || Ext.isDate(value)){\r
- return value;\r
- }\r
- var v = Date.parseDate(value, this.format);\r
- if(!v && this.altFormats){\r
- if(!this.altFormatsArray){\r
- this.altFormatsArray = this.altFormats.split("|");\r
- }\r
- for(var i = 0, len = this.altFormatsArray.length; i < len && !v; i++){\r
- v = Date.parseDate(value, this.altFormatsArray[i]);\r
- }\r
- }\r
- return v;\r
- },\r
-\r
- // private\r
- onDestroy : function(){\r
- if(this.menu) {\r
- this.menu.destroy();\r
- }\r
- if(this.wrap){\r
- this.wrap.remove();\r
- }\r
- Ext.form.DateField.superclass.onDestroy.call(this);\r
- },\r
-\r
- // private\r
- formatDate : function(date){\r
- return Ext.isDate(date) ? date.dateFormat(this.format) : date;\r
- },\r
-\r
- // private\r
- menuListeners : {\r
- select: function(m, d){\r
- this.setValue(d);\r
- this.fireEvent('select', this, d);\r
- },\r
- show : function(){ // retain focus styling\r
- this.onFocus();\r
- },\r
- hide : function(){\r
- this.focus.defer(10, this);\r
- var ml = this.menuListeners;\r
- this.menu.un("select", ml.select, this);\r
- this.menu.un("show", ml.show, this);\r
- this.menu.un("hide", ml.hide, this);\r
- }\r
- },\r
-\r
- \r
- // private\r
- // Implements the default empty TriggerField.onTriggerClick function to display the DatePicker\r
- onTriggerClick : function(){\r
- if(this.disabled){\r
- return;\r
- }\r
- if(this.menu == null){\r
- this.menu = new Ext.menu.DateMenu();\r
- }\r
- Ext.apply(this.menu.picker, {\r
- minDate : this.minValue,\r
- maxDate : this.maxValue,\r
- disabledDatesRE : this.disabledDatesRE,\r
- disabledDatesText : this.disabledDatesText,\r
- disabledDays : this.disabledDays,\r
- disabledDaysText : this.disabledDaysText,\r
- format : this.format,\r
- showToday : this.showToday,\r
- minText : String.format(this.minText, this.formatDate(this.minValue)),\r
- maxText : String.format(this.maxText, this.formatDate(this.maxValue))\r
- });\r
- this.menu.on(Ext.apply({}, this.menuListeners, {\r
- scope:this\r
- }));\r
- this.menu.picker.setValue(this.getValue() || new Date());\r
- this.menu.show(this.el, "tl-bl?");\r
- },\r
-\r
- // private\r
- beforeBlur : function(){\r
- var v = this.parseDate(this.getRawValue());\r
- if(v){\r
- this.setValue(v);\r
- }\r
- }\r
-\r
- \r
- \r
- \r
- \r
-});\r
-Ext.reg('datefield', Ext.form.DateField);\r
-\r
-Ext.form.ComboBox = Ext.extend(Ext.form.TriggerField, {\r
- \r
- \r
- \r
- \r
- \r
-\r
- // private\r
- defaultAutoCreate : {tag: "input", type: "text", size: "24", autocomplete: "off"},\r
- \r
- \r
- \r
- \r
- \r
- \r
- listClass: '',\r
- \r
- selectedClass: 'x-combo-selected',\r
- \r
- triggerClass : 'x-form-arrow-trigger',\r
- \r
- shadow:'sides',\r
- \r
- listAlign: 'tl-bl?',\r
- \r
- maxHeight: 300,\r
- \r
- minHeight: 90,\r
- \r
- triggerAction: 'query',\r
- \r
- minChars : 4,\r
- \r
- typeAhead: false,\r
- \r
- queryDelay: 500,\r
- \r
- pageSize: 0,\r
- \r
- selectOnFocus:false,\r
- \r
- queryParam: 'query',\r
- \r
- loadingText: 'Loading...',\r
- \r
- resizable: false,\r
- \r
- handleHeight : 8,\r
- \r
- editable: true,\r
- \r
- allQuery: '',\r
- \r
- mode: 'remote',\r
- \r
- minListWidth : 70,\r
- \r
- forceSelection:false,\r
- \r
- typeAheadDelay : 250,\r
- \r
-\r
- \r
- lazyInit : true,\r
-\r
- \r
-\r
- // private\r
- initComponent : function(){\r
- Ext.form.ComboBox.superclass.initComponent.call(this);\r
- this.addEvents(\r
- \r
- 'expand',\r
- \r
- 'collapse',\r
- \r
- 'beforeselect',\r
- \r
- 'select',\r
- \r
- 'beforequery'\r
- );\r
- if(this.transform){\r
- this.allowDomMove = false;\r
- var s = Ext.getDom(this.transform);\r
- if(!this.hiddenName){\r
- this.hiddenName = s.name;\r
- }\r
- if(!this.store){\r
- this.mode = 'local';\r
- var d = [], opts = s.options;\r
- for(var i = 0, len = opts.length;i < len; i++){\r
- var o = opts[i];\r
- var value = (Ext.isIE ? o.getAttributeNode('value').specified : o.hasAttribute('value')) ? o.value : o.text;\r
- if(o.selected) {\r
- this.value = value;\r
- }\r
- d.push([value, o.text]);\r
- }\r
- this.store = new Ext.data.SimpleStore({\r
- 'id': 0,\r
- fields: ['value', 'text'],\r
- data : d\r
- });\r
- this.valueField = 'value';\r
- this.displayField = 'text';\r
- }\r
- s.name = Ext.id(); // wipe out the name in case somewhere else they have a reference\r
- if(!this.lazyRender){\r
- this.target = true;\r
- this.el = Ext.DomHelper.insertBefore(s, this.autoCreate || this.defaultAutoCreate);\r
- Ext.removeNode(s); // remove it\r
- this.render(this.el.parentNode);\r
- }else{\r
- Ext.removeNode(s); // remove it\r
- }\r
- }\r
- //auto-configure store from local array data\r
- else if(Ext.isArray(this.store)){\r
- if (Ext.isArray(this.store[0])){\r
- this.store = new Ext.data.SimpleStore({\r
- fields: ['value','text'],\r
- data: this.store\r
- });\r
- this.valueField = 'value';\r
- }else{\r
- this.store = new Ext.data.SimpleStore({\r
- fields: ['text'],\r
- data: this.store,\r
- expandData: true\r
- });\r
- this.valueField = 'text';\r
- }\r
- this.displayField = 'text';\r
- this.mode = 'local';\r
- }\r
-\r
- this.selectedIndex = -1;\r
- if(this.mode == 'local'){\r
- if(this.initialConfig.queryDelay === undefined){\r
- this.queryDelay = 10;\r
- }\r
- if(this.initialConfig.minChars === undefined){\r
- this.minChars = 0;\r
- }\r
- }\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- Ext.form.ComboBox.superclass.onRender.call(this, ct, position);\r
- if(this.hiddenName){\r
- this.hiddenField = this.el.insertSibling({tag:'input', type:'hidden', name: this.hiddenName,\r
- id: (this.hiddenId||this.hiddenName)}, 'before', true);\r
-\r
- // prevent input submission\r
- this.el.dom.removeAttribute('name');\r
- }\r
- if(Ext.isGecko){\r
- this.el.dom.setAttribute('autocomplete', 'off');\r
- }\r
-\r
- if(!this.lazyInit){\r
- this.initList();\r
- }else{\r
- this.on('focus', this.initList, this, {single: true});\r
- }\r
-\r
- if(!this.editable){\r
- this.editable = true;\r
- this.setEditable(false);\r
- }\r
- },\r
-\r
- // private\r
- initValue : function(){\r
- Ext.form.ComboBox.superclass.initValue.call(this);\r
- if(this.hiddenField){\r
- this.hiddenField.value =\r
- this.hiddenValue !== undefined ? this.hiddenValue :\r
- this.value !== undefined ? this.value : '';\r
- }\r
- },\r
-\r
- // private\r
- initList : function(){\r
- if(!this.list){\r
- var cls = 'x-combo-list';\r
-\r
- this.list = new Ext.Layer({\r
- shadow: this.shadow, cls: [cls, this.listClass].join(' '), constrain:false\r
- });\r
-\r
- var lw = this.listWidth || Math.max(this.wrap.getWidth(), this.minListWidth);\r
- this.list.setWidth(lw);\r
- this.list.swallowEvent('mousewheel');\r
- this.assetHeight = 0;\r
-\r
- if(this.title){\r
- this.header = this.list.createChild({cls:cls+'-hd', html: this.title});\r
- this.assetHeight += this.header.getHeight();\r
- }\r
-\r
- this.innerList = this.list.createChild({cls:cls+'-inner'});\r
- this.innerList.on('mouseover', this.onViewOver, this);\r
- this.innerList.on('mousemove', this.onViewMove, this);\r
- this.innerList.setWidth(lw - this.list.getFrameWidth('lr'));\r
-\r
- if(this.pageSize){\r
- this.footer = this.list.createChild({cls:cls+'-ft'});\r
- this.pageTb = new Ext.PagingToolbar({\r
- store:this.store,\r
- pageSize: this.pageSize,\r
- renderTo:this.footer\r
- });\r
- this.assetHeight += this.footer.getHeight();\r
- }\r
-\r
- if(!this.tpl){\r
- \r
- this.tpl = '<tpl for="."><div class="'+cls+'-item">{' + this.displayField + '}</div></tpl>';\r
- \r
- }\r
-\r
- \r
- this.view = new Ext.DataView({\r
- applyTo: this.innerList,\r
- tpl: this.tpl,\r
- singleSelect: true,\r
- selectedClass: this.selectedClass,\r
- itemSelector: this.itemSelector || '.' + cls + '-item'\r
- });\r
-\r
- this.view.on('click', this.onViewClick, this);\r
-\r
- this.bindStore(this.store, true);\r
-\r
- if(this.resizable){\r
- this.resizer = new Ext.Resizable(this.list, {\r
- pinned:true, handles:'se'\r
- });\r
- this.resizer.on('resize', function(r, w, h){\r
- this.maxHeight = h-this.handleHeight-this.list.getFrameWidth('tb')-this.assetHeight;\r
- this.listWidth = w;\r
- this.innerList.setWidth(w - this.list.getFrameWidth('lr'));\r
- this.restrictHeight();\r
- }, this);\r
- this[this.pageSize?'footer':'innerList'].setStyle('margin-bottom', this.handleHeight+'px');\r
- }\r
- }\r
- },\r
- \r
- \r
- getStore : function(){\r
- return this.store;\r
- },\r
-\r
- // private\r
- bindStore : function(store, initial){\r
- if(this.store && !initial){\r
- this.store.un('beforeload', this.onBeforeLoad, this);\r
- this.store.un('load', this.onLoad, this);\r
- this.store.un('loadexception', this.collapse, this);\r
- if(!store){\r
- this.store = null;\r
- if(this.view){\r
- this.view.setStore(null);\r
- }\r
- }\r
- }\r
- if(store){\r
- this.store = Ext.StoreMgr.lookup(store);\r
-\r
- this.store.on('beforeload', this.onBeforeLoad, this);\r
- this.store.on('load', this.onLoad, this);\r
- this.store.on('loadexception', this.collapse, this);\r
-\r
- if(this.view){\r
- this.view.setStore(store);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- Ext.form.ComboBox.superclass.initEvents.call(this);\r
-\r
- this.keyNav = new Ext.KeyNav(this.el, {\r
- "up" : function(e){\r
- this.inKeyMode = true;\r
- this.selectPrev();\r
- },\r
-\r
- "down" : function(e){\r
- if(!this.isExpanded()){\r
- this.onTriggerClick();\r
- }else{\r
- this.inKeyMode = true;\r
- this.selectNext();\r
- }\r
- },\r
-\r
- "enter" : function(e){\r
- this.onViewClick();\r
- this.delayedCheck = true;\r
- this.unsetDelayCheck.defer(10, this);\r
- },\r
-\r
- "esc" : function(e){\r
- this.collapse();\r
- },\r
-\r
- "tab" : function(e){\r
- this.onViewClick(false);\r
- return true;\r
- },\r
-\r
- scope : this,\r
-\r
- doRelay : function(foo, bar, hname){\r
- if(hname == 'down' || this.scope.isExpanded()){\r
- return Ext.KeyNav.prototype.doRelay.apply(this, arguments);\r
- }\r
- return true;\r
- },\r
-\r
- forceKeyDown : true\r
- });\r
- this.queryDelay = Math.max(this.queryDelay || 10,\r
- this.mode == 'local' ? 10 : 250);\r
- this.dqTask = new Ext.util.DelayedTask(this.initQuery, this);\r
- if(this.typeAhead){\r
- this.taTask = new Ext.util.DelayedTask(this.onTypeAhead, this);\r
- }\r
- if(this.editable !== false){\r
- this.el.on("keyup", this.onKeyUp, this);\r
- }\r
- if(this.forceSelection){\r
- this.on('blur', this.doForce, this);\r
- }\r
- },\r
-\r
- // private\r
- onDestroy : function(){\r
- if(this.view){\r
- Ext.destroy(this.view);\r
- }\r
- if(this.list){\r
- if(this.innerList){\r
- this.innerList.un('mouseover', this.onViewOver, this);\r
- this.innerList.un('mousemove', this.onViewMove, this);\r
- }\r
- this.list.destroy();\r
- }\r
- if (this.dqTask){\r
- this.dqTask.cancel();\r
- this.dqTask = null;\r
- }\r
- this.bindStore(null);\r
- Ext.form.ComboBox.superclass.onDestroy.call(this);\r
- },\r
-\r
- // private\r
- unsetDelayCheck : function(){\r
- delete this.delayedCheck;\r
- },\r
-\r
- // private\r
- fireKey : function(e){\r
- if(e.isNavKeyPress() && !this.isExpanded() && !this.delayedCheck){\r
- this.fireEvent("specialkey", this, e);\r
- }\r
- },\r
-\r
- // private\r
- onResize: function(w, h){\r
- Ext.form.ComboBox.superclass.onResize.apply(this, arguments);\r
- if(this.list && this.listWidth === undefined){\r
- var lw = Math.max(w, this.minListWidth);\r
- this.list.setWidth(lw);\r
- this.innerList.setWidth(lw - this.list.getFrameWidth('lr'));\r
- }\r
- },\r
-\r
- // private\r
- onEnable: function(){\r
- Ext.form.ComboBox.superclass.onEnable.apply(this, arguments);\r
- if(this.hiddenField){\r
- this.hiddenField.disabled = false;\r
- }\r
- },\r
-\r
- // private\r
- onDisable: function(){\r
- Ext.form.ComboBox.superclass.onDisable.apply(this, arguments);\r
- if(this.hiddenField){\r
- this.hiddenField.disabled = true;\r
- }\r
- },\r
-\r
- \r
- setEditable : function(value){\r
- if(value == this.editable){\r
- return;\r
- }\r
- this.editable = value;\r
- if(!value){\r
- this.el.dom.setAttribute('readOnly', true);\r
- this.el.on('mousedown', this.onTriggerClick, this);\r
- this.el.addClass('x-combo-noedit');\r
- }else{\r
- this.el.dom.removeAttribute('readOnly');\r
- this.el.un('mousedown', this.onTriggerClick, this);\r
- this.el.removeClass('x-combo-noedit');\r
- }\r
- },\r
-\r
- // private\r
- onBeforeLoad : function(){\r
- if(!this.hasFocus){\r
- return;\r
- }\r
- this.innerList.update(this.loadingText ?\r
- '<div class="loading-indicator">'+this.loadingText+'</div>' : '');\r
- this.restrictHeight();\r
- this.selectedIndex = -1;\r
- },\r
-\r
- // private\r
- onLoad : function(){\r
- if(!this.hasFocus){\r
- return;\r
- }\r
- if(this.store.getCount() > 0){\r
- this.expand();\r
- this.restrictHeight();\r
- if(this.lastQuery == this.allQuery){\r
- if(this.editable){\r
- this.el.dom.select();\r
- }\r
- if(!this.selectByValue(this.value, true)){\r
- this.select(0, true);\r
- }\r
- }else{\r
- this.selectNext();\r
- if(this.typeAhead && this.lastKey != Ext.EventObject.BACKSPACE && this.lastKey != Ext.EventObject.DELETE){\r
- this.taTask.delay(this.typeAheadDelay);\r
- }\r
- }\r
- }else{\r
- this.onEmptyResults();\r
- }\r
- //this.el.focus();\r
- },\r
-\r
- // private\r
- onTypeAhead : function(){\r
- if(this.store.getCount() > 0){\r
- var r = this.store.getAt(0);\r
- var newValue = r.data[this.displayField];\r
- var len = newValue.length;\r
- var selStart = this.getRawValue().length;\r
- if(selStart != len){\r
- this.setRawValue(newValue);\r
- this.selectText(selStart, newValue.length);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- onSelect : function(record, index){\r
- if(this.fireEvent('beforeselect', this, record, index) !== false){\r
- this.setValue(record.data[this.valueField || this.displayField]);\r
- this.collapse();\r
- this.fireEvent('select', this, record, index);\r
- }\r
- },\r
-\r
- \r
- getValue : function(){\r
- if(this.valueField){\r
- return typeof this.value != 'undefined' ? this.value : '';\r
- }else{\r
- return Ext.form.ComboBox.superclass.getValue.call(this);\r
- }\r
- },\r
-\r
- \r
- clearValue : function(){\r
- if(this.hiddenField){\r
- this.hiddenField.value = '';\r
- }\r
- this.setRawValue('');\r
- this.lastSelectionText = '';\r
- this.applyEmptyText();\r
- this.value = '';\r
- },\r
-\r
- \r
- setValue : function(v){\r
- var text = v;\r
- if(this.valueField){\r
- var r = this.findRecord(this.valueField, v);\r
- if(r){\r
- text = r.data[this.displayField];\r
- }else if(this.valueNotFoundText !== undefined){\r
- text = this.valueNotFoundText;\r
- }\r
- }\r
- this.lastSelectionText = text;\r
- if(this.hiddenField){\r
- this.hiddenField.value = v;\r
- }\r
- Ext.form.ComboBox.superclass.setValue.call(this, text);\r
- this.value = v;\r
- },\r
-\r
- // private\r
- findRecord : function(prop, value){\r
- var record;\r
- if(this.store.getCount() > 0){\r
- this.store.each(function(r){\r
- if(r.data[prop] == value){\r
- record = r;\r
- return false;\r
- }\r
- });\r
- }\r
- return record;\r
- },\r
-\r
- // private\r
- onViewMove : function(e, t){\r
- this.inKeyMode = false;\r
- },\r
-\r
- // private\r
- onViewOver : function(e, t){\r
- if(this.inKeyMode){ // prevent key nav and mouse over conflicts\r
- return;\r
- }\r
- var item = this.view.findItemFromChild(t);\r
- if(item){\r
- var index = this.view.indexOf(item);\r
- this.select(index, false);\r
- }\r
- },\r
-\r
- // private\r
- onViewClick : function(doFocus){\r
- var index = this.view.getSelectedIndexes()[0];\r
- var r = this.store.getAt(index);\r
- if(r){\r
- this.onSelect(r, index);\r
- }\r
- if(doFocus !== false){\r
- this.el.focus();\r
- }\r
- },\r
-\r
- // private\r
- restrictHeight : function(){\r
- this.innerList.dom.style.height = '';\r
- var inner = this.innerList.dom;\r
- var pad = this.list.getFrameWidth('tb')+(this.resizable?this.handleHeight:0)+this.assetHeight;\r
- var h = Math.max(inner.clientHeight, inner.offsetHeight, inner.scrollHeight);\r
- var ha = this.getPosition()[1]-Ext.getBody().getScroll().top;\r
- var hb = Ext.lib.Dom.getViewHeight()-ha-this.getSize().height;\r
- var space = Math.max(ha, hb, this.minHeight || 0)-this.list.shadowOffset-pad-5;\r
- h = Math.min(h, space, this.maxHeight);\r
-\r
- this.innerList.setHeight(h);\r
- this.list.beginUpdate();\r
- this.list.setHeight(h+pad);\r
- this.list.alignTo(this.wrap, this.listAlign);\r
- this.list.endUpdate();\r
- },\r
-\r
- // private\r
- onEmptyResults : function(){\r
- this.collapse();\r
- },\r
-\r
- \r
- isExpanded : function(){\r
- return this.list && this.list.isVisible();\r
- },\r
-\r
- \r
- selectByValue : function(v, scrollIntoView){\r
- if(v !== undefined && v !== null){\r
- var r = this.findRecord(this.valueField || this.displayField, v);\r
- if(r){\r
- this.select(this.store.indexOf(r), scrollIntoView);\r
- return true;\r
- }\r
- }\r
- return false;\r
- },\r
-\r
- \r
- select : function(index, scrollIntoView){\r
- this.selectedIndex = index;\r
- this.view.select(index);\r
- if(scrollIntoView !== false){\r
- var el = this.view.getNode(index);\r
- if(el){\r
- this.innerList.scrollChildIntoView(el, false);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- selectNext : function(){\r
- var ct = this.store.getCount();\r
- if(ct > 0){\r
- if(this.selectedIndex == -1){\r
- this.select(0);\r
- }else if(this.selectedIndex < ct-1){\r
- this.select(this.selectedIndex+1);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- selectPrev : function(){\r
- var ct = this.store.getCount();\r
- if(ct > 0){\r
- if(this.selectedIndex == -1){\r
- this.select(0);\r
- }else if(this.selectedIndex != 0){\r
- this.select(this.selectedIndex-1);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- onKeyUp : function(e){\r
- if(this.editable !== false && !e.isSpecialKey()){\r
- this.lastKey = e.getKey();\r
- this.dqTask.delay(this.queryDelay);\r
- }\r
- },\r
-\r
- // private\r
- validateBlur : function(){\r
- return !this.list || !this.list.isVisible();\r
- },\r
-\r
- // private\r
- initQuery : function(){\r
- this.doQuery(this.getRawValue());\r
- },\r
-\r
- // private\r
- doForce : function(){\r
- if(this.el.dom.value.length > 0){\r
- this.el.dom.value =\r
- this.lastSelectionText === undefined ? '' : this.lastSelectionText;\r
- this.applyEmptyText();\r
- }\r
- },\r
-\r
- \r
- doQuery : function(q, forceAll){\r
- if(q === undefined || q === null){\r
- q = '';\r
- }\r
- var qe = {\r
- query: q,\r
- forceAll: forceAll,\r
- combo: this,\r
- cancel:false\r
- };\r
- if(this.fireEvent('beforequery', qe)===false || qe.cancel){\r
- return false;\r
- }\r
- q = qe.query;\r
- forceAll = qe.forceAll;\r
- if(forceAll === true || (q.length >= this.minChars)){\r
- if(this.lastQuery !== q){\r
- this.lastQuery = q;\r
- if(this.mode == 'local'){\r
- this.selectedIndex = -1;\r
- if(forceAll){\r
- this.store.clearFilter();\r
- }else{\r
- this.store.filter(this.displayField, q);\r
- }\r
- this.onLoad();\r
- }else{\r
- this.store.baseParams[this.queryParam] = q;\r
- this.store.load({\r
- params: this.getParams(q)\r
- });\r
- this.expand();\r
- }\r
- }else{\r
- this.selectedIndex = -1;\r
- this.onLoad();\r
- }\r
- }\r
- },\r
-\r
- // private\r
- getParams : function(q){\r
- var p = {};\r
- //p[this.queryParam] = q;\r
- if(this.pageSize){\r
- p.start = 0;\r
- p.limit = this.pageSize;\r
- }\r
- return p;\r
- },\r
-\r
- \r
- collapse : function(){\r
- if(!this.isExpanded()){\r
- return;\r
- }\r
- this.list.hide();\r
- Ext.getDoc().un('mousewheel', this.collapseIf, this);\r
- Ext.getDoc().un('mousedown', this.collapseIf, this);\r
- this.fireEvent('collapse', this);\r
- },\r
-\r
- // private\r
- collapseIf : function(e){\r
- if(!e.within(this.wrap) && !e.within(this.list)){\r
- this.collapse();\r
- }\r
- },\r
-\r
- \r
- expand : function(){\r
- if(this.isExpanded() || !this.hasFocus){\r
- return;\r
- }\r
- this.list.alignTo(this.wrap, this.listAlign);\r
- this.list.show();\r
- this.innerList.setOverflow('auto'); // necessary for FF 2.0/Mac\r
- Ext.getDoc().on('mousewheel', this.collapseIf, this);\r
- Ext.getDoc().on('mousedown', this.collapseIf, this);\r
- this.fireEvent('expand', this);\r
- },\r
-\r
- \r
- // private\r
- // Implements the default empty TriggerField.onTriggerClick function\r
- onTriggerClick : function(){\r
- if(this.disabled){\r
- return;\r
- }\r
- if(this.isExpanded()){\r
- this.collapse();\r
- this.el.focus();\r
- }else {\r
- this.onFocus({});\r
- if(this.triggerAction == 'all') {\r
- this.doQuery(this.allQuery, true);\r
- } else {\r
- this.doQuery(this.getRawValue());\r
- }\r
- this.el.focus();\r
- }\r
- }\r
-\r
- \r
- \r
- \r
- \r
-\r
-});\r
-Ext.reg('combo', Ext.form.ComboBox);\r
-\r
-Ext.form.Checkbox = Ext.extend(Ext.form.Field, {\r
- \r
- checkedCls: 'x-form-check-checked',\r
- \r
- focusCls: 'x-form-check-focus',\r
- \r
- overCls: 'x-form-check-over',\r
- \r
- mouseDownCls: 'x-form-check-down',\r
- \r
- tabIndex: 0,\r
- \r
- checked: false,\r
- \r
- defaultAutoCreate: {tag: 'input', type: 'checkbox', autocomplete: 'off'},\r
- \r
- \r
- \r
- \r
-\r
-\r
- // private\r
- baseCls: 'x-form-check',\r
-\r
- // private\r
- initComponent : function(){\r
- Ext.form.Checkbox.superclass.initComponent.call(this);\r
- this.addEvents(\r
- \r
- 'check'\r
- );\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- Ext.form.Checkbox.superclass.initEvents.call(this);\r
- this.initCheckEvents();\r
- },\r
-\r
- // private\r
- initCheckEvents : function(){\r
- this.innerWrap.removeAllListeners();\r
- this.innerWrap.addClassOnOver(this.overCls);\r
- this.innerWrap.addClassOnClick(this.mouseDownCls);\r
- this.innerWrap.on('click', this.onClick, this);\r
- this.innerWrap.on('keyup', this.onKeyUp, this);\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- Ext.form.Checkbox.superclass.onRender.call(this, ct, position);\r
- if(this.inputValue !== undefined){\r
- this.el.dom.value = this.inputValue;\r
- }\r
- this.el.addClass('x-hidden');\r
-\r
- this.innerWrap = this.el.wrap({\r
- tabIndex: this.tabIndex,\r
- cls: this.baseCls+'-wrap-inner'\r
- });\r
- this.wrap = this.innerWrap.wrap({cls: this.baseCls+'-wrap'});\r
-\r
- if(this.boxLabel){\r
- this.labelEl = this.innerWrap.createChild({\r
- tag: 'label',\r
- htmlFor: this.el.id,\r
- cls: 'x-form-cb-label',\r
- html: this.boxLabel\r
- });\r
- }\r
-\r
- this.imageEl = this.innerWrap.createChild({\r
- tag: 'img',\r
- src: Ext.BLANK_IMAGE_URL,\r
- cls: this.baseCls\r
- }, this.el);\r
-\r
- if(this.checked){\r
- this.setValue(true);\r
- }else{\r
- this.checked = this.el.dom.checked;\r
- }\r
- this.originalValue = this.checked;\r
- },\r
- \r
- // private\r
- afterRender : function(){\r
- Ext.form.Checkbox.superclass.afterRender.call(this);\r
- this.wrap[this.checked? 'addClass' : 'removeClass'](this.checkedCls);\r
- },\r
-\r
- // private\r
- onDestroy : function(){\r
- if(this.rendered){\r
- Ext.destroy(this.imageEl, this.labelEl, this.innerWrap, this.wrap);\r
- }\r
- Ext.form.Checkbox.superclass.onDestroy.call(this);\r
- },\r
-\r
- // private\r
- onFocus: function(e) {\r
- Ext.form.Checkbox.superclass.onFocus.call(this, e);\r
- this.el.addClass(this.focusCls);\r
- },\r
-\r
- // private\r
- onBlur: function(e) {\r
- Ext.form.Checkbox.superclass.onBlur.call(this, e);\r
- this.el.removeClass(this.focusCls);\r
- },\r
-\r
- // private\r
- onResize : function(){\r
- Ext.form.Checkbox.superclass.onResize.apply(this, arguments);\r
- if(!this.boxLabel && !this.fieldLabel){\r
- this.el.alignTo(this.wrap, 'c-c');\r
- }\r
- },\r
-\r
- // private\r
- onKeyUp : function(e){\r
- if(e.getKey() == Ext.EventObject.SPACE){\r
- this.onClick(e);\r
- }\r
- },\r
-\r
- // private\r
- onClick : function(e){\r
- if (!this.disabled && !this.readOnly) {\r
- this.toggleValue();\r
- }\r
- e.stopEvent();\r
- },\r
-\r
- // private\r
- onEnable : function(){\r
- Ext.form.Checkbox.superclass.onEnable.call(this);\r
- this.initCheckEvents();\r
- },\r
-\r
- // private\r
- onDisable : function(){\r
- Ext.form.Checkbox.superclass.onDisable.call(this);\r
- this.innerWrap.removeAllListeners();\r
- },\r
-\r
- toggleValue : function(){\r
- this.setValue(!this.checked);\r
- },\r
-\r
- // private\r
- getResizeEl : function(){\r
- if(!this.resizeEl){\r
- this.resizeEl = Ext.isSafari ? this.wrap : (this.wrap.up('.x-form-element', 5) || this.wrap);\r
- }\r
- return this.resizeEl;\r
- },\r
-\r
- // private\r
- getPositionEl : function(){\r
- return this.wrap;\r
- },\r
-\r
- // private\r
- getActionEl : function(){\r
- return this.wrap;\r
- },\r
-\r
- \r
- markInvalid : Ext.emptyFn,\r
- \r
- clearInvalid : Ext.emptyFn,\r
-\r
- // private\r
- initValue : Ext.emptyFn,\r
-\r
- \r
- getValue : function(){\r
- if(this.rendered){\r
- return this.el.dom.checked;\r
- }\r
- return this.checked;\r
- },\r
-\r
- \r
- setValue : function(v) {\r
- var checked = this.checked;\r
- this.checked = (v === true || v === 'true' || v == '1' || String(v).toLowerCase() == 'on');\r
- \r
- if(this.rendered){\r
- this.el.dom.checked = this.checked;\r
- this.el.dom.defaultChecked = this.checked;\r
- this.wrap[this.checked? 'addClass' : 'removeClass'](this.checkedCls);\r
- }\r
-\r
- if(checked != this.checked){\r
- this.fireEvent("check", this, this.checked);\r
- if(this.handler){\r
- this.handler.call(this.scope || this, this, this.checked);\r
- }\r
- }\r
- }\r
-\r
- \r
- \r
- \r
-});\r
-Ext.reg('checkbox', Ext.form.Checkbox);\r
-\r
-\r
-Ext.form.CheckboxGroup = Ext.extend(Ext.form.Field, {\r
- \r
- \r
- columns : 'auto',\r
- \r
- vertical : false,\r
- \r
- allowBlank : true,\r
- \r
- blankText : "You must select at least one item in this group",\r
- \r
- // private\r
- defaultType : 'checkbox',\r
- \r
- // private\r
- groupCls: 'x-form-check-group',\r
- \r
- // private\r
- onRender : function(ct, position){\r
- if(!this.el){\r
- var panelCfg = {\r
- cls: this.groupCls,\r
- layout: 'column',\r
- border: false,\r
- renderTo: ct\r
- };\r
- var colCfg = {\r
- defaultType: this.defaultType,\r
- layout: 'form',\r
- border: false,\r
- defaults: {\r
- hideLabel: true,\r
- anchor: '100%'\r
- }\r
- }\r
- \r
- if(this.items[0].items){\r
- \r
- // The container has standard ColumnLayout configs, so pass them in directly\r
- \r
- Ext.apply(panelCfg, {\r
- layoutConfig: {columns: this.items.length},\r
- defaults: this.defaults,\r
- items: this.items\r
- })\r
- for(var i=0, len=this.items.length; i<len; i++){\r
- Ext.applyIf(this.items[i], colCfg);\r
- };\r
- \r
- }else{\r
- \r
- // The container has field item configs, so we have to generate the column\r
- // panels first then move the items into the columns as needed.\r
- \r
- var numCols, cols = [];\r
- \r
- if(typeof this.columns == 'string'){ // 'auto' so create a col per item\r
- this.columns = this.items.length;\r
- }\r
- if(!Ext.isArray(this.columns)){\r
- var cs = [];\r
- for(var i=0; i<this.columns; i++){\r
- cs.push((100/this.columns)*.01); // distribute by even %\r
- }\r
- this.columns = cs;\r
- }\r
- \r
- numCols = this.columns.length;\r
- \r
- // Generate the column configs with the correct width setting\r
- for(var i=0; i<numCols; i++){\r
- var cc = Ext.apply({items:[]}, colCfg);\r
- cc[this.columns[i] <= 1 ? 'columnWidth' : 'width'] = this.columns[i];\r
- if(this.defaults){\r
- cc.defaults = Ext.apply(cc.defaults || {}, this.defaults)\r
- }\r
- cols.push(cc);\r
- };\r
- \r
- // Distribute the original items into the columns\r
- if(this.vertical){\r
- var rows = Math.ceil(this.items.length / numCols), ri = 0;\r
- for(var i=0, len=this.items.length; i<len; i++){\r
- if(i>0 && i%rows==0){\r
- ri++;\r
- }\r
- if(this.items[i].fieldLabel){\r
- this.items[i].hideLabel = false;\r
- }\r
- cols[ri].items.push(this.items[i]);\r
- };\r
- }else{\r
- for(var i=0, len=this.items.length; i<len; i++){\r
- var ci = i % numCols;\r
- if(this.items[i].fieldLabel){\r
- this.items[i].hideLabel = false;\r
- }\r
- cols[ci].items.push(this.items[i]);\r
- };\r
- }\r
- \r
- Ext.apply(panelCfg, {\r
- layoutConfig: {columns: numCols},\r
- items: cols\r
- });\r
- }\r
- \r
- this.panel = new Ext.Panel(panelCfg);\r
- this.el = this.panel.getEl();\r
- \r
- if(this.forId && this.itemCls){\r
- var l = this.el.up(this.itemCls).child('label', true);\r
- if(l){\r
- l.setAttribute('htmlFor', this.forId);\r
- }\r
- }\r
- \r
- var fields = this.panel.findBy(function(c){\r
- return c.isFormField;\r
- }, this);\r
- \r
- this.items = new Ext.util.MixedCollection();\r
- this.items.addAll(fields);\r
- }\r
- Ext.form.CheckboxGroup.superclass.onRender.call(this, ct, position);\r
- },\r
- \r
- // private\r
- validateValue : function(value){\r
- if(!this.allowBlank){\r
- var blank = true;\r
- this.items.each(function(f){\r
- if(f.checked){\r
- return blank = false;\r
- }\r
- }, this);\r
- if(blank){\r
- this.markInvalid(this.blankText);\r
- return false;\r
- }\r
- }\r
- return true;\r
- },\r
- \r
- // private\r
- onDisable : function(){\r
- this.items.each(function(item){\r
- item.disable();\r
- })\r
- },\r
-\r
- // private\r
- onEnable : function(){\r
- this.items.each(function(item){\r
- item.enable();\r
- })\r
- },\r
- \r
- // private\r
- onResize : function(w, h){\r
- this.panel.setSize(w, h);\r
- this.panel.doLayout();\r
- },\r
- \r
- // inherit docs from Field\r
- reset : function(){\r
- Ext.form.CheckboxGroup.superclass.reset.call(this);\r
- this.items.each(function(c){\r
- if(c.reset){\r
- c.reset();\r
- }\r
- }, this);\r
- },\r
- \r
- \r
- \r
- initValue : Ext.emptyFn,\r
- \r
- getValue : Ext.emptyFn,\r
- \r
- getRawValue : Ext.emptyFn,\r
- \r
- setValue : Ext.emptyFn,\r
- \r
- setRawValue : Ext.emptyFn\r
- \r
-});\r
-\r
-Ext.reg('checkboxgroup', Ext.form.CheckboxGroup);\r
-\r
-\r
-Ext.form.Radio = Ext.extend(Ext.form.Checkbox, {\r
- // private\r
- inputType: 'radio',\r
- // private\r
- baseCls: 'x-form-radio',\r
- \r
- \r
- getGroupValue : function(){\r
- var c = this.getParent().child('input[name='+this.el.dom.name+']:checked', true);\r
- return c ? c.value : null;\r
- },\r
- \r
- // private\r
- getParent : function(){\r
- return this.el.up('form') || Ext.getBody();\r
- },\r
-\r
- // private\r
- toggleValue : function() {\r
- if(!this.checked){\r
- var els = this.getParent().select('input[name='+this.el.dom.name+']');\r
- els.each(function(el){\r
- if(el.dom.id == this.id){\r
- this.setValue(true);\r
- }else{\r
- Ext.getCmp(el.dom.id).setValue(false);\r
- }\r
- }, this);\r
- }\r
- },\r
- \r
- \r
- setValue : function(v){\r
- if(typeof v=='boolean') {\r
- Ext.form.Radio.superclass.setValue.call(this, v);\r
- }else{\r
- var r = this.getParent().child('input[name='+this.el.dom.name+'][value='+v+']', true);\r
- if(r && !r.checked){\r
- Ext.getCmp(r.id).toggleValue();\r
- };\r
- }\r
- },\r
- \r
- \r
- markInvalid : Ext.emptyFn,\r
- \r
- clearInvalid : Ext.emptyFn\r
- \r
-});\r
-Ext.reg('radio', Ext.form.Radio);\r
-\r
-\r
-Ext.form.RadioGroup = Ext.extend(Ext.form.CheckboxGroup, {\r
- \r
- allowBlank : true,\r
- \r
- blankText : "You must select one item in this group",\r
- \r
- // private\r
- defaultType : 'radio',\r
- \r
- // private\r
- groupCls: 'x-form-radio-group'\r
-});\r
-\r
-Ext.reg('radiogroup', Ext.form.RadioGroup);\r
-\r
-\r
-Ext.form.Hidden = Ext.extend(Ext.form.Field, {\r
- // private\r
- inputType : 'hidden',\r
-\r
- // private\r
- onRender : function(){\r
- Ext.form.Hidden.superclass.onRender.apply(this, arguments);\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- this.originalValue = this.getValue();\r
- },\r
-\r
- // These are all private overrides\r
- setSize : Ext.emptyFn,\r
- setWidth : Ext.emptyFn,\r
- setHeight : Ext.emptyFn,\r
- setPosition : Ext.emptyFn,\r
- setPagePosition : Ext.emptyFn,\r
- markInvalid : Ext.emptyFn,\r
- clearInvalid : Ext.emptyFn\r
-});\r
-Ext.reg('hidden', Ext.form.Hidden);\r
-\r
-Ext.form.BasicForm = function(el, config){\r
- Ext.apply(this, config);\r
- \r
- this.items = new Ext.util.MixedCollection(false, function(o){\r
- return o.id || (o.id = Ext.id());\r
- });\r
- this.addEvents(\r
- \r
- 'beforeaction',\r
- \r
- 'actionfailed',\r
- \r
- 'actioncomplete'\r
- );\r
-\r
- if(el){\r
- this.initEl(el);\r
- }\r
- Ext.form.BasicForm.superclass.constructor.call(this);\r
-};\r
-\r
-Ext.extend(Ext.form.BasicForm, Ext.util.Observable, {\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- timeout: 30,\r
-\r
- // private\r
- activeAction : null,\r
-\r
- \r
- trackResetOnLoad : false,\r
-\r
- \r
- \r
-\r
- // private\r
- initEl : function(el){\r
- this.el = Ext.get(el);\r
- this.id = this.el.id || Ext.id();\r
- if(!this.standardSubmit){\r
- this.el.on('submit', this.onSubmit, this);\r
- }\r
- this.el.addClass('x-form');\r
- },\r
-\r
- \r
- getEl: function(){\r
- return this.el;\r
- },\r
-\r
- // private\r
- onSubmit : function(e){\r
- e.stopEvent();\r
- },\r
-\r
- // private\r
- destroy: function() {\r
- this.items.each(function(f){\r
- Ext.destroy(f);\r
- });\r
- if(this.el){\r
- this.el.removeAllListeners();\r
- this.el.remove();\r
- }\r
- this.purgeListeners();\r
- },\r
-\r
- \r
- isValid : function(){\r
- var valid = true;\r
- this.items.each(function(f){\r
- if(!f.validate()){\r
- valid = false;\r
- }\r
- });\r
- return valid;\r
- },\r
-\r
- \r
- isDirty : function(){\r
- var dirty = false;\r
- this.items.each(function(f){\r
- if(f.isDirty()){\r
- dirty = true;\r
- return false;\r
- }\r
- });\r
- return dirty;\r
- },\r
-\r
- \r
- doAction : function(action, options){\r
- if(typeof action == 'string'){\r
- action = new Ext.form.Action.ACTION_TYPES[action](this, options);\r
- }\r
- if(this.fireEvent('beforeaction', this, action) !== false){\r
- this.beforeAction(action);\r
- action.run.defer(100, action);\r
- }\r
- return this;\r
- },\r
-\r
- \r
- submit : function(options){\r
- if(this.standardSubmit){\r
- var v = this.isValid();\r
- if(v){\r
- this.el.dom.submit();\r
- }\r
- return v;\r
- }\r
- this.doAction('submit', options);\r
- return this;\r
- },\r
-\r
- \r
- load : function(options){\r
- this.doAction('load', options);\r
- return this;\r
- },\r
-\r
- \r
- updateRecord : function(record){\r
- record.beginEdit();\r
- var fs = record.fields;\r
- fs.each(function(f){\r
- var field = this.findField(f.name);\r
- if(field){\r
- record.set(f.name, field.getValue());\r
- }\r
- }, this);\r
- record.endEdit();\r
- return this;\r
- },\r
-\r
- \r
- loadRecord : function(record){\r
- this.setValues(record.data);\r
- return this;\r
- },\r
-\r
- // private\r
- beforeAction : function(action){\r
- var o = action.options;\r
- if(o.waitMsg){\r
- if(this.waitMsgTarget === true){\r
- this.el.mask(o.waitMsg, 'x-mask-loading');\r
- }else if(this.waitMsgTarget){\r
- this.waitMsgTarget = Ext.get(this.waitMsgTarget);\r
- this.waitMsgTarget.mask(o.waitMsg, 'x-mask-loading');\r
- }else{\r
- Ext.MessageBox.wait(o.waitMsg, o.waitTitle || this.waitTitle || 'Please Wait...');\r
- }\r
- }\r
- },\r
-\r
- // private\r
- afterAction : function(action, success){\r
- this.activeAction = null;\r
- var o = action.options;\r
- if(o.waitMsg){\r
- if(this.waitMsgTarget === true){\r
- this.el.unmask();\r
- }else if(this.waitMsgTarget){\r
- this.waitMsgTarget.unmask();\r
- }else{\r
- Ext.MessageBox.updateProgress(1);\r
- Ext.MessageBox.hide();\r
- }\r
- }\r
- if(success){\r
- if(o.reset){\r
- this.reset();\r
- }\r
- Ext.callback(o.success, o.scope, [this, action]);\r
- this.fireEvent('actioncomplete', this, action);\r
- }else{\r
- Ext.callback(o.failure, o.scope, [this, action]);\r
- this.fireEvent('actionfailed', this, action);\r
- }\r
- },\r
-\r
- \r
- findField : function(id){\r
- var field = this.items.get(id);\r
- if(!field){\r
- this.items.each(function(f){\r
- if(f.isFormField && (f.dataIndex == id || f.id == id || f.getName() == id)){\r
- field = f;\r
- return false;\r
- }\r
- });\r
- }\r
- return field || null;\r
- },\r
-\r
-\r
- \r
- markInvalid : function(errors){\r
- if(Ext.isArray(errors)){\r
- for(var i = 0, len = errors.length; i < len; i++){\r
- var fieldError = errors[i];\r
- var f = this.findField(fieldError.id);\r
- if(f){\r
- f.markInvalid(fieldError.msg);\r
- }\r
- }\r
- }else{\r
- var field, id;\r
- for(id in errors){\r
- if(typeof errors[id] != 'function' && (field = this.findField(id))){\r
- field.markInvalid(errors[id]);\r
- }\r
- }\r
- }\r
- return this;\r
- },\r
-\r
- \r
- setValues : function(values){\r
- if(Ext.isArray(values)){ // array of objects\r
- for(var i = 0, len = values.length; i < len; i++){\r
- var v = values[i];\r
- var f = this.findField(v.id);\r
- if(f){\r
- f.setValue(v.value);\r
- if(this.trackResetOnLoad){\r
- f.originalValue = f.getValue();\r
- }\r
- }\r
- }\r
- }else{ // object hash\r
- var field, id;\r
- for(id in values){\r
- if(typeof values[id] != 'function' && (field = this.findField(id))){\r
- field.setValue(values[id]);\r
- if(this.trackResetOnLoad){\r
- field.originalValue = field.getValue();\r
- }\r
- }\r
- }\r
- }\r
- return this;\r
- },\r
-\r
- \r
- getValues : function(asString){\r
- var fs = Ext.lib.Ajax.serializeForm(this.el.dom);\r
- if(asString === true){\r
- return fs;\r
- }\r
- return Ext.urlDecode(fs);\r
- },\r
-\r
- \r
- clearInvalid : function(){\r
- this.items.each(function(f){\r
- f.clearInvalid();\r
- });\r
- return this;\r
- },\r
-\r
- \r
- reset : function(){\r
- this.items.each(function(f){\r
- f.reset();\r
- });\r
- return this;\r
- },\r
-\r
- \r
- add : function(){\r
- this.items.addAll(Array.prototype.slice.call(arguments, 0));\r
- return this;\r
- },\r
-\r
-\r
- \r
- remove : function(field){\r
- this.items.remove(field);\r
- return this;\r
- },\r
-\r
- \r
- render : function(){\r
- this.items.each(function(f){\r
- if(f.isFormField && !f.rendered && document.getElementById(f.id)){ // if the element exists\r
- f.applyToMarkup(f.id);\r
- }\r
- });\r
- return this;\r
- },\r
-\r
- \r
- applyToFields : function(o){\r
- this.items.each(function(f){\r
- Ext.apply(f, o);\r
- });\r
- return this;\r
- },\r
-\r
- \r
- applyIfToFields : function(o){\r
- this.items.each(function(f){\r
- Ext.applyIf(f, o);\r
- });\r
- return this;\r
- }\r
-});\r
-\r
-// back compat\r
-Ext.BasicForm = Ext.form.BasicForm;\r
-\r
-Ext.FormPanel = Ext.extend(Ext.Panel, {\r
- \r
- \r
- \r
- \r
- \r
- buttonAlign:'center',\r
-\r
- \r
- minButtonWidth:75,\r
-\r
- \r
- labelAlign:'left',\r
-\r
- \r
- monitorValid : false,\r
-\r
- \r
- monitorPoll : 200,\r
-\r
- \r
- layout: 'form',\r
-\r
- // private\r
- initComponent :function(){\r
- this.form = this.createForm();\r
-\r
- this.bodyCfg = {\r
- tag: 'form',\r
- cls: this.baseCls + '-body',\r
- method : this.method || 'POST',\r
- id : this.formId || Ext.id()\r
- };\r
- if(this.fileUpload) {\r
- this.bodyCfg.enctype = 'multipart/form-data';\r
- }\r
-\r
- Ext.FormPanel.superclass.initComponent.call(this);\r
-\r
- this.initItems();\r
-\r
- this.addEvents(\r
- \r
- 'clientvalidation'\r
- );\r
-\r
- this.relayEvents(this.form, ['beforeaction', 'actionfailed', 'actioncomplete']);\r
- },\r
-\r
- // private\r
- createForm: function(){\r
- delete this.initialConfig.listeners;\r
- return new Ext.form.BasicForm(null, this.initialConfig);\r
- },\r
-\r
- // private\r
- initFields : function(){\r
- var f = this.form;\r
- var formPanel = this;\r
- var fn = function(c){\r
- if(c.isFormField){\r
- f.add(c);\r
- }else if(c.doLayout && c != formPanel){\r
- Ext.applyIf(c, {\r
- labelAlign: c.ownerCt.labelAlign,\r
- labelWidth: c.ownerCt.labelWidth,\r
- itemCls: c.ownerCt.itemCls\r
- });\r
- if(c.items){\r
- c.items.each(fn);\r
- }\r
- }\r
- }\r
- this.items.each(fn);\r
- },\r
-\r
- // private\r
- getLayoutTarget : function(){\r
- return this.form.el;\r
- },\r
-\r
- \r
- getForm : function(){\r
- return this.form;\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- this.initFields();\r
-\r
- Ext.FormPanel.superclass.onRender.call(this, ct, position);\r
- this.form.initEl(this.body);\r
- },\r
- \r
- // private\r
- beforeDestroy: function(){\r
- Ext.FormPanel.superclass.beforeDestroy.call(this);\r
- this.stopMonitoring();\r
- Ext.destroy(this.form);\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- Ext.FormPanel.superclass.initEvents.call(this);\r
- this.items.on('remove', this.onRemove, this);\r
- this.items.on('add', this.onAdd, this);\r
- if(this.monitorValid){ // initialize after render\r
- this.startMonitoring();\r
- }\r
- },\r
- \r
- // private\r
- onAdd : function(ct, c) {\r
- if (c.isFormField) {\r
- this.form.add(c);\r
- }\r
- },\r
- \r
- // private\r
- onRemove : function(c) {\r
- if (c.isFormField) {\r
- Ext.destroy(c.container.up('.x-form-item'));\r
- this.form.remove(c);\r
- }\r
- },\r
-\r
- \r
- startMonitoring : function(){\r
- if(!this.bound){\r
- this.bound = true;\r
- Ext.TaskMgr.start({\r
- run : this.bindHandler,\r
- interval : this.monitorPoll || 200,\r
- scope: this\r
- });\r
- }\r
- },\r
-\r
- \r
- stopMonitoring : function(){\r
- this.bound = false;\r
- },\r
-\r
- \r
- load : function(){\r
- this.form.load.apply(this.form, arguments); \r
- },\r
-\r
- // private\r
- onDisable : function(){\r
- Ext.FormPanel.superclass.onDisable.call(this);\r
- if(this.form){\r
- this.form.items.each(function(){\r
- this.disable();\r
- });\r
- }\r
- },\r
-\r
- // private\r
- onEnable : function(){\r
- Ext.FormPanel.superclass.onEnable.call(this);\r
- if(this.form){\r
- this.form.items.each(function(){\r
- this.enable();\r
- });\r
- }\r
- },\r
-\r
- // private\r
- bindHandler : function(){\r
- if(!this.bound){\r
- return false; // stops binding\r
- }\r
- var valid = true;\r
- this.form.items.each(function(f){\r
- if(!f.isValid(true)){\r
- valid = false;\r
- return false;\r
- }\r
- });\r
- if(this.buttons){\r
- for(var i = 0, len = this.buttons.length; i < len; i++){\r
- var btn = this.buttons[i];\r
- if(btn.formBind === true && btn.disabled === valid){\r
- btn.setDisabled(!valid);\r
- }\r
- }\r
- }\r
- this.fireEvent('clientvalidation', this, valid);\r
- }\r
-});\r
-Ext.reg('form', Ext.FormPanel);\r
-\r
-Ext.form.FormPanel = Ext.FormPanel;\r
-\r
-\r
-\r
-Ext.form.FieldSet = Ext.extend(Ext.Panel, {\r
- \r
- \r
- \r
- \r
- \r
- baseCls:'x-fieldset',\r
- \r
- layout: 'form',\r
- \r
- animCollapse: false,\r
-\r
- // private\r
- onRender : function(ct, position){\r
- if(!this.el){\r
- this.el = document.createElement('fieldset');\r
- this.el.id = this.id;\r
- if (this.title || this.header || this.checkboxToggle) {\r
- this.el.appendChild(document.createElement('legend')).className = 'x-fieldset-header';\r
- }\r
- }\r
-\r
- Ext.form.FieldSet.superclass.onRender.call(this, ct, position);\r
-\r
- if(this.checkboxToggle){\r
- var o = typeof this.checkboxToggle == 'object' ?\r
- this.checkboxToggle :\r
- {tag: 'input', type: 'checkbox', name: this.checkboxName || this.id+'-checkbox'};\r
- this.checkbox = this.header.insertFirst(o);\r
- this.checkbox.dom.checked = !this.collapsed;\r
- this.checkbox.on('click', this.onCheckClick, this);\r
- }\r
- },\r
-\r
- // private\r
- onCollapse : function(doAnim, animArg){\r
- if(this.checkbox){\r
- this.checkbox.dom.checked = false;\r
- }\r
- Ext.form.FieldSet.superclass.onCollapse.call(this, doAnim, animArg);\r
-\r
- },\r
-\r
- // private\r
- onExpand : function(doAnim, animArg){\r
- if(this.checkbox){\r
- this.checkbox.dom.checked = true;\r
- }\r
- Ext.form.FieldSet.superclass.onExpand.call(this, doAnim, animArg);\r
- },\r
-\r
- \r
- onCheckClick : function(){\r
- this[this.checkbox.dom.checked ? 'expand' : 'collapse']();\r
- },\r
- \r
- // private\r
- beforeDestroy : function(){\r
- if(this.checkbox){\r
- this.checkbox.un('click', this.onCheckClick, this);\r
- }\r
- Ext.form.FieldSet.superclass.beforeDestroy.call(this);\r
- }\r
-\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
-});\r
-Ext.reg('fieldset', Ext.form.FieldSet);\r
-\r
-\r
-\r
-\r
-Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, {\r
- \r
- enableFormat : true,\r
- \r
- enableFontSize : true,\r
- \r
- enableColors : true,\r
- \r
- enableAlignments : true,\r
- \r
- enableLists : true,\r
- \r
- enableSourceEdit : true,\r
- \r
- enableLinks : true,\r
- \r
- enableFont : true,\r
- \r
- createLinkText : 'Please enter the URL for the link:',\r
- \r
- defaultLinkValue : 'http:/'+'/',\r
- \r
- fontFamilies : [\r
- 'Arial',\r
- 'Courier New',\r
- 'Tahoma',\r
- 'Times New Roman',\r
- 'Verdana'\r
- ],\r
- defaultFont: 'tahoma',\r
-\r
- // private properties\r
- validationEvent : false,\r
- deferHeight: true,\r
- initialized : false,\r
- activated : false,\r
- sourceEditMode : false,\r
- onFocus : Ext.emptyFn,\r
- iframePad:3,\r
- hideMode:'offsets',\r
- defaultAutoCreate : {\r
- tag: "textarea",\r
- style:"width:500px;height:300px;",\r
- autocomplete: "off"\r
- },\r
-\r
- // private\r
- initComponent : function(){\r
- this.addEvents(\r
- \r
- 'initialize',\r
- \r
- 'activate',\r
- \r
- 'beforesync',\r
- \r
- 'beforepush',\r
- \r
- 'sync',\r
- \r
- 'push',\r
- \r
- 'editmodechange'\r
- )\r
- },\r
-\r
- // private\r
- createFontOptions : function(){\r
- var buf = [], fs = this.fontFamilies, ff, lc;\r
- for(var i = 0, len = fs.length; i< len; i++){\r
- ff = fs[i];\r
- lc = ff.toLowerCase();\r
- buf.push(\r
- '<option value="',lc,'" style="font-family:',ff,';"',\r
- (this.defaultFont == lc ? ' selected="true">' : '>'),\r
- ff,\r
- '</option>'\r
- );\r
- }\r
- return buf.join('');\r
- },\r
- \r
- \r
- createToolbar : function(editor){\r
- \r
- var tipsEnabled = Ext.QuickTips && Ext.QuickTips.isEnabled();\r
- \r
- function btn(id, toggle, handler){\r
- return {\r
- itemId : id,\r
- cls : 'x-btn-icon x-edit-'+id,\r
- enableToggle:toggle !== false,\r
- scope: editor,\r
- handler:handler||editor.relayBtnCmd,\r
- clickEvent:'mousedown',\r
- tooltip: tipsEnabled ? editor.buttonTips[id] || undefined : undefined,\r
- tabIndex:-1\r
- };\r
- }\r
-\r
- // build the toolbar\r
- var tb = new Ext.Toolbar({\r
- renderTo:this.wrap.dom.firstChild\r
- });\r
-\r
- // stop form submits\r
- tb.el.on('click', function(e){\r
- e.preventDefault();\r
- });\r
-\r
- if(this.enableFont && !Ext.isSafari2){\r
- this.fontSelect = tb.el.createChild({\r
- tag:'select',\r
- cls:'x-font-select',\r
- html: this.createFontOptions()\r
- });\r
- this.fontSelect.on('change', function(){\r
- var font = this.fontSelect.dom.value;\r
- this.relayCmd('fontname', font);\r
- this.deferFocus();\r
- }, this);\r
- tb.add(\r
- this.fontSelect.dom,\r
- '-'\r
- );\r
- };\r
-\r
- if(this.enableFormat){\r
- tb.add(\r
- btn('bold'),\r
- btn('italic'),\r
- btn('underline')\r
- );\r
- };\r
-\r
- if(this.enableFontSize){\r
- tb.add(\r
- '-',\r
- btn('increasefontsize', false, this.adjustFont),\r
- btn('decreasefontsize', false, this.adjustFont)\r
- );\r
- };\r
-\r
- if(this.enableColors){\r
- tb.add(\r
- '-', {\r
- itemId:'forecolor',\r
- cls:'x-btn-icon x-edit-forecolor',\r
- clickEvent:'mousedown',\r
- tooltip: tipsEnabled ? editor.buttonTips['forecolor'] || undefined : undefined,\r
- tabIndex:-1,\r
- menu : new Ext.menu.ColorMenu({\r
- allowReselect: true,\r
- focus: Ext.emptyFn,\r
- value:'000000',\r
- plain:true,\r
- selectHandler: function(cp, color){\r
- this.execCmd('forecolor', Ext.isSafari || Ext.isIE ? '#'+color : color);\r
- this.deferFocus();\r
- },\r
- scope: this,\r
- clickEvent:'mousedown'\r
- })\r
- }, {\r
- itemId:'backcolor',\r
- cls:'x-btn-icon x-edit-backcolor',\r
- clickEvent:'mousedown',\r
- tooltip: tipsEnabled ? editor.buttonTips['backcolor'] || undefined : undefined,\r
- tabIndex:-1,\r
- menu : new Ext.menu.ColorMenu({\r
- focus: Ext.emptyFn,\r
- value:'FFFFFF',\r
- plain:true,\r
- allowReselect: true,\r
- selectHandler: function(cp, color){\r
- if(Ext.isGecko){\r
- this.execCmd('useCSS', false);\r
- this.execCmd('hilitecolor', color);\r
- this.execCmd('useCSS', true);\r
- this.deferFocus();\r
- }else{\r
- this.execCmd(Ext.isOpera ? 'hilitecolor' : 'backcolor', Ext.isSafari || Ext.isIE ? '#'+color : color);\r
- this.deferFocus();\r
- }\r
- },\r
- scope:this,\r
- clickEvent:'mousedown'\r
- })\r
- }\r
- );\r
- };\r
-\r
- if(this.enableAlignments){\r
- tb.add(\r
- '-',\r
- btn('justifyleft'),\r
- btn('justifycenter'),\r
- btn('justifyright')\r
- );\r
- };\r
-\r
- if(!Ext.isSafari2){\r
- if(this.enableLinks){\r
- tb.add(\r
- '-',\r
- btn('createlink', false, this.createLink)\r
- );\r
- };\r
-\r
- if(this.enableLists){\r
- tb.add(\r
- '-',\r
- btn('insertorderedlist'),\r
- btn('insertunorderedlist')\r
- );\r
- }\r
- if(this.enableSourceEdit){\r
- tb.add(\r
- '-',\r
- btn('sourceedit', true, function(btn){\r
- this.toggleSourceEdit(btn.pressed);\r
- })\r
- );\r
- }\r
- }\r
-\r
- this.tb = tb;\r
- },\r
-\r
- \r
- getDocMarkup : function(){\r
- return '<html><head><style type="text/css">body{border:0;margin:0;padding:3px;height:98%;cursor:text;}</style></head><body></body></html>';\r
- },\r
-\r
- // private\r
- getEditorBody : function(){\r
- return this.doc.body || this.doc.documentElement;\r
- },\r
-\r
- // private\r
- getDoc : function(){\r
- return Ext.isIE ? this.getWin().document : (this.iframe.contentDocument || this.getWin().document);\r
- },\r
-\r
- // private\r
- getWin : function(){\r
- return Ext.isIE ? this.iframe.contentWindow : window.frames[this.iframe.name];\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- Ext.form.HtmlEditor.superclass.onRender.call(this, ct, position);\r
- this.el.dom.style.border = '0 none';\r
- this.el.dom.setAttribute('tabIndex', -1);\r
- this.el.addClass('x-hidden');\r
- if(Ext.isIE){ // fix IE 1px bogus margin\r
- this.el.applyStyles('margin-top:-1px;margin-bottom:-1px;')\r
- }\r
- this.wrap = this.el.wrap({\r
- cls:'x-html-editor-wrap', cn:{cls:'x-html-editor-tb'}\r
- });\r
-\r
- this.createToolbar(this);\r
-\r
- this.tb.items.each(function(item){\r
- if(item.itemId != 'sourceedit'){\r
- item.disable();\r
- }\r
- });\r
-\r
- var iframe = document.createElement('iframe');\r
- iframe.name = Ext.id();\r
- iframe.frameBorder = '0';\r
-\r
- iframe.src = Ext.isIE ? Ext.SSL_SECURE_URL : "javascript:;";\r
-\r
- this.wrap.dom.appendChild(iframe);\r
-\r
- this.iframe = iframe;\r
-\r
- this.initFrame();\r
-\r
- if(this.autoMonitorDesignMode !== false){\r
- this.monitorTask = Ext.TaskMgr.start({\r
- run: this.checkDesignMode,\r
- scope: this,\r
- interval:100\r
- });\r
- }\r
-\r
- if(!this.width){\r
- var sz = this.el.getSize();\r
- this.setSize(sz.width, this.height || sz.height);\r
- }\r
- },\r
-\r
- initFrame : function(){\r
- this.doc = this.getDoc();\r
- this.win = this.getWin();\r
-\r
- this.doc.open();\r
- this.doc.write(this.getDocMarkup());\r
- this.doc.close();\r
-\r
- var task = { // must defer to wait for browser to be ready\r
- run : function(){\r
- if(this.doc.body || this.doc.readyState == 'complete'){\r
- Ext.TaskMgr.stop(task);\r
- this.doc.designMode="on";\r
- this.initEditor.defer(10, this);\r
- }\r
- },\r
- interval : 10,\r
- duration:10000,\r
- scope: this\r
- };\r
- Ext.TaskMgr.start(task);\r
- },\r
-\r
-\r
- checkDesignMode : function(){\r
- if(this.wrap && this.wrap.dom.offsetWidth){\r
- var doc = this.getDoc();\r
- if(!doc){\r
- return;\r
- }\r
- if(!doc.editorInitialized || String(doc.designMode).toLowerCase() != 'on'){\r
- this.initFrame();\r
- }\r
- }\r
- },\r
-\r
- // private\r
- onResize : function(w, h){\r
- Ext.form.HtmlEditor.superclass.onResize.apply(this, arguments);\r
- if(this.el && this.iframe){\r
- if(typeof w == 'number'){\r
- var aw = w - this.wrap.getFrameWidth('lr');\r
- this.el.setWidth(this.adjustWidth('textarea', aw));\r
- this.iframe.style.width = Math.max(aw, 0) + 'px';\r
- }\r
- if(typeof h == 'number'){\r
- var ah = h - this.wrap.getFrameWidth('tb') - this.tb.el.getHeight();\r
- this.el.setHeight(this.adjustWidth('textarea', ah));\r
- this.iframe.style.height = Math.max(ah, 0) + 'px';\r
- if(this.doc){\r
- this.getEditorBody().style.height = Math.max((ah - (this.iframePad*2)), 0) + 'px';\r
- }\r
- }\r
- }\r
- },\r
-\r
- \r
- toggleSourceEdit : function(sourceEditMode){\r
- if(sourceEditMode === undefined){\r
- sourceEditMode = !this.sourceEditMode;\r
- }\r
- this.sourceEditMode = sourceEditMode === true;\r
- var btn = this.tb.items.get('sourceedit');\r
- if(btn.pressed !== this.sourceEditMode){\r
- btn.toggle(this.sourceEditMode);\r
- return;\r
- }\r
- if(this.sourceEditMode){\r
- this.tb.items.each(function(item){\r
- if(item.itemId != 'sourceedit'){\r
- item.disable();\r
- }\r
- });\r
- this.syncValue();\r
- this.iframe.className = 'x-hidden';\r
- this.el.removeClass('x-hidden');\r
- this.el.dom.removeAttribute('tabIndex');\r
- this.el.focus();\r
- }else{\r
- if(this.initialized){\r
- this.tb.items.each(function(item){\r
- item.enable();\r
- });\r
- }\r
- this.pushValue();\r
- this.iframe.className = '';\r
- this.el.addClass('x-hidden');\r
- this.el.dom.setAttribute('tabIndex', -1);\r
- this.deferFocus();\r
- }\r
- var lastSize = this.lastSize;\r
- if(lastSize){\r
- delete this.lastSize;\r
- this.setSize(lastSize);\r
- }\r
- this.fireEvent('editmodechange', this, this.sourceEditMode);\r
- },\r
-\r
- // private used internally\r
- createLink : function(){\r
- var url = prompt(this.createLinkText, this.defaultLinkValue);\r
- if(url && url != 'http:/'+'/'){\r
- this.relayCmd('createlink', url);\r
- }\r
- },\r
-\r
- // private (for BoxComponent)\r
- adjustSize : Ext.BoxComponent.prototype.adjustSize,\r
-\r
- // private (for BoxComponent)\r
- getResizeEl : function(){\r
- return this.wrap;\r
- },\r
-\r
- // private (for BoxComponent)\r
- getPositionEl : function(){\r
- return this.wrap;\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- this.originalValue = this.getValue();\r
- },\r
-\r
- \r
- markInvalid : Ext.emptyFn,\r
- \r
- \r
- clearInvalid : Ext.emptyFn,\r
-\r
- // docs inherit from Field\r
- setValue : function(v){\r
- Ext.form.HtmlEditor.superclass.setValue.call(this, v);\r
- this.pushValue();\r
- },\r
-\r
- \r
- cleanHtml : function(html){\r
- html = String(html);\r
- if(html.length > 5){\r
- if(Ext.isSafari){ // strip safari nonsense\r
- html = html.replace(/\sclass="(?:Apple-style-span|khtml-block-placeholder)"/gi, '');\r
- }\r
- }\r
- if(html == ' '){\r
- html = '';\r
- }\r
- return html;\r
- },\r
-\r
- \r
- syncValue : function(){\r
- if(this.initialized){\r
- var bd = this.getEditorBody();\r
- var html = bd.innerHTML;\r
- if(Ext.isSafari){\r
- var bs = bd.getAttribute('style'); // Safari puts text-align styles on the body element!\r
- var m = bs.match(/text-align:(.*?);/i);\r
- if(m && m[1]){\r
- html = '<div style="'+m[0]+'">' + html + '</div>';\r
- }\r
- }\r
- html = this.cleanHtml(html);\r
- if(this.fireEvent('beforesync', this, html) !== false){\r
- this.el.dom.value = html;\r
- this.fireEvent('sync', this, html);\r
- }\r
- }\r
- },\r
- \r
- //docs inherit from Field\r
- getValue : function() {\r
- this.syncValue();\r
- return Ext.form.HtmlEditor.superclass.getValue.call(this);\r
- },\r
-\r
-\r
- \r
- pushValue : function(){\r
- if(this.initialized){\r
- var v = this.el.dom.value;\r
- if(!this.activated && v.length < 1){\r
- v = ' ';\r
- }\r
- if(this.fireEvent('beforepush', this, v) !== false){\r
- this.getEditorBody().innerHTML = v;\r
- this.fireEvent('push', this, v);\r
- }\r
- }\r
- },\r
-\r
- // private\r
- deferFocus : function(){\r
- this.focus.defer(10, this);\r
- },\r
-\r
- // docs inherit from Field\r
- focus : function(){\r
- if(this.win && !this.sourceEditMode){\r
- this.win.focus();\r
- }else{\r
- this.el.focus();\r
- }\r
- },\r
-\r
- // private\r
- initEditor : function(){\r
- var dbody = this.getEditorBody();\r
- var ss = this.el.getStyles('font-size', 'font-family', 'background-image', 'background-repeat');\r
- ss['background-attachment'] = 'fixed'; // w3c\r
- dbody.bgProperties = 'fixed'; // ie\r
-\r
- Ext.DomHelper.applyStyles(dbody, ss);\r
-\r
- if(this.doc){\r
- try{\r
- Ext.EventManager.removeAll(this.doc);\r
- }catch(e){}\r
- }\r
-\r
- this.doc = this.getDoc();\r
-\r
- Ext.EventManager.on(this.doc, {\r
- 'mousedown': this.onEditorEvent,\r
- 'dblclick': this.onEditorEvent,\r
- 'click': this.onEditorEvent,\r
- 'keyup': this.onEditorEvent,\r
- buffer:100,\r
- scope: this\r
- });\r
-\r
- if(Ext.isGecko){\r
- Ext.EventManager.on(this.doc, 'keypress', this.applyCommand, this);\r
- }\r
- if(Ext.isIE || Ext.isSafari || Ext.isOpera){\r
- Ext.EventManager.on(this.doc, 'keydown', this.fixKeys, this);\r
- }\r
- this.initialized = true;\r
-\r
- this.fireEvent('initialize', this);\r
-\r
- this.doc.editorInitialized = true;\r
-\r
- this.pushValue();\r
- },\r
-\r
- // private\r
- onDestroy : function(){\r
- if(this.monitorTask){\r
- Ext.TaskMgr.stop(this.monitorTask);\r
- }\r
- if(this.rendered){\r
- this.tb.items.each(function(item){\r
- if(item.menu){\r
- item.menu.removeAll();\r
- if(item.menu.el){\r
- item.menu.el.destroy();\r
- }\r
- }\r
- item.destroy();\r
- });\r
- this.wrap.dom.innerHTML = '';\r
- this.wrap.remove();\r
- }\r
- },\r
-\r
- // private\r
- onFirstFocus : function(){\r
- this.activated = true;\r
- this.tb.items.each(function(item){\r
- item.enable();\r
- });\r
- if(Ext.isGecko){ // prevent silly gecko errors\r
- this.win.focus();\r
- var s = this.win.getSelection();\r
- if(!s.focusNode || s.focusNode.nodeType != 3){\r
- var r = s.getRangeAt(0);\r
- r.selectNodeContents(this.getEditorBody());\r
- r.collapse(true);\r
- this.deferFocus();\r
- }\r
- try{\r
- this.execCmd('useCSS', true);\r
- this.execCmd('styleWithCSS', false);\r
- }catch(e){}\r
- }\r
- this.fireEvent('activate', this);\r
- },\r
-\r
- // private\r
- adjustFont: function(btn){\r
- var adjust = btn.itemId == 'increasefontsize' ? 1 : -1;\r
-\r
- var v = parseInt(this.doc.queryCommandValue('FontSize') || 2, 10);\r
- if(Ext.isSafari3 || Ext.isAir){\r
- // Safari 3 values\r
- // 1 = 10px, 2 = 13px, 3 = 16px, 4 = 18px, 5 = 24px, 6 = 32px\r
- if(v <= 10){\r
- v = 1 + adjust;\r
- }else if(v <= 13){\r
- v = 2 + adjust;\r
- }else if(v <= 16){\r
- v = 3 + adjust;\r
- }else if(v <= 18){\r
- v = 4 + adjust;\r
- }else if(v <= 24){\r
- v = 5 + adjust;\r
- }else {\r
- v = 6 + adjust;\r
- }\r
- v = v.constrain(1, 6);\r
- }else{\r
- if(Ext.isSafari){ // safari\r
- adjust *= 2;\r
- }\r
- v = Math.max(1, v+adjust) + (Ext.isSafari ? 'px' : 0);\r
- }\r
- this.execCmd('FontSize', v);\r
- },\r
-\r
- // private\r
- onEditorEvent : function(e){\r
- this.updateToolbar();\r
- },\r
-\r
-\r
- \r
- updateToolbar: function(){\r
-\r
- if(!this.activated){\r
- this.onFirstFocus();\r
- return;\r
- }\r
-\r
- var btns = this.tb.items.map, doc = this.doc;\r
-\r
- if(this.enableFont && !Ext.isSafari2){\r
- var name = (this.doc.queryCommandValue('FontName')||this.defaultFont).toLowerCase();\r
- if(name != this.fontSelect.dom.value){\r
- this.fontSelect.dom.value = name;\r
- }\r
- }\r
- if(this.enableFormat){\r
- btns.bold.toggle(doc.queryCommandState('bold'));\r
- btns.italic.toggle(doc.queryCommandState('italic'));\r
- btns.underline.toggle(doc.queryCommandState('underline'));\r
- }\r
- if(this.enableAlignments){\r
- btns.justifyleft.toggle(doc.queryCommandState('justifyleft'));\r
- btns.justifycenter.toggle(doc.queryCommandState('justifycenter'));\r
- btns.justifyright.toggle(doc.queryCommandState('justifyright'));\r
- }\r
- if(!Ext.isSafari2 && this.enableLists){\r
- btns.insertorderedlist.toggle(doc.queryCommandState('insertorderedlist'));\r
- btns.insertunorderedlist.toggle(doc.queryCommandState('insertunorderedlist'));\r
- }\r
- \r
- Ext.menu.MenuMgr.hideAll();\r
-\r
- this.syncValue();\r
- },\r
-\r
- // private\r
- relayBtnCmd : function(btn){\r
- this.relayCmd(btn.itemId);\r
- },\r
-\r
- \r
- relayCmd : function(cmd, value){\r
- (function(){\r
- this.focus();\r
- this.execCmd(cmd, value);\r
- this.updateToolbar();\r
- }).defer(10, this);\r
- },\r
-\r
- \r
- execCmd : function(cmd, value){\r
- this.doc.execCommand(cmd, false, value === undefined ? null : value);\r
- this.syncValue();\r
- },\r
-\r
- // private\r
- applyCommand : function(e){\r
- if(e.ctrlKey){\r
- var c = e.getCharCode(), cmd;\r
- if(c > 0){\r
- c = String.fromCharCode(c);\r
- switch(c){\r
- case 'b':\r
- cmd = 'bold';\r
- break;\r
- case 'i':\r
- cmd = 'italic';\r
- break;\r
- case 'u':\r
- cmd = 'underline';\r
- break;\r
- }\r
- if(cmd){\r
- this.win.focus();\r
- this.execCmd(cmd);\r
- this.deferFocus();\r
- e.preventDefault();\r
- }\r
- }\r
- }\r
- },\r
-\r
- \r
- insertAtCursor : function(text){\r
- if(!this.activated){\r
- return;\r
- }\r
- if(Ext.isIE){\r
- this.win.focus();\r
- var r = this.doc.selection.createRange();\r
- if(r){\r
- r.collapse(true);\r
- r.pasteHTML(text);\r
- this.syncValue();\r
- this.deferFocus();\r
- }\r
- }else if(Ext.isGecko || Ext.isOpera){\r
- this.win.focus();\r
- this.execCmd('InsertHTML', text);\r
- this.deferFocus();\r
- }else if(Ext.isSafari){\r
- this.execCmd('InsertText', text);\r
- this.deferFocus();\r
- }\r
- },\r
-\r
- // private\r
- fixKeys : function(){ // load time branching for fastest keydown performance\r
- if(Ext.isIE){\r
- return function(e){\r
- var k = e.getKey(), r;\r
- if(k == e.TAB){\r
- e.stopEvent();\r
- r = this.doc.selection.createRange();\r
- if(r){\r
- r.collapse(true);\r
- r.pasteHTML(' ');\r
- this.deferFocus();\r
- }\r
- }else if(k == e.ENTER){\r
- r = this.doc.selection.createRange();\r
- if(r){\r
- var target = r.parentElement();\r
- if(!target || target.tagName.toLowerCase() != 'li'){\r
- e.stopEvent();\r
- r.pasteHTML('<br />');\r
- r.collapse(false);\r
- r.select();\r
- }\r
- }\r
- }\r
- };\r
- }else if(Ext.isOpera){\r
- return function(e){\r
- var k = e.getKey();\r
- if(k == e.TAB){\r
- e.stopEvent();\r
- this.win.focus();\r
- this.execCmd('InsertHTML',' ');\r
- this.deferFocus();\r
- }\r
- };\r
- }else if(Ext.isSafari){\r
- return function(e){\r
- var k = e.getKey();\r
- if(k == e.TAB){\r
- e.stopEvent();\r
- this.execCmd('InsertText','\t');\r
- this.deferFocus();\r
- }\r
- };\r
- }\r
- }(),\r
-\r
- \r
- getToolbar : function(){\r
- return this.tb;\r
- },\r
-\r
- \r
- buttonTips : {\r
- bold : {\r
- title: 'Bold (Ctrl+B)',\r
- text: 'Make the selected text bold.',\r
- cls: 'x-html-editor-tip'\r
- },\r
- italic : {\r
- title: 'Italic (Ctrl+I)',\r
- text: 'Make the selected text italic.',\r
- cls: 'x-html-editor-tip'\r
- },\r
- underline : {\r
- title: 'Underline (Ctrl+U)',\r
- text: 'Underline the selected text.',\r
- cls: 'x-html-editor-tip'\r
- },\r
- increasefontsize : {\r
- title: 'Grow Text',\r
- text: 'Increase the font size.',\r
- cls: 'x-html-editor-tip'\r
- },\r
- decreasefontsize : {\r
- title: 'Shrink Text',\r
- text: 'Decrease the font size.',\r
- cls: 'x-html-editor-tip'\r
- },\r
- backcolor : {\r
- title: 'Text Highlight Color',\r
- text: 'Change the background color of the selected text.',\r
- cls: 'x-html-editor-tip'\r
- },\r
- forecolor : {\r
- title: 'Font Color',\r
- text: 'Change the color of the selected text.',\r
- cls: 'x-html-editor-tip'\r
- },\r
- justifyleft : {\r
- title: 'Align Text Left',\r
- text: 'Align text to the left.',\r
- cls: 'x-html-editor-tip'\r
- },\r
- justifycenter : {\r
- title: 'Center Text',\r
- text: 'Center text in the editor.',\r
- cls: 'x-html-editor-tip'\r
- },\r
- justifyright : {\r
- title: 'Align Text Right',\r
- text: 'Align text to the right.',\r
- cls: 'x-html-editor-tip'\r
- },\r
- insertunorderedlist : {\r
- title: 'Bullet List',\r
- text: 'Start a bulleted list.',\r
- cls: 'x-html-editor-tip'\r
- },\r
- insertorderedlist : {\r
- title: 'Numbered List',\r
- text: 'Start a numbered list.',\r
- cls: 'x-html-editor-tip'\r
- },\r
- createlink : {\r
- title: 'Hyperlink',\r
- text: 'Make the selected text a hyperlink.',\r
- cls: 'x-html-editor-tip'\r
- },\r
- sourceedit : {\r
- title: 'Source Edit',\r
- text: 'Switch to source editing mode.',\r
- cls: 'x-html-editor-tip'\r
- }\r
- }\r
-\r
- // hide stuff that is not compatible\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
-});\r
-Ext.reg('htmleditor', Ext.form.HtmlEditor);\r
-\r
-Ext.form.TimeField = Ext.extend(Ext.form.ComboBox, {\r
- \r
- minValue : null,\r
- \r
- maxValue : null,\r
- \r
- minText : "The time in this field must be equal to or after {0}",\r
- \r
- maxText : "The time in this field must be equal to or before {0}",\r
- \r
- invalidText : "{0} is not a valid time",\r
- \r
- format : "g:i A",\r
- \r
- altFormats : "g:ia|g:iA|g:i a|g:i A|h:i|g:i|H:i|ga|ha|gA|h a|g a|g A|gi|hi|gia|hia|g|H",\r
- \r
- increment: 15,\r
-\r
- // private override\r
- mode: 'local',\r
- // private override\r
- triggerAction: 'all',\r
- // private override\r
- typeAhead: false,\r
- \r
- // private - This is the date to use when generating time values in the absence of either minValue\r
- // or maxValue. Using the current date causes DST issues on DST boundary dates, so this is an \r
- // arbitrary "safe" date that can be any date aside from DST boundary dates.\r
- initDate: '1/1/2008',\r
-\r
- // private\r
- initComponent : function(){\r
- Ext.form.TimeField.superclass.initComponent.call(this);\r
-\r
- if(typeof this.minValue == "string"){\r
- this.minValue = this.parseDate(this.minValue);\r
- }\r
- if(typeof this.maxValue == "string"){\r
- this.maxValue = this.parseDate(this.maxValue);\r
- }\r
-\r
- if(!this.store){\r
- var min = this.parseDate(this.minValue);\r
- if(!min){\r
- min = new Date(this.initDate).clearTime();\r
- }\r
- var max = this.parseDate(this.maxValue);\r
- if(!max){\r
- max = new Date(this.initDate).clearTime().add('mi', (24 * 60) - 1);\r
- }\r
- var times = [];\r
- while(min <= max){\r
- times.push([min.dateFormat(this.format)]);\r
- min = min.add('mi', this.increment);\r
- }\r
- this.store = new Ext.data.SimpleStore({\r
- fields: ['text'],\r
- data : times\r
- });\r
- this.displayField = 'text';\r
- }\r
- },\r
-\r
- // inherited docs\r
- getValue : function(){\r
- var v = Ext.form.TimeField.superclass.getValue.call(this);\r
- return this.formatDate(this.parseDate(v)) || '';\r
- },\r
-\r
- // inherited docs\r
- setValue : function(value){\r
- Ext.form.TimeField.superclass.setValue.call(this, this.formatDate(this.parseDate(value)));\r
- },\r
-\r
- // private overrides\r
- validateValue : Ext.form.DateField.prototype.validateValue,\r
- parseDate : Ext.form.DateField.prototype.parseDate,\r
- formatDate : Ext.form.DateField.prototype.formatDate,\r
-\r
- // private\r
- beforeBlur : function(){\r
- var v = this.parseDate(this.getRawValue());\r
- if(v){\r
- this.setValue(v.dateFormat(this.format));\r
- }\r
- }\r
-\r
- \r
- \r
- \r
- \r
-});\r
-Ext.reg('timefield', Ext.form.TimeField);\r
-\r
-Ext.form.Label = Ext.extend(Ext.BoxComponent, {\r
- \r
- \r
- \r
-\r
- // private\r
- onRender : function(ct, position){\r
- if(!this.el){\r
- this.el = document.createElement('label');\r
- this.el.id = this.getId();\r
- this.el.innerHTML = this.text ? Ext.util.Format.htmlEncode(this.text) : (this.html || '');\r
- if(this.forId){\r
- this.el.setAttribute('for', this.forId);\r
- }\r
- }\r
- Ext.form.Label.superclass.onRender.call(this, ct, position);\r
- },\r
- \r
- \r
- setText: function(t, encode){\r
- this.text = t;\r
- if(this.rendered){\r
- this.el.dom.innerHTML = encode !== false ? Ext.util.Format.htmlEncode(t) : t;\r
- }\r
- return this;\r
- }\r
-});\r
-\r
-Ext.reg('label', Ext.form.Label);\r
-\r
-Ext.form.Action = function(form, options){\r
- this.form = form;\r
- this.options = options || {};\r
-};\r
-\r
-\r
-Ext.form.Action.CLIENT_INVALID = 'client';\r
-\r
-Ext.form.Action.SERVER_INVALID = 'server';\r
-\r
-Ext.form.Action.CONNECT_FAILURE = 'connect';\r
-\r
-Ext.form.Action.LOAD_FAILURE = 'load';\r
-\r
-Ext.form.Action.prototype = {\r
-\r
-\r
-\r
-\r
-\r
-\r
-\r
-\r
-\r
-\r
-\r
-\r
- type : 'default',\r
-\r
-\r
- // interface method\r
- run : function(options){\r
-\r
- },\r
-\r
- // interface method\r
- success : function(response){\r
-\r
- },\r
-\r
- // interface method\r
- handleResponse : function(response){\r
-\r
- },\r
-\r
- // default connection failure\r
- failure : function(response){\r
- this.response = response;\r
- this.failureType = Ext.form.Action.CONNECT_FAILURE;\r
- this.form.afterAction(this, false);\r
- },\r
-\r
- // private\r
- processResponse : function(response){\r
- this.response = response;\r
- if(!response.responseText){\r
- return true;\r
- }\r
- this.result = this.handleResponse(response);\r
- return this.result;\r
- },\r
-\r
- // utility functions used internally\r
- getUrl : function(appendParams){\r
- var url = this.options.url || this.form.url || this.form.el.dom.action;\r
- if(appendParams){\r
- var p = this.getParams();\r
- if(p){\r
- url += (url.indexOf('?') != -1 ? '&' : '?') + p;\r
- }\r
- }\r
- return url;\r
- },\r
-\r
- // private\r
- getMethod : function(){\r
- return (this.options.method || this.form.method || this.form.el.dom.method || 'POST').toUpperCase();\r
- },\r
-\r
- // private\r
- getParams : function(){\r
- var bp = this.form.baseParams;\r
- var p = this.options.params;\r
- if(p){\r
- if(typeof p == "object"){\r
- p = Ext.urlEncode(Ext.applyIf(p, bp));\r
- }else if(typeof p == 'string' && bp){\r
- p += '&' + Ext.urlEncode(bp);\r
- }\r
- }else if(bp){\r
- p = Ext.urlEncode(bp);\r
- }\r
- return p;\r
- },\r
-\r
- // private\r
- createCallback : function(opts){\r
- var opts = opts || {};\r
- return {\r
- success: this.success,\r
- failure: this.failure,\r
- scope: this,\r
- timeout: (opts.timeout*1000) || (this.form.timeout*1000),\r
- upload: this.form.fileUpload ? this.success : undefined\r
- };\r
- }\r
-};\r
-\r
-\r
-Ext.form.Action.Submit = function(form, options){\r
- Ext.form.Action.Submit.superclass.constructor.call(this, form, options);\r
-};\r
-\r
-Ext.extend(Ext.form.Action.Submit, Ext.form.Action, {\r
- \r
- \r
- type : 'submit',\r
-\r
- // private\r
- run : function(){\r
- var o = this.options;\r
- var method = this.getMethod();\r
- var isGet = method == 'GET';\r
- if(o.clientValidation === false || this.form.isValid()){\r
- Ext.Ajax.request(Ext.apply(this.createCallback(o), {\r
- form:this.form.el.dom,\r
- url:this.getUrl(isGet),\r
- method: method,\r
- headers: o.headers,\r
- params:!isGet ? this.getParams() : null,\r
- isUpload: this.form.fileUpload\r
- }));\r
- }else if (o.clientValidation !== false){ // client validation failed\r
- this.failureType = Ext.form.Action.CLIENT_INVALID;\r
- this.form.afterAction(this, false);\r
- }\r
- },\r
-\r
- // private\r
- success : function(response){\r
- var result = this.processResponse(response);\r
- if(result === true || result.success){\r
- this.form.afterAction(this, true);\r
- return;\r
- }\r
- if(result.errors){\r
- this.form.markInvalid(result.errors);\r
- this.failureType = Ext.form.Action.SERVER_INVALID;\r
- }\r
- this.form.afterAction(this, false);\r
- },\r
-\r
- // private\r
- handleResponse : function(response){\r
- if(this.form.errorReader){\r
- var rs = this.form.errorReader.read(response);\r
- var errors = [];\r
- if(rs.records){\r
- for(var i = 0, len = rs.records.length; i < len; i++) {\r
- var r = rs.records[i];\r
- errors[i] = r.data;\r
- }\r
- }\r
- if(errors.length < 1){\r
- errors = null;\r
- }\r
- return {\r
- success : rs.success,\r
- errors : errors\r
- };\r
- }\r
- return Ext.decode(response.responseText);\r
- }\r
-});\r
-\r
-\r
-\r
-Ext.form.Action.Load = function(form, options){\r
- Ext.form.Action.Load.superclass.constructor.call(this, form, options);\r
- this.reader = this.form.reader;\r
-};\r
-\r
-Ext.extend(Ext.form.Action.Load, Ext.form.Action, {\r
- // private\r
- type : 'load',\r
-\r
- // private\r
- run : function(){\r
- Ext.Ajax.request(Ext.apply(\r
- this.createCallback(this.options), {\r
- method:this.getMethod(),\r
- url:this.getUrl(false),\r
- headers: this.options.headers,\r
- params:this.getParams()\r
- }));\r
- },\r
-\r
- // private\r
- success : function(response){\r
- var result = this.processResponse(response);\r
- if(result === true || !result.success || !result.data){\r
- this.failureType = Ext.form.Action.LOAD_FAILURE;\r
- this.form.afterAction(this, false);\r
- return;\r
- }\r
- this.form.clearInvalid();\r
- this.form.setValues(result.data);\r
- this.form.afterAction(this, true);\r
- },\r
-\r
- // private\r
- handleResponse : function(response){\r
- if(this.form.reader){\r
- var rs = this.form.reader.read(response);\r
- var data = rs.records && rs.records[0] ? rs.records[0].data : null;\r
- return {\r
- success : rs.success,\r
- data : data\r
- };\r
- }\r
- return Ext.decode(response.responseText);\r
- }\r
-});\r
-\r
-Ext.form.Action.ACTION_TYPES = {\r
- 'load' : Ext.form.Action.Load,\r
- 'submit' : Ext.form.Action.Submit\r
-};\r
-\r
-\r
-Ext.form.VTypes = function(){\r
- // closure these in so they are only created once.\r
- var alpha = /^[a-zA-Z_]+$/;\r
- var alphanum = /^[a-zA-Z0-9_]+$/;\r
- var email = /^([\w]+)(\.[\w]+)*@([\w\-]+\.){1,5}([A-Za-z]){2,4}$/;\r
- var url = /(((https?)|(ftp)):\/\/([\-\w]+\.)+\w{2,3}(\/[%\-\w]+(\.\w{2,})?)*(([\w\-\.\?\\\/+@&#;`~=%!]*)(\.\w{2,})?)*\/?)/i;\r
-\r
- // All these messages and functions are configurable\r
- return {\r
- \r
- 'email' : function(v){\r
- return email.test(v);\r
- },\r
- \r
- 'emailText' : 'This field should be an e-mail address in the format "user@domain.com"',\r
- \r
- 'emailMask' : /[a-z0-9_\.\-@]/i,\r
-\r
- \r
- 'url' : function(v){\r
- return url.test(v);\r
- },\r
- \r
- 'urlText' : 'This field should be a URL in the format "http:/'+'/www.domain.com"',\r
- \r
- \r
- 'alpha' : function(v){\r
- return alpha.test(v);\r
- },\r
- \r
- 'alphaText' : 'This field should only contain letters and _',\r
- \r
- 'alphaMask' : /[a-z_]/i,\r
-\r
- \r
- 'alphanum' : function(v){\r
- return alphanum.test(v);\r
- },\r
- \r
- 'alphanumText' : 'This field should only contain letters, numbers and _',\r
- \r
- 'alphanumMask' : /[a-z0-9_]/i\r
- };\r
-}();\r
-\r
-Ext.grid.GridPanel = Ext.extend(Ext.Panel, {\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
-\r
- \r
- ddText : "{0} selected row{1}",\r
- \r
- minColumnWidth : 25,\r
- \r
- trackMouseOver : true,\r
- \r
- enableDragDrop : false,\r
- \r
- enableColumnMove : true,\r
- \r
- enableColumnHide : true,\r
- \r
- enableHdMenu : true,\r
- \r
- stripeRows : false,\r
- \r
- autoExpandColumn : false,\r
- \r
- autoExpandMin : 50,\r
- \r
- autoExpandMax : 1000,\r
- \r
- view : null,\r
- \r
- loadMask : false,\r
-\r
- \r
- deferRowRender : true,\r
-\r
- // private\r
- rendered : false,\r
- // private\r
- viewReady: false,\r
- \r
- stateEvents: ["columnmove", "columnresize", "sortchange"],\r
-\r
- // private\r
- initComponent : function(){\r
- Ext.grid.GridPanel.superclass.initComponent.call(this);\r
-\r
- // override any provided value since it isn't valid\r
- this.autoScroll = false;\r
- this.autoWidth = false;\r
-\r
- if(Ext.isArray(this.columns)){\r
- this.colModel = new Ext.grid.ColumnModel(this.columns);\r
- delete this.columns;\r
- }\r
-\r
- // check and correct shorthanded configs\r
- if(this.ds){\r
- this.store = this.ds;\r
- delete this.ds;\r
- }\r
- if(this.cm){\r
- this.colModel = this.cm;\r
- delete this.cm;\r
- }\r
- if(this.sm){\r
- this.selModel = this.sm;\r
- delete this.sm;\r
- }\r
- this.store = Ext.StoreMgr.lookup(this.store);\r
-\r
- this.addEvents(\r
- // raw events\r
- \r
- "click",\r
- \r
- "dblclick",\r
- \r
- "contextmenu",\r
- \r
- "mousedown",\r
- \r
- "mouseup",\r
- \r
- "mouseover",\r
- \r
- "mouseout",\r
- \r
- "keypress",\r
- \r
- "keydown",\r
-\r
- // custom events\r
- \r
- "cellmousedown",\r
- \r
- "rowmousedown",\r
- \r
- "headermousedown",\r
-\r
- \r
- "cellclick",\r
- \r
- "celldblclick",\r
- \r
- "rowclick",\r
- \r
- "rowdblclick",\r
- \r
- "headerclick",\r
- \r
- "headerdblclick",\r
- \r
- "rowcontextmenu",\r
- \r
- "cellcontextmenu",\r
- \r
- "headercontextmenu",\r
- \r
- "bodyscroll",\r
- \r
- "columnresize",\r
- \r
- "columnmove",\r
- \r
- "sortchange"\r
- );\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- Ext.grid.GridPanel.superclass.onRender.apply(this, arguments);\r
-\r
- var c = this.body;\r
-\r
- this.el.addClass('x-grid-panel');\r
-\r
- var view = this.getView();\r
- view.init(this);\r
-\r
- c.on("mousedown", this.onMouseDown, this);\r
- c.on("click", this.onClick, this);\r
- c.on("dblclick", this.onDblClick, this);\r
- c.on("contextmenu", this.onContextMenu, this);\r
- c.on("keydown", this.onKeyDown, this);\r
-\r
- this.relayEvents(c, ["mousedown","mouseup","mouseover","mouseout","keypress"]);\r
-\r
- this.getSelectionModel().init(this);\r
- this.view.render();\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- Ext.grid.GridPanel.superclass.initEvents.call(this);\r
-\r
- if(this.loadMask){\r
- this.loadMask = new Ext.LoadMask(this.bwrap,\r
- Ext.apply({store:this.store}, this.loadMask));\r
- }\r
- },\r
-\r
- initStateEvents : function(){\r
- Ext.grid.GridPanel.superclass.initStateEvents.call(this);\r
- this.colModel.on('hiddenchange', this.saveState, this, {delay: 100});\r
- },\r
-\r
- applyState : function(state){\r
- var cm = this.colModel;\r
- var cs = state.columns;\r
- if(cs){\r
- for(var i = 0, len = cs.length; i < len; i++){\r
- var s = cs[i];\r
- var c = cm.getColumnById(s.id);\r
- if(c){\r
- c.hidden = s.hidden;\r
- c.width = s.width;\r
- var oldIndex = cm.getIndexById(s.id);\r
- if(oldIndex != i){\r
- cm.moveColumn(oldIndex, i);\r
- }\r
- }\r
- }\r
- }\r
- if(state.sort){\r
- this.store[this.store.remoteSort ? 'setDefaultSort' : 'sort'](state.sort.field, state.sort.direction);\r
- }\r
- },\r
-\r
- getState : function(){\r
- var o = {columns: []};\r
- for(var i = 0, c; c = this.colModel.config[i]; i++){\r
- o.columns[i] = {\r
- id: c.id,\r
- width: c.width\r
- };\r
- if(c.hidden){\r
- o.columns[i].hidden = true;\r
- }\r
- }\r
- var ss = this.store.getSortState();\r
- if(ss){\r
- o.sort = ss;\r
- }\r
- return o;\r
- },\r
-\r
- // private\r
- afterRender : function(){\r
- Ext.grid.GridPanel.superclass.afterRender.call(this);\r
- this.view.layout();\r
- if(this.deferRowRender){\r
- this.view.afterRender.defer(10, this.view);\r
- }else{\r
- this.view.afterRender();\r
- }\r
- this.viewReady = true;\r
- },\r
-\r
- \r
- reconfigure : function(store, colModel){\r
- if(this.loadMask){\r
- this.loadMask.destroy();\r
- this.loadMask = new Ext.LoadMask(this.bwrap,\r
- Ext.apply({store:store}, this.initialConfig.loadMask));\r
- }\r
- this.view.bind(store, colModel);\r
- this.store = store;\r
- this.colModel = colModel;\r
- if(this.rendered){\r
- this.view.refresh(true);\r
- }\r
- },\r
-\r
- // private\r
- onKeyDown : function(e){\r
- this.fireEvent("keydown", e);\r
- },\r
-\r
- // private\r
- onDestroy : function(){\r
- if(this.rendered){\r
- if(this.loadMask){\r
- this.loadMask.destroy();\r
- }\r
- var c = this.body;\r
- c.removeAllListeners();\r
- this.view.destroy();\r
- c.update("");\r
- }\r
- this.colModel.purgeListeners();\r
- Ext.grid.GridPanel.superclass.onDestroy.call(this);\r
- },\r
-\r
- // private\r
- processEvent : function(name, e){\r
- this.fireEvent(name, e);\r
- var t = e.getTarget();\r
- var v = this.view;\r
- var header = v.findHeaderIndex(t);\r
- if(header !== false){\r
- this.fireEvent("header" + name, this, header, e);\r
- }else{\r
- var row = v.findRowIndex(t);\r
- var cell = v.findCellIndex(t);\r
- if(row !== false){\r
- this.fireEvent("row" + name, this, row, e);\r
- if(cell !== false){\r
- this.fireEvent("cell" + name, this, row, cell, e);\r
- }\r
- }\r
- }\r
- },\r
-\r
- // private\r
- onClick : function(e){\r
- this.processEvent("click", e);\r
- },\r
-\r
- // private\r
- onMouseDown : function(e){\r
- this.processEvent("mousedown", e);\r
- },\r
-\r
- // private\r
- onContextMenu : function(e, t){\r
- this.processEvent("contextmenu", e);\r
- },\r
-\r
- // private\r
- onDblClick : function(e){\r
- this.processEvent("dblclick", e);\r
- },\r
-\r
- // private\r
- walkCells : function(row, col, step, fn, scope){\r
- var cm = this.colModel, clen = cm.getColumnCount();\r
- var ds = this.store, rlen = ds.getCount(), first = true;\r
- if(step < 0){\r
- if(col < 0){\r
- row--;\r
- first = false;\r
- }\r
- while(row >= 0){\r
- if(!first){\r
- col = clen-1;\r
- }\r
- first = false;\r
- while(col >= 0){\r
- if(fn.call(scope || this, row, col, cm) === true){\r
- return [row, col];\r
- }\r
- col--;\r
- }\r
- row--;\r
- }\r
- } else {\r
- if(col >= clen){\r
- row++;\r
- first = false;\r
- }\r
- while(row < rlen){\r
- if(!first){\r
- col = 0;\r
- }\r
- first = false;\r
- while(col < clen){\r
- if(fn.call(scope || this, row, col, cm) === true){\r
- return [row, col];\r
- }\r
- col++;\r
- }\r
- row++;\r
- }\r
- }\r
- return null;\r
- },\r
-\r
- // private\r
- getSelections : function(){\r
- return this.selModel.getSelections();\r
- },\r
-\r
- // private\r
- onResize : function(){\r
- Ext.grid.GridPanel.superclass.onResize.apply(this, arguments);\r
- if(this.viewReady){\r
- this.view.layout();\r
- }\r
- },\r
-\r
- \r
- getGridEl : function(){\r
- return this.body;\r
- },\r
-\r
- // private for compatibility, overridden by editor grid\r
- stopEditing : Ext.emptyFn,\r
-\r
- \r
- getSelectionModel : function(){\r
- if(!this.selModel){\r
- this.selModel = new Ext.grid.RowSelectionModel(\r
- this.disableSelection ? {selectRow: Ext.emptyFn} : null);\r
- }\r
- return this.selModel;\r
- },\r
-\r
- \r
- getStore : function(){\r
- return this.store;\r
- },\r
-\r
- \r
- getColumnModel : function(){\r
- return this.colModel;\r
- },\r
-\r
- \r
- getView : function(){\r
- if(!this.view){\r
- this.view = new Ext.grid.GridView(this.viewConfig);\r
- }\r
- return this.view;\r
- },\r
- \r
- getDragDropText : function(){\r
- var count = this.selModel.getCount();\r
- return String.format(this.ddText, count, count == 1 ? '' : 's');\r
- }\r
-\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
-\r
-\r
-\r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
- \r
-});\r
-Ext.reg('grid', Ext.grid.GridPanel);\r
-\r
-Ext.grid.GridView = function(config){\r
- Ext.apply(this, config);\r
- // These events are only used internally by the grid components\r
- this.addEvents(\r
- \r
- "beforerowremoved",\r
- \r
- "beforerowsinserted",\r
- \r
- "beforerefresh",\r
- \r
- "rowremoved",\r
- \r
- "rowsinserted",\r
- \r
- "rowupdated",\r
- \r
- "refresh"\r
- );\r
- Ext.grid.GridView.superclass.constructor.call(this);\r
-};\r
-\r
-Ext.extend(Ext.grid.GridView, Ext.util.Observable, {\r
- \r
- \r
- \r
- \r
- \r
- deferEmptyText: true,\r
- \r
- scrollOffset: 19,\r
- \r
- autoFill: false,\r
- \r
- forceFit: false,\r
- \r
- sortClasses : ["sort-asc", "sort-desc"],\r
- \r
- sortAscText : "Sort Ascending",\r
- \r
- sortDescText : "Sort Descending",\r
- \r
- columnsText : "Columns",\r
-\r
- // private\r
- borderWidth: 2,\r
- tdClass: 'x-grid3-cell',\r
- hdCls: 'x-grid3-hd',\r
-\r
- \r
- cellSelectorDepth: 4,\r
- \r
- rowSelectorDepth: 10,\r
-\r
- \r
- cellSelector: 'td.x-grid3-cell',\r
- \r
- rowSelector: 'div.x-grid3-row',\r
-\r
- \r
-\r
- // private\r
- initTemplates : function(){\r
- var ts = this.templates || {};\r
- if(!ts.master){\r
- ts.master = new Ext.Template(\r
- '<div class="x-grid3" hidefocus="true">',\r
- '<div class="x-grid3-viewport">',\r
- '<div class="x-grid3-header"><div class="x-grid3-header-inner"><div class="x-grid3-header-offset">{header}</div></div><div class="x-clear"></div></div>',\r
- '<div class="x-grid3-scroller"><div class="x-grid3-body">{body}</div><a href="#" class="x-grid3-focus" tabIndex="-1"></a></div>',\r
- "</div>",\r
- '<div class="x-grid3-resize-marker"> </div>',\r
- '<div class="x-grid3-resize-proxy"> </div>',\r
- "</div>"\r
- );\r
- }\r
-\r
- if(!ts.header){\r
- ts.header = new Ext.Template(\r
- '<table border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',\r
- '<thead><tr class="x-grid3-hd-row">{cells}</tr></thead>',\r
- "</table>"\r
- );\r
- }\r
-\r
- if(!ts.hcell){\r
- ts.hcell = new Ext.Template(\r
- '<td class="x-grid3-hd x-grid3-cell x-grid3-td-{id} {css}" style="{style}"><div {tooltip} {attr} class="x-grid3-hd-inner x-grid3-hd-{id}" unselectable="on" style="{istyle}">', this.grid.enableHdMenu ? '<a class="x-grid3-hd-btn" href="#"></a>' : '',\r
- '{value}<img class="x-grid3-sort-icon" src="', Ext.BLANK_IMAGE_URL, '" />',\r
- "</div></td>"\r
- );\r
- }\r
-\r
- if(!ts.body){\r
- ts.body = new Ext.Template('{rows}');\r
- }\r
-\r
- if(!ts.row){\r
- ts.row = new Ext.Template(\r
- '<div class="x-grid3-row {alt}" style="{tstyle}"><table class="x-grid3-row-table" border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',\r
- '<tbody><tr>{cells}</tr>',\r
- (this.enableRowBody ? '<tr class="x-grid3-row-body-tr" style="{bodyStyle}"><td colspan="{cols}" class="x-grid3-body-cell" tabIndex="0" hidefocus="on"><div class="x-grid3-row-body">{body}</div></td></tr>' : ''),\r
- '</tbody></table></div>'\r
- );\r
- }\r
-\r
- if(!ts.cell){\r
- ts.cell = new Ext.Template(\r
- '<td class="x-grid3-col x-grid3-cell x-grid3-td-{id} {css}" style="{style}" tabIndex="0" {cellAttr}>',\r
- '<div class="x-grid3-cell-inner x-grid3-col-{id}" unselectable="on" {attr}>{value}</div>',\r
- "</td>"\r
- );\r
- }\r
-\r
- for(var k in ts){\r
- var t = ts[k];\r
- if(t && typeof t.compile == 'function' && !t.compiled){\r
- t.disableFormats = true;\r
- t.compile();\r
- }\r
- }\r
-\r
- this.templates = ts;\r
- this.colRe = new RegExp("x-grid3-td-([^\\s]+)", "");\r
- },\r
-\r
- // private\r
- fly : function(el){\r
- if(!this._flyweight){\r
- this._flyweight = new Ext.Element.Flyweight(document.body);\r
- }\r
- this._flyweight.dom = el;\r
- return this._flyweight;\r
- },\r
-\r
- // private\r
- getEditorParent : function(){\r
- return this.scroller.dom;\r
- },\r
-\r
- // private\r
- initElements : function(){\r
- var E = Ext.Element;\r
-\r
- var el = this.grid.getGridEl().dom.firstChild;\r
- var cs = el.childNodes;\r
-\r
- this.el = new E(el);\r
-\r
- this.mainWrap = new E(cs[0]);\r
- this.mainHd = new E(this.mainWrap.dom.firstChild);\r
-\r
- if(this.grid.hideHeaders){\r
- this.mainHd.setDisplayed(false);\r
- }\r
-\r
- this.innerHd = this.mainHd.dom.firstChild;\r
- this.scroller = new E(this.mainWrap.dom.childNodes[1]);\r
- if(this.forceFit){\r
- this.scroller.setStyle('overflow-x', 'hidden');\r
- }\r
- \r
- this.mainBody = new E(this.scroller.dom.firstChild);\r
-\r
- this.focusEl = new E(this.scroller.dom.childNodes[1]);\r
- this.focusEl.swallowEvent("click", true);\r
-\r
- this.resizeMarker = new E(cs[1]);\r
- this.resizeProxy = new E(cs[2]);\r
- },\r
-\r
- // private\r
- getRows : function(){\r
- return this.hasRows() ? this.mainBody.dom.childNodes : [];\r
- },\r
-\r
- // finder methods, used with delegation\r
-\r
- // private\r
- findCell : function(el){\r
- if(!el){\r
- return false;\r
- }\r
- return this.fly(el).findParent(this.cellSelector, this.cellSelectorDepth);\r
- },\r
-\r
- // private\r
- findCellIndex : function(el, requiredCls){\r
- var cell = this.findCell(el);\r
- if(cell && (!requiredCls || this.fly(cell).hasClass(requiredCls))){\r
- return this.getCellIndex(cell);\r
- }\r
- return false;\r
- },\r
-\r
- // private\r
- getCellIndex : function(el){\r
- if(el){\r
- var m = el.className.match(this.colRe);\r
- if(m && m[1]){\r
- return this.cm.getIndexById(m[1]);\r
- }\r
- }\r
- return false;\r
- },\r
-\r
- // private\r
- findHeaderCell : function(el){\r
- var cell = this.findCell(el);\r
- return cell && this.fly(cell).hasClass(this.hdCls) ? cell : null;\r
- },\r
-\r
- // private\r
- findHeaderIndex : function(el){\r
- return this.findCellIndex(el, this.hdCls);\r
- },\r
-\r
-\r
- findRow : function(el){\r
- if(!el){\r
- return false;\r
- }\r
- return this.fly(el).findParent(this.rowSelector, this.rowSelectorDepth);\r
- },\r
-\r
-\r
- findRowIndex : function(el){\r
- var r = this.findRow(el);\r
- return r ? r.rowIndex : false;\r
- },\r
-\r
- // getter methods for fetching elements dynamically in the grid\r
-\r
-\r
- getRow : function(row){\r
- return this.getRows()[row];\r
- },\r
-\r
-\r
- getCell : function(row, col){\r
- return this.getRow(row).getElementsByTagName('td')[col];\r
- },\r
-\r
-\r
- getHeaderCell : function(index){\r
- return this.mainHd.dom.getElementsByTagName('td')[index];\r
- },\r
-\r
- // manipulating elements\r
-\r
- // private - use getRowClass to apply custom row classes\r
- addRowClass : function(row, cls){\r
- var r = this.getRow(row);\r
- if(r){\r
- this.fly(r).addClass(cls);\r
- }\r
- },\r
-\r
- // private\r
- removeRowClass : function(row, cls){\r
- var r = this.getRow(row);\r
- if(r){\r
- this.fly(r).removeClass(cls);\r
- }\r
- },\r
-\r
- // private\r
- removeRow : function(row){\r
- Ext.removeNode(this.getRow(row));\r
- this.syncFocusEl(row);\r
- },\r
- \r
- // private\r
- removeRows : function(firstRow, lastRow){\r
- var bd = this.mainBody.dom;\r
- for(var rowIndex = firstRow; rowIndex <= lastRow; rowIndex++){\r
- Ext.removeNode(bd.childNodes[firstRow]);\r
- }\r
- this.syncFocusEl(firstRow);\r
- },\r
-\r
- // scrolling stuff\r
-\r
- // private\r
- getScrollState : function(){\r
- var sb = this.scroller.dom;\r
- return {left: sb.scrollLeft, top: sb.scrollTop};\r
- },\r
-\r
- // private\r
- restoreScroll : function(state){\r
- var sb = this.scroller.dom;\r
- sb.scrollLeft = state.left;\r
- sb.scrollTop = state.top;\r
- },\r
-\r
- \r
- scrollToTop : function(){\r
- this.scroller.dom.scrollTop = 0;\r
- this.scroller.dom.scrollLeft = 0;\r
- },\r
-\r
- // private\r
- syncScroll : function(){\r
- this.syncHeaderScroll();\r
- var mb = this.scroller.dom;\r
- this.grid.fireEvent("bodyscroll", mb.scrollLeft, mb.scrollTop);\r
- },\r
-\r
- // private\r
- syncHeaderScroll : function(){\r
- var mb = this.scroller.dom;\r
- this.innerHd.scrollLeft = mb.scrollLeft;\r
- this.innerHd.scrollLeft = mb.scrollLeft; // second time for IE (1/2 time first fails, other browsers ignore)\r
- },\r
-\r
- // private\r
- updateSortIcon : function(col, dir){\r
- var sc = this.sortClasses;\r
- var hds = this.mainHd.select('td').removeClass(sc);\r
- hds.item(col).addClass(sc[dir == "DESC" ? 1 : 0]);\r
- },\r
-\r
- // private\r
- updateAllColumnWidths : function(){\r
- var tw = this.getTotalWidth();\r
- var clen = this.cm.getColumnCount();\r
- var ws = [];\r
- for(var i = 0; i < clen; i++){\r
- ws[i] = this.getColumnWidth(i);\r
- }\r
-\r
- this.innerHd.firstChild.firstChild.style.width = tw;\r
-\r
- for(var i = 0; i < clen; i++){\r
- var hd = this.getHeaderCell(i);\r
- hd.style.width = ws[i];\r
- }\r
-\r
- var ns = this.getRows(), row, trow;\r
- for(var i = 0, len = ns.length; i < len; i++){\r
- row = ns[i];\r
- row.style.width = tw;\r
- if(row.firstChild){\r
- row.firstChild.style.width = tw;\r
- trow = row.firstChild.rows[0];\r
- for (var j = 0; j < clen; j++) {\r
- trow.childNodes[j].style.width = ws[j];\r
- }\r
- }\r
- }\r
-\r
- this.onAllColumnWidthsUpdated(ws, tw);\r
- },\r
-\r
- // private\r
- updateColumnWidth : function(col, width){\r
- var w = this.getColumnWidth(col);\r
- var tw = this.getTotalWidth();\r
-\r
- this.innerHd.firstChild.firstChild.style.width = tw;\r
- var hd = this.getHeaderCell(col);\r
- hd.style.width = w;\r
-\r
- var ns = this.getRows(), row;\r
- for(var i = 0, len = ns.length; i < len; i++){\r
- row = ns[i];\r
- row.style.width = tw;\r
- if(row.firstChild){\r
- row.firstChild.style.width = tw;\r
- row.firstChild.rows[0].childNodes[col].style.width = w;\r
- }\r
- }\r
-\r
- this.onColumnWidthUpdated(col, w, tw);\r
- },\r
-\r
- // private\r
- updateColumnHidden : function(col, hidden){\r
- var tw = this.getTotalWidth();\r
-\r
- this.innerHd.firstChild.firstChild.style.width = tw;\r
-\r
- var display = hidden ? 'none' : '';\r
-\r
- var hd = this.getHeaderCell(col);\r
- hd.style.display = display;\r
-\r
- var ns = this.getRows(), row;\r
- for(var i = 0, len = ns.length; i < len; i++){\r
- row = ns[i];\r
- row.style.width = tw;\r
- if(row.firstChild){\r
- row.firstChild.style.width = tw;\r
- row.firstChild.rows[0].childNodes[col].style.display = display;\r
- }\r
- }\r
-\r
- this.onColumnHiddenUpdated(col, hidden, tw);\r
-\r
- delete this.lastViewWidth; // force recalc\r
- this.layout();\r
- },\r
-\r
- // private\r
- doRender : function(cs, rs, ds, startRow, colCount, stripe){\r
- var ts = this.templates, ct = ts.cell, rt = ts.row, last = colCount-1;\r
- var tstyle = 'width:'+this.getTotalWidth()+';';\r
- // buffers\r
- var buf = [], cb, c, p = {}, rp = {tstyle: tstyle}, r;\r
- for(var j = 0, len = rs.length; j < len; j++){\r
- r = rs[j]; cb = [];\r
- var rowIndex = (j+startRow);\r
- for(var i = 0; i < colCount; i++){\r
- c = cs[i];\r
- p.id = c.id;\r
- p.css = i == 0 ? 'x-grid3-cell-first ' : (i == last ? 'x-grid3-cell-last ' : '');\r
- p.attr = p.cellAttr = "";\r
- p.value = c.renderer(r.data[c.name], p, r, rowIndex, i, ds);\r
- p.style = c.style;\r
- if(p.value == undefined || p.value === "") p.value = " ";\r
- if(r.dirty && typeof r.modified[c.name] !== 'undefined'){\r
- p.css += ' x-grid3-dirty-cell';\r
- }\r
- cb[cb.length] = ct.apply(p);\r
- }\r
- var alt = [];\r
- if(stripe && ((rowIndex+1) % 2 == 0)){\r
- alt[0] = "x-grid3-row-alt";\r
- }\r
- if(r.dirty){\r
- alt[1] = " x-grid3-dirty-row";\r
- }\r
- rp.cols = colCount;\r
- if(this.getRowClass){\r
- alt[2] = this.getRowClass(r, rowIndex, rp, ds);\r
- }\r
- rp.alt = alt.join(" ");\r
- rp.cells = cb.join("");\r
- buf[buf.length] = rt.apply(rp);\r
- }\r
- return buf.join("");\r
- },\r
-\r
- // private\r
- processRows : function(startRow, skipStripe){\r
- if(this.ds.getCount() < 1){\r
- return;\r
- }\r
- skipStripe = skipStripe || !this.grid.stripeRows;\r
- startRow = startRow || 0;\r
- var rows = this.getRows();\r
- var cls = ' x-grid3-row-alt ';\r
- rows[0].className += ' x-grid3-row-first';\r
- rows[rows.length - 1].className += ' x-grid3-row-last';\r
- for(var i = startRow, len = rows.length; i < len; i++){\r
- var row = rows[i];\r
- row.rowIndex = i;\r
- if(!skipStripe){\r
- var isAlt = ((i+1) % 2 == 0);\r
- var hasAlt = (' '+row.className + ' ').indexOf(cls) != -1;\r
- if(isAlt == hasAlt){\r
- continue;\r
- }\r
- if(isAlt){\r
- row.className += " x-grid3-row-alt";\r
- }else{\r
- row.className = row.className.replace("x-grid3-row-alt", "");\r
- }\r
- }\r
- }\r
- },\r
-\r
- afterRender: function(){\r
- this.mainBody.dom.innerHTML = this.renderRows();\r
- this.processRows(0, true);\r
-\r
- if(this.deferEmptyText !== true){\r
- this.applyEmptyText();\r
- }\r
- },\r
-\r
- // private\r
- renderUI : function(){\r
-\r
- var header = this.renderHeaders();\r
- var body = this.templates.body.apply({rows:''});\r
-\r
-\r
- var html = this.templates.master.apply({\r
- body: body,\r
- header: header\r
- });\r
-\r
- var g = this.grid;\r
-\r
- g.getGridEl().dom.innerHTML = html;\r
-\r
- this.initElements();\r
-\r
- // get mousedowns early\r
- Ext.fly(this.innerHd).on("click", this.handleHdDown, this);\r
- this.mainHd.on("mouseover", this.handleHdOver, this);\r
- this.mainHd.on("mouseout", this.handleHdOut, this);\r
- this.mainHd.on("mousemove", this.handleHdMove, this);\r
-\r
- this.scroller.on('scroll', this.syncScroll, this);\r
- if(g.enableColumnResize !== false){\r
- this.splitZone = new Ext.grid.GridView.SplitDragZone(g, this.mainHd.dom);\r
- }\r
-\r
- if(g.enableColumnMove){\r
- this.columnDrag = new Ext.grid.GridView.ColumnDragZone(g, this.innerHd);\r
- this.columnDrop = new Ext.grid.HeaderDropZone(g, this.mainHd.dom);\r
- }\r
-\r
- if(g.enableHdMenu !== false){\r
- if(g.enableColumnHide !== false){\r
- this.colMenu = new Ext.menu.Menu({id:g.id + "-hcols-menu"});\r
- this.colMenu.on("beforeshow", this.beforeColMenuShow, this);\r
- this.colMenu.on("itemclick", this.handleHdMenuClick, this);\r
- }\r
- this.hmenu = new Ext.menu.Menu({id: g.id + "-hctx"});\r
- this.hmenu.add(\r
- {id:"asc", text: this.sortAscText, cls: "xg-hmenu-sort-asc"},\r
- {id:"desc", text: this.sortDescText, cls: "xg-hmenu-sort-desc"}\r
- );\r
- if(g.enableColumnHide !== false){\r
- this.hmenu.add('-',\r
- {id:"columns", text: this.columnsText, menu: this.colMenu, iconCls: 'x-cols-icon'}\r
- );\r
- }\r
- this.hmenu.on("itemclick", this.handleHdMenuClick, this);\r
-\r
- //g.on("headercontextmenu", this.handleHdCtx, this);\r
- }\r
-\r
- if(g.trackMouseOver){\r
- this.mainBody.on("mouseover", this.onRowOver, this);\r
- this.mainBody.on("mouseout", this.onRowOut, this);\r
- }\r
- if(g.enableDragDrop || g.enableDrag){\r
- this.dragZone = new Ext.grid.GridDragZone(g, {\r
- ddGroup : g.ddGroup || 'GridDD'\r
- });\r
- }\r
-\r
- this.updateHeaderSortState();\r
-\r
- },\r
-\r
- // private\r
- layout : function(){\r
- if(!this.mainBody){\r
- return; // not rendered\r
- }\r
- var g = this.grid;\r
- var c = g.getGridEl();\r
- var csize = c.getSize(true);\r
- var vw = csize.width;\r
-\r
- if(vw < 20 || csize.height < 20){ // display: none?\r
- return;\r
- }\r
-\r
- if(g.autoHeight){\r
- this.scroller.dom.style.overflow = 'visible';\r
- if(Ext.isSafari){\r
- this.scroller.dom.style.position = 'static';\r
- }\r
- }else{\r
- this.el.setSize(csize.width, csize.height);\r
-\r
- var hdHeight = this.mainHd.getHeight();\r
- var vh = csize.height - (hdHeight);\r
-\r
- this.scroller.setSize(vw, vh);\r
- if(this.innerHd){\r
- this.innerHd.style.width = (vw)+'px';\r
- }\r
- }\r
- if(this.forceFit){\r
- if(this.lastViewWidth != vw){\r
- this.fitColumns(false, false);\r
- this.lastViewWidth = vw;\r
- }\r
- }else {\r
- this.autoExpand();\r
- this.syncHeaderScroll();\r
- }\r
- this.onLayout(vw, vh);\r
- },\r
-\r
- // template functions for subclasses and plugins\r
- // these functions include precalculated values\r
- onLayout : function(vw, vh){\r
- // do nothing\r
- },\r
-\r
- onColumnWidthUpdated : function(col, w, tw){\r
- //template method\r
- this.focusEl.setWidth(tw);\r
- },\r
-\r
- onAllColumnWidthsUpdated : function(ws, tw){\r
- //template method\r
- this.focusEl.setWidth(tw);\r
- },\r
-\r
- onColumnHiddenUpdated : function(col, hidden, tw){\r
- // template method\r
- this.focusEl.setWidth(tw);\r
- },\r
-\r
- updateColumnText : function(col, text){\r
- // template method\r
- },\r
-\r
- afterMove : function(colIndex){\r
- // template method\r
- },\r
-\r
- \r
- // private\r
- init: function(grid){\r
- this.grid = grid;\r
-\r
- this.initTemplates();\r
- this.initData(grid.store, grid.colModel);\r
- this.initUI(grid);\r
- },\r
-\r
- // private\r
- getColumnId : function(index){\r
- return this.cm.getColumnId(index);\r
- },\r
-\r
- // private\r
- renderHeaders : function(){\r
- var cm = this.cm, ts = this.templates;\r
- var ct = ts.hcell;\r
-\r
- var cb = [], sb = [], p = {};\r
- var len = cm.getColumnCount();\r
- var last = len - 1;\r
- for(var i = 0; i < len; i++){\r
- p.id = cm.getColumnId(i);\r
- p.value = cm.getColumnHeader(i) || "";\r
- p.style = this.getColumnStyle(i, true);\r
- p.tooltip = this.getColumnTooltip(i);\r
- p.css = i == 0 ? 'x-grid3-cell-first ' : (i == last ? 'x-grid3-cell-last ' : '');\r
- if(cm.config[i].align == 'right'){\r
- p.istyle = 'padding-right:16px';\r
- } else {\r
- delete p.istyle;\r
- }\r
- cb[cb.length] = ct.apply(p);\r
- }\r
- return ts.header.apply({cells: cb.join(""), tstyle:'width:'+this.getTotalWidth()+';'});\r
- },\r
-\r
- // private\r
- getColumnTooltip : function(i){\r
- var tt = this.cm.getColumnTooltip(i);\r
- if(tt){\r
- if(Ext.QuickTips.isEnabled()){\r
- return 'ext:qtip="'+tt+'"';\r
- }else{\r
- return 'title="'+tt+'"';\r
- }\r
- }\r
- return "";\r
- },\r
-\r
- // private\r
- beforeUpdate : function(){\r
- this.grid.stopEditing(true);\r
- },\r
-\r
- // private\r
- updateHeaders : function(){\r
- this.innerHd.firstChild.innerHTML = this.renderHeaders();\r
- },\r
-\r
- \r
- focusRow : function(row){\r
- this.focusCell(row, 0, false);\r
- },\r
-\r
- \r
- focusCell : function(row, col, hscroll){\r
- this.syncFocusEl(this.ensureVisible(row, col, hscroll));\r
- if(Ext.isGecko){\r
- this.focusEl.focus();\r
- }else{\r
- this.focusEl.focus.defer(1, this.focusEl);\r
- }\r
- },\r
-\r
- resolveCell : function(row, col, hscroll){\r
- if(typeof row != "number"){\r
- row = row.rowIndex;\r
- }\r
- if(!this.ds){\r
- return null;\r
- }\r
- if(row < 0 || row >= this.ds.getCount()){\r
- return null;\r
- }\r
- col = (col !== undefined ? col : 0);\r
-\r
- var rowEl = this.getRow(row), cellEl;\r
- if(!(hscroll === false && col === 0)){\r
- while(this.cm.isHidden(col)){\r
- col++;\r
- }\r
- cellEl = this.getCell(row, col);\r
- }\r
-\r
- return {row: rowEl, cell: cellEl};\r
- },\r
-\r
- getResolvedXY : function(resolved){\r
- if(!resolved){\r
- return null;\r
- }\r
- var s = this.scroller.dom, c = resolved.cell, r = resolved.row;\r
- return c ? Ext.fly(c).getXY() : [this.el.getX(), Ext.fly(r).getY()];\r
- },\r
-\r
- syncFocusEl : function(row, col, hscroll){\r
- var xy = row;\r
- if(!Ext.isArray(xy)){\r
- row = Math.min(row, Math.max(0, this.getRows().length-1));\r
- xy = this.getResolvedXY(this.resolveCell(row, col, hscroll));\r
- }\r
- this.focusEl.setXY(xy||this.scroller.getXY());\r
- },\r
-\r
- ensureVisible : function(row, col, hscroll){\r
- var resolved = this.resolveCell(row, col, hscroll);\r
- if(!resolved || !resolved.row){\r
- return;\r
- }\r
-\r
- var rowEl = resolved.row, cellEl = resolved.cell;\r
-\r
- var c = this.scroller.dom;\r
-\r
- var ctop = 0;\r
- var p = rowEl, stop = this.el.dom;\r
- while(p && p != stop){\r
- ctop += p.offsetTop;\r
- p = p.offsetParent;\r
- }\r
- ctop -= this.mainHd.dom.offsetHeight;\r
-\r
- var cbot = ctop + rowEl.offsetHeight;\r
-\r
- var ch = c.clientHeight;\r
- var stop = parseInt(c.scrollTop, 10);\r
- var sbot = stop + ch;\r
-\r
- if(ctop < stop){\r
- c.scrollTop = ctop;\r
- }else if(cbot > sbot){\r
- c.scrollTop = cbot-ch;\r
- }\r
-\r
- if(hscroll !== false){\r
- var cleft = parseInt(cellEl.offsetLeft, 10);\r
- var cright = cleft + cellEl.offsetWidth;\r
-\r
- var sleft = parseInt(c.scrollLeft, 10);\r
- var sright = sleft + c.clientWidth;\r
- if(cleft < sleft){\r
- c.scrollLeft = cleft;\r
- }else if(cright > sright){\r
- c.scrollLeft = cright-c.clientWidth;\r
- }\r
- }\r
- return this.getResolvedXY(resolved);\r
- },\r
-\r
- // private\r
- insertRows : function(dm, firstRow, lastRow, isUpdate){\r
- if(!isUpdate && firstRow === 0 && lastRow >= dm.getCount()-1){\r
- this.refresh();\r
- }else{\r
- if(!isUpdate){\r
- this.fireEvent("beforerowsinserted", this, firstRow, lastRow);\r
- }\r
- var html = this.renderRows(firstRow, lastRow);\r
- var before = this.getRow(firstRow);\r
- if(before){\r
- Ext.DomHelper.insertHtml('beforeBegin', before, html);\r
- }else{\r
- Ext.DomHelper.insertHtml('beforeEnd', this.mainBody.dom, html);\r
- }\r
- if(!isUpdate){\r
- this.fireEvent("rowsinserted", this, firstRow, lastRow);\r
- this.processRows(firstRow);\r
- }\r
- }\r
- this.syncFocusEl(firstRow);\r
- },\r
-\r
- // private\r
- deleteRows : function(dm, firstRow, lastRow){\r
- if(dm.getRowCount()<1){\r
- this.refresh();\r
- }else{\r
- this.fireEvent("beforerowsdeleted", this, firstRow, lastRow);\r
-\r
- this.removeRows(firstRow, lastRow);\r
-\r
- this.processRows(firstRow);\r
- this.fireEvent("rowsdeleted", this, firstRow, lastRow);\r
- }\r
- },\r
-\r
- // private\r
- getColumnStyle : function(col, isHeader){\r
- var style = !isHeader ? (this.cm.config[col].css || '') : '';\r
- style += 'width:'+this.getColumnWidth(col)+';';\r
- if(this.cm.isHidden(col)){\r
- style += 'display:none;';\r
- }\r
- var align = this.cm.config[col].align;\r
- if(align){\r
- style += 'text-align:'+align+';';\r
- }\r
- return style;\r
- },\r
-\r
- // private\r
- getColumnWidth : function(col){\r
- var w = this.cm.getColumnWidth(col);\r
- if(typeof w == 'number'){\r
- return (Ext.isBorderBox ? w : (w-this.borderWidth > 0 ? w-this.borderWidth:0)) + 'px';\r
- }\r
- return w;\r
- },\r
-\r
- // private\r
- getTotalWidth : function(){\r
- return this.cm.getTotalWidth()+'px';\r
- },\r
-\r
- // private\r
- fitColumns : function(preventRefresh, onlyExpand, omitColumn){\r
- var cm = this.cm, leftOver, dist, i;\r
- var tw = cm.getTotalWidth(false);\r
- var aw = this.grid.getGridEl().getWidth(true)-this.scrollOffset;\r
-\r
- if(aw < 20){ // not initialized, so don't screw up the default widths\r
- return;\r
- }\r
- var extra = aw - tw;\r
-\r
- if(extra === 0){\r
- return false;\r
- }\r
-\r
- var vc = cm.getColumnCount(true);\r
- var ac = vc-(typeof omitColumn == 'number' ? 1 : 0);\r
- if(ac === 0){\r
- ac = 1;\r
- omitColumn = undefined;\r
- }\r
- var colCount = cm.getColumnCount();\r
- var cols = [];\r
- var extraCol = 0;\r
- var width = 0;\r
- var w;\r
- for (i = 0; i < colCount; i++){\r
- if(!cm.isHidden(i) && !cm.isFixed(i) && i !== omitColumn){\r
- w = cm.getColumnWidth(i);\r
- cols.push(i);\r
- extraCol = i;\r
- cols.push(w);\r
- width += w;\r
- }\r
- }\r
- var frac = (aw - cm.getTotalWidth())/width;\r
- while (cols.length){\r
- w = cols.pop();\r
- i = cols.pop();\r
- cm.setColumnWidth(i, Math.max(this.grid.minColumnWidth, Math.floor(w + w*frac)), true);\r
- }\r
-\r
- if((tw = cm.getTotalWidth(false)) > aw){\r
- var adjustCol = ac != vc ? omitColumn : extraCol;\r
- cm.setColumnWidth(adjustCol, Math.max(1,\r
- cm.getColumnWidth(adjustCol)- (tw-aw)), true);\r
- }\r
-\r
- if(preventRefresh !== true){\r
- this.updateAllColumnWidths();\r
- }\r
-\r
-\r
- return true;\r
- },\r
-\r
- // private\r
- autoExpand : function(preventUpdate){\r
- var g = this.grid, cm = this.cm;\r
- if(!this.userResized && g.autoExpandColumn){\r
- var tw = cm.getTotalWidth(false);\r
- var aw = this.grid.getGridEl().getWidth(true)-this.scrollOffset;\r
- if(tw != aw){\r
- var ci = cm.getIndexById(g.autoExpandColumn);\r
- var currentWidth = cm.getColumnWidth(ci);\r
- var cw = Math.min(Math.max(((aw-tw)+currentWidth), g.autoExpandMin), g.autoExpandMax);\r
- if(cw != currentWidth){\r
- cm.setColumnWidth(ci, cw, true);\r
- if(preventUpdate !== true){\r
- this.updateColumnWidth(ci, cw);\r
- }\r
- }\r
- }\r
- }\r
- },\r
-\r
- // private\r
- getColumnData : function(){\r
- // build a map for all the columns\r
- var cs = [], cm = this.cm, colCount = cm.getColumnCount();\r
- for(var i = 0; i < colCount; i++){\r
- var name = cm.getDataIndex(i);\r
- cs[i] = {\r
- name : (typeof name == 'undefined' ? this.ds.fields.get(i).name : name),\r
- renderer : cm.getRenderer(i),\r
- id : cm.getColumnId(i),\r
- style : this.getColumnStyle(i)\r
- };\r
- }\r
- return cs;\r
- },\r
-\r
- // private\r
- renderRows : function(startRow, endRow){\r
- // pull in all the crap needed to render rows\r
- var g = this.grid, cm = g.colModel, ds = g.store, stripe = g.stripeRows;\r
- var colCount = cm.getColumnCount();\r
-\r
- if(ds.getCount() < 1){\r
- return "";\r
- }\r
-\r
- var cs = this.getColumnData();\r
-\r
- startRow = startRow || 0;\r
- endRow = typeof endRow == "undefined"? ds.getCount()-1 : endRow;\r
-\r
- // records to render\r
- var rs = ds.getRange(startRow, endRow);\r
-\r
- return this.doRender(cs, rs, ds, startRow, colCount, stripe);\r
- },\r
-\r
- // private\r
- renderBody : function(){\r
- var markup = this.renderRows();\r
- return this.templates.body.apply({rows: markup});\r
- },\r
-\r
- // private\r
- refreshRow : function(record){\r
- var ds = this.ds, index;\r
- if(typeof record == 'number'){\r
- index = record;\r
- record = ds.getAt(index);\r
- }else{\r
- index = ds.indexOf(record);\r
- }\r
- var cls = [];\r
- this.insertRows(ds, index, index, true);\r
- this.getRow(index).rowIndex = index;\r
- this.onRemove(ds, record, index+1, true);\r
- this.fireEvent("rowupdated", this, index, record);\r
- },\r
-\r
- \r
- refresh : function(headersToo){\r
- this.fireEvent("beforerefresh", this);\r
- this.grid.stopEditing(true);\r
-\r
- var result = this.renderBody();\r
- this.mainBody.update(result);\r
-\r
- if(headersToo === true){\r
- this.updateHeaders();\r
- this.updateHeaderSortState();\r
- }\r
- this.processRows(0, true);\r
- this.layout();\r
- this.applyEmptyText();\r
- this.fireEvent("refresh", this);\r
- },\r
-\r
- // private\r
- applyEmptyText : function(){\r
- if(this.emptyText && !this.hasRows()){\r
- this.mainBody.update('<div class="x-grid-empty">' + this.emptyText + '</div>');\r
- }\r
- },\r
-\r
- // private\r
- updateHeaderSortState : function(){\r
- var state = this.ds.getSortState();\r
- if(!state){\r
- return;\r
- }\r
- if(!this.sortState || (this.sortState.field != state.field || this.sortState.direction != state.direction)){\r
- this.grid.fireEvent('sortchange', this.grid, state);\r
- }\r
- this.sortState = state;\r
- var sortColumn = this.cm.findColumnIndex(state.field);\r
- if(sortColumn != -1){\r
- var sortDir = state.direction;\r
- this.updateSortIcon(sortColumn, sortDir);\r
- }\r
- },\r
-\r
- // private\r
- destroy : function(){\r
- if(this.colMenu){\r
- Ext.menu.MenuMgr.unregister(this.colMenu);\r
- this.colMenu.destroy();\r
- delete this.colMenu;\r
- }\r
- if(this.hmenu){\r
- Ext.menu.MenuMgr.unregister(this.hmenu);\r
- this.hmenu.destroy();\r
- delete this.hmenu;\r
- }\r
- if(this.grid.enableColumnMove){\r
- var dds = Ext.dd.DDM.ids['gridHeader' + this.grid.getGridEl().id];\r
- if(dds){\r
- for(var dd in dds){\r
- if(!dds[dd].config.isTarget && dds[dd].dragElId){\r
- var elid = dds[dd].dragElId;\r
- dds[dd].unreg();\r
- Ext.get(elid).remove();\r
- } else if(dds[dd].config.isTarget){\r
- dds[dd].proxyTop.remove();\r
- dds[dd].proxyBottom.remove();\r
- dds[dd].unreg();\r
- }\r
- if(Ext.dd.DDM.locationCache[dd]){\r
- delete Ext.dd.DDM.locationCache[dd];\r
- }\r
- }\r
- delete Ext.dd.DDM.ids['gridHeader' + this.grid.getGridEl().id];\r
- }\r
- }\r
- \r
- if(this.dragZone){\r
- this.dragZone.unreg();\r
- }\r
- \r
- Ext.fly(this.innerHd).removeAllListeners();\r
- Ext.removeNode(this.innerHd);\r
- \r
- Ext.destroy(this.resizeMarker, this.resizeProxy, this.focusEl, this.mainBody, \r
- this.scroller, this.mainHd, this.mainWrap, this.dragZone, \r
- this.splitZone, this.columnDrag, this.columnDrop);\r
-\r
- this.initData(null, null);\r
- Ext.EventManager.removeResizeListener(this.onWindowResize, this);\r
- this.purgeListeners();\r
- },\r
-\r
- // private\r
- onDenyColumnHide : function(){\r
-\r
- },\r
-\r
- // private\r
- render : function(){\r
- if(this.autoFill){\r
- var ct = this.grid.ownerCt;\r
- if (ct && ct.getLayout()){\r
- ct.on('afterlayout', function(){ \r
- this.fitColumns(true, true);\r
- this.updateHeaders(); \r
- }, this, {single: true}); \r
- }else{ \r
- this.fitColumns(true, true); \r
- }\r
- }else if(this.forceFit){\r
- this.fitColumns(true, false);\r
- }else if(this.grid.autoExpandColumn){\r
- this.autoExpand(true);\r
- }\r
-\r
- this.renderUI();\r
- },\r
-\r
- \r
- // private\r
- initData : function(ds, cm){\r
- if(this.ds){\r
- this.ds.un("load", this.onLoad, this);\r
- this.ds.un("datachanged", this.onDataChange, this);\r
- this.ds.un("add", this.onAdd, this);\r
- this.ds.un("remove", this.onRemove, this);\r
- this.ds.un("update", this.onUpdate, this);\r
- this.ds.un("clear", this.onClear, this);\r
- }\r
- if(ds){\r
- ds.on("load", this.onLoad, this);\r
- ds.on("datachanged", this.onDataChange, this);\r
- ds.on("add", this.onAdd, this);\r
- ds.on("remove", this.onRemove, this);\r
- ds.on("update", this.onUpdate, this);\r
- ds.on("clear", this.onClear, this);\r
- }\r
- this.ds = ds;\r
-\r
- if(this.cm){\r
- this.cm.un("configchange", this.onColConfigChange, this);\r
- this.cm.un("widthchange", this.onColWidthChange, this);\r
- this.cm.un("headerchange", this.onHeaderChange, this);\r
- this.cm.un("hiddenchange", this.onHiddenChange, this);\r
- this.cm.un("columnmoved", this.onColumnMove, this);\r
- this.cm.un("columnlockchange", this.onColumnLock, this);\r
- }\r
- if(cm){\r
- delete this.lastViewWidth;\r
- cm.on("configchange", this.onColConfigChange, this);\r
- cm.on("widthchange", this.onColWidthChange, this);\r
- cm.on("headerchange", this.onHeaderChange, this);\r
- cm.on("hiddenchange", this.onHiddenChange, this);\r
- cm.on("columnmoved", this.onColumnMove, this);\r
- cm.on("columnlockchange", this.onColumnLock, this);\r
- }\r
- this.cm = cm;\r
- },\r
-\r
- // private\r
- onDataChange : function(){\r
- this.refresh();\r
- this.updateHeaderSortState();\r
- this.syncFocusEl(0);\r
- },\r
-\r
- // private\r
- onClear : function(){\r
- this.refresh();\r
- this.syncFocusEl(0);\r
- },\r
-\r
- // private\r
- onUpdate : function(ds, record){\r
- this.refreshRow(record);\r
- },\r
-\r
- // private\r
- onAdd : function(ds, records, index){\r
- this.insertRows(ds, index, index + (records.length-1));\r
- },\r
-\r
- // private\r
- onRemove : function(ds, record, index, isUpdate){\r
- if(isUpdate !== true){\r
- this.fireEvent("beforerowremoved", this, index, record);\r
- }\r
- this.removeRow(index);\r
- if(isUpdate !== true){\r
- this.processRows(index);\r
- this.applyEmptyText();\r
- this.fireEvent("rowremoved", this, index, record);\r
- }\r
- },\r
-\r
- // private\r
- onLoad : function(){\r
- this.scrollToTop();\r
- },\r
-\r
- // private\r
- onColWidthChange : function(cm, col, width){\r
- this.updateColumnWidth(col, width);\r
- },\r
-\r
- // private\r
- onHeaderChange : function(cm, col, text){\r
- this.updateHeaders();\r
- },\r
-\r
- // private\r
- onHiddenChange : function(cm, col, hidden){\r
- this.updateColumnHidden(col, hidden);\r
- },\r
-\r
- // private\r
- onColumnMove : function(cm, oldIndex, newIndex){\r
- this.indexMap = null;\r
- var s = this.getScrollState();\r
- this.refresh(true);\r
- this.restoreScroll(s);\r
- this.afterMove(newIndex);\r
- },\r
-\r
- // private\r
- onColConfigChange : function(){\r
- delete this.lastViewWidth;\r
- this.indexMap = null;\r
- this.refresh(true);\r
- },\r
-\r
- \r
- // private\r
- initUI : function(grid){\r
- grid.on("headerclick", this.onHeaderClick, this);\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
-\r
- },\r
-\r
- // private\r
- onHeaderClick : function(g, index){\r
- if(this.headersDisabled || !this.cm.isSortable(index)){\r
- return;\r
- }\r
- g.stopEditing(true);\r
- g.store.sort(this.cm.getDataIndex(index));\r
- },\r
-\r
- // private\r
- onRowOver : function(e, t){\r
- var row;\r
- if((row = this.findRowIndex(t)) !== false){\r
- this.addRowClass(row, "x-grid3-row-over");\r
- }\r
- },\r
-\r
- // private\r
- onRowOut : function(e, t){\r
- var row;\r
- if((row = this.findRowIndex(t)) !== false && !e.within(this.getRow(row), true)){\r
- this.removeRowClass(row, "x-grid3-row-over");\r
- }\r
- },\r
-\r
- // private\r
- handleWheel : function(e){\r
- e.stopPropagation();\r
- },\r
-\r
- // private\r
- onRowSelect : function(row){\r
- this.addRowClass(row, "x-grid3-row-selected");\r
- },\r
-\r
- // private\r
- onRowDeselect : function(row){\r
- this.removeRowClass(row, "x-grid3-row-selected");\r
- },\r
-\r
- // private\r
- onCellSelect : function(row, col){\r
- var cell = this.getCell(row, col);\r
- if(cell){\r
- this.fly(cell).addClass("x-grid3-cell-selected");\r
- }\r
- },\r
-\r
- // private\r
- onCellDeselect : function(row, col){\r
- var cell = this.getCell(row, col);\r
- if(cell){\r
- this.fly(cell).removeClass("x-grid3-cell-selected");\r
- }\r
- },\r
-\r
- // private\r
- onColumnSplitterMoved : function(i, w){\r
- this.userResized = true;\r
- var cm = this.grid.colModel;\r
- cm.setColumnWidth(i, w, true);\r
-\r
- if(this.forceFit){\r
- this.fitColumns(true, false, i);\r
- this.updateAllColumnWidths();\r
- }else{\r
- this.updateColumnWidth(i, w);\r
- this.syncHeaderScroll();\r
- }\r
-\r
- this.grid.fireEvent("columnresize", i, w);\r
- },\r
-\r
- // private\r
- handleHdMenuClick : function(item){\r
- var index = this.hdCtxIndex;\r
- var cm = this.cm, ds = this.ds;\r
- switch(item.id){\r
- case "asc":\r
- ds.sort(cm.getDataIndex(index), "ASC");\r
- break;\r
- case "desc":\r
- ds.sort(cm.getDataIndex(index), "DESC");\r
- break;\r
- default:\r
- index = cm.getIndexById(item.id.substr(4));\r
- if(index != -1){\r
- if(item.checked && cm.getColumnsBy(this.isHideableColumn, this).length <= 1){\r
- this.onDenyColumnHide();\r
- return false;\r
- }\r
- cm.setHidden(index, item.checked);\r
- }\r
- }\r
- return true;\r
- },\r
-\r
- // private\r
- isHideableColumn : function(c){\r
- return !c.hidden && !c.fixed;\r
- },\r
-\r
- // private\r
- beforeColMenuShow : function(){\r
- var cm = this.cm, colCount = cm.getColumnCount();\r
- this.colMenu.removeAll();\r
- for(var i = 0; i < colCount; i++){\r
- if(cm.config[i].fixed !== true && cm.config[i].hideable !== false){\r
- this.colMenu.add(new Ext.menu.CheckItem({\r
- id: "col-"+cm.getColumnId(i),\r
- text: cm.getColumnHeader(i),\r
- checked: !cm.isHidden(i),\r
- hideOnClick:false,\r
- disabled: cm.config[i].hideable === false\r
- }));\r
- }\r
- }\r
- },\r
-\r
- // private\r
- handleHdDown : function(e, t){\r
- if(Ext.fly(t).hasClass('x-grid3-hd-btn')){\r
- e.stopEvent();\r
- var hd = this.findHeaderCell(t);\r
- Ext.fly(hd).addClass('x-grid3-hd-menu-open');\r
- var index = this.getCellIndex(hd);\r
- this.hdCtxIndex = index;\r
- var ms = this.hmenu.items, cm = this.cm;\r
- ms.get("asc").setDisabled(!cm.isSortable(index));\r
- ms.get("desc").setDisabled(!cm.isSortable(index));\r
- this.hmenu.on("hide", function(){\r
- Ext.fly(hd).removeClass('x-grid3-hd-menu-open');\r
- }, this, {single:true});\r
- this.hmenu.show(t, "tl-bl?");\r
- }\r
- },\r
-\r
- // private\r
- handleHdOver : function(e, t){\r
- var hd = this.findHeaderCell(t);\r
- if(hd && !this.headersDisabled){\r
- this.activeHd = hd;\r
- this.activeHdIndex = this.getCellIndex(hd);\r
- var fly = this.fly(hd);\r
- this.activeHdRegion = fly.getRegion();\r
- if(!this.cm.isMenuDisabled(this.activeHdIndex)){\r
- fly.addClass("x-grid3-hd-over");\r
- this.activeHdBtn = fly.child('.x-grid3-hd-btn');\r
- if(this.activeHdBtn){\r
- this.activeHdBtn.dom.style.height = (hd.firstChild.offsetHeight-1)+'px';\r
- }\r
- }\r
- }\r
- },\r
-\r
- // private\r
- handleHdMove : function(e, t){\r
- if(this.activeHd && !this.headersDisabled){\r
- var hw = this.splitHandleWidth || 5;\r
- var r = this.activeHdRegion;\r
- var x = e.getPageX();\r
- var ss = this.activeHd.style;\r
- if(x - r.left <= hw && this.cm.isResizable(this.activeHdIndex-1)){\r
- ss.cursor = Ext.isAir ? 'move' : Ext.isSafari ? 'e-resize' : 'col-resize'; // col-resize not always supported\r
- }else if(r.right - x <= (!this.activeHdBtn ? hw : 2) && this.cm.isResizable(this.activeHdIndex)){\r
- ss.cursor = Ext.isAir ? 'move' : Ext.isSafari ? 'w-resize' : 'col-resize';\r
- }else{\r
- ss.cursor = '';\r
- }\r
- }\r
- },\r
-\r
- // private\r
- handleHdOut : function(e, t){\r
- var hd = this.findHeaderCell(t);\r
- if(hd && (!Ext.isIE || !e.within(hd, true))){\r
- this.activeHd = null;\r
- this.fly(hd).removeClass("x-grid3-hd-over");\r
- hd.style.cursor = '';\r
- }\r
- },\r
-\r
- // private\r
- hasRows : function(){\r
- var fc = this.mainBody.dom.firstChild;\r
- return fc && fc.className != 'x-grid-empty';\r
- },\r
-\r
- // back compat\r
- bind : function(d, c){\r
- this.initData(d, c);\r
- }\r
-});\r
-\r
-\r
-// private\r
-// This is a support class used internally by the Grid components\r
-Ext.grid.GridView.SplitDragZone = function(grid, hd){\r
- this.grid = grid;\r
- this.view = grid.getView();\r
- this.marker = this.view.resizeMarker;\r
- this.proxy = this.view.resizeProxy;\r
- Ext.grid.GridView.SplitDragZone.superclass.constructor.call(this, hd,\r
- "gridSplitters" + this.grid.getGridEl().id, {\r
- dragElId : Ext.id(this.proxy.dom), resizeFrame:false\r
- });\r
- this.scroll = false;\r
- this.hw = this.view.splitHandleWidth || 5;\r
-};\r
-Ext.extend(Ext.grid.GridView.SplitDragZone, Ext.dd.DDProxy, {\r
-\r
- b4StartDrag : function(x, y){\r
- this.view.headersDisabled = true;\r
- var h = this.view.mainWrap.getHeight();\r
- this.marker.setHeight(h);\r
- this.marker.show();\r
- this.marker.alignTo(this.view.getHeaderCell(this.cellIndex), 'tl-tl', [-2, 0]);\r
- this.proxy.setHeight(h);\r
- var w = this.cm.getColumnWidth(this.cellIndex);\r
- var minw = Math.max(w-this.grid.minColumnWidth, 0);\r
- this.resetConstraints();\r
- this.setXConstraint(minw, 1000);\r
- this.setYConstraint(0, 0);\r
- this.minX = x - minw;\r
- this.maxX = x + 1000;\r
- this.startPos = x;\r
- Ext.dd.DDProxy.prototype.b4StartDrag.call(this, x, y);\r
- },\r
-\r
-\r
- handleMouseDown : function(e){\r
- var t = this.view.findHeaderCell(e.getTarget());\r
- if(t){\r
- var xy = this.view.fly(t).getXY(), x = xy[0], y = xy[1];\r
- var exy = e.getXY(), ex = exy[0], ey = exy[1];\r
- var w = t.offsetWidth, adjust = false;\r
- if((ex - x) <= this.hw){\r
- adjust = -1;\r
- }else if((x+w) - ex <= this.hw){\r
- adjust = 0;\r
- }\r
- if(adjust !== false){\r
- this.cm = this.grid.colModel;\r
- var ci = this.view.getCellIndex(t);\r
- if(adjust == -1){\r
- if (ci + adjust < 0) {\r
- return;\r
- }\r
- while(this.cm.isHidden(ci+adjust)){\r
- --adjust;\r
- if(ci+adjust < 0){\r
- return;\r
- }\r
- }\r
- }\r
- this.cellIndex = ci+adjust;\r
- this.split = t.dom;\r
- if(this.cm.isResizable(this.cellIndex) && !this.cm.isFixed(this.cellIndex)){\r
- Ext.grid.GridView.SplitDragZone.superclass.handleMouseDown.apply(this, arguments);\r
- }\r
- }else if(this.view.columnDrag){\r
- this.view.columnDrag.callHandleMouseDown(e);\r
- }\r
- }\r
- },\r
-\r
- endDrag : function(e){\r
- this.marker.hide();\r
- var v = this.view;\r
- var endX = Math.max(this.minX, e.getPageX());\r
- var diff = endX - this.startPos;\r
- v.onColumnSplitterMoved(this.cellIndex, this.cm.getColumnWidth(this.cellIndex)+diff);\r
- setTimeout(function(){\r
- v.headersDisabled = false;\r
- }, 50);\r
- },\r
-\r
- autoOffset : function(){\r
- this.setDelta(0,0);\r
- }\r
-});\r
-\r
-\r
-Ext.grid.GroupingView = Ext.extend(Ext.grid.GridView, {\r
- \r
- hideGroupedColumn:false,\r
- \r
- showGroupName:true,\r
- \r
- startCollapsed:false,\r
- \r
- enableGrouping:true,\r
- \r
- enableGroupingMenu:true,\r
- \r
- enableNoGroups:true,\r
- \r
- emptyGroupText : '(None)',\r
- \r
- ignoreAdd: false,\r
- \r
- groupTextTpl : '{text}',\r
- \r
- \r
-\r
- // private\r
- gidSeed : 1000,\r
-\r
- // private\r
- initTemplates : function(){\r
- Ext.grid.GroupingView.superclass.initTemplates.call(this);\r
- this.state = {};\r
-\r
- var sm = this.grid.getSelectionModel();\r
- sm.on(sm.selectRow ? 'beforerowselect' : 'beforecellselect',\r
- this.onBeforeRowSelect, this);\r
-\r
- if(!this.startGroup){\r
- this.startGroup = new Ext.XTemplate(\r
- '<div id="{groupId}" class="x-grid-group {cls}">',\r
- '<div id="{groupId}-hd" class="x-grid-group-hd" style="{style}"><div>', this.groupTextTpl ,'</div></div>',\r
- '<div id="{groupId}-bd" class="x-grid-group-body">'\r
- );\r
- }\r
- this.startGroup.compile();\r
- this.endGroup = '</div></div>';\r
- },\r
-\r
- // private\r
- findGroup : function(el){\r
- return Ext.fly(el).up('.x-grid-group', this.mainBody.dom);\r
- },\r
-\r
- // private\r
- getGroups : function(){\r
- return this.hasRows() ? this.mainBody.dom.childNodes : [];\r
- },\r
-\r
- // private\r
- onAdd : function(){\r
- if(this.enableGrouping && !this.ignoreAdd){\r
- var ss = this.getScrollState();\r
- this.refresh();\r
- this.restoreScroll(ss);\r
- }else if(!this.enableGrouping){\r
- Ext.grid.GroupingView.superclass.onAdd.apply(this, arguments);\r
- }\r
- },\r
-\r
- // private\r
- onRemove : function(ds, record, index, isUpdate){\r
- Ext.grid.GroupingView.superclass.onRemove.apply(this, arguments);\r
- var g = document.getElementById(record._groupId);\r
- if(g && g.childNodes[1].childNodes.length < 1){\r
- Ext.removeNode(g);\r
- }\r
- this.applyEmptyText();\r
- },\r
-\r
- // private\r
- refreshRow : function(record){\r
- if(this.ds.getCount()==1){\r
- this.refresh();\r
- }else{\r
- this.isUpdating = true;\r
- Ext.grid.GroupingView.superclass.refreshRow.apply(this, arguments);\r
- this.isUpdating = false;\r
- }\r
- },\r
-\r
- // private\r
- beforeMenuShow : function(){\r
- var field = this.getGroupField();\r
- var g = this.hmenu.items.get('groupBy');\r
- if(g){\r
- g.setDisabled(this.cm.config[this.hdCtxIndex].groupable === false);\r
- }\r
- var s = this.hmenu.items.get('showGroups');\r
- if(s){\r
- s.setDisabled(!field && this.cm.config[this.hdCtxIndex].groupable === false);\r
- s.setChecked(!!field, true);\r
- }\r
- },\r
-\r
- // private\r
- renderUI : function(){\r
- Ext.grid.GroupingView.superclass.renderUI.call(this);\r
- this.mainBody.on('mousedown', this.interceptMouse, this);\r
-\r
- if(this.enableGroupingMenu && this.hmenu){\r
- this.hmenu.add('-',{\r
- id:'groupBy',\r
- text: this.groupByText,\r
- handler: this.onGroupByClick,\r
- scope: this,\r
- iconCls:'x-group-by-icon'\r
- });\r
- if(this.enableNoGroups){\r
- this.hmenu.add({\r
- id:'showGroups',\r
- text: this.showGroupsText,\r
- checked: true,\r
- checkHandler: this.onShowGroupsClick,\r
- scope: this\r
- });\r
- }\r
- this.hmenu.on('beforeshow', this.beforeMenuShow, this);\r
- }\r
- },\r
-\r
- // private\r
- onGroupByClick : function(){\r
- this.grid.store.groupBy(this.cm.getDataIndex(this.hdCtxIndex));\r
- this.beforeMenuShow(); // Make sure the checkboxes get properly set when changing groups\r
- },\r
-\r
- // private\r
- onShowGroupsClick : function(mi, checked){\r
- if(checked){\r
- this.onGroupByClick();\r
- }else{\r
- this.grid.store.clearGrouping();\r
- }\r
- },\r
-\r
- \r
- toggleGroup : function(group, expanded){\r
- this.grid.stopEditing(true);\r
- group = Ext.getDom(group);\r
- var gel = Ext.fly(group);\r
- expanded = expanded !== undefined ?\r
- expanded : gel.hasClass('x-grid-group-collapsed');\r
-\r
- this.state[gel.dom.id] = expanded;\r
- gel[expanded ? 'removeClass' : 'addClass']('x-grid-group-collapsed');\r
- },\r
-\r
- \r
- toggleAllGroups : function(expanded){\r
- var groups = this.getGroups();\r
- for(var i = 0, len = groups.length; i < len; i++){\r
- this.toggleGroup(groups[i], expanded);\r
- }\r
- },\r
-\r
- \r
- expandAllGroups : function(){\r
- this.toggleAllGroups(true);\r
- },\r
-\r
- \r
- collapseAllGroups : function(){\r
- this.toggleAllGroups(false);\r
- },\r
-\r
- // private\r
- interceptMouse : function(e){\r
- var hd = e.getTarget('.x-grid-group-hd', this.mainBody);\r
- if(hd){\r
- e.stopEvent();\r
- this.toggleGroup(hd.parentNode);\r
- }\r
- },\r
-\r
- // private\r
- getGroup : function(v, r, groupRenderer, rowIndex, colIndex, ds){\r
- var g = groupRenderer ? groupRenderer(v, {}, r, rowIndex, colIndex, ds) : String(v);\r
- if(g === ''){\r
- g = this.cm.config[colIndex].emptyGroupText || this.emptyGroupText;\r
- }\r
- return g;\r
- },\r
-\r
- // private\r
- getGroupField : function(){\r
- return this.grid.store.getGroupState();\r
- },\r
-\r
- // private\r
- renderRows : function(){\r
- var groupField = this.getGroupField();\r
- var eg = !!groupField;\r
- // if they turned off grouping and the last grouped field is hidden\r
- if(this.hideGroupedColumn) {\r
- var colIndex = this.cm.findColumnIndex(groupField);\r
- if(!eg && this.lastGroupField !== undefined) {\r
- this.mainBody.update('');\r
- this.cm.setHidden(this.cm.findColumnIndex(this.lastGroupField), false);\r
- delete this.lastGroupField;\r
- }else if (eg && this.lastGroupField === undefined) {\r
- this.lastGroupField = groupField;\r
- this.cm.setHidden(colIndex, true);\r
- }else if (eg && this.lastGroupField !== undefined && groupField !== this.lastGroupField) {\r
- this.mainBody.update('');\r
- var oldIndex = this.cm.findColumnIndex(this.lastGroupField);\r
- this.cm.setHidden(oldIndex, false);\r
- this.lastGroupField = groupField;\r
- this.cm.setHidden(colIndex, true);\r
- }\r
- }\r
- return Ext.grid.GroupingView.superclass.renderRows.apply(\r
- this, arguments);\r
- },\r
-\r
- // private\r
- doRender : function(cs, rs, ds, startRow, colCount, stripe){\r
- if(rs.length < 1){\r
- return '';\r
- }\r
- var groupField = this.getGroupField();\r
- var colIndex = this.cm.findColumnIndex(groupField);\r
-\r
- this.enableGrouping = !!groupField;\r
-\r
- if(!this.enableGrouping || this.isUpdating){\r
- return Ext.grid.GroupingView.superclass.doRender.apply(\r
- this, arguments);\r
- }\r
- var gstyle = 'width:'+this.getTotalWidth()+';';\r
-\r
- var gidPrefix = this.grid.getGridEl().id;\r
- var cfg = this.cm.config[colIndex];\r
- var groupRenderer = cfg.groupRenderer || cfg.renderer;\r
- var prefix = this.showGroupName ?\r
- (cfg.groupName || cfg.header)+': ' : '';\r
-\r
- var groups = [], curGroup, i, len, gid;\r
- for(i = 0, len = rs.length; i < len; i++){\r
- var rowIndex = startRow + i;\r
- var r = rs[i],\r
- gvalue = r.data[groupField],\r
- g = this.getGroup(gvalue, r, groupRenderer, rowIndex, colIndex, ds);\r
- if(!curGroup || curGroup.group != g){\r
- gid = gidPrefix + '-gp-' + groupField + '-' + Ext.util.Format.htmlEncode(g);\r
- // if state is defined use it, however state is in terms of expanded\r
- // so negate it, otherwise use the default.\r
- var isCollapsed = typeof this.state[gid] !== 'undefined' ? !this.state[gid] : this.startCollapsed;\r
- var gcls = isCollapsed ? 'x-grid-group-collapsed' : ''; \r
- curGroup = {\r
- group: g,\r
- gvalue: gvalue,\r
- text: prefix + g,\r
- groupId: gid,\r
- startRow: rowIndex,\r
- rs: [r],\r
- cls: gcls,\r
- style: gstyle\r
- };\r
- groups.push(curGroup);\r
- }else{\r
- curGroup.rs.push(r);\r
- }\r
- r._groupId = gid;\r
- }\r
-\r
- var buf = [];\r
- for(i = 0, len = groups.length; i < len; i++){\r
- var g = groups[i];\r
- this.doGroupStart(buf, g, cs, ds, colCount);\r
- buf[buf.length] = Ext.grid.GroupingView.superclass.doRender.call(\r
- this, cs, g.rs, ds, g.startRow, colCount, stripe);\r
-\r
- this.doGroupEnd(buf, g, cs, ds, colCount);\r
- }\r
- return buf.join('');\r
- },\r
-\r
- \r
- getGroupId : function(value){\r
- var gidPrefix = this.grid.getGridEl().id;\r
- var groupField = this.getGroupField();\r
- var colIndex = this.cm.findColumnIndex(groupField);\r
- var cfg = this.cm.config[colIndex];\r
- var groupRenderer = cfg.groupRenderer || cfg.renderer;\r
- var gtext = this.getGroup(value, {data:{}}, groupRenderer, 0, colIndex, this.ds);\r
- return gidPrefix + '-gp-' + groupField + '-' + Ext.util.Format.htmlEncode(value);\r
- },\r
-\r
- // private\r
- doGroupStart : function(buf, g, cs, ds, colCount){\r
- buf[buf.length] = this.startGroup.apply(g);\r
- },\r
-\r
- // private\r
- doGroupEnd : function(buf, g, cs, ds, colCount){\r
- buf[buf.length] = this.endGroup;\r
- },\r
-\r
- // private\r
- getRows : function(){\r
- if(!this.enableGrouping){\r
- return Ext.grid.GroupingView.superclass.getRows.call(this);\r
- }\r
- var r = [];\r
- var g, gs = this.getGroups();\r
- for(var i = 0, len = gs.length; i < len; i++){\r
- g = gs[i].childNodes[1].childNodes;\r
- for(var j = 0, jlen = g.length; j < jlen; j++){\r
- r[r.length] = g[j];\r
- }\r
- }\r
- return r;\r
- },\r
-\r
- // private\r
- updateGroupWidths : function(){\r
- if(!this.enableGrouping || !this.hasRows()){\r
- return;\r
- }\r
- var tw = Math.max(this.cm.getTotalWidth(), this.el.dom.offsetWidth-this.scrollOffset) +'px';\r
- var gs = this.getGroups();\r
- for(var i = 0, len = gs.length; i < len; i++){\r
- gs[i].firstChild.style.width = tw;\r
- }\r
- },\r
-\r
- // private\r
- onColumnWidthUpdated : function(col, w, tw){\r
- Ext.grid.GroupingView.superclass.onColumnWidthUpdated.call(this, col, w, tw);\r
- this.updateGroupWidths();\r
- },\r
-\r
- // private\r
- onAllColumnWidthsUpdated : function(ws, tw){\r
- Ext.grid.GroupingView.superclass.onAllColumnWidthsUpdated.call(this, ws, tw);\r
- this.updateGroupWidths();\r
- },\r
-\r
- // private\r
- onColumnHiddenUpdated : function(col, hidden, tw){\r
- Ext.grid.GroupingView.superclass.onColumnHiddenUpdated.call(this, col, hidden, tw);\r
- this.updateGroupWidths();\r
- },\r
-\r
- // private\r
- onLayout : function(){\r
- this.updateGroupWidths();\r
- },\r
-\r
- // private\r
- onBeforeRowSelect : function(sm, rowIndex){\r
- if(!this.enableGrouping){\r
- return;\r
- }\r
- var row = this.getRow(rowIndex);\r
- if(row && !row.offsetParent){\r
- var g = this.findGroup(row);\r
- this.toggleGroup(g, true);\r
- }\r
- },\r
-\r
- \r
- groupByText: 'Group By This Field',\r
- \r
- showGroupsText: 'Show in Groups'\r
-});\r
-// private\r
-Ext.grid.GroupingView.GROUP_ID = 1000;\r
-// private\r
-// This is a support class used internally by the Grid components\r
-Ext.grid.HeaderDragZone = function(grid, hd, hd2){\r
- this.grid = grid;\r
- this.view = grid.getView();\r
- this.ddGroup = "gridHeader" + this.grid.getGridEl().id;\r
- Ext.grid.HeaderDragZone.superclass.constructor.call(this, hd);\r
- if(hd2){\r
- this.setHandleElId(Ext.id(hd));\r
- this.setOuterHandleElId(Ext.id(hd2));\r
- }\r
- this.scroll = false;\r
-};\r
-Ext.extend(Ext.grid.HeaderDragZone, Ext.dd.DragZone, {\r
- maxDragWidth: 120,\r
- getDragData : function(e){\r
- var t = Ext.lib.Event.getTarget(e);\r
- var h = this.view.findHeaderCell(t);\r
- if(h){\r
- return {ddel: h.firstChild, header:h};\r
- }\r
- return false;\r
- },\r
-\r
- onInitDrag : function(e){\r
- this.view.headersDisabled = true;\r
- var clone = this.dragData.ddel.cloneNode(true);\r
- clone.id = Ext.id();\r
- clone.style.width = Math.min(this.dragData.header.offsetWidth,this.maxDragWidth) + "px";\r
- this.proxy.update(clone);\r
- return true;\r
- },\r
-\r
- afterValidDrop : function(){\r
- var v = this.view;\r
- setTimeout(function(){\r
- v.headersDisabled = false;\r
- }, 50);\r
- },\r
-\r
- afterInvalidDrop : function(){\r
- var v = this.view;\r
- setTimeout(function(){\r
- v.headersDisabled = false;\r
- }, 50);\r
- }\r
-});\r
-\r
-// private\r
-// This is a support class used internally by the Grid components\r
-Ext.grid.HeaderDropZone = function(grid, hd, hd2){\r
- this.grid = grid;\r
- this.view = grid.getView();\r
- // split the proxies so they don't interfere with mouse events\r
- this.proxyTop = Ext.DomHelper.append(document.body, {\r
- cls:"col-move-top", html:" "\r
- }, true);\r
- this.proxyBottom = Ext.DomHelper.append(document.body, {\r
- cls:"col-move-bottom", html:" "\r
- }, true);\r
- this.proxyTop.hide = this.proxyBottom.hide = function(){\r
- this.setLeftTop(-100,-100);\r
- this.setStyle("visibility", "hidden");\r
- };\r
- this.ddGroup = "gridHeader" + this.grid.getGridEl().id;\r
- // temporarily disabled\r
- //Ext.dd.ScrollManager.register(this.view.scroller.dom);\r
- Ext.grid.HeaderDropZone.superclass.constructor.call(this, grid.getGridEl().dom);\r
-};\r
-Ext.extend(Ext.grid.HeaderDropZone, Ext.dd.DropZone, {\r
- proxyOffsets : [-4, -9],\r
- fly: Ext.Element.fly,\r
-\r
- getTargetFromEvent : function(e){\r
- var t = Ext.lib.Event.getTarget(e);\r
- var cindex = this.view.findCellIndex(t);\r
- if(cindex !== false){\r
- return this.view.getHeaderCell(cindex);\r