Skip to content

Commit a66537a

Browse files
velerveler
committed
Added a simple form with Monaco Editor. No way to communicate with the editor yet.
1 parent 114fc20 commit a66537a

38 files changed

+1466
-54
lines changed

‎.gitignore

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,14 @@
1313
# User-specific files (MonoDevelop/Xamarin Studio)
1414
*.userprefs
1515

16+
# TypeScript ignores
17+
*.js
18+
*.js.map
19+
package-lock.json
20+
21+
# Monaco Dependency (Download from https://microsoft.github.io/monaco-editor/)
22+
src/app/dev/DevToys.MonacoEditor/monaco-editor
23+
1624
# Nuke Build
1725
.nuke/temp/
1826

‎init.ps1

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,5 +16,13 @@ Get-ChildItem $PSScriptRoot\src\ -rec |? { $_.FullName.EndsWith('.sln') } |% {
1616
Write-Host "Restoring packages for $($SolutionPath)..."
1717
ExecSafe { & $env:DOTNET_EXE restore -v:quiet $SolutionPath }
1818
}
19+
20+
Write-Host "Done."
21+
Write-Output "---------------------------------------"
22+
23+
# Restore Monaco Editor
24+
Write-Host "Restoring Monaco Editor"
25+
ExecSafe { & "$PSScriptRoot\tools\Restore-MonacoEditor.ps1" -RootFolder $PSScriptRoot }
26+
1927
Write-Host "Done."
2028
Write-Output "---------------------------------------"

‎init.sh

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
#!/usr/bin/env bash
22

3+
bash --version 2>&1 | head -n 1
4+
35
set -eo pipefail
46
SCRIPT_DIR=$(cd "$( dirname "${BASH_SOURCE[0]}" )" && pwd)
57

@@ -14,5 +16,13 @@ do
1416
echo "Restoring packages for $SOLUTION_FILE..."
1517
"$DOTNET_EXE" restore -v:quiet $SOLUTION_FILE
1618
done
19+
20+
echo "Done."
21+
echo "---------------------------------------"
22+
23+
# Restore Monaco Editor
24+
echo "Restoring Monaco Editor"
25+
. "./tools/Restore-MonacoEditor.sh" $SCRIPT_DIR
26+
1727
echo "Done."
1828
echo "---------------------------------------"

‎src/DevToys.sln

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,8 @@ Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "DevToys.CLI", "app\dev\plat
6464
EndProject
6565
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "DevToys.UnitTests", "app\tests\DevToys.UnitTests\DevToys.UnitTests.csproj", "{FBD1A1FE-C8F7-4A1F-8B89-C81D3780DADC}"
6666
EndProject
67+
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "DevToys.MonacoEditor", "app\dev\DevToys.MonacoEditor\DevToys.MonacoEditor.csproj", "{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}"
68+
EndProject
6769
Global
6870
GlobalSection(SolutionConfigurationPlatforms) = preSolution
6971
Debug|Any CPU = Debug|Any CPU
@@ -201,6 +203,22 @@ Global
201203
{FBD1A1FE-C8F7-4A1F-8B89-C81D3780DADC}.Release|x64.Build.0 = Release|Any CPU
202204
{FBD1A1FE-C8F7-4A1F-8B89-C81D3780DADC}.Release|x86.ActiveCfg = Release|Any CPU
203205
{FBD1A1FE-C8F7-4A1F-8B89-C81D3780DADC}.Release|x86.Build.0 = Release|Any CPU
206+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
207+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Debug|Any CPU.Build.0 = Debug|Any CPU
208+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Debug|arm64.ActiveCfg = Debug|Any CPU
209+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Debug|arm64.Build.0 = Debug|Any CPU
210+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Debug|x64.ActiveCfg = Debug|Any CPU
211+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Debug|x64.Build.0 = Debug|Any CPU
212+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Debug|x86.ActiveCfg = Debug|Any CPU
213+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Debug|x86.Build.0 = Debug|Any CPU
214+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Release|Any CPU.ActiveCfg = Release|Any CPU
215+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Release|Any CPU.Build.0 = Release|Any CPU
216+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Release|arm64.ActiveCfg = Release|Any CPU
217+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Release|arm64.Build.0 = Release|Any CPU
218+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Release|x64.ActiveCfg = Release|Any CPU
219+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Release|x64.Build.0 = Release|Any CPU
220+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Release|x86.ActiveCfg = Release|Any CPU
221+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5}.Release|x86.Build.0 = Release|Any CPU
204222
EndGlobalSection
205223
GlobalSection(SolutionProperties) = preSolution
206224
HideSolutionNode = FALSE
@@ -219,6 +237,7 @@ Global
219237
{6279C845-92F8-4333-AB99-3D213163593C} = {B20E4027-0777-4A75-A848-609594E9A6B0}
220238
{A1CB6EEE-3CD2-416C-85E0-2C612FE2DF49} = {3D2285D5-0E44-4B1A-9B74-2BBE3108D5B7}
221239
{FBD1A1FE-C8F7-4A1F-8B89-C81D3780DADC} = {4C40BF47-315A-4B60-9ED6-8D65B5E79C2C}
240+
{E4354FEC-B0BB-49AC-A9D2-ABBE7F74DCC5} = {B20E4027-0777-4A75-A848-609594E9A6B0}
222241
EndGlobalSection
223242
GlobalSection(ExtensibilityGlobals) = postSolution
224243
SolutionGuid = {C2C953F5-F97F-4198-B15C-4947A886050F}

‎src/Directory.Packages.props

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,33 +2,40 @@
22
<PropertyGroup>
33
<CommunityToolkitVersion>8.0.0</CommunityToolkitVersion>
44
<DotNetVersion>6.0.0</DotNetVersion>
5-
<UnoVersion>4.6.19</UnoVersion>
5+
<UnoVersion>4.7.0-dev.666</UnoVersion>
66
<UnoWasmBootstrapVersion>8.0.0-dev.65</UnoWasmBootstrapVersion>
7+
<WindowsNetSdkVersion>10.0.22000.28</WindowsNetSdkVersion>
78
</PropertyGroup>
89
<ItemGroup>
910
<PackageVersion Include="CommunityToolkit.Common" Version="$(CommunityToolkitVersion)" />
1011
<PackageVersion Include="CommunityToolkit.Diagnostics" Version="$(CommunityToolkitVersion)" />
1112
<PackageVersion Include="CommunityToolkit.Mvvm" Version="$(CommunityToolkitVersion)" />
1213
<PackageVersion Include="coverlet.collector" Version="3.1.2" />
14+
<PackageVersion Include="Microsoft.CSharp" Version="4.7.0" />
1315
<PackageVersion Include="Microsoft.Extensions.Logging" Version="$(DotNetVersion)" />
16+
<PackageVersion Include="Microsoft.Extensions.Logging.Configuration" Version="$(DotNetVersion)" />
1417
<PackageVersion Include="Microsoft.Extensions.Logging.Console" Version="$(DotNetVersion)" />
1518
<PackageVersion Include="Microsoft.NET.Test.Sdk" Version="17.1.0" />
1619
<PackageVersion Include="Microsoft.Windows.Compatibility" Version="$(DotNetVersion)" />
1720
<PackageVersion Include="Microsoft.Windows.SDK.BuildTools" Version="10.0.22000.196" />
1821
<PackageVersion Include="Microsoft.WindowsAppSDK" Version="1.1.3" />
1922
<PackageVersion Include="Moq" Version="4.18.2" />
2023
<PackageVersion Include="Newtonsoft.Json" Version="13.0.1" />
24+
<PackageVersion Include="Nito.AsyncEx" Version="5.1.2"/>
2125
<PackageVersion Include="Nuke.Common" Version="6.2.1" />
2226
<PackageVersion Include="System.CommandLine" Version="2.0.0-beta4.22272.1"/>
2327
<PackageVersion Include="System.ComponentModel.Composition" Version="$(DotNetVersion)" />
28+
<PackageVersion Include="Uno.Core.Extensions.Logging" Version="4.0.1" />
2429
<PackageVersion Include="Uno.Core.Extensions.Logging.Singleton" Version="4.0.1" />
2530
<PackageVersion Include="Uno.Extensions.Logging.WebAssembly.Console" Version="1.4.0" />
31+
<PackageVersion Include="Uno.UI" Version="$(UnoVersion)" />
2632
<PackageVersion Include="Uno.UI.Adapter.Microsoft.Extensions.Logging" Version="$(UnoVersion)" />
2733
<PackageVersion Include="Uno.Wasm.Bootstrap" Version="$(UnoWasmBootstrapVersion)" />
2834
<PackageVersion Include="Uno.Wasm.Bootstrap.DevServer" Version="$(UnoWasmBootstrapVersion)" />
2935
<PackageVersion Include="Uno.WinUI" Version="$(UnoVersion)" />
3036
<PackageVersion Include="Uno.WinUI.Lottie" Version="$(UnoVersion)" />
3137
<PackageVersion Include="Uno.WinUI.RemoteControl" Version="$(UnoVersion)" />
38+
<PackageVersion Include="Uno.WinUI.Runtime.WebAssembly" Version="$(UnoVersion)" />
3239
<PackageVersion Include="Uno.WinUI.WebAssembly" Version="$(UnoVersion)" />
3340
<PackageVersion Include="xunit" Version="2.4.2" />
3441
<PackageVersion Include="xunit.runner.visualstudio" Version="2.4.5" />

‎src/app/dev/DevToys.MonacoEditor/CodeEditor/CodeEditor.Wasm.ts

Lines changed: 113 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,113 @@
1+
(function()
2+
{
3+
//Debug.log("Create dynamic style element");
4+
var head = document.head || document.getElementsByTagName('head')[0];
5+
var style = document.createElement('style');
6+
style.id='dynamic';
7+
head.appendChild(style);
8+
9+
//Debug.log("Starting Monaco Load");
10+
11+
var editor;
12+
var model;
13+
var contexts = {};
14+
window.contexts = {};
15+
var decorations = [];
16+
window.decorations = [];
17+
var modifingSelection = false; // Supress updates to selection when making edits.
18+
window.modifyingSelection = false;
19+
20+
require.config({ paths: { 'vs': '{UNO_BOOTSTRAP_WEBAPP_BASE_PATH}{UNO_BOOTSTRAP_APP_BASE}/devtoys.monacoeditor/monaco-editor/min/vs' } });
21+
require(
22+
['vs/editor/editor.main'],
23+
function ()
24+
{
25+
//Debug.log("Grabbing Monaco Options");
26+
27+
//var opt = {};
28+
//try
29+
//{
30+
// opt = getOptions();
31+
//}
32+
//catch(err)
33+
//{
34+
// //Debug.log("Unable to read options - " + err);
35+
//}
36+
37+
//Debug.log("Getting Parent Text value");
38+
//opt["value"] = getParentValue("Text");
39+
40+
//Debug.log("Getting Host container");
41+
//Debug.log("Creating Editor");
42+
const editor = monaco.editor.create(element, null /* opt */);
43+
window.editor = editor;
44+
45+
//Debug.log("Getting Editor model");
46+
//model = editor.getModel();
47+
//window.model = model;
48+
49+
//// Listen for Content Changes
50+
////Debug.log("Listening for changes in the editor model - " + (!model));
51+
//model.onDidChangeContent(
52+
// (event) =>
53+
// {
54+
// //Parent.setValue("Text", stringifyForMarshalling(model.getValue()));
55+
// //console.log("buffers: " + JSON.stringify(model._buffer._pieceTree._buffers));
56+
// //console.log("commandMgr: " + JSON.stringify(model._commandManager));
57+
// //console.log("viewState:" + JSON.stringify(editor.saveViewState()));
58+
// });
59+
60+
//// Listen for Selection Changes
61+
////Debug.log("Listening for changes in the editor selection");
62+
//editor.onDidChangeCursorSelection(
63+
// (event) =>
64+
// {
65+
// if (!modifingSelection)
66+
// {
67+
// console.log(event.source);
68+
// //Parent.setValue("SelectedText", stringifyForMarshalling(model.getValueInRange(event.selection)));
69+
// // Parent.setValueWithType("SelectedRange", stringifyForMarshalling(JSON.stringify(event.selection)), "Selection");
70+
// }
71+
// });
72+
73+
//// Set theme
74+
////Debug.log("Getting parent theme value");
75+
//let theme = getParentJsonValue("RequestedTheme");
76+
//theme
77+
// = {
78+
// "0": "Default",
79+
// "1": "Light",
80+
// "2": "Dark"
81+
// }
82+
// [theme];
83+
84+
////Debug.log("Current theme value - " + theme);
85+
//if (theme == "Default")
86+
//{
87+
// Debug.log("Loading default theme");
88+
// theme = getThemeCurrentThemeName();
89+
//}
90+
91+
////Debug.log("Changing theme");
92+
//changeTheme(theme, getThemeIsHighContrast());
93+
94+
// Update Monaco Size when we receive a window resize event
95+
//Debug.log("Listen for resize events on the window and resize the editor");
96+
window.addEventListener(
97+
"resize",
98+
() =>
99+
{
100+
editor.layout();
101+
});
102+
103+
// Disable WebView Scrollbar so Monaco Scrollbar can do heavy lifting
104+
document.body.style.overflow = 'hidden';
105+
106+
// Callback to Parent that we're loaded
107+
//Debug.log("Loaded Monaco");
108+
//Parent.callAction("Loaded");
109+
110+
//Debug.log("Ending Monaco Load");
111+
}
112+
);
113+
})();

‎src/app/dev/DevToys.MonacoEditor/CodeEditor/CodeEditor.Windows.html

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
5+
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
6+
<style>
7+
html, body {
8+
height: 100%;
9+
margin: 0;
10+
}
11+
/* Just have Monaco Fill All Available Space within control */
12+
#container {
13+
height: 100%;
14+
width: 100%;
15+
}
16+
</style>
17+
<style id="dynamic">
18+
</style>
19+
</head>
20+
<body>
21+
22+
<div id="container" onkeydown="keyDown(event)"></div>
23+
24+
<!--<script src="https://devtoys.local/ts-helpermethods/ts-helpermethods-Windows/asyncCallbackHelpers.js"></script>-->
25+
<script src="https://devtoys.local/monaco-editor/min/vs/loader.js"></script>
26+
<!--<script src="https://devtoys.local/ts-helpermethods/registerCodeLensProvider.js"></script>
27+
<script src="https://devtoys.local/ts-helpermethods/registerColorProvider.js"></script>
28+
<script src="https://devtoys.local/ts-helpermethods/registerCompletionItemProvider.js"></script>
29+
<script src="https://devtoys.local/ts-helpermethods/otherScriptsToBeOrganized.js"></script>
30+
<script src="https://devtoys.local/ts-helpermethods/updateSelectedContent.js"></script>-->
31+
32+
<script>
33+
var editor;
34+
var model;
35+
var contexts = {};
36+
var decorations = [];
37+
var modifingSelection = false; // Supress updates to selection when making edits.
38+
39+
//Debug.log("Starting Monaco Load");
40+
require.config({ paths: { 'vs': 'https://devtoys.local/monaco-editor/min/vs' } });
41+
require(['vs/editor/editor.main'], function () {
42+
//Debug.log("Grabbing Monaco Options");
43+
44+
//let opt = getOptions();
45+
//opt["value"] = Parent.getValue("Text");
46+
47+
editor = monaco.editor.create(document.getElementById('container'), null /* opt */);
48+
model = editor.getModel();
49+
50+
//// Listen for Content Changes
51+
//model.onDidChangeContent((event) => {
52+
// Parent.setValue("Text", model.getValue());
53+
// //console.log("buffers: " + JSON.stringify(model._buffer._pieceTree._buffers));
54+
// //console.log("commandMgr: " + JSON.stringify(model._commandManager));
55+
// //console.log("viewState:" + JSON.stringify(editor.saveViewState()));
56+
//});
57+
58+
//// Listen for Selection Changes
59+
//editor.onDidChangeCursorSelection((event) => {
60+
// if (!modifingSelection) {
61+
// console.log(event.source);
62+
// Parent.setValue("SelectedText", model.getValueInRange(event.selection));
63+
// Parent.setValue("SelectedRange", JSON.stringify(event.selection), "Selection");
64+
// }
65+
//})
66+
67+
//// Set theme
68+
//let theme = Parent.getJsonValue("RequestedTheme");
69+
//theme = {
70+
// "0": "Default",
71+
// "1": "Light",
72+
// "2": "Dark"
73+
//}[theme];
74+
//if (theme == "Default") {
75+
// theme = Theme.currentThemeName.toString();
76+
//}
77+
//changeTheme(theme, Theme.isHighContrast.toString());
78+
79+
//// Update Monaco Size when we receive a window resize event
80+
//window.addEventListener("resize", () => {
81+
// editor.layout();
82+
//});
83+
84+
// Disable WebView Scrollbar so Monaco Scrollbar can do heavy lifting
85+
document.body.style.overflow = 'hidden';
86+
87+
//// Callback to Parent that we're loaded
88+
//Debug.log("Loaded Monaco");
89+
//Parent.callAction("Loaded");
90+
});
91+
</script>
92+
</body>
93+
</html>

‎src/app/dev/DevToys.MonacoEditor/CodeEditor/CodeEditor.cs

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
using Microsoft.UI.Xaml;
2+
using Microsoft.UI.Xaml.Controls;
3+
4+
namespace DevToys.MonacoEditor;
5+
6+
/// <summary>
7+
/// .Net wrapper for the Monaco CodeEditor
8+
/// https://microsoft.github.io/monaco-editor/
9+
/// </summary>
10+
[TemplatePart(Name = "View", Type = typeof(ICodeEditorPresenter))]
11+
public sealed partial class CodeEditor : Control
12+
{
13+
private ICodeEditorPresenter _view;
14+
15+
public CodeEditor()
16+
{
17+
DefaultStyleKey = typeof(CodeEditor);
18+
}
19+
20+
protected override void OnApplyTemplate()
21+
{
22+
if (_view != null)
23+
{
24+
//_view.NavigationStarting -= WebView_NavigationStarting;
25+
//_view.DOMContentLoaded -= WebView_DOMContentLoaded;
26+
//_view.NavigationCompleted -= WebView_NavigationCompleted;
27+
//_view.NewWindowRequested -= WebView_NewWindowRequested;
28+
//Debug.WriteLine("Setting initialized - false");
29+
//_initialized = false;
30+
}
31+
32+
_view = (ICodeEditorPresenter)GetTemplateChild("View");
33+
34+
if (_view != null)
35+
{
36+
//_view.NavigationStarting += WebView_NavigationStarting;
37+
//_view.DOMContentLoaded += WebView_DOMContentLoaded;
38+
//_view.NavigationCompleted += WebView_NavigationCompleted;
39+
//_view.NewWindowRequested += WebView_NewWindowRequested;
40+
41+
_view.LaunchAsync();
42+
43+
base.OnApplyTemplate();
44+
}
45+
}
46+
}

0 commit comments

Comments
 (0)