From a66f8482897d09d87048526e54681d8b9af4a9fe Mon Sep 17 00:00:00 2001
From: Snehal Kumbhar <snehal.kumbhar@unil.ch>
Date: Wed, 25 Nov 2020 09:37:43 +0100
Subject: [PATCH] Dsp 945 resource viewer (#330)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* DSP-945-update resource viewer

* enhancement (results-viewer) In worksace, display search results and
  resource viewer in side-by-side column

Co-authored-by: André Kilchenmann <a.kilchenmann@dasch.swiss>
---
 package.json                                     |  1 +
 src/app/app.module.ts                            |  5 ++++-
 src/app/workspace/results/results.component.html | 11 +++++++++--
 src/app/workspace/results/results.component.scss |  1 +
 src/app/workspace/results/results.component.ts   | 10 +++++++++-
 5 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index 0a267e96f7..db03298ab3 100644
--- a/package.json
+++ b/package.json
@@ -36,6 +36,7 @@
         "@dasch-swiss/dsp-ui": "1.0.0-rc.11",
         "@ngx-translate/core": "^13.0.0",
         "@ngx-translate/http-loader": "^6.0.0",
+        "angular-split": "^4.0.0",
         "ckeditor5-custom-build": "github:dasch-swiss/ckeditor_custom_build",
         "core-js": "^3.6.5",
         "d3": "^5.15.1",
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 1092dd8c38..74be1004d8 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -79,6 +79,8 @@ import { SelectResourceClassComponent } from './workspace/resource/resource-inst
 import { SelectPropertiesComponent } from './workspace/resource/resource-instance-form/select-properties/select-properties.component';
 import { SwitchPropertiesComponent } from './workspace/resource/resource-instance-form/select-properties/switch-properties/switch-properties.component';
 
+import { AngularSplitModule } from 'angular-split';
+
 // translate: AoT requires an exported function for factories
 export function HttpLoaderFactory(httpClient: HttpClient) {
     return new TranslateHttpLoader(httpClient, 'assets/i18n/', '.json')
@@ -162,7 +164,8 @@ export function HttpLoaderFactory(httpClient: HttpClient) {
                 useFactory: HttpLoaderFactory,
                 deps: [HttpClient]
             }
-        })
+        }),
+        AngularSplitModule.forRoot()
     ],
     providers: [
         {
diff --git a/src/app/workspace/results/results.component.html b/src/app/workspace/results/results.component.html
index 9eba24f43e..9251c98270 100644
--- a/src/app/workspace/results/results.component.html
+++ b/src/app/workspace/results/results.component.html
@@ -1,3 +1,10 @@
-<div class="content large middle" *ngIf="searchParams">
-    <dsp-list-view [search]="searchParams" (resourceSelected)="openResource($event)"></dsp-list-view>
+<div class="content" *ngIf="searchParams" style="margin-top: 20px; height: 100vh;">
+    <as-split direction="horizontal">
+        <as-split-area [size]="40">
+            <dsp-list-view [search]="searchParams" (resourceSelected)="openResource($event)"></dsp-list-view>
+        </as-split-area>
+        <as-split-area [size]="60">
+            <dsp-resource-view [iri]="resourceIri" (openProject)="openProject($event)"></dsp-resource-view>
+        </as-split-area>
+    </as-split>
 </div>
diff --git a/src/app/workspace/results/results.component.scss b/src/app/workspace/results/results.component.scss
index e69de29bb2..8b13789179 100644
--- a/src/app/workspace/results/results.component.scss
+++ b/src/app/workspace/results/results.component.scss
@@ -0,0 +1 @@
+
diff --git a/src/app/workspace/results/results.component.ts b/src/app/workspace/results/results.component.ts
index a149f03aa7..c0642dfc60 100644
--- a/src/app/workspace/results/results.component.ts
+++ b/src/app/workspace/results/results.component.ts
@@ -1,6 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Params, Router } from '@angular/router';
 import { SearchParams } from '@dasch-swiss/dsp-ui';
+import { ReadProject } from '@dasch-swiss/dsp-js';
 
 @Component({
     selector: 'app-results',
@@ -13,6 +14,8 @@ export class ResultsComponent implements OnInit {
 
     resIri: string;
 
+    resourceIri: string;
+
     constructor(
         private _route: ActivatedRoute,
         private _router: Router
@@ -37,6 +40,11 @@ export class ResultsComponent implements OnInit {
     }
 
     openResource(id: string) {
-        this._router.navigate(['/resource/' + encodeURIComponent(id)]);
+        this.resourceIri = id;
+    }
+
+    // open project in new tab
+    openProject(project: ReadProject){
+        window.open('/project/' + project.shortcode, "_blank");
     }
 }