Load viewer on search results click

Refs #283

demo-shell-ng2/app/components/search/search.component.ts

@@ -16,7 +16,9 @@
  */
 
 import { Component } from '@angular/core';
+import { AlfrescoContentService } from 'ng2-alfresco-core';
 import { ALFRESCO_SEARCH_DIRECTIVES } from 'ng2-alfresco-search';
+import { VIEWERCOMPONENT } from 'ng2-alfresco-viewer';
 
 declare let __moduleName: string;
 
@@ -25,17 +27,34 @@ declare let __moduleName: string;
     selector: 'search-component',
     templateUrl: './search.component.html',
     styles: [`
-        :host div {
-            padding: 0 20px;
+        :host div.search-results-container {
+            padding: 0 20px 20px 20px;
         }
         :host h1 {
             font-size: 22px;
         }
+        :host tbody tr {
+            cursor: pointer;
+        }
     `],
-    directives: [ ALFRESCO_SEARCH_DIRECTIVES ]
+    directives: [ ALFRESCO_SEARCH_DIRECTIVES, VIEWERCOMPONENT ]
 })
 export class SearchComponent {
-    constructor() {
-        console.log('SearchComponent constructor');
+
+    previewContentUrl: string;
+    previewName: string;
+    previewMimeType: string;
+    previewActive: boolean = false;
+
+    constructor(public contentService: AlfrescoContentService) {
+    }
+
+    onFileClicked(event) {
+        if (event.value.entry.isFile) {
+            this.previewName = event.value.entry.name;
+            this.previewMimeType = event.value.entry.content.mimeType;
+            this.previewContentUrl = this.contentService.getContentUrl(event.value);
+            this.previewActive = true;
+        }
     }
 }