Added preliminary files modal; fixed tabs scroll issue; fixed missing build deps

This commit is contained in:
itdominator 2025-06-15 00:43:33 -05:00
parent f28dfa84c2
commit ef56b8c84b
14 changed files with 218 additions and 12 deletions

View File

@ -50,7 +50,7 @@ app.whenReady().then(async () => {
createWindow();
newton.fs.setWindow(window);
newton.fs.ipc.setWindow(window);
newton.ipc.setWindow(window);
});
@ -86,4 +86,4 @@ process.on('unhandledRejection', function(error = {}) {
if (error.stack != null) {
console.log(error.stack);
}
});
});

View File

@ -24,8 +24,7 @@
"icon": "./icos/",
"files": [
"newton/",
"build/",
"!node_modules/"
"build/"
],
"mac": {
"category": "public.app-category.developer-tools"
@ -83,4 +82,4 @@
"karma-jasmine-html-reporter": "2.1.0",
"typescript": "5.7.2"
}
}
}

View File

@ -0,0 +1,34 @@
import { Injectable } from '@angular/core';
import { ReplaySubject, Observable } from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class FilesModalService {
private showFilesModalSubject: ReplaySubject<null> = new ReplaySubject<null>(1);
private addFileSubject: ReplaySubject<string> = new ReplaySubject<string>(1);
constructor() {
}
showFilesModal(): void {
this.showFilesModalSubject.next(null);
}
showFilesModalRequested$(): Observable<null> {
return this.showFilesModalSubject.asObservable();
}
addFileToModal(data: string): void {
this.addFileSubject.next(data);
}
addFileToModalRequested$(): Observable<string> {
return this.addFileSubject.asObservable();
}
}

View File

@ -35,4 +35,6 @@
</div>
</div>
<files-modal></files-modal>
<div>

View File

@ -2,6 +2,7 @@ import { Component, ElementRef, ViewChild, TemplateRef, ComponentRef, ViewContai
import { Subject, takeUntil } from 'rxjs';
import { NewtonEditorComponent } from "./newton-editor/newton-editor.component";
import { FilesModalComponent } from "./modals/files-modal.component";
import { EditorsService } from '../common/services/editor/editors.service';
import { FilesService } from '../common/services/editor/files.service';
@ -15,7 +16,8 @@ import { ServiceMessage } from '../common/types/service-message.type';
selector: 'editors',
standalone: true,
imports: [
DndDirective
DndDirective,
FilesModalComponent
],
templateUrl: './editors.component.html',
styleUrl: './editors.component.css',

View File

@ -0,0 +1,16 @@
.modal-column {
min-height: 24em;
max-height: 24em;
overflow: auto;
}
.close-button {
background: rgba(116, 0, 0, 0.64);
border-style: solid;
border-color: rgba(0, 0, 0, 0.64);
border-width: 1px;
}
.close-button:hover {
background: rgba(256, 0, 0, 0.64);
}

View File

@ -0,0 +1,52 @@
<div #filesModal
id="filesModal" class="modal fade" tabindex="-1" role="dialog"
>
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Files:</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="row">
<div class="col">
<div class="row">
<div class="col modal-column">
<div #filesList *ngFor="let file of files" class="row">
<div class="col-11 title"
title="{{file.path}}"
uuid="{{file.uuid}}"
path="{{file.path}}"
>
{{file.title}}
</div>
<div class="col-1 close-button">
X
</div>
</div>
</div>
</div>
<div class="row">
<input #filesSearch type="text" placeholder="Search..." />
</div>
</div>
<div class="col modal-column">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>

View File

@ -0,0 +1,85 @@
import { Component } from "@angular/core";
import { CommonModule } from "@angular/common";
import { Subject, takeUntil } from 'rxjs';
import * as bootstrap from "bootstrap";
import { FilesModalService } from "../../common/services/editor/modals/files-modal.service";
import { TabsService } from '../../common/services/editor/tabs/tabs.service';
import { ServiceMessage } from '../../common/types/service-message.type';
@Component({
selector: 'files-modal',
standalone: true,
imports: [
CommonModule
],
templateUrl: './files-modal.component.html',
styleUrl: './files-modal.component.css',
host: {
'class': ''
}
})
export class FilesModalComponent {
private unsubscribe = new Subject<void>();
filesModal!: bootstrap.Modal;
files: any[] = [];
constructor(
private filesModalService: FilesModalService,
private tabsService: TabsService
) {
}
public ngAfterViewInit(): void {
this.loadSubscribers();
}
loadSubscribers() {
this.tabsService.getData$().pipe(
takeUntil(this.unsubscribe)
).subscribe((data: ServiceMessage) => {
if (data.action === "create-tab") {
this.createFileRow(data.message, data.uuid, data.data);
}
});
this.filesModalService.showFilesModalRequested$().pipe(
takeUntil(this.unsubscribe)
).subscribe(() => {
if (!this.filesModal) {
this.createModal();
}
this.showModal();
});
this.filesModalService.addFileToModalRequested$().pipe(
takeUntil(this.unsubscribe)
).subscribe((uuid: string) => {
if (!this.filesModal) {
this.createModal();
}
});
}
private createFileRow(title: string, uuid: string, path: string): void {
this.files.push({title: title, path: path, uuid: uuid})
}
createModal() {
this.filesModal = new bootstrap.Modal("#filesModal", {});
}
showModal() {
this.filesModal?.toggle();
}
}

View File

@ -9,8 +9,9 @@ import "ace-builds/src-noconflict/theme-one_dark";
import "ace-builds/src-noconflict/theme-dracula";
import { InfoBarService } from '../../common/services/editor/info-bar/info-bar.service';
import { EditorsService } from '../../common/services/editor/editors.service';
import { FilesModalService } from '../../common/services/editor/modals/files-modal.service';
import { LSPService } from '../../common/services/lsp.service';
import { EditorsService } from '../../common/services/editor/editors.service';
import { NewtonEditorBase } from './newton-editor.base';
@ -33,7 +34,8 @@ export class NewtonEditorComponent extends NewtonEditorBase {
constructor(
private infoBarService: InfoBarService,
private editorsService: EditorsService,
private lspService: LSPService
private lspService: LSPService,
private filesModalService: FilesModalService
) {
super();
}
@ -174,6 +176,13 @@ export class NewtonEditorComponent extends NewtonEditorBase {
this.saveFileAs();
},
readOnly: false
}, {
name: "showModal",
bindKey: {win: "ctrl-b", mac: "ctrl-b"},
exec: () => {
this.filesModalService.showFilesModal();
},
readOnly: false
}
]);

View File

@ -1,6 +1,9 @@
.display-contents {
display: contents;
}
.tab {
display: flex;
overflow: auto;
float: left;
margin-right: 2em;
font-size: 0.2em;

View File

@ -4,6 +4,7 @@
cdkDropListOrientation="horizontal"
(cdkDropListDropped)="dropped($event)"
(click)="handleAction($event)"
class="display-contents"
>
<div *ngFor="let tab of tabs"

View File

@ -21,7 +21,7 @@ import { ServiceMessage } from '../../common/types/service-message.type';
templateUrl: './tabs.component.html',
styleUrl: './tabs.component.css',
host: {
'class': 'row tabs scroller'
'class': 'tabs scroller'
}
})
export class TabsComponent {
@ -42,8 +42,9 @@ export class TabsComponent {
this.tabsService.getData$().pipe(
takeUntil(this.unsubscribe)
).subscribe((data: ServiceMessage) => {
if (data.action === "create-tab")
if (data.action === "create-tab") {
this.createTab(data.message, data.uuid, data.data);
}
});
}

View File

@ -32,6 +32,8 @@ body {
padding-bottom: 0.4em;
padding-top: 0.4em;
color: rgba(255, 255, 255, 0.64);
margin-left: 0.2em;
margin-right: 0.2em;
}

View File

@ -1,5 +1,5 @@
<!doctype html>
<html lang="en">
<html lang="en" data-bs-theme="dark">
<head>
<meta charset="utf-8">
<title>Newton</title>