devtools/client/accessibility/picker.js

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this
   3  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 "use strict";
   6
   7 const {
   8   L10N,
   9 } = require("resource://devtools/client/accessibility/utils/l10n.js");
  10
  11 class Picker {
  12   constructor(panel) {
  13     this._panel = panel;
  14
  15     this.isPicking = false;
  16
  17     this.onPickerAccessibleHovered = this.onPickerAccessibleHovered.bind(this);
  18     this.onPickerAccessiblePicked = this.onPickerAccessiblePicked.bind(this);
  19     this.onPickerAccessiblePreviewed =
  20       this.onPickerAccessiblePreviewed.bind(this);
  21     this.onPickerAccessibleCanceled =
  22       this.onPickerAccessibleCanceled.bind(this);
  23   }
  24
  25   get toolbox() {
  26     return this._panel._toolbox;
  27   }
  28
  29   get accessibilityProxy() {
  30     return this._panel.accessibilityProxy;
  31   }
  32
  33   get pickerButton() {
  34     return this.toolbox.pickerButton;
  35   }
  36
  37   get _telemetry() {
  38     return this._panel._telemetry;
  39   }
  40
  41   release() {
  42     this._panel = null;
  43   }
  44
  45   emit(event, data) {
  46     this.toolbox.emit(event, data);
  47   }
  48
  49   /**
  50    * Select accessible object in the tree.
  51    * @param  {Object} accessible
  52    *         Accessiblle object to be selected in the inspector tree.
  53    */
  54   select(accessible) {
  55     this._panel.selectAccessible(accessible);
  56   }
  57
  58   /**
  59    * Highlight accessible object in the tree.
  60    * @param  {Object} accessible
  61    *         Accessiblle object to be selected in the inspector tree.
  62    */
  63   highlight(accessible) {
  64     this._panel.highlightAccessible(accessible);
  65   }
  66
  67   getStr(key) {
  68     return L10N.getStr(key);
  69   }
  70
  71   /**
  72    * Override the default presentation of the picker button in toolbox's top
  73    * level toolbar.
  74    */
  75   updateButton() {
  76     this.pickerButton.description = this.getStr("accessibility.pick");
  77     this.pickerButton.className = "accessibility";
  78     this.pickerButton.disabled = !this.accessibilityProxy.enabled;
  79     if (!this.accessibilityProxy.enabled && this.isPicking) {
  80       this.cancel();
  81     }
  82   }
  83
  84   /**
  85    * Handle an event when a new accessible object is hovered over.
  86    * @param  {Object} accessible
  87    *         newly hovered accessible object
  88    */
  89   onPickerAccessibleHovered(accessible) {
  90     if (accessible) {
  91       this.emit("picker-accessible-hovered", accessible);
  92       this.highlight(accessible);
  93     }
  94   }
  95
  96   /**
  97    * Handle an event when a new accessible is picked by the user.
  98    * @param  {Object} accessible
  99    *         newly picked accessible object
 100    */
 101   onPickerAccessiblePicked(accessible) {
 102     if (accessible) {
 103       this.select(accessible);
 104     }
 105     this.stop();
 106   }
 107
 108   /**
 109    * Handle an event when a new accessible is previewed by the user.
 110    * @param  {Object} accessible
 111    *         newly previewed accessible object
 112    */
 113   onPickerAccessiblePreviewed(accessible) {
 114     if (accessible) {
 115       this.select(accessible);
 116     }
 117   }
 118
 119   /**
 120    * Handle an event when picking is cancelled by the user.s
 121    */
 122   onPickerAccessibleCanceled() {
 123     this.cancel();
 124     this.emit("picker-accessible-canceled");
 125   }
 126
 127   /**
 128    * Cancel picking.
 129    */
 130   async cancel() {
 131     await this.stop();
 132   }
 133
 134   /**
 135    * Stop picking.
 136    */
 137   async stop() {
 138     if (!this.isPicking) {
 139       return;
 140     }
 141
 142     this.isPicking = false;
 143     this.pickerButton.isChecked = false;
 144
 145     await this.accessibilityProxy.cancelPick();
 146     this._telemetry.toolClosed("accessibility_picker", this);
 147     this.emit("picker-stopped");
 148   }
 149
 150   /**
 151    * Start picking.
 152    * @param  {Boolean} doFocus
 153    *         If true, move keyboard focus into content.
 154    */
 155   async start(doFocus = true) {
 156     if (this.isPicking) {
 157       return;
 158     }
 159
 160     this.isPicking = true;
 161     this.pickerButton.isChecked = true;
 162
 163     await this.accessibilityProxy.pick(
 164       doFocus,
 165       this.onPickerAccessibleHovered,
 166       this.onPickerAccessiblePicked,
 167       this.onPickerAccessiblePreviewed,
 168       this.onPickerAccessibleCanceled
 169     );
 170
 171     this._telemetry.toolOpened("accessibility_picker", this);
 172     this.emit("picker-started");
 173   }
 174
 175   /**
 176    * Toggle between starting and canceling the picker.
 177    * @param  {Boolean} doFocus
 178    *         If true, move keyboard focus into content.
 179    */
 180   toggle(doFocus) {
 181     if (this.isPicking) {
 182       return this.cancel();
 183     }
 184
 185     return this.start(doFocus);
 186   }
 187 }
 188
 189 exports.Picker = Picker;