Remapping: Popover tabs initialization accordance with the key action
This commit is contained in:
@@ -1,35 +1,39 @@
|
||||
<div class="mouse-action col-sm-4">
|
||||
<ul class="nav nav-pills nav-stacked">
|
||||
<li (click)="changePage(0)" [ngClass]="{active: selectedIndex===0}"><a> Move </a></li>
|
||||
<li (click)="changePage(1)" [ngClass]="{active: selectedIndex===1}"><a> Scroll </a></li>
|
||||
<li (click)="changePage(2)" [ngClass]="{active: selectedIndex===2}"><a> Click </a></li>
|
||||
<li (click)="changePage(3)" [ngClass]="{active: selectedIndex===3}"><a> Speed </a></li>
|
||||
<li (click)="changePage(0)" [class.active]="selectedPageIndex === 0"><a> Move </a></li>
|
||||
<li (click)="changePage(1)" [class.active]="selectedPageIndex === 1"><a> Scroll </a></li>
|
||||
<li (click)="changePage(2)" [class.active]="selectedPageIndex === 2"><a> Click </a></li>
|
||||
<li (click)="changePage(3)" [class.active]="selectedPageIndex === 3"><a> Speed </a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="details col-sm-8" [ngSwitch]="selectedIndex">
|
||||
<div class="details col-sm-8" [ngSwitch]="selectedPageIndex">
|
||||
<div *ngSwitchCase="0" class="mouse__config mouse__config--move text-center">
|
||||
<div class="row">
|
||||
<button type="button" class="btn btn-default btn-lg"
|
||||
(click)="onMouseActionClick($event.target, MouseActionParam.moveUp)">
|
||||
[class.btn-primary]="mouseActionParam === MouseActionParam.moveUp"
|
||||
(click)="setMouseActionParam(MouseActionParam.moveUp)">
|
||||
<i class="fa fa-arrow-up"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="row">
|
||||
<button type="button" class="btn btn-default btn-lg"
|
||||
(click)="onMouseActionClick($event.target, MouseActionParam.moveLeft)">
|
||||
[class.btn-primary]="mouseActionParam === MouseActionParam.moveLeft"
|
||||
(click)="setMouseActionParam(MouseActionParam.moveLeft)">
|
||||
<i class="fa fa-arrow-left"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-default btn-lg btn-placeholder">
|
||||
<i class="fa fa-square"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-default btn-lg"
|
||||
(click)="onMouseActionClick($event.target, MouseActionParam.moveRight)">
|
||||
[class.btn-primary]="mouseActionParam === MouseActionParam.moveRight"
|
||||
(click)="setMouseActionParam(MouseActionParam.moveRight)">
|
||||
<i class="fa fa-arrow-right"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="row">
|
||||
<button type="button" class="btn btn-default btn-lg"
|
||||
(click)="onMouseActionClick($event.target, MouseActionParam.moveDown)">
|
||||
[class.btn-primary]="mouseActionParam === MouseActionParam.moveDown"
|
||||
(click)="setMouseActionParam(MouseActionParam.moveDown)">
|
||||
<i class="fa fa-arrow-down"></i>
|
||||
</button>
|
||||
</div>
|
||||
@@ -37,26 +41,30 @@
|
||||
<div *ngSwitchCase="1" class="mouse__config mouse__config--scroll text-center">
|
||||
<div class="row">
|
||||
<button type="button" class="btn btn-default btn-lg"
|
||||
(click)="onMouseActionClick($event.target, MouseActionParam.scrollUp)">
|
||||
[class.btn-primary]="mouseActionParam === MouseActionParam.scrollUp"
|
||||
(click)="setMouseActionParam(MouseActionParam.scrollUp)">
|
||||
<i class="fa fa-angle-double-up"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="row">
|
||||
<button type="button" class="btn btn-default btn-lg"
|
||||
(click)="onMouseActionClick($event.target, MouseActionParam.scrollLeft)">
|
||||
[class.btn-primary]="mouseActionParam === MouseActionParam.scrollLeft"
|
||||
(click)="setMouseActionParam(MouseActionParam.scrollLeft)">
|
||||
<i class="fa fa-angle-double-left"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-default btn-lg btn-placeholder">
|
||||
<i class="fa fa-square"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn-default btn-lg"
|
||||
(click)="onMouseActionClick($event.target, MouseActionParam.scrollRight)">
|
||||
[class.btn-primary]="mouseActionParam === MouseActionParam.scrollRight"
|
||||
(click)="setMouseActionParam(MouseActionParam.scrollRight)">
|
||||
<i class="fa fa-angle-double-right"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="row">
|
||||
<button type="button" class="btn btn-default btn-lg"
|
||||
(click)="onMouseActionClick($event.target, MouseActionParam.scrollDown)">
|
||||
[class.btn-primary]="mouseActionParam === MouseActionParam.scrollDown"
|
||||
(click)="setMouseActionParam(MouseActionParam.scrollDown)">
|
||||
<i class="fa fa-angle-double-down"></i>
|
||||
</button>
|
||||
</div>
|
||||
@@ -64,11 +72,14 @@
|
||||
<div *ngSwitchCase="2" class="mouse__config mouse__config--click">
|
||||
<div class="btn-group col-xs-12" role="group">
|
||||
<button type="button" class="btn btn-default col-xs-4"
|
||||
(click)="onMouseActionClick($event.target, MouseActionParam.leftClick)">Left</button>
|
||||
[class.btn-primary]="mouseActionParam === MouseActionParam.leftClick"
|
||||
(click)="setMouseActionParam(MouseActionParam.leftClick)">Left</button>
|
||||
<button type="button" class="btn btn-default col-xs-4"
|
||||
(click)="onMouseActionClick($event.target, MouseActionParam.middleClick)">Middle</button>
|
||||
[class.btn-primary]="mouseActionParam === MouseActionParam.middleClick"
|
||||
(click)="setMouseActionParam(MouseActionParam.middleClick)">Middle</button>
|
||||
<button type="button" class="btn btn-default col-xs-4"
|
||||
(click)="onMouseActionClick($event.target, MouseActionParam.rightClick)">Right</button>
|
||||
[class.btn-primary]="mouseActionParam === MouseActionParam.rightClick"
|
||||
(click)="setMouseActionParam(MouseActionParam.rightClick)">Right</button>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngSwitchCase="3" class="mouse__config mouse__config--speed text-center">
|
||||
@@ -78,9 +89,11 @@
|
||||
</div>
|
||||
<div class="btn-group btn-group-lg" role="group">
|
||||
<button type="button" class="btn btn-default"
|
||||
(click)="onMouseActionClick($event.target, MouseActionParam.decelerate)">-</button>
|
||||
[class.btn-primary]="mouseActionParam === MouseActionParam.decelerate"
|
||||
(click)="setMouseActionParam(MouseActionParam.decelerate)">-</button>
|
||||
<button type="button" class="btn btn-default"
|
||||
(click)="onMouseActionClick($event.target, MouseActionParam.accelerate)">+</button>
|
||||
[class.btn-primary]="mouseActionParam === MouseActionParam.acelerate"
|
||||
(click)="setMouseActionParam(MouseActionParam.accelerate)">+</button>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngSwitchDefault>
|
||||
|
||||
Reference in New Issue
Block a user