+++ /dev/null
-/*\r
- * Ext JS Library 2.2.1\r
- * Copyright(c) 2006-2009, Ext JS, LLC.\r
- * licensing@extjs.com\r
- * \r
- * http://extjs.com/license\r
- */\r
-\r
-Ext.debug = {};\r
-\r
-(function(){\r
-\r
-var cp;\r
-\r
-function createConsole(){\r
-\r
- var scriptPanel = new Ext.debug.ScriptsPanel();\r
- var logView = new Ext.debug.LogPanel();\r
- var tree = new Ext.debug.DomTree();\r
-\r
- var tabs = new Ext.TabPanel({\r
- activeTab: 0,\r
- border: false,\r
- tabPosition: 'bottom',\r
- items: [{\r
- title: 'Debug Console',\r
- layout:'border',\r
- items: [logView, scriptPanel]\r
- },{\r
- title: 'DOM Inspector',\r
- layout:'border',\r
- items: [tree]\r
- }]\r
- });\r
-\r
- cp = new Ext.Panel({\r
- id: 'x-debug-browser',\r
- title: 'Console',\r
- collapsible: true,\r
- animCollapse: false,\r
- style: 'position:absolute;left:0;bottom:0;',\r
- height:200,\r
- logView: logView,\r
- layout: 'fit',\r
- \r
- tools:[{\r
- id: 'close',\r
- handler: function(){\r
- cp.destroy();\r
- cp = null;\r
- Ext.EventManager.removeResizeListener(handleResize);\r
- }\r
- }],\r
-\r
- items: tabs\r
- });\r
-\r
- cp.render(document.body);\r
-\r
- cp.resizer = new Ext.Resizable(cp.el, {\r
- minHeight:50,\r
- handles: "n",\r
- pinned: true,\r
- transparent:true,\r
- resizeElement : function(){\r
- var box = this.proxy.getBox();\r
- this.proxy.hide();\r
- cp.setHeight(box.height);\r
- return box;\r
- }\r
- });\r
-\r
- function handleResize(){\r
- cp.setWidth(Ext.getBody().getViewSize().width);\r
- }\r
- Ext.EventManager.onWindowResize(handleResize);\r
-\r
- handleResize();\r
-}\r
-\r
-\r
-Ext.apply(Ext, {\r
- log : function(){\r
- if(!cp){\r
- createConsole();\r
- }\r
- cp.logView.log.apply(cp.logView, arguments);\r
- },\r
-\r
- logf : function(format, arg1, arg2, etc){\r
- Ext.log(String.format.apply(String, arguments));\r
- },\r
-\r
- dump : function(o){\r
- if(typeof o == 'string' || typeof o == 'number' || typeof o == 'undefined' || Ext.isDate(o)){\r
- Ext.log(o);\r
- }else if(!o){\r
- Ext.log("null");\r
- }else if(typeof o != "object"){\r
- Ext.log('Unknown return type');\r
- }else if(Ext.isArray(o)){\r
- Ext.log('['+o.join(',')+']');\r
- }else{\r
- var b = ["{\n"];\r
- for(var key in o){\r
- var to = typeof o[key];\r
- if(to != "function" && to != "object"){\r
- b.push(String.format(" {0}: {1},\n", key, o[key]));\r
- }\r
- }\r
- var s = b.join("");\r
- if(s.length > 3){\r
- s = s.substr(0, s.length-2);\r
- }\r
- Ext.log(s + "\n}");\r
- }\r
- },\r
-\r
- _timers : {},\r
-\r
- time : function(name){\r
- name = name || "def";\r
- Ext._timers[name] = new Date().getTime();\r
- },\r
-\r
- timeEnd : function(name, printResults){\r
- var t = new Date().getTime();\r
- name = name || "def";\r
- var v = String.format("{0} ms", t-Ext._timers[name]);\r
- Ext._timers[name] = new Date().getTime();\r
- if(printResults !== false){\r
- Ext.log('Timer ' + (name == "def" ? v : name + ": " + v));\r
- }\r
- return v;\r
- }\r
-});\r
-\r
-})();\r
-\r
-\r
-Ext.debug.ScriptsPanel = Ext.extend(Ext.Panel, {\r
- id:'x-debug-scripts',\r
- region: 'east',\r
- minWidth: 200,\r
- split: true,\r
- width: 350,\r
- border: false,\r
- layout:'anchor',\r
- style:'border-width:0 0 0 1px;',\r
-\r
- initComponent : function(){\r
-\r
- this.scriptField = new Ext.form.TextArea({\r
- anchor: '100% -26',\r
- style:'border-width:0;'\r
- });\r
-\r
- this.trapBox = new Ext.form.Checkbox({\r
- id: 'console-trap',\r
- boxLabel: 'Trap Errors',\r
- checked: true\r
- });\r
-\r
- this.toolbar = new Ext.Toolbar([{\r
- text: 'Run',\r
- scope: this,\r
- handler: this.evalScript\r
- },{\r
- text: 'Clear',\r
- scope: this,\r
- handler: this.clear\r
- },\r
- '->',\r
- this.trapBox,\r
- ' ', ' '\r
- ]);\r
-\r
- this.items = [this.toolbar, this.scriptField];\r
-\r
- Ext.debug.ScriptsPanel.superclass.initComponent.call(this);\r
- },\r
-\r
- evalScript : function(){\r
- var s = this.scriptField.getValue();\r
- if(this.trapBox.getValue()){\r
- try{\r
- var rt = eval(s);\r
- Ext.dump(rt === undefined? '(no return)' : rt);\r
- }catch(e){\r
- Ext.log(e.message || e.descript);\r
- }\r
- }else{\r
- var rt = eval(s);\r
- Ext.dump(rt === undefined? '(no return)' : rt);\r
- }\r
- },\r
-\r
- clear : function(){\r
- this.scriptField.setValue('');\r
- this.scriptField.focus();\r
- }\r
-\r
-});\r
-\r
-Ext.debug.LogPanel = Ext.extend(Ext.Panel, {\r
- autoScroll: true,\r
- region: 'center',\r
- border: false,\r
- style:'border-width:0 1px 0 0',\r
-\r
- log : function(){\r
- var markup = [ '<div style="padding:5px !important;border-bottom:1px solid #ccc;">',\r
- Ext.util.Format.htmlEncode(Array.prototype.join.call(arguments, ', ')).replace(/\n/g, '<br />').replace(/\s/g, ' '),\r
- '</div>'].join('');\r
-\r
- this.body.insertHtml('beforeend', markup);\r
- this.body.scrollTo('top', 100000);\r
- },\r
-\r
- clear : function(){\r
- this.body.update('');\r
- this.body.dom.scrollTop = 0;\r
- }\r
-});\r
-\r
-Ext.debug.DomTree = Ext.extend(Ext.tree.TreePanel, {\r
- enableDD:false ,\r
- lines:false,\r
- rootVisible:false,\r
- animate:false,\r
- hlColor:'ffff9c',\r
- autoScroll: true,\r
- region:'center',\r
- border:false,\r
-\r
- initComponent : function(){\r
-\r
-\r
- Ext.debug.DomTree.superclass.initComponent.call(this);\r
- \r
- // tree related stuff\r
- var styles = false, hnode;\r
- var nonSpace = /^\s*$/;\r
- var html = Ext.util.Format.htmlEncode;\r
- var ellipsis = Ext.util.Format.ellipsis;\r
- var styleRe = /\s?([a-z\-]*)\:([^;]*)(?:[;\s\n\r]*)/gi;\r
-\r
- function findNode(n){\r
- if(!n || n.nodeType != 1 || n == document.body || n == document){\r
- return false;\r
- }\r
- var pn = [n], p = n;\r
- while((p = p.parentNode) && p.nodeType == 1 && p.tagName.toUpperCase() != 'HTML'){\r
- pn.unshift(p);\r
- }\r
- var cn = hnode;\r
- for(var i = 0, len = pn.length; i < len; i++){\r
- cn.expand();\r
- cn = cn.findChild('htmlNode', pn[i]);\r
- if(!cn){ // in this dialog?\r
- return false;\r
- }\r
- }\r
- cn.select();\r
- var a = cn.ui.anchor;\r
- treeEl.dom.scrollTop = Math.max(0 ,a.offsetTop-10);\r
- //treeEl.dom.scrollLeft = Math.max(0 ,a.offsetLeft-10); no likey\r
- cn.highlight();\r
- return true;\r
- }\r
-\r
- function nodeTitle(n){\r
- var s = n.tagName;\r
- if(n.id){\r
- s += '#'+n.id;\r
- }else if(n.className){\r
- s += '.'+n.className;\r
- }\r
- return s;\r
- }\r
-\r
- function onNodeSelect(t, n, last){\r
- return;\r
- if(last && last.unframe){\r
- last.unframe();\r
- }\r
- var props = {};\r
- if(n && n.htmlNode){\r
- if(frameEl.pressed){\r
- n.frame();\r
- }\r
- if(inspecting){\r
- return;\r
- }\r
- addStyle.enable();\r
- reload.setDisabled(n.leaf);\r
- var dom = n.htmlNode;\r
- stylePanel.setTitle(nodeTitle(dom));\r
- if(styles && !showAll.pressed){\r
- var s = dom.style ? dom.style.cssText : '';\r
- if(s){\r
- var m;\r
- while ((m = styleRe.exec(s)) != null){\r
- props[m[1].toLowerCase()] = m[2];\r
- }\r
- }\r
- }else if(styles){\r
- var cl = Ext.debug.cssList;\r
- var s = dom.style, fly = Ext.fly(dom);\r
- if(s){\r
- for(var i = 0, len = cl.length; i<len; i++){\r
- var st = cl[i];\r
- var v = s[st] || fly.getStyle(st);\r
- if(v != undefined && v !== null && v !== ''){\r
- props[st] = v;\r
- }\r
- }\r
- }\r
- }else{\r
- for(var a in dom){\r
- var v = dom[a];\r
- if((isNaN(a+10)) && v != undefined && v !== null && v !== '' && !(Ext.isGecko && a[0] == a[0].toUpperCase())){\r
- props[a] = v;\r
- }\r
- }\r
- }\r
- }else{\r
- if(inspecting){\r
- return;\r
- }\r
- addStyle.disable();\r
- reload.disabled();\r
- }\r
- stylesGrid.setSource(props);\r
- stylesGrid.treeNode = n;\r
- stylesGrid.view.fitColumns();\r
- }\r
-\r
- this.loader = new Ext.tree.TreeLoader();\r
- this.loader.load = function(n, cb){\r
- var isBody = n.htmlNode == document.body;\r
- var cn = n.htmlNode.childNodes;\r
- for(var i = 0, c; c = cn[i]; i++){\r
- if(isBody && c.id == 'x-debug-browser'){\r
- continue;\r
- }\r
- if(c.nodeType == 1){\r
- n.appendChild(new Ext.debug.HtmlNode(c));\r
- }else if(c.nodeType == 3 && !nonSpace.test(c.nodeValue)){\r
- n.appendChild(new Ext.tree.TreeNode({\r
- text:'<em>' + ellipsis(html(String(c.nodeValue)), 35) + '</em>',\r
- cls: 'x-tree-noicon'\r
- }));\r
- }\r
- }\r
- cb();\r
- };\r
-\r
- //tree.getSelectionModel().on('selectionchange', onNodeSelect, null, {buffer:250});\r
-\r
- this.root = this.setRootNode(new Ext.tree.TreeNode('Ext'));\r
-\r
- hnode = this.root.appendChild(new Ext.debug.HtmlNode(\r
- document.getElementsByTagName('html')[0]\r
- ));\r
-\r
- }\r
-});\r
-\r
-\r
-// highly unusual class declaration\r
-Ext.debug.HtmlNode = function(){\r
- var html = Ext.util.Format.htmlEncode;\r
- var ellipsis = Ext.util.Format.ellipsis;\r
- var nonSpace = /^\s*$/;\r
-\r
- var attrs = [\r
- {n: 'id', v: 'id'},\r
- {n: 'className', v: 'class'},\r
- {n: 'name', v: 'name'},\r
- {n: 'type', v: 'type'},\r
- {n: 'src', v: 'src'},\r
- {n: 'href', v: 'href'}\r
- ];\r
-\r
- function hasChild(n){\r
- for(var i = 0, c; c = n.childNodes[i]; i++){\r
- if(c.nodeType == 1){\r
- return true;\r
- }\r
- }\r
- return false;\r
- }\r
-\r
- function renderNode(n, leaf){\r
- var tag = n.tagName.toLowerCase();\r
- var s = '<' + tag;\r
- for(var i = 0, len = attrs.length; i < len; i++){\r
- var a = attrs[i];\r
- var v = n[a.n];\r
- if(v && !nonSpace.test(v)){\r
- s += ' ' + a.v + '="<i>' + html(v) +'</i>"';\r
- }\r
- }\r
- var style = n.style ? n.style.cssText : '';\r
- if(style){\r
- s += ' style="<i>' + html(style.toLowerCase()) +'</i>"';\r
- }\r
- if(leaf && n.childNodes.length > 0){\r
- s+='><em>' + ellipsis(html(String(n.innerHTML)), 35) + '</em></'+tag+'>';\r
- }else if(leaf){\r
- s += ' />';\r
- }else{\r
- s += '>';\r
- }\r
- return s;\r
- }\r
-\r
- var HtmlNode = function(n){\r
- var leaf = !hasChild(n);\r
- this.htmlNode = n;\r
- this.tagName = n.tagName.toLowerCase();\r
- var attr = {\r
- text : renderNode(n, leaf),\r
- leaf : leaf,\r
- cls: 'x-tree-noicon'\r
- };\r
- HtmlNode.superclass.constructor.call(this, attr);\r
- this.attributes.htmlNode = n; // for searching\r
- if(!leaf){\r
- this.on('expand', this.onExpand, this);\r
- this.on('collapse', this.onCollapse, this);\r
- }\r
- };\r
-\r
-\r
- Ext.extend(HtmlNode, Ext.tree.AsyncTreeNode, {\r
- cls: 'x-tree-noicon',\r
- preventHScroll: true,\r
- refresh : function(highlight){\r
- var leaf = !hasChild(this.htmlNode);\r
- this.setText(renderNode(this.htmlNode, leaf));\r
- if(highlight){\r
- Ext.fly(this.ui.textNode).highlight();\r
- }\r
- },\r
-\r
- onExpand : function(){\r
- if(!this.closeNode && this.parentNode){\r
- this.closeNode = this.parentNode.insertBefore(new Ext.tree.TreeNode({\r
- text:'</' + this.tagName + '>',\r
- cls: 'x-tree-noicon'\r
- }), this.nextSibling);\r
- }else if(this.closeNode){\r
- this.closeNode.ui.show();\r
- }\r
- },\r
-\r
- onCollapse : function(){\r
- if(this.closeNode){\r
- this.closeNode.ui.hide();\r
- }\r
- },\r
-\r
- render : function(bulkRender){\r
- HtmlNode.superclass.render.call(this, bulkRender);\r
- },\r
-\r
- highlightNode : function(){\r
- //Ext.fly(this.htmlNode).highlight();\r
- },\r
-\r
- highlight : function(){\r
- //Ext.fly(this.ui.textNode).highlight();\r
- },\r
-\r
- frame : function(){\r
- this.htmlNode.style.border = '1px solid #0000ff';\r
- //this.highlightNode();\r
- },\r
-\r
- unframe : function(){\r
- //Ext.fly(this.htmlNode).removeClass('x-debug-frame');\r
- this.htmlNode.style.border = '';\r
- }\r
- });\r
-\r
- return HtmlNode;\r
-}();\r
-\r
-\r