You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Nothing/src/app/editor/editor.component.html

41 lines
2.1 KiB

<button (click)="save()">Save plan</button>
<div cdkDropListGroup *ngIf="areas" class="editor-container">
<div class="container">
<input type="text" [(ngModel)]="areaSearchString">
CHOSEN FILTER ACT {{filterAct.name}}
<select [(ngModel)]="filterAct">
<option *ngFor="let item of acts" [ngValue]="item">{{item.name}}</option>
</select>
<h2>Campaign zones</h2>
<div cdkDropList [cdkDropListData]="filterAreas()" class="list areas" cdkDropListSortingDisabled
(cdkDropListDropped)="dropHandler($event)">
<div class="box" *ngFor="let item of filterAreas()" cdkDrag (dblclick)="doubleClickArea(item)">
<div class="zone-name">{{item.name}}</div>
<div class="act">Act {{item.act}}</div>
</div>
</div>
</div>
<div class="container">
<span>Auto scroll to end on add to end<input type="checkbox" [(ngModel)]="autoScrollToEnd"></span>
<span>Reverse display: <input type="checkbox" [(ngModel)]="reverseDisplay"></span>
<button (click)="clearPlan()">Clear</button>
<input type="text" [(ngModel)]="planSearchString">
<select [(ngModel)]="planFilterAct">
<option *ngFor="let item of acts" [ngValue]="item">{{item.name}}</option>
</select>
<h2>Plan</h2>
<div cdkDropList #planList [cdkDropListData]="filterPlanElements()" class="list planlist" (cdkDropListDropped)="dropHandler($event)" [cdkDropListDisabled]="disabledPlanDD" [cdkDropListEnterPredicate]="canDrop">
<div class="box" *ngFor="let item of filterPlanElements()" cdkDrag (contextmenu)="addNote($event, item)">
<div class="content">
<div class="zone-name">{{areasMap?.get(item.area_key)?.name}}</div>
<div class="act">Act {{areasMap?.get(item.area_key)?.act}}</div>
</div>
<div class="index">#{{planIndexOf(item)}}</div>
</div>
</div>
<div cdkDropList [cdkDropListData]="plan.plan" class="list planlist end" style="position: relative;display: flex; flex-direction: column; justify-content: center;" (cdkDropListDropped)="dropEndHandler($event)">
<span style="position: absolute; ">Place at end of list</span>
</div>
</div>
</div>