Fix Code Editor Edit Component (no path) and Save Functionality

README.md

@@ -30,12 +30,12 @@ This project was designed to provide a means of doing a presentation with code e
 - [x] Incorporate a means of editing a talk.
 - [x] Incorporate a means of displaying a LIST of slides.
 - [x] Edit Deck Title.
-- [ ] Edit Global CSS.
+- [ ] Edit Deck Global CSS.
 - [ ] Add means of Disabling Slide.
 - [x] Edit Slide (Specific to Type).
 - [x] Edit Slide (Code Editor).
 - [ ] Edit Slide (Code Editor): Optional fields for Triggers.
-- [ ] Edit Slide (Code Editor): Simplify Save.
+- [x] Edit Slide (Code Editor): Simplify Save.
 - [x] Code-Editor (add and remove) triggers.
 - [ ] Add new Slide (before and after Slide).
 - [ ] Reorder Slides (up and down).

src/app/pages/edit/edit.component.scss

@@ -196,9 +196,11 @@
 }
 
 .button-toggle-group {
+  --mat-standard-button-toggle-divider-color: #69f0ae;
   --mat-standard-button-toggle-shape: 9999px;
   --mat-standard-button-toggle-height: 2em;
 
+  border: 2px solid var(--mat-standard-button-toggle-divider-color);
   margin-bottom: 1em;
 
   .button-toggle-option {

src/app/slides/code-editor/ce-editor/ce-editor.component.html

@@ -8,15 +8,6 @@
     [attr.data-required]="true"
     [(ngModel)]="title" />
 
-  <div class="panel-title">Path</div>
-  <input
-    type="text"
-    placeholder="Path"
-    data-editing="path"
-    data-adjust="adjust-50-percent"
-    [attr.data-required]="true"
-    [(ngModel)]="path" />
-
   <div class="panel-title">Folder</div>
   <input
     type="text"
@@ -28,6 +19,7 @@
 
   <div class="array-wrapper">
     <div class="array-title">Files to View</div>
+    <div [hidden]="true" [attr.data-files]="stringifyFiles()"></div>
     @for (file of files; track file; let index = $index;) {
       <div class="array-row">
         <input

src/app/slides/code-editor/ce-editor/ce-editor.component.ts

@@ -17,8 +17,6 @@ type CECKey = keyof CeEditorComponent;
   imports: [
     FormsModule,
 
-    // MatButtonModule,
-    // MatIconModule,
     MatInputModule,
 
     RowButtonsComponent,
@@ -81,6 +79,10 @@ export class CeEditorComponent extends AbstractSlide {
     }
   };
 
+  stringifyFiles = (): string => {
+    return JSON.stringify(this.files);
+  };
+
   stringifyTriggers = (): string => {
     return JSON.stringify(this.triggers);
   };

src/app/slides/code-editor/code-editor.component.ts

@@ -46,50 +46,15 @@ export class CodeEditorComponent extends AbstractSlide {
       }
     }
 
-    const arrayElements: any = document.querySelectorAll('[data-array-type]');
-    const arrays: Array<any> = Array.from(arrayElements);
-
-    const fileArrayElements = arrays
-      .filter((element: any) => element.dataset.arrayType === 'files')
-      .sort((a: any, b: any) => a.dataset.arrayIndex - b.dataset.arrayIndex);
-
-    response.ITEMS.push('files');
-    response.files = [];
-    for (let i = 0, len = fileArrayElements.length; i < len; i++) {
-      const item = fileArrayElements[i];
-      const required: boolean = item.dataset.required === 'true';
-
-      const length: number = this.checkItemLength(item);
-      if (required === true || (required === false && length > 0)) {
-        response.files.push(this.getItemValue(item));
-      }
-    }
+    const checkFileElement: any = document.querySelector('[data-files]');
+    const checkFiles: Array<any> = JSON.parse(checkFileElement.dataset.files);
+    response['files'] = checkFiles;
 
     const checkTriggerElement: any = document.querySelector('[data-triggers]');
     const checkTriggers: Array<any> = JSON.parse(checkTriggerElement.dataset.triggers);
+    response['triggers'] = checkTriggers;
 
-    const triggerArrayElements = arrays
-      .filter((element: any) => element.dataset.arrayType.includes('triggers'))
-      .sort((a: any, b: any) => a.dataset.arrayIndex - b.dataset.arrayIndex);
-
-    response.ITEMS.push('triggers');
-    response.triggers = [];
-    for (let i = 0, len = triggerArrayElements.length; i < len; i++) {
-      const item = triggerArrayElements[i];
-      const index = item.dataset.arrayIndex;
-      if (response.triggers[index] === undefined) {
-        response.triggers[index] = { ...checkTriggers[index] };
-      }
-      const required: boolean = item.dataset.required === 'true';
-
-      const length: number = this.checkItemLength(item);
-      if (required === true || (required === false && length > 0)) {
-        const key = item.dataset.arrayType.split('.')[1];
-        response.triggers[index][key] = this.getItemValue(item);
-      }
-    }
-
-    response.ITEMS.push('notes');
+    response.ITEMS.push('files', 'triggers', 'notes');
     response.notes = this.notes;
     response.slideKey = this.route.snapshot.paramMap.get('slideKey');