ontology-class-instance.component.html

<!-- display all resource instances if instance id does not exist -->
<!-- In case if results present -->
<div class="multiple-instances" *ngIf="searchParams">
    <as-split direction="horizontal" (dragEnd)="splitSizeChanged = $event">
        <as-split-area [size]="40">
            <app-list-view [search]="searchParams" [displayViewSwitch]="true" [withMultipleSelection]="true"
            (selectedResources)="openSelectedResources($event)">
            </app-list-view>
        </as-split-area>
        <as-split-area [size]="60" *ngIf="selectedResources?.count > 0" cdkScrollable>
            <div [ngSwitch]="viewMode">
                <!-- single resource view -->
                <app-resource *ngSwitchCase="'single'" [resourceIri]="selectedResources.resInfo[0].id" [splitSizeChanged]="splitSizeChanged"></app-resource>

                <!-- intermediate view -->
                <app-intermediate *ngSwitchCase="'intermediate'" [resources]="selectedResources" (action)="viewMode=$event"></app-intermediate>

                <!-- multiple resources view / comparison viewer -->
                <app-comparison *ngSwitchCase="'compare'" [noOfResources]="selectedResources.count"
                    [resources]="selectedResources.resInfo" [splitSizeChanged]="splitSizeChanged">
                </app-comparison>
            </div>
        </as-split-area>
    </as-split>
</div>


<!-- add new resource instance if instance id is called "add" -->
<div class="single-instance-form" *ngIf="instanceId && instanceId === 'add'">
    <h3>Create new {{classId}} instance</h3>
    <app-resource-instance-form
        [selectedResourceClassIri]="classId"
        [selectedProject]="projectId">
    </app-resource-instance-form>
</div>

<!-- display single resource instance if instance id exists and is not called "add" -->