Skip to content

Commit

Permalink
refactor(playground): created a utility class to hold re-occurring fu…
Browse files Browse the repository at this point in the history
…nctions
  • Loading branch information
JannisDommer committed Jan 3, 2024
1 parent 049a132 commit d49cdcf
Show file tree
Hide file tree
Showing 4 changed files with 101 additions and 86 deletions.
13 changes: 10 additions & 3 deletions WebSocketClient/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions WebSocketClient/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
"preview": "vite preview"
},
"devDependencies": {
"@types/lodash": "^4.14.202",
"@types/node": "^20.8.7",
"@types/uuid": "^9.0.7",
"@types/vscode": "~1.83.0",
Expand Down
86 changes: 3 additions & 83 deletions WebSocketClient/src/main.ts
Original file line number Diff line number Diff line change
Expand Up @@ -30,10 +30,11 @@ import initUvlTutorial from './uvlTutorial.ts';

import {buildWorkerDefinition} from 'monaco-editor-workers';
import {initIntroJS} from "./intro.ts";
import {ExecuteCommandSignature} from "./node_modules/vscode-languageclient";
import {ExecuteCommandSignature} from "vscode-languageclient";
import {downloadFile, uploadFile} from "./ImportExportFiles.ts";
import IIdentifiedSingleEditOperation = editor.IIdentifiedSingleEditOperation;
import {initExamples} from "./examples.ts";
import {aggregateCharacters, displayEditorError, displayEditorErrorAtContent} from "./util.ts";

buildWorkerDefinition('./node_modules/monaco-editor-workers/dist/workers', new URL('', window.location.href).href, false);

Expand Down Expand Up @@ -312,90 +313,9 @@ let debounceGenGraph = lodash.debounce(() => {
});
}, 500);

let globalEditor: editor.IStandaloneCodeEditor | null;
let currentWidget: editor.IOverlayWidget | null;
export let globalEditor: editor.IStandaloneCodeEditor | null;


function displayEditorError(msg: string) {
if (!globalEditor) {
return;
}
const overlayWidget: editor.IOverlayWidget = {
getId(): string {
return 'myCustomWidget';
}, getPosition(): editor.IOverlayWidgetPosition | null {
return {
preference: monaco.editor.OverlayWidgetPositionPreference.TOP_CENTER
}
}, getDomNode(): HTMLElement {
const node = document.createElement('div');
const span = document.createElement('span');
span.textContent = msg;
span.className = "error";
node.replaceChildren(span);
return node;
}
}
if (currentWidget) {
globalEditor.removeOverlayWidget(currentWidget);
}
currentWidget = overlayWidget;
globalEditor.addOverlayWidget(overlayWidget);
}

let currentContentWidget: editor.IContentWidget | null;

function displayEditorErrorAtContent(msg: string) {
if(!globalEditor){
return;
}
const selection = globalEditor.getSelection();
const contentWidget: editor.IContentWidget = {
getId(): string {
return 'myCustomWidget';
}, getPosition(): editor.IContentWidgetPosition | null {
if (selection) {
return {
position: selection.getStartPosition(),
preference: [monaco.editor.ContentWidgetPositionPreference.BELOW]
}
}
return {
position: {lineNumber: 1, column: 1}, preference: [monaco.editor.ContentWidgetPositionPreference.BELOW]
}
}, getDomNode(): HTMLElement {
const node = document.createElement('div');
const span = document.createElement('span');
node.className = "uvl-tooltip";
span.className = "tooltip-text";
span.textContent = msg;
node.replaceChildren(span);
return node;
}
}
removeWidget();
currentContentWidget = contentWidget;
globalEditor.addContentWidget(contentWidget);

debouceRemoveWidget(editor);
}

const debouceRemoveWidget = lodash.debounce(removeWidget, 2000);

function removeWidget() {
if (currentContentWidget) {
globalEditor?.removeContentWidget(currentContentWidget);
}
currentContentWidget = null;
}

function aggregateCharacters(model: editor.ITextModel): number {
let addReducer = (previousValue: number, currentValue: string) => {
return previousValue + currentValue.length
};
return model?.getLinesContent().reduce(addReducer, 0);
}

function getInitialFm() {
let initialFm = "features\n\tfeature1\n\t\tor\n\t\t\tfeature2\n\t\t\tfeature3\n\nconstraints\n\tfeature1";
const storedFm = window.localStorage.getItem("fm");
Expand Down
87 changes: 87 additions & 0 deletions WebSocketClient/src/util.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,87 @@
import {editor} from "monaco-editor";
import * as monaco from "monaco-editor";
import {globalEditor} from "./main.ts";
import lodash from 'lodash';


let currentWidget: editor.IOverlayWidget | null;

export function displayEditorError(msg: string) {
if (!globalEditor) {
return;
}
const overlayWidget: editor.IOverlayWidget = {
getId(): string {
return 'myCustomWidget';
}, getPosition(): editor.IOverlayWidgetPosition | null {
return {
preference: monaco.editor.OverlayWidgetPositionPreference.TOP_CENTER
}
}, getDomNode(): HTMLElement {
const node = document.createElement('div');
const span = document.createElement('span');
span.textContent = msg;
span.className = "error";
node.replaceChildren(span);
return node;
}
}
if (currentWidget) {
globalEditor.removeOverlayWidget(currentWidget);
}
currentWidget = overlayWidget;
globalEditor.addOverlayWidget(overlayWidget);
}

let currentContentWidget: editor.IContentWidget | null;

export function displayEditorErrorAtContent(msg: string) {
if(!globalEditor){
return;
}
const selection = globalEditor.getSelection();
const contentWidget: editor.IContentWidget = {
getId(): string {
return 'myCustomWidget';
}, getPosition(): editor.IContentWidgetPosition | null {
if (selection) {
return {
position: selection.getStartPosition(),
preference: [monaco.editor.ContentWidgetPositionPreference.BELOW]
}
}
return {
position: {lineNumber: 1, column: 1}, preference: [monaco.editor.ContentWidgetPositionPreference.BELOW]
}
}, getDomNode(): HTMLElement {
const node = document.createElement('div');
const span = document.createElement('span');
node.className = "uvl-tooltip";
span.className = "tooltip-text";
span.textContent = msg;
node.replaceChildren(span);
return node;
}
}
removeWidget();
currentContentWidget = contentWidget;
globalEditor.addContentWidget(contentWidget);

debounceRemoveWidget();
}

const debounceRemoveWidget = lodash.debounce(removeWidget, 2000);

function removeWidget() {
if (currentContentWidget) {
globalEditor?.removeContentWidget(currentContentWidget);
}
currentContentWidget = null;
}

export function aggregateCharacters(model: editor.ITextModel): number {
let addReducer = (previousValue: number, currentValue: string) => {
return previousValue + currentValue.length
};
return model?.getLinesContent().reduce(addReducer, 0);
}

0 comments on commit d49cdcf

Please sign in to comment.