[ADF-2477] add new log component in demo shell (#3129)

* add CTRL + L new log component in demo shell to test the log service bus

* remove trivial definition

* close tag app-log

demo-shell/src/app/app.component.html

@@ -1 +1,2 @@
 <router-outlet></router-outlet>
+<app-log></app-log>

demo-shell/src/app/app.module.ts

@@ -18,6 +18,7 @@ import { SearchBarComponent } from './components/search/search-bar.component';
 import { SearchResultComponent } from './components/search/search-result.component';
 import { SearchExtendedComponent } from './components/search/search-extended.component';
 import { AboutComponent } from './components/about/about.component';
+import { LogComponent } from './components/log/log.component';
 import { FormComponent } from './components/form/form.component';
 import { FormListComponent } from './components/form/form-list.component';
 import { FormLoadingComponent } from './components/form/form-loading.component';
@@ -74,6 +75,7 @@ import { DemoPermissionComponent } from './components/permissions/demo-permissio
         SearchResultComponent,
         SearchExtendedComponent,
         AboutComponent,
+        LogComponent,
         ProcessServiceComponent,
         ShowDiagramComponent,
         FormViewerComponent,

demo-shell/src/app/components/log/log.component.css

@@ -0,0 +1,27 @@
+.log-list-type {
+    float: left;
+}
+
+.log-list-text {
+    float: left;
+}
+
+.log-card {
+    min-width: 200px;
+    z-index: 1;
+    height: 20%;
+    width: 40%;
+    position: fixed;
+    top: 1em;
+    right: 1em;
+    opacity: 0.9;
+    overflow: scroll;
+}
+
+.log-ERROR {
+    color: red;
+}
+
+.log-WARN {
+    color: yellow;
+}

demo-shell/src/app/components/log/log.component.html

@@ -0,0 +1,12 @@
+<mat-card class="log-card" *ngIf="show">
+    <mat-card-header>
+        <mat-card-title><h2>Log Service</h2></mat-card-title>
+    </mat-card-header>
+    <mat-card-content class="log-container">
+
+        <div *ngIf="logsData">
+            <adf-datatable [data]="logsData"></adf-datatable>
+        </div>
+
+    </mat-card-content>
+</mat-card>

demo-shell/src/app/components/log/log.component.ts

@@ -0,0 +1,52 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Component, HostListener } from '@angular/core';
+import { LogService, ObjectDataTableAdapter } from '@alfresco/adf-core';
+
+@Component({
+    selector: 'app-log',
+    templateUrl: './log.component.html',
+    styleUrls: ['./log.component.css']
+})
+export class LogComponent {
+    logs: any[] = [];
+    show = false;
+    ctrlLKey = 12;
+    logsData: ObjectDataTableAdapter;
+
+    constructor(public logService: LogService) {
+
+        logService.onMessage.subscribe((message) => {
+            this.logs.push({ type: message.type, text: JSON.stringify(message.text) });
+            this.logsData = new ObjectDataTableAdapter(this.logs, [
+                { type: 'text', key: 'type', title: 'Log level', sortable: true },
+                { type: 'text', key: 'text', title: 'Message', sortable: false }
+            ]);
+        });
+    }
+
+    @HostListener('document:keypress', ['$event'])
+    handleKeyboardEvent(event: KeyboardEvent) {
+        const key = event.keyCode;
+
+        if (key === this.ctrlLKey) {
+            this.show = !this.show;
+        }
+
+    }
+}

lib/core/services/log.service.ts

@@ -25,21 +25,20 @@ import { Subject } from 'rxjs/Subject';
 @Injectable()
 export class LogService {
 
-    currentLogLevel: LogLevelsEnum = LogLevelsEnum.TRACE;
+    get currentLogLevel() {
+        let configLevel: string = this.appConfig.get<string>('logLevel');
+
+        if (configLevel) {
+            return this.getLogLevel(configLevel);
+        }
+
+        return LogLevelsEnum.TRACE;
+    }
 
     onMessage: Subject<any>;
 
-    constructor(appConfig: AppConfigService) {
-
+    constructor(private appConfig: AppConfigService) {
         this.onMessage = new Subject();
-
-        if (appConfig) {
-            let configLevel: string = appConfig.get<string>('logLevel');
-
-            if (configLevel) {
-                this.currentLogLevel = this.getCurrentLogLevel(configLevel);
-            }
-        }
     }
 
     error(message?: any, ...optionalParams: any[]) {
@@ -117,7 +116,7 @@ export class LogService {
         }
     }
 
-    getCurrentLogLevel(level: string): LogLevelsEnum {
+    getLogLevel(level: string): LogLevelsEnum {
         let referencedLevel = logLevels.find((currentLevel: any) => {
             return currentLevel.name.toLocaleLowerCase() === level.toLocaleLowerCase();
         });