From 88f25ba6c7ace8b155c275125a2c5931f53532af Mon Sep 17 00:00:00 2001 From: Joe Walker Date: Thu, 3 Nov 2011 12:36:43 -0300 Subject: [PATCH] Bug 697039 - GCLI should officially drop support for older browsers; r=dcamp --- browser/devtools/webconsole/gcli.jsm | 249 +++------------------------ 1 file changed, 28 insertions(+), 221 deletions(-) diff --git a/browser/devtools/webconsole/gcli.jsm b/browser/devtools/webconsole/gcli.jsm index 8daf9739bbd..a7a086a1f77 100644 --- a/browser/devtools/webconsole/gcli.jsm +++ b/browser/devtools/webconsole/gcli.jsm @@ -785,7 +785,7 @@ define('gcli/canon', ['require', 'exports', 'module' , 'gcli/util', 'gcli/l10n', var canon = exports; -var createEvent = require('gcli/util').createEvent; +var util = require('gcli/util'); var l10n = require('gcli/l10n'); var types = require('gcli/types'); @@ -1067,7 +1067,7 @@ canon.getCommandNames = function getCommandNames() { /** * Enable people to be notified of changes to the list of commands */ -canon.canonChange = createEvent('canon.canonChange'); +canon.canonChange = util.createEvent('canon.canonChange'); /** * CommandOutputManager stores the output objects generated by executed @@ -1080,7 +1080,7 @@ canon.canonChange = createEvent('canon.canonChange'); * soon. */ function CommandOutputManager() { - this._event = createEvent('CommandOutputManager'); + this._event = util.createEvent('CommandOutputManager'); } /** @@ -1245,96 +1245,6 @@ dom.clearElement = function(elem) { } }; -if (this.document && !this.document.documentElement.classList) { - /** - * Is the given element marked with the given CSS class? - */ - dom.hasCssClass = function(elem, name) { - var classes = elem.className.split(/\s+/g); - return classes.indexOf(name) !== -1; - }; - - /** - * Add a CSS class to the list of classes on the given node - */ - dom.addCssClass = function(elem, name) { - if (!dom.hasCssClass(elem, name)) { - elem.className += ' ' + name; - } - }; - - /** - * Remove a CSS class from the list of classes on the given node - */ - dom.removeCssClass = function(elem, name) { - var classes = elem.className.split(/\s+/g); - while (true) { - var index = classes.indexOf(name); - if (index == -1) { - break; - } - classes.splice(index, 1); - } - elem.className = classes.join(' '); - }; - - /** - * Add the named CSS class from the element if it is not already present or - * remove it if is present. - */ - dom.toggleCssClass = function(elem, name) { - var classes = elem.className.split(/\s+/g), add = true; - while (true) { - var index = classes.indexOf(name); - if (index == -1) { - break; - } - add = false; - classes.splice(index, 1); - } - if (add) { - classes.push(name); - } - - elem.className = classes.join(' '); - return add; - }; -} -else { - /* - * classList shim versions of methods above. - * See the functions above for documentation - */ - dom.hasCssClass = function(elem, name) { - return elem.classList.contains(name); - }; - - dom.addCssClass = function(elem, name) { - elem.classList.add(name); - }; - - dom.removeCssClass = function(elem, name) { - elem.classList.remove(name); - }; - - dom.toggleCssClass = function(elem, name) { - return elem.classList.toggle(name); - }; -} - -/** - * Add or remove a CSS class from the list of classes on the given node - * depending on the value of include - */ -dom.setCssClass = function(node, className, include) { - if (include) { - dom.addCssClass(node, className); - } - else { - dom.removeCssClass(node, className); - } -}; - /** * Create a style element in the document head, and add the given CSS text to * it. @@ -1353,20 +1263,6 @@ dom.importCss = function(cssText, doc) { return style; }; -/** - * Shim for window.getComputedStyle - */ -dom.computedStyle = function(element, style) { - var win = element.ownerDocument.defaultView; - if (win.getComputedStyle) { - var styles = win.getComputedStyle(element, '') || {}; - return styles[style] || ''; - } - else { - return element.currentStyle[style]; - } -}; - /** * Using setInnerHtml(foo) rather than innerHTML = foo allows us to enable * tweaks in XHTML documents. @@ -1388,44 +1284,6 @@ dom.setInnerHtml = function(elem, html) { } }; -/** - * Shim to textarea.selectionStart - */ -dom.getSelectionStart = function(textarea) { - try { - return textarea.selectionStart || 0; - } - catch (ex) { - return 0; - } -}; - -/** - * Shim to textarea.selectionStart - */ -dom.setSelectionStart = function(textarea, start) { - return textarea.selectionStart = start; -}; - -/** - * Shim to textarea.selectionEnd - */ -dom.getSelectionEnd = function(textarea) { - try { - return textarea.selectionEnd || 0; - } - catch (ex) { - return 0; - } -}; - -/** - * Shim to textarea.selectionEnd - */ -dom.setSelectionEnd = function(textarea, end) { - return textarea.selectionEnd = end; -}; - exports.dom = dom; @@ -1436,57 +1294,6 @@ exports.dom = dom; */ var event = {}; -/** - * Shim for lack of addEventListener on old IE. - */ -event.addListener = function(elem, type, callback) { - if (elem.addEventListener) { - return elem.addEventListener(type, callback, false); - } - if (elem.attachEvent) { - var wrapper = function() { - callback(window.event); - }; - callback._wrapper = wrapper; - elem.attachEvent('on' + type, wrapper); - } -}; - -/** - * Shim for lack of removeEventListener on old IE. - */ -event.removeListener = function(elem, type, callback) { - if (elem.removeEventListener) { - return elem.removeEventListener(type, callback, false); - } - if (elem.detachEvent) { - elem.detachEvent('on' + type, callback._wrapper || callback); - } -}; - -/** - * Prevents propagation and clobbers the default action of the passed event - */ -event.stopEvent = function(e) { - event.stopPropagation(e); - if (e.preventDefault) { - e.preventDefault(); - } - return false; -}; - -/** - * Prevents propagation of the event - */ -event.stopPropagation = function(ev) { - if (ev.stopPropagation) { - ev.stopPropagation(); - } - else { - ev.cancelBubble = true; - } -}; - /** * Keyboard handling is a mess. http://unixpapa.com/js/key.html * It would be good to use DOM L3 Keyboard events, @@ -3752,7 +3559,7 @@ exports.flashNode = function(node, color) { define('gcli/cli', ['require', 'exports', 'module' , 'gcli/util', 'gcli/canon', 'gcli/promise', 'gcli/types', 'gcli/types/basic', 'gcli/argument'], function(require, exports, module) { -var createEvent = require('gcli/util').createEvent; +var util = require('gcli/util'); var canon = require('gcli/canon'); var Promise = require('gcli/promise').Promise; @@ -3812,7 +3619,7 @@ exports.shutdown = function() { function Assignment(param, paramIndex) { this.param = param; this.paramIndex = paramIndex; - this.assignmentChange = createEvent('Assignment.assignmentChange'); + this.assignmentChange = util.createEvent('Assignment.assignmentChange'); this.setDefault(); } @@ -4159,7 +3966,7 @@ function CommandAssignment() { description: 'The command to execute' }); this.paramIndex = -1; - this.assignmentChange = createEvent('CommandAssignment.assignmentChange'); + this.assignmentChange = util.createEvent('CommandAssignment.assignmentChange'); this.setDefault(); } @@ -4184,7 +3991,7 @@ function UnassignedAssignment() { type: 'string' }); this.paramIndex = -1; - this.assignmentChange = createEvent('UnassignedAssignment.assignmentChange'); + this.assignmentChange = util.createEvent('UnassignedAssignment.assignmentChange'); this.setDefault(); } @@ -4269,9 +4076,9 @@ function Requisition(environment, document) { this.commandOutputManager = canon.commandOutputManager; - this.assignmentChange = createEvent('Requisition.assignmentChange'); - this.commandChange = createEvent('Requisition.commandChange'); - this.inputChange = createEvent('Requisition.inputChange'); + this.assignmentChange = util.createEvent('Requisition.assignmentChange'); + this.commandChange = util.createEvent('Requisition.commandChange'); + this.inputChange = util.createEvent('Requisition.inputChange'); } /** @@ -5244,9 +5051,8 @@ define('gcli/ui/inputter', ['require', 'exports', 'module' , 'gcli/util', 'gcli/ var cliView = exports; -var event = require('gcli/util').event; +var KeyEvent = require('gcli/util').event.KeyEvent; var dom = require('gcli/util').dom; -var KeyEvent = event.KeyEvent; var Status = require('gcli/types').Status; var History = require('gcli/history').History; @@ -5290,8 +5096,8 @@ function Inputter(options) { // Ensure that TAB/UP/DOWN isn't handled by the browser this.onKeyDown = this.onKeyDown.bind(this); this.onKeyUp = this.onKeyUp.bind(this); - event.addListener(this.element, 'keydown', this.onKeyDown); - event.addListener(this.element, 'keyup', this.onKeyUp); + this.element.addEventListener('keydown', this.onKeyDown, false); + this.element.addEventListener('keyup', this.onKeyUp, false); if (options.completer == null) { options.completer = new Completer(options); @@ -5310,7 +5116,7 @@ function Inputter(options) { this.onMouseUp = function(ev) { this.completer.update(this.getInputState()); }.bind(this); - event.addListener(this.element, 'mouseup', this.onMouseUp); + this.element.addEventListener('mouseup', this.onMouseUp, false); this.focusManager = options.focusManager; if (this.focusManager) { @@ -5329,8 +5135,8 @@ Inputter.prototype.destroy = function() { this.focusManager.removeMonitoredElement(this.element, 'input'); } - event.removeListener(this.element, 'keydown', this.onKeyDown); - event.removeListener(this.element, 'keyup', this.onKeyUp); + this.element.removeEventListener('keydown', this.onKeyDown, false); + this.element.removeEventListener('keyup', this.onKeyUp, false); delete this.onKeyDown; delete this.onKeyUp; @@ -5485,8 +5291,8 @@ Inputter.prototype._processCaretChange = function(input, forceUpdate) { this.completer.update(newInput); } - dom.setSelectionStart(this.element, newInput.cursor.start); - dom.setSelectionEnd(this.element, newInput.cursor.end); + this.element.selectionStart = newInput.cursor.start; + this.element.selectionEnd = newInput.cursor.end; this._caretChange = null; return newInput; @@ -5519,12 +5325,12 @@ Inputter.prototype.focus = function() { */ Inputter.prototype.onKeyDown = function(ev) { if (ev.keyCode === KeyEvent.DOM_VK_UP || ev.keyCode === KeyEvent.DOM_VK_DOWN) { - event.stopEvent(ev); + ev.preventDefault(); } if (ev.keyCode === KeyEvent.DOM_VK_TAB) { this.lastTabDownAt = 0; if (!ev.shiftKey) { - event.stopEvent(ev); + ev.preventDefault(); // Record the timestamp of this TAB down so onKeyUp can distinguish // focus from TAB in the CLI. this.lastTabDownAt = ev.timeStamp; @@ -5610,7 +5416,7 @@ Inputter.prototype.onKeyUp = function(ev) { * i.e Requisition.getAssignmentAt(cursorPos); */ Inputter.prototype.getCurrentAssignment = function() { - var start = dom.getSelectionStart(this.element); + var start = this.element.selectionStart; return this.requisition.getAssignmentAt(start); }; @@ -5630,15 +5436,15 @@ Inputter.prototype.getInputState = function() { var input = { typed: this.element.value, cursor: { - start: dom.getSelectionStart(this.element), - end: dom.getSelectionEnd(this.element) + start: this.element.selectionStart, + end: this.element.selectionEnd } }; // Workaround for potential XUL bug 676520 where textbox gives incorrect // values for its content if (input.typed == null) { - input.typed = ''; + input = { typed: '', cursor: { start: 0, end: 0 } }; console.log('fixing input.typed=""', input); } @@ -5700,7 +5506,7 @@ Completer.prototype.destroy = function() { delete this.backgroundElement; if (this.elementCreated) { - event.removeListener(this.document.defaultView, 'resize', this.resizer); + this.document.defaultView.removeEventListener('resize', this.resizer, false); } delete this.inputter; @@ -5726,8 +5532,9 @@ Completer.prototype.decorate = function(inputter) { if (this.elementCreated) { this.inputter.appendAfter(this.element); + var styles = this.document.defaultView.getComputedStyle(input, null); Completer.copyStyles.forEach(function(style) { - this.element.style[style] = dom.computedStyle(input, style); + this.element.style[style] = styles[style]; }, this); // The completer text is by default invisible so we make it the same color @@ -5747,7 +5554,7 @@ Completer.prototype.decorate = function(inputter) { input.style.paddingLeft = '20px'; this.resizer = this.resizer.bind(this); - event.addListener(this.document.defaultView, 'resize', this.resizer); + this.document.defaultView.addEventListener('resize', this.resizer, false); this.resizer(); } };