search

cerebral / webpackbin

[Deprecated]. Please move to codesandbox.io.
https://webpackbin-prod.firebaseapp.com/
202 stars 26 forks source link

Feature request - switch to Monaco Editor #34

Open OSUblake opened 7 years ago

OSUblake commented 7 years ago

https://github.com/Microsoft/monaco-editor

Replace CodeMirror with Monaco. It provides a much richer editor. Monaco is the same editor that powers VS Code, TypeScript Playground, and Visual Studio Online.

Demo page.

henri-hulski commented 7 years ago

Monaco has also no support for mobile. I think this would be an important feature.

OSUblake commented 7 years ago

@henri-hulski True. It can be a little unpredictable in some mobile browsers, but mobile support has been added to their Backlog milestone. When or if we might see that completed is anybody's guess. https://github.com/Microsoft/monaco-editor/issues/246

But right now there doesn't seem to be any mobile support anyways. I always get a message that says "This size is not supported, please flip phone or make browser wider".

henri-hulski commented 7 years ago

Yeah at the moment webpackbin has no mobile support but it would be great to have one.

christianalfoni commented 7 years ago

Yeah, Monaco looks awesome, but there are some requirements for the LIVE feature. It needs to track exact changes made and reproduce them on the other clients. This is used with change events and some custom code on Webpackbin now. The Monaco docs are not example driven and generally there is very little information about how to use it at a lower level searching google.

Basically what I need is to listen to some event on the editor which gives what text has changed at what position. This information needs to be passed to a second instance of the editor and update the content of that second editor.

If you find a way to do that I am happy to look into it :)

OSUblake commented 7 years ago

@christianalfoni I'm not familiar with the API either, but it sounds like the onDidChangeModelContent event might be what you're looking for. It will give you the line and column number of the changed content. https://microsoft.github.io/monaco-editor/api/interfaces/monaco.editor.icodeeditor.html#ondidchangemodelcontent

christianalfoni commented 7 years ago

Thanks for looking into it @OSUblake, I hope to find some time to look into this :-)