gisaf-frontend/src/app/map/tree-layer/tree-layer.component.html
2024-02-27 11:52:00 +05:30

83 lines
3.5 KiB
HTML

<div class="title"
matTooltip="Individual layers, organized by Misc (custom defined), survey categories, and live (computed, dynamic)"
matTooltipPosition="right"
>
Layers
</div>
<div class="loadingIndicator" *ngIf='loading'>
<mat-progress-bar mode="indeterminate"></mat-progress-bar>
</div>
<mat-tree class="noselect" [dataSource]="nestedDataSource" [treeControl]="treeControl">
<mat-nested-tree-node *matTreeNodeDef="let node">
<div class="mat-tree-node">
<button
*ngIf="node.hasChildren()"
mat-icon-button
matTreeNodeToggle
[matTreeNodeToggleRecursive]=false
[disabled]="!node.hasChildren()"
[attr.aria-label]="'toggle ' + node.name">
<mat-icon>
{{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
</mat-icon>
</button>
<gisaf-tree-layer-item
[node]="node"
[checked]="isNodeActive(node)"
[layerNodeMenu]="layerNodeMenu"
[layerGroupNodeMenu]="layerGroupNodeMenu"
(showLayer)="showLayer.emit($event)"
(hideLayer)="hideLayer.emit($event)"
(layerItemSelectionToggle)="layerItemSelectionToggle($event)"
(toggleNode)="treeControl.toggle(node)"
>
</gisaf-tree-layer-item>
</div>
<div class="map-tree-node-nested"
[class.map-invisible]="!treeControl.isExpanded(node)">
<ng-container matTreeNodeOutlet></ng-container>
</div>
</mat-nested-tree-node>
</mat-tree>
<mat-menu #layerGroupNodeMenu="matMenu" class='extended-width'>
<ng-template matMenuContent let-node="node">
<button mat-menu-item (click)="downloadGpkg(node)">
<mat-icon>file_download</mat-icon>
<span>Download Geopackage (EPSG {{ (configService.conf | async).geo['srid'] }})</span>
</button>
</ng-template>
</mat-menu>
<mat-menu #layerNodeMenu="matMenu" class='extended-width'>
<ng-template matMenuContent let-node="node">
<button mat-menu-item (click)="downloadGpkg(node)">
<mat-icon>file_download</mat-icon>
<span>Download Geopackage (EPSG {{ (configService.conf | async).proj['srid'] }})</span>
</button>
<button mat-menu-item (click)="downloadDXF(node)">
<mat-icon>file_download</mat-icon>
<span>Download DXF (EPSG {{ (configService.conf | async).proj['srid'] }})</span>
</button>
<button mat-menu-item (click)="downloadDXF(node, true)">
<mat-icon>file_download</mat-icon>
<span>Download DXF (reprojected to EPSG {{ (configService.conf | async).proj['srid_for_proj'] }})</span>
</button>
<button mat-menu-item (click)="downloadLayer(node)">
<mat-icon>file_download</mat-icon>
<span>Download Shapefile (EPSG {{ (configService.conf | async).proj['srid'] }}) [<i><b>Deprecated</b>: use Geopackage</i>]</span>
</button>
<button mat-menu-item (click)="downloadRawData(node)" *ngIf="node.rawSurveyStore">
<mat-icon>file_download</mat-icon>
<span>Download Shapefile of raw survey points</span>
</button>
<!--
<button mat-menu-item (click)="goToAdmin(node)">
<mat-icon>star</mat-icon>
<span>Go to admin for this layer</span>
</button>
-->
</ng-template>
</mat-menu>