diff --git a/DevDisciples.Json.Tools.App/src/app/defaults.ts b/DevDisciples.Json.Tools.App/src/app/defaults.ts new file mode 100644 index 0000000..61a22bb --- /dev/null +++ b/DevDisciples.Json.Tools.App/src/app/defaults.ts @@ -0,0 +1,26 @@ +export const MonacoJsonConfig = { + theme: 'vs-dark', + language: 'json', + readOnly: false, + automaticLayout: true +}; + +export const ReadOnlyMonacoJsonConfig = { + theme: 'vs-dark', + language: 'json', + readOnly: true, + automaticLayout: true +}; + +export const ReadOnlyMonacoCSharpConfig = { + theme: 'vs-dark', + language: 'csharp', + readOnly: false, + automaticLayout: true +}; + +export const GenerateDefaultJsonObjectString = (space: number = 0): string => { + return JSON.stringify({first_name: "John", last_name: "Doe"}, null, space); +} + +export const DebounceTime: number = 750; diff --git a/DevDisciples.Json.Tools.App/src/app/input-output/input-output.component.scss b/DevDisciples.Json.Tools.App/src/app/input-output/input-output.component.scss index f7d3e63..750e23a 100644 --- a/DevDisciples.Json.Tools.App/src/app/input-output/input-output.component.scss +++ b/DevDisciples.Json.Tools.App/src/app/input-output/input-output.component.scss @@ -1,12 +1,19 @@ main { display: flex; flex-direction: row; + height: 100%; + width: 100%; #left { - flex: .5; + flex: 0.5; } #right { - flex: .5; + flex: 0.5; + } + + ngx-monaco-editor { + height: 100%; + width: 100%; } } diff --git a/DevDisciples.Json.Tools.App/src/app/json2csharp/json2-csharp.component.ts b/DevDisciples.Json.Tools.App/src/app/json2csharp/json2-csharp.component.ts index d46e6d8..0b5ecf7 100644 --- a/DevDisciples.Json.Tools.App/src/app/json2csharp/json2-csharp.component.ts +++ b/DevDisciples.Json.Tools.App/src/app/json2csharp/json2-csharp.component.ts @@ -1,6 +1,13 @@ -import {AfterViewInit, Component, OnInit} from '@angular/core'; +import {Component, OnInit} from '@angular/core'; import {InputOutputComponent} from "../input-output/input-output.component"; import {JsonTransformService} from "../json-transform.service"; +import { + DebounceTime, + GenerateDefaultJsonObjectString, + MonacoJsonConfig, + ReadOnlyMonacoCSharpConfig +} from "../defaults"; +import {debounceTime, Subject} from "rxjs"; @Component({ selector: 'app-json2csharp', @@ -11,47 +18,27 @@ import {JsonTransformService} from "../json-transform.service"; templateUrl: './json2-csharp.component.html', styleUrl: './json2-csharp.component.scss' }) -export class Json2CsharpComponent implements AfterViewInit { - input: string = JSON.stringify({first_name: "John", last_name: "Doe"}, null, 2); - inputOptions = {theme: 'vs-dark', language: 'json', readOnly: false}; - output: string = JSON.stringify({first_name: "John", last_name: "Doe"}); - outputOptions = {theme: 'vs-dark', language: 'csharp', readOnly: true}; +export class Json2CsharpComponent implements OnInit { + input: string = GenerateDefaultJsonObjectString(2); + $input: Subject = new Subject(); + inputOptions = MonacoJsonConfig; + output: string = ""; + outputOptions = ReadOnlyMonacoCSharpConfig; constructor(private service: JsonTransformService) { } - ngAfterViewInit(): void { - this.service - .json2csharp(this.input) - .subscribe(response => { - console.log(response); - - if (response.status === 200) { - this.output = response.body.result; - } else if (response.status === 499) { - this.output = response.body.detail; - } - }); - } - ngOnInit(): void { - // this.service - // .json2csharp(this.input) - // .subscribe(response => { - // console.log(response); - // - // if (response.status === 200) { - // this.output = response.body.result; - // } else if (response.status === 499) { - // this.output = response.body.detail; - // } - // }); + this.$input + .pipe(debounceTime(DebounceTime)) + .subscribe(input => this.update(input)); + + this.update(this.input); } - handleInputChange($event: any) { - console.log($event); + update(input: string): void { this.service - .json2csharp($event) + .json2csharp(input) .subscribe({ next: response => { console.log(response); @@ -66,4 +53,9 @@ export class Json2CsharpComponent implements AfterViewInit { } }); } + + handleInputChange($event: any): void { + console.log($event); + this.$input.next($event); + } } diff --git a/DevDisciples.Json.Tools.App/src/app/layout/layout.component.html b/DevDisciples.Json.Tools.App/src/app/layout/layout.component.html index 8e59c5f..95eee7e 100644 --- a/DevDisciples.Json.Tools.App/src/app/layout/layout.component.html +++ b/DevDisciples.Json.Tools.App/src/app/layout/layout.component.html @@ -17,9 +17,9 @@ JSON Transform -
+
-
+ diff --git a/DevDisciples.Json.Tools.App/src/app/layout/layout.component.scss b/DevDisciples.Json.Tools.App/src/app/layout/layout.component.scss index 7d04f2a..f72087b 100644 --- a/DevDisciples.Json.Tools.App/src/app/layout/layout.component.scss +++ b/DevDisciples.Json.Tools.App/src/app/layout/layout.component.scss @@ -1,11 +1,15 @@ -.sidenav-container { +mat-sidenav-container { height: 100%; } -.sidenav { +mat-sidenav-content { + overflow: hidden; +} + +mat-sidenav { width: 250px; } -.content { - padding: 16px; +main { + height: 100%; } diff --git a/DevDisciples.Json.Tools.App/src/app/prettify/prettify.component.ts b/DevDisciples.Json.Tools.App/src/app/prettify/prettify.component.ts index 9e7a897..094d757 100644 --- a/DevDisciples.Json.Tools.App/src/app/prettify/prettify.component.ts +++ b/DevDisciples.Json.Tools.App/src/app/prettify/prettify.component.ts @@ -1,8 +1,15 @@ -import {Component} from '@angular/core'; +import {Component, OnInit} from '@angular/core'; import {EditorComponent} from "ngx-monaco-editor-v2"; import {FormsModule} from "@angular/forms"; import {InputOutputComponent} from "../input-output/input-output.component"; import {JsonTransformService} from "../json-transform.service"; +import { + DebounceTime, + GenerateDefaultJsonObjectString, + MonacoJsonConfig, + ReadOnlyMonacoJsonConfig +} from "../defaults"; +import {debounceTime, Subject} from "rxjs"; @Component({ selector: 'app-prettify', @@ -15,20 +22,28 @@ import {JsonTransformService} from "../json-transform.service"; templateUrl: './prettify.component.html', styleUrl: './prettify.component.scss' }) -export class PrettifyComponent { - input: string = JSON.stringify({first_name: "John", last_name: "Doe"}); - inputOptions = {theme: 'vs-dark', language: 'json', readOnly: false}; - output: string = JSON.stringify({first_name: "John", last_name: "Doe"}, null, 2); - outputOptions = {theme: 'vs-dark', language: 'json', readOnly: true}; +export class PrettifyComponent implements OnInit { + input: string = GenerateDefaultJsonObjectString(); + $input: Subject = new Subject(); + inputOptions = MonacoJsonConfig; + output: string = GenerateDefaultJsonObjectString(2); + outputOptions = ReadOnlyMonacoJsonConfig; error: string = ""; constructor(private service: JsonTransformService) { } - handleInputChange($event: any) { - console.log($event); + ngOnInit(): void { + this.$input + .pipe(debounceTime(DebounceTime)) + .subscribe(input => { + this.update(input) + }); + } + + update(input: string): void { this.service - .prettify($event) + .prettify(input) .subscribe({ next: response => { console.log(response); @@ -43,4 +58,9 @@ export class PrettifyComponent { } }); } + + handleInputChange($event: any): void { + console.log($event); + this.$input.next($event); + } } diff --git a/DevDisciples.Json.Tools.App/src/app/uglify/uglify.component.ts b/DevDisciples.Json.Tools.App/src/app/uglify/uglify.component.ts index b68b785..412a591 100644 --- a/DevDisciples.Json.Tools.App/src/app/uglify/uglify.component.ts +++ b/DevDisciples.Json.Tools.App/src/app/uglify/uglify.component.ts @@ -1,6 +1,13 @@ -import {Component} from '@angular/core'; +import {Component, OnInit} from '@angular/core'; import {JsonTransformService} from "../json-transform.service"; import {InputOutputComponent} from "../input-output/input-output.component"; +import { + DebounceTime, + GenerateDefaultJsonObjectString, + MonacoJsonConfig, + ReadOnlyMonacoJsonConfig +} from "../defaults"; +import {debounceTime, Subject} from "rxjs"; @Component({ selector: 'app-uglify', @@ -11,19 +18,27 @@ import {InputOutputComponent} from "../input-output/input-output.component"; templateUrl: './uglify.component.html', styleUrl: './uglify.component.scss' }) -export class UglifyComponent { - input: string = JSON.stringify({first_name: "John", last_name: "Doe"}, null, 2); - inputOptions = {theme: 'vs-dark', language: 'json', readOnly: false}; - output: string = JSON.stringify({first_name: "John", last_name: "Doe"}); - outputOptions = {theme: 'vs-dark', language: 'json', readOnly: true}; +export class UglifyComponent implements OnInit { + input: string = GenerateDefaultJsonObjectString(2); + $input: Subject = new Subject(); + inputOptions = MonacoJsonConfig; + output: string = GenerateDefaultJsonObjectString(); + outputOptions = ReadOnlyMonacoJsonConfig; constructor(private service: JsonTransformService) { } - handleInputChange($event: any) { - console.log($event); + ngOnInit(): void { + this.$input + .pipe(debounceTime(DebounceTime)) + .subscribe(input => { + this.update(input) + }); + } + + update(input: string): void { this.service - .uglify($event) + .uglify(input) .subscribe({ next: response => { console.log(response); @@ -38,4 +53,9 @@ export class UglifyComponent { } }); } + + handleInputChange($event: any): void { + console.log($event); + this.$input.next($event); + } } diff --git a/DevDisciples.Json.Tools/Json2CSharpTranslator.cs b/DevDisciples.Json.Tools/Json2CSharpTranslator.cs index 867f902..d0eddd4 100644 --- a/DevDisciples.Json.Tools/Json2CSharpTranslator.cs +++ b/DevDisciples.Json.Tools/Json2CSharpTranslator.cs @@ -22,7 +22,7 @@ public static partial class Json2CSharpTranslator public static string Translate(string source, Context? context = null) { if (JsonParser.Parse("", source) is not JsonObject root) - throw new Exception("Expected a JSON object."); + throw new ParsingException("Expected a JSON object."); context ??= new(); diff --git a/DevDisciples.Parsing/Report.cs b/DevDisciples.Parsing/Report.cs index 7f13a6c..74acaf1 100644 --- a/DevDisciples.Parsing/Report.cs +++ b/DevDisciples.Parsing/Report.cs @@ -4,16 +4,16 @@ public static class Report { public static Exception Error(ISourceLocation token, string message) { - return new(FormatMessage(token, message)); + return new ParsingException(FormatMessage(token, message)); } public static void Halt(ISourceLocation token, string message) { - throw new(FormatMessage(token, message)); + throw new ParsingException(FormatMessage(token, message)); } - + public static string FormatMessage(ISourceLocation token, string msg) { return $"{token.File}\n\t[line: {token.Line}, column: {token.Column}] {msg}"; } -} +} \ No newline at end of file