Example tweaking

Author: kaisalmen

packages/examples/eclipse.jdt.ls.html

@@ -14,6 +14,7 @@
         <br>
         <button type="button" id="button-start">Start</button>
         <button type="button" id="button-dispose">Dispose</button>
+        Launch backend with: <b><code>docker compose -f ./packages/examples/resources/eclipse.jdt.ls/docker-compose.yml up -d</code></b><br>
     </div>
 	<div id="monaco-editor-root" style="width:800px;height:600px;border:1px solid grey"></div>
     <script type="module">

packages/examples/groovy.html

@@ -14,6 +14,7 @@
         <br>
         <button type="button" id="button-start">Start</button>
         <button type="button" id="button-dispose">Dispose</button>
+        Launch backend with: <b><code>docker compose -f ./packages/examples/resources/groovy/docker-compose.yml up -d</code></b><br>
     </div>
 	<div id="monaco-editor-root" style="width:800px;height:600px;border:1px solid grey"></div>
     <script type="module">

packages/examples/src/appPlayground/reactMain.tsx

@@ -9,6 +9,7 @@ import { MonacoEditorLanguageClientWrapper, TextChanges } from 'monaco-editor-wr
 import { MonacoEditorReactComp } from '@typefox/monaco-editor-react';
 import { configure } from './config.js';
 import { configurePostStart } from './common.js';
+import { disableElement } from '../common/client/utils.js';
 
 export const runApplicationPlaygroundReact = async () => {
 
@@ -43,6 +44,7 @@ export const runApplicationPlaygroundReact = async () => {
             } else {
                 root.render(<App />);
             }
+            disableElement('checkbox-strictmode', true);
         });
     } catch (e) {
         console.error(e);

packages/examples/src/clangd/client/main.ts

@@ -11,7 +11,7 @@ import { MonacoEditorLanguageClientWrapper } from 'monaco-editor-wrapper';
 import { createWrapperConfig } from './config.js';
 import { ClangdWorkerHandler } from './workerHandler.js';
 import { MainRemoteMessageChannelFs } from './mainRemoteMessageChannelFs.js';
-import { createDefaultWorkspaceFile, disableButton } from '../../common/client/utils.js';
+import { createDefaultWorkspaceFile, disableElement } from '../../common/client/utils.js';
 import { HOME_DIR, WORKSPACE_PATH } from '../definitions.js';
 
 const wrapper = new MonacoEditorLanguageClientWrapper();
@@ -58,14 +58,14 @@ export const runClangdWrapper = async () => {
 
     try {
         document.querySelector('#button-start')?.addEventListener('click', async () => {
-            disableButton('button-start', true);
-            disableButton('button-start-fresh', true);
+            disableElement('button-start', true);
+            disableElement('button-start-fresh', true);
             await startWrapper();
         });
         document.querySelector('#button-start-fresh')?.addEventListener('click', async () => {
             initConfig.clearIndexedDb = true;
-            disableButton('button-start', true);
-            disableButton('button-start-fresh', true);
+            disableElement('button-start', true);
+            disableElement('button-start-fresh', true);
             await startWrapper();
         });
     } catch (e) {

packages/examples/src/common/client/utils.ts

@@ -9,8 +9,8 @@ import { useWorkerFactory } from 'monaco-editor-wrapper/workerFactory';
 import { RegisteredMemoryFile } from '@codingame/monaco-vscode-files-service-override';
 import { IStoredWorkspace } from '@codingame/monaco-vscode-configuration-service-override';
 
-export const disableButton = (id: string, disabled: boolean) => {
-    const button = document.getElementById(id) as HTMLButtonElement | null;
+export const disableElement = (id: string, disabled: boolean) => {
+    const button = document.getElementById(id) as HTMLButtonElement | HTMLInputElement | null;
     if (button !== null) {
         button.disabled = disabled;
     }

packages/examples/src/langium/langium-dsl/wrapperLangium.ts

@@ -6,7 +6,7 @@
 import { MonacoEditorLanguageClientWrapper } from 'monaco-editor-wrapper';
 import { setupLangiumClientExtended } from './config/extendedConfig.js';
 import { setupLangiumClientClassic } from './config/classicConfig.js';
-import { disableButton } from '../../common/client/utils.js';
+import { disableElement } from '../../common/client/utils.js';
 
 import workerUrl from './worker/langium-server?worker&url';
 
@@ -32,7 +32,7 @@ export const runLangiumDslWrapper = async (extendedMode: boolean) => {
 
         const startLangiumClient = async () => {
             if (checkStarted()) return;
-            disableButton('button-start', true);
+            disableElement('button-start', true);
 
             const langiumWorker = loadLangiumWorker();
 
@@ -52,7 +52,7 @@ export const runLangiumDslWrapper = async (extendedMode: boolean) => {
             wrapper.reportStatus();
             await wrapper.dispose();
             wrapper = undefined;
-            disableButton('button-start', false);
+            disableElement('button-start', false);
         };
 
         document.querySelector('#button-start')?.addEventListener('click', startLangiumClient);

packages/examples/src/langium/statemachine/main-react.tsx

@@ -9,6 +9,7 @@ import { MonacoEditorReactComp } from '@typefox/monaco-editor-react';
 import { createLangiumGlobalConfig } from './config/wrapperStatemachineConfig.js';
 import { loadStatemachineWorkerRegular } from './main.js';
 import text from '../../../resources/langium/statemachine/example.statemachine?raw';
+import { disableElement } from '../../common/client/utils.js';
 
 export const runStatemachineReact = async () => {
     const wrapperConfig = await createLangiumGlobalConfig({
@@ -49,6 +50,7 @@ export const runStatemachineReact = async () => {
             } else {
                 root.render(<App />);
             }
+            disableElement('checkbox-strictmode', true);
         });
         document.querySelector('#button-dispose')?.addEventListener('click', () => {
             root.render([]);

packages/examples/src/multi/twoLanguageClients.ts

@@ -10,11 +10,11 @@ import '@codingame/monaco-vscode-json-default-extension';
 import '@codingame/monaco-vscode-python-default-extension';
 import { LogLevel } from '@codingame/monaco-vscode-api';
 import { CodePlusFileExt, configureAndInitVscodeApi, disposeLanguageClients, LanguageClientWrapper, MonacoEditorLanguageClientWrapper, WrapperConfig } from 'monaco-editor-wrapper';
-import { configureMonacoWorkers, disableButton } from '../common/client/utils.js';
+import { configureMonacoWorkers, disableElement } from '../common/client/utils.js';
 import { createJsonLanguageClientConfig, createPythonLanguageClientConfig } from './config.js';
 
 export const runMultipleLanguageClientsExample = async () => {
-    disableButton('button-flip', true);
+    disableElement('button-flip', true);
 
     const textJson = `{
     "$schema": "http://json.schemastore.org/coffeelint",
@@ -106,10 +106,11 @@ print("Hello Moon!")
                 (wrapperConfig.editorAppConfig.codeResources.modified as CodePlusFileExt).fileExt = currenFileExt;
             }
 
-            disableButton('button-flip', false);
+            disableElement('button-flip', false);
+            disableElement('checkbox-extlc', true);
         });
         document.querySelector('#button-dispose')?.addEventListener('click', async () => {
-            disableButton('button-flip', true);
+            disableElement('button-flip', true);
 
             wrapperConfig.vscodeApiConfig!.vscodeApiInitPerformExternally = (document.getElementById('checkbox-extlc')! as HTMLInputElement).checked;
             if (wrapperConfig.vscodeApiConfig!.vscodeApiInitPerformExternally === true) {

packages/examples/src/python/client/reactPython.tsx

@@ -11,6 +11,7 @@ import { MonacoEditorReactComp } from '@typefox/monaco-editor-react';
 import { MonacoEditorLanguageClientWrapper, TextChanges } from 'monaco-editor-wrapper';
 import { createWrapperConfig } from './config.js';
 import badPyCode from '../../../resources/python/bad.py?raw';
+import { disableElement } from '../../common/client/utils.js';
 
 export const runPythonReact = async () => {
     const badPyUri = vscode.Uri.file('/workspace/bad.py');
@@ -50,6 +51,7 @@ export const runPythonReact = async () => {
             } else {
                 root.render(<App />);
             }
+            disableElement('checkbox-strictmode', true);
         });
         document.querySelector('#button-dispose')?.addEventListener('click', () => {
             root.render([]);