From 02fd631ce403184c278506045ce4c820d35928db Mon Sep 17 00:00:00 2001 From: Mathieu Guindon Date: Tue, 11 Feb 2025 03:02:31 -0500 Subject: [PATCH 1/3] empty indented code in json copy --- .../src/app/routes/indenter/indenter.component.ts | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/rubberduckvba.client/src/app/routes/indenter/indenter.component.ts b/rubberduckvba.client/src/app/routes/indenter/indenter.component.ts index 78f7244..8095ce0 100644 --- a/rubberduckvba.client/src/app/routes/indenter/indenter.component.ts +++ b/rubberduckvba.client/src/app/routes/indenter/indenter.component.ts @@ -1,7 +1,7 @@ import { Component, OnInit } from "@angular/core"; import { FaIconLibrary } from "@fortawesome/angular-fontawesome"; import { fas } from "@fortawesome/free-solid-svg-icons"; -import { IndenterViewModel } from "../../model/indenter.model"; +import { IndenterViewModel, IndenterViewModelClass } from "../../model/indenter.model"; import { ApiClientService } from "../../services/api-client.service"; @Component({ @@ -29,7 +29,7 @@ export class IndenterComponent implements OnInit { public isAlignmentOptionsExpanded: boolean = false; public isCommentOptionsExpanded: boolean = false; public isVerticalOptionsExpanded: boolean = false; - public isApiAboutBoxExpanded: boolean = true; + public isApiAboutBoxExpanded: boolean = false; public isIndenterBusy: boolean = false; @@ -38,7 +38,9 @@ export class IndenterComponent implements OnInit { } public get asJson(): string { - return JSON.stringify(this._model); + const copy = new IndenterViewModelClass(this._model); + copy.indentedCode = ''; + return JSON.stringify(copy); } public indent(): void { From 37c6e642442161a33d658a0d982ca06c7e6403aa Mon Sep 17 00:00:00 2001 From: Mathieu Guindon Date: Tue, 11 Feb 2025 03:07:01 -0500 Subject: [PATCH 2/3] fix copy commands --- .../src/app/routes/indenter/indenter.component.html | 5 +++-- .../src/app/routes/indenter/indenter.component.ts | 8 ++++++++ 2 files changed, 11 insertions(+), 2 deletions(-) diff --git a/rubberduckvba.client/src/app/routes/indenter/indenter.component.html b/rubberduckvba.client/src/app/routes/indenter/indenter.component.html index f09964e..c43501c 100644 --- a/rubberduckvba.client/src/app/routes/indenter/indenter.component.html +++ b/rubberduckvba.client/src/app/routes/indenter/indenter.component.html @@ -419,8 +419,9 @@

Looking for a programmatic approach?

-
@@ -444,7 +445,7 @@

Try it right here!

Indent diff --git a/rubberduckvba.client/src/app/routes/indenter/indenter.component.ts b/rubberduckvba.client/src/app/routes/indenter/indenter.component.ts index 8095ce0..c5a8864 100644 --- a/rubberduckvba.client/src/app/routes/indenter/indenter.component.ts +++ b/rubberduckvba.client/src/app/routes/indenter/indenter.component.ts @@ -11,6 +11,7 @@ import { ApiClientService } from "../../services/api-client.service"; export class IndenterComponent implements OnInit { private _model!: IndenterViewModel; public wasCopied: boolean = false; + public wasTemplateCopied: boolean = false; constructor(fa: FaIconLibrary, private service: ApiClientService) { @@ -49,16 +50,23 @@ export class IndenterComponent implements OnInit { this.model.indentedCode = vm.indentedCode; this.model.code = vm.indentedCode; this.isIndenterBusy = false; + this.wasCopied = false; + this.wasTemplateCopied = false; }); } public clear(): void { this.model.code = ''; + this.wasCopied = false; + this.wasTemplateCopied = false; } public copy(): void { navigator.clipboard.writeText(this.model.code).then(e => this.wasCopied = true); } + public copyTemplate(): void { + navigator.clipboard.writeText(this.asJson).then(e => this.wasTemplateCopied = true); + } public onModelChanged(code: string): void { this.model.code = code; From 961e73688a67f42cc7b53eade2e34d39bfc9873a Mon Sep 17 00:00:00 2001 From: Mathieu Guindon Date: Tue, 11 Feb 2025 04:32:21 -0500 Subject: [PATCH 3/3] tweaks --- .../routes/indenter/indenter.component.html | 36 ++-- .../app/routes/indenter/indenter.component.ts | 160 ++++++++++++++++-- 2 files changed, 164 insertions(+), 32 deletions(-) diff --git a/rubberduckvba.client/src/app/routes/indenter/indenter.component.html b/rubberduckvba.client/src/app/routes/indenter/indenter.component.html index c43501c..d2ec415 100644 --- a/rubberduckvba.client/src/app/routes/indenter/indenter.component.html +++ b/rubberduckvba.client/src/app/routes/indenter/indenter.component.html @@ -1,4 +1,3 @@ -

Online Indenter

@@ -14,7 +13,7 @@

Online Indenter

-
+
@@ -411,16 +410,15 @@

Looking for a programmatic approach?

Try the API:
    -
  1. Request (GET) api.rubberduckvba.com/indenter/defaults to get a JSON object for the model (or copy it from below);
    2. +
  2. Request (GET) {{apiBaseUrl}}indenter/defaults to get a JSON object for the model (or copy it from below);
  3. Provide the code to be indented in the 'Code' property; use \n for newline characters;
    4. -
  4. Post (POST) the JSON object to api.rubberduckvba.com/indenter/indent to get the indented code back as an array of strings.
    5. +
  5. Post (POST) the JSON object to {{apiBaseUrl}}indenter/indent to get the indented code back as an array of strings.
-
@@ -429,7 +427,7 @@

Looking for a programmatic approach?

-
+

Try it right here!

@@ -451,14 +449,24 @@

Try it right here!

- - - - - - +
- +
+
 Reset to defaults
+
+
+
+ +
+
+
+
+
+ Rubberduck logo +
diff --git a/rubberduckvba.client/src/app/routes/indenter/indenter.component.ts b/rubberduckvba.client/src/app/routes/indenter/indenter.component.ts index c5a8864..c5a606f 100644 --- a/rubberduckvba.client/src/app/routes/indenter/indenter.component.ts +++ b/rubberduckvba.client/src/app/routes/indenter/indenter.component.ts @@ -3,12 +3,23 @@ import { FaIconLibrary } from "@fortawesome/angular-fontawesome"; import { fas } from "@fortawesome/free-solid-svg-icons"; import { IndenterViewModel, IndenterViewModelClass } from "../../model/indenter.model"; import { ApiClientService } from "../../services/api-client.service"; +import { environment } from "../../../environments/environment"; + +export interface IndenterOptionGroups { + isExpanded: boolean; + isIndentOptionsExpanded: boolean; + isOutdentOptionsExpanded: boolean; + isAlignmentOptionsExpanded: boolean; + isCommentOptionsExpanded: boolean; + isVerticalOptionsExpanded: boolean; + isApiAboutBoxExpanded: boolean; +} @Component({ selector: 'app-indenter', templateUrl: './indenter.component.html', }) -export class IndenterComponent implements OnInit { +export class IndenterComponent implements OnInit, IndenterOptionGroups { private _model!: IndenterViewModel; public wasCopied: boolean = false; public wasTemplateCopied: boolean = false; @@ -19,46 +30,149 @@ export class IndenterComponent implements OnInit { } ngOnInit(): void { + const localModel = localStorage.getItem('indenter.model'); + if (localModel) { + this.model = JSON.parse(localModel); + } + + const localOptionGroups = localStorage.getItem('indenter.options'); + if (localOptionGroups) { + const optionGroups = JSON.parse(localOptionGroups); + this.isExpanded = optionGroups.isExpanded; + this.isIndentOptionsExpanded = optionGroups.isIndentOptionsExpanded; + this.isOutdentOptionsExpanded = optionGroups.isOutdentOptionsExpanded; + this.isAlignmentOptionsExpanded = optionGroups.isAlignmentOptionsExpanded; + this.isCommentOptionsExpanded = optionGroups.isCommentOptionsExpanded; + this.isVerticalOptionsExpanded = optionGroups.isVerticalOptionsExpanded; + this.isApiAboutBoxExpanded = optionGroups.isApiAboutBoxExpanded; + } + + this.isLocalStorageOK = localModel != null || localOptionGroups != null; + if (!this.isLocalStorageOK) { + this.getDefaults(); + } + } + + public getDefaults(): void { this.service.getIndenterDefaults().subscribe(model => { - this._model = model; + this.model = model; }); } - public isExpanded: boolean = false; - public isIndentOptionsExpanded: boolean = true; - public isOutdentOptionsExpanded: boolean = false; - public isAlignmentOptionsExpanded: boolean = false; - public isCommentOptionsExpanded: boolean = false; - public isVerticalOptionsExpanded: boolean = false; - public isApiAboutBoxExpanded: boolean = false; + private _isExpanded: boolean = false; + private _isIndentOptionsExpanded: boolean = true; + private _isOutdentOptionsExpanded: boolean = false; + private _isAlignmentOptionsExpanded: boolean = false; + private _isCommentOptionsExpanded: boolean = false; + private _isVerticalOptionsExpanded: boolean = false; + private _isApiAboutBoxExpanded: boolean = false; public isIndenterBusy: boolean = false; + public isLocalStorageOK: boolean = false; public get model(): IndenterViewModel { return this._model; } + private set model(value: IndenterViewModel) { + this._model = value; + this.invalidateClipboard(); + if (this.isLocalStorageOK) { + localStorage.setItem('indenter.model', JSON.stringify(this.model)) + }; + } + public get asJson(): string { const copy = new IndenterViewModelClass(this._model); copy.indentedCode = ''; return JSON.stringify(copy); } + public get isExpanded(): boolean { + return this._isExpanded; + } + public set isExpanded(value: boolean) { + this._isExpanded = value; + this.saveOptions(); + } + public get isIndentOptionsExpanded(): boolean { + return this._isIndentOptionsExpanded; + } + + public set isIndentOptionsExpanded(value: boolean) { + this._isIndentOptionsExpanded = value; + this.saveOptions(); + } + public get isCommentOptionsExpanded(): boolean { + return this._isCommentOptionsExpanded; + } + public set isCommentOptionsExpanded(value: boolean) { + this._isCommentOptionsExpanded = value; + this.saveOptions(); + } + public get isVerticalOptionsExpanded(): boolean { + return this._isVerticalOptionsExpanded; + } + public set isVerticalOptionsExpanded(value: boolean) { + this._isVerticalOptionsExpanded = value; + this.saveOptions(); + } + + public get isApiAboutBoxExpanded(): boolean { + return this._isApiAboutBoxExpanded; + } + public set isApiAboutBoxExpanded(value: boolean) { + this._isApiAboutBoxExpanded = value; + this.saveOptions(); + } + + public get isOutdentOptionsExpanded(): boolean { + return this._isOutdentOptionsExpanded; + } + public set isOutdentOptionsExpanded(value: boolean) { + this._isOutdentOptionsExpanded = value; + this.saveOptions(); + } + public get isAlignmentOptionsExpanded(): boolean { + return this._isAlignmentOptionsExpanded; + } + public set isAlignmentOptionsExpanded(value: boolean) { + this._isAlignmentOptionsExpanded = value; + this.saveOptions(); + } + + private get asOptionGroups(): IndenterOptionGroups { + return { + isExpanded: this.isExpanded, + isIndentOptionsExpanded: this.isIndentOptionsExpanded, + isAlignmentOptionsExpanded: this.isAlignmentOptionsExpanded, + isApiAboutBoxExpanded: this.isApiAboutBoxExpanded, + isCommentOptionsExpanded: this.isCommentOptionsExpanded, + isOutdentOptionsExpanded: this.isOutdentOptionsExpanded, + isVerticalOptionsExpanded: this.isVerticalOptionsExpanded + }; + } + + private saveModel(): void { + if (this.isLocalStorageOK) { + localStorage.setItem('indenter.model', JSON.stringify(this.model)); + } + } + private saveOptions(): void { + localStorage.setItem('indenter.options', JSON.stringify(this.asOptionGroups)); + } + public indent(): void { this.isIndenterBusy = true; this.service.indent(this.model).subscribe(vm => { this.model.indentedCode = vm.indentedCode; this.model.code = vm.indentedCode; this.isIndenterBusy = false; - this.wasCopied = false; - this.wasTemplateCopied = false; - }); - } - public clear(): void { - this.model.code = ''; - this.wasCopied = false; - this.wasTemplateCopied = false; + this.invalidateClipboard(); + this.saveModel(); + this.saveOptions(); + }); } public copy(): void { @@ -68,8 +182,18 @@ export class IndenterComponent implements OnInit { navigator.clipboard.writeText(this.asJson).then(e => this.wasTemplateCopied = true); } + private invalidateClipboard(): void { + this.wasCopied = false; + this.wasTemplateCopied = false; + } + + public get apiBaseUrl(): string { + return environment.apiBaseUrl.replace('https://', ''); + } + public onModelChanged(code: string): void { this.model.code = code; - this.wasCopied = false; + this.invalidateClipboard(); + this.saveModel(); } }