summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authortoasted-nutbread <toasted-nutbread@users.noreply.github.com>2020-09-11 14:13:52 -0400
committerGitHub <noreply@github.com>2020-09-11 14:13:52 -0400
commita1729eb9aee9426cc9b543c865a53e843ae5f487 (patch)
tree8e95d5af6546623d52c5928219758e131212495c
parent18634dca1a9cc1f0ea677f9bf0fe3971174d9d30 (diff)
Input type filters (#806)
* Add options for scanning input types * Move buttons in layout, refactor CSS * Add options for input types * Use input type filters * Add _getMatchingInputGroupFromEvent * Use input filters for touch events
-rw-r--r--ext/bg/css/settings.css44
-rw-r--r--ext/bg/data/options-schema.json41
-rw-r--r--ext/bg/js/options.js15
-rw-r--r--ext/bg/js/settings/scan-inputs-controller.js5
-rw-r--r--ext/bg/settings.html25
-rw-r--r--ext/mixed/js/text-scanner.js45
6 files changed, 142 insertions, 33 deletions
diff --git a/ext/bg/css/settings.css b/ext/bg/css/settings.css
index 6d32c9c5..0bf15f01 100644
--- a/ext/bg/css/settings.css
+++ b/ext/bg/css/settings.css
@@ -133,10 +133,7 @@ html:root:not([data-options-general-result-output-mode=merge]) #dict-main-group
}
.scan-input-table {
width: 100%;
-}
-.scan-input-list:not(:empty)+#scan-input-add {
- border-top-left-radius: 0;
- border-top-right-radius: 0;
+ margin-bottom: 8px;
}
.scan-input-index-cell {
position: relative;
@@ -153,6 +150,7 @@ html:root:not([data-options-general-result-output-mode=merge]) #dict-main-group
background-color: #eee;
border: 1px solid #ccc;
border-top-left-radius: 4px;
+ border-bottom-left-radius: 4px;
display: flex;
justify-content: center;
align-items: center;
@@ -174,22 +172,46 @@ html:root:not([data-options-general-result-output-mode=merge]) #dict-main-group
.scan-input-input-cell {
width: 100%;
}
-.scan-input-input-cell>input {
- border-radius: 0;
+.scan-input-input-cell-inner {
+ display: flex;
}
-.scan-input-mouse-button-cell>button {
+.scan-input-input-cell-inner .form-control,
+.scan-input-input-cell-inner button {
border-radius: 0;
}
+.scan-input-input-cell-inner button {
+ padding-left: 10px;
+ padding-right: 10px;
+}
+.scan-input-input-cell-inner button>span {
+ width: 20px;
+}
.scan-input-remove-button-cell>button {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
-.scan-input:nth-child(n+2) .scan-input-index {
- border-top-left-radius: 0;
-}
-.scan-input:last-child tr:last-of-type .scan-input-mouse-button-cell>button {
+.scan-input tr:last-of-type .scan-input-input-cell-inner button:last-of-type,
+.scan-input tr:last-of-type .scan-input-input-cell-inner .form-control:last-of-type {
border-bottom-right-radius: 4px;
}
+.scan-input-type-list {
+ display: flex;
+}
+.scan-input-type {
+ font-weight: normal;
+ margin: 0;
+}
+.scan-input-type+.scan-input-type {
+ margin-left: 1em;
+}
+.scan-input-type>input[type=checkbox] {
+ margin: 0 0.375em 0 0;
+ padding: 0;
+ vertical-align: middle;
+}
+.scan-input-type>span {
+ vertical-align: middle;
+}
.generic-input-list {
counter-reset: generic-input-id;
diff --git a/ext/bg/data/options-schema.json b/ext/bg/data/options-schema.json
index 17fe096c..e9677e95 100644
--- a/ext/bg/data/options-schema.json
+++ b/ext/bg/data/options-schema.json
@@ -341,13 +341,28 @@
"default": [
{
"include": "shift",
- "exclude": ""
+ "exclude": "",
+ "types": {
+ "mouse": true,
+ "touch": false,
+ "pen": false
+ }
+ },
+ {
+ "include": "",
+ "exclude": "",
+ "types": {
+ "mouse": false,
+ "touch": true,
+ "pen": true
+ }
}
],
"items": {
"required": [
"include",
- "exclude"
+ "exclude",
+ "types"
],
"properties": {
"include": {
@@ -357,6 +372,28 @@
"exclude": {
"type": "string",
"default": ""
+ },
+ "types": {
+ "type": "object",
+ "required": [
+ "mouse",
+ "touch",
+ "pen"
+ ],
+ "properties": {
+ "mouse": {
+ "type": "boolean",
+ "default": true
+ },
+ "touch": {
+ "type": "boolean",
+ "default": true
+ },
+ "pen": {
+ "type": "boolean",
+ "default": true
+ }
+ }
}
}
}
diff --git a/ext/bg/js/options.js b/ext/bg/js/options.js
index ac42fc09..e61e1c48 100644
--- a/ext/bg/js/options.js
+++ b/ext/bg/js/options.js
@@ -491,7 +491,7 @@ class OptionsUtil {
profileOptions.general.usePopupWindow = false;
profileOptions.scanning.hideDelay = 0;
- const {modifier, middleMouse} = profileOptions.scanning;
+ const {modifier, middleMouse, touchInputEnabled} = profileOptions.scanning;
const scanningInputs = [];
let modifierInput = '';
switch (modifier) {
@@ -507,12 +507,21 @@ class OptionsUtil {
}
scanningInputs.push({
include: modifierInput,
- exclude: ''
+ exclude: '',
+ types: {mouse: true, touch: false, pen: false}
});
if (middleMouse) {
scanningInputs.push({
include: 'mouse2',
- exclude: ''
+ exclude: '',
+ types: {mouse: true, touch: false, pen: false}
+ });
+ }
+ if (touchInputEnabled) {
+ scanningInputs.push({
+ include: '',
+ exclude: '',
+ types: {mouse: false, touch: true, pen: true}
});
}
profileOptions.scanning.inputs = scanningInputs;
diff --git a/ext/bg/js/settings/scan-inputs-controller.js b/ext/bg/js/settings/scan-inputs-controller.js
index 3b3945ff..3cd2b513 100644
--- a/ext/bg/js/settings/scan-inputs-controller.js
+++ b/ext/bg/js/settings/scan-inputs-controller.js
@@ -142,6 +142,11 @@ class ScanInputField {
this._eventListeners.on(this._includeInputField, 'change', this._onIncludeValueChange.bind(this));
this._eventListeners.on(this._excludeInputField, 'change', this._onExcludeValueChange.bind(this));
this._eventListeners.addEventListener(removeButton, 'click', this._onRemoveClick.bind(this));
+
+ for (const typeCheckbox of node.querySelectorAll('.scan-input-type-checkbox')) {
+ const {type} = typeCheckbox.dataset;
+ typeCheckbox.dataset.setting = `scanning.inputs[${this._index}].types.${type}`;
+ }
}
cleanup() {
diff --git a/ext/bg/settings.html b/ext/bg/settings.html
index 5e6af7f7..64a510cc 100644
--- a/ext/bg/settings.html
+++ b/ext/bg/settings.html
@@ -436,16 +436,31 @@
<template id="scan-input-template"><div class="scan-input">
<table class="scan-input-table"><tbody>
<tr class="scan-input-include">
- <td class="scan-input-index-cell" rowspan="2"><div class="scan-input-index"></div></td>
+ <td class="scan-input-index-cell" rowspan="3"><div class="scan-input-index"></div></td>
<td class="scan-input-prefix-cell"><div class="scan-input-prefix">Include</div></td>
- <td class="scan-input-input-cell"><input type="text" class="form-control scan-input-field" placeholder="No inputs"></td>
- <td class="scan-input-mouse-button-cell"><button class="btn btn-default mouse-button" title="Mouse button"><span class="mouse-button-icon"></span></button></td>
+ <td class="scan-input-input-cell"><div class="scan-input-input-cell-inner">
+ <input type="text" class="form-control scan-input-field" placeholder="No inputs">
+ <button class="btn btn-default mouse-button" title="Mouse button"><span class="mouse-button-icon"></span></button>
+ </div></td>
<td class="scan-input-remove-button-cell"><button class="btn btn-danger scan-input-remove" title="Remove"><span class="glyphicon glyphicon-remove"></span></button></td>
</tr>
<tr class="scan-input-exclude">
<td class="scan-input-prefix-cell"><div class="scan-input-prefix">Exclude</div></td>
- <td class="scan-input-input-cell"><input type="text" class="form-control scan-input-field" placeholder="No inputs"></td>
- <td class="scan-input-mouse-button-cell"><button class="btn btn-default mouse-button" title="Mouse button"><span class="mouse-button-icon"></span></button></td>
+ <td class="scan-input-input-cell"><div class="scan-input-input-cell-inner">
+ <input type="text" class="form-control scan-input-field" placeholder="No inputs">
+ <button class="btn btn-default mouse-button" title="Mouse button"><span class="mouse-button-icon"></span></button>
+ </div></td>
+ <td class="scan-input-empty-cell"></td>
+ </tr>
+ <tr class="scan-input-types">
+ <td class="scan-input-prefix-cell"><div class="scan-input-prefix">Types</div></td>
+ <td class="scan-input-input-cell"><div class="scan-input-input-cell-inner">
+ <div class="form-control scan-input-type-list">
+ <label class="scan-input-type"><input type="checkbox" class="scan-input-type-checkbox" data-type="mouse"><span>Mouse</span></label>
+ <label class="scan-input-type"><input type="checkbox" class="scan-input-type-checkbox" data-type="touch"><span>Touch</span></label>
+ <label class="scan-input-type"><input type="checkbox" class="scan-input-type-checkbox" data-type="pen"><span>Pen</span></label>
+ </div>
+ </div></td>
<td class="scan-input-empty-cell"></td>
</tr>
</tbody></table>
diff --git a/ext/mixed/js/text-scanner.js b/ext/mixed/js/text-scanner.js
index 6eafc82c..a789c84c 100644
--- a/ext/mixed/js/text-scanner.js
+++ b/ext/mixed/js/text-scanner.js
@@ -95,9 +95,10 @@ class TextScanner extends EventDispatcher {
setOptions({inputs, deepContentScan, selectText, delay, touchInputEnabled, scanLength, sentenceExtent, layoutAwareScan}) {
if (Array.isArray(inputs)) {
- this._inputs = inputs.map(({include, exclude}) => ({
+ this._inputs = inputs.map(({include, exclude, types}) => ({
include: this._getInputArray(include),
- exclude: this._getInputArray(exclude)
+ exclude: this._getInputArray(exclude),
+ types: this._getInputTypeSet(types)
}));
}
if (typeof deepContentScan === 'boolean') {
@@ -241,10 +242,7 @@ class TextScanner extends EventDispatcher {
return;
}
- const modifiers = DocumentUtil.getActiveModifiersAndButtons(e);
- this.trigger('activeModifiersChanged', {modifiers});
-
- const inputInfo = this._getMatchingInputGroup(modifiers);
+ const inputInfo = this._getMatchingInputGroupFromEvent(e, 'mouse');
if (inputInfo === null) { return; }
const {index, empty} = inputInfo;
@@ -313,7 +311,7 @@ class TextScanner extends EventDispatcher {
this._primaryTouchIdentifier = primaryTouch.identifier;
- this._searchAtFromTouchStart(primaryTouch.clientX, primaryTouch.clientY);
+ this._searchAtFromTouchStart(e, primaryTouch.clientX, primaryTouch.clientY);
}
_onTouchEnd(e) {
@@ -345,7 +343,11 @@ class TextScanner extends EventDispatcher {
return;
}
- this._searchAt(primaryTouch.clientX, primaryTouch.clientY, {cause: 'touchMove', index: -1, empty: false});
+ const inputInfo = this._getMatchingInputGroupFromEvent(e, 'touch');
+ if (inputInfo === null) { return; }
+
+ const {index, empty} = inputInfo;
+ this._searchAt(primaryTouch.clientX, primaryTouch.clientY, {cause: 'touchMove', index, empty});
e.preventDefault(); // Disable scroll
}
@@ -496,12 +498,16 @@ class TextScanner extends EventDispatcher {
await this._searchAt(x, y, {cause: 'mouse', index: inputIndex, empty: inputEmpty});
}
- async _searchAtFromTouchStart(x, y) {
+ async _searchAtFromTouchStart(e, x, y) {
if (this._pendingLookup) { return; }
+ const inputInfo = this._getMatchingInputGroupFromEvent(e, 'touch');
+ if (inputInfo === null) { return; }
+
+ const {index, empty} = inputInfo;
const textSourceCurrentPrevious = this._textSourceCurrent !== null ? this._textSourceCurrent.clone() : null;
- await this._searchAt(x, y, {cause: 'touchStart', index: -1, empty: false});
+ await this._searchAt(x, y, {cause: 'touchStart', index, empty});
if (
this._textSourceCurrent !== null &&
@@ -513,11 +519,18 @@ class TextScanner extends EventDispatcher {
}
}
- _getMatchingInputGroup(modifiers) {
+ _getMatchingInputGroupFromEvent(event, type) {
+ const modifiers = DocumentUtil.getActiveModifiersAndButtons(event);
+ this.trigger('activeModifiersChanged', {modifiers});
+ return this._getMatchingInputGroup(modifiers, type);
+ }
+
+ _getMatchingInputGroup(modifiers, type) {
let fallback = null;
for (let i = 0, ii = this._inputs.length; i < ii; ++i) {
const input = this._inputs[i];
- const {include, exclude} = input;
+ const {include, exclude, types} = input;
+ if (!types.has(type)) { continue; }
if (this._setHasAll(modifiers, include) && (exclude.length === 0 || !this._setHasAll(modifiers, exclude))) {
if (include.length > 0) {
return {index: i, empty: false, input};
@@ -545,4 +558,12 @@ class TextScanner extends EventDispatcher {
[]
);
}
+
+ _getInputTypeSet({mouse, touch, pen}) {
+ const set = new Set();
+ if (mouse) { set.add('mouse'); }
+ if (touch) { set.add('touch'); }
+ if (pen) { set.add('pen'); }
+ return set;
+ }
}