@thecodeblogs/blog 0.19.9 → 0.20.1

package/fesm2022/thecodeblogs-blog.mjs

@@ -4,22 +4,16 @@ import { Injectable, EventEmitter, PLATFORM_ID, Inject, SecurityContext, Compone
 import * as i1 from '@angular/common/http';
 import { HttpParams } from '@angular/common/http';
 import { map, debounceTime } from 'rxjs/operators';
-import { Subject, Subscription } from 'rxjs';
-import * as i2$1 from '@angular/common';
-import { isPlatformBrowser, CommonModule } from '@angular/common';
-import 'clipboard';
-import 'prismjs';
-import 'prismjs/plugins/toolbar/prism-toolbar';
-import 'prismjs/plugins/copy-to-clipboard/prism-copy-to-clipboard';
-import 'prismjs/components/prism-css';
-import 'prismjs/components/prism-javascript';
-import 'prismjs/components/prism-java';
-import 'prismjs/components/prism-markup';
-import 'prismjs/components/prism-typescript';
-import 'prismjs/components/prism-sass';
-import 'prismjs/components/prism-scss';
+import { Subject, of, Subscription } from 'rxjs';
+import { Utility as Utility$1 } from '@blog/services/utility';
+import * as i6 from '@angular/common';
+import { isPlatformBrowser, NgIf, CommonModule } from '@angular/common';
 import * as i2 from 'ngx-device-detector';
 import * as i1$1 from '@angular/platform-browser';
+import { Entry as Entry$1 } from '@blog/data/entry';
+import { Section as Section$1 } from '@blog/data/section';
+import { Content as Content$1 } from '@blog/data/content';
+import { ContentType as ContentType$1 } from '@blog/data/content-type';
 import { ENTER, COMMA, TAB } from '@angular/cdk/keycodes';
 import * as i1$2 from '@angular/material/dialog';
 import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
@@ -29,44 +23,44 @@ import * as i4 from '@angular/material/table';
 import { MatTableModule } from '@angular/material/table';
 import * as i5 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
-import * as i6 from 'ng2-file-upload';
+import * as i6$1 from 'ng2-file-upload';
 import { FileUploader, FileUploadModule } from 'ng2-file-upload';
 import * as i3$1 from '@fortawesome/angular-fontawesome';
 import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
 import { faSpinner } from '@fortawesome/free-solid-svg-icons';
-import * as i6$1 from '@angular/forms';
+import * as i7 from '@angular/forms';
 import { UntypedFormControl, FormsModule, ReactiveFormsModule, FormControl } from '@angular/forms';
 import { MatSelectModule } from '@angular/material/select';
-import * as i10 from '@angular/material/input';
+import * as i11 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
-import * as i7 from '@angular/material/form-field';
+import * as i8 from '@angular/material/form-field';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import * as i9 from '@angular/material/card';
 import { MatCardModule } from '@angular/material/card';
 import { MatChipsModule } from '@angular/material/chips';
 import { MatIconModule } from '@angular/material/icon';
 import { MatAutocompleteModule } from '@angular/material/autocomplete';
-import * as i9$1 from '@angular/material/radio';
+import * as i10 from '@angular/material/radio';
 import { MatRadioModule } from '@angular/material/radio';
-import * as i12 from '@angular/material/datepicker';
+import * as i13 from '@angular/material/datepicker';
 import { MatDatepickerModule } from '@angular/material/datepicker';
-import * as i4$1 from '@angular/material/timepicker';
+import * as i14 from '@angular/material/timepicker';
 import { MatTimepickerModule } from '@angular/material/timepicker';
-import * as i11 from '@angular/cdk/text-field';
-import { trigger, state, transition, style, animate } from '@angular/animations';
+import { provideNativeDateAdapter, MatNativeDateModule } from '@angular/material/core';
 import * as i1$3 from '@angular/router';
 import { NavigationEnd, RouterModule } from '@angular/router';
-import * as i4$2 from '@angular/cdk/drag-drop';
+import * as i12 from '@angular/cdk/text-field';
+import { trigger, state, transition, style, animate } from '@angular/animations';
+import * as i4$1 from '@angular/cdk/drag-drop';
 import { DragDropModule } from '@angular/cdk/drag-drop';
 import * as i6$2 from '@angular/material/progress-spinner';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import * as i2$2 from '@angular/material/sidenav';
+import * as i2$1 from '@angular/material/sidenav';
 import { MatSidenavModule } from '@angular/material/sidenav';
-import * as i9$2 from '@angular/material/list';
+import * as i9$1 from '@angular/material/list';
 import { MatListModule } from '@angular/material/list';
 import Autolinker from 'autolinker';
 import { MatCheckboxModule } from '@angular/material/checkbox';
-import { MatNativeDateModule } from '@angular/material/core';
 
 class Guid {
     newGuid() {
@@ -363,6 +357,12 @@ class EntryService extends DjangoRestFrameworkEndpointService {
     delete(entity) {
         return this.http.delete(this.adminEndpoint + entity.id + '/').pipe(map((val) => this.triggerCoreEvent(val, CoreEventType.DELETE)), map(this.handleResponse.bind(this)));
     }
+    convertHtmlToBlogFormat(entry, html) {
+        return Utility$1.convertHtmlToBlogFormat(entry, html);
+    }
+    convertBlogToHtmlFormat(entry) {
+        return Utility$1.convertBlogToHtml(entry);
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: EntryService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: EntryService, providedIn: 'root' }); }
 }
@@ -378,7 +378,16 @@ class IdentityService {
         this.http = http;
     }
     getMe() {
-        throw new Error('You must provide an implementation for this');
+        console.error('You must provide an implementation for this');
+        return of({
+            id: 1,
+            username: "fakeadmin",
+            email: "admin@example.com",
+            display_name: "Fake Admin",
+            comments_public: false,
+            gravatar_url: "",
+            fake: true
+        });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: IdentityService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: IdentityService, providedIn: 'root' }); }
@@ -391,15 +400,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
         }], ctorParameters: () => [{ type: i1.HttpClient }] });
 
 class PrismService {
+    testPrism() {
+        if (typeof (Prism) !== 'undefined') {
+            if (Prism) {
+                return true;
+            }
+        }
+        return false;
+    }
     constructor(platformId) {
         this.platformId = platformId;
-        if (Prism) {
+        if (this.testPrism()) {
             Prism.manual = true;
         }
     }
     highlightAll() {
         if (isPlatformBrowser(this.platformId)) {
-            Prism.highlightAll();
+            if (this.testPrism()) {
+                Prism.highlightAll();
+            }
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: PrismService, deps: [{ token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Injectable }); }
@@ -558,6 +577,167 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                 }]
         }], ctorParameters: () => [{ type: i1.HttpClient }] });
 
+class Utility {
+    static replaceNbsps(str) {
+        var re = new RegExp(String.fromCharCode(160), "g");
+        return str.replace(re, " ");
+    }
+    static convertHTMLToType(el) {
+        var value = "";
+        var contentType = "";
+        // First test for custom objects
+        var testValue = el.innerText;
+        try {
+            var obj = JSON.parse(testValue);
+            return obj;
+        }
+        catch (error) {
+            //console.error(error);
+        }
+        //console.log(el.tagName);
+        switch (el.tagName.toLowerCase()) {
+            case "p":
+                if (el.children.length > 0) {
+                    var child = el.children[0];
+                    if (child.tagName.toLowerCase() === "a") {
+                        var c = new Content$1();
+                        value = child.href;
+                        c.value = value;
+                        c.title = Utility.replaceNbsps(child.innerText);
+                        c.type = ContentType$1.URL;
+                        return c;
+                    }
+                    else if (child.tagName.toLowerCase() === 'img') {
+                        var c = new Content$1();
+                        value = child.src;
+                        c.value = value;
+                        c.type = ContentType$1.IMAGE;
+                        return c;
+                    }
+                }
+                else {
+                    var c = new Content$1();
+                    value = Utility.replaceNbsps(el.innerText);
+                    c.value = value;
+                    c.type = ContentType$1.TEXT;
+                    return c;
+                }
+                break;
+            case "a":
+                var c = new Content$1();
+                value = el.href;
+                c.value = value;
+                c.title = Utility.replaceNbsps(el.innerText);
+                c.type = ContentType$1.URL;
+                return c;
+                break;
+            case "h4":
+                var s = new Section$1();
+                value = Utility.replaceNbsps(el.innerText);
+                s.subheading = Utility.replaceNbsps(value);
+                return s;
+                break;
+            case "blockquote":
+                var c = new Content$1();
+                value = el.innerHTML;
+                c.value = "<blockquote>" + value + "</blockquote>";
+                c.type = ContentType$1.HTML;
+                return c;
+                break;
+            default:
+                var c = new Content$1();
+                value = el.innerHTML;
+                c.value = value;
+                c.type = ContentType$1.HTML;
+                return c;
+                break;
+        }
+    }
+    static convertHtmlToBlogFormat(entry, html) {
+        entry.sections = [];
+        var newEntry = new Entry$1(entry);
+        var el = document.createElement('html');
+        el.innerHTML = html;
+        // Creating the HTML element adds a head and body
+        // We hardcode to 1 to reference the body, and its
+        // child elements
+        var children = el.children[1].children;
+        ;
+        var section = new Section$1();
+        section.subheading = "";
+        for (let i = 0; i < children.length; i++) {
+            var child = children[i];
+            var thing = Utility.convertHTMLToType(child);
+            //console.log('Thing: ' + JSON.stringify(thing));
+            //console.log('Typeof: ' + JSON.stringify(typeof(thing)));
+            if (thing instanceof Section$1) {
+                section = thing;
+                section.order = i * 10;
+                entry.sections.push(section);
+            }
+            else if (thing instanceof Content$1) {
+                if (entry.sections.length === 0) {
+                    thing.order = i * 10;
+                    section.contents.push(thing);
+                    entry.sections.push(section);
+                    section.order = i * 10;
+                }
+                else {
+                    thing.order = i * 10;
+                    section.contents.push(thing);
+                }
+            }
+            else {
+                if (thing !== null && typeof (thing) !== 'undefined') {
+                    thing.order = i * 10;
+                    section.contents.push(thing);
+                }
+            }
+        }
+        //console.log('E: ' + JSON.stringify(entry));
+        return entry;
+    }
+    static convertTypeToHTML(content) {
+        switch (content.type) {
+            case ContentType$1.CODE:
+                return '<pre><code class="language-ts">' + content?.value + '</code></pre>';
+                break;
+            case ContentType$1.IMAGE:
+                return '<img src="' + content?.value + '"/>';
+                break;
+            case ContentType$1.MEDIA:
+                return '<pre>' + JSON.stringify(content) + '</pre>';
+                break;
+            case ContentType$1.HTML:
+                return content.value;
+                break;
+            case ContentType$1.URL:
+                return '<a target="_blank" href="' + content.value + '">' + content.title + '</a><br>';
+                break;
+            case ContentType$1.TEXT:
+                return '<p>' + content.value + '</p>';
+                break;
+            default:
+                return '<pre>' + JSON.stringify(content) + '</pre>';
+                break;
+        }
+    }
+    static convertBlogToHtml(blog) {
+        var html = "";
+        var sections = blog.sections;
+        for (var i = 0; i < sections.length; i++) {
+            var section = sections[i];
+            html = html + '<h4>' + section.subheading + '</h4>';
+            var contents = section.contents;
+            for (var j = 0; j < contents.length; j++) {
+                var content = contents[j];
+                html = html + Utility.convertTypeToHTML(content);
+            }
+        }
+        return html;
+    }
+}
+
 class EntrySelectorDialogData {
 }
 
@@ -595,11 +775,12 @@ class EntrySelectorDialogComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: EntrySelectorDialogComponent, deps: [{ token: i1$2.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: EntryService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: EntrySelectorDialogComponent, isStandalone: true, selector: "app-entry-selector-dialog", ngImport: i0, template: "<h1 mat-dialog-title>Select an Entry to Edit</h1>\n<!--<mat-radio-group aria-label=\"Select an option\">-->\n<!--    <mat-radio-button class=\"option\" value=\"unpublished\">Unpublished</mat-radio-button>-->\n<!--    <mat-radio-button class=\"option\" value=\"published\">Published</mat-radio-button>-->\n<!--</mat-radio-group>-->\n<mat-divider class=\"option-list-divider\"></mat-divider>\n<div mat-dialog-content>\n\n  <table mat-table [dataSource]=entries>\n    <ng-container matColumnDef=\"id\">\n      <th mat-header-cell *matHeaderCellDef> Id </th>\n      <td mat-cell *matCellDef=\"let entry\"> {{entry.id}} </td>\n    </ng-container>\n    <ng-container matColumnDef=\"title\">\n      <th mat-header-cell *matHeaderCellDef> Title </th>\n      <td mat-cell *matCellDef=\"let entry\"> {{entry.title}} </td>\n    </ng-container>\n    <ng-container matColumnDef=\"create_date\">\n      <th mat-header-cell *matHeaderCellDef> Created </th>\n      <td mat-cell *matCellDef=\"let entry\"> {{entry.create_date}} </td>\n    </ng-container>\n    <ng-container matColumnDef=\"actions\">\n      <th mat-header-cell *matHeaderCellDef> Actions </th>\n      <td mat-cell *matCellDef=\"let entry\">\n        <button mat-button color=\"primary\" (click)=\"select(entry)\">Edit</button> | <button mat-button color=\"warn\" (click)=\"delete(entry)\">Delete</button>\n      </td>\n    </ng-container>\n    <tr mat-header-row *matHeaderRowDef=\"columnsToDisplay\"></tr>\n    <tr mat-row *matRowDef=\"let myRowData; columns: columnsToDisplay\"></tr>\n  </table>\n  <div *ngIf=\"!entries?.length\">There are no unpublished entries</div>\n</div>\n<div mat-dialog-actions>\n  <button mat-button (click)=\"onNoClick()\">Cancel</button>\n</div>\n", styles: [".entry-checkbox-container{display:inline-block;width:100%;margin:5px 0}.option-list-divider{margin:10px 0}.option{margin-right:5px}.mat-column-actions{min-width:175px}.mat-column-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:365px}\n"], dependencies: [{ kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i4.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i4.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: EntrySelectorDialogComponent, isStandalone: true, selector: "app-entry-selector-dialog", ngImport: i0, template: "<h1 mat-dialog-title>Select an Entry to Edit</h1>\n<!--<mat-radio-group aria-label=\"Select an option\">-->\n<!--    <mat-radio-button class=\"option\" value=\"unpublished\">Unpublished</mat-radio-button>-->\n<!--    <mat-radio-button class=\"option\" value=\"published\">Published</mat-radio-button>-->\n<!--</mat-radio-group>-->\n<mat-divider class=\"option-list-divider\"></mat-divider>\n<div mat-dialog-content>\n\n  <table mat-table [dataSource]=entries>\n    <ng-container matColumnDef=\"id\">\n      <th mat-header-cell *matHeaderCellDef> Id </th>\n      <td mat-cell *matCellDef=\"let entry\"> {{entry.id}} </td>\n    </ng-container>\n    <ng-container matColumnDef=\"title\">\n      <th mat-header-cell *matHeaderCellDef> Title </th>\n      <td mat-cell *matCellDef=\"let entry\"> {{entry.title}} </td>\n    </ng-container>\n    <ng-container matColumnDef=\"create_date\">\n      <th mat-header-cell *matHeaderCellDef> Created </th>\n      <td mat-cell *matCellDef=\"let entry\"> {{entry.create_date}} </td>\n    </ng-container>\n    <ng-container matColumnDef=\"actions\">\n      <th mat-header-cell *matHeaderCellDef> Actions </th>\n      <td mat-cell *matCellDef=\"let entry\">\n        <button mat-button color=\"primary\" (click)=\"select(entry)\">Edit</button> | <button mat-button color=\"warn\" (click)=\"delete(entry)\">Delete</button>\n      </td>\n    </ng-container>\n    <tr mat-header-row *matHeaderRowDef=\"columnsToDisplay\"></tr>\n    <tr mat-row *matRowDef=\"let myRowData; columns: columnsToDisplay\"></tr>\n  </table>\n  <div *ngIf=\"!entries?.length\">There are no unpublished entries</div>\n</div>\n<div mat-dialog-actions>\n  <button mat-button (click)=\"onNoClick()\">Cancel</button>\n</div>\n", styles: [".entry-checkbox-container{display:inline-block;width:100%;margin:5px 0}.option-list-divider{margin:10px 0}.option{margin-right:5px}.mat-column-actions{min-width:175px}.mat-column-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:365px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i4.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i4.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: EntrySelectorDialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-entry-selector-dialog', imports: [
+                        NgIf,
                         MatDividerModule,
                         MatTableModule,
                         MatButtonModule,
@@ -745,7 +926,7 @@ class MediaUploadModalComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: MediaUploadModalComponent, deps: [{ token: i1$2.MatDialogRef }, { token: UploadService }, { token: i3$1.FaIconLibrary }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: MediaUploadModalComponent, isStandalone: true, selector: "app-media-upload-modal", inputs: { allowedMimeTypes: "allowedMimeTypes", uploadUrlKey: "uploadUrlKey", file: "file" }, host: { listeners: { "document:paste": "onPaste($event)" } }, ngImport: i0, template: "<h1 mat-dialog-title>Upload an Image</h1>\n<!--<mat-radio-group aria-label=\"Select an option\">-->\n<!--    <mat-radio-button class=\"option\" value=\"unpublished\">Unpublished</mat-radio-button>-->\n<!--    <mat-radio-button class=\"option\" value=\"published\">Published</mat-radio-button>-->\n<!--</mat-radio-group>-->\n<mat-divider class=\"option-list-divider\"></mat-divider>\n<div mat-dialog-content>\n    <div *ngIf=\"uploading\">\n        <fa-icon [icon]=\"'spinner'\" animation=\"spin\"></fa-icon>\n    </div>\n    <ng-container *ngIf=\"!imgLink && !uploading\">\n        <h4>Select a File</h4>\n        <div class=\"input-group\">\n            <div class=\"form-group\">\n                <!--                <label for=\"import_file\">Choose File</label>-->\n                <input type=\"file\" id=\"import_file\"\n                       *ngIf=\"uploader.queue.length==0 && !uploading\"\n                       ng2FileSelect\n                       [uploader]=\"uploader\"\n                       (onFileSelected)=\"onFileSelected($event)\"\n                >\n            </div>\n        </div>\n        <br>\n        <h3>Paste a File</h3>\n        <p>You can use the paste command to paste any image here</p>\n    </ng-container>\n    <div *ngIf=\"imgLink\">\n        <img *ngIf=\"imgLink\" [src]=\"imgLink\"/>\n    </div>\n    <div *ngIf=\"error\">\n        <div class=\"alert alert-danger\">\n            {{error}}\n        </div>\n    </div>\n</div>\n<div mat-dialog-actions>\n    <button mat-button [disabled]=\"!imgLink || uploading\" (click)=\"close()\">Attach</button>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i3$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "ngmodule", type: FileUploadModule }, { kind: "directive", type: i6.FileSelectDirective, selector: "[ng2FileSelect]", inputs: ["uploader"], outputs: ["onFileSelected"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: MediaUploadModalComponent, isStandalone: true, selector: "app-media-upload-modal", inputs: { allowedMimeTypes: "allowedMimeTypes", uploadUrlKey: "uploadUrlKey", file: "file" }, host: { listeners: { "document:paste": "onPaste($event)" } }, ngImport: i0, template: "<h1 mat-dialog-title>Upload an Image</h1>\n<!--<mat-radio-group aria-label=\"Select an option\">-->\n<!--    <mat-radio-button class=\"option\" value=\"unpublished\">Unpublished</mat-radio-button>-->\n<!--    <mat-radio-button class=\"option\" value=\"published\">Published</mat-radio-button>-->\n<!--</mat-radio-group>-->\n<mat-divider class=\"option-list-divider\"></mat-divider>\n<div mat-dialog-content>\n    <div *ngIf=\"uploading\">\n        <fa-icon [icon]=\"'spinner'\" animation=\"spin\"></fa-icon>\n    </div>\n    <ng-container *ngIf=\"!imgLink && !uploading\">\n        <h4>Select a File</h4>\n        <div class=\"input-group\">\n            <div class=\"form-group\">\n                <!--                <label for=\"import_file\">Choose File</label>-->\n                <input type=\"file\" id=\"import_file\"\n                       *ngIf=\"uploader.queue.length==0 && !uploading\"\n                       ng2FileSelect\n                       [uploader]=\"uploader\"\n                       (onFileSelected)=\"onFileSelected($event)\"\n                >\n            </div>\n        </div>\n        <br>\n        <h3>Paste a File</h3>\n        <p>You can use the paste command to paste any image here</p>\n    </ng-container>\n    <div *ngIf=\"imgLink\">\n        <img *ngIf=\"imgLink\" [src]=\"imgLink\"/>\n    </div>\n    <div *ngIf=\"error\">\n        <div class=\"alert alert-danger\">\n            {{error}}\n        </div>\n    </div>\n</div>\n<div mat-dialog-actions>\n    <button mat-button [disabled]=\"!imgLink || uploading\" (click)=\"close()\">Attach</button>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i3$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "ngmodule", type: FileUploadModule }, { kind: "directive", type: i6$1.FileSelectDirective, selector: "[ng2FileSelect]", inputs: ["uploader"], outputs: ["onFileSelected"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: MediaUploadModalComponent, decorators: [{
             type: Component,
@@ -768,7 +949,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
             }] } });
 
 class EntryCreatorComponent {
-    static { this.CURRENT_ENTRY = 'current_entry'; }
+    static { this.CURRENT_ENTRY_KEY = 'current_entry'; }
     static { this.DEFAULT_NEW_ENTRY_TITLE = 'A New Entry'; }
     static getCookie(name) {
         const ca = document.cookie.split(';');
@@ -783,7 +964,8 @@ class EntryCreatorComponent {
         }
         return '';
     }
-    constructor(entryService, tagService, identityService, cdr, dialog) {
+    constructor(router, entryService, tagService, identityService, cdr, dialog) {
+        this.router = router;
         this.entryService = entryService;
         this.tagService = tagService;
         this.identityService = identityService;
@@ -889,7 +1071,7 @@ class EntryCreatorComponent {
         this.identityService.getMe().subscribe((me) => {
             this.me = me;
         });
-        const savedEntry = localStorage.getItem(EntryCreatorComponent.CURRENT_ENTRY);
+        const savedEntry = localStorage.getItem(EntryCreatorComponent.CURRENT_ENTRY_KEY);
         if (savedEntry) {
             this.entry = new Entry(JSON.parse(savedEntry));
             if (this.entry.should_publish_in_future && this.entry.future_publish_date < new Date()) {
@@ -967,7 +1149,7 @@ class EntryCreatorComponent {
     }
     onChange() {
         this.entry.slug = this.entryService.slugify(this.entry.title).toLowerCase();
-        localStorage.setItem(EntryCreatorComponent.CURRENT_ENTRY, JSON.stringify(this.entry));
+        localStorage.setItem(EntryCreatorComponent.CURRENT_ENTRY_KEY, JSON.stringify(this.entry));
         this.entry.sort();
         this.cdr.detectChanges();
         this.entryService.currentlyEditedEntry.next(this.entry);
@@ -986,7 +1168,7 @@ class EntryCreatorComponent {
             this.entry.published = false;
             this.entry.version = 1;
             this.entryService.currentlyEditedEntry.next(this.entry);
-            localStorage.setItem(EntryCreatorComponent.CURRENT_ENTRY, JSON.stringify(this.entry));
+            localStorage.setItem(EntryCreatorComponent.CURRENT_ENTRY_KEY, JSON.stringify(this.entry));
             this.entryService.create(this.entry).subscribe((next) => {
             });
         }
@@ -1001,7 +1183,7 @@ class EntryCreatorComponent {
                 this.entryService.getUnpublishedById(id).subscribe((result) => {
                     const entry = result;
                     this.entryService.currentlyEditedEntry.next(entry);
-                    localStorage.setItem(EntryCreatorComponent.CURRENT_ENTRY, JSON.stringify(entry));
+                    localStorage.setItem(EntryCreatorComponent.CURRENT_ENTRY_KEY, JSON.stringify(entry));
                     this.entry = entry;
                 });
             }
@@ -1011,7 +1193,7 @@ class EntryCreatorComponent {
         this.entryService.currentlyEditedEntry.next(null);
         this.entry = null;
         this.seeEntries();
-        localStorage.removeItem(EntryCreatorComponent.CURRENT_ENTRY);
+        localStorage.removeItem(EntryCreatorComponent.CURRENT_ENTRY_KEY);
     }
     cancelScheduling() {
         this.entry.future_publish_date = null;
@@ -1043,7 +1225,7 @@ class EntryCreatorComponent {
             this.entryService.delete(this.entry).subscribe(() => {
                 this.entry = null;
                 this.entryService.currentlyEditedEntry.next(null);
-                localStorage.removeItem(EntryCreatorComponent.CURRENT_ENTRY);
+                localStorage.removeItem(EntryCreatorComponent.CURRENT_ENTRY_KEY);
             });
         }
     }
@@ -1064,12 +1246,16 @@ class EntryCreatorComponent {
         this.entry.future_publish_date.setMinutes(this.minutes);
         this.onChange();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: EntryCreatorComponent, deps: [{ token: EntryService }, { token: TagService }, { token: IdentityService }, { token: i0.ChangeDetectorRef }, { token: i1$2.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: EntryCreatorComponent, isStandalone: true, selector: "app-entry-creator", inputs: { allowedMimeTypes: "allowedMimeTypes", uploadUrlKey: "uploadUrlKey" }, viewQueries: [{ propertyName: "tagInput", first: true, predicate: ["tagInput"], descendants: true }, { propertyName: "matAutocomplete", first: true, predicate: ["tagauto"], descendants: true }], ngImport: i0, template: "<div class=\"section creator fields\">\n  <form #createForm=\"ngForm\" (change)=\"onChange()\" *ngIf=\"this.entry\">\n    <div class=\"form-group\">\n      <mat-form-field class=\"full-width\">\n        <mat-label>Title</mat-label>\n        <input matInput\n               [(ngModel)]=\"entry.title\"\n               name=\"title\">\n      </mat-form-field>\n    </div>\n    <mat-card class=\"form-section tags\">\n      <div>\n        <!--\n        <mat-form-field class=\"full-width\" hintLabel=\"Use a comma to seperate different tags\">\n          <mat-chip-listbox #tagList aria-label=\"Tags\">\n            <mat-chip-option\n                *ngFor=\"let tag of tags\"\n                [selectable]=\"selectable\"\n                [removable]=\"removable\"\n                (removed)=\"remove(tag)\">\n              {{tag}}\n              <mat-icon matChipRemove *ngIf=\"removable\">cancel</mat-icon>\n            </mat-chip-option>\n            <input\n                matInput\n                placeholder=\"Tags...\"\n                #tagInput\n                [formControl]=\"tagCtrl\"\n                [matAutocomplete]=\"tagauto\"\n                [matChipInputFor]=\"tagList\"\n                [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n                (matChipInputTokenEnd)=\"add($event)\">\n          </mat-chip-listbox>\n          <mat-autocomplete #tagauto=\"matAutocomplete\" (optionSelected)=\"selected($event)\">\n            <mat-option *ngFor=\"let tag of filtered_tags | async\" [value]=\"tag\">\n              {{tag}}\n            </mat-option>\n          </mat-autocomplete>\n        </mat-form-field>\n        -->\n      </div>\n    </mat-card>\n    <mat-card class=\"form-section\" *ngFor=\"let section of entry.sections\">\n      <div>\n        <mat-form-field class=\"full-width\">\n          <mat-label>Subheading</mat-label>\n          <input matInput\n                 [(ngModel)]=\"section.subheading\"\n                 name=\"{{section.id}}-subheading\">\n        </mat-form-field>\n        <div class=\"form-content\" *ngFor=\"let content of section.contents\">\n          <div class=\"form-group\">\n            <mat-radio-group\n                aria-label=\"Select the Content Type\"\n                name=\"{{content.id}}-content-type\"\n                class=\"radio-group\"\n                [(ngModel)]=\"content.type\">\n              <mat-radio-button\n                  *ngFor=\"let value of Object.values(ContentType)\"\n                  class=\"radio-button\"\n                  [value]=\"value\">{{value}}\n              </mat-radio-button>\n            </mat-radio-group>\n          </div>\n          <ng-container [ngSwitch]=\"content.type\">\n            <ng-container *ngSwitchCase=\"ContentType.URL\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-value\"\n                    [(ngModel)]=\"content.value\">\n              </mat-form-field>\n              <mat-form-field class=\"full-width\">\n                <mat-label>Title</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-title\"\n                    [(ngModel)]=\"content.title\">\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.TEXT\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <textarea matInput\n                          cdkTextareaAutosize\n                          #autosize=\"cdkTextareaAutosize\"\n                          cdkAutosizeMinRows=\"3\"\n                          cdkAutosizeMaxRows=\"20\"\n                          name=\"{{content.id}}-content-value\"\n                          [(ngModel)]=\"content.value\"\n                          ></textarea>\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.HTML\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <textarea matInput\n                          cdkTextareaAutosize\n                          #autosize=\"cdkTextareaAutosize\"\n                          cdkAutosizeMinRows=\"3\"\n                          cdkAutosizeMaxRows=\"20\"\n                          name=\"{{content.id}}-content-value\"\n                          [(ngModel)]=\"content.value\"\n                          ></textarea>\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.CODE\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <textarea matInput\n                          cdkTextareaAutosize\n                          #autosize=\"cdkTextareaAutosize\"\n                          cdkAutosizeMinRows=\"10\"\n                          cdkAutosizeMaxRows=\"100\"\n                          name=\"{{content.id}}-content-value\"\n                          [(ngModel)]=\"content.value\"\n                          ></textarea>\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.IMAGE\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-value\"\n                    [(ngModel)]=\"content.value\">\n              </mat-form-field>\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-source\"\n                    [(ngModel)]=\"content.value\">\n              </mat-form-field>\n              <mat-form-field class=\"full-width\">\n                <mat-label>Description</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-description\"\n                    [(ngModel)]=\"content.description\">\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.MEDIA\">\n              <div class=\"full-width\">\n                <ng-container *ngIf=\"content.value\">\n                  <mat-form-field class=\"full-width\">\n                    <mat-label>Value</mat-label>\n                    <input\n                        matInput\n                        name=\"{{content.id}}-content-value\"\n                        [(ngModel)]=\"content.value\">\n                  </mat-form-field>\n                  <mat-form-field class=\"full-width\">\n                    <mat-label>Description</mat-label>\n                    <input\n                        matInput\n                        name=\"{{content.id}}-content-description\"\n                        [(ngModel)]=\"content.description\">\n                  </mat-form-field>\n                </ng-container>\n                <ng-container *ngIf=\"content.additional\">\n                  <ng-container *ngFor=\"let add of content.additional\">\n                    <mat-form-field class=\"full-width\">\n                      <mat-label>{{add.key}}</mat-label>\n                      <input\n                          matInput\n                          name=\"{{content.id}}-content-{{add.key}}\"\n                          [(ngModel)]=\"add.value\"\n                          [disabled]=\"true\"\n                          >\n                    </mat-form-field>\n                  </ng-container>\n                </ng-container>\n                <ng-container *ngIf=\"!content.value\">\n                  <button mat-raised-button (click)=startUploader(content)>Upload</button>\n                </ng-container>\n              </div>\n            </ng-container>\n          </ng-container>\n          <button mat-raised-button (click)=removeContent(content)>Remove Content</button>\n          <button mat-raised-button (click)=\"addContent(section)\">+ Add Content</button>\n        </div>\n        <button mat-raised-button (click)=\"removeSection(section)\">Remove Section</button>\n        <button mat-raised-button (click)=\"addContent(section)\" *ngIf=\"section.contents.length === 0\">+ Add\n          Content\n        </button>\n        <button mat-raised-button (click)=\"addSection()\">+ Add Section</button>\n      </div>\n\n    </mat-card>\n    <button mat-raised-button (click)=\"addSection()\" *ngIf=\"entry.sections?.length === 0\">+ Add Section</button>\n    <button mat-raised-button (click)=\"addSection()\" *ngIf=\"!entry.sections\">+ Add Section</button>\n\n    <div class=\"controls\">\n      <button mat-raised-button (click)=\"resetDate()\">Reset the Date</button>\n      <button mat-raised-button (click)=\"delete()\">Delete</button>\n      <button mat-raised-button [disabled]=\"scheduling\" (click)=\"publish()\">Publish</button>\n      <button mat-raised-button [disabled]=\"scheduling\" (click)=\"exposeScheduling()\">Schedule</button>\n      <button mat-raised-button (click)=\"startNew()\">New</button>\n    </div>\n    <p *ngIf=\"scheduling\">Publishing is disabled while scheduling is being used.</p>\n\n    <mat-card [hidden]=\"!scheduling\">\n      <h4>\n        Scheduling Options\n      </h4>\n\n      <div class=\"form-group\">\n        <mat-form-field class=\"full-width\">\n          <mat-label>Date</mat-label>\n          <input\n              #futurePublishDate\n              matInput\n              [matDatepicker]=\"picker\"\n              [min]=\"today\"\n              (dateInput)=\"onDateChange()\"\n              (dateChange)=\"onDateChange()\"\n              [(ngModel)]=\"entry.future_publish_date\"\n              name=\"future-publish-date\"\n              >\n              <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n              <mat-datepicker\n                  #picker></mat-datepicker>\n        </mat-form-field>\n\n        <mat-label>Time</mat-label>\n        <mat-timepicker>\n            [defaultTime]=\"customScheduleTime\"\n            [format]=\"12\"\n            [buttonAlign]=\"'left'\"\n            (timeChanged)=\"setTime($event)\"\n            ></mat-timepicker>\n        <p>Times are represented in your local time zone</p>\n      </div>\n\n      <div mat-dialog-actions>\n        <div class=\"controls\">\n          <button mat-raised-button (click)=\"cancelScheduling()\">Cancel Scheduling</button>\n        </div>\n      </div>\n      <p>This post will be published as soon as its scheduled date and time arrive. No further action is needed by you. If you do not\n      want to use scheduling, you can cancel scheduling and manually publish.</p>\n    </mat-card>\n  </form>\n  <div class=\"controls\">\n    <button mat-raised-button (click)=\"seeEntries()\">See Entries</button>\n    <button *ngIf=\"!this.entry\" mat-raised-button (click)=\"startNew()\">New</button>\n  </div>\n</div>\n", styles: [".creator{min-height:calc(100vh - 100px)}form{padding:20px}.content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}button{margin:4px}.radio-group{display:flex;flex-direction:column;margin:15px 0}.radio-button{margin:4px}.full-width{width:100%}.content-card{margin:0 0 10px}.form-section{margin-bottom:10px}.form-content:not(:last-child){border-bottom:1px dotted #aaa;padding-bottom:10px}.controls{display:inline-block;width:100%;padding:10px}[hidden]{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7.MatLabel, selector: "mat-label" }, { kind: "directive", type: i7.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i9.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i9$1.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i9$1.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i10.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i11.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i12.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i12.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i12.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatTimepickerModule }, { kind: "component", type: i4$1.MatTimepicker, selector: "mat-timepicker", inputs: ["interval", "options", "disableRipple", "aria-label", "aria-labelledby"], outputs: ["selected", "opened", "closed"], exportAs: ["matTimepicker"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }] }); }
+    routeTo(path) {
+        this.router.navigateByUrl(path).then(() => {
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: EntryCreatorComponent, deps: [{ token: i1$3.Router }, { token: EntryService }, { token: TagService }, { token: IdentityService }, { token: i0.ChangeDetectorRef }, { token: i1$2.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: EntryCreatorComponent, isStandalone: true, selector: "app-entry-creator", inputs: { allowedMimeTypes: "allowedMimeTypes", uploadUrlKey: "uploadUrlKey" }, providers: [provideNativeDateAdapter()], viewQueries: [{ propertyName: "tagInput", first: true, predicate: ["tagInput"], descendants: true }, { propertyName: "matAutocomplete", first: true, predicate: ["tagauto"], descendants: true }], ngImport: i0, template: "<div class=\"section creator fields\">\n  <div style=\"padding: 10px;\">\n    <button\n      style=\"width: 100%;\"\n      mat-raised-button (click)=\"routeTo('create/v2(left-col:create//right-col:create)')\">V2</button>\n  </div>\n  <form #createForm=\"ngForm\" (change)=\"onChange()\" *ngIf=\"this.entry\">\n    <div class=\"form-group\">\n      <mat-form-field class=\"full-width\">\n        <mat-label>Title</mat-label>\n        <input matInput\n               [(ngModel)]=\"entry.title\"\n               name=\"title\">\n      </mat-form-field>\n    </div>\n    <mat-card class=\"form-section tags\">\n      <div>\n        <!--\n        <mat-form-field class=\"full-width\" hintLabel=\"Use a comma to seperate different tags\">\n          <mat-chip-listbox #tagList aria-label=\"Tags\">\n            <mat-chip-option\n                *ngFor=\"let tag of tags\"\n                [selectable]=\"selectable\"\n                [removable]=\"removable\"\n                (removed)=\"remove(tag)\">\n              {{tag}}\n              <mat-icon matChipRemove *ngIf=\"removable\">cancel</mat-icon>\n            </mat-chip-option>\n            <input\n                matInput\n                placeholder=\"Tags...\"\n                #tagInput\n                [formControl]=\"tagCtrl\"\n                [matAutocomplete]=\"tagauto\"\n                [matChipInputFor]=\"tagList\"\n                [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n                (matChipInputTokenEnd)=\"add($event)\">\n          </mat-chip-listbox>\n          <mat-autocomplete #tagauto=\"matAutocomplete\" (optionSelected)=\"selected($event)\">\n            <mat-option *ngFor=\"let tag of filtered_tags | async\" [value]=\"tag\">\n              {{tag}}\n            </mat-option>\n          </mat-autocomplete>\n        </mat-form-field>\n        -->\n      </div>\n    </mat-card>\n    <mat-card class=\"form-section\" *ngFor=\"let section of entry.sections\">\n      <div>\n        <mat-form-field class=\"full-width\">\n          <mat-label>Subheading</mat-label>\n          <input matInput\n                 [(ngModel)]=\"section.subheading\"\n                 name=\"{{section.id}}-subheading\">\n        </mat-form-field>\n        <div class=\"form-content\" *ngFor=\"let content of section.contents\">\n          <div class=\"form-group\">\n            <mat-radio-group\n                aria-label=\"Select the Content Type\"\n                name=\"{{content.id}}-content-type\"\n                class=\"radio-group\"\n                [(ngModel)]=\"content.type\">\n              <mat-radio-button\n                  *ngFor=\"let value of Object.values(ContentType)\"\n                  class=\"radio-button\"\n                  [value]=\"value\">{{value}}\n              </mat-radio-button>\n            </mat-radio-group>\n          </div>\n          <ng-container [ngSwitch]=\"content.type\">\n            <ng-container *ngSwitchCase=\"ContentType.URL\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-value\"\n                    [(ngModel)]=\"content.value\">\n              </mat-form-field>\n              <mat-form-field class=\"full-width\">\n                <mat-label>Title</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-title\"\n                    [(ngModel)]=\"content.title\">\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.TEXT\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <textarea matInput\n                          cdkTextareaAutosize\n                          #autosize=\"cdkTextareaAutosize\"\n                          cdkAutosizeMinRows=\"3\"\n                          cdkAutosizeMaxRows=\"20\"\n                          name=\"{{content.id}}-content-value\"\n                          [(ngModel)]=\"content.value\"\n                          ></textarea>\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.HTML\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <textarea matInput\n                          cdkTextareaAutosize\n                          #autosize=\"cdkTextareaAutosize\"\n                          cdkAutosizeMinRows=\"3\"\n                          cdkAutosizeMaxRows=\"20\"\n                          name=\"{{content.id}}-content-value\"\n                          [(ngModel)]=\"content.value\"\n                          ></textarea>\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.CODE\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <textarea matInput\n                          cdkTextareaAutosize\n                          #autosize=\"cdkTextareaAutosize\"\n                          cdkAutosizeMinRows=\"10\"\n                          cdkAutosizeMaxRows=\"100\"\n                          name=\"{{content.id}}-content-value\"\n                          [(ngModel)]=\"content.value\"\n                          ></textarea>\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.IMAGE\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-value\"\n                    [(ngModel)]=\"content.value\">\n              </mat-form-field>\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-source\"\n                    [(ngModel)]=\"content.value\">\n              </mat-form-field>\n              <mat-form-field class=\"full-width\">\n                <mat-label>Description</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-description\"\n                    [(ngModel)]=\"content.description\">\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.MEDIA\">\n              <div class=\"full-width\">\n                <ng-container *ngIf=\"content.value\">\n                  <mat-form-field class=\"full-width\">\n                    <mat-label>Value</mat-label>\n                    <input\n                        matInput\n                        name=\"{{content.id}}-content-value\"\n                        [(ngModel)]=\"content.value\">\n                  </mat-form-field>\n                  <mat-form-field class=\"full-width\">\n                    <mat-label>Description</mat-label>\n                    <input\n                        matInput\n                        name=\"{{content.id}}-content-description\"\n                        [(ngModel)]=\"content.description\">\n                  </mat-form-field>\n                </ng-container>\n                <ng-container *ngIf=\"content.additional\">\n                  <ng-container *ngFor=\"let add of content.additional\">\n                    <mat-form-field class=\"full-width\">\n                      <mat-label>{{add.key}}</mat-label>\n                      <input\n                          matInput\n                          name=\"{{content.id}}-content-{{add.key}}\"\n                          [(ngModel)]=\"add.value\"\n                          [disabled]=\"true\"\n                          >\n                    </mat-form-field>\n                  </ng-container>\n                </ng-container>\n                <ng-container *ngIf=\"!content.value\">\n                  <button mat-raised-button (click)=startUploader(content)>Upload</button>\n                </ng-container>\n              </div>\n            </ng-container>\n          </ng-container>\n          <button mat-raised-button (click)=removeContent(content)>Remove Content</button>\n          <button mat-raised-button (click)=\"addContent(section)\">+ Add Content</button>\n        </div>\n        <button mat-raised-button (click)=\"removeSection(section)\">Remove Section</button>\n        <button mat-raised-button (click)=\"addContent(section)\" *ngIf=\"section.contents.length === 0\">+ Add\n          Content\n        </button>\n        <button mat-raised-button (click)=\"addSection()\">+ Add Section</button>\n      </div>\n\n    </mat-card>\n    <button mat-raised-button (click)=\"addSection()\" *ngIf=\"entry.sections?.length === 0\">+ Add Section</button>\n    <button mat-raised-button (click)=\"addSection()\" *ngIf=\"!entry.sections\">+ Add Section</button>\n\n    <div class=\"controls\">\n      <button mat-raised-button (click)=\"resetDate()\">Reset the Date</button>\n      <button mat-raised-button (click)=\"delete()\">Delete</button>\n      <button mat-raised-button [disabled]=\"scheduling\" (click)=\"publish()\">Publish</button>\n      <button mat-raised-button [disabled]=\"scheduling\" (click)=\"exposeScheduling()\">Schedule</button>\n      <button mat-raised-button (click)=\"startNew()\">New</button>\n    </div>\n    <p *ngIf=\"scheduling\">Publishing is disabled while scheduling is being used.</p>\n\n    <mat-card [hidden]=\"!scheduling\">\n      <h4>\n        Scheduling Options\n      </h4>\n\n      <div class=\"form-group\">\n        <mat-form-field class=\"full-width\">\n          <mat-label>Date</mat-label>\n          <input\n              #futurePublishDate\n              matInput\n              [matDatepicker]=\"picker\"\n              [min]=\"today\"\n              (dateInput)=\"onDateChange()\"\n              (dateChange)=\"onDateChange()\"\n              [(ngModel)]=\"entry.future_publish_date\"\n              name=\"future-publish-date\"\n              >\n              <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n              <mat-datepicker\n                  #picker></mat-datepicker>\n        </mat-form-field>\n\n        <mat-form-field>\n          <mat-label>Time</mat-label>\n          <input matInput [matTimepicker]=\"pickertwo\">\n            <mat-timepicker-toggle matIconSuffix [for]=\"pickertwo\"/>\n            <mat-timepicker #pickertwo/>\n        </mat-form-field>\n        <p>Times are represented in your local time zone</p>\n      </div>\n\n      <div mat-dialog-actions>\n        <div class=\"controls\">\n          <button mat-raised-button (click)=\"cancelScheduling()\">Cancel Scheduling</button>\n        </div>\n      </div>\n      <p>This post will be published as soon as its scheduled date and time arrive. No further action is needed by you. If you do not\n      want to use scheduling, you can cancel scheduling and manually publish.</p>\n    </mat-card>\n  </form>\n  <div class=\"controls\">\n    <button mat-raised-button (click)=\"seeEntries()\">See Entries</button>\n    <button *ngIf=\"!this.entry\" mat-raised-button (click)=\"startNew()\">New</button>\n  </div>\n</div>\n", styles: [".creator{min-height:calc(100vh - 100px)}form{padding:20px}.content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}button{margin:4px}.radio-group{display:flex;flex-direction:column;margin:15px 0}.radio-button{margin:4px}.full-width{width:100%}.content-card{margin:0 0 10px}.form-section{margin-bottom:10px}.form-content:not(:last-child){border-bottom:1px dotted #aaa;padding-bottom:10px}.controls{display:inline-block;width:100%;padding:10px}[hidden]{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i6.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i7.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i7.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i9.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i10.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i10.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i11.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i12.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i13.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i13.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i13.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatTimepickerModule }, { kind: "component", type: i14.MatTimepicker, selector: "mat-timepicker", inputs: ["interval", "options", "disableRipple", "aria-label", "aria-labelledby"], outputs: ["selected", "opened", "closed"], exportAs: ["matTimepicker"] }, { kind: "directive", type: i14.MatTimepickerInput, selector: "input[matTimepicker]", inputs: ["value", "matTimepicker", "matTimepickerMin", "matTimepickerMax", "disabled"], outputs: ["valueChange"], exportAs: ["matTimepickerInput"] }, { kind: "component", type: i14.MatTimepickerToggle, selector: "mat-timepicker-toggle", inputs: ["for", "aria-label", "aria-labelledby", "disabled", "tabIndex", "disableRipple"], exportAs: ["matTimepickerToggle"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: EntryCreatorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-entry-creator', imports: [
+            args: [{ selector: 'app-entry-creator', providers: [provideNativeDateAdapter()], imports: [
                         CommonModule,
                         FormsModule,
                         ReactiveFormsModule,
@@ -1084,8 +1270,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                         MatDatepickerModule,
                         MatTimepickerModule,
                         MatButtonModule,
-                    ], template: "<div class=\"section creator fields\">\n  <form #createForm=\"ngForm\" (change)=\"onChange()\" *ngIf=\"this.entry\">\n    <div class=\"form-group\">\n      <mat-form-field class=\"full-width\">\n        <mat-label>Title</mat-label>\n        <input matInput\n               [(ngModel)]=\"entry.title\"\n               name=\"title\">\n      </mat-form-field>\n    </div>\n    <mat-card class=\"form-section tags\">\n      <div>\n        <!--\n        <mat-form-field class=\"full-width\" hintLabel=\"Use a comma to seperate different tags\">\n          <mat-chip-listbox #tagList aria-label=\"Tags\">\n            <mat-chip-option\n                *ngFor=\"let tag of tags\"\n                [selectable]=\"selectable\"\n                [removable]=\"removable\"\n                (removed)=\"remove(tag)\">\n              {{tag}}\n              <mat-icon matChipRemove *ngIf=\"removable\">cancel</mat-icon>\n            </mat-chip-option>\n            <input\n                matInput\n                placeholder=\"Tags...\"\n                #tagInput\n                [formControl]=\"tagCtrl\"\n                [matAutocomplete]=\"tagauto\"\n                [matChipInputFor]=\"tagList\"\n                [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n                (matChipInputTokenEnd)=\"add($event)\">\n          </mat-chip-listbox>\n          <mat-autocomplete #tagauto=\"matAutocomplete\" (optionSelected)=\"selected($event)\">\n            <mat-option *ngFor=\"let tag of filtered_tags | async\" [value]=\"tag\">\n              {{tag}}\n            </mat-option>\n          </mat-autocomplete>\n        </mat-form-field>\n        -->\n      </div>\n    </mat-card>\n    <mat-card class=\"form-section\" *ngFor=\"let section of entry.sections\">\n      <div>\n        <mat-form-field class=\"full-width\">\n          <mat-label>Subheading</mat-label>\n          <input matInput\n                 [(ngModel)]=\"section.subheading\"\n                 name=\"{{section.id}}-subheading\">\n        </mat-form-field>\n        <div class=\"form-content\" *ngFor=\"let content of section.contents\">\n          <div class=\"form-group\">\n            <mat-radio-group\n                aria-label=\"Select the Content Type\"\n                name=\"{{content.id}}-content-type\"\n                class=\"radio-group\"\n                [(ngModel)]=\"content.type\">\n              <mat-radio-button\n                  *ngFor=\"let value of Object.values(ContentType)\"\n                  class=\"radio-button\"\n                  [value]=\"value\">{{value}}\n              </mat-radio-button>\n            </mat-radio-group>\n          </div>\n          <ng-container [ngSwitch]=\"content.type\">\n            <ng-container *ngSwitchCase=\"ContentType.URL\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-value\"\n                    [(ngModel)]=\"content.value\">\n              </mat-form-field>\n              <mat-form-field class=\"full-width\">\n                <mat-label>Title</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-title\"\n                    [(ngModel)]=\"content.title\">\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.TEXT\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <textarea matInput\n                          cdkTextareaAutosize\n                          #autosize=\"cdkTextareaAutosize\"\n                          cdkAutosizeMinRows=\"3\"\n                          cdkAutosizeMaxRows=\"20\"\n                          name=\"{{content.id}}-content-value\"\n                          [(ngModel)]=\"content.value\"\n                          ></textarea>\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.HTML\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <textarea matInput\n                          cdkTextareaAutosize\n                          #autosize=\"cdkTextareaAutosize\"\n                          cdkAutosizeMinRows=\"3\"\n                          cdkAutosizeMaxRows=\"20\"\n                          name=\"{{content.id}}-content-value\"\n                          [(ngModel)]=\"content.value\"\n                          ></textarea>\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.CODE\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <textarea matInput\n                          cdkTextareaAutosize\n                          #autosize=\"cdkTextareaAutosize\"\n                          cdkAutosizeMinRows=\"10\"\n                          cdkAutosizeMaxRows=\"100\"\n                          name=\"{{content.id}}-content-value\"\n                          [(ngModel)]=\"content.value\"\n                          ></textarea>\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.IMAGE\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-value\"\n                    [(ngModel)]=\"content.value\">\n              </mat-form-field>\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-source\"\n                    [(ngModel)]=\"content.value\">\n              </mat-form-field>\n              <mat-form-field class=\"full-width\">\n                <mat-label>Description</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-description\"\n                    [(ngModel)]=\"content.description\">\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.MEDIA\">\n              <div class=\"full-width\">\n                <ng-container *ngIf=\"content.value\">\n                  <mat-form-field class=\"full-width\">\n                    <mat-label>Value</mat-label>\n                    <input\n                        matInput\n                        name=\"{{content.id}}-content-value\"\n                        [(ngModel)]=\"content.value\">\n                  </mat-form-field>\n                  <mat-form-field class=\"full-width\">\n                    <mat-label>Description</mat-label>\n                    <input\n                        matInput\n                        name=\"{{content.id}}-content-description\"\n                        [(ngModel)]=\"content.description\">\n                  </mat-form-field>\n                </ng-container>\n                <ng-container *ngIf=\"content.additional\">\n                  <ng-container *ngFor=\"let add of content.additional\">\n                    <mat-form-field class=\"full-width\">\n                      <mat-label>{{add.key}}</mat-label>\n                      <input\n                          matInput\n                          name=\"{{content.id}}-content-{{add.key}}\"\n                          [(ngModel)]=\"add.value\"\n                          [disabled]=\"true\"\n                          >\n                    </mat-form-field>\n                  </ng-container>\n                </ng-container>\n                <ng-container *ngIf=\"!content.value\">\n                  <button mat-raised-button (click)=startUploader(content)>Upload</button>\n                </ng-container>\n              </div>\n            </ng-container>\n          </ng-container>\n          <button mat-raised-button (click)=removeContent(content)>Remove Content</button>\n          <button mat-raised-button (click)=\"addContent(section)\">+ Add Content</button>\n        </div>\n        <button mat-raised-button (click)=\"removeSection(section)\">Remove Section</button>\n        <button mat-raised-button (click)=\"addContent(section)\" *ngIf=\"section.contents.length === 0\">+ Add\n          Content\n        </button>\n        <button mat-raised-button (click)=\"addSection()\">+ Add Section</button>\n      </div>\n\n    </mat-card>\n    <button mat-raised-button (click)=\"addSection()\" *ngIf=\"entry.sections?.length === 0\">+ Add Section</button>\n    <button mat-raised-button (click)=\"addSection()\" *ngIf=\"!entry.sections\">+ Add Section</button>\n\n    <div class=\"controls\">\n      <button mat-raised-button (click)=\"resetDate()\">Reset the Date</button>\n      <button mat-raised-button (click)=\"delete()\">Delete</button>\n      <button mat-raised-button [disabled]=\"scheduling\" (click)=\"publish()\">Publish</button>\n      <button mat-raised-button [disabled]=\"scheduling\" (click)=\"exposeScheduling()\">Schedule</button>\n      <button mat-raised-button (click)=\"startNew()\">New</button>\n    </div>\n    <p *ngIf=\"scheduling\">Publishing is disabled while scheduling is being used.</p>\n\n    <mat-card [hidden]=\"!scheduling\">\n      <h4>\n        Scheduling Options\n      </h4>\n\n      <div class=\"form-group\">\n        <mat-form-field class=\"full-width\">\n          <mat-label>Date</mat-label>\n          <input\n              #futurePublishDate\n              matInput\n              [matDatepicker]=\"picker\"\n              [min]=\"today\"\n              (dateInput)=\"onDateChange()\"\n              (dateChange)=\"onDateChange()\"\n              [(ngModel)]=\"entry.future_publish_date\"\n              name=\"future-publish-date\"\n              >\n              <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n              <mat-datepicker\n                  #picker></mat-datepicker>\n        </mat-form-field>\n\n        <mat-label>Time</mat-label>\n        <mat-timepicker>\n            [defaultTime]=\"customScheduleTime\"\n            [format]=\"12\"\n            [buttonAlign]=\"'left'\"\n            (timeChanged)=\"setTime($event)\"\n            ></mat-timepicker>\n        <p>Times are represented in your local time zone</p>\n      </div>\n\n      <div mat-dialog-actions>\n        <div class=\"controls\">\n          <button mat-raised-button (click)=\"cancelScheduling()\">Cancel Scheduling</button>\n        </div>\n      </div>\n      <p>This post will be published as soon as its scheduled date and time arrive. No further action is needed by you. If you do not\n      want to use scheduling, you can cancel scheduling and manually publish.</p>\n    </mat-card>\n  </form>\n  <div class=\"controls\">\n    <button mat-raised-button (click)=\"seeEntries()\">See Entries</button>\n    <button *ngIf=\"!this.entry\" mat-raised-button (click)=\"startNew()\">New</button>\n  </div>\n</div>\n", styles: [".creator{min-height:calc(100vh - 100px)}form{padding:20px}.content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}button{margin:4px}.radio-group{display:flex;flex-direction:column;margin:15px 0}.radio-button{margin:4px}.full-width{width:100%}.content-card{margin:0 0 10px}.form-section{margin-bottom:10px}.form-content:not(:last-child){border-bottom:1px dotted #aaa;padding-bottom:10px}.controls{display:inline-block;width:100%;padding:10px}[hidden]{display:none!important}\n"] }]
-        }], ctorParameters: () => [{ type: EntryService }, { type: TagService }, { type: IdentityService }, { type: i0.ChangeDetectorRef }, { type: i1$2.MatDialog }], propDecorators: { tagInput: [{
+                    ], template: "<div class=\"section creator fields\">\n  <div style=\"padding: 10px;\">\n    <button\n      style=\"width: 100%;\"\n      mat-raised-button (click)=\"routeTo('create/v2(left-col:create//right-col:create)')\">V2</button>\n  </div>\n  <form #createForm=\"ngForm\" (change)=\"onChange()\" *ngIf=\"this.entry\">\n    <div class=\"form-group\">\n      <mat-form-field class=\"full-width\">\n        <mat-label>Title</mat-label>\n        <input matInput\n               [(ngModel)]=\"entry.title\"\n               name=\"title\">\n      </mat-form-field>\n    </div>\n    <mat-card class=\"form-section tags\">\n      <div>\n        <!--\n        <mat-form-field class=\"full-width\" hintLabel=\"Use a comma to seperate different tags\">\n          <mat-chip-listbox #tagList aria-label=\"Tags\">\n            <mat-chip-option\n                *ngFor=\"let tag of tags\"\n                [selectable]=\"selectable\"\n                [removable]=\"removable\"\n                (removed)=\"remove(tag)\">\n              {{tag}}\n              <mat-icon matChipRemove *ngIf=\"removable\">cancel</mat-icon>\n            </mat-chip-option>\n            <input\n                matInput\n                placeholder=\"Tags...\"\n                #tagInput\n                [formControl]=\"tagCtrl\"\n                [matAutocomplete]=\"tagauto\"\n                [matChipInputFor]=\"tagList\"\n                [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n                (matChipInputTokenEnd)=\"add($event)\">\n          </mat-chip-listbox>\n          <mat-autocomplete #tagauto=\"matAutocomplete\" (optionSelected)=\"selected($event)\">\n            <mat-option *ngFor=\"let tag of filtered_tags | async\" [value]=\"tag\">\n              {{tag}}\n            </mat-option>\n          </mat-autocomplete>\n        </mat-form-field>\n        -->\n      </div>\n    </mat-card>\n    <mat-card class=\"form-section\" *ngFor=\"let section of entry.sections\">\n      <div>\n        <mat-form-field class=\"full-width\">\n          <mat-label>Subheading</mat-label>\n          <input matInput\n                 [(ngModel)]=\"section.subheading\"\n                 name=\"{{section.id}}-subheading\">\n        </mat-form-field>\n        <div class=\"form-content\" *ngFor=\"let content of section.contents\">\n          <div class=\"form-group\">\n            <mat-radio-group\n                aria-label=\"Select the Content Type\"\n                name=\"{{content.id}}-content-type\"\n                class=\"radio-group\"\n                [(ngModel)]=\"content.type\">\n              <mat-radio-button\n                  *ngFor=\"let value of Object.values(ContentType)\"\n                  class=\"radio-button\"\n                  [value]=\"value\">{{value}}\n              </mat-radio-button>\n            </mat-radio-group>\n          </div>\n          <ng-container [ngSwitch]=\"content.type\">\n            <ng-container *ngSwitchCase=\"ContentType.URL\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-value\"\n                    [(ngModel)]=\"content.value\">\n              </mat-form-field>\n              <mat-form-field class=\"full-width\">\n                <mat-label>Title</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-title\"\n                    [(ngModel)]=\"content.title\">\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.TEXT\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <textarea matInput\n                          cdkTextareaAutosize\n                          #autosize=\"cdkTextareaAutosize\"\n                          cdkAutosizeMinRows=\"3\"\n                          cdkAutosizeMaxRows=\"20\"\n                          name=\"{{content.id}}-content-value\"\n                          [(ngModel)]=\"content.value\"\n                          ></textarea>\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.HTML\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <textarea matInput\n                          cdkTextareaAutosize\n                          #autosize=\"cdkTextareaAutosize\"\n                          cdkAutosizeMinRows=\"3\"\n                          cdkAutosizeMaxRows=\"20\"\n                          name=\"{{content.id}}-content-value\"\n                          [(ngModel)]=\"content.value\"\n                          ></textarea>\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.CODE\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <textarea matInput\n                          cdkTextareaAutosize\n                          #autosize=\"cdkTextareaAutosize\"\n                          cdkAutosizeMinRows=\"10\"\n                          cdkAutosizeMaxRows=\"100\"\n                          name=\"{{content.id}}-content-value\"\n                          [(ngModel)]=\"content.value\"\n                          ></textarea>\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.IMAGE\">\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-value\"\n                    [(ngModel)]=\"content.value\">\n              </mat-form-field>\n              <mat-form-field class=\"full-width\">\n                <mat-label>Value</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-source\"\n                    [(ngModel)]=\"content.value\">\n              </mat-form-field>\n              <mat-form-field class=\"full-width\">\n                <mat-label>Description</mat-label>\n                <input\n                    matInput\n                    name=\"{{content.id}}-content-description\"\n                    [(ngModel)]=\"content.description\">\n              </mat-form-field>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"ContentType.MEDIA\">\n              <div class=\"full-width\">\n                <ng-container *ngIf=\"content.value\">\n                  <mat-form-field class=\"full-width\">\n                    <mat-label>Value</mat-label>\n                    <input\n                        matInput\n                        name=\"{{content.id}}-content-value\"\n                        [(ngModel)]=\"content.value\">\n                  </mat-form-field>\n                  <mat-form-field class=\"full-width\">\n                    <mat-label>Description</mat-label>\n                    <input\n                        matInput\n                        name=\"{{content.id}}-content-description\"\n                        [(ngModel)]=\"content.description\">\n                  </mat-form-field>\n                </ng-container>\n                <ng-container *ngIf=\"content.additional\">\n                  <ng-container *ngFor=\"let add of content.additional\">\n                    <mat-form-field class=\"full-width\">\n                      <mat-label>{{add.key}}</mat-label>\n                      <input\n                          matInput\n                          name=\"{{content.id}}-content-{{add.key}}\"\n                          [(ngModel)]=\"add.value\"\n                          [disabled]=\"true\"\n                          >\n                    </mat-form-field>\n                  </ng-container>\n                </ng-container>\n                <ng-container *ngIf=\"!content.value\">\n                  <button mat-raised-button (click)=startUploader(content)>Upload</button>\n                </ng-container>\n              </div>\n            </ng-container>\n          </ng-container>\n          <button mat-raised-button (click)=removeContent(content)>Remove Content</button>\n          <button mat-raised-button (click)=\"addContent(section)\">+ Add Content</button>\n        </div>\n        <button mat-raised-button (click)=\"removeSection(section)\">Remove Section</button>\n        <button mat-raised-button (click)=\"addContent(section)\" *ngIf=\"section.contents.length === 0\">+ Add\n          Content\n        </button>\n        <button mat-raised-button (click)=\"addSection()\">+ Add Section</button>\n      </div>\n\n    </mat-card>\n    <button mat-raised-button (click)=\"addSection()\" *ngIf=\"entry.sections?.length === 0\">+ Add Section</button>\n    <button mat-raised-button (click)=\"addSection()\" *ngIf=\"!entry.sections\">+ Add Section</button>\n\n    <div class=\"controls\">\n      <button mat-raised-button (click)=\"resetDate()\">Reset the Date</button>\n      <button mat-raised-button (click)=\"delete()\">Delete</button>\n      <button mat-raised-button [disabled]=\"scheduling\" (click)=\"publish()\">Publish</button>\n      <button mat-raised-button [disabled]=\"scheduling\" (click)=\"exposeScheduling()\">Schedule</button>\n      <button mat-raised-button (click)=\"startNew()\">New</button>\n    </div>\n    <p *ngIf=\"scheduling\">Publishing is disabled while scheduling is being used.</p>\n\n    <mat-card [hidden]=\"!scheduling\">\n      <h4>\n        Scheduling Options\n      </h4>\n\n      <div class=\"form-group\">\n        <mat-form-field class=\"full-width\">\n          <mat-label>Date</mat-label>\n          <input\n              #futurePublishDate\n              matInput\n              [matDatepicker]=\"picker\"\n              [min]=\"today\"\n              (dateInput)=\"onDateChange()\"\n              (dateChange)=\"onDateChange()\"\n              [(ngModel)]=\"entry.future_publish_date\"\n              name=\"future-publish-date\"\n              >\n              <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n              <mat-datepicker\n                  #picker></mat-datepicker>\n        </mat-form-field>\n\n        <mat-form-field>\n          <mat-label>Time</mat-label>\n          <input matInput [matTimepicker]=\"pickertwo\">\n            <mat-timepicker-toggle matIconSuffix [for]=\"pickertwo\"/>\n            <mat-timepicker #pickertwo/>\n        </mat-form-field>\n        <p>Times are represented in your local time zone</p>\n      </div>\n\n      <div mat-dialog-actions>\n        <div class=\"controls\">\n          <button mat-raised-button (click)=\"cancelScheduling()\">Cancel Scheduling</button>\n        </div>\n      </div>\n      <p>This post will be published as soon as its scheduled date and time arrive. No further action is needed by you. If you do not\n      want to use scheduling, you can cancel scheduling and manually publish.</p>\n    </mat-card>\n  </form>\n  <div class=\"controls\">\n    <button mat-raised-button (click)=\"seeEntries()\">See Entries</button>\n    <button *ngIf=\"!this.entry\" mat-raised-button (click)=\"startNew()\">New</button>\n  </div>\n</div>\n", styles: [".creator{min-height:calc(100vh - 100px)}form{padding:20px}.content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}button{margin:4px}.radio-group{display:flex;flex-direction:column;margin:15px 0}.radio-button{margin:4px}.full-width{width:100%}.content-card{margin:0 0 10px}.form-section{margin-bottom:10px}.form-content:not(:last-child){border-bottom:1px dotted #aaa;padding-bottom:10px}.controls{display:inline-block;width:100%;padding:10px}[hidden]{display:none!important}\n"] }]
+        }], ctorParameters: () => [{ type: i1$3.Router }, { type: EntryService }, { type: TagService }, { type: IdentityService }, { type: i0.ChangeDetectorRef }, { type: i1$2.MatDialog }], propDecorators: { tagInput: [{
                 type: ViewChild,
                 args: ['tagInput']
             }], matAutocomplete: [{
@@ -1268,8 +1454,8 @@ class EntryRendererComponent {
         entry.published = false;
         delete entry.publish_date;
         this.entryService.create(entry).subscribe((response) => {
-            localStorage.setItem(EntryCreatorComponent.CURRENT_ENTRY, JSON.stringify(response));
-            this.router.navigateByUrl('create(left-col:create//right-col:create)').then(() => {
+            localStorage.setItem(EntryCreatorComponent.CURRENT_ENTRY_KEY, JSON.stringify(response));
+            this.router.navigateByUrl('create/v2(left-col:create//right-col:create)').then(() => {
             });
         });
     }
@@ -1306,7 +1492,7 @@ class EntryRendererComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: EntryRendererComponent, deps: [{ token: PrismService }, { token: i0.NgZone }, { token: IdentityService }, { token: CommentService }, { token: i1$3.Router }, { token: EntryService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.3", type: EntryRendererComponent, isStandalone: true, selector: "app-entry-renderer", inputs: { entry: { classPropertyName: "entry", publicName: "entry", isSignal: true, isRequired: false, transformFunction: null }, editMode: { classPropertyName: "editMode", publicName: "editMode", isSignal: false, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  [@entryAnimation]=\"state\"\n  *ngIf=\"entry()\"\n>\n    <h2>{{entry()?.title}}</h2>\n    <a *ngIf=\"me?.id === entry()?.getProp('author_id')\" href=\"javascript:void(0)\" (click)=\"edit(entry())\"><h4>[Edit]</h4></a>\n    <h3>Posted {{entry()?.create_date.toString() | timeAgo}} on {{entry()?.create_date?.getMonth() + 1}}/{{entry()?.create_date?.getDate()}}/{{entry()?.create_date?.getFullYear()}}</h3>\n    <h5 *ngIf=\"entry()?.showEditInformation()\">Article was last edited {{entry()?.edit_date.toString() | timeAgo}}</h5>\n    <br>\n    <p *ngIf=\"entry()?.tags?.length > 0\">Tags: <span *ngFor=\"let tag of entry()?.tags; let last = last\">{{tag}}<ng-container *ngIf=\"!last\"> |\n        </ng-container></span><span *ngIf=\"entry()?.views\">, {{entry()._friendly_views}} views</span></p>\n    <br>\n\n    <ng-container *ngFor=\"let section of entry()?.sections\">\n        <h4>{{section?.subheading}}</h4>\n        <ng-container *ngFor=\"let content of section?.contents\">\n            <ng-container [ngSwitch]=\"content.type\">\n                <ng-container *ngSwitchCase=\"ContentType.CODE\">\n                    <pre><code class=\"language-ts\">{{content?.value}}</code></pre>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"ContentType.URL\">\n                    <a [href]=\"content?.value\" target=\"_blank\">{{content.title}}</a><br>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"ContentType.IMAGE\">\n                    <div class=\"restrict\">\n                        <div class=\"image\">\n                            <img [src]=\"content?.value\"/>\n                        </div>\n                        <div class=\"description\" *ngIf=\"content?.description\">{{content?.description}}</div>\n                        <div class=\"source\" *ngIf=\"content?.source\">\n                            <a [href]=\"content?.source\" [target]=\"'_blank'\">Source: {{content?.source}}</a>\n                        </div>\n                    </div>\n                </ng-container>\n\n                <ng-container *ngSwitchCase=\"ContentType.MEDIA\">\n                    <ng-container *ngIf=\"mediaIsZip(content)\">\n                        <div class=\"download\">\n                            <a href=\"content?.value\">{{content?.description}}</a>\n                        </div>\n                    </ng-container>\n                    <ng-container *ngIf=\"!mediaIsZip(content)\">\n                        <div class=\"restrict\">\n                            <div class=\"image\">\n                                <img [src]=\"content?.value\"/>\n                            </div>\n                            <div class=\"description\" *ngIf=\"content?.description\">{{content?.description}}</div>\n                            <div class=\"source\" *ngIf=\"content?.source\">\n                                <a [href]=\"content?.source\" [target]=\"'_blank'\">Source: {{content?.source}}</a>\n                            </div>\n                        </div>\n                    </ng-container>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"ContentType.HTML\">\n                    <app-static-html\n                        [value]=\"content?.value\"\n                        >\n                    </app-static-html>\n                </ng-container>\n                <ng-container *ngSwitchDefault>\n                    <p>{{content?.value}}</p>\n                </ng-container>\n            </ng-container>\n        </ng-container>\n    </ng-container>\n    <ng-container>\n        <h2>Comments</h2>\n        <p *ngIf=\"comments?.length == 0\">There are no comments yet.</p>\n        <ng-container *ngIf=\"comments?.length > 0\">\n            <div *ngFor=\"let comment of comments\">\n                <mat-card style=\"margin-bottom: 20px;\" class=\"restrict\">\n                    <mat-card-title><img class=\"gravatar\" src=\"{{comment.gravatar_url}} + ?s=30\"> {{comment.user_display_name}}</mat-card-title>\n                    <mat-card-subtitle>{{comment.date_obj | timeAgo}}</mat-card-subtitle>\n                    <mat-card-content>\n                        <p>{{comment.content}}</p>\n                        <ng-container *ngIf=\"me?.id === entry()?.__server_generated_properties?.author_id\">\n                            <a href=\"javascript:void(0);\" *ngIf=\"!comment?.approved\" (click)=\"approve(comment)\">Approve</a>\n                            <a href=\"javascript:void(0);\" *ngIf=\"comment?.approved\" (click)=\"unapprove(comment)\">Unapprove</a>\n                        </ng-container>\n                    </mat-card-content>\n                </mat-card>\n            </div>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"!me\">\n        <a href=\"/signup\">Signup</a> or <a href=\"/login\">login</a> to join the conversation!\n    </ng-container>\n    <ng-container *ngIf=\"me && !me?.comments_public\">\n        <p>Note, your comments will not be public be default. It is possible I will make your comments public, but for now comments are just between you and me.</p>\n    </ng-container>\n    <ng-container *ngIf=\"me\">\n        <h2 style=\"width: 100%;\">Leave a Comment</h2>\n        <br>\n        <mat-form-field class=\"restrict\" style=\"width: 100%;\" appearance=\"outline\">\n            <mat-label>Comment</mat-label>\n            <textarea [(ngModel)]=\"commentText\" (keydown.enter)=\"postComment($event)\" matInput></textarea>\n        </mat-form-field>\n        <br>\n        <button (click)=\"postComment($event)\" style=\"text-align: right;\" mat-button>Submit</button>\n    </ng-container>\n    <div style=\"margin-bottom: 30px;\"></div>\n</div>\n\n", styles: [".image{width:100%;text-align:center;justify-content:center}.source,.description{text-align:center;font-size:12px}.gravatar{margin-right:20px}.smaller{text-size:12px;text-color:gray}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i9.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i9.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i9.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i9.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "ngmodule", type: MatRadioModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i10.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatTimepickerModule }, { kind: "component", type: StaticHtmlComponent, selector: "app-static-html", inputs: ["value"] }, { kind: "pipe", type: TimeAgoPipe, name: "timeAgo" }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.3", type: EntryRendererComponent, isStandalone: true, selector: "app-entry-renderer", inputs: { entry: { classPropertyName: "entry", publicName: "entry", isSignal: true, isRequired: false, transformFunction: null }, editMode: { classPropertyName: "editMode", publicName: "editMode", isSignal: false, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  [@entryAnimation]=\"state\"\n  *ngIf=\"entry()\"\n>\n    <h2>{{entry()?.title}}</h2>\n    <a *ngIf=\"me?.id === entry()?.getProp('author_id')\" href=\"javascript:void(0)\" (click)=\"edit(entry())\"><h4>[Edit]</h4></a>\n    <h3>Posted {{entry()?.create_date.toString() | timeAgo}} on {{entry()?.create_date?.getMonth() + 1}}/{{entry()?.create_date?.getDate()}}/{{entry()?.create_date?.getFullYear()}}</h3>\n    <h5 *ngIf=\"entry()?.showEditInformation()\">Article was last edited {{entry()?.edit_date.toString() | timeAgo}}</h5>\n    <br>\n    <p *ngIf=\"entry()?.tags?.length > 0\">Tags: <span *ngFor=\"let tag of entry()?.tags; let last = last\">{{tag}}<ng-container *ngIf=\"!last\"> |\n        </ng-container></span><span *ngIf=\"entry()?.views\">, {{entry()._friendly_views}} views</span></p>\n    <br>\n\n    <ng-container *ngFor=\"let section of entry()?.sections\">\n        <h4>{{section?.subheading}}</h4>\n        <ng-container *ngFor=\"let content of section?.contents\">\n            <ng-container [ngSwitch]=\"content.type\">\n                <ng-container *ngSwitchCase=\"ContentType.CODE\">\n                    <pre><code class=\"language-ts\">{{content?.value}}</code></pre>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"ContentType.URL\">\n                    <a [href]=\"content?.value\" target=\"_blank\">{{content.title}}</a><br>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"ContentType.IMAGE\">\n                    <div class=\"restrict\">\n                        <div class=\"image\">\n                            <img [src]=\"content?.value\"/>\n                        </div>\n                        <div class=\"description\" *ngIf=\"content?.description\">{{content?.description}}</div>\n                        <div class=\"source\" *ngIf=\"content?.source\">\n                            <a [href]=\"content?.source\" [target]=\"'_blank'\">Source: {{content?.source}}</a>\n                        </div>\n                    </div>\n                </ng-container>\n\n                <ng-container *ngSwitchCase=\"ContentType.MEDIA\">\n                    <ng-container *ngIf=\"mediaIsZip(content)\">\n                        <div class=\"download\">\n                            <a href=\"content?.value\">{{content?.description}}</a>\n                        </div>\n                    </ng-container>\n                    <ng-container *ngIf=\"!mediaIsZip(content)\">\n                        <div class=\"restrict\">\n                            <div class=\"image\">\n                                <img [src]=\"content?.value\"/>\n                            </div>\n                            <div class=\"description\" *ngIf=\"content?.description\">{{content?.description}}</div>\n                            <div class=\"source\" *ngIf=\"content?.source\">\n                                <a [href]=\"content?.source\" [target]=\"'_blank'\">Source: {{content?.source}}</a>\n                            </div>\n                        </div>\n                    </ng-container>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"ContentType.HTML\">\n                    <app-static-html\n                        [value]=\"content?.value\"\n                        >\n                    </app-static-html>\n                </ng-container>\n                <ng-container *ngSwitchDefault>\n                    <p>{{content?.value}}</p>\n                </ng-container>\n            </ng-container>\n        </ng-container>\n    </ng-container>\n    <ng-container>\n        <h2>Comments</h2>\n        <p *ngIf=\"comments?.length == 0\">There are no comments yet.</p>\n        <ng-container *ngIf=\"comments?.length > 0\">\n            <div *ngFor=\"let comment of comments\">\n                <mat-card style=\"margin-bottom: 20px;\" class=\"restrict\">\n                    <mat-card-title><img class=\"gravatar\" src=\"{{comment.gravatar_url}} + ?s=30\"> {{comment.user_display_name}}</mat-card-title>\n                    <mat-card-subtitle>{{comment.date_obj | timeAgo}}</mat-card-subtitle>\n                    <mat-card-content>\n                        <p>{{comment.content}}</p>\n                        <ng-container *ngIf=\"me?.id === entry()?.__server_generated_properties?.author_id\">\n                            <a href=\"javascript:void(0);\" *ngIf=\"!comment?.approved\" (click)=\"approve(comment)\">Approve</a>\n                            <a href=\"javascript:void(0);\" *ngIf=\"comment?.approved\" (click)=\"unapprove(comment)\">Unapprove</a>\n                        </ng-container>\n                    </mat-card-content>\n                </mat-card>\n            </div>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"!me\">\n        <a href=\"/signup\">Signup</a> or <a href=\"/login\">login</a> to join the conversation!\n    </ng-container>\n    <ng-container *ngIf=\"me && !me?.comments_public\">\n        <p>Note, your comments will not be public be default. It is possible I will make your comments public, but for now comments are just between you and me.</p>\n    </ng-container>\n    <ng-container *ngIf=\"me\">\n        <h2 style=\"width: 100%;\">Leave a Comment</h2>\n        <br>\n        <mat-form-field class=\"restrict\" style=\"width: 100%;\" appearance=\"outline\">\n            <mat-label>Comment</mat-label>\n            <textarea [(ngModel)]=\"commentText\" (keydown.enter)=\"postComment($event)\" matInput></textarea>\n        </mat-form-field>\n        <br>\n        <button (click)=\"postComment($event)\" style=\"text-align: right;\" mat-button>Submit</button>\n    </ng-container>\n    <div style=\"margin-bottom: 30px;\"></div>\n</div>\n\n", styles: [".image{width:100%;text-align:center;justify-content:center}.source,.description{text-align:center;font-size:12px}.gravatar{margin-right:20px}.smaller{text-size:12px;text-color:gray}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i6.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i6.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i9.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i9.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i9.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i9.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "ngmodule", type: MatRadioModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i11.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatTimepickerModule }, { kind: "component", type: StaticHtmlComponent, selector: "app-static-html", inputs: ["value"] }, { kind: "pipe", type: TimeAgoPipe, name: "timeAgo" }], animations: [
             trigger('entryAnimation', [
                 state('in', style({ opacity: '1' })),
                 state('out', style({ opacity: '0' })),
@@ -1365,7 +1551,7 @@ class EntrySummaryComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: EntrySummaryComponent, deps: [{ token: i1$3.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: EntrySummaryComponent, isStandalone: true, selector: "app-entry-summary", inputs: { entry: "entry" }, ngImport: i0, template: "\n<div class=\"entry section restrict\">\n    <h2>{{entry?.title}}</h2>\n    <!--    <a href=\"javascript:void(0)\" (click)=\"edit(entry)\"><h6>[Edit]</h6></a>-->\n    <h3>Posted {{entry?.create_date.toString() | timeAgo}} on {{entry?.create_date?.getMonth() + 1}}/{{entry?.create_date?.getDate()}}/{{entry?.create_date?.getFullYear()}}</h3>\n    <h5 *ngIf=\"entry.showEditInformation()\">Article was last edited {{entry?.edit_date.toString() | timeAgo}}</h5>\n    <br>\n\n    <ng-container *ngFor=\"let section of entry?.sections.slice(0, 1)\">\n        <h4>{{section?.subheading}}</h4>\n        <ng-container *ngFor=\"let content of section?.contents.slice(0, 1)\">\n            <ng-container [ngSwitch]=\"content.type\">\n                <ng-container *ngSwitchCase=\"ContentType.CODE\">\n                    <pre><code class=\"language-ts\">{{content?.value}}</code></pre>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"ContentType.URL\">\n                    <a [href]=\"content?.value\" target=\"_blank\">{{content.title}}</a>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"ContentType.IMAGE\">\n                    <div class=\"restrict\">\n                        <div class=\"image\">\n                            <img [src]=\"content?.value\"/>\n                        </div>\n                        <div class=\"description\" *ngIf=\"content?.description\">{{content?.description}}</div>\n                        <div class=\"source\" *ngIf=\"content?.source\">\n                            <a [href]=\"content?.source\" [target]=\"'_blank'\">Source: {{content?.source}}</a>\n                        </div>\n                    </div>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"ContentType.MEDIA\">\n                    <div class=\"restrict\">\n                        <div class=\"image\">\n                            <img [src]=\"content?.value\"/>\n                        </div>\n                        <div class=\"description\" *ngIf=\"content?.description\">{{content?.description}}</div>\n                        <div class=\"source\" *ngIf=\"content?.source\">\n                            <a [href]=\"content?.source\" [target]=\"'_blank'\">Source: {{content?.source}}</a>\n                        </div>\n                    </div>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"ContentType.HTML\">\n                    <app-static-html\n                        [value]=\"content?.value\"\n                        >\n                    </app-static-html>\n                </ng-container>\n                <ng-container *ngSwitchDefault>\n                    <p>{{content?.value}}</p>\n                </ng-container>\n            </ng-container>\n        </ng-container>\n    </ng-container>\n\n    <a href=\"javascript:void(0);\" (click)=\"routeTo(entry)\">Read more...</a>\n</div>\n", styles: [".entry{padding:20px;border-bottom:solid 1px rgba(0,0,0,.12)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: StaticHtmlComponent, selector: "app-static-html", inputs: ["value"] }, { kind: "pipe", type: TimeAgoPipe, name: "timeAgo" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: EntrySummaryComponent, isStandalone: true, selector: "app-entry-summary", inputs: { entry: "entry" }, ngImport: i0, template: "\n<div class=\"entry section restrict\">\n    <h2>{{entry?.title}}</h2>\n    <!--    <a href=\"javascript:void(0)\" (click)=\"edit(entry)\"><h6>[Edit]</h6></a>-->\n    <h3>Posted {{entry?.create_date.toString() | timeAgo}} on {{entry?.create_date?.getMonth() + 1}}/{{entry?.create_date?.getDate()}}/{{entry?.create_date?.getFullYear()}}</h3>\n    <h5 *ngIf=\"entry.showEditInformation()\">Article was last edited {{entry?.edit_date.toString() | timeAgo}}</h5>\n    <br>\n\n    <ng-container *ngFor=\"let section of entry?.sections.slice(0, 1)\">\n        <h4>{{section?.subheading}}</h4>\n        <ng-container *ngFor=\"let content of section?.contents.slice(0, 1)\">\n            <ng-container [ngSwitch]=\"content.type\">\n                <ng-container *ngSwitchCase=\"ContentType.CODE\">\n                    <pre><code class=\"language-ts\">{{content?.value}}</code></pre>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"ContentType.URL\">\n                    <a [href]=\"content?.value\" target=\"_blank\">{{content.title}}</a>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"ContentType.IMAGE\">\n                    <div class=\"restrict\">\n                        <div class=\"image\">\n                            <img [src]=\"content?.value\"/>\n                        </div>\n                        <div class=\"description\" *ngIf=\"content?.description\">{{content?.description}}</div>\n                        <div class=\"source\" *ngIf=\"content?.source\">\n                            <a [href]=\"content?.source\" [target]=\"'_blank'\">Source: {{content?.source}}</a>\n                        </div>\n                    </div>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"ContentType.MEDIA\">\n                    <div class=\"restrict\">\n                        <div class=\"image\">\n                            <img [src]=\"content?.value\"/>\n                        </div>\n                        <div class=\"description\" *ngIf=\"content?.description\">{{content?.description}}</div>\n                        <div class=\"source\" *ngIf=\"content?.source\">\n                            <a [href]=\"content?.source\" [target]=\"'_blank'\">Source: {{content?.source}}</a>\n                        </div>\n                    </div>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"ContentType.HTML\">\n                    <app-static-html\n                        [value]=\"content?.value\"\n                        >\n                    </app-static-html>\n                </ng-container>\n                <ng-container *ngSwitchDefault>\n                    <p>{{content?.value}}</p>\n                </ng-container>\n            </ng-container>\n        </ng-container>\n    </ng-container>\n\n    <a href=\"javascript:void(0);\" (click)=\"routeTo(entry)\">Read more...</a>\n</div>\n", styles: [".entry{padding:20px;border-bottom:solid 1px rgba(0,0,0,.12)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i6.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i6.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: StaticHtmlComponent, selector: "app-static-html", inputs: ["value"] }, { kind: "pipe", type: TimeAgoPipe, name: "timeAgo" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: EntrySummaryComponent, decorators: [{
             type: Component,
@@ -1378,6 +1564,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                 type: Input
             }] } });
 
+//import {EntrySummaryComponent} from '../entry-summary/entry-summary.component';
 class JsonRendererComponent {
     constructor(entryService) {
         this.entryService = entryService;
@@ -1390,14 +1577,14 @@ class JsonRendererComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: JsonRendererComponent, deps: [{ token: EntryService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: JsonRendererComponent, isStandalone: true, selector: "app-json-renderer", inputs: { entry: "entry" }, ngImport: i0, template: "<div class=\"section json-render json\">\n    <app-entry-renderer [editMode]=\"true\" [entry]=\"entry\"></app-entry-renderer>\n    <pre *ngIf=\"entry\">{{JSON.stringify(entry)}}</pre>\n</div>\n", styles: [".json pre{white-space:pre-wrap;word-wrap:anywhere}.json-render{padding:0 20px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EntryRendererComponent, selector: "app-entry-renderer", inputs: ["entry", "editMode"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: JsonRendererComponent, isStandalone: true, selector: "app-json-renderer", inputs: { entry: "entry" }, ngImport: i0, template: "<div class=\"section json-render json\">\n    <app-entry-renderer [editMode]=\"true\" [entry]=\"entry\"></app-entry-renderer>\n    <pre *ngIf=\"entry\">{{JSON.stringify(entry)}}</pre>\n</div>\n", styles: [".json pre{white-space:pre-wrap;word-wrap:anywhere}.json-render{padding:0 20px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EntryRendererComponent, selector: "app-entry-renderer", inputs: ["entry", "editMode"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: JsonRendererComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-json-renderer', imports: [
                         CommonModule,
                         EntryRendererComponent,
-                        EntrySummaryComponent
+                        //EntrySummaryComponent
                     ], template: "<div class=\"section json-render json\">\n    <app-entry-renderer [editMode]=\"true\" [entry]=\"entry\"></app-entry-renderer>\n    <pre *ngIf=\"entry\">{{JSON.stringify(entry)}}</pre>\n</div>\n", styles: [".json pre{white-space:pre-wrap;word-wrap:anywhere}.json-render{padding:0 20px}\n"] }]
         }], ctorParameters: () => [{ type: EntryService }], propDecorators: { entry: [{
                 type: Input
@@ -1423,7 +1610,7 @@ class LandingPageComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: LandingPageComponent, deps: [{ token: i1$3.Router }, { token: EntryService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: LandingPageComponent, isStandalone: true, selector: "app-landing-page", ngImport: i0, template: "<div class=\"landing-page\">\n    <ng-container *ngFor=\"let entry of entries\">\n        <app-entry-summary [entry]=\"entry.entry\"></app-entry-summary>\n    </ng-container>\n</div>\n", styles: [".landing-page{min-height:calc(100vh - 100px);max-height:calc(100vh - 100px)}@media screen and (max-height: 560px){.landing-page{max-height:100vh}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: EntrySummaryComponent, selector: "app-entry-summary", inputs: ["entry"] }, { kind: "ngmodule", type: MatCardModule }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: LandingPageComponent, isStandalone: true, selector: "app-landing-page", ngImport: i0, template: "<div class=\"landing-page\">\n    <ng-container *ngFor=\"let entry of entries\">\n        <app-entry-summary [entry]=\"entry.entry\"></app-entry-summary>\n    </ng-container>\n</div>\n", styles: [".landing-page{min-height:calc(100vh - 100px);max-height:calc(100vh - 100px)}@media screen and (max-height: 560px){.landing-page{max-height:100vh}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: EntrySummaryComponent, selector: "app-entry-summary", inputs: ["entry"] }, { kind: "ngmodule", type: MatCardModule }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: LandingPageComponent, decorators: [{
             type: Component,
@@ -1459,7 +1646,7 @@ class OutlineViewComponent {
         this.entryService.currentlyEditedEntry.next(this.entry);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: OutlineViewComponent, deps: [{ token: EntryService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: OutlineViewComponent, isStandalone: true, selector: "app-outline-view", ngImport: i0, template: "<div *ngIf=\"entry\" class=\"section outline\">\n    <h1 *ngIf=\"entry?.sections?.length === 0\">Outline View</h1>\n    <div cdkDropList class=\"sections\" (cdkDropListDropped)=\"sectionDrop($event)\">\n        <mat-card class=\"card\" cdkDrag *ngFor=\"let section of entry.sections\">\n            <h3>Section {{Math.ceil(section.order / 10) + 1}}</h3>\n            {{section.subheading}}\n            <div cdkDropList class=\"contents\" (cdkDropListDropped)=\"contentDrop($event, section)\">\n                <h3>Contents for {{section.subheading}}</h3>\n                <div class=\"content-card\" *ngFor=\"let content of section.contents\" cdkDrag>\n                    <div class=\"content\">{{content.value}}</div>\n                    <div class=\"content-placeholder\" *cdkDragPlaceholder></div>\n                </div>\n            </div>\n        </mat-card>\n        <div class=\"custom-placeholder\" *cdkDragPlaceholder></div>\n    </div>\n</div>\n", styles: [".outline{padding:0 20px}.content{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.card,.content-card{margin:4px;cursor:pointer}.content-card:not(:last-child){border-bottom:1px dotted #aaa}.custom-placeholder{background:#ccc;border:dotted 3px #999;transition:transform .25s cubic-bezier(0,0,.2,1);min-height:60px}.content-placeholder{background:#ccc;border:dotted 3px #999;transition:transform .25s cubic-bezier(0,0,.2,1);min-height:30px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i9.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i4$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i4$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4$2.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: OutlineViewComponent, isStandalone: true, selector: "app-outline-view", ngImport: i0, template: "<div *ngIf=\"entry\" class=\"section outline\">\n    <h1 *ngIf=\"entry?.sections?.length === 0\">Outline View</h1>\n    <div cdkDropList class=\"sections\" (cdkDropListDropped)=\"sectionDrop($event)\">\n        <mat-card class=\"card\" cdkDrag *ngFor=\"let section of entry.sections\">\n            <h3>Section {{Math.ceil(section.order / 10) + 1}}</h3>\n            {{section.subheading}}\n            <div cdkDropList class=\"contents\" (cdkDropListDropped)=\"contentDrop($event, section)\">\n                <h3>Contents for {{section.subheading}}</h3>\n                <div class=\"content-card\" *ngFor=\"let content of section.contents\" cdkDrag>\n                    <div class=\"content\">{{content.value}}</div>\n                    <div class=\"content-placeholder\" *cdkDragPlaceholder></div>\n                </div>\n            </div>\n        </mat-card>\n        <div class=\"custom-placeholder\" *cdkDragPlaceholder></div>\n    </div>\n</div>\n", styles: [".outline{padding:0 20px}.content{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.card,.content-card{margin:4px;cursor:pointer}.content-card:not(:last-child){border-bottom:1px dotted #aaa}.custom-placeholder{background:#ccc;border:dotted 3px #999;transition:transform .25s cubic-bezier(0,0,.2,1);min-height:60px}.content-placeholder{background:#ccc;border:dotted 3px #999;transition:transform .25s cubic-bezier(0,0,.2,1);min-height:30px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i9.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i4$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i4$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4$1.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: OutlineViewComponent, decorators: [{
             type: Component,
@@ -1584,9 +1771,9 @@ class SideNavigationComponent {
     }
     render() {
     }
-    routeTo(entry) {
+    routeTo(entry, path = "") {
         if (!entry) {
-            this.router.navigateByUrl('create(left-col:create//right-col:create)').then(() => {
+            this.router.navigateByUrl(path).then(() => {
             });
         }
         else {
@@ -1651,7 +1838,7 @@ class SideNavigationComponent {
         this.doSearch.emit(searchValue);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: SideNavigationComponent, deps: [{ token: EntryService }, { token: i1$3.Router }, { token: IdentityService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: SideNavigationComponent, isStandalone: true, selector: "app-side-navigation", viewQueries: [{ propertyName: "divNav", first: true, predicate: ["navcontainer"], descendants: true }], ngImport: i0, template: "<div class=\"sidenav no-scrollbar\">\n  <div style=\"margin-top: 20px;\">\n    <mat-form-field style=\"width: 100%\">\n      <mat-label>Search</mat-label>\n      <input matInput [formControl]=\"searchControl\" (ngModelChange)=\"onSearchChange($event)\">\n    </mat-form-field>\n  </div>\n\n  <div\n    class=\"progress\"\n    [hidden]=\"!loading\"\n  >\n    <mat-progress-spinner\n      style=\"margin-left: 16px;\"\n      [diameter]=20\n      mode=\"indeterminate\"\n    >\n    </mat-progress-spinner>\n  </div>\n\n  <div #navcontainer class=\"navcontainer\"\n    [@sideNavAnimation]=\"state\"\n  >\n    <mat-nav-list>\n      @for(container of entriesByMonthAndYear; track container) {\n        <h3>{{getMonthAndYearFromKey(container.month_year)}}</h3>\n        @for(entry of container.entries; track entry.id) {\n          <a mat-list-item href=\"javascript:void(0);\" (click)=\"routeTo(entry)\">{{entry.title}}</a>\n        }\n      }\n    </mat-nav-list>\n\n    <a\n      class=\"sidelink\"\n      *ngIf=\"this?.response?.next && !loading\"\n      (click)=\"getMore()\"\n      href=\"javascript:void(0);\">More...</a>\n  </div>\n  <ng-container *ngIf=\"identity?.id === 1\">\n    <h2>Misc</h2>\n\n    <mat-list>\n      <a mat-list-item href=\"javascript:void(0);\" (click)=\"routeTo(null)\">Create</a>\n    </mat-list>\n  </ng-container>\n  <h3 *ngIf=\"identity\">Logged in as {{identity?.email}}</h3>\n</div>\n\n", styles: [".progress{position:absolute;top:100px;left:0}.sidelink{padding-left:16px}.sidenav{position:relative;max-height:calc(100vh - 100px)}@media screen and (max-height: 560px){.sidenav{max-height:100vh}}h2,h3{margin-left:10px;justify-content:right}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i6$2.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i10.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i6$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i9$2.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i9$2.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i9$2.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: SideNavigationComponent, isStandalone: true, selector: "app-side-navigation", viewQueries: [{ propertyName: "divNav", first: true, predicate: ["navcontainer"], descendants: true }], ngImport: i0, template: "<div class=\"sidenav no-scrollbar\">\n  <div style=\"margin-top: 20px;\">\n    <mat-form-field style=\"width: 100%\">\n      <mat-label>Search</mat-label>\n      <input matInput [formControl]=\"searchControl\" (ngModelChange)=\"onSearchChange($event)\">\n    </mat-form-field>\n  </div>\n\n  <div\n    class=\"progress\"\n    [hidden]=\"!loading\"\n  >\n    <mat-progress-spinner\n      style=\"margin-left: 16px;\"\n      [diameter]=20\n      mode=\"indeterminate\"\n    >\n    </mat-progress-spinner>\n  </div>\n\n  <div #navcontainer class=\"navcontainer\"\n    [@sideNavAnimation]=\"state\"\n  >\n    <mat-nav-list>\n      @for(container of entriesByMonthAndYear; track container) {\n        <h3>{{getMonthAndYearFromKey(container.month_year)}}</h3>\n        @for(entry of container.entries; track entry.id) {\n          <a mat-list-item href=\"javascript:void(0);\" (click)=\"routeTo(entry)\">{{entry.title}}</a>\n        }\n      }\n    </mat-nav-list>\n\n    <a\n      class=\"sidelink\"\n      *ngIf=\"this?.response?.next && !loading\"\n      (click)=\"getMore()\"\n      href=\"javascript:void(0);\">More...</a>\n  </div>\n  <ng-container *ngIf=\"identity?.id === 1\">\n    <h2>Misc</h2>\n    <mat-list>\n      <a mat-list-item href=\"javascript:void(0);\" (click)=\"routeTo(null, 'create/v2(left-col:create//right-col:create)')\">Create</a>\n    </mat-list>\n  </ng-container>\n  <h3 *ngIf=\"identity\">Logged in as {{identity?.email}}</h3>\n</div>\n\n", styles: [".progress{position:absolute;top:100px;left:0}.sidelink{padding-left:16px}.sidenav{position:relative;max-height:calc(100vh - 100px)}@media screen and (max-height: 560px){.sidenav{max-height:100vh}}h2,h3{margin-left:10px;justify-content:right}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i6$2.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i11.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i7.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i9$1.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i9$1.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i9$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }], animations: [
             trigger('sideNavAnimation', [
                 state('in', style({ transform: 'translateX(0%)' })),
                 state('out', style({ transform: 'translateX(110%)' })),
@@ -1686,7 +1873,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                                 animate('100ms ease-in', style({ transform: 'translateX(0%)' }))
                             ])
                         ]),
-                    ], template: "<div class=\"sidenav no-scrollbar\">\n  <div style=\"margin-top: 20px;\">\n    <mat-form-field style=\"width: 100%\">\n      <mat-label>Search</mat-label>\n      <input matInput [formControl]=\"searchControl\" (ngModelChange)=\"onSearchChange($event)\">\n    </mat-form-field>\n  </div>\n\n  <div\n    class=\"progress\"\n    [hidden]=\"!loading\"\n  >\n    <mat-progress-spinner\n      style=\"margin-left: 16px;\"\n      [diameter]=20\n      mode=\"indeterminate\"\n    >\n    </mat-progress-spinner>\n  </div>\n\n  <div #navcontainer class=\"navcontainer\"\n    [@sideNavAnimation]=\"state\"\n  >\n    <mat-nav-list>\n      @for(container of entriesByMonthAndYear; track container) {\n        <h3>{{getMonthAndYearFromKey(container.month_year)}}</h3>\n        @for(entry of container.entries; track entry.id) {\n          <a mat-list-item href=\"javascript:void(0);\" (click)=\"routeTo(entry)\">{{entry.title}}</a>\n        }\n      }\n    </mat-nav-list>\n\n    <a\n      class=\"sidelink\"\n      *ngIf=\"this?.response?.next && !loading\"\n      (click)=\"getMore()\"\n      href=\"javascript:void(0);\">More...</a>\n  </div>\n  <ng-container *ngIf=\"identity?.id === 1\">\n    <h2>Misc</h2>\n\n    <mat-list>\n      <a mat-list-item href=\"javascript:void(0);\" (click)=\"routeTo(null)\">Create</a>\n    </mat-list>\n  </ng-container>\n  <h3 *ngIf=\"identity\">Logged in as {{identity?.email}}</h3>\n</div>\n\n", styles: [".progress{position:absolute;top:100px;left:0}.sidelink{padding-left:16px}.sidenav{position:relative;max-height:calc(100vh - 100px)}@media screen and (max-height: 560px){.sidenav{max-height:100vh}}h2,h3{margin-left:10px;justify-content:right}\n"] }]
+                    ], template: "<div class=\"sidenav no-scrollbar\">\n  <div style=\"margin-top: 20px;\">\n    <mat-form-field style=\"width: 100%\">\n      <mat-label>Search</mat-label>\n      <input matInput [formControl]=\"searchControl\" (ngModelChange)=\"onSearchChange($event)\">\n    </mat-form-field>\n  </div>\n\n  <div\n    class=\"progress\"\n    [hidden]=\"!loading\"\n  >\n    <mat-progress-spinner\n      style=\"margin-left: 16px;\"\n      [diameter]=20\n      mode=\"indeterminate\"\n    >\n    </mat-progress-spinner>\n  </div>\n\n  <div #navcontainer class=\"navcontainer\"\n    [@sideNavAnimation]=\"state\"\n  >\n    <mat-nav-list>\n      @for(container of entriesByMonthAndYear; track container) {\n        <h3>{{getMonthAndYearFromKey(container.month_year)}}</h3>\n        @for(entry of container.entries; track entry.id) {\n          <a mat-list-item href=\"javascript:void(0);\" (click)=\"routeTo(entry)\">{{entry.title}}</a>\n        }\n      }\n    </mat-nav-list>\n\n    <a\n      class=\"sidelink\"\n      *ngIf=\"this?.response?.next && !loading\"\n      (click)=\"getMore()\"\n      href=\"javascript:void(0);\">More...</a>\n  </div>\n  <ng-container *ngIf=\"identity?.id === 1\">\n    <h2>Misc</h2>\n    <mat-list>\n      <a mat-list-item href=\"javascript:void(0);\" (click)=\"routeTo(null, 'create/v2(left-col:create//right-col:create)')\">Create</a>\n    </mat-list>\n  </ng-container>\n  <h3 *ngIf=\"identity\">Logged in as {{identity?.email}}</h3>\n</div>\n\n", styles: [".progress{position:absolute;top:100px;left:0}.sidelink{padding-left:16px}.sidenav{position:relative;max-height:calc(100vh - 100px)}@media screen and (max-height: 560px){.sidenav{max-height:100vh}}h2,h3{margin-left:10px;justify-content:right}\n"] }]
         }], ctorParameters: () => [{ type: EntryService }, { type: i1$3.Router }, { type: IdentityService }, { type: i0.Renderer2 }], propDecorators: { divNav: [{
                 type: ViewChild,
                 args: ['navcontainer', { static: false }]
@@ -1729,7 +1916,7 @@ class MainComponent {
         this.subs.unsubscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: MainComponent, deps: [{ token: i1$3.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: MainComponent, isStandalone: true, selector: "lib-main", host: { listeners: { "window:resize": "onResize($event)" } }, ngImport: i0, template: "<ng-container *ngIf=\"loaded\">\n    <div class=\"container\">\n        <div class=\"body\">\n            <div class=\"container-row\">\n                <mat-sidenav-container [autosize]=\"true\">\n                    <mat-sidenav [(opened)]=\"showLeftCol\" #leftcol opened mode=\"side\" class=\"left no-scrollbar\">\n                        <router-outlet name=\"left-col\"></router-outlet>\n                        <button mat-mini-fab color=\"primary\" class=\"fade left-toggle\" *ngIf=\"showLeftCol\" (click)=\"leftcol.toggle()\"> << </button>\n                    </mat-sidenav>\n                    <mat-sidenav [(opened)]=\"showRightCol\" #rightcol mode=\"side\" position=\"end\" class=\"right\">\n                        <button mat-mini-fab color=\"primary\" class=\"fade right-toggle\" *ngIf=\"showRightCol\" (click)=\"rightcol.toggle()\"> >> </button>\n                        <router-outlet name=\"right-col\"></router-outlet>\n                    </mat-sidenav>\n                    <div class=\"middle\">\n                        <button mat-mini-fab color=\"primary\" class=\"fade left-toggle\" *ngIf=\"!showLeftCol\" (click)=\"leftcol.toggle()\"> >> </button>\n                        <button  mat-mini-fab color=\"primary\" class=\"fade right-toggle\" *ngIf=\"!showRightCol\" (click)=\"rightcol.toggle()\"> << </button>\n                        <router-outlet></router-outlet>\n                    </div>\n                </mat-sidenav-container>\n            </div>\n        </div>\n    </div>\n</ng-container>\n", styles: ["a{text-decoration:none}.body{flex-grow:1;max-height:calc(100vh - 100px);overflow:scroll}@media screen and (max-height: 560px){.body{max-height:100vh}}.left,.right{min-width:400px;max-width:33vw}.left-toggle{position:fixed;top:50%;left:5px;z-index:100}.right-toggle{position:fixed;top:50%;right:5px;z-index:100}a{margin-right:10px}a:not(:last-child):after{margin-left:10px;content:\"|\"}\n"], dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i2$2.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i2$2.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: MainComponent, isStandalone: true, selector: "lib-main", host: { listeners: { "window:resize": "onResize($event)" } }, ngImport: i0, template: "<ng-container *ngIf=\"loaded\">\n    <div class=\"container\">\n        <div class=\"body\">\n            <div class=\"container-row\">\n                <mat-sidenav-container [autosize]=\"true\">\n                    <mat-sidenav [(opened)]=\"showLeftCol\" #leftcol opened mode=\"side\" class=\"left no-scrollbar\">\n                        <router-outlet name=\"left-col\"></router-outlet>\n                        <button mat-mini-fab color=\"primary\" class=\"fade left-toggle\" *ngIf=\"showLeftCol\" (click)=\"leftcol.toggle()\"> << </button>\n                    </mat-sidenav>\n                    <mat-sidenav [(opened)]=\"showRightCol\" #rightcol mode=\"side\" position=\"end\" class=\"right\">\n                        <button mat-mini-fab color=\"primary\" class=\"fade right-toggle\" *ngIf=\"showRightCol\" (click)=\"rightcol.toggle()\"> >> </button>\n                        <router-outlet name=\"right-col\"></router-outlet>\n                    </mat-sidenav>\n                    <div class=\"middle\">\n                        <button mat-mini-fab color=\"primary\" class=\"fade left-toggle\" *ngIf=\"!showLeftCol\" (click)=\"leftcol.toggle()\"> >> </button>\n                        <button  mat-mini-fab color=\"primary\" class=\"fade right-toggle\" *ngIf=\"!showRightCol\" (click)=\"rightcol.toggle()\"> << </button>\n                        <router-outlet></router-outlet>\n                    </div>\n                </mat-sidenav-container>\n            </div>\n        </div>\n    </div>\n</ng-container>\n", styles: ["a{text-decoration:none}.body{flex-grow:1;max-height:calc(100vh - 100px);overflow:scroll}@media screen and (max-height: 560px){.body{max-height:100vh}}.left,.right{min-width:400px;max-width:33vw}.left-toggle{position:fixed;top:50%;left:5px;z-index:100}.right-toggle{position:fixed;top:50%;right:5px;z-index:100}a{margin-right:10px}a:not(:last-child):after{margin-left:10px;content:\"|\"}\n"], dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i2$1.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i2$1.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: MainComponent, decorators: [{
             type: Component,
@@ -1799,11 +1986,12 @@ class EntryRendererWrapperComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: EntryRendererWrapperComponent, deps: [{ token: EntryService }, { token: i1$3.Router }, { token: i1$3.ActivatedRoute }, { token: ViewService }, { token: InteractionService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: EntryRendererWrapperComponent, isStandalone: true, selector: "lib-entry-renderer-wrapper", ngImport: i0, template: "<div class=\"rendered-entry section\">\n    <app-entry-renderer *ngIf=\"currentEntry\" [entry]=\"currentEntry\"></app-entry-renderer>\n</div>\n", styles: [".rendered-entry{padding:0 20px}\n"], dependencies: [{ kind: "component", type: EntryRendererComponent, selector: "app-entry-renderer", inputs: ["entry", "editMode"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: EntryRendererWrapperComponent, isStandalone: true, selector: "lib-entry-renderer-wrapper", ngImport: i0, template: "<div class=\"rendered-entry section\">\n    <app-entry-renderer *ngIf=\"currentEntry\" [entry]=\"currentEntry\"></app-entry-renderer>\n</div>\n", styles: [".rendered-entry{padding:0 20px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EntryRendererComponent, selector: "app-entry-renderer", inputs: ["entry", "editMode"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: EntryRendererWrapperComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lib-entry-renderer-wrapper', imports: [
+                        CommonModule,
                         EntryRendererComponent
                     ], template: "<div class=\"rendered-entry section\">\n    <app-entry-renderer *ngIf=\"currentEntry\" [entry]=\"currentEntry\"></app-entry-renderer>\n</div>\n", styles: [".rendered-entry{padding:0 20px}\n"] }]
         }], ctorParameters: () => [{ type: EntryService }, { type: i1$3.Router }, { type: i1$3.ActivatedRoute }, { type: ViewService }, { type: InteractionService }] });
@@ -1855,7 +2043,7 @@ class SchedulePublishDialogComponent {
         this.dialogRef.close('test');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: SchedulePublishDialogComponent, deps: [{ token: i1$2.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: SchedulePublishDialogComponent, isStandalone: true, selector: "lib-schedule-publish-dialog", ngImport: i0, template: "<h1 mat-dialog-title>Select a Date and Time to Schedule This Post</h1>\n<!--<mat-radio-group aria-label=\"Select an option\">-->\n<!--    <mat-radio-button class=\"option\" value=\"unpublished\">Unpublished</mat-radio-button>-->\n<!--    <mat-radio-button class=\"option\" value=\"published\">Published</mat-radio-button>-->\n<!--</mat-radio-group>-->\n<p>Date</p>\n<mat-form-field appearance=\"fill\">\n  <mat-label>Choose a date</mat-label>\n  <input matInput [matDatepicker]=\"picker\">\n  <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n  <mat-datepicker #picker></mat-datepicker>\n</mat-form-field>\n<p>Time</p>\n<input [matTimepicker]=\"timepicker\" readonly>\n<mat-timepicker #timepicker></mat-timepicker>\n<div mat-dialog-actions>\n    <button mat-button (click)=\"onNoClick()\">Cancel</button>\n    <button mat-button (click)=\"onYesClick()\" cdkFocusInitial>Schedule Publish</button>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7.MatLabel, selector: "mat-label" }, { kind: "directive", type: i7.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i12.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i12.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i12.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatTimepickerModule }, { kind: "component", type: i4$1.MatTimepicker, selector: "mat-timepicker", inputs: ["interval", "options", "disableRipple", "aria-label", "aria-labelledby"], outputs: ["selected", "opened", "closed"], exportAs: ["matTimepicker"] }, { kind: "directive", type: i4$1.MatTimepickerInput, selector: "input[matTimepicker]", inputs: ["value", "matTimepicker", "matTimepickerMin", "matTimepickerMax", "disabled"], outputs: ["valueChange"], exportAs: ["matTimepickerInput"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: SchedulePublishDialogComponent, isStandalone: true, selector: "lib-schedule-publish-dialog", ngImport: i0, template: "<h1 mat-dialog-title>Select a Date and Time to Schedule This Post</h1>\n<!--<mat-radio-group aria-label=\"Select an option\">-->\n<!--    <mat-radio-button class=\"option\" value=\"unpublished\">Unpublished</mat-radio-button>-->\n<!--    <mat-radio-button class=\"option\" value=\"published\">Published</mat-radio-button>-->\n<!--</mat-radio-group>-->\n<p>Date</p>\n<mat-form-field appearance=\"fill\">\n  <mat-label>Choose a date</mat-label>\n  <input matInput [matDatepicker]=\"picker\">\n  <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n  <mat-datepicker #picker></mat-datepicker>\n</mat-form-field>\n<p>Time</p>\n<input [matTimepicker]=\"timepicker\" readonly>\n<mat-timepicker #timepicker></mat-timepicker>\n<div mat-dialog-actions>\n    <button mat-button (click)=\"onNoClick()\">Cancel</button>\n    <button mat-button (click)=\"onYesClick()\" cdkFocusInitial>Schedule Publish</button>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i13.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i13.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i13.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatTimepickerModule }, { kind: "component", type: i14.MatTimepicker, selector: "mat-timepicker", inputs: ["interval", "options", "disableRipple", "aria-label", "aria-labelledby"], outputs: ["selected", "opened", "closed"], exportAs: ["matTimepicker"] }, { kind: "directive", type: i14.MatTimepickerInput, selector: "input[matTimepicker]", inputs: ["value", "matTimepicker", "matTimepickerMin", "matTimepickerMax", "disabled"], outputs: ["valueChange"], exportAs: ["matTimepickerInput"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: SchedulePublishDialogComponent, decorators: [{
             type: Component,
@@ -1933,7 +2121,7 @@ class CoreModule {
             PrismService,
             IdentityService,
             DjangoRestFrameworkEndpointService,
-            TagService,
+            TagService
         ], imports: [CommonModule,
             RouterModule,
             FormsModule,
@@ -2020,7 +2208,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                         PrismService,
                         IdentityService,
                         DjangoRestFrameworkEndpointService,
-                        TagService,
+                        TagService
                     ],
                     exports: [
                         EntryRendererComponent,
@@ -2049,5 +2237,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { Base, CommentService, Content, ContentType, CoreEvent, CoreEventType, CoreModule, DjangoRestFrameworkEndpointService, Entry, EntryCreatorComponent, EntryRendererComponent, EntryRendererWrapperComponent, EntrySelectorDialogComponent, EntryService, EntrySummaryComponent, Guid, IdentityService, Interaction, InteractionService, JsonRendererComponent, LandingPageComponent, LinkyPipe, ListResponse, MainComponent, MediaUploadModalComponent, OutlineViewComponent, PrismService, Routes, Section, SideNavigationComponent, StaticHtmlComponent, StaticHtmlService, TagService, TimeAgoPipe, Upload, UploadService, View, ViewService, VisitorProfile, VisitorProfileService };
+export { Base, CommentService, Content, ContentType, CoreEvent, CoreEventType, CoreModule, DjangoRestFrameworkEndpointService, Entry, EntryCreatorComponent, EntryRendererComponent, EntryRendererWrapperComponent, EntrySelectorDialogComponent, EntryService, EntrySummaryComponent, Guid, IdentityService, Interaction, InteractionService, JsonRendererComponent, LandingPageComponent, LinkyPipe, ListResponse, MainComponent, MediaUploadModalComponent, OutlineViewComponent, PrismService, Routes, Section, SideNavigationComponent, StaticHtmlComponent, StaticHtmlService, TagService, TimeAgoPipe, Upload, UploadService, Utility, View, ViewService, VisitorProfile, VisitorProfileService };
 //# sourceMappingURL=thecodeblogs-blog.mjs.map