From 82034fef3a68b78e626b1a42432a7e5800c02518 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=87etin?= <69278826+cetincakiroglu@users.noreply.github.com> Date: Mon, 25 Dec 2023 15:28:23 +0300 Subject: [PATCH 1/2] Set version & update primeng version --- package-lock.json | 8 ++++---- package.json | 6 +++--- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/package-lock.json b/package-lock.json index f91f1d4a2..d4f9b7570 100644 --- a/package-lock.json +++ b/package-lock.json @@ -26,7 +26,7 @@ "chart.js": "^3.3.2", "primeflex": "^3.3.1", "primeicons": "6.0.1", - "primeng": "17.1.0", + "primeng": "17.2.0", "prismjs": "^1.29.0", "quill": "^1.3.7", "rxjs": "~7.8.1", @@ -10106,9 +10106,9 @@ "integrity": "sha512-KDeO94CbWI4pKsPnYpA1FPjo79EsY9I+M8ywoPBSf9XMXoe/0crjbUK7jcQEDHuc0ZMRIZsxH3TYLv4TUtHmAA==" }, "node_modules/primeng": { - "version": "17.1.0", - "resolved": "https://registry.npmjs.org/primeng/-/primeng-17.1.0.tgz", - "integrity": "sha512-LpilMBPiTXLiaNADLLlhHTinGNzfD4FjQZQ/uEdE6ATQz/JeSzVGjvspFkQjknTrVbQxPfFMc846aILuS0enDg==", + "version": "17.2.0", + "resolved": "https://registry.npmjs.org/primeng/-/primeng-17.2.0.tgz", + "integrity": "sha512-pajexYLeJWE6+pmDy0gHrMiQ/zLq4il54EcRNWC0jTNgJvWhoz/K/7NL9kXf2H4eWexNcrEieLnO9ko5uj3cVg==", "dependencies": { "tslib": "^2.3.0" }, diff --git a/package.json b/package.json index 847967099..306199358 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "sakai-ng", - "version": "17.2.0", + "version": "17.0.0", "license": "PrimeNG Commercial", "scripts": { "ng": "ng", @@ -29,7 +29,7 @@ "chart.js": "^3.3.2", "primeflex": "^3.3.1", "primeicons": "6.0.1", - "primeng": "17.1.0", + "primeng": "17.2.0", "quill": "^1.3.7", "rxjs": "~7.8.1", "tslib": "^2.5.0", @@ -49,4 +49,4 @@ "karma-jasmine-html-reporter": "~2.1.0", "typescript": "~5.2.2" } -} +} \ No newline at end of file From 7d5cad440ad22efa7bb44f4567e44dc9fe94a22d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=87etin?= <69278826+cetincakiroglu@users.noreply.github.com> Date: Mon, 25 Dec 2023 15:31:46 +0300 Subject: [PATCH 2/2] Refactor config --- src/app/layout/config/app.config.component.ts | 50 +++++++++++-------- src/app/layout/service/app.layout.service.ts | 44 +++++++++------- 2 files changed, 54 insertions(+), 40 deletions(-) diff --git a/src/app/layout/config/app.config.component.ts b/src/app/layout/config/app.config.component.ts index d2290e98f..5831866b3 100644 --- a/src/app/layout/config/app.config.component.ts +++ b/src/app/layout/config/app.config.component.ts @@ -1,23 +1,24 @@ import { Component, Input } from '@angular/core'; -import { LayoutService } from "../service/app.layout.service"; -import { MenuService } from "../app.menu.service"; +import { LayoutService } from '../service/app.layout.service'; +import { MenuService } from '../app.menu.service'; @Component({ selector: 'app-config', - templateUrl: './app.config.component.html' + templateUrl: './app.config.component.html', }) export class AppConfigComponent { - @Input() minimal: boolean = false; scales: number[] = [12, 13, 14, 15, 16]; - constructor(public layoutService: LayoutService, public menuService: MenuService) { } + constructor( + public layoutService: LayoutService, + public menuService: MenuService + ) {} get visible(): boolean { return this.layoutService.state.configSidebarVisible; } - set visible(_val: boolean) { this.layoutService.state.configSidebarVisible = _val; } @@ -25,7 +26,6 @@ export class AppConfigComponent { get scale(): number { return this.layoutService.config().scale; } - set scale(_val: number) { this.layoutService.config.update((config) => ({ ...config, @@ -36,7 +36,6 @@ export class AppConfigComponent { get menuMode(): string { return this.layoutService.config().menuMode; } - set menuMode(_val: string) { this.layoutService.config.update((config) => ({ ...config, @@ -47,7 +46,6 @@ export class AppConfigComponent { get inputStyle(): string { return this.layoutService.config().inputStyle; } - set inputStyle(_val: string) { this.layoutService.config().inputStyle = _val; } @@ -55,7 +53,6 @@ export class AppConfigComponent { get ripple(): boolean { return this.layoutService.config().ripple; } - set ripple(_val: boolean) { this.layoutService.config.update((config) => ({ ...config, @@ -63,29 +60,40 @@ export class AppConfigComponent { })); } + set theme(val: string) { + this.layoutService.config.update((config) => ({ + ...config, + theme: val, + })); + } + get theme(): string { + return this.layoutService.config().theme; + } + + set colorScheme(val: string) { + this.layoutService.config.update((config) => ({ + ...config, + colorScheme: val, + })); + } + get colorScheme(): string { + return this.layoutService.config().colorScheme; + } + onConfigButtonClick() { this.layoutService.showConfigSidebar(); } changeTheme(theme: string, colorScheme: string) { - this.layoutService.config.update((config) => ({ ...config, theme:theme,colorScheme:colorScheme })); + this.theme = theme; + this.colorScheme = colorScheme; } - decrementScale() { this.scale--; - this.applyScale(); } incrementScale() { this.scale++; - this.applyScale(); - } - - applyScale() { - this.layoutService.config.update((config) => ({ - ...config, - scale: this.scale, - })); } } diff --git a/src/app/layout/service/app.layout.service.ts b/src/app/layout/service/app.layout.service.ts index e9ef2d438..812b8ad6c 100644 --- a/src/app/layout/service/app.layout.service.ts +++ b/src/app/layout/service/app.layout.service.ts @@ -23,7 +23,6 @@ interface LayoutState { providedIn: 'root', }) export class LayoutService { - _config: AppConfig = { ripple: false, inputStyle: 'outlined', @@ -41,7 +40,7 @@ export class LayoutService { profileSidebarVisible: false, configSidebarVisible: false, staticMenuMobileActive: false, - menuHoverActive: false + menuHoverActive: false, }; private configUpdate = new Subject(); @@ -52,6 +51,24 @@ export class LayoutService { overlayOpen$ = this.overlayOpen.asObservable(); + constructor() { + effect(() => { + const config = this.config(); + if (this.updateStyle(config)) { + this.changeTheme(); + } + this.changeScale(config.scale); + this.onConfigUpdate(); + }); + } + + updateStyle(config: AppConfig) { + return ( + config.theme !== this._config.theme || + config.colorScheme !== this._config.colorScheme + ); + } + onMenuToggle() { if (this.isOverlay()) { this.state.overlayMenuActive = !this.state.overlayMenuActive; @@ -61,10 +78,11 @@ export class LayoutService { } if (this.isDesktop()) { - this.state.staticMenuDesktopInactive = !this.state.staticMenuDesktopInactive; - } - else { - this.state.staticMenuMobileActive = !this.state.staticMenuMobileActive; + this.state.staticMenuDesktopInactive = + !this.state.staticMenuDesktopInactive; + } else { + this.state.staticMenuMobileActive = + !this.state.staticMenuMobileActive; if (this.state.staticMenuMobileActive) { this.overlayOpen.next(null); @@ -100,20 +118,9 @@ export class LayoutService { this.configUpdate.next(this.config()); } - constructor() { - effect(() => { - const config = this.config(); - this.changeTheme(); - this.changeScale(config.scale); - this.onConfigUpdate(); - }); - } - changeTheme() { const config = this.config(); - const themeLink = ( - document.getElementById('theme-css') - ); + const themeLink = document.getElementById('theme-css'); const themeLinkHref = themeLink.getAttribute('href')!; const newHref = themeLinkHref .split('/') @@ -149,5 +156,4 @@ export class LayoutService { changeScale(value: number) { document.documentElement.style.fontSize = `${value}px`; } - }