Make disabled buttons not reachable by tab (#297)

- Feature number 13 in the list (group 8)
- This patch fixes the tool buttons behaviours so that when they are
  disabled, thay are not reachable by the tab button

web/src/app/modules/actions/modules/common-controls/components/common-controls.component.html

@@ -1,7 +1,7 @@
 <form *ngIf="isEnabled && connected" class="form-inline">
-    <button id="commoncontrol-save-button" class="btn btn-secondary btn-sm brighter-secondary-outline" title="{{'save' | translate}}" [ngClass]="{'disabled': !isSaveEnabled}" (click)="cancelEvent($event); save()"><i class="fa fa-save" aria-hidden="true"></i></button>&nbsp;
-    <button id="commoncontrol-undo-button" class="btn btn-secondary btn-sm brighter-secondary-outline" title="{{'undo' | translate}}" [ngClass]="{'disabled': !isUndoEnabled}" (click)="cancelEvent($event); undo()"><i class="fa fa-undo" aria-hidden="true"></i></button>&nbsp;
-    <button id="commoncontrol-forward-button" class="btn btn-secondary btn-sm brighter-secondary-outline" title="{{'navigate.back' | translate}}" [ngClass]="{'disabled': !isBackEnabled}" (click)="cancelEvent($event); back()"><i class="fa fa-arrow-circle-left" aria-hidden="true"></i></button>&nbsp;
-    <button id="commoncontrol-back-button" class="btn btn-secondary btn-sm brighter-secondary-outline" title="{{'navigate.forward' | translate}}" [ngClass]="{'disabled': !isForwardEnabled}" (click)="cancelEvent($event); forward()"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i></button>&nbsp;
+    <button id="commoncontrol-save-button" class="btn btn-secondary btn-sm brighter-secondary-outline" title="{{'save' | translate}}" disabled="{{!isSaveEnabled ? 'disabled' : ''}}" [ngClass]="{'disabled': !isSaveEnabled}" (click)="cancelEvent($event); save()"><i class="fa fa-save" aria-hidden="true"></i></button>&nbsp;
+    <button id="commoncontrol-undo-button" class="btn btn-secondary btn-sm brighter-secondary-outline" title="{{'undo' | translate}}" disabled="{{!isUndoEnabled ? 'disabled' : ''}}" [ngClass]="{'disabled': !isUndoEnabled}" (click)="cancelEvent($event); undo()"><i class="fa fa-undo" aria-hidden="true"></i></button>&nbsp;
+    <button id="commoncontrol-forward-button" class="btn btn-secondary btn-sm brighter-secondary-outline" title="{{'navigate.back' | translate}}" disabled="{{!isBackEnabled ? 'disabled' : ''}}" [ngClass]="{'disabled': !isBackEnabled}" (click)="cancelEvent($event); back()"><i class="fa fa-arrow-circle-left" aria-hidden="true"></i></button>&nbsp;
+    <button id="commoncontrol-back-button" class="btn btn-secondary btn-sm brighter-secondary-outline" title="{{'navigate.forward' | translate}}" disabled="{{!isForwardEnabled ? 'disabled' : ''}}" [ngClass]="{'disabled': !isForwardEnabled}" (click)="cancelEvent($event); forward()"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i></button>&nbsp;
 </form>
 <div *ngIf="!connected" class="btn btn-outline-danger btn-sm" title="{{'connection.lost' | translate}}"><i aria-hidden="true" class="fa fa-exclamation-triangle"></i>&nbsp;{{'connection.lost' | translate}}</div>