
The goal of this redesign is to provide two clear concepts that are treated as separate concerns: 1. Mapping of specific key bindings to a semantic shortcut 2. Mapping of a semantic shortcut to its behavior Previously, there was no notion of a semantic shortcut. This required manual crafting of the help dialog and made it difficult to find an approach to customizing key bindings. Although supporting key binding customization is outside the scope of this change, the path forward is more clear. Currently key bindings are hard-coded during the creation phase of the gr-app element. It's conceivable that a plugin or user settings feature could override these bindings at runtime. Or they might be read from some server-side config and passed down to gr-app via the index.html template. The universe of possible shortcuts is now defined in an enum by keyboard-shortcut-behavior. This is also where all the help text is declared and organized. The keyboard shortcut help dialog is now a generic container that reads the current state of actively bound shortcuts and their help content from keyboard-shortcut-behavior. The set of declared key bindings that are active (and registered with suitable listeners on the body element) is determined by monitoring the attachment and detachment of elements that mix in keyboard-shortcut-behavior and declare a keyBindings() method. This method replaces the keyBindings object property that iron-a11y-keys-behavior looks for. The method should return an object mapping Shortcut enum values to handler names. Elements that implement a shortcut behavior but only conditionally attach to the DOM must depend on a container element to declare the shortcut and pass the event down. An example is SAVE_COMMENT. The binding for this shortcut should be active on change and diff views regardless of whether any comments exist, so that it will be listed in the help dialog. The result of this change produces behavior that is close to previous behavior, but not quite identical. Shortcuts that used to be listed under a "Change list" or "Dashboard" section header now appear as "Actions." The exact ordering of shortcuts has not been preserved, either. Change-Id: Ib3fe44d502a83f7012e30615fbea9da2ab112eb7
49 lines
1.5 KiB
HTML
49 lines
1.5 KiB
HTML
<!--
|
|
@license
|
|
Copyright (C) 2018 The Android Open Source Project
|
|
|
|
Licensed under the Apache License, Version 2.0 (the "License");
|
|
you may not use this file except in compliance with the License.
|
|
You may obtain a copy of the License at
|
|
|
|
http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
Unless required by applicable law or agreed to in writing, software
|
|
distributed under the License is distributed on an "AS IS" BASIS,
|
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
See the License for the specific language governing permissions and
|
|
limitations under the License.
|
|
-->
|
|
|
|
<link rel="import" href="../../../bower_components/polymer/polymer.html">
|
|
<link rel="import" href="../../../styles/shared-styles.html">
|
|
|
|
<dom-module id="gr-key-binding-display">
|
|
<template>
|
|
<style include="shared-styles">
|
|
.key {
|
|
background-color: var(--chip-background-color);
|
|
border: 1px solid var(--border-color);
|
|
border-radius: 3px;
|
|
display: inline-block;
|
|
font-weight: var(--font-weight-bold);
|
|
padding: .1em .5em;
|
|
text-align: center;
|
|
}
|
|
</style>
|
|
<template is="dom-repeat" items="[[binding]]">
|
|
<template is="dom-if" if="[[index]]">
|
|
or
|
|
</template>
|
|
<template
|
|
is="dom-repeat"
|
|
items="[[_computeModifiers(item)]]"
|
|
as="modifier">
|
|
<span class="key modifier">[[modifier]]</span>
|
|
</template>
|
|
<span class="key">[[_computeKey(item)]]</span>
|
|
</template>
|
|
</template>
|
|
<script src="gr-key-binding-display.js"></script>
|
|
</dom-module>
|