X-Git-Url: https://gerrit.automotivelinux.org/gerrit/gitweb?a=blobdiff_plain;f=webapp%2Fsrc%2Fapp%2F%40theme%2Fcomponents%2Ftheme-settings%2Ftheme-settings.component.ts;fp=webapp%2Fsrc%2Fapp%2F%40theme%2Fcomponents%2Ftheme-settings%2Ftheme-settings.component.ts;h=9cd60fedd8d6103fdf8c27f3a1bf9fa346edefdd;hb=38c0c21a969e621c725245ce91c78e77076c5ce7;hp=0000000000000000000000000000000000000000;hpb=b0d130807fb9bf36f5ac1abe21cbd558eb86d5cc;p=src%2Fxds%2Fxds-agent.git

diff --git a/webapp/src/app/@theme/components/theme-settings/theme-settings.component.ts b/webapp/src/app/@theme/components/theme-settings/theme-settings.component.ts
new file mode 100644
index 0000000..9cd60fe
--- /dev/null
+++ b/webapp/src/app/@theme/components/theme-settings/theme-settings.component.ts
@@ -0,0 +1,65 @@
+import { Component, Input, OnInit } from '@angular/core';
+
+import { StateService } from '../../../@core/data/state.service';
+
+@Component({
+  selector: 'ngx-theme-settings',
+  styleUrls: ['./theme-settings.component.scss'],
+  template: `
+    <h6>LAYOUTS</h6>
+    <div class="settings-row">
+      <a *ngFor="let layout of layouts"
+         href="#"
+         [class.selected]="layout.selected"
+         [attr.title]="layout.name"
+         (click)="layoutSelect(layout)">
+        <i [attr.class]="layout.icon"></i>
+      </a>
+    </div>
+    <h6>SIDEBAR</h6>
+    <div class="settings-row">
+      <a *ngFor="let sidebar of sidebars"
+         href="#"
+         [class.selected]="sidebar.selected"
+         [attr.title]="sidebar.name"
+         (click)="sidebarSelect(sidebar)">
+        <i [attr.class]="sidebar.icon"></i>
+      </a>
+    </div>
+  `,
+})
+export class ThemeSettingsComponent {
+
+  layouts = [];
+  sidebars = [];
+
+  constructor(protected stateService: StateService) {
+    this.stateService.getLayoutStates()
+      .subscribe((layouts: any[]) => this.layouts = layouts);
+
+    this.stateService.getSidebarStates()
+      .subscribe((sidebars: any[]) => this.sidebars = sidebars);
+  }
+
+  layoutSelect(layout: any): boolean {
+    this.layouts = this.layouts.map((l: any) => {
+      l.selected = false;
+      return l;
+    });
+
+    layout.selected = true;
+    this.stateService.setLayoutState(layout);
+    return false;
+  }
+
+  sidebarSelect(sidebars: any): boolean {
+    this.sidebars = this.sidebars.map((s: any) => {
+      s.selected = false;
+      return s;
+    });
+
+    sidebars.selected = true;
+    this.stateService.setSidebarState(sidebars);
+    return false;
+  }
+}