GUI2 fixed Quickhelp to use LionService
Change-Id: Id0799dd63de186ada17ec03380576d166947af19
diff --git a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.css b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.css
index 26c1643..e6ef7b6 100644
--- a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.css
+++ b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.css
@@ -35,6 +35,7 @@
#quickhelp div.help table {
vertical-align: top;
+ width: 100%;
}
#quickhelp div.help p {
diff --git a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.html b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.html
index d387284..5c1476a 100644
--- a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.html
+++ b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.html
@@ -20,140 +20,54 @@
<table class="qhrow">
<tr>
<td class="key">\</td>
- <td class="desc">Afficher/cacher l'aide rapide</td>
+ <td class="desc">{{lionFn("qh_hint_show_hide_qh")}}</td>
</tr>
<tr>
<td class="key">/</td>
- <td class="desc">Afficher/cacher l'aide rapide</td>
+ <td class="desc">{{lionFn("qh_hint_show_hide_qh")}}</td>
</tr>
<tr>
<td class="key">Esc</td>
- <td class="desc">ignorer la boîte de dialogue ou annuler les
- sélections
- </td>
+ <td class="desc">{{lionFn("qh_hint_esc")}}</td>
</tr>
<tr>
<td class="key">T</td>
- <td class="desc">basculer de thème</td>
+ <td class="desc">{{lionFn("qh_hint_t")}}</td>
</tr>
</table>
<hr class="qhrowsep">
<table class="qhrow">
- <tr>
- <td class="key">I</td>
- <td class="desc">Basculer au panneau de instance
- ONOS
- </td>
- <td class="key">O</td>
- <td class="desc">Baculer au panneau récapitulatif
- ONOS
- </td>
- <td class="key">D</td>
- <td class="desc">Basculer le panneau de détails</td>
- </tr>
- <tr>
- <td class="key">H</td>
- <td class="desc">Basculer la visibilité de l'hôte
- </td>
- <td class="key">M</td>
- <td class="desc">Basculer la visibilité hors-ligne
- </td>
- <td class="key">P</td>
- <td class="desc">Basculer le port mis en évidence
- </td>
- </tr>
- <tr>
- <td class="key">Dash</td>
- <td class="desc">Montrer les mauvais liens</td>
- <td class="key">B</td>
- <td class="desc">Basculer la carte géo de fond</td>
- <td class="key">G</td>
- <td class="desc">Sélectionner la carte géo de fond
- </td>
- </tr>
- <tr>
- <td class="key">S</td>
- <td class="desc">Toggle sprite layer</td>
- <td class="key" y="0">X</td>
- <td class="desc" y="0" x="33.53125">réinitialiser la
- carte des noeuds
- </td>
- <td class="key">Z</td>
- <td class="desc">Basculer la vue oblique
- (expérimental)
- </td>
- </tr>
- <tr>
- <td class="key">N</td>
- <td class="desc">cycle couche de noeuds</td>
- <td class="key">L</td>
- <td class="desc">Parcourir étiquettes appareils</td>
- <td class="key">Shift-l</td>
- <td class="desc">Parcourir étiquettes hôte</td>
- </tr>
- <tr>
- <td class="key">U</td>
- <td class="desc">survoler avec la souris</td>
- <td class="key">R</td>
- <td class="desc">réinitialiser le zoom et le
- panoramique
- </td>
- <td class="key">E</td>
- <td class="desc">Egaliser les rôles de maîtrises
- </td>
- </tr>
- <tr>
- <td class="key">Dot</td>
- <td class="desc">Basculer a la barre d'outils</td>
- <td class="key">0</td>
- <td class="desc">Annuler la surveillance du trafic
- </td>
- <td class="key">A</td>
- <td class="desc">Surveiller tout le trafic</td>
- </tr>
- <tr>
- <td class="key">F</td>
- <td class="desc">Afficher les flux de liaison de périphérique
- </td>
- <td class="key">V</td>
- <td class="desc">Show all related intents</td>
- <td class="key">L-arrow</td>
- <td class="desc">Show previous related intent</td>
- </tr>
- <tr>
- <td class="key">R-arrow</td>
- <td class="desc">Show next related intent</td>
- <td class="key">W</td>
- <td class="desc">Monitor traffic of selected intent</td>
+ <tr *ngFor="let vk of viewKeys; i as index">
+ <ng-container *ngFor="let vkrow of vk">
+ <td class="key">{{vkrow.keystroke}}</td>
+ <td class="desc">{{vkrow.text}}</td>
+ </ng-container>
</tr>
</table>
- <hr>
+ <hr class="qhrowsep">
<div class="qhrow">
<table class="qh-r4-c0">
<tr>
- <td class="key">cliquer</td>
+ <td class="key">{{lionFn("click")}}</td>
<td class="desc">Sélectionner l'article et montrer les
détails
</td>
</tr>
<tr>
- <td class="key">Cliquer sur MAJ</td>
- <td class="desc">Basculer l'état de sélection</td>
+ <td class="key">{{lionFn("shift-click")}}</td>
+ <td class="desc">{{lionFn("qh_gest_shift_click")}}</td>
</tr>
<tr>
- <td class="key">Glisser</td>
- <td class="desc">Repositionner (et épingler) le périphérique
- / l'hôte
- </td>
+ <td class="key">{{lionFn("drag")}}</td>
+ <td class="desc">{{lionFn("qh_gest_drag")}}</td>
</tr>
<tr>
- <td class="key">cmd défiler</td>
- <td class="desc">Zoom avant/arrière</td>
+ <td class="key">{{lionFn("drag")}}</td>
+ <td class="desc">{{lionFn("qh_gest_cmd_scroll")}}</td>
</tr>
<tr>
- <td class="key" y="48">cmd-glisser</td>
- <td class="desc" y="48" x="74.84375">Pan
- </tr>
+ <td class="key" y="48">{{lionFn("scroll")}}</td>
+ <td class="desc" y="48" x="74.84375">{{lionFn("qh_gest_cmd_drag")}}</tr>
</table>
</div>
</div>
diff --git a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.spec.ts b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.spec.ts
index da60a1b..5dfb73c 100644
--- a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.spec.ts
+++ b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.spec.ts
@@ -26,7 +26,19 @@
class MockFnService {}
class MockKeysService {
+ keyHandler: {
+ viewKeys: any[],
+ globalKeys: any[]
+ };
+ mockViewKeys: Object[];
+ constructor() {
+ this.mockViewKeys = [];
+ this.keyHandler = {
+ viewKeys: this.mockViewKeys,
+ globalKeys: this.mockViewKeys
+ };
+ }
}
/**
diff --git a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.ts b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.ts
index 6789e14..261f49c 100644
--- a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.ts
+++ b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/layer/quickhelp/quickhelp.component.ts
@@ -13,13 +13,17 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
-import {Component} from '@angular/core';
+import {Component, OnInit} from '@angular/core';
import {animate, state, style, transition, trigger} from '@angular/animations';
import {LogService} from '../../log.service';
import {FnService} from '../../util/fn.service';
import {KeysService} from '../../util/keys.service';
import {LionService} from '../../util/lion.service';
+export interface KeyEntry {
+ keystroke: string;
+ text: string;
+}
@Component({
selector: 'onos-quickhelp',
@@ -38,9 +42,23 @@
])
]
})
-export class QuickhelpComponent {
+export class QuickhelpComponent implements OnInit {
lionFn; // Function
+ dialogKeys: Object;
+ globalKeys: Object[];
+ maskedKeys: Object;
+ viewGestures: Object;
+ viewKeys: KeyEntry[][];
+
+ private static extractKeyEntry(viewKeyObj: Object, log: LogService): KeyEntry {
+ const subParts = Object.values(viewKeyObj[1]);
+ return <KeyEntry>{
+ keystroke: <string>viewKeyObj[0],
+ text: <string>subParts[1]
+ };
+ }
+
constructor(
private log: LogService,
private fs: FnService,
@@ -53,10 +71,24 @@
} else {
this.doLion();
}
+ this.globalKeys = [];
+ this.viewKeys = [[], [], [], [], [], [], [], [], []];
- this.log.debug('Quickhelp component constructed');
+ this.log.debug('QuickhelpComponent constructed');
}
+ ngOnInit(): void {
+ Object.entries(this.ks.keyHandler.viewKeys)
+ .filter((vk) => vk[0] !== '_helpFormat' && vk[0] !== '9')
+ .forEach((vk, idx) => {
+ const ke = QuickhelpComponent.extractKeyEntry(vk, this.log);
+ this.viewKeys[Math.floor(idx / 3)][idx % 3] = ke;
+ });
+ this.log.debug('QuickhelpComponent initialized');
+ this.log.debug('view keys retrieved', this.ks.keyHandler.globalKeys);
+ }
+
+
/**
* Read the LION bundle for Toolbar and set up the lionFn
*/