browser/devtools/shared/widgets/BreadcrumbsWidget.jsm

Thu, 15 Jan 2015 15:55:04 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Thu, 15 Jan 2015 15:55:04 +0100
branch
TOR_BUG_9701
changeset 9
a63d609f5ebe
permissions
-rw-r--r--

Back out 97036ab72558 which inappropriately compared turds to third parties.

michael@0 1 /* -*- Mode: javascript; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
michael@0 2 /* vim: set ft=javascript ts=2 et sw=2 tw=80: */
michael@0 3 /* This Source Code Form is subject to the terms of the Mozilla Public
michael@0 4 * License, v. 2.0. If a copy of the MPL was not distributed with this
michael@0 5 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
michael@0 6 "use strict";
michael@0 7
michael@0 8 const Ci = Components.interfaces;
michael@0 9 const Cu = Components.utils;
michael@0 10
michael@0 11 const ENSURE_SELECTION_VISIBLE_DELAY = 50; // ms
michael@0 12
michael@0 13 Cu.import("resource:///modules/devtools/ViewHelpers.jsm");
michael@0 14 Cu.import("resource://gre/modules/devtools/event-emitter.js");
michael@0 15
michael@0 16 this.EXPORTED_SYMBOLS = ["BreadcrumbsWidget"];
michael@0 17
michael@0 18 /**
michael@0 19 * A breadcrumb-like list of items.
michael@0 20 *
michael@0 21 * Note: this widget should be used in tandem with the WidgetMethods in
michael@0 22 * ViewHelpers.jsm.
michael@0 23 *
michael@0 24 * @param nsIDOMNode aNode
michael@0 25 * The element associated with the widget.
michael@0 26 */
michael@0 27 this.BreadcrumbsWidget = function BreadcrumbsWidget(aNode) {
michael@0 28 this.document = aNode.ownerDocument;
michael@0 29 this.window = this.document.defaultView;
michael@0 30 this._parent = aNode;
michael@0 31
michael@0 32 // Create an internal arrowscrollbox container.
michael@0 33 this._list = this.document.createElement("arrowscrollbox");
michael@0 34 this._list.className = "breadcrumbs-widget-container";
michael@0 35 this._list.setAttribute("flex", "1");
michael@0 36 this._list.setAttribute("orient", "horizontal");
michael@0 37 this._list.setAttribute("clicktoscroll", "true")
michael@0 38 this._list.addEventListener("keypress", e => this.emit("keyPress", e), false);
michael@0 39 this._list.addEventListener("mousedown", e => this.emit("mousePress", e), false);
michael@0 40 this._parent.appendChild(this._list);
michael@0 41
michael@0 42 // By default, hide the arrows. We let the arrowscrollbox show them
michael@0 43 // in case of overflow.
michael@0 44 this._list._scrollButtonUp.collapsed = true;
michael@0 45 this._list._scrollButtonDown.collapsed = true;
michael@0 46 this._list.addEventListener("underflow", this._onUnderflow.bind(this), false);
michael@0 47 this._list.addEventListener("overflow", this._onOverflow.bind(this), false);
michael@0 48
michael@0 49
michael@0 50 // These separators are used for CSS purposes only, and are positioned
michael@0 51 // off screen, but displayed with -moz-element.
michael@0 52 this._separators = this.document.createElement("box");
michael@0 53 this._separators.className = "breadcrumb-separator-container";
michael@0 54 this._separators.innerHTML =
michael@0 55 "<box id='breadcrumb-separator-before'></box>" +
michael@0 56 "<box id='breadcrumb-separator-after'></box>" +
michael@0 57 "<box id='breadcrumb-separator-normal'></box>";
michael@0 58 this._parent.appendChild(this._separators);
michael@0 59
michael@0 60 // This widget emits events that can be handled in a MenuContainer.
michael@0 61 EventEmitter.decorate(this);
michael@0 62
michael@0 63 // Delegate some of the associated node's methods to satisfy the interface
michael@0 64 // required by MenuContainer instances.
michael@0 65 ViewHelpers.delegateWidgetAttributeMethods(this, aNode);
michael@0 66 ViewHelpers.delegateWidgetEventMethods(this, aNode);
michael@0 67 };
michael@0 68
michael@0 69 BreadcrumbsWidget.prototype = {
michael@0 70 /**
michael@0 71 * Inserts an item in this container at the specified index.
michael@0 72 *
michael@0 73 * @param number aIndex
michael@0 74 * The position in the container intended for this item.
michael@0 75 * @param nsIDOMNode aContents
michael@0 76 * The node displayed in the container.
michael@0 77 * @return nsIDOMNode
michael@0 78 * The element associated with the displayed item.
michael@0 79 */
michael@0 80 insertItemAt: function(aIndex, aContents) {
michael@0 81 let list = this._list;
michael@0 82 let breadcrumb = new Breadcrumb(this, aContents);
michael@0 83 return list.insertBefore(breadcrumb._target, list.childNodes[aIndex]);
michael@0 84 },
michael@0 85
michael@0 86 /**
michael@0 87 * Returns the child node in this container situated at the specified index.
michael@0 88 *
michael@0 89 * @param number aIndex
michael@0 90 * The position in the container intended for this item.
michael@0 91 * @return nsIDOMNode
michael@0 92 * The element associated with the displayed item.
michael@0 93 */
michael@0 94 getItemAtIndex: function(aIndex) {
michael@0 95 return this._list.childNodes[aIndex];
michael@0 96 },
michael@0 97
michael@0 98 /**
michael@0 99 * Removes the specified child node from this container.
michael@0 100 *
michael@0 101 * @param nsIDOMNode aChild
michael@0 102 * The element associated with the displayed item.
michael@0 103 */
michael@0 104 removeChild: function(aChild) {
michael@0 105 this._list.removeChild(aChild);
michael@0 106
michael@0 107 if (this._selectedItem == aChild) {
michael@0 108 this._selectedItem = null;
michael@0 109 }
michael@0 110 },
michael@0 111
michael@0 112 /**
michael@0 113 * Removes all of the child nodes from this container.
michael@0 114 */
michael@0 115 removeAllItems: function() {
michael@0 116 let list = this._list;
michael@0 117
michael@0 118 while (list.hasChildNodes()) {
michael@0 119 list.firstChild.remove();
michael@0 120 }
michael@0 121
michael@0 122 this._selectedItem = null;
michael@0 123 },
michael@0 124
michael@0 125 /**
michael@0 126 * Gets the currently selected child node in this container.
michael@0 127 * @return nsIDOMNode
michael@0 128 */
michael@0 129 get selectedItem() {
michael@0 130 return this._selectedItem;
michael@0 131 },
michael@0 132
michael@0 133 /**
michael@0 134 * Sets the currently selected child node in this container.
michael@0 135 * @param nsIDOMNode aChild
michael@0 136 */
michael@0 137 set selectedItem(aChild) {
michael@0 138 let childNodes = this._list.childNodes;
michael@0 139
michael@0 140 if (!aChild) {
michael@0 141 this._selectedItem = null;
michael@0 142 }
michael@0 143 for (let node of childNodes) {
michael@0 144 if (node == aChild) {
michael@0 145 node.setAttribute("checked", "");
michael@0 146 this._selectedItem = node;
michael@0 147 } else {
michael@0 148 node.removeAttribute("checked");
michael@0 149 }
michael@0 150 }
michael@0 151 },
michael@0 152
michael@0 153 /**
michael@0 154 * Returns the value of the named attribute on this container.
michael@0 155 *
michael@0 156 * @param string aName
michael@0 157 * The name of the attribute.
michael@0 158 * @return string
michael@0 159 * The current attribute value.
michael@0 160 */
michael@0 161 getAttribute: function(aName) {
michael@0 162 if (aName == "scrollPosition") return this._list.scrollPosition;
michael@0 163 if (aName == "scrollWidth") return this._list.scrollWidth;
michael@0 164 return this._parent.getAttribute(aName);
michael@0 165 },
michael@0 166
michael@0 167 /**
michael@0 168 * Ensures the specified element is visible.
michael@0 169 *
michael@0 170 * @param nsIDOMNode aElement
michael@0 171 * The element to make visible.
michael@0 172 */
michael@0 173 ensureElementIsVisible: function(aElement) {
michael@0 174 if (!aElement) {
michael@0 175 return;
michael@0 176 }
michael@0 177
michael@0 178 // Repeated calls to ensureElementIsVisible would interfere with each other
michael@0 179 // and may sometimes result in incorrect scroll positions.
michael@0 180 setNamedTimeout("breadcrumb-select", ENSURE_SELECTION_VISIBLE_DELAY, () => {
michael@0 181 if (this._list.ensureElementIsVisible) {
michael@0 182 this._list.ensureElementIsVisible(aElement);
michael@0 183 }
michael@0 184 });
michael@0 185 },
michael@0 186
michael@0 187 /**
michael@0 188 * The underflow and overflow listener for the arrowscrollbox container.
michael@0 189 */
michael@0 190 _onUnderflow: function({ target }) {
michael@0 191 if (target != this._list) {
michael@0 192 return;
michael@0 193 }
michael@0 194 target._scrollButtonUp.collapsed = true;
michael@0 195 target._scrollButtonDown.collapsed = true;
michael@0 196 target.removeAttribute("overflows");
michael@0 197 },
michael@0 198
michael@0 199 /**
michael@0 200 * The underflow and overflow listener for the arrowscrollbox container.
michael@0 201 */
michael@0 202 _onOverflow: function({ target }) {
michael@0 203 if (target != this._list) {
michael@0 204 return;
michael@0 205 }
michael@0 206 target._scrollButtonUp.collapsed = false;
michael@0 207 target._scrollButtonDown.collapsed = false;
michael@0 208 target.setAttribute("overflows", "");
michael@0 209 },
michael@0 210
michael@0 211 window: null,
michael@0 212 document: null,
michael@0 213 _parent: null,
michael@0 214 _list: null,
michael@0 215 _selectedItem: null
michael@0 216 };
michael@0 217
michael@0 218 /**
michael@0 219 * A Breadcrumb constructor for the BreadcrumbsWidget.
michael@0 220 *
michael@0 221 * @param BreadcrumbsWidget aWidget
michael@0 222 * The widget to contain this breadcrumb.
michael@0 223 * @param nsIDOMNode aContents
michael@0 224 * The node displayed in the container.
michael@0 225 */
michael@0 226 function Breadcrumb(aWidget, aContents) {
michael@0 227 this.document = aWidget.document;
michael@0 228 this.window = aWidget.window;
michael@0 229 this.ownerView = aWidget;
michael@0 230
michael@0 231 this._target = this.document.createElement("hbox");
michael@0 232 this._target.className = "breadcrumbs-widget-item";
michael@0 233 this._target.setAttribute("align", "center");
michael@0 234 this.contents = aContents;
michael@0 235 }
michael@0 236
michael@0 237 Breadcrumb.prototype = {
michael@0 238 /**
michael@0 239 * Sets the contents displayed in this item's view.
michael@0 240 *
michael@0 241 * @param string | nsIDOMNode aContents
michael@0 242 * The string or node displayed in the container.
michael@0 243 */
michael@0 244 set contents(aContents) {
michael@0 245 // If there are already some contents displayed, replace them.
michael@0 246 if (this._target.hasChildNodes()) {
michael@0 247 this._target.replaceChild(aContents, this._target.firstChild);
michael@0 248 return;
michael@0 249 }
michael@0 250 // These are the first contents ever displayed.
michael@0 251 this._target.appendChild(aContents);
michael@0 252 },
michael@0 253
michael@0 254 window: null,
michael@0 255 document: null,
michael@0 256 ownerView: null,
michael@0 257 _target: null
michael@0 258 };

mercurial