run `prettier`
Alex Dima
3 years ago
parent
b4178b1190
commit
84bdc31efe
@ -0,0 +1,23 @@
|
|||||||
|
/monaco-css/out/
|
||||||
|
/monaco-css/release/
|
||||||
|
/monaco-editor-samples/browser-esm-parcel/.cache/
|
||||||
|
/monaco-editor-samples/browser-esm-parcel/dist/
|
||||||
|
/monaco-editor-samples/browser-esm-webpack/dist/*.js
|
||||||
|
/monaco-editor-samples/browser-esm-webpack-monaco-plugin/dist/*.js
|
||||||
|
/monaco-editor-samples/browser-esm-webpack-small/dist/*.js
|
||||||
|
/monaco-editor-samples/browser-esm-webpack-typescript/dist/*.js
|
||||||
|
/monaco-editor-samples/browser-esm-webpack-typescript-react/dist/*.js
|
||||||
|
/monaco-editor/test/samples-all.generated.js
|
||||||
|
/monaco-editor/test/playground.generated/
|
||||||
|
/monaco-editor/typedoc/theme/
|
||||||
|
/monaco-editor/typedoc/monaco.d.ts
|
||||||
|
/monaco-editor/website/lib/
|
||||||
|
/monaco-html/out/
|
||||||
|
/monaco-html/release/
|
||||||
|
/monaco-json/out/
|
||||||
|
/monaco-json/release/
|
||||||
|
/monaco-languages/out/
|
||||||
|
/monaco-languages/release/
|
||||||
|
/monaco-typescript/out/
|
||||||
|
/monaco-typescript/release/
|
||||||
|
/monaco-typescript/src/lib/
|
||||||
File diff suppressed because it is too large
Load Diff
@ -1,184 +1,187 @@
|
|||||||
# Contributing & Maintaining
|
# Contributing & Maintaining
|
||||||
|
|
||||||
## A brief explanation on the source code structure
|
## A brief explanation on the source code structure
|
||||||
|
|
||||||
This repository contains no source code, it only contains the scripts to package everything together and ship the `monaco-editor` npm module:
|
This repository contains no source code, it only contains the scripts to package everything together and ship the `monaco-editor` npm module:
|
||||||
|
|
||||||
These packages are described in the root file called `metadata.js` and it is possible to create an editor distribution that contains only certain plugins by editing that file.
|
These packages are described in the root file called `metadata.js` and it is possible to create an editor distribution that contains only certain plugins by editing that file.
|
||||||
|
|
||||||
| repository | npm module | explanation |
|
| repository | npm module | explanation |
|
||||||
|------------|------------|-------------|
|
| ------------------------------------------------------------------- | ---------------------------------------------------------------------- | ------------------------------------------------------------------------- |
|
||||||
| [vscode](https://github.com/Microsoft/vscode) | [monaco-editor-core](https://www.npmjs.com/package/monaco-editor-core) | editor core functionality (language agnostic) is shipped out of vscode. |
|
| [vscode](https://github.com/Microsoft/vscode) | [monaco-editor-core](https://www.npmjs.com/package/monaco-editor-core) | editor core functionality (language agnostic) is shipped out of vscode. |
|
||||||
| [monaco-languages](https://github.com/Microsoft/monaco-languages) | [monaco-languages](https://www.npmjs.com/package/monaco-languages) | plugin that adds colorization and basic supports for dozens of languages. |
|
| [monaco-languages](https://github.com/Microsoft/monaco-languages) | [monaco-languages](https://www.npmjs.com/package/monaco-languages) | plugin that adds colorization and basic supports for dozens of languages. |
|
||||||
| [monaco-typescript](https://github.com/Microsoft/monaco-typescript) | [monaco-typescript](https://www.npmjs.com/package/monaco-typescript) | plugin that adds rich language support for JavaScript and TypeScript. |
|
| [monaco-typescript](https://github.com/Microsoft/monaco-typescript) | [monaco-typescript](https://www.npmjs.com/package/monaco-typescript) | plugin that adds rich language support for JavaScript and TypeScript. |
|
||||||
| [monaco-css](https://github.com/Microsoft/monaco-css) | [monaco-css](https://www.npmjs.com/package/monaco-css) | plugin that adds rich language support for CSS, LESS and SCSS. |
|
| [monaco-css](https://github.com/Microsoft/monaco-css) | [monaco-css](https://www.npmjs.com/package/monaco-css) | plugin that adds rich language support for CSS, LESS and SCSS. |
|
||||||
| [monaco-json](https://github.com/Microsoft/monaco-json) | [monaco-json](https://www.npmjs.com/package/monaco-json) | plugin that adds rich language support for JSON. |
|
| [monaco-json](https://github.com/Microsoft/monaco-json) | [monaco-json](https://www.npmjs.com/package/monaco-json) | plugin that adds rich language support for JSON. |
|
||||||
| [monaco-html](https://github.com/Microsoft/monaco-html) | [monaco-html](https://www.npmjs.com/package/monaco-html) | plugin that adds rich language support for HTML. |
|
| [monaco-html](https://github.com/Microsoft/monaco-html) | [monaco-html](https://www.npmjs.com/package/monaco-html) | plugin that adds rich language support for HTML. |
|
||||||
|
|
||||||
|
## Running the editor from source
|
||||||
## Running the editor from source
|
|
||||||
|
You need to have all the build setup of VS Code to be able to build the Monaco Editor.
|
||||||
You need to have all the build setup of VS Code to be able to build the Monaco Editor.
|
|
||||||
|
- Install all the [prerequisites](https://github.com/Microsoft/vscode/wiki/How-to-Contribute#prerequisites)
|
||||||
* Install all the [prerequisites](https://github.com/Microsoft/vscode/wiki/How-to-Contribute#prerequisites)
|
|
||||||
|
### OS X and Linux
|
||||||
### OS X and Linux
|
|
||||||
|
```bash
|
||||||
```bash
|
# clone vscode-loc repository for localized string resources
|
||||||
# clone vscode-loc repository for localized string resources
|
/src> git clone https://github.com/microsoft/vscode-loc
|
||||||
/src> git clone https://github.com/microsoft/vscode-loc
|
# clone VS Code repository
|
||||||
# clone VS Code repository
|
/src> git clone https://github.com/microsoft/vscode
|
||||||
/src> git clone https://github.com/microsoft/vscode
|
/src> cd vscode
|
||||||
/src> cd vscode
|
# install npm deps for vscode
|
||||||
# install npm deps for vscode
|
/src/vscode> yarn
|
||||||
/src/vscode> yarn
|
# start the compiler in the background
|
||||||
# start the compiler in the background
|
/src/vscode> yarn run watch
|
||||||
/src/vscode> yarn run watch
|
```
|
||||||
```
|
|
||||||
|
### Windows
|
||||||
### Windows
|
|
||||||
|
```cmd
|
||||||
```cmd
|
# clone vscode-loc repository for localized string resources
|
||||||
# clone vscode-loc repository for localized string resources
|
/src> git clone https://github.com/microsoft/vscode-loc
|
||||||
/src> git clone https://github.com/microsoft/vscode-loc
|
# clone VS Code repository
|
||||||
# clone VS Code repository
|
/src> git clone https://github.com/microsoft/vscode
|
||||||
/src> git clone https://github.com/microsoft/vscode
|
/src> cd vscode
|
||||||
/src> cd vscode
|
# install npm deps for vscode
|
||||||
# install npm deps for vscode
|
/src/vscode> yarn
|
||||||
/src/vscode> yarn
|
# start the compiler in the background
|
||||||
# start the compiler in the background
|
/src/vscode> yarn run watch
|
||||||
/src/vscode> yarn run watch
|
```
|
||||||
```
|
|
||||||
|
- For the monaco editor test pages:
|
||||||
* For the monaco editor test pages:
|
|
||||||
|
```bash
|
||||||
```bash
|
# clone monaco-editor (note the folders must be siblings!)
|
||||||
# clone monaco-editor (note the folders must be siblings!)
|
/src> git clone https://github.com/Microsoft/monaco-editor
|
||||||
/src> git clone https://github.com/Microsoft/monaco-editor
|
|
||||||
|
# install npm deps for monaco-editor
|
||||||
# install npm deps for monaco-editor
|
/src/monaco-editor> npm install .
|
||||||
/src/monaco-editor> npm install .
|
|
||||||
|
# start a local http server in the background
|
||||||
# start a local http server in the background
|
/src/monaco-editor> npm run simpleserver
|
||||||
/src/monaco-editor> npm run simpleserver
|
```
|
||||||
```
|
|
||||||
|
Open [http://localhost:8080/monaco-editor/test/?editor=src](http://localhost:8080/monaco-editor/test/?editor=src) to run.
|
||||||
Open [http://localhost:8080/monaco-editor/test/?editor=src](http://localhost:8080/monaco-editor/test/?editor=src) to run.
|
|
||||||
|
## Running a plugin from source (e.g. monaco-typescript)
|
||||||
## Running a plugin from source (e.g. monaco-typescript)
|
|
||||||
|
```bash
|
||||||
```bash
|
# clone monaco-typescript
|
||||||
# clone monaco-typescript
|
/src> git clone https://github.com/Microsoft/monaco-typescript
|
||||||
/src> git clone https://github.com/Microsoft/monaco-typescript
|
|
||||||
|
# install npm deps for monaco-typescript
|
||||||
# install npm deps for monaco-typescript
|
/src/monaco-typescript> npm install .
|
||||||
/src/monaco-typescript> npm install .
|
|
||||||
|
# start the compiler in the background
|
||||||
# start the compiler in the background
|
/src/monaco-typescript> npm run watch
|
||||||
/src/monaco-typescript> npm run watch
|
```
|
||||||
```
|
|
||||||
|
Open [http://localhost:8080/monaco-editor/test/?editor=src&monaco-typescript=src](http://localhost:8080/monaco-editor/test/?editor=src&monaco-typescript=src) to run.
|
||||||
Open [http://localhost:8080/monaco-editor/test/?editor=src&monaco-typescript=src](http://localhost:8080/monaco-editor/test/?editor=src&monaco-typescript=src) to run.
|
|
||||||
|
## Running the editor tests
|
||||||
## Running the editor tests
|
|
||||||
|
```bash
|
||||||
```bash
|
/src/vscode> npm run monaco-editor-test
|
||||||
/src/vscode> npm run monaco-editor-test
|
# or run a test page http://localhost:8080/monaco-editor/test/?editor=src
|
||||||
# or run a test page http://localhost:8080/monaco-editor/test/?editor=src
|
```
|
||||||
```
|
|
||||||
|
> Tip: All folders must be cloned as siblings.
|
||||||
> Tip: All folders must be cloned as siblings.
|
|
||||||
|
> Tip: When running the test pages, use the control panel in the top right corner to switch between running from source, running from npm or running from the local release:
|
||||||
> Tip: When running the test pages, use the control panel in the top right corner to switch between running from source, running from npm or running from the local release:
|
> 
|
||||||
|
|
||||||
|
## Running the website locally
|
||||||
## Running the website locally
|
|
||||||
|
> Note: The website is published automatically when pushing to the `master` branch.
|
||||||
> Note: The website is published automatically when pushing to the `master` branch.
|
|
||||||
|
```bash
|
||||||
```bash
|
# create a local release
|
||||||
# create a local release
|
/src/monaco-editor> npm run release
|
||||||
/src/monaco-editor> npm run release
|
|
||||||
|
# build the website
|
||||||
# build the website
|
/src/monaco-editor> npm run build-website
|
||||||
/src/monaco-editor> npm run build-website
|
|
||||||
|
# start local webserver
|
||||||
# start local webserver
|
/src/monaco-editor> npm run simpleserver
|
||||||
/src/monaco-editor> npm run simpleserver
|
|
||||||
|
# open http://localhost:8080/monaco-editor-website/
|
||||||
# open http://localhost:8080/monaco-editor-website/
|
|
||||||
|
```
|
||||||
```
|
|
||||||
|
## Shipping a new monaco-editor npm module
|
||||||
## Shipping a new monaco-editor npm module
|
|
||||||
|
#### 0.
|
||||||
#### 0.
|
|
||||||
* make sure you have `https://github.com/microsoft/vscode-loc` checked out next to the `vscode` folder.
|
- make sure you have `https://github.com/microsoft/vscode-loc` checked out next to the `vscode` folder.
|
||||||
|
|
||||||
#### 1. Ship a new `monaco-editor-core` npm module
|
#### 1. Ship a new `monaco-editor-core` npm module
|
||||||
* bump version in `/src/vscode/build/monaco/package.json`
|
|
||||||
* **[important]** push all local changes to the remote to get a good public commit id.
|
- bump version in `/src/vscode/build/monaco/package.json`
|
||||||
* generate npm package `/src/vscode> node_modules/.bin/gulp editor-distro`
|
- **[important]** push all local changes to the remote to get a good public commit id.
|
||||||
* publish npm package `/src/vscode/out-monaco-editor-core> npm publish`
|
- generate npm package `/src/vscode> node_modules/.bin/gulp editor-distro`
|
||||||
|
- publish npm package `/src/vscode/out-monaco-editor-core> npm publish`
|
||||||
#### 2. Adopt new `monaco-editor-core` in plugins
|
|
||||||
* if there are breaking API changes that affect the language plugins, adopt the new API in:
|
#### 2. Adopt new `monaco-editor-core` in plugins
|
||||||
* [repo - monaco-typescript](https://github.com/Microsoft/monaco-typescript)
|
|
||||||
* [repo - monaco-languages](https://github.com/Microsoft/monaco-languages)
|
- if there are breaking API changes that affect the language plugins, adopt the new API in:
|
||||||
* [repo - monaco-css](https://github.com/Microsoft/monaco-css)
|
- [repo - monaco-typescript](https://github.com/Microsoft/monaco-typescript)
|
||||||
* [repo - monaco-json](https://github.com/Microsoft/monaco-json)
|
- [repo - monaco-languages](https://github.com/Microsoft/monaco-languages)
|
||||||
* [repo - monaco-html](https://github.com/Microsoft/monaco-html)
|
- [repo - monaco-css](https://github.com/Microsoft/monaco-css)
|
||||||
* publish new versions of those plugins to npm as necessary.
|
- [repo - monaco-json](https://github.com/Microsoft/monaco-json)
|
||||||
|
- [repo - monaco-html](https://github.com/Microsoft/monaco-html)
|
||||||
#### 3. Update package.json
|
- publish new versions of those plugins to npm as necessary.
|
||||||
* edit `/src/monaco-editor/package.json` and update the version (as necessary):
|
|
||||||
* [npm - monaco-editor-core](https://www.npmjs.com/package/monaco-editor-core)
|
#### 3. Update package.json
|
||||||
* [npm - monaco-typescript](https://www.npmjs.com/package/monaco-typescript)
|
|
||||||
* [npm - monaco-languages](https://www.npmjs.com/package/monaco-languages)
|
- edit `/src/monaco-editor/package.json` and update the version (as necessary):
|
||||||
* [npm - monaco-css](https://www.npmjs.com/package/monaco-css)
|
- [npm - monaco-editor-core](https://www.npmjs.com/package/monaco-editor-core)
|
||||||
* [npm - monaco-json](https://www.npmjs.com/package/monaco-json)
|
- [npm - monaco-typescript](https://www.npmjs.com/package/monaco-typescript)
|
||||||
* [npm - monaco-html](https://www.npmjs.com/package/monaco-html)
|
- [npm - monaco-languages](https://www.npmjs.com/package/monaco-languages)
|
||||||
* **[important]** fetch latest deps by running `/src/monaco-editor> npm install .`
|
- [npm - monaco-css](https://www.npmjs.com/package/monaco-css)
|
||||||
|
- [npm - monaco-json](https://www.npmjs.com/package/monaco-json)
|
||||||
#### 4. Generate and try out the local release
|
- [npm - monaco-html](https://www.npmjs.com/package/monaco-html)
|
||||||
|
- **[important]** fetch latest deps by running `/src/monaco-editor> npm install .`
|
||||||
* `/src/monaco-editor> npm run release`
|
|
||||||
* try as many test pages as you think are relevant. e.g.:
|
#### 4. Generate and try out the local release
|
||||||
* open `http://localhost:8080/monaco-editor/test/?editor=releaseDev`
|
|
||||||
* open `http://localhost:8080/monaco-editor/test/?editor=releaseMin`
|
- `/src/monaco-editor> npm run release`
|
||||||
* open `http://localhost:8080/monaco-editor/test/smoketest.html?editor=releaseDev`
|
- try as many test pages as you think are relevant. e.g.:
|
||||||
* open `http://localhost:8080/monaco-editor/test/smoketest.html?editor=releaseMin`
|
- open `http://localhost:8080/monaco-editor/test/?editor=releaseDev`
|
||||||
|
- open `http://localhost:8080/monaco-editor/test/?editor=releaseMin`
|
||||||
#### 5. Update release note.
|
- open `http://localhost:8080/monaco-editor/test/smoketest.html?editor=releaseDev`
|
||||||
* API Change/Breaking Change/New and noteworthy
|
- open `http://localhost:8080/monaco-editor/test/smoketest.html?editor=releaseMin`
|
||||||
* Thank you ([use this tool](https://vscode-tools.azurewebsites.net/))
|
|
||||||
|
#### 5. Update release note.
|
||||||
#### 6. Publish
|
|
||||||
|
- API Change/Breaking Change/New and noteworthy
|
||||||
* `/src/monaco-editor> npm version minor`
|
- Thank you ([use this tool](https://vscode-tools.azurewebsites.net/))
|
||||||
* `/src/monaco-editor> npm run release`
|
|
||||||
* `/src/monaco-editor/release> npm publish`
|
#### 6. Publish
|
||||||
* `/src/monaco-editor> git push --tags`
|
|
||||||
|
- `/src/monaco-editor> npm version minor`
|
||||||
#### 7. Update Website
|
- `/src/monaco-editor> npm run release`
|
||||||
|
- `/src/monaco-editor/release> npm publish`
|
||||||
* `/src/monaco-editor> npm run website`
|
- `/src/monaco-editor> git push --tags`
|
||||||
|
|
||||||
|
#### 7. Update Website
|
||||||
#### 8. Publish new webpack plugin
|
|
||||||
|
- `/src/monaco-editor> npm run website`
|
||||||
* https://github.com/microsoft/monaco-editor-webpack-plugin
|
|
||||||
* update to latest `monaco-editor`
|
#### 8. Publish new webpack plugin
|
||||||
* `npm install .`
|
|
||||||
* `npm run import-editor`
|
- https://github.com/microsoft/monaco-editor-webpack-plugin
|
||||||
* if there are no changes generated after the script:
|
- update to latest `monaco-editor`
|
||||||
* update the peer dependency in `package.json` and use the `||` format e.g. `"monaco-editor": "0.27.x || 0.28.x"`
|
- `npm install .`
|
||||||
* update the version matrix in the README.md and add the new editor version to the plugin's current major version
|
- `npm run import-editor`
|
||||||
* use `npm version minor`
|
- if there are no changes generated after the script:
|
||||||
* publish using `npm publish`
|
- update the peer dependency in `package.json` and use the `||` format e.g. `"monaco-editor": "0.27.x || 0.28.x"`
|
||||||
* if there are any changes generated after the script:
|
- update the version matrix in the README.md and add the new editor version to the plugin's current major version
|
||||||
* update the peer dependency in `package.json` e.g. `"monaco-editor": "0.29.x"`
|
- use `npm version minor`
|
||||||
* update the version matrix in the README.md and add a new row with the new major version
|
- publish using `npm publish`
|
||||||
* use `npm version major`
|
- if there are any changes generated after the script:
|
||||||
* publish using `npm publish`
|
- update the peer dependency in `package.json` e.g. `"monaco-editor": "0.29.x"`
|
||||||
* remember to push tags upstream
|
- update the version matrix in the README.md and add a new row with the new major version
|
||||||
|
- use `npm version major`
|
||||||
|
- publish using `npm publish`
|
||||||
|
- remember to push tags upstream
|
||||||
|
|||||||
@ -1,21 +1,21 @@
|
|||||||
The MIT License (MIT)
|
The MIT License (MIT)
|
||||||
|
|
||||||
Copyright (c) 2016 - present Microsoft Corporation
|
Copyright (c) 2016 - present Microsoft Corporation
|
||||||
|
|
||||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||||
of this software and associated documentation files (the "Software"), to deal
|
of this software and associated documentation files (the "Software"), to deal
|
||||||
in the Software without restriction, including without limitation the rights
|
in the Software without restriction, including without limitation the rights
|
||||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||||
copies of the Software, and to permit persons to whom the Software is
|
copies of the Software, and to permit persons to whom the Software is
|
||||||
furnished to do so, subject to the following conditions:
|
furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
The above copyright notice and this permission notice shall be included in all
|
The above copyright notice and this permission notice shall be included in all
|
||||||
copies or substantial portions of the Software.
|
copies or substantial portions of the Software.
|
||||||
|
|
||||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||||
SOFTWARE.
|
SOFTWARE.
|
||||||
|
|||||||
@ -1,96 +1,97 @@
|
|||||||
# Monaco Editor
|
# Monaco Editor
|
||||||
|
|
||||||
[](https://dev.azure.com/ms/monaco-editor/_build/latest?definitionId=3)
|
[](https://dev.azure.com/ms/monaco-editor/_build/latest?definitionId=3)
|
||||||
|
|
||||||
The Monaco Editor is the code editor which powers [VS Code](https://github.com/Microsoft/vscode), with the features better described [here](https://code.visualstudio.com/docs/editor/editingevolved).
|
The Monaco Editor is the code editor which powers [VS Code](https://github.com/Microsoft/vscode), with the features better described [here](https://code.visualstudio.com/docs/editor/editingevolved).
|
||||||
|
|
||||||
Please note that this repository contains no source code for the code editor, it only contains the scripts to package everything together and ship the `monaco-editor` npm module.
|
Please note that this repository contains no source code for the code editor, it only contains the scripts to package everything together and ship the `monaco-editor` npm module.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## Try it out
|
## Try it out
|
||||||
|
|
||||||
Try the editor out [on our website](https://microsoft.github.io/monaco-editor/index.html).
|
Try the editor out [on our website](https://microsoft.github.io/monaco-editor/index.html).
|
||||||
|
|
||||||
## Installing
|
## Installing
|
||||||
|
|
||||||
```
|
```
|
||||||
$ npm install monaco-editor
|
$ npm install monaco-editor
|
||||||
```
|
```
|
||||||
|
|
||||||
You will get:
|
You will get:
|
||||||
* inside `esm`: ESM version of the editor (compatible with e.g. webpack)
|
|
||||||
* inside `dev`: AMD bundled, not minified
|
- inside `esm`: ESM version of the editor (compatible with e.g. webpack)
|
||||||
* inside `min`: AMD bundled, and minified
|
- inside `dev`: AMD bundled, not minified
|
||||||
* inside `min-maps`: source maps for `min`
|
- inside `min`: AMD bundled, and minified
|
||||||
* `monaco.d.ts`: this specifies the API of the editor (this is what is actually versioned, everything else is considered private and might break with any release).
|
- inside `min-maps`: source maps for `min`
|
||||||
|
- `monaco.d.ts`: this specifies the API of the editor (this is what is actually versioned, everything else is considered private and might break with any release).
|
||||||
It is recommended to develop against the `dev` version, and in production to use the `min` version.
|
|
||||||
|
It is recommended to develop against the `dev` version, and in production to use the `min` version.
|
||||||
## Documentation
|
|
||||||
|
## Documentation
|
||||||
* Learn how to integrate the editor with these [complete samples](https://github.com/Microsoft/monaco-editor-samples/).
|
|
||||||
* [Integrate the AMD version](./monaco-editor/docs/integrate-amd.md).
|
- Learn how to integrate the editor with these [complete samples](https://github.com/Microsoft/monaco-editor-samples/).
|
||||||
* [Integrate the AMD version cross-domain](./monaco-editor/docs/integrate-amd-cross.md)
|
- [Integrate the AMD version](./monaco-editor/docs/integrate-amd.md).
|
||||||
* [Integrate the ESM version](./monaco-editor/docs/integrate-esm.md)
|
- [Integrate the AMD version cross-domain](./monaco-editor/docs/integrate-amd-cross.md)
|
||||||
* Learn how to use the editor API and try out your own customizations in the [playground](https://microsoft.github.io/monaco-editor/playground.html).
|
- [Integrate the ESM version](./monaco-editor/docs/integrate-esm.md)
|
||||||
* Explore the [API docs](https://microsoft.github.io/monaco-editor/api/index.html) or read them straight from [`monaco.d.ts`](https://github.com/Microsoft/monaco-editor/blob/master/website/playground/monaco.d.ts.txt).
|
- Learn how to use the editor API and try out your own customizations in the [playground](https://microsoft.github.io/monaco-editor/playground.html).
|
||||||
* Read [this guide](https://github.com/Microsoft/monaco-editor/wiki/Accessibility-Guide-for-Integrators) to ensure the editor is accessible to all your users!
|
- Explore the [API docs](https://microsoft.github.io/monaco-editor/api/index.html) or read them straight from [`monaco.d.ts`](https://github.com/Microsoft/monaco-editor/blob/master/website/playground/monaco.d.ts.txt).
|
||||||
* Create a Monarch tokenizer for a new programming language [in the Monarch playground](https://microsoft.github.io/monaco-editor/monarch.html).
|
- Read [this guide](https://github.com/Microsoft/monaco-editor/wiki/Accessibility-Guide-for-Integrators) to ensure the editor is accessible to all your users!
|
||||||
* Ask questions on [StackOverflow](https://stackoverflow.com/questions/tagged/monaco-editor)! Search open and closed issues, there are a lot of tips in there!
|
- Create a Monarch tokenizer for a new programming language [in the Monarch playground](https://microsoft.github.io/monaco-editor/monarch.html).
|
||||||
|
- Ask questions on [StackOverflow](https://stackoverflow.com/questions/tagged/monaco-editor)! Search open and closed issues, there are a lot of tips in there!
|
||||||
## Issues
|
|
||||||
|
## Issues
|
||||||
Create [issues](https://github.com/Microsoft/monaco-editor/issues) in this repository for anything related to the Monaco Editor. Always mention **the version** of the editor when creating issues and **the browser** you're having trouble in. Please search for existing issues to avoid duplicates.
|
|
||||||
|
Create [issues](https://github.com/Microsoft/monaco-editor/issues) in this repository for anything related to the Monaco Editor. Always mention **the version** of the editor when creating issues and **the browser** you're having trouble in. Please search for existing issues to avoid duplicates.
|
||||||
## FAQ
|
|
||||||
|
## FAQ
|
||||||
❓ **What is the relationship between VS Code and the Monaco Editor?**
|
|
||||||
|
❓ **What is the relationship between VS Code and the Monaco Editor?**
|
||||||
The Monaco Editor is generated straight from VS Code's sources with some shims around services the code needs to make it run in a web browser outside of its home.
|
|
||||||
|
The Monaco Editor is generated straight from VS Code's sources with some shims around services the code needs to make it run in a web browser outside of its home.
|
||||||
❓ **What is the relationship between VS Code's version and the Monaco Editor's version?**
|
|
||||||
|
❓ **What is the relationship between VS Code's version and the Monaco Editor's version?**
|
||||||
None. The Monaco Editor is a library and it reflects directly the source code.
|
|
||||||
|
None. The Monaco Editor is a library and it reflects directly the source code.
|
||||||
❓ **I've written an extension for VS Code, will it work on the Monaco Editor in a browser?**
|
|
||||||
|
❓ **I've written an extension for VS Code, will it work on the Monaco Editor in a browser?**
|
||||||
No.
|
|
||||||
|
No.
|
||||||
> Note: If the extension is fully based on the [LSP](https://microsoft.github.io/language-server-protocol/) and if the language server is authored in JavaScript, then it would be possible.
|
|
||||||
|
> Note: If the extension is fully based on the [LSP](https://microsoft.github.io/language-server-protocol/) and if the language server is authored in JavaScript, then it would be possible.
|
||||||
❓ **Why all these web workers and why should I care?**
|
|
||||||
|
❓ **Why all these web workers and why should I care?**
|
||||||
Language services create web workers to compute heavy stuff outside of the UI thread. They cost hardly anything in terms of resource overhead and you shouldn't worry too much about them, as long as you get them to work (see above the cross-domain case).
|
|
||||||
|
Language services create web workers to compute heavy stuff outside of the UI thread. They cost hardly anything in terms of resource overhead and you shouldn't worry too much about them, as long as you get them to work (see above the cross-domain case).
|
||||||
❓ **What is this `loader.js`? Can I use `require.js`?**
|
|
||||||
|
❓ **What is this `loader.js`? Can I use `require.js`?**
|
||||||
It is an AMD loader that we use in VS Code. Yes.
|
|
||||||
|
It is an AMD loader that we use in VS Code. Yes.
|
||||||
❓ **I see the warning "Could not create web worker". What should I do?**
|
|
||||||
|
❓ **I see the warning "Could not create web worker". What should I do?**
|
||||||
HTML5 does not allow pages loaded on `file://` to create web workers. Please load the editor with a web server on `http://` or `https://` schemes. Please also see the cross-domain case above.
|
|
||||||
|
HTML5 does not allow pages loaded on `file://` to create web workers. Please load the editor with a web server on `http://` or `https://` schemes. Please also see the cross-domain case above.
|
||||||
❓ **Is the editor supported in mobile browsers or mobile web app frameworks?**
|
|
||||||
|
❓ **Is the editor supported in mobile browsers or mobile web app frameworks?**
|
||||||
No.
|
|
||||||
|
No.
|
||||||
❓ **Why doesn't the editor support TextMate grammars?**
|
|
||||||
|
❓ **Why doesn't the editor support TextMate grammars?**
|
||||||
* Please see https://github.com/bolinfest/monaco-tm which puts together `monaco-editor`, `vscode-oniguruma` and `vscode-textmate` to get TM grammar support in the editor.
|
|
||||||
|
- Please see https://github.com/bolinfest/monaco-tm which puts together `monaco-editor`, `vscode-oniguruma` and `vscode-textmate` to get TM grammar support in the editor.
|
||||||
❓ **What about IE 11 support?**
|
|
||||||
|
❓ **What about IE 11 support?**
|
||||||
* The Monaco Editor no longer supports IE 11. The last version that was tested on IE 11 is `0.18.1`.
|
|
||||||
|
- The Monaco Editor no longer supports IE 11. The last version that was tested on IE 11 is `0.18.1`.
|
||||||
## Development setup
|
|
||||||
|
## Development setup
|
||||||
Please see [CONTRIBUTING](./CONTRIBUTING.md)
|
|
||||||
|
Please see [CONTRIBUTING](./CONTRIBUTING.md)
|
||||||
## Code of Conduct
|
|
||||||
|
## Code of Conduct
|
||||||
This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/). For more information see the [Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct/faq/) or contact [opencode@microsoft.com](mailto:opencode@microsoft.com) with any additional questions or comments.
|
|
||||||
|
This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/). For more information see the [Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct/faq/) or contact [opencode@microsoft.com](mailto:opencode@microsoft.com) with any additional questions or comments.
|
||||||
|
|
||||||
## License
|
## License
|
||||||
Licensed under the [MIT](https://github.com/Microsoft/monaco-editor/blob/master/LICENSE.md) License.
|
|
||||||
|
Licensed under the [MIT](https://github.com/Microsoft/monaco-editor/blob/master/LICENSE.md) License.
|
||||||
|
|||||||
@ -1,2 +0,0 @@
|
|||||||
/out/
|
|
||||||
/release/
|
|
||||||
@ -1,2 +0,0 @@
|
|||||||
/.gitignore
|
|
||||||
/.vscode/
|
|
||||||
@ -1,7 +0,0 @@
|
|||||||
/browser-esm-parcel/.cache/
|
|
||||||
/browser-esm-parcel/dist/
|
|
||||||
/browser-esm-webpack/dist/*.js
|
|
||||||
/browser-esm-webpack-monaco-plugin/dist/*.js
|
|
||||||
/browser-esm-webpack-small/dist/*.js
|
|
||||||
/browser-esm-webpack-typescript/dist/*.js
|
|
||||||
/browser-esm-webpack-typescript-react/dist/*.js
|
|
||||||
@ -1,8 +0,0 @@
|
|||||||
{
|
|
||||||
"arrowParens": "always",
|
|
||||||
"singleQuote": true,
|
|
||||||
"trailingComma": "none",
|
|
||||||
"semi": true,
|
|
||||||
"useTabs": true,
|
|
||||||
"printWidth": 100
|
|
||||||
}
|
|
||||||
@ -1,21 +0,0 @@
|
|||||||
The MIT License (MIT)
|
|
||||||
|
|
||||||
Copyright (c) 2016 Microsoft Corporation
|
|
||||||
|
|
||||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
||||||
of this software and associated documentation files (the "Software"), to deal
|
|
||||||
in the Software without restriction, including without limitation the rights
|
|
||||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
||||||
copies of the Software, and to permit persons to whom the Software is
|
|
||||||
furnished to do so, subject to the following conditions:
|
|
||||||
|
|
||||||
The above copyright notice and this permission notice shall be included in all
|
|
||||||
copies or substantial portions of the Software.
|
|
||||||
|
|
||||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
||||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
||||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
||||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
||||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
||||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
||||||
SOFTWARE.
|
|
||||||
@ -1,41 +0,0 @@
|
|||||||
<!-- BEGIN MICROSOFT SECURITY.MD V0.0.5 BLOCK -->
|
|
||||||
|
|
||||||
## Security
|
|
||||||
|
|
||||||
Microsoft takes the security of our software products and services seriously, which includes all source code repositories managed through our GitHub organizations, which include [Microsoft](https://github.com/Microsoft), [Azure](https://github.com/Azure), [DotNet](https://github.com/dotnet), [AspNet](https://github.com/aspnet), [Xamarin](https://github.com/xamarin), and [our GitHub organizations](https://opensource.microsoft.com/).
|
|
||||||
|
|
||||||
If you believe you have found a security vulnerability in any Microsoft-owned repository that meets [Microsoft's definition of a security vulnerability](<https://docs.microsoft.com/en-us/previous-versions/tn-archive/cc751383(v=technet.10)>), please report it to us as described below.
|
|
||||||
|
|
||||||
## Reporting Security Issues
|
|
||||||
|
|
||||||
**Please do not report security vulnerabilities through public GitHub issues.**
|
|
||||||
|
|
||||||
Instead, please report them to the Microsoft Security Response Center (MSRC) at [https://msrc.microsoft.com/create-report](https://msrc.microsoft.com/create-report).
|
|
||||||
|
|
||||||
If you prefer to submit without logging in, send email to [secure@microsoft.com](mailto:secure@microsoft.com). If possible, encrypt your message with our PGP key; please download it from the [Microsoft Security Response Center PGP Key page](https://www.microsoft.com/en-us/msrc/pgp-key-msrc).
|
|
||||||
|
|
||||||
You should receive a response within 24 hours. If for some reason you do not, please follow up via email to ensure we received your original message. Additional information can be found at [microsoft.com/msrc](https://www.microsoft.com/msrc).
|
|
||||||
|
|
||||||
Please include the requested information listed below (as much as you can provide) to help us better understand the nature and scope of the possible issue:
|
|
||||||
|
|
||||||
- Type of issue (e.g. buffer overflow, SQL injection, cross-site scripting, etc.)
|
|
||||||
- Full paths of source file(s) related to the manifestation of the issue
|
|
||||||
- The location of the affected source code (tag/branch/commit or direct URL)
|
|
||||||
- Any special configuration required to reproduce the issue
|
|
||||||
- Step-by-step instructions to reproduce the issue
|
|
||||||
- Proof-of-concept or exploit code (if possible)
|
|
||||||
- Impact of the issue, including how an attacker might exploit the issue
|
|
||||||
|
|
||||||
This information will help us triage your report more quickly.
|
|
||||||
|
|
||||||
If you are reporting for a bug bounty, more complete reports can contribute to a higher bounty award. Please visit our [Microsoft Bug Bounty Program](https://microsoft.com/msrc/bounty) page for more details about our active programs.
|
|
||||||
|
|
||||||
## Preferred Languages
|
|
||||||
|
|
||||||
We prefer all communications to be in English.
|
|
||||||
|
|
||||||
## Policy
|
|
||||||
|
|
||||||
Microsoft follows the principle of [Coordinated Vulnerability Disclosure](https://www.microsoft.com/en-us/msrc/cvd).
|
|
||||||
|
|
||||||
<!-- END MICROSOFT SECURITY.MD BLOCK -->
|
|
||||||
@ -1,62 +1,63 @@
|
|||||||
{
|
{
|
||||||
perform: true,
|
perform: true,
|
||||||
commands: [
|
commands:
|
||||||
{
|
[
|
||||||
type: 'comment',
|
{
|
||||||
name: 'question',
|
type: 'comment',
|
||||||
allowUsers: [],
|
name: 'question',
|
||||||
action: 'updateLabels',
|
allowUsers: [],
|
||||||
addLabel: '*question'
|
action: 'updateLabels',
|
||||||
},
|
addLabel: '*question'
|
||||||
{
|
},
|
||||||
type: 'label',
|
{
|
||||||
name: '*question',
|
type: 'label',
|
||||||
allowTriggerByBot: true,
|
name: '*question',
|
||||||
action: 'close',
|
allowTriggerByBot: true,
|
||||||
comment: "Please ask your question on [StackOverflow](https://stackoverflow.com/questions/tagged/monaco-editor). We have a great community over [there](https://stackoverflow.com/questions/tagged/monaco-editor). They have already answered hundreds of questions and are happy to answer yours as well. You can also try [searching through existing issues](https://github.com/microsoft/monaco-editor/issues?utf8=%E2%9C%93&q=is%3Aissue+), looking at [API usage samples](https://microsoft.github.io/monaco-editor/playground.html) or at [integration samples](https://github.com/Microsoft/monaco-editor-samples). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
action: 'close',
|
||||||
},
|
comment: "Please ask your question on [StackOverflow](https://stackoverflow.com/questions/tagged/monaco-editor). We have a great community over [there](https://stackoverflow.com/questions/tagged/monaco-editor). They have already answered hundreds of questions and are happy to answer yours as well. You can also try [searching through existing issues](https://github.com/microsoft/monaco-editor/issues?utf8=%E2%9C%93&q=is%3Aissue+), looking at [API usage samples](https://microsoft.github.io/monaco-editor/playground.html) or at [integration samples](https://github.com/Microsoft/monaco-editor-samples). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
||||||
{
|
},
|
||||||
type: 'label',
|
{
|
||||||
name: '*out-of-scope',
|
type: 'label',
|
||||||
allowTriggerByBot: true,
|
name: '*out-of-scope',
|
||||||
action: 'close',
|
allowTriggerByBot: true,
|
||||||
comment: "We closed this issue because we don't plan to address it in the foreseeable future. You can find more detailed information about our decision-making process [here](https://aka.ms/vscode-out-of-scope). If you disagree and feel that this issue is crucial: We are happy to listen and to reconsider.\n\nIf you wonder what we are up to, please see our [roadmap](https://aka.ms/vscoderoadmap) and [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nThanks for your understanding and happy coding!"
|
action: 'close',
|
||||||
},
|
comment: "We closed this issue because we don't plan to address it in the foreseeable future. You can find more detailed information about our decision-making process [here](https://aka.ms/vscode-out-of-scope). If you disagree and feel that this issue is crucial: We are happy to listen and to reconsider.\n\nIf you wonder what we are up to, please see our [roadmap](https://aka.ms/vscoderoadmap) and [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nThanks for your understanding and happy coding!"
|
||||||
{
|
},
|
||||||
type: 'label',
|
{
|
||||||
name: '*as-designed',
|
type: 'label',
|
||||||
allowTriggerByBot: true,
|
name: '*as-designed',
|
||||||
action: 'close',
|
allowTriggerByBot: true,
|
||||||
comment: "The described behavior is how it is expected to work. If you disagree, please explain what is expected and what is not in more detail. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
action: 'close',
|
||||||
},
|
comment: "The described behavior is how it is expected to work. If you disagree, please explain what is expected and what is not in more detail. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
||||||
{
|
},
|
||||||
type: 'label',
|
{
|
||||||
name: '*english-please',
|
type: 'label',
|
||||||
allowTriggerByBot: true,
|
name: '*english-please',
|
||||||
action: 'close',
|
allowTriggerByBot: true,
|
||||||
comment: "This issue is being closed because its description is not in English, that makes it hard for us to work on it. Please open a new issue with an English description. You might find [Bing Translator](https://www.bing.com/translator) useful."
|
action: 'close',
|
||||||
},
|
comment: 'This issue is being closed because its description is not in English, that makes it hard for us to work on it. Please open a new issue with an English description. You might find [Bing Translator](https://www.bing.com/translator) useful.'
|
||||||
{
|
},
|
||||||
type: 'comment',
|
{
|
||||||
name: 'duplicate',
|
type: 'comment',
|
||||||
allowUsers: [],
|
name: 'duplicate',
|
||||||
action: 'updateLabels',
|
allowUsers: [],
|
||||||
addLabel: '*duplicate'
|
action: 'updateLabels',
|
||||||
},
|
addLabel: '*duplicate'
|
||||||
{
|
},
|
||||||
type: 'label',
|
{
|
||||||
name: '*duplicate',
|
type: 'label',
|
||||||
allowTriggerByBot: true,
|
name: '*duplicate',
|
||||||
action: 'close',
|
allowTriggerByBot: true,
|
||||||
comment: "Thanks for creating this issue! We figured it's covering the same as another one we already have. Thus, we closed this one as a duplicate. You can search for existing issues [here](https://github.com/Microsoft/monaco-editor/issues). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
action: 'close',
|
||||||
},
|
comment: "Thanks for creating this issue! We figured it's covering the same as another one we already have. Thus, we closed this one as a duplicate. You can search for existing issues [here](https://github.com/Microsoft/monaco-editor/issues). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
||||||
{
|
},
|
||||||
type: 'comment',
|
{
|
||||||
name: 'needsMoreInfo',
|
type: 'comment',
|
||||||
allowUsers: [],
|
name: 'needsMoreInfo',
|
||||||
action: 'updateLabels',
|
allowUsers: [],
|
||||||
addLabel: 'needs more info',
|
action: 'updateLabels',
|
||||||
comment: "Thanks for creating this issue! We figured it's missing some basic information or in some other way doesn't follow our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines. Please take the time to review these and update the issue.\n\nHappy Coding!"
|
addLabel: 'needs more info',
|
||||||
},
|
comment: "Thanks for creating this issue! We figured it's missing some basic information or in some other way doesn't follow our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines. Please take the time to review these and update the issue.\n\nHappy Coding!"
|
||||||
]
|
}
|
||||||
}
|
]
|
||||||
|
}
|
||||||
|
|||||||
@ -1,6 +1 @@
|
|||||||
{
|
{ daysAfterClose: 45, daysSinceLastUpdate: 3, ignoredLabels: ['*out-of-scope'], perform: true }
|
||||||
daysAfterClose: 45,
|
|
||||||
daysSinceLastUpdate: 3,
|
|
||||||
ignoredLabels: ['*out-of-scope'],
|
|
||||||
perform: true
|
|
||||||
}
|
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
daysUntilClose: 7,
|
daysUntilClose: 7,
|
||||||
needsMoreInfoLabel: 'needs more info',
|
needsMoreInfoLabel: 'needs more info',
|
||||||
perform: true,
|
perform: true,
|
||||||
closeComment: "This issue has been closed automatically because it needs more information and has not had recent activity. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
closeComment: "This issue has been closed automatically because it needs more information and has not had recent activity. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,19 +1,16 @@
|
|||||||
{
|
{
|
||||||
// Use IntelliSense to learn about possible attributes.
|
// Use IntelliSense to learn about possible attributes.
|
||||||
// Hover to view descriptions of existing attributes.
|
// Hover to view descriptions of existing attributes.
|
||||||
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
|
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
|
||||||
"version": "0.2.0",
|
"version": "0.2.0",
|
||||||
"configurations": [
|
"configurations": [
|
||||||
{
|
{
|
||||||
"type": "node",
|
"type": "node",
|
||||||
"request": "launch",
|
"request": "launch",
|
||||||
"cwd": "${workspaceFolder}/test/",
|
"cwd": "${workspaceFolder}/test/",
|
||||||
"name": "Launch Program",
|
"name": "Launch Program",
|
||||||
"program": "${workspaceFolder}/node_modules/.bin/webpack",
|
"program": "${workspaceFolder}/node_modules/.bin/webpack",
|
||||||
"args": [
|
"args": ["--config", "webpack.config.js"]
|
||||||
"--config",
|
}
|
||||||
"webpack.config.js"
|
]
|
||||||
],
|
}
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"files.trimTrailingWhitespace": true,
|
"files.trimTrailingWhitespace": true,
|
||||||
"files.insertFinalNewline": true,
|
"files.insertFinalNewline": true,
|
||||||
"editor.tabSize": 2,
|
"editor.tabSize": 2,
|
||||||
"editor.insertSpaces": true
|
"editor.insertSpaces": true
|
||||||
}
|
}
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
@ -1,47 +1,47 @@
|
|||||||
{
|
{
|
||||||
"name": "monaco-editor-webpack-plugin",
|
"name": "monaco-editor-webpack-plugin",
|
||||||
"version": "6.0.0",
|
"version": "6.0.0",
|
||||||
"description": "A webpack plugin for the Monaco Editor",
|
"description": "A webpack plugin for the Monaco Editor",
|
||||||
"main": "out/index.js",
|
"main": "out/index.js",
|
||||||
"typings": "./out/index.d.ts",
|
"typings": "./out/index.d.ts",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"test": "node ./node_modules/webpack/bin/webpack.js --config test/webpack.config.js --progress",
|
"test": "node ./node_modules/webpack/bin/webpack.js --config test/webpack.config.js --progress",
|
||||||
"test-cross-origin": "node ./node_modules/webpack/bin/webpack.js --config test/webpack-cross-origin.config.js --progress",
|
"test-cross-origin": "node ./node_modules/webpack/bin/webpack.js --config test/webpack-cross-origin.config.js --progress",
|
||||||
"watch": "tsc -w -p tsconfig.json",
|
"watch": "tsc -w -p tsconfig.json",
|
||||||
"import-editor": "node ./scripts/import-editor.js",
|
"import-editor": "node ./scripts/import-editor.js",
|
||||||
"prepublishOnly": "tsc -p tsconfig.json"
|
"prepublishOnly": "tsc -p tsconfig.json"
|
||||||
},
|
},
|
||||||
"repository": {
|
"repository": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
"url": "git+https://github.com/microsoft/monaco-editor-webpack-plugin.git"
|
"url": "git+https://github.com/microsoft/monaco-editor-webpack-plugin.git"
|
||||||
},
|
},
|
||||||
"keywords": [
|
"keywords": [
|
||||||
"webpack",
|
"webpack",
|
||||||
"monaco",
|
"monaco",
|
||||||
"editor",
|
"editor",
|
||||||
"loader"
|
"loader"
|
||||||
],
|
],
|
||||||
"author": "Microsoft Corporation",
|
"author": "Microsoft Corporation",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"bugs": {
|
"bugs": {
|
||||||
"url": "https://github.com/microsoft/monaco-editor-webpack-plugin/issues"
|
"url": "https://github.com/microsoft/monaco-editor-webpack-plugin/issues"
|
||||||
},
|
},
|
||||||
"homepage": "https://github.com/microsoft/monaco-editor-webpack-plugin#readme",
|
"homepage": "https://github.com/microsoft/monaco-editor-webpack-plugin#readme",
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"webpack": "^4.5.0 || 5.x",
|
"webpack": "^4.5.0 || 5.x",
|
||||||
"monaco-editor": "0.30.x"
|
"monaco-editor": "0.30.x"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"css-loader": "^5.1.1",
|
"css-loader": "^5.1.1",
|
||||||
"file-loader": "^6.2.0",
|
"file-loader": "^6.2.0",
|
||||||
"glob": "^7.1.6",
|
"glob": "^7.1.6",
|
||||||
"monaco-editor": "^0.30.0",
|
"monaco-editor": "^0.30.0",
|
||||||
"style-loader": "^2.0.0",
|
"style-loader": "^2.0.0",
|
||||||
"typescript": "^4.2.3",
|
"typescript": "^4.2.3",
|
||||||
"webpack": "^5.24.3",
|
"webpack": "^5.24.3",
|
||||||
"webpack-cli": "^4.5.0"
|
"webpack-cli": "^4.5.0"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"loader-utils": "^2.0.0"
|
"loader-utils": "^2.0.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,271 +1,291 @@
|
|||||||
/*---------------------------------------------------------------------------------------------
|
/*---------------------------------------------------------------------------------------------
|
||||||
* Copyright (c) Microsoft Corporation. All rights reserved.
|
* Copyright (c) Microsoft Corporation. All rights reserved.
|
||||||
* Licensed under the MIT License. See LICENSE in the project root for license information.
|
* Licensed under the MIT License. See LICENSE in the project root for license information.
|
||||||
*--------------------------------------------------------------------------------------------*/
|
*--------------------------------------------------------------------------------------------*/
|
||||||
|
|
||||||
const glob = require('glob');
|
const glob = require('glob');
|
||||||
const path = require('path');
|
const path = require('path');
|
||||||
const fs = require('fs');
|
const fs = require('fs');
|
||||||
|
|
||||||
const customFeatureLabels = {
|
const customFeatureLabels = {
|
||||||
'vs/editor/browser/controller/coreCommands': 'coreCommands',
|
'vs/editor/browser/controller/coreCommands': 'coreCommands',
|
||||||
'vs/editor/contrib/caretOperations/caretOperations': 'caretOperations',
|
'vs/editor/contrib/caretOperations/caretOperations': 'caretOperations',
|
||||||
'vs/editor/contrib/caretOperations/transpose': 'transpose',
|
'vs/editor/contrib/caretOperations/transpose': 'transpose',
|
||||||
'vs/editor/contrib/colorPicker/colorDetector': 'colorDetector',
|
'vs/editor/contrib/colorPicker/colorDetector': 'colorDetector',
|
||||||
'vs/editor/contrib/rename/onTypeRename': 'onTypeRename',
|
'vs/editor/contrib/rename/onTypeRename': 'onTypeRename',
|
||||||
'vs/editor/contrib/gotoSymbol/link/goToDefinitionAtPosition': 'gotoSymbol',
|
'vs/editor/contrib/gotoSymbol/link/goToDefinitionAtPosition': 'gotoSymbol',
|
||||||
'vs/editor/contrib/snippet/snippetController2': 'snippets',
|
'vs/editor/contrib/snippet/snippetController2': 'snippets',
|
||||||
'vs/editor/standalone/browser/quickAccess/standaloneGotoLineQuickAccess': 'gotoLine',
|
'vs/editor/standalone/browser/quickAccess/standaloneGotoLineQuickAccess': 'gotoLine',
|
||||||
'vs/editor/standalone/browser/quickAccess/standaloneCommandsQuickAccess': 'quickCommand',
|
'vs/editor/standalone/browser/quickAccess/standaloneCommandsQuickAccess': 'quickCommand',
|
||||||
'vs/editor/standalone/browser/quickAccess/standaloneGotoSymbolQuickAccess': 'quickOutline',
|
'vs/editor/standalone/browser/quickAccess/standaloneGotoSymbolQuickAccess': 'quickOutline',
|
||||||
'vs/editor/standalone/browser/quickAccess/standaloneHelpQuickAccess': 'quickHelp',
|
'vs/editor/standalone/browser/quickAccess/standaloneHelpQuickAccess': 'quickHelp'
|
||||||
};
|
};
|
||||||
|
|
||||||
generateLanguages();
|
generateLanguages();
|
||||||
generateFeatures();
|
generateFeatures();
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @returns { Promise<{ label: string; entry: string; }[]> }
|
* @returns { Promise<{ label: string; entry: string; }[]> }
|
||||||
*/
|
*/
|
||||||
function getBasicLanguages() {
|
function getBasicLanguages() {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
glob('./node_modules/monaco-editor/esm/vs/basic-languages/*/*.contribution.js', { cwd: path.dirname(__dirname) }, (err, files) => {
|
glob(
|
||||||
if (err) {
|
'./node_modules/monaco-editor/esm/vs/basic-languages/*/*.contribution.js',
|
||||||
reject(err);
|
{ cwd: path.dirname(__dirname) },
|
||||||
return;
|
(err, files) => {
|
||||||
}
|
if (err) {
|
||||||
|
reject(err);
|
||||||
resolve(files.map((file) => {
|
return;
|
||||||
const entry = file.substring('./node_modules/monaco-editor/esm/'.length).replace(/\.js$/, '');
|
}
|
||||||
const label = path.basename(file).replace(/\.contribution\.js$/, '');
|
|
||||||
return {
|
resolve(
|
||||||
label: label,
|
files.map((file) => {
|
||||||
entry: entry
|
const entry = file
|
||||||
};
|
.substring('./node_modules/monaco-editor/esm/'.length)
|
||||||
}));
|
.replace(/\.js$/, '');
|
||||||
});
|
const label = path.basename(file).replace(/\.contribution\.js$/, '');
|
||||||
});
|
return {
|
||||||
}
|
label: label,
|
||||||
|
entry: entry
|
||||||
/**
|
};
|
||||||
* @returns { Promise<string[]> }
|
})
|
||||||
*/
|
);
|
||||||
function readAdvancedLanguages() {
|
}
|
||||||
return new Promise((resolve, reject) => {
|
);
|
||||||
glob('./node_modules/monaco-editor/esm/vs/language/*/monaco.contribution.js', { cwd: path.dirname(__dirname) }, (err, files) => {
|
});
|
||||||
if (err) {
|
}
|
||||||
reject(err);
|
|
||||||
return;
|
/**
|
||||||
}
|
* @returns { Promise<string[]> }
|
||||||
|
*/
|
||||||
resolve(
|
function readAdvancedLanguages() {
|
||||||
files
|
return new Promise((resolve, reject) => {
|
||||||
.map(file => file.substring('./node_modules/monaco-editor/esm/vs/language/'.length))
|
glob(
|
||||||
.map(file => file.substring(0, file.length - '/monaco.contribution.js'.length))
|
'./node_modules/monaco-editor/esm/vs/language/*/monaco.contribution.js',
|
||||||
);
|
{ cwd: path.dirname(__dirname) },
|
||||||
});
|
(err, files) => {
|
||||||
});
|
if (err) {
|
||||||
}
|
reject(err);
|
||||||
|
return;
|
||||||
/**
|
}
|
||||||
* @returns { Promise<{ label: string; entry: string; worker: { id: string; entry: string; }; }[]> }
|
|
||||||
*/
|
resolve(
|
||||||
function getAdvancedLanguages() {
|
files
|
||||||
return readAdvancedLanguages().then((languages) => {
|
.map((file) => file.substring('./node_modules/monaco-editor/esm/vs/language/'.length))
|
||||||
let result = [];
|
.map((file) => file.substring(0, file.length - '/monaco.contribution.js'.length))
|
||||||
for (const lang of languages) {
|
);
|
||||||
let shortLang = (lang === 'typescript' ? 'ts' : lang);
|
}
|
||||||
const entry = `vs/language/${lang}/monaco.contribution`;
|
);
|
||||||
checkFileExists(entry);
|
});
|
||||||
const workerId = `vs/language/${lang}/${shortLang}Worker`;
|
}
|
||||||
checkFileExists(workerId);
|
|
||||||
const workerEntry = `vs/language/${lang}/${shortLang}.worker`;
|
/**
|
||||||
checkFileExists(workerEntry);
|
* @returns { Promise<{ label: string; entry: string; worker: { id: string; entry: string; }; }[]> }
|
||||||
result.push({
|
*/
|
||||||
label: lang,
|
function getAdvancedLanguages() {
|
||||||
entry: entry,
|
return readAdvancedLanguages().then((languages) => {
|
||||||
worker: {
|
let result = [];
|
||||||
id: workerId,
|
for (const lang of languages) {
|
||||||
entry: workerEntry
|
let shortLang = lang === 'typescript' ? 'ts' : lang;
|
||||||
}
|
const entry = `vs/language/${lang}/monaco.contribution`;
|
||||||
});
|
checkFileExists(entry);
|
||||||
}
|
const workerId = `vs/language/${lang}/${shortLang}Worker`;
|
||||||
return result;
|
checkFileExists(workerId);
|
||||||
});
|
const workerEntry = `vs/language/${lang}/${shortLang}.worker`;
|
||||||
|
checkFileExists(workerEntry);
|
||||||
function checkFileExists(moduleName) {
|
result.push({
|
||||||
const filePath = path.join(__dirname, '..', 'node_modules/monaco-editor/esm', `${moduleName}.js`);
|
label: lang,
|
||||||
if (!fs.existsSync(filePath)) {
|
entry: entry,
|
||||||
console.error(`Could not find ${filePath}.`);
|
worker: {
|
||||||
process.exit(1);
|
id: workerId,
|
||||||
}
|
entry: workerEntry
|
||||||
}
|
}
|
||||||
}
|
});
|
||||||
|
}
|
||||||
function generateLanguages() {
|
return result;
|
||||||
return Promise.all([getBasicLanguages(), getAdvancedLanguages()]).then(([basicLanguages, advancedLanguages]) => {
|
});
|
||||||
basicLanguages.sort(strcmp);
|
|
||||||
advancedLanguages.sort(strcmp);
|
function checkFileExists(moduleName) {
|
||||||
|
const filePath = path.join(
|
||||||
let i = 0, len = basicLanguages.length;
|
__dirname,
|
||||||
let j = 0, lenJ = advancedLanguages.length;
|
'..',
|
||||||
let result = [];
|
'node_modules/monaco-editor/esm',
|
||||||
while (i < len || j < lenJ) {
|
`${moduleName}.js`
|
||||||
if (i < len && j < lenJ) {
|
);
|
||||||
if (basicLanguages[i].label === advancedLanguages[j].label) {
|
if (!fs.existsSync(filePath)) {
|
||||||
let entry = [];
|
console.error(`Could not find ${filePath}.`);
|
||||||
entry.push(basicLanguages[i].entry);
|
process.exit(1);
|
||||||
entry.push(advancedLanguages[j].entry);
|
}
|
||||||
result.push({
|
}
|
||||||
label: basicLanguages[i].label,
|
}
|
||||||
entry: entry,
|
|
||||||
worker: advancedLanguages[j].worker
|
function generateLanguages() {
|
||||||
});
|
return Promise.all([getBasicLanguages(), getAdvancedLanguages()]).then(
|
||||||
i++;
|
([basicLanguages, advancedLanguages]) => {
|
||||||
j++;
|
basicLanguages.sort(strcmp);
|
||||||
} else if (basicLanguages[i].label < advancedLanguages[j].label) {
|
advancedLanguages.sort(strcmp);
|
||||||
result.push(basicLanguages[i]);
|
|
||||||
i++;
|
let i = 0,
|
||||||
} else {
|
len = basicLanguages.length;
|
||||||
result.push(advancedLanguages[j]);
|
let j = 0,
|
||||||
j++;
|
lenJ = advancedLanguages.length;
|
||||||
}
|
let result = [];
|
||||||
} else if (i < len) {
|
while (i < len || j < lenJ) {
|
||||||
result.push(basicLanguages[i]);
|
if (i < len && j < lenJ) {
|
||||||
i++;
|
if (basicLanguages[i].label === advancedLanguages[j].label) {
|
||||||
} else {
|
let entry = [];
|
||||||
result.push(advancedLanguages[j]);
|
entry.push(basicLanguages[i].entry);
|
||||||
j++;
|
entry.push(advancedLanguages[j].entry);
|
||||||
}
|
result.push({
|
||||||
}
|
label: basicLanguages[i].label,
|
||||||
|
entry: entry,
|
||||||
const code = `//
|
worker: advancedLanguages[j].worker
|
||||||
// THIS IS A GENERATED FILE. PLEASE DO NOT EDIT DIRECTLY.
|
});
|
||||||
// GENERATED USING node scripts/import-editor.js
|
i++;
|
||||||
//
|
j++;
|
||||||
import { IFeatureDefinition } from "./types";
|
} else if (basicLanguages[i].label < advancedLanguages[j].label) {
|
||||||
|
result.push(basicLanguages[i]);
|
||||||
export const languagesArr: IFeatureDefinition[] = ${
|
i++;
|
||||||
JSON.stringify(result, null, ' ')
|
} else {
|
||||||
.replace(/"label":/g, 'label:')
|
result.push(advancedLanguages[j]);
|
||||||
.replace(/"entry":/g, 'entry:')
|
j++;
|
||||||
.replace(/"worker":/g, 'worker:')
|
}
|
||||||
.replace(/"id":/g, 'id:')
|
} else if (i < len) {
|
||||||
.replace(/"/g, '\'')
|
result.push(basicLanguages[i]);
|
||||||
};
|
i++;
|
||||||
|
} else {
|
||||||
export type EditorLanguage = ${
|
result.push(advancedLanguages[j]);
|
||||||
result.map(el => `'${el.label}'`).join(' | ')
|
j++;
|
||||||
};
|
}
|
||||||
|
}
|
||||||
`
|
|
||||||
fs.writeFileSync(path.join(__dirname, '../src/languages.ts'), code.replace(/\r\n/g, '\n'));
|
const code = `//
|
||||||
|
// THIS IS A GENERATED FILE. PLEASE DO NOT EDIT DIRECTLY.
|
||||||
const readmeLanguages = (
|
// GENERATED USING node scripts/import-editor.js
|
||||||
JSON.stringify(result.map(r => r.label))
|
//
|
||||||
.replace(/"/g, '\'')
|
import { IFeatureDefinition } from "./types";
|
||||||
.replace(/','/g, '\', \'')
|
|
||||||
);
|
export const languagesArr: IFeatureDefinition[] = ${JSON.stringify(result, null, ' ')
|
||||||
let readme = fs.readFileSync(path.join(__dirname, '../README.md')).toString();
|
.replace(/"label":/g, 'label:')
|
||||||
readme = readme.replace(/<!-- LANGUAGES_BEGIN -->([^<]+)<!-- LANGUAGES_END -->/, `<!-- LANGUAGES_BEGIN -->\`${readmeLanguages}\`<!-- LANGUAGES_END -->`);
|
.replace(/"entry":/g, 'entry:')
|
||||||
fs.writeFileSync(path.join(__dirname, '../README.md'), readme);
|
.replace(/"worker":/g, 'worker:')
|
||||||
});
|
.replace(/"id":/g, 'id:')
|
||||||
}
|
.replace(/"/g, "'")};
|
||||||
|
|
||||||
function strcmp(a, b) {
|
export type EditorLanguage = ${result.map((el) => `'${el.label}'`).join(' | ')};
|
||||||
if (a < b) {
|
|
||||||
return -1;
|
`;
|
||||||
}
|
fs.writeFileSync(path.join(__dirname, '../src/languages.ts'), code.replace(/\r\n/g, '\n'));
|
||||||
if (a > b) {
|
|
||||||
return 1;
|
const readmeLanguages = JSON.stringify(result.map((r) => r.label))
|
||||||
}
|
.replace(/"/g, "'")
|
||||||
return 0;
|
.replace(/','/g, "', '");
|
||||||
}
|
let readme = fs.readFileSync(path.join(__dirname, '../README.md')).toString();
|
||||||
|
readme = readme.replace(
|
||||||
/**
|
/<!-- LANGUAGES_BEGIN -->([^<]+)<!-- LANGUAGES_END -->/,
|
||||||
* @returns { string[] }
|
`<!-- LANGUAGES_BEGIN -->\`${readmeLanguages}\`<!-- LANGUAGES_END -->`
|
||||||
*/
|
);
|
||||||
function generateFeatures() {
|
fs.writeFileSync(path.join(__dirname, '../README.md'), readme);
|
||||||
const skipImports = [
|
}
|
||||||
'vs/editor/browser/widget/codeEditorWidget',
|
);
|
||||||
'vs/editor/browser/widget/diffEditorWidget',
|
}
|
||||||
'vs/editor/browser/widget/diffNavigator',
|
|
||||||
'vs/editor/common/standaloneStrings',
|
function strcmp(a, b) {
|
||||||
'vs/editor/contrib/tokenization/tokenization',
|
if (a < b) {
|
||||||
'vs/editor/editor.all',
|
return -1;
|
||||||
'vs/base/browser/ui/codicons/codiconStyles',
|
}
|
||||||
'vs/editor/contrib/gotoSymbol/documentSymbols',
|
if (a > b) {
|
||||||
];
|
return 1;
|
||||||
|
}
|
||||||
let features = [];
|
return 0;
|
||||||
const files = (
|
}
|
||||||
fs.readFileSync(path.join(__dirname, '../node_modules/monaco-editor/esm/vs/editor/edcore.main.js')).toString()
|
|
||||||
+ fs.readFileSync(path.join(__dirname, '../node_modules/monaco-editor/esm/vs/editor/editor.all.js')).toString()
|
/**
|
||||||
);
|
* @returns { string[] }
|
||||||
files.split(/\r\n|\n/).forEach(line => {
|
*/
|
||||||
const m = line.match(/import '([^']+)'/);
|
function generateFeatures() {
|
||||||
if (m) {
|
const skipImports = [
|
||||||
const tmp = path.posix.join('vs/editor', m[1]).replace(/\.js$/, '');
|
'vs/editor/browser/widget/codeEditorWidget',
|
||||||
if (skipImports.indexOf(tmp) === -1) {
|
'vs/editor/browser/widget/diffEditorWidget',
|
||||||
features.push(tmp);
|
'vs/editor/browser/widget/diffNavigator',
|
||||||
}
|
'vs/editor/common/standaloneStrings',
|
||||||
}
|
'vs/editor/contrib/tokenization/tokenization',
|
||||||
});
|
'vs/editor/editor.all',
|
||||||
|
'vs/base/browser/ui/codicons/codiconStyles',
|
||||||
let result = features.map((feature) => {
|
'vs/editor/contrib/gotoSymbol/documentSymbols'
|
||||||
return {
|
];
|
||||||
label: customFeatureLabels[feature] || path.basename(path.dirname(feature)),
|
|
||||||
entry: feature
|
let features = [];
|
||||||
};
|
const files =
|
||||||
});
|
fs
|
||||||
|
.readFileSync(
|
||||||
result.sort((a, b) => {
|
path.join(__dirname, '../node_modules/monaco-editor/esm/vs/editor/edcore.main.js')
|
||||||
const labelCmp = strcmp(a.label, b.label);
|
)
|
||||||
if (labelCmp === 0) {
|
.toString() +
|
||||||
return strcmp(a.entry, b.entry);
|
fs
|
||||||
}
|
.readFileSync(
|
||||||
return labelCmp;
|
path.join(__dirname, '../node_modules/monaco-editor/esm/vs/editor/editor.all.js')
|
||||||
});
|
)
|
||||||
|
.toString();
|
||||||
for (let i = 0; i < result.length; i++) {
|
files.split(/\r\n|\n/).forEach((line) => {
|
||||||
if (i + 1 < result.length && result[i].label === result[i + 1].label) {
|
const m = line.match(/import '([^']+)'/);
|
||||||
if (typeof result[i].entry === 'string') {
|
if (m) {
|
||||||
result[i].entry = [result[i].entry];
|
const tmp = path.posix.join('vs/editor', m[1]).replace(/\.js$/, '');
|
||||||
}
|
if (skipImports.indexOf(tmp) === -1) {
|
||||||
result[i].entry.push(result[i + 1].entry);
|
features.push(tmp);
|
||||||
result.splice(i + 1, 1);
|
}
|
||||||
}
|
}
|
||||||
}
|
});
|
||||||
|
|
||||||
const code = `//
|
let result = features.map((feature) => {
|
||||||
// THIS IS A GENERATED FILE. PLEASE DO NOT EDIT DIRECTLY.
|
return {
|
||||||
// GENERATED USING node scripts/import-editor.js
|
label: customFeatureLabels[feature] || path.basename(path.dirname(feature)),
|
||||||
//
|
entry: feature
|
||||||
import { IFeatureDefinition } from "./types";
|
};
|
||||||
|
});
|
||||||
export const featuresArr: IFeatureDefinition[] = ${
|
|
||||||
JSON.stringify(result, null, ' ')
|
result.sort((a, b) => {
|
||||||
.replace(/"label":/g, 'label:')
|
const labelCmp = strcmp(a.label, b.label);
|
||||||
.replace(/"entry":/g, 'entry:')
|
if (labelCmp === 0) {
|
||||||
.replace(/"/g, '\'')
|
return strcmp(a.entry, b.entry);
|
||||||
};
|
}
|
||||||
|
return labelCmp;
|
||||||
export type EditorFeature = ${
|
});
|
||||||
result.map(el => `'${el.label}'`).join(' | ')
|
|
||||||
};
|
for (let i = 0; i < result.length; i++) {
|
||||||
|
if (i + 1 < result.length && result[i].label === result[i + 1].label) {
|
||||||
export type NegatedEditorFeature = ${
|
if (typeof result[i].entry === 'string') {
|
||||||
result.map(el => `'!${el.label}'`).join(' | ')
|
result[i].entry = [result[i].entry];
|
||||||
};
|
}
|
||||||
`
|
result[i].entry.push(result[i + 1].entry);
|
||||||
fs.writeFileSync(path.join(__dirname, '../src/features.ts'), code.replace(/\r\n/g, '\n'));
|
result.splice(i + 1, 1);
|
||||||
|
}
|
||||||
const readmeFeatures = (
|
}
|
||||||
JSON.stringify(result.map(r => r.label))
|
|
||||||
.replace(/"/g, '\'')
|
const code = `//
|
||||||
.replace(/','/g, '\', \'')
|
// THIS IS A GENERATED FILE. PLEASE DO NOT EDIT DIRECTLY.
|
||||||
);
|
// GENERATED USING node scripts/import-editor.js
|
||||||
let readme = fs.readFileSync(path.join(__dirname, '../README.md')).toString();
|
//
|
||||||
readme = readme.replace(/<!-- FEATURES_BEGIN -->([^<]+)<!-- FEATURES_END -->/, `<!-- FEATURES_BEGIN -->\`${readmeFeatures}\`<!-- FEATURES_END -->`);
|
import { IFeatureDefinition } from "./types";
|
||||||
fs.writeFileSync(path.join(__dirname, '../README.md'), readme);
|
|
||||||
}
|
export const featuresArr: IFeatureDefinition[] = ${JSON.stringify(result, null, ' ')
|
||||||
|
.replace(/"label":/g, 'label:')
|
||||||
|
.replace(/"entry":/g, 'entry:')
|
||||||
|
.replace(/"/g, "'")};
|
||||||
|
|
||||||
|
export type EditorFeature = ${result.map((el) => `'${el.label}'`).join(' | ')};
|
||||||
|
|
||||||
|
export type NegatedEditorFeature = ${result.map((el) => `'!${el.label}'`).join(' | ')};
|
||||||
|
`;
|
||||||
|
fs.writeFileSync(path.join(__dirname, '../src/features.ts'), code.replace(/\r\n/g, '\n'));
|
||||||
|
|
||||||
|
const readmeFeatures = JSON.stringify(result.map((r) => r.label))
|
||||||
|
.replace(/"/g, "'")
|
||||||
|
.replace(/','/g, "', '");
|
||||||
|
let readme = fs.readFileSync(path.join(__dirname, '../README.md')).toString();
|
||||||
|
readme = readme.replace(
|
||||||
|
/<!-- FEATURES_BEGIN -->([^<]+)<!-- FEATURES_END -->/,
|
||||||
|
`<!-- FEATURES_BEGIN -->\`${readmeFeatures}\`<!-- FEATURES_END -->`
|
||||||
|
);
|
||||||
|
fs.writeFileSync(path.join(__dirname, '../README.md'), readme);
|
||||||
|
}
|
||||||
|
|||||||
@ -1,4 +1,3 @@
|
|||||||
|
declare module 'loader-utils' {
|
||||||
declare module 'loader-utils' {
|
export function interpolateName(loaderContext: any, name: string, options?: any): string;
|
||||||
export function interpolateName(loaderContext: any, name: string, options?: any): string;
|
}
|
||||||
}
|
|
||||||
|
|||||||
@ -1,22 +1,21 @@
|
|||||||
const loaderUtils = require('loader-utils');
|
const loaderUtils = require('loader-utils');
|
||||||
|
|
||||||
export function pitch(this: any, remainingRequest: any) {
|
export function pitch(this: any, remainingRequest: any) {
|
||||||
const { globals = undefined, pre = [], post = [] } = loaderUtils.getOptions(this) || {};
|
const { globals = undefined, pre = [], post = [] } = loaderUtils.getOptions(this) || {};
|
||||||
|
|
||||||
// HACK: NamedModulesPlugin overwrites existing modules when requesting the same module via
|
// HACK: NamedModulesPlugin overwrites existing modules when requesting the same module via
|
||||||
// different loaders, so we need to circumvent this by appending a suffix to make the name unique
|
// different loaders, so we need to circumvent this by appending a suffix to make the name unique
|
||||||
// See https://github.com/webpack/webpack/issues/4613#issuecomment-325178346 for details
|
// See https://github.com/webpack/webpack/issues/4613#issuecomment-325178346 for details
|
||||||
if (this._module && this._module.userRequest) {
|
if (this._module && this._module.userRequest) {
|
||||||
this._module.userRequest = `include-loader!${this._module.userRequest}`;
|
this._module.userRequest = `include-loader!${this._module.userRequest}`;
|
||||||
}
|
}
|
||||||
|
|
||||||
return [
|
return [
|
||||||
...(globals
|
...(globals
|
||||||
? Object.keys(globals).map((key) => `self[${JSON.stringify(key)}] = ${globals[key]};`)
|
? Object.keys(globals).map((key) => `self[${JSON.stringify(key)}] = ${globals[key]};`)
|
||||||
: []
|
: []),
|
||||||
),
|
...pre.map((include: any) => `require(${loaderUtils.stringifyRequest(this, include)});`),
|
||||||
...pre.map((include: any) => `require(${loaderUtils.stringifyRequest(this, include)});`),
|
`module.exports = require(${loaderUtils.stringifyRequest(this, `!!${remainingRequest}`)});`,
|
||||||
`module.exports = require(${loaderUtils.stringifyRequest(this, `!!${remainingRequest}`)});`,
|
...post.map((include: any) => `require(${loaderUtils.stringifyRequest(this, include)});`)
|
||||||
...post.map((include: any) => `require(${loaderUtils.stringifyRequest(this, include)});`),
|
].join('\n');
|
||||||
].join('\n');
|
}
|
||||||
};
|
|
||||||
|
|||||||
@ -1,52 +1,63 @@
|
|||||||
import type * as webpack from 'webpack';
|
import type * as webpack from 'webpack';
|
||||||
|
|
||||||
export interface IAddWorkerEntryPointPluginOptions {
|
export interface IAddWorkerEntryPointPluginOptions {
|
||||||
id: string;
|
id: string;
|
||||||
entry: string;
|
entry: string;
|
||||||
filename: string;
|
filename: string;
|
||||||
chunkFilename?: string;
|
chunkFilename?: string;
|
||||||
plugins: webpack.WebpackPluginInstance[];
|
plugins: webpack.WebpackPluginInstance[];
|
||||||
}
|
}
|
||||||
|
|
||||||
function getCompilerHook(compiler: webpack.Compiler, { id, entry, filename, chunkFilename, plugins }: IAddWorkerEntryPointPluginOptions) {
|
function getCompilerHook(
|
||||||
const webpack = compiler.webpack ?? require('webpack');
|
compiler: webpack.Compiler,
|
||||||
|
{ id, entry, filename, chunkFilename, plugins }: IAddWorkerEntryPointPluginOptions
|
||||||
return function (compilation: webpack.Compilation, callback: (error?: Error | null | false) => void) {
|
) {
|
||||||
const outputOptions = {
|
const webpack = compiler.webpack ?? require('webpack');
|
||||||
filename,
|
|
||||||
chunkFilename,
|
return function (
|
||||||
publicPath: compilation.outputOptions.publicPath,
|
compilation: webpack.Compilation,
|
||||||
// HACK: globalObject is necessary to fix https://github.com/webpack/webpack/issues/6642
|
callback: (error?: Error | null | false) => void
|
||||||
globalObject: 'this',
|
) {
|
||||||
};
|
const outputOptions = {
|
||||||
const childCompiler = compilation.createChildCompiler(id, outputOptions, [
|
filename,
|
||||||
new webpack.webworker.WebWorkerTemplatePlugin(),
|
chunkFilename,
|
||||||
new webpack.LoaderTargetPlugin('webworker'),
|
publicPath: compilation.outputOptions.publicPath,
|
||||||
]);
|
// HACK: globalObject is necessary to fix https://github.com/webpack/webpack/issues/6642
|
||||||
const SingleEntryPlugin = webpack.EntryPlugin ?? webpack.SingleEntryPlugin;
|
globalObject: 'this'
|
||||||
new SingleEntryPlugin(compiler.context, entry, 'main').apply(childCompiler);
|
};
|
||||||
plugins.forEach((plugin) => plugin.apply(childCompiler));
|
const childCompiler = compilation.createChildCompiler(id, outputOptions, [
|
||||||
|
new webpack.webworker.WebWorkerTemplatePlugin(),
|
||||||
childCompiler.runAsChild((err?: Error) => callback(err));
|
new webpack.LoaderTargetPlugin('webworker')
|
||||||
}
|
]);
|
||||||
|
const SingleEntryPlugin = webpack.EntryPlugin ?? webpack.SingleEntryPlugin;
|
||||||
|
new SingleEntryPlugin(compiler.context, entry, 'main').apply(childCompiler);
|
||||||
|
plugins.forEach((plugin) => plugin.apply(childCompiler));
|
||||||
|
|
||||||
|
childCompiler.runAsChild((err?: Error) => callback(err));
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
export class AddWorkerEntryPointPlugin implements webpack.WebpackPluginInstance {
|
export class AddWorkerEntryPointPlugin implements webpack.WebpackPluginInstance {
|
||||||
|
private readonly options: IAddWorkerEntryPointPluginOptions;
|
||||||
private readonly options: IAddWorkerEntryPointPluginOptions;
|
|
||||||
|
constructor({
|
||||||
constructor({ id, entry, filename, chunkFilename = undefined, plugins }: IAddWorkerEntryPointPluginOptions) {
|
id,
|
||||||
this.options = { id, entry, filename, chunkFilename, plugins };
|
entry,
|
||||||
}
|
filename,
|
||||||
|
chunkFilename = undefined,
|
||||||
apply(compiler: webpack.Compiler) {
|
plugins
|
||||||
const webpack = compiler.webpack ?? require('webpack');
|
}: IAddWorkerEntryPointPluginOptions) {
|
||||||
const compilerHook = getCompilerHook(compiler, this.options);
|
this.options = { id, entry, filename, chunkFilename, plugins };
|
||||||
const majorVersion = webpack.version.split('.')[0]
|
}
|
||||||
if (parseInt(majorVersion) < 4) {
|
|
||||||
(<any>compiler).plugin('make', compilerHook);
|
apply(compiler: webpack.Compiler) {
|
||||||
} else {
|
const webpack = compiler.webpack ?? require('webpack');
|
||||||
compiler.hooks.make.tapAsync('AddWorkerEntryPointPlugin', compilerHook);
|
const compilerHook = getCompilerHook(compiler, this.options);
|
||||||
}
|
const majorVersion = webpack.version.split('.')[0];
|
||||||
}
|
if (parseInt(majorVersion) < 4) {
|
||||||
|
(<any>compiler).plugin('make', compilerHook);
|
||||||
|
} else {
|
||||||
|
compiler.hooks.make.tapAsync('AddWorkerEntryPointPlugin', compilerHook);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,11 +1,10 @@
|
|||||||
|
export interface IWorkerDefinition {
|
||||||
export interface IWorkerDefinition {
|
id: string;
|
||||||
id: string;
|
entry: string;
|
||||||
entry: string;
|
}
|
||||||
}
|
|
||||||
|
export interface IFeatureDefinition {
|
||||||
export interface IFeatureDefinition {
|
label: string;
|
||||||
label: string;
|
entry: string | string[] | undefined;
|
||||||
entry: string | string[] | undefined;
|
worker?: IWorkerDefinition;
|
||||||
worker?: IWorkerDefinition;
|
}
|
||||||
}
|
|
||||||
|
|||||||
@ -1,13 +1,13 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||||
<title>Document</title>
|
<title>Document</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="container" style="width:800px;height:600px;border:1px solid #ccc"></div>
|
<div id="container" style="width: 800px; height: 600px; border: 1px solid #ccc"></div>
|
||||||
<script type="text/javascript" src="app.js"></script>
|
<script type="text/javascript" src="app.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@ -1,7 +1,6 @@
|
|||||||
|
|
||||||
import * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
|
import * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
|
||||||
|
|
||||||
monaco.editor.create(document.getElementById('container'), {
|
monaco.editor.create(document.getElementById('container'), {
|
||||||
value: 'console.log("Hello, world")',
|
value: 'console.log("Hello, world")',
|
||||||
language: 'javascript'
|
language: 'javascript'
|
||||||
});
|
});
|
||||||
|
|||||||
@ -1,15 +1,11 @@
|
|||||||
{
|
{
|
||||||
"compilerOptions": {
|
"compilerOptions": {
|
||||||
"module": "commonjs",
|
"module": "commonjs",
|
||||||
"outDir": "out",
|
"outDir": "out",
|
||||||
"target": "es6",
|
"target": "es6",
|
||||||
"declaration": true,
|
"declaration": true,
|
||||||
"strict": true
|
"strict": true
|
||||||
},
|
},
|
||||||
"include": [
|
"include": ["src"],
|
||||||
"src"
|
"exclude": ["node_modules"]
|
||||||
],
|
}
|
||||||
"exclude": [
|
|
||||||
"node_modules"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
blank_issues_enabled: false
|
blank_issues_enabled: false
|
||||||
contact_links:
|
contact_links:
|
||||||
- name: Question
|
- name: Question
|
||||||
url: https://stackoverflow.com/questions/tagged/monaco-editor
|
url: https://stackoverflow.com/questions/tagged/monaco-editor
|
||||||
about: Please ask and answer questions here.
|
about: Please ask and answer questions here.
|
||||||
|
|||||||
@ -1,62 +1,63 @@
|
|||||||
{
|
{
|
||||||
perform: true,
|
perform: true,
|
||||||
commands: [
|
commands:
|
||||||
{
|
[
|
||||||
type: 'comment',
|
{
|
||||||
name: 'question',
|
type: 'comment',
|
||||||
allowUsers: [],
|
name: 'question',
|
||||||
action: 'updateLabels',
|
allowUsers: [],
|
||||||
addLabel: '*question'
|
action: 'updateLabels',
|
||||||
},
|
addLabel: '*question'
|
||||||
{
|
},
|
||||||
type: 'label',
|
{
|
||||||
name: '*question',
|
type: 'label',
|
||||||
allowTriggerByBot: true,
|
name: '*question',
|
||||||
action: 'close',
|
allowTriggerByBot: true,
|
||||||
comment: "Please ask your question on [StackOverflow](https://stackoverflow.com/questions/tagged/monaco-editor). We have a great community over [there](https://stackoverflow.com/questions/tagged/monaco-editor). They have already answered hundreds of questions and are happy to answer yours as well. You can also try [searching through existing issues](https://github.com/microsoft/monaco-editor/issues?utf8=%E2%9C%93&q=is%3Aissue+), looking at [API usage samples](https://microsoft.github.io/monaco-editor/playground.html) or at [integration samples](https://github.com/Microsoft/monaco-editor-samples). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
action: 'close',
|
||||||
},
|
comment: "Please ask your question on [StackOverflow](https://stackoverflow.com/questions/tagged/monaco-editor). We have a great community over [there](https://stackoverflow.com/questions/tagged/monaco-editor). They have already answered hundreds of questions and are happy to answer yours as well. You can also try [searching through existing issues](https://github.com/microsoft/monaco-editor/issues?utf8=%E2%9C%93&q=is%3Aissue+), looking at [API usage samples](https://microsoft.github.io/monaco-editor/playground.html) or at [integration samples](https://github.com/Microsoft/monaco-editor-samples). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
||||||
{
|
},
|
||||||
type: 'label',
|
{
|
||||||
name: '*out-of-scope',
|
type: 'label',
|
||||||
allowTriggerByBot: true,
|
name: '*out-of-scope',
|
||||||
action: 'close',
|
allowTriggerByBot: true,
|
||||||
comment: "We closed this issue because we don't plan to address it in the foreseeable future. You can find more detailed information about our decision-making process [here](https://aka.ms/vscode-out-of-scope). If you disagree and feel that this issue is crucial: We are happy to listen and to reconsider.\n\nIf you wonder what we are up to, please see our [roadmap](https://aka.ms/vscoderoadmap) and [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nThanks for your understanding and happy coding!"
|
action: 'close',
|
||||||
},
|
comment: "We closed this issue because we don't plan to address it in the foreseeable future. You can find more detailed information about our decision-making process [here](https://aka.ms/vscode-out-of-scope). If you disagree and feel that this issue is crucial: We are happy to listen and to reconsider.\n\nIf you wonder what we are up to, please see our [roadmap](https://aka.ms/vscoderoadmap) and [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nThanks for your understanding and happy coding!"
|
||||||
{
|
},
|
||||||
type: 'label',
|
{
|
||||||
name: '*as-designed',
|
type: 'label',
|
||||||
allowTriggerByBot: true,
|
name: '*as-designed',
|
||||||
action: 'close',
|
allowTriggerByBot: true,
|
||||||
comment: "The described behavior is how it is expected to work. If you disagree, please explain what is expected and what is not in more detail. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
action: 'close',
|
||||||
},
|
comment: "The described behavior is how it is expected to work. If you disagree, please explain what is expected and what is not in more detail. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
||||||
{
|
},
|
||||||
type: 'label',
|
{
|
||||||
name: '*english-please',
|
type: 'label',
|
||||||
allowTriggerByBot: true,
|
name: '*english-please',
|
||||||
action: 'close',
|
allowTriggerByBot: true,
|
||||||
comment: "This issue is being closed because its description is not in English, that makes it hard for us to work on it. Please open a new issue with an English description. You might find [Bing Translator](https://www.bing.com/translator) useful."
|
action: 'close',
|
||||||
},
|
comment: 'This issue is being closed because its description is not in English, that makes it hard for us to work on it. Please open a new issue with an English description. You might find [Bing Translator](https://www.bing.com/translator) useful.'
|
||||||
{
|
},
|
||||||
type: 'comment',
|
{
|
||||||
name: 'duplicate',
|
type: 'comment',
|
||||||
allowUsers: [],
|
name: 'duplicate',
|
||||||
action: 'updateLabels',
|
allowUsers: [],
|
||||||
addLabel: '*duplicate'
|
action: 'updateLabels',
|
||||||
},
|
addLabel: '*duplicate'
|
||||||
{
|
},
|
||||||
type: 'label',
|
{
|
||||||
name: '*duplicate',
|
type: 'label',
|
||||||
allowTriggerByBot: true,
|
name: '*duplicate',
|
||||||
action: 'close',
|
allowTriggerByBot: true,
|
||||||
comment: "Thanks for creating this issue! We figured it's covering the same as another one we already have. Thus, we closed this one as a duplicate. You can search for existing issues [here](https://github.com/Microsoft/monaco-editor/issues). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
action: 'close',
|
||||||
},
|
comment: "Thanks for creating this issue! We figured it's covering the same as another one we already have. Thus, we closed this one as a duplicate. You can search for existing issues [here](https://github.com/Microsoft/monaco-editor/issues). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
||||||
{
|
},
|
||||||
type: 'comment',
|
{
|
||||||
name: 'needsMoreInfo',
|
type: 'comment',
|
||||||
allowUsers: [],
|
name: 'needsMoreInfo',
|
||||||
action: 'updateLabels',
|
allowUsers: [],
|
||||||
addLabel: 'needs more info',
|
action: 'updateLabels',
|
||||||
comment: "Thanks for creating this issue! We figured it's missing some basic information or in some other way doesn't follow our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines. Please take the time to review these and update the issue.\n\nHappy Coding!"
|
addLabel: 'needs more info',
|
||||||
},
|
comment: "Thanks for creating this issue! We figured it's missing some basic information or in some other way doesn't follow our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines. Please take the time to review these and update the issue.\n\nHappy Coding!"
|
||||||
]
|
}
|
||||||
}
|
]
|
||||||
|
}
|
||||||
|
|||||||
@ -1,6 +1 @@
|
|||||||
{
|
{ daysAfterClose: 45, daysSinceLastUpdate: 3, ignoredLabels: ['*out-of-scope'], perform: true }
|
||||||
daysAfterClose: 45,
|
|
||||||
daysSinceLastUpdate: 3,
|
|
||||||
ignoredLabels: ['*out-of-scope'],
|
|
||||||
perform: true
|
|
||||||
}
|
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
daysUntilClose: 7,
|
daysUntilClose: 7,
|
||||||
needsMoreInfoLabel: 'needs-more-info',
|
needsMoreInfoLabel: 'needs-more-info',
|
||||||
perform: true,
|
perform: true,
|
||||||
closeComment: "This issue has been closed automatically because it needs more information and has not had recent activity. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
closeComment: "This issue has been closed automatically because it needs more information and has not had recent activity. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,30 +1,26 @@
|
|||||||
{
|
{
|
||||||
// Use IntelliSense to learn about possible attributes.
|
// Use IntelliSense to learn about possible attributes.
|
||||||
// Hover to view descriptions of existing attributes.
|
// Hover to view descriptions of existing attributes.
|
||||||
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
|
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
|
||||||
"version": "0.2.0",
|
"version": "0.2.0",
|
||||||
"configurations": [
|
"configurations": [
|
||||||
{
|
{
|
||||||
"type": "node",
|
"type": "node",
|
||||||
"request": "launch",
|
"request": "launch",
|
||||||
"name": "gulp release",
|
"name": "gulp release",
|
||||||
"program": "${workspaceFolder}/node_modules/gulp/bin/gulp.js",
|
"program": "${workspaceFolder}/node_modules/gulp/bin/gulp.js",
|
||||||
"stopOnEntry": true,
|
"stopOnEntry": true,
|
||||||
"args": [
|
"args": ["release"],
|
||||||
"release"
|
"cwd": "${workspaceFolder}"
|
||||||
],
|
},
|
||||||
"cwd": "${workspaceFolder}"
|
{
|
||||||
},
|
"type": "node",
|
||||||
{
|
"request": "launch",
|
||||||
"type": "node",
|
"name": "gulp website",
|
||||||
"request": "launch",
|
"program": "${workspaceFolder}/node_modules/gulp/bin/gulp.js",
|
||||||
"name": "gulp website",
|
"stopOnEntry": true,
|
||||||
"program": "${workspaceFolder}/node_modules/gulp/bin/gulp.js",
|
"args": ["website"],
|
||||||
"stopOnEntry": true,
|
"cwd": "${workspaceFolder}"
|
||||||
"args": [
|
}
|
||||||
"website"
|
]
|
||||||
],
|
}
|
||||||
"cwd": "${workspaceFolder}"
|
|
||||||
},
|
|
||||||
]
|
|
||||||
}
|
|
||||||
|
|||||||
@ -1,54 +1,60 @@
|
|||||||
const path = require('path');
|
const path = require('path');
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
mode: 'production',
|
mode: 'production',
|
||||||
entry: {
|
entry: {
|
||||||
"core": './ci/core.js',
|
core: './ci/core.js',
|
||||||
"editor.worker": './vscode/out-monaco-editor-core/esm/vs/editor/editor.worker.js',
|
'editor.worker': './vscode/out-monaco-editor-core/esm/vs/editor/editor.worker.js',
|
||||||
"json.worker": 'monaco-json/release/esm/json.worker',
|
'json.worker': 'monaco-json/release/esm/json.worker',
|
||||||
"css.worker": 'monaco-css/release/esm/css.worker',
|
'css.worker': 'monaco-css/release/esm/css.worker',
|
||||||
"html.worker": 'monaco-html/release/esm/html.worker',
|
'html.worker': 'monaco-html/release/esm/html.worker',
|
||||||
"ts.worker": 'monaco-typescript/release/esm/ts.worker',
|
'ts.worker': 'monaco-typescript/release/esm/ts.worker'
|
||||||
},
|
},
|
||||||
output: {
|
output: {
|
||||||
globalObject: 'self',
|
globalObject: 'self',
|
||||||
filename: '[name].bundle.js',
|
filename: '[name].bundle.js',
|
||||||
path: path.resolve(__dirname, '../dist')
|
path: path.resolve(__dirname, '../dist')
|
||||||
},
|
},
|
||||||
module: {
|
module: {
|
||||||
rules: [
|
rules: [
|
||||||
{
|
{
|
||||||
test: /\.css$/,
|
test: /\.css$/,
|
||||||
use: ['style-loader', 'css-loader'],
|
use: ['style-loader', 'css-loader']
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
|
test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
|
||||||
use: [
|
use: [
|
||||||
{
|
{
|
||||||
loader: 'file-loader',
|
loader: 'file-loader',
|
||||||
options: {
|
options: {
|
||||||
name: '[name].[ext]',
|
name: '[name].[ext]',
|
||||||
outputPath: 'fonts/'
|
outputPath: 'fonts/'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
resolve: {
|
resolve: {
|
||||||
alias: {
|
alias: {
|
||||||
'monaco-editor-core/esm/vs/editor/editor.worker': path.resolve(__dirname, '../vscode/out-monaco-editor-core/esm/vs/editor/editor.worker.js'),
|
'monaco-editor-core/esm/vs/editor/editor.worker': path.resolve(
|
||||||
'monaco-editor-core': path.resolve(__dirname, '../vscode/out-monaco-editor-core/esm/vs/editor/editor.main.js'),
|
__dirname,
|
||||||
}
|
'../vscode/out-monaco-editor-core/esm/vs/editor/editor.worker.js'
|
||||||
},
|
),
|
||||||
stats: {
|
'monaco-editor-core': path.resolve(
|
||||||
all: false,
|
__dirname,
|
||||||
modules: true,
|
'../vscode/out-monaco-editor-core/esm/vs/editor/editor.main.js'
|
||||||
errors: true,
|
)
|
||||||
warnings: true,
|
}
|
||||||
// our additional options
|
},
|
||||||
moduleTrace: true,
|
stats: {
|
||||||
errorDetails: true,
|
all: false,
|
||||||
chunks: true
|
modules: true,
|
||||||
}
|
errors: true,
|
||||||
|
warnings: true,
|
||||||
|
// our additional options
|
||||||
|
moduleTrace: true,
|
||||||
|
errorDetails: true,
|
||||||
|
chunks: true
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
@ -1,87 +1,85 @@
|
|||||||
(function () {
|
(function () {
|
||||||
|
var METADATA = {
|
||||||
var METADATA = {
|
CORE: {
|
||||||
CORE: {
|
paths: {
|
||||||
paths: {
|
src: '/vscode/out/vs',
|
||||||
src: '/vscode/out/vs',
|
'npm/dev': 'node_modules/monaco-editor-core/dev/vs',
|
||||||
'npm/dev': 'node_modules/monaco-editor-core/dev/vs',
|
'npm/min': 'node_modules/monaco-editor-core/min/vs',
|
||||||
'npm/min': 'node_modules/monaco-editor-core/min/vs',
|
built: '/vscode/out-monaco-editor-core/min/vs',
|
||||||
built: '/vscode/out-monaco-editor-core/min/vs',
|
releaseDev: 'release/dev/vs',
|
||||||
releaseDev: 'release/dev/vs',
|
releaseMin: 'release/min/vs'
|
||||||
releaseMin: 'release/min/vs',
|
}
|
||||||
}
|
},
|
||||||
},
|
PLUGINS: [
|
||||||
PLUGINS: [
|
{
|
||||||
{
|
name: 'monaco-typescript',
|
||||||
name: 'monaco-typescript',
|
contrib: 'vs/language/typescript/monaco.contribution',
|
||||||
contrib: 'vs/language/typescript/monaco.contribution',
|
modulePrefix: 'vs/language/typescript',
|
||||||
modulePrefix: 'vs/language/typescript',
|
thirdPartyNotices: 'node_modules/monaco-typescript/ThirdPartyNotices.txt',
|
||||||
thirdPartyNotices: 'node_modules/monaco-typescript/ThirdPartyNotices.txt',
|
paths: {
|
||||||
paths: {
|
// use ./ to indicate it is relative to the repository root
|
||||||
// use ./ to indicate it is relative to the repository root
|
src: './monaco-typescript/release/dev',
|
||||||
src: './monaco-typescript/release/dev',
|
'npm/dev': 'node_modules/monaco-typescript/release/dev',
|
||||||
'npm/dev': 'node_modules/monaco-typescript/release/dev',
|
'npm/min': 'node_modules/monaco-typescript/release/min',
|
||||||
'npm/min': 'node_modules/monaco-typescript/release/min',
|
esm: 'node_modules/monaco-typescript/release/esm'
|
||||||
esm: 'node_modules/monaco-typescript/release/esm',
|
}
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'monaco-css',
|
||||||
name: 'monaco-css',
|
contrib: 'vs/language/css/monaco.contribution',
|
||||||
contrib: 'vs/language/css/monaco.contribution',
|
modulePrefix: 'vs/language/css',
|
||||||
modulePrefix: 'vs/language/css',
|
paths: {
|
||||||
paths: {
|
// use ./ to indicate it is relative to the repository root
|
||||||
// use ./ to indicate it is relative to the repository root
|
src: './monaco-css/release/dev',
|
||||||
src: './monaco-css/release/dev',
|
'npm/dev': 'node_modules/monaco-css/release/dev',
|
||||||
'npm/dev': 'node_modules/monaco-css/release/dev',
|
'npm/min': 'node_modules/monaco-css/release/min',
|
||||||
'npm/min': 'node_modules/monaco-css/release/min',
|
esm: 'node_modules/monaco-css/release/esm'
|
||||||
esm: 'node_modules/monaco-css/release/esm',
|
}
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'monaco-json',
|
||||||
name: 'monaco-json',
|
contrib: 'vs/language/json/monaco.contribution',
|
||||||
contrib: 'vs/language/json/monaco.contribution',
|
modulePrefix: 'vs/language/json',
|
||||||
modulePrefix: 'vs/language/json',
|
paths: {
|
||||||
paths: {
|
// use ./ to indicate it is relative to the repository root
|
||||||
// use ./ to indicate it is relative to the repository root
|
src: './monaco-json/release/dev',
|
||||||
src: './monaco-json/release/dev',
|
'npm/dev': 'node_modules/monaco-json/release/dev',
|
||||||
'npm/dev': 'node_modules/monaco-json/release/dev',
|
'npm/min': 'node_modules/monaco-json/release/min',
|
||||||
'npm/min': 'node_modules/monaco-json/release/min',
|
esm: 'node_modules/monaco-json/release/esm'
|
||||||
esm: 'node_modules/monaco-json/release/esm',
|
}
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'monaco-html',
|
||||||
name: 'monaco-html',
|
contrib: 'vs/language/html/monaco.contribution',
|
||||||
contrib: 'vs/language/html/monaco.contribution',
|
modulePrefix: 'vs/language/html',
|
||||||
modulePrefix: 'vs/language/html',
|
thirdPartyNotices: 'node_modules/monaco-html/ThirdPartyNotices.txt',
|
||||||
thirdPartyNotices: 'node_modules/monaco-html/ThirdPartyNotices.txt',
|
paths: {
|
||||||
paths: {
|
// use ./ to indicate it is relative to the repository root
|
||||||
// use ./ to indicate it is relative to the repository root
|
src: './monaco-html/release/dev',
|
||||||
src: './monaco-html/release/dev',
|
'npm/dev': 'node_modules/monaco-html/release/dev',
|
||||||
'npm/dev': 'node_modules/monaco-html/release/dev',
|
'npm/min': 'node_modules/monaco-html/release/min',
|
||||||
'npm/min': 'node_modules/monaco-html/release/min',
|
esm: 'node_modules/monaco-html/release/esm'
|
||||||
esm: 'node_modules/monaco-html/release/esm',
|
}
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'monaco-languages',
|
||||||
name: 'monaco-languages',
|
contrib: 'vs/basic-languages/monaco.contribution',
|
||||||
contrib: 'vs/basic-languages/monaco.contribution',
|
modulePrefix: 'vs/basic-languages',
|
||||||
modulePrefix: 'vs/basic-languages',
|
thirdPartyNotices: 'node_modules/monaco-languages/ThirdPartyNotices.txt',
|
||||||
thirdPartyNotices: 'node_modules/monaco-languages/ThirdPartyNotices.txt',
|
paths: {
|
||||||
paths: {
|
// use ./ to indicate it is relative to the repository root
|
||||||
// use ./ to indicate it is relative to the repository root
|
src: './monaco-languages/release/dev',
|
||||||
src: './monaco-languages/release/dev',
|
'npm/dev': 'node_modules/monaco-languages/release/dev',
|
||||||
'npm/dev': 'node_modules/monaco-languages/release/dev',
|
'npm/min': 'node_modules/monaco-languages/release/min',
|
||||||
'npm/min': 'node_modules/monaco-languages/release/min',
|
esm: 'node_modules/monaco-languages/release/esm'
|
||||||
esm: 'node_modules/monaco-languages/release/esm',
|
}
|
||||||
}
|
}
|
||||||
}
|
]
|
||||||
]
|
};
|
||||||
}
|
|
||||||
|
if (typeof exports !== 'undefined') {
|
||||||
if (typeof exports !== 'undefined') {
|
exports.METADATA = METADATA;
|
||||||
exports.METADATA = METADATA
|
} else {
|
||||||
} else {
|
self.METADATA = METADATA;
|
||||||
self.METADATA = METADATA;
|
}
|
||||||
}
|
})();
|
||||||
|
|
||||||
})();
|
|
||||||
|
|||||||
@ -1,35 +1,35 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||||
<style>
|
<style>
|
||||||
html,
|
html,
|
||||||
body {
|
body {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
#container {
|
#container {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dev-setup-control {
|
.dev-setup-control {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="container"></div>
|
<div id="container"></div>
|
||||||
<script src="../../metadata.js"></script>
|
<script src="../../metadata.js"></script>
|
||||||
<script src="../dev-setup.js"></script>
|
<script src="../dev-setup.js"></script>
|
||||||
<script src="iframe.js"></script>
|
<script src="iframe.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@ -1,22 +1,22 @@
|
|||||||
const init = () => {
|
const init = () => {
|
||||||
loadEditor(function() {
|
loadEditor(function () {
|
||||||
// create the editor
|
// create the editor
|
||||||
const target = document.getElementById('container');
|
const target = document.getElementById('container');
|
||||||
const editor = monaco.editor.create(target, { language: 'html' });
|
const editor = monaco.editor.create(target, { language: 'html' });
|
||||||
|
|
||||||
// load some sample data
|
// load some sample data
|
||||||
(async () => {
|
(async () => {
|
||||||
const response = await fetch('https://microsoft.github.io/monaco-editor/');
|
const response = await fetch('https://microsoft.github.io/monaco-editor/');
|
||||||
const html = await response.text();
|
const html = await response.text();
|
||||||
editor.getModel().setValue(html);
|
editor.getModel().setValue(html);
|
||||||
})();
|
})();
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
window.addEventListener('DOMContentLoaded', () => {
|
||||||
if (!window.innerWidth || !window.innerHeight) {
|
if (!window.innerWidth || !window.innerHeight) {
|
||||||
window.addEventListener('resize', init, { once: true });
|
window.addEventListener('resize', init, { once: true });
|
||||||
} else {
|
} else {
|
||||||
init();
|
init();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|||||||
@ -1,42 +1,42 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<script type="module">
|
<script type="module">
|
||||||
class MonacoEditorElement extends HTMLElement {
|
class MonacoEditorElement extends HTMLElement {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.style = 'display: block;';
|
this.style = 'display: block;';
|
||||||
const shadow = this.attachShadow({ mode: 'open' });
|
const shadow = this.attachShadow({ mode: 'open' });
|
||||||
const iframe = document.createElement('iframe');
|
const iframe = document.createElement('iframe');
|
||||||
iframe.src = new URL('iframe.html?editor=src', import.meta.url).href;
|
iframe.src = new URL('iframe.html?editor=src', import.meta.url).href;
|
||||||
iframe.style = `width: 100%; height: 100%;`;
|
iframe.style = `width: 100%; height: 100%;`;
|
||||||
shadow.appendChild(iframe);
|
shadow.appendChild(iframe);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
customElements.define('monaco-editor', MonacoEditorElement);
|
customElements.define('monaco-editor', MonacoEditorElement);
|
||||||
</script>
|
</script>
|
||||||
<style>
|
<style>
|
||||||
section {
|
section {
|
||||||
margin: 80px;
|
margin: 80px;
|
||||||
}
|
}
|
||||||
|
|
||||||
iframe,
|
iframe,
|
||||||
monaco-editor {
|
monaco-editor {
|
||||||
width: 640px;
|
width: 640px;
|
||||||
height: 400px;
|
height: 400px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<section>
|
<section>
|
||||||
<h1>Monaco in a shadowRoot + iframe context</h1>
|
<h1>Monaco in a shadowRoot + iframe context</h1>
|
||||||
<monaco-editor></monaco-editor>
|
<monaco-editor></monaco-editor>
|
||||||
</section>
|
</section>
|
||||||
<hr>
|
<hr />
|
||||||
<section>
|
<section>
|
||||||
<h1>Monaco in an iframe context</h1>
|
<h1>Monaco in an iframe context</h1>
|
||||||
<iframe src="iframe.html?editor=src"></iframe>
|
<iframe src="iframe.html?editor=src"></iframe>
|
||||||
</section>
|
</section>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@ -1,35 +1,35 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||||
<style>
|
<style>
|
||||||
html,
|
html,
|
||||||
body {
|
body {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
#container {
|
#container {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dev-setup-control {
|
.dev-setup-control {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="container"></div>
|
<div id="container"></div>
|
||||||
<script src="../../metadata.js"></script>
|
<script src="../../metadata.js"></script>
|
||||||
<script src="../dev-setup.js"></script>
|
<script src="../dev-setup.js"></script>
|
||||||
<script src="iframe.js"></script>
|
<script src="iframe.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@ -1,22 +1,22 @@
|
|||||||
const init = () => {
|
const init = () => {
|
||||||
loadEditor(function() {
|
loadEditor(function () {
|
||||||
// create the editor
|
// create the editor
|
||||||
const target = document.getElementById('container');
|
const target = document.getElementById('container');
|
||||||
const editor = monaco.editor.create(target, { language: 'html' });
|
const editor = monaco.editor.create(target, { language: 'html' });
|
||||||
|
|
||||||
// load some sample data
|
// load some sample data
|
||||||
(async () => {
|
(async () => {
|
||||||
const response = await fetch('https://microsoft.github.io/monaco-editor/');
|
const response = await fetch('https://microsoft.github.io/monaco-editor/');
|
||||||
const html = await response.text();
|
const html = await response.text();
|
||||||
editor.getModel().setValue(html);
|
editor.getModel().setValue(html);
|
||||||
})();
|
})();
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
window.addEventListener('DOMContentLoaded', () => {
|
||||||
if (!window.innerWidth || !window.innerHeight) {
|
if (!window.innerWidth || !window.innerHeight) {
|
||||||
window.addEventListener('resize', init, { once: true });
|
window.addEventListener('resize', init, { once: true });
|
||||||
} else {
|
} else {
|
||||||
init();
|
init();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|||||||
@ -1,8 +1,11 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head> </head>
|
||||||
</head>
|
<body>
|
||||||
<body>
|
<iframe
|
||||||
<iframe src="http://localhost:8088/monaco-editor/test/2264/iframe.html?editor=src" style="width:800px;height:600px;" sandbox="allow-same-origin allow-scripts allow-popups allow-modals allow-forms allow-downloads"></iframe>
|
src="http://localhost:8088/monaco-editor/test/2264/iframe.html?editor=src"
|
||||||
</body>
|
style="width: 800px; height: 600px"
|
||||||
</html>
|
sandbox="allow-same-origin allow-scripts allow-popups allow-modals allow-forms allow-downloads"
|
||||||
|
></iframe>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@ -1,54 +1,54 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<h2>Colorize example</h2>
|
||||||
<h2>Colorize example</h2>
|
|
||||||
|
<pre id="code" data-lang="text/css" style="width: 500px">
|
||||||
<pre id="code" data-lang="text/css" style="width:500px;">
|
/* Some example CSS */
|
||||||
/* Some example CSS */
|
|
||||||
|
@import url("something.css");
|
||||||
@import url("something.css");
|
|
||||||
|
body {
|
||||||
body {
|
margin: 0;
|
||||||
margin: 0;
|
padding: 3em 6em;
|
||||||
padding: 3em 6em;
|
font-family: tahoma, arial, sans-serif;
|
||||||
font-family: tahoma, arial, sans-serif;
|
color: #000;
|
||||||
color: #000;
|
}
|
||||||
}
|
|
||||||
|
#navigation a {
|
||||||
#navigation a {
|
font-weight: bold;
|
||||||
font-weight: bold;
|
text-decoration: none !important;
|
||||||
text-decoration: none !important;
|
}
|
||||||
}
|
|
||||||
|
h1 {
|
||||||
h1 {
|
font-size: 2.5em;
|
||||||
font-size: 2.5em;
|
}
|
||||||
}
|
|
||||||
|
h2 {
|
||||||
h2 {
|
font-size: 1.7em;
|
||||||
font-size: 1.7em;
|
}
|
||||||
}
|
|
||||||
|
h1:before, h2:before {
|
||||||
h1:before, h2:before {
|
content: "some contents";
|
||||||
content: "some contents";
|
}
|
||||||
}
|
|
||||||
|
code {
|
||||||
code {
|
font-family: courier, monospace;
|
||||||
font-family: courier, monospace;
|
font-size: 80%;
|
||||||
font-size: 80%;
|
color: #418A8A;
|
||||||
color: #418A8A;
|
}
|
||||||
}
|
</pre
|
||||||
</pre>
|
>
|
||||||
|
|
||||||
<script src="../metadata.js"></script>
|
<script src="../metadata.js"></script>
|
||||||
<script src="dev-setup.js"></script>
|
<script src="dev-setup.js"></script>
|
||||||
<script>
|
<script>
|
||||||
loadEditor(function() {
|
loadEditor(function () {
|
||||||
monaco.editor.colorizeElement(document.getElementById('code'));
|
monaco.editor.colorizeElement(document.getElementById('code'));
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@ -1,26 +1,27 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<h2>Monaco Editor wrong cross origin</h2>
|
||||||
<h2>Monaco Editor wrong cross origin</h2>
|
|
||||||
|
<div style="clear: both"></div>
|
||||||
<div style="clear:both"></div>
|
<div
|
||||||
<div id="container" style="float:left;width:800px;height:450px;border: 1px solid grey"></div>
|
id="container"
|
||||||
<div style="clear:both"></div>
|
style="float: left; width: 800px; height: 450px; border: 1px solid grey"
|
||||||
|
></div>
|
||||||
<script src="../metadata.js"></script>
|
<div style="clear: both"></div>
|
||||||
<script src="dev-setup.js"></script>
|
|
||||||
<script>
|
<script src="../metadata.js"></script>
|
||||||
loadEditor(function() {
|
<script src="dev-setup.js"></script>
|
||||||
monaco.editor.create(document.getElementById('container'), {
|
<script>
|
||||||
value: document.documentElement.innerHTML,
|
loadEditor(function () {
|
||||||
language: 'css'
|
monaco.editor.create(document.getElementById('container'), {
|
||||||
});
|
value: document.documentElement.innerHTML,
|
||||||
}, 'http://localhost:8088');
|
language: 'css'
|
||||||
</script>
|
});
|
||||||
|
}, 'http://localhost:8088');
|
||||||
</body>
|
</script>
|
||||||
</html>
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@ -1,33 +1,34 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<h2>Monaco Editor cross origin correct</h2>
|
||||||
<h2>Monaco Editor cross origin correct</h2>
|
|
||||||
|
<div style="clear: both"></div>
|
||||||
<div style="clear:both"></div>
|
<div
|
||||||
<div id="container" style="float:left;width:800px;height:450px;border: 1px solid grey"></div>
|
id="container"
|
||||||
<div style="clear:both"></div>
|
style="float: left; width: 800px; height: 450px; border: 1px solid grey"
|
||||||
|
></div>
|
||||||
<script src="../metadata.js"></script>
|
<div style="clear: both"></div>
|
||||||
<script src="dev-setup.js"></script>
|
|
||||||
<script>
|
<script src="../metadata.js"></script>
|
||||||
window.MonacoEnvironment = {
|
<script src="dev-setup.js"></script>
|
||||||
getWorkerUrl: function() {
|
<script>
|
||||||
return 'cross-origin-worker-proxy.js#http://localhost:8088' + RESOLVED_CORE_PATH;
|
window.MonacoEnvironment = {
|
||||||
}
|
getWorkerUrl: function () {
|
||||||
};
|
return 'cross-origin-worker-proxy.js#http://localhost:8088' + RESOLVED_CORE_PATH;
|
||||||
</script>
|
}
|
||||||
<script>
|
};
|
||||||
loadEditor(function() {
|
</script>
|
||||||
monaco.editor.create(document.getElementById('container'), {
|
<script>
|
||||||
value: document.documentElement.innerHTML,
|
loadEditor(function () {
|
||||||
language: 'css'
|
monaco.editor.create(document.getElementById('container'), {
|
||||||
});
|
value: document.documentElement.innerHTML,
|
||||||
}, 'http://localhost:8088');
|
language: 'css'
|
||||||
</script>
|
});
|
||||||
|
}, 'http://localhost:8088');
|
||||||
</body>
|
</script>
|
||||||
</html>
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@ -1,10 +1,10 @@
|
|||||||
var baseUrl = self.location.hash;
|
var baseUrl = self.location.hash;
|
||||||
baseUrl = baseUrl.replace(/^#/, '');
|
baseUrl = baseUrl.replace(/^#/, '');
|
||||||
baseUrl = baseUrl.replace(/vs$/, '');
|
baseUrl = baseUrl.replace(/vs$/, '');
|
||||||
|
|
||||||
console.log('WORKER BASE_URL: ' + baseUrl);
|
console.log('WORKER BASE_URL: ' + baseUrl);
|
||||||
|
|
||||||
self.MonacoEnvironment = {
|
self.MonacoEnvironment = {
|
||||||
baseUrl: baseUrl
|
baseUrl: baseUrl
|
||||||
};
|
};
|
||||||
importScripts(baseUrl + 'vs/base/worker/workerMain.js');
|
importScripts(baseUrl + 'vs/base/worker/workerMain.js');
|
||||||
|
|||||||
@ -1,204 +1,237 @@
|
|||||||
(function() {
|
(function () {
|
||||||
|
let IS_FILE_PROTOCOL = window.location.protocol === 'file:';
|
||||||
let IS_FILE_PROTOCOL = (window.location.protocol === 'file:');
|
let DIRNAME = null;
|
||||||
let DIRNAME = null;
|
if (IS_FILE_PROTOCOL) {
|
||||||
if (IS_FILE_PROTOCOL) {
|
let port = window.location.port;
|
||||||
let port = window.location.port;
|
if (port.length > 0) {
|
||||||
if (port.length > 0) {
|
port = ':' + port;
|
||||||
port = ':' + port;
|
}
|
||||||
}
|
DIRNAME =
|
||||||
DIRNAME = window.location.protocol + '//' + window.location.hostname + port + window.location.pathname.substr(0, window.location.pathname.lastIndexOf('/'));
|
window.location.protocol +
|
||||||
|
'//' +
|
||||||
let bases = document.getElementsByTagName('base');
|
window.location.hostname +
|
||||||
if (bases.length > 0) {
|
port +
|
||||||
DIRNAME = DIRNAME + '/' + bases[0].getAttribute('href');
|
window.location.pathname.substr(0, window.location.pathname.lastIndexOf('/'));
|
||||||
}
|
|
||||||
}
|
let bases = document.getElementsByTagName('base');
|
||||||
|
if (bases.length > 0) {
|
||||||
|
DIRNAME = DIRNAME + '/' + bases[0].getAttribute('href');
|
||||||
let LOADER_OPTS = (function() {
|
}
|
||||||
function parseQueryString() {
|
}
|
||||||
let str = window.location.search;
|
|
||||||
str = str.replace(/^\?/, '');
|
let LOADER_OPTS = (function () {
|
||||||
let pieces = str.split(/&/);
|
function parseQueryString() {
|
||||||
let result = {};
|
let str = window.location.search;
|
||||||
pieces.forEach(function(piece) {
|
str = str.replace(/^\?/, '');
|
||||||
let config = piece.split(/=/);
|
let pieces = str.split(/&/);
|
||||||
result[config[0]] = config[1];
|
let result = {};
|
||||||
});
|
pieces.forEach(function (piece) {
|
||||||
return result;
|
let config = piece.split(/=/);
|
||||||
}
|
result[config[0]] = config[1];
|
||||||
let overwrites = parseQueryString();
|
});
|
||||||
let result = {};
|
return result;
|
||||||
result['editor'] = overwrites['editor'] || 'npm/dev';
|
}
|
||||||
METADATA.PLUGINS.map(function(plugin) {
|
let overwrites = parseQueryString();
|
||||||
result[plugin.name] = overwrites[plugin.name] || 'npm/dev';
|
let result = {};
|
||||||
});
|
result['editor'] = overwrites['editor'] || 'npm/dev';
|
||||||
return result;
|
METADATA.PLUGINS.map(function (plugin) {
|
||||||
})();
|
result[plugin.name] = overwrites[plugin.name] || 'npm/dev';
|
||||||
function toHREF(search) {
|
});
|
||||||
let port = window.location.port;
|
return result;
|
||||||
if (port.length > 0) {
|
})();
|
||||||
port = ':' + port;
|
function toHREF(search) {
|
||||||
}
|
let port = window.location.port;
|
||||||
return window.location.protocol + '//' + window.location.hostname + port + window.location.pathname + search + window.location.hash;
|
if (port.length > 0) {
|
||||||
}
|
port = ':' + port;
|
||||||
|
}
|
||||||
|
return (
|
||||||
function Component(name, modulePrefix, paths, contrib) {
|
window.location.protocol +
|
||||||
this.name = name;
|
'//' +
|
||||||
this.modulePrefix = modulePrefix;
|
window.location.hostname +
|
||||||
this.paths = paths;
|
port +
|
||||||
this.contrib = contrib;
|
window.location.pathname +
|
||||||
this.selectedPath = LOADER_OPTS[name];
|
search +
|
||||||
}
|
window.location.hash
|
||||||
Component.prototype.isRelease = function() {
|
);
|
||||||
return /release/.test(this.selectedPath);
|
}
|
||||||
};
|
|
||||||
Component.prototype.getResolvedPath = function(PATH_PREFIX) {
|
function Component(name, modulePrefix, paths, contrib) {
|
||||||
let resolvedPath = this.paths[this.selectedPath];
|
this.name = name;
|
||||||
if (/\.\//.test(resolvedPath)) {
|
this.modulePrefix = modulePrefix;
|
||||||
// starts with ./ => treat as relative to repo root
|
this.paths = paths;
|
||||||
if (IS_FILE_PROTOCOL) {
|
this.contrib = contrib;
|
||||||
resolvedPath = DIRNAME + '/../' + resolvedPath;
|
this.selectedPath = LOADER_OPTS[name];
|
||||||
} else {
|
}
|
||||||
resolvedPath = PATH_PREFIX + '/monaco-editor/' + resolvedPath;
|
Component.prototype.isRelease = function () {
|
||||||
}
|
return /release/.test(this.selectedPath);
|
||||||
} else if (this.selectedPath === 'npm/dev' || this.selectedPath === 'npm/min' || this.isRelease()) {
|
};
|
||||||
if (IS_FILE_PROTOCOL) {
|
Component.prototype.getResolvedPath = function (PATH_PREFIX) {
|
||||||
resolvedPath = DIRNAME + '/../' + resolvedPath;
|
let resolvedPath = this.paths[this.selectedPath];
|
||||||
} else {
|
if (/\.\//.test(resolvedPath)) {
|
||||||
resolvedPath = PATH_PREFIX + '/monaco-editor/' + resolvedPath;
|
// starts with ./ => treat as relative to repo root
|
||||||
}
|
if (IS_FILE_PROTOCOL) {
|
||||||
} else {
|
resolvedPath = DIRNAME + '/../' + resolvedPath;
|
||||||
if (IS_FILE_PROTOCOL) {
|
} else {
|
||||||
resolvedPath = DIRNAME + '/../..' + resolvedPath;
|
resolvedPath = PATH_PREFIX + '/monaco-editor/' + resolvedPath;
|
||||||
} else {
|
}
|
||||||
resolvedPath = PATH_PREFIX + resolvedPath;
|
} else if (
|
||||||
}
|
this.selectedPath === 'npm/dev' ||
|
||||||
}
|
this.selectedPath === 'npm/min' ||
|
||||||
return resolvedPath;
|
this.isRelease()
|
||||||
};
|
) {
|
||||||
Component.prototype.generateLoaderConfig = function(dest, PATH_PREFIX) {
|
if (IS_FILE_PROTOCOL) {
|
||||||
dest[this.modulePrefix] = this.getResolvedPath(PATH_PREFIX);
|
resolvedPath = DIRNAME + '/../' + resolvedPath;
|
||||||
};
|
} else {
|
||||||
Component.prototype.generateUrlForPath = function(pathName) {
|
resolvedPath = PATH_PREFIX + '/monaco-editor/' + resolvedPath;
|
||||||
let NEW_LOADER_OPTS = {};
|
}
|
||||||
Object.keys(LOADER_OPTS).forEach(function(key) {
|
} else {
|
||||||
NEW_LOADER_OPTS[key] = (LOADER_OPTS[key] === 'npm/dev' ? undefined : LOADER_OPTS[key]);
|
if (IS_FILE_PROTOCOL) {
|
||||||
});
|
resolvedPath = DIRNAME + '/../..' + resolvedPath;
|
||||||
NEW_LOADER_OPTS[this.name] = (pathName === 'npm/dev' ? undefined : pathName);
|
} else {
|
||||||
|
resolvedPath = PATH_PREFIX + resolvedPath;
|
||||||
let search = Object.keys(NEW_LOADER_OPTS).map(function(key) {
|
}
|
||||||
let value = NEW_LOADER_OPTS[key];
|
}
|
||||||
if (value) {
|
return resolvedPath;
|
||||||
return key + '=' + value;
|
};
|
||||||
}
|
Component.prototype.generateLoaderConfig = function (dest, PATH_PREFIX) {
|
||||||
return '';
|
dest[this.modulePrefix] = this.getResolvedPath(PATH_PREFIX);
|
||||||
}).filter(function(assignment) { return !!assignment; }).join('&');
|
};
|
||||||
if (search.length > 0) {
|
Component.prototype.generateUrlForPath = function (pathName) {
|
||||||
search = '?' + search;
|
let NEW_LOADER_OPTS = {};
|
||||||
}
|
Object.keys(LOADER_OPTS).forEach(function (key) {
|
||||||
return toHREF(search);
|
NEW_LOADER_OPTS[key] = LOADER_OPTS[key] === 'npm/dev' ? undefined : LOADER_OPTS[key];
|
||||||
};
|
});
|
||||||
Component.prototype.renderLoadingOptions = function() {
|
NEW_LOADER_OPTS[this.name] = pathName === 'npm/dev' ? undefined : pathName;
|
||||||
return '<strong style="width:130px;display:inline-block;">' + this.name + '</strong>:   ' + Object.keys(this.paths).map(function(pathName) {
|
|
||||||
if (pathName === this.selectedPath) {
|
let search = Object.keys(NEW_LOADER_OPTS)
|
||||||
return '<strong>' + pathName + '</strong>';
|
.map(function (key) {
|
||||||
}
|
let value = NEW_LOADER_OPTS[key];
|
||||||
return '<a href="' + this.generateUrlForPath(pathName) + '">' + pathName + '</a>';
|
if (value) {
|
||||||
}.bind(this)).join('   ');
|
return key + '=' + value;
|
||||||
};
|
}
|
||||||
|
return '';
|
||||||
|
})
|
||||||
let RESOLVED_CORE = new Component('editor', 'vs', METADATA.CORE.paths);
|
.filter(function (assignment) {
|
||||||
self.RESOLVED_CORE_PATH = RESOLVED_CORE.getResolvedPath('');
|
return !!assignment;
|
||||||
let RESOLVED_PLUGINS = METADATA.PLUGINS.map(function(plugin) {
|
})
|
||||||
return new Component(plugin.name, plugin.modulePrefix, plugin.paths, plugin.contrib);
|
.join('&');
|
||||||
});
|
if (search.length > 0) {
|
||||||
METADATA = null;
|
search = '?' + search;
|
||||||
|
}
|
||||||
|
return toHREF(search);
|
||||||
function loadScript(path, callback) {
|
};
|
||||||
let script = document.createElement('script');
|
Component.prototype.renderLoadingOptions = function () {
|
||||||
script.onload = callback;
|
return (
|
||||||
script.async = true;
|
'<strong style="width:130px;display:inline-block;">' +
|
||||||
script.type = 'text/javascript';
|
this.name +
|
||||||
script.src = path;
|
'</strong>:   ' +
|
||||||
document.head.appendChild(script);
|
Object.keys(this.paths)
|
||||||
}
|
.map(
|
||||||
|
function (pathName) {
|
||||||
|
if (pathName === this.selectedPath) {
|
||||||
(function() {
|
return '<strong>' + pathName + '</strong>';
|
||||||
let allComponents = [RESOLVED_CORE];
|
}
|
||||||
if (!RESOLVED_CORE.isRelease()) {
|
return '<a href="' + this.generateUrlForPath(pathName) + '">' + pathName + '</a>';
|
||||||
allComponents = allComponents.concat(RESOLVED_PLUGINS);
|
}.bind(this)
|
||||||
}
|
)
|
||||||
|
.join('   ')
|
||||||
let div = document.createElement('div');
|
);
|
||||||
div.className = 'dev-setup-control'
|
};
|
||||||
div.style.position = 'fixed';
|
|
||||||
div.style.top = 0;
|
let RESOLVED_CORE = new Component('editor', 'vs', METADATA.CORE.paths);
|
||||||
div.style.right = 0;
|
self.RESOLVED_CORE_PATH = RESOLVED_CORE.getResolvedPath('');
|
||||||
div.style.background = 'lightgray';
|
let RESOLVED_PLUGINS = METADATA.PLUGINS.map(function (plugin) {
|
||||||
div.style.padding = '5px 20px 5px 5px';
|
return new Component(plugin.name, plugin.modulePrefix, plugin.paths, plugin.contrib);
|
||||||
div.style.zIndex = '1000';
|
});
|
||||||
|
METADATA = null;
|
||||||
div.innerHTML = '<ul><li>' + allComponents.map(function(component) { return component.renderLoadingOptions(); }).join('</li><li>') + '</li></ul>';
|
|
||||||
|
function loadScript(path, callback) {
|
||||||
document.body.appendChild(div);
|
let script = document.createElement('script');
|
||||||
|
script.onload = callback;
|
||||||
let aElements = document.getElementsByTagName('a');
|
script.async = true;
|
||||||
for (let i = 0; i < aElements.length; i++) {
|
script.type = 'text/javascript';
|
||||||
let aElement = aElements[i];
|
script.src = path;
|
||||||
if (aElement.className === 'loading-opts') {
|
document.head.appendChild(script);
|
||||||
aElement.href += window.location.search
|
}
|
||||||
}
|
|
||||||
}
|
(function () {
|
||||||
})();
|
let allComponents = [RESOLVED_CORE];
|
||||||
|
if (!RESOLVED_CORE.isRelease()) {
|
||||||
self.getCodiconPath = function(PATH_PREFIX) {
|
allComponents = allComponents.concat(RESOLVED_PLUGINS);
|
||||||
PATH_PREFIX = PATH_PREFIX || '';
|
}
|
||||||
const result = RESOLVED_CORE.getResolvedPath(PATH_PREFIX);
|
|
||||||
return result + '/base/browser/ui/codicons/codicon/codicon.ttf';
|
let div = document.createElement('div');
|
||||||
};
|
div.className = 'dev-setup-control';
|
||||||
|
div.style.position = 'fixed';
|
||||||
|
div.style.top = 0;
|
||||||
self.loadEditor = function(callback, PATH_PREFIX) {
|
div.style.right = 0;
|
||||||
PATH_PREFIX = PATH_PREFIX || '';
|
div.style.background = 'lightgray';
|
||||||
|
div.style.padding = '5px 20px 5px 5px';
|
||||||
loadScript(RESOLVED_CORE.getResolvedPath(PATH_PREFIX) + '/loader.js', function() {
|
div.style.zIndex = '1000';
|
||||||
let loaderPathsConfig = {};
|
|
||||||
if (!RESOLVED_CORE.isRelease()) {
|
div.innerHTML =
|
||||||
RESOLVED_PLUGINS.forEach(function(plugin) {
|
'<ul><li>' +
|
||||||
plugin.generateLoaderConfig(loaderPathsConfig, PATH_PREFIX);
|
allComponents
|
||||||
});
|
.map(function (component) {
|
||||||
}
|
return component.renderLoadingOptions();
|
||||||
RESOLVED_CORE.generateLoaderConfig(loaderPathsConfig, PATH_PREFIX);
|
})
|
||||||
|
.join('</li><li>') +
|
||||||
console.log('LOADER CONFIG: ');
|
'</li></ul>';
|
||||||
console.log(JSON.stringify(loaderPathsConfig, null, '\t'));
|
|
||||||
|
document.body.appendChild(div);
|
||||||
require.config({
|
|
||||||
paths: loaderPathsConfig,
|
let aElements = document.getElementsByTagName('a');
|
||||||
// 'vs/nls' : {
|
for (let i = 0; i < aElements.length; i++) {
|
||||||
// availableLanguages: {
|
let aElement = aElements[i];
|
||||||
// '*': 'de'
|
if (aElement.className === 'loading-opts') {
|
||||||
// }
|
aElement.href += window.location.search;
|
||||||
// }
|
}
|
||||||
});
|
}
|
||||||
|
})();
|
||||||
require(['vs/editor/editor.main'], function() {
|
|
||||||
if (!RESOLVED_CORE.isRelease()) {
|
self.getCodiconPath = function (PATH_PREFIX) {
|
||||||
// At this point we've loaded the monaco-editor-core
|
PATH_PREFIX = PATH_PREFIX || '';
|
||||||
require(RESOLVED_PLUGINS.map(function(plugin) { return plugin.contrib; }), function() {
|
const result = RESOLVED_CORE.getResolvedPath(PATH_PREFIX);
|
||||||
// At this point we've loaded all the plugins
|
return result + '/base/browser/ui/codicons/codicon/codicon.ttf';
|
||||||
callback();
|
};
|
||||||
});
|
|
||||||
} else {
|
self.loadEditor = function (callback, PATH_PREFIX) {
|
||||||
callback();
|
PATH_PREFIX = PATH_PREFIX || '';
|
||||||
}
|
|
||||||
});
|
loadScript(RESOLVED_CORE.getResolvedPath(PATH_PREFIX) + '/loader.js', function () {
|
||||||
});
|
let loaderPathsConfig = {};
|
||||||
}
|
if (!RESOLVED_CORE.isRelease()) {
|
||||||
})();
|
RESOLVED_PLUGINS.forEach(function (plugin) {
|
||||||
|
plugin.generateLoaderConfig(loaderPathsConfig, PATH_PREFIX);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
RESOLVED_CORE.generateLoaderConfig(loaderPathsConfig, PATH_PREFIX);
|
||||||
|
|
||||||
|
console.log('LOADER CONFIG: ');
|
||||||
|
console.log(JSON.stringify(loaderPathsConfig, null, '\t'));
|
||||||
|
|
||||||
|
require.config({
|
||||||
|
paths: loaderPathsConfig
|
||||||
|
// 'vs/nls' : {
|
||||||
|
// availableLanguages: {
|
||||||
|
// '*': 'de'
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
});
|
||||||
|
|
||||||
|
require(['vs/editor/editor.main'], function () {
|
||||||
|
if (!RESOLVED_CORE.isRelease()) {
|
||||||
|
// At this point we've loaded the monaco-editor-core
|
||||||
|
require(RESOLVED_PLUGINS.map(function (plugin) {
|
||||||
|
return plugin.contrib;
|
||||||
|
}), function () {
|
||||||
|
// At this point we've loaded all the plugins
|
||||||
|
callback();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
callback();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
})();
|
||||||
|
|||||||
@ -1,19 +1,21 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<div
|
||||||
<div id="container" style="float:left;width:800px;height:450px;border: 1px solid grey"></div>
|
id="container"
|
||||||
<div style="clear:both"></div>
|
style="float: left; width: 800px; height: 450px; border: 1px solid grey"
|
||||||
|
></div>
|
||||||
<script src="../metadata.js"></script>
|
<div style="clear: both"></div>
|
||||||
<script src="dev-setup.js"></script>
|
|
||||||
<script>
|
<script src="../metadata.js"></script>
|
||||||
loadEditor(function() {
|
<script src="dev-setup.js"></script>
|
||||||
require(['./diff'], function() {});
|
<script>
|
||||||
});
|
loadEditor(function () {
|
||||||
</script>
|
require(['./diff'], function () {});
|
||||||
</body>
|
});
|
||||||
</html>
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@ -1,454 +1,451 @@
|
|||||||
/// <reference path="../node_modules/monaco-editor-core/monaco.d.ts" />
|
/// <reference path="../../node_modules/monaco-editor-core/monaco.d.ts" />
|
||||||
define(['require'], function (require) {
|
define(['require'], function (require) {
|
||||||
|
var container = document.getElementById('container');
|
||||||
var container = document.getElementById('container');
|
|
||||||
|
var original = monaco.editor.createModel(getOriginalStr(), 'javascript');
|
||||||
var original = monaco.editor.createModel(getOriginalStr(), 'javascript');
|
var modified = monaco.editor.createModel(getModifiedStr(), 'javascript');
|
||||||
var modified = monaco.editor.createModel(getModifiedStr(), 'javascript');
|
|
||||||
|
var diffEditor = monaco.editor.createDiffEditor(container, {});
|
||||||
var diffEditor = monaco.editor.createDiffEditor(container, {
|
|
||||||
});
|
diffEditor.setModel({
|
||||||
|
original: original,
|
||||||
diffEditor.setModel({
|
modified: modified
|
||||||
original: original,
|
});
|
||||||
modified: modified
|
});
|
||||||
});
|
|
||||||
|
function getOriginalStr() {
|
||||||
});
|
return [
|
||||||
|
'/*',
|
||||||
function getOriginalStr() {
|
' © Microsoft. All rights reserved.',
|
||||||
return [
|
'',
|
||||||
'/*',
|
' This library is supported for use in Windows Tailored Apps only.',
|
||||||
' © Microsoft. All rights reserved.',
|
'',
|
||||||
'',
|
' Build: 6.2.8100.0',
|
||||||
' This library is supported for use in Windows Tailored Apps only.',
|
' Version: 0.5',
|
||||||
'',
|
'*/',
|
||||||
' Build: 6.2.8100.0',
|
'',
|
||||||
' Version: 0.5',
|
'(function (global, undefined) {',
|
||||||
'*/',
|
' "use strict";',
|
||||||
'',
|
' undefinedVariable = {};',
|
||||||
'(function (global, undefined) {',
|
' undefinedVariable.prop = 5;',
|
||||||
' "use strict";',
|
'',
|
||||||
' undefinedVariable = {};',
|
' function initializeProperties(target, members) {',
|
||||||
' undefinedVariable.prop = 5;',
|
' var keys = Object.keys(members);',
|
||||||
'',
|
' var properties;',
|
||||||
' function initializeProperties(target, members) {',
|
' var i, len;',
|
||||||
' var keys = Object.keys(members);',
|
' for (i = 0, len = keys.length; i < len; i++) {',
|
||||||
' var properties;',
|
' var key = keys[i];',
|
||||||
' var i, len;',
|
' var enumerable = key.charCodeAt(0) !== /*_*/95;',
|
||||||
' for (i = 0, len = keys.length; i < len; i++) {',
|
' var member = members[key];',
|
||||||
' var key = keys[i];',
|
" if (member && typeof member === 'object') {",
|
||||||
' var enumerable = key.charCodeAt(0) !== /*_*/95;',
|
" if (member.value !== undefined || typeof member.get === 'function' || typeof member.set === 'function') {",
|
||||||
' var member = members[key];',
|
' if (member.enumerable === undefined) {',
|
||||||
' if (member && typeof member === \'object\') {',
|
' member.enumerable = enumerable;',
|
||||||
' if (member.value !== undefined || typeof member.get === \'function\' || typeof member.set === \'function\') {',
|
' }',
|
||||||
' if (member.enumerable === undefined) {',
|
' properties = properties || {};',
|
||||||
' member.enumerable = enumerable;',
|
' properties[key] = member;',
|
||||||
' }',
|
' continue;',
|
||||||
' properties = properties || {};',
|
' }',
|
||||||
' properties[key] = member;',
|
' }',
|
||||||
' continue;',
|
' // These next lines will be deleted',
|
||||||
' }',
|
' if (!enumerable) {',
|
||||||
' }',
|
' properties = properties || {};',
|
||||||
' // These next lines will be deleted',
|
' properties[key] = { value: member, enumerable: enumerable, configurable: true, writable: true }',
|
||||||
' if (!enumerable) {',
|
' continue;',
|
||||||
' properties = properties || {};',
|
' }',
|
||||||
' properties[key] = { value: member, enumerable: enumerable, configurable: true, writable: true }',
|
' target[key] = member;',
|
||||||
' continue;',
|
' }',
|
||||||
' }',
|
' if (properties) {',
|
||||||
' target[key] = member;',
|
' Object.defineProperties(target, properties);',
|
||||||
' }',
|
' }',
|
||||||
' if (properties) {',
|
' }',
|
||||||
' Object.defineProperties(target, properties);',
|
'',
|
||||||
' }',
|
' (function (rootNamespace) {',
|
||||||
' }',
|
'',
|
||||||
'',
|
' // Create the rootNamespace in the global namespace',
|
||||||
' (function (rootNamespace) {',
|
' if (!global[rootNamespace]) {',
|
||||||
'',
|
' global[rootNamespace] = Object.create(Object.prototype);',
|
||||||
' // Create the rootNamespace in the global namespace',
|
' }',
|
||||||
' if (!global[rootNamespace]) {',
|
'',
|
||||||
' global[rootNamespace] = Object.create(Object.prototype);',
|
' // Cache the rootNamespace we just created in a local variable',
|
||||||
' }',
|
' var _rootNamespace = global[rootNamespace];',
|
||||||
'',
|
' if (!_rootNamespace.Namespace) {',
|
||||||
' // Cache the rootNamespace we just created in a local variable',
|
' _rootNamespace.Namespace = Object.create(Object.prototype);',
|
||||||
' var _rootNamespace = global[rootNamespace];',
|
' }',
|
||||||
' if (!_rootNamespace.Namespace) {',
|
'',
|
||||||
' _rootNamespace.Namespace = Object.create(Object.prototype);',
|
' function defineWithParent(parentNamespace, name, members) {',
|
||||||
' }',
|
' /// <summary locid="1">',
|
||||||
'',
|
' /// Defines a new namespace with the specified name, under the specified parent namespace.',
|
||||||
' function defineWithParent(parentNamespace, name, members) {',
|
' /// </summary>',
|
||||||
' /// <summary locid="1">',
|
' /// <param name="parentNamespace" type="Object" locid="2">',
|
||||||
' /// Defines a new namespace with the specified name, under the specified parent namespace.',
|
' /// The parent namespace which will contain the new namespace.',
|
||||||
' /// </summary>',
|
' /// </param>',
|
||||||
' /// <param name="parentNamespace" type="Object" locid="2">',
|
' /// <param name="name" type="String" locid="3">',
|
||||||
' /// The parent namespace which will contain the new namespace.',
|
' /// Name of the new namespace.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="name" type="String" locid="3">',
|
' /// <param name="members" type="Object" locid="4">',
|
||||||
' /// Name of the new namespace.',
|
' /// Members in the new namespace.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="members" type="Object" locid="4">',
|
' /// <returns locid="5">',
|
||||||
' /// Members in the new namespace.',
|
' /// The newly defined namespace.',
|
||||||
' /// </param>',
|
' /// </returns>',
|
||||||
' /// <returns locid="5">',
|
' var currentNamespace = parentNamespace,',
|
||||||
' /// The newly defined namespace.',
|
' namespaceFragments = name.split(".");',
|
||||||
' /// </returns>',
|
'',
|
||||||
' var currentNamespace = parentNamespace,',
|
' for (var i = 0, len = namespaceFragments.length; i < len; i++) {',
|
||||||
' namespaceFragments = name.split(".");',
|
' var namespaceName = namespaceFragments[i];',
|
||||||
'',
|
' if (!currentNamespace[namespaceName]) {',
|
||||||
' for (var i = 0, len = namespaceFragments.length; i < len; i++) {',
|
' Object.defineProperty(currentNamespace, namespaceName,',
|
||||||
' var namespaceName = namespaceFragments[i];',
|
' { value: {}, writable: false, enumerable: true, configurable: true }',
|
||||||
' if (!currentNamespace[namespaceName]) {',
|
' );',
|
||||||
' Object.defineProperty(currentNamespace, namespaceName,',
|
' }',
|
||||||
' { value: {}, writable: false, enumerable: true, configurable: true }',
|
' currentNamespace = currentNamespace[namespaceName];',
|
||||||
' );',
|
' }',
|
||||||
' }',
|
'',
|
||||||
' currentNamespace = currentNamespace[namespaceName];',
|
' if (members) {',
|
||||||
' }',
|
' initializeProperties(currentNamespace, members);',
|
||||||
'',
|
' }',
|
||||||
' if (members) {',
|
'',
|
||||||
' initializeProperties(currentNamespace, members);',
|
' return currentNamespace;',
|
||||||
' }',
|
' }',
|
||||||
'',
|
'',
|
||||||
' return currentNamespace;',
|
' function define(name, members) {',
|
||||||
' }',
|
' /// <summary locid="6">',
|
||||||
'',
|
' /// Defines a new namespace with the specified name.',
|
||||||
' function define(name, members) {',
|
' /// </summary>',
|
||||||
' /// <summary locid="6">',
|
' /// <param name="name" type="String" locid="7">',
|
||||||
' /// Defines a new namespace with the specified name.',
|
' /// Name of the namespace. This could be a dot-separated nested name.',
|
||||||
' /// </summary>',
|
' /// </param>',
|
||||||
' /// <param name="name" type="String" locid="7">',
|
' /// <param name="members" type="Object" locid="4">',
|
||||||
' /// Name of the namespace. This could be a dot-separated nested name.',
|
' /// Members in the new namespace.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="members" type="Object" locid="4">',
|
' /// <returns locid="5">',
|
||||||
' /// Members in the new namespace.',
|
' /// The newly defined namespace.',
|
||||||
' /// </param>',
|
' /// </returns>',
|
||||||
' /// <returns locid="5">',
|
' return defineWithParent(global, name, members);',
|
||||||
' /// The newly defined namespace.',
|
' }',
|
||||||
' /// </returns>',
|
'',
|
||||||
' return defineWithParent(global, name, members);',
|
' // Establish members of the "WinJS.Namespace" namespace',
|
||||||
' }',
|
' Object.defineProperties(_rootNamespace.Namespace, {',
|
||||||
'',
|
'',
|
||||||
' // Establish members of the "WinJS.Namespace" namespace',
|
' defineWithParent: { value: defineWithParent, writable: true, enumerable: true },',
|
||||||
' Object.defineProperties(_rootNamespace.Namespace, {',
|
'',
|
||||||
'',
|
' define: { value: define, writable: true, enumerable: true }',
|
||||||
' defineWithParent: { value: defineWithParent, writable: true, enumerable: true },',
|
'',
|
||||||
'',
|
' });',
|
||||||
' define: { value: define, writable: true, enumerable: true }',
|
'',
|
||||||
'',
|
' })("WinJS");',
|
||||||
' });',
|
'',
|
||||||
'',
|
' (function (WinJS) {',
|
||||||
' })("WinJS");',
|
'',
|
||||||
'',
|
' function define(constructor, instanceMembers, staticMembers) {',
|
||||||
' (function (WinJS) {',
|
' /// <summary locid="8">',
|
||||||
'',
|
' /// Defines a class using the given constructor and with the specified instance members.',
|
||||||
' function define(constructor, instanceMembers, staticMembers) {',
|
' /// </summary>',
|
||||||
' /// <summary locid="8">',
|
' /// <param name="constructor" type="Function" locid="9">',
|
||||||
' /// Defines a class using the given constructor and with the specified instance members.',
|
' /// A constructor function that will be used to instantiate this class.',
|
||||||
' /// </summary>',
|
' /// </param>',
|
||||||
' /// <param name="constructor" type="Function" locid="9">',
|
' /// <param name="instanceMembers" type="Object" locid="10">',
|
||||||
' /// A constructor function that will be used to instantiate this class.',
|
' /// The set of instance fields, properties and methods to be made available on the class.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="instanceMembers" type="Object" locid="10">',
|
' /// <param name="staticMembers" type="Object" locid="11">',
|
||||||
' /// The set of instance fields, properties and methods to be made available on the class.',
|
' /// The set of static fields, properties and methods to be made available on the class.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="staticMembers" type="Object" locid="11">',
|
' /// <returns type="Function" locid="12">',
|
||||||
' /// The set of static fields, properties and methods to be made available on the class.',
|
' /// The newly defined class.',
|
||||||
' /// </param>',
|
' /// </returns>',
|
||||||
' /// <returns type="Function" locid="12">',
|
' constructor = constructor || function () { };',
|
||||||
' /// The newly defined class.',
|
' if (instanceMembers) {',
|
||||||
' /// </returns>',
|
' initializeProperties(constructor.prototype, instanceMembers);',
|
||||||
' constructor = constructor || function () { };',
|
' }',
|
||||||
' if (instanceMembers) {',
|
' if (staticMembers) {',
|
||||||
' initializeProperties(constructor.prototype, instanceMembers);',
|
' initializeProperties(constructor, staticMembers);',
|
||||||
' }',
|
' }',
|
||||||
' if (staticMembers) {',
|
' return constructor;',
|
||||||
' initializeProperties(constructor, staticMembers);',
|
' }',
|
||||||
' }',
|
'',
|
||||||
' return constructor;',
|
' function derive(baseClass, constructor, instanceMembers, staticMembers) {',
|
||||||
' }',
|
' /// <summary locid="13">',
|
||||||
'',
|
' /// Uses prototypal inheritance to create a sub-class based on the supplied baseClass parameter.',
|
||||||
' function derive(baseClass, constructor, instanceMembers, staticMembers) {',
|
' /// </summary>',
|
||||||
' /// <summary locid="13">',
|
' /// <param name="baseClass" type="Function" locid="14">',
|
||||||
' /// Uses prototypal inheritance to create a sub-class based on the supplied baseClass parameter.',
|
' /// The class to inherit from.',
|
||||||
' /// </summary>',
|
' /// </param>',
|
||||||
' /// <param name="baseClass" type="Function" locid="14">',
|
' /// <param name="constructor" type="Function" locid="9">',
|
||||||
' /// The class to inherit from.',
|
' /// A constructor function that will be used to instantiate this class.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="constructor" type="Function" locid="9">',
|
' /// <param name="instanceMembers" type="Object" locid="10">',
|
||||||
' /// A constructor function that will be used to instantiate this class.',
|
' /// The set of instance fields, properties and methods to be made available on the class.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="instanceMembers" type="Object" locid="10">',
|
' /// <param name="staticMembers" type="Object" locid="11">',
|
||||||
' /// The set of instance fields, properties and methods to be made available on the class.',
|
' /// The set of static fields, properties and methods to be made available on the class.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="staticMembers" type="Object" locid="11">',
|
' /// <returns type="Function" locid="12">',
|
||||||
' /// The set of static fields, properties and methods to be made available on the class.',
|
' /// The newly defined class.',
|
||||||
' /// </param>',
|
' /// </returns>',
|
||||||
' /// <returns type="Function" locid="12">',
|
' if (baseClass) {',
|
||||||
' /// The newly defined class.',
|
' constructor = constructor || function () { };',
|
||||||
' /// </returns>',
|
' var basePrototype = baseClass.prototype;',
|
||||||
' if (baseClass) {',
|
' constructor.prototype = Object.create(basePrototype);',
|
||||||
' constructor = constructor || function () { };',
|
' Object.defineProperty(constructor.prototype, "_super", { value: basePrototype });',
|
||||||
' var basePrototype = baseClass.prototype;',
|
' Object.defineProperty(constructor.prototype, "constructor", { value: constructor });',
|
||||||
' constructor.prototype = Object.create(basePrototype);',
|
' if (instanceMembers) {',
|
||||||
' Object.defineProperty(constructor.prototype, "_super", { value: basePrototype });',
|
' initializeProperties(constructor.prototype, instanceMembers);',
|
||||||
' Object.defineProperty(constructor.prototype, "constructor", { value: constructor });',
|
' }',
|
||||||
' if (instanceMembers) {',
|
' if (staticMembers) {',
|
||||||
' initializeProperties(constructor.prototype, instanceMembers);',
|
' initializeProperties(constructor, staticMembers);',
|
||||||
' }',
|
' }',
|
||||||
' if (staticMembers) {',
|
' return constructor;',
|
||||||
' initializeProperties(constructor, staticMembers);',
|
' } else {',
|
||||||
' }',
|
' return define(constructor, instanceMembers, staticMembers);',
|
||||||
' return constructor;',
|
' }',
|
||||||
' } else {',
|
' }',
|
||||||
' return define(constructor, instanceMembers, staticMembers);',
|
'',
|
||||||
' }',
|
' function mix(constructor) {',
|
||||||
' }',
|
' /// <summary locid="15">',
|
||||||
'',
|
' /// Defines a class using the given constructor and the union of the set of instance members',
|
||||||
' function mix(constructor) {',
|
' /// specified by all the mixin objects. The mixin parameter list can be of variable length.',
|
||||||
' /// <summary locid="15">',
|
' /// </summary>',
|
||||||
' /// Defines a class using the given constructor and the union of the set of instance members',
|
' /// <param name="constructor" locid="9">',
|
||||||
' /// specified by all the mixin objects. The mixin parameter list can be of variable length.',
|
' /// A constructor function that will be used to instantiate this class.',
|
||||||
' /// </summary>',
|
' /// </param>',
|
||||||
' /// <param name="constructor" locid="9">',
|
' /// <returns locid="12">',
|
||||||
' /// A constructor function that will be used to instantiate this class.',
|
' /// The newly defined class.',
|
||||||
' /// </param>',
|
' /// </returns>',
|
||||||
' /// <returns locid="12">',
|
' constructor = constructor || function () { };',
|
||||||
' /// The newly defined class.',
|
' var i, len;',
|
||||||
' /// </returns>',
|
' for (i = 0, len = arguments.length; i < len; i++) {',
|
||||||
' constructor = constructor || function () { };',
|
' initializeProperties(constructor.prototype, arguments[i]);',
|
||||||
' var i, len;',
|
' }',
|
||||||
' for (i = 0, len = arguments.length; i < len; i++) {',
|
' return constructor;',
|
||||||
' initializeProperties(constructor.prototype, arguments[i]);',
|
' }',
|
||||||
' }',
|
'',
|
||||||
' return constructor;',
|
' // Establish members of "WinJS.Class" namespace',
|
||||||
' }',
|
' WinJS.Namespace.define("WinJS.Class", {',
|
||||||
'',
|
' define: define,',
|
||||||
' // Establish members of "WinJS.Class" namespace',
|
' derive: derive,',
|
||||||
' WinJS.Namespace.define("WinJS.Class", {',
|
' mix: mix',
|
||||||
' define: define,',
|
' });',
|
||||||
' derive: derive,',
|
'',
|
||||||
' mix: mix',
|
' })(WinJS);',
|
||||||
' });',
|
'',
|
||||||
'',
|
'})(this);'
|
||||||
' })(WinJS);',
|
].join('\n');
|
||||||
'',
|
}
|
||||||
'})(this);'
|
|
||||||
].join('\n');
|
function getModifiedStr() {
|
||||||
}
|
return [
|
||||||
|
'/*',
|
||||||
function getModifiedStr() {
|
' © Microsoft. All rights reserved.',
|
||||||
return [
|
'',
|
||||||
'/*',
|
' This library is supported for use in Windows Tailored Apps only.',
|
||||||
' © Microsoft. All rights reserved.',
|
'',
|
||||||
'',
|
' Build: 6.2.8100.0',
|
||||||
' This library is supported for use in Windows Tailored Apps only.',
|
' Version: 0.5',
|
||||||
'',
|
'*/',
|
||||||
' Build: 6.2.8100.0',
|
'',
|
||||||
' Version: 0.5',
|
'// Here are some inserted lines',
|
||||||
'*/',
|
'// with some extra comments',
|
||||||
'',
|
'',
|
||||||
'// Here are some inserted lines',
|
'(function (global, undefined) {',
|
||||||
'// with some extra comments',
|
' "use strict";',
|
||||||
'',
|
' var definedVariable = {};',
|
||||||
'(function (global, undefined) {',
|
' definedVariable.prop = 5;',
|
||||||
' "use strict";',
|
'',
|
||||||
' var definedVariable = {};',
|
' function initializeProperties(target, members) {',
|
||||||
' definedVariable.prop = 5;',
|
' var keys = Object.keys(members);',
|
||||||
'',
|
' var properties;',
|
||||||
' function initializeProperties(target, members) {',
|
' var i, len;',
|
||||||
' var keys = Object.keys(members);',
|
' for (i = 0, len = keys.length; i < len; i++) {',
|
||||||
' var properties;',
|
' var key = keys[i];',
|
||||||
' var i, len;',
|
' var enumerable = key.charCodeAt(0) !== /*_*/95;',
|
||||||
' for (i = 0, len = keys.length; i < len; i++) {',
|
' var member = members[key];',
|
||||||
' var key = keys[i];',
|
" if (member && typeof member === 'object') {",
|
||||||
' var enumerable = key.charCodeAt(0) !== /*_*/95;',
|
" if (member.value !== undefined || typeof member.get === 'function' || typeof member.set === 'function') {",
|
||||||
' var member = members[key];',
|
' if (member.enumerable === undefined) {',
|
||||||
' if (member && typeof member === \'object\') {',
|
' member.enumerable = enumerable;',
|
||||||
' if (member.value !== undefined || typeof member.get === \'function\' || typeof member.set === \'function\') {',
|
' }',
|
||||||
' if (member.enumerable === undefined) {',
|
' properties = properties || {};',
|
||||||
' member.enumerable = enumerable;',
|
' properties[key] = member;',
|
||||||
' }',
|
' continue;',
|
||||||
' properties = properties || {};',
|
' }',
|
||||||
' properties[key] = member;',
|
' }',
|
||||||
' continue;',
|
' target[key] = member;',
|
||||||
' }',
|
' }',
|
||||||
' }',
|
' if (properties) {',
|
||||||
' target[key] = member;',
|
' Object.defineProperties(target, properties);',
|
||||||
' }',
|
' }',
|
||||||
' if (properties) {',
|
' }',
|
||||||
' Object.defineProperties(target, properties);',
|
'',
|
||||||
' }',
|
' (function (rootNamespace) {',
|
||||||
' }',
|
'',
|
||||||
'',
|
' // Create the rootNamespace in the global namespace',
|
||||||
' (function (rootNamespace) {',
|
' if (!global[rootNamespace]) {',
|
||||||
'',
|
' global[rootNamespace] = Object.create(Object.prototype);',
|
||||||
' // Create the rootNamespace in the global namespace',
|
' }',
|
||||||
' if (!global[rootNamespace]) {',
|
'',
|
||||||
' global[rootNamespace] = Object.create(Object.prototype);',
|
' // Cache the rootNamespace we just created in a local variable',
|
||||||
' }',
|
' var _rootNamespace = global[rootNamespace];',
|
||||||
'',
|
' if (!_rootNamespace.Namespace) {',
|
||||||
' // Cache the rootNamespace we just created in a local variable',
|
' _rootNamespace.Namespace = Object.create(Object.prototype);',
|
||||||
' var _rootNamespace = global[rootNamespace];',
|
' }',
|
||||||
' if (!_rootNamespace.Namespace) {',
|
'',
|
||||||
' _rootNamespace.Namespace = Object.create(Object.prototype);',
|
' function defineWithParent(parentNamespace, name, members) {',
|
||||||
' }',
|
' /// <summary locid="1">',
|
||||||
'',
|
' /// Defines a new namespace with the specified name, under the specified parent namespace.',
|
||||||
' function defineWithParent(parentNamespace, name, members) {',
|
' /// </summary>',
|
||||||
' /// <summary locid="1">',
|
' /// <param name="parentNamespace" type="Object" locid="2">',
|
||||||
' /// Defines a new namespace with the specified name, under the specified parent namespace.',
|
' /// The parent namespace which will contain the new namespace.',
|
||||||
' /// </summary>',
|
' /// </param>',
|
||||||
' /// <param name="parentNamespace" type="Object" locid="2">',
|
' /// <param name="name" type="String" locid="3">',
|
||||||
' /// The parent namespace which will contain the new namespace.',
|
' /// Name of the new namespace.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="name" type="String" locid="3">',
|
' /// <param name="members" type="Object" locid="4">',
|
||||||
' /// Name of the new namespace.',
|
' /// Members in the new namespace.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="members" type="Object" locid="4">',
|
' /// <returns locid="5">',
|
||||||
' /// Members in the new namespace.',
|
' /// The newly defined namespace.',
|
||||||
' /// </param>',
|
' /// </returns>',
|
||||||
' /// <returns locid="5">',
|
' var currentNamespace = parentNamespace,',
|
||||||
' /// The newly defined namespace.',
|
' namespaceFragments = name.split(".");',
|
||||||
' /// </returns>',
|
'',
|
||||||
' var currentNamespace = parentNamespace,',
|
' for (var i = 0, len = namespaceFragments.length; i < len; i++) {',
|
||||||
' namespaceFragments = name.split(".");',
|
' var namespaceName = namespaceFragments[i];',
|
||||||
'',
|
' if (!currentNamespace[namespaceName]) {',
|
||||||
' for (var i = 0, len = namespaceFragments.length; i < len; i++) {',
|
' Object.defineProperty(currentNamespace, namespaceName,',
|
||||||
' var namespaceName = namespaceFragments[i];',
|
' { value: {}, writable: false, enumerable: true, configurable: true }',
|
||||||
' if (!currentNamespace[namespaceName]) {',
|
' );',
|
||||||
' Object.defineProperty(currentNamespace, namespaceName,',
|
' }',
|
||||||
' { value: {}, writable: false, enumerable: true, configurable: true }',
|
' currentNamespace = currentNamespace[namespaceName];',
|
||||||
' );',
|
' }',
|
||||||
' }',
|
'',
|
||||||
' currentNamespace = currentNamespace[namespaceName];',
|
' if (members) {',
|
||||||
' }',
|
' initializeProperties(currentNamespace, members);',
|
||||||
'',
|
' }',
|
||||||
' if (members) {',
|
'',
|
||||||
' initializeProperties(currentNamespace, members);',
|
' return currentNamespace;',
|
||||||
' }',
|
' }',
|
||||||
'',
|
'',
|
||||||
' return currentNamespace;',
|
' function define(name, members) {',
|
||||||
' }',
|
' /// <summary locid="6">',
|
||||||
'',
|
' /// Defines a new namespace with the specified name.',
|
||||||
' function define(name, members) {',
|
' /// </summary>',
|
||||||
' /// <summary locid="6">',
|
' /// <param name="name" type="String" locid="7">',
|
||||||
' /// Defines a new namespace with the specified name.',
|
' /// Name of the namespace. This could be a dot-separated nested name.',
|
||||||
' /// </summary>',
|
' /// </param>',
|
||||||
' /// <param name="name" type="String" locid="7">',
|
' /// <param name="members" type="Object" locid="4">',
|
||||||
' /// Name of the namespace. This could be a dot-separated nested name.',
|
' /// Members in the new namespace.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="members" type="Object" locid="4">',
|
' /// <returns locid="5">',
|
||||||
' /// Members in the new namespace.',
|
' /// The newly defined namespace.',
|
||||||
' /// </param>',
|
' /// </returns>',
|
||||||
' /// <returns locid="5">',
|
' return defineWithParent(global, name, members);',
|
||||||
' /// The newly defined namespace.',
|
' }',
|
||||||
' /// </returns>',
|
'',
|
||||||
' return defineWithParent(global, name, members);',
|
' // Establish members of the "WinJS.Namespace" namespace',
|
||||||
' }',
|
' Object.defineProperties(_rootNamespace.Namespace, {',
|
||||||
'',
|
'',
|
||||||
' // Establish members of the "WinJS.Namespace" namespace',
|
' defineWithParent: { value: defineWithParent, writable: true, enumerable: true },',
|
||||||
' Object.defineProperties(_rootNamespace.Namespace, {',
|
'',
|
||||||
'',
|
' define: { value: define, writable: true, enumerable: true }',
|
||||||
' defineWithParent: { value: defineWithParent, writable: true, enumerable: true },',
|
'',
|
||||||
'',
|
' });',
|
||||||
' define: { value: define, writable: true, enumerable: true }',
|
'',
|
||||||
'',
|
' })("WinJS");',
|
||||||
' });',
|
'',
|
||||||
'',
|
' (function (WinJS) {',
|
||||||
' })("WinJS");',
|
'',
|
||||||
'',
|
' function define(constructor, instanceMembers, staticMembers) {',
|
||||||
' (function (WinJS) {',
|
' /// <summary locid="8">',
|
||||||
'',
|
' /// Defines a class using the given constructor and with the specified instance members.',
|
||||||
' function define(constructor, instanceMembers, staticMembers) {',
|
' /// </summary>',
|
||||||
' /// <summary locid="8">',
|
' /// <param name="constructor" type="Function" locid="9">',
|
||||||
' /// Defines a class using the given constructor and with the specified instance members.',
|
' /// A constructor function that will be used to instantiate this class.',
|
||||||
' /// </summary>',
|
' /// </param>',
|
||||||
' /// <param name="constructor" type="Function" locid="9">',
|
' /// <param name="instanceMembers" type="Object" locid="10">',
|
||||||
' /// A constructor function that will be used to instantiate this class.',
|
' /// The set of instance fields, properties and methods to be made available on the class.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="instanceMembers" type="Object" locid="10">',
|
' /// <param name="staticMembers" type="Object" locid="11">',
|
||||||
' /// The set of instance fields, properties and methods to be made available on the class.',
|
' /// The set of static fields, properties and methods to be made available on the class.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="staticMembers" type="Object" locid="11">',
|
' /// <returns type="Function" locid="12">',
|
||||||
' /// The set of static fields, properties and methods to be made available on the class.',
|
' /// The newly defined class.',
|
||||||
' /// </param>',
|
' /// </returns>',
|
||||||
' /// <returns type="Function" locid="12">',
|
' constructor = constructor || function () { };',
|
||||||
' /// The newly defined class.',
|
' if (instanceMembers) {',
|
||||||
' /// </returns>',
|
' initializeProperties(constructor.prototype, instanceMembers);',
|
||||||
' constructor = constructor || function () { };',
|
' }',
|
||||||
' if (instanceMembers) {',
|
' if (staticMembers) {',
|
||||||
' initializeProperties(constructor.prototype, instanceMembers);',
|
' initializeProperties(constructor, staticMembers);',
|
||||||
' }',
|
' }',
|
||||||
' if (staticMembers) {',
|
' return constructor;',
|
||||||
' initializeProperties(constructor, staticMembers);',
|
' }',
|
||||||
' }',
|
'',
|
||||||
' return constructor;',
|
' function derive(baseClass, constructor, instanceMembers, staticMembers) {',
|
||||||
' }',
|
' /// <summary locid="13">',
|
||||||
'',
|
' /// Uses prototypal inheritance to create a sub-class based on the supplied baseClass parameter.',
|
||||||
' function derive(baseClass, constructor, instanceMembers, staticMembers) {',
|
' /// </summary>',
|
||||||
' /// <summary locid="13">',
|
' /// <param name="baseClass" type="Function" locid="14">',
|
||||||
' /// Uses prototypal inheritance to create a sub-class based on the supplied baseClass parameter.',
|
' /// The class to inherit from.',
|
||||||
' /// </summary>',
|
' /// </param>',
|
||||||
' /// <param name="baseClass" type="Function" locid="14">',
|
' /// <param name="constructor" type="Function" locid="9">',
|
||||||
' /// The class to inherit from.',
|
' /// A constructor function that will be used to instantiate this class.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="constructor" type="Function" locid="9">',
|
' /// <param name="instanceMembers" type="Object" locid="10">',
|
||||||
' /// A constructor function that will be used to instantiate this class.',
|
' /// The set of instance fields, properties and methods to be made available on the class.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="instanceMembers" type="Object" locid="10">',
|
' /// <param name="staticMembers" type="Object" locid="11">',
|
||||||
' /// The set of instance fields, properties and methods to be made available on the class.',
|
' /// The set of static fields, properties and methods to be made available on the class.',
|
||||||
' /// </param>',
|
' /// </param>',
|
||||||
' /// <param name="staticMembers" type="Object" locid="11">',
|
' /// <returns type="Function" locid="12">',
|
||||||
' /// The set of static fields, properties and methods to be made available on the class.',
|
' /// The newly defined class.',
|
||||||
' /// </param>',
|
' /// </returns>',
|
||||||
' /// <returns type="Function" locid="12">',
|
' if (baseClass) {',
|
||||||
' /// The newly defined class.',
|
' constructor = constructor || function () { };',
|
||||||
' /// </returns>',
|
' var basePrototype = baseClass.prototype;',
|
||||||
' if (baseClass) {',
|
' constructor.prototype = Object.create(basePrototype);',
|
||||||
' constructor = constructor || function () { };',
|
' Object.defineProperty(constructor.prototype, "_super", { value: basePrototype });',
|
||||||
' var basePrototype = baseClass.prototype;',
|
' Object.defineProperty(constructor.prototype, "constructor", { value: constructor });',
|
||||||
' constructor.prototype = Object.create(basePrototype);',
|
' if (instanceMembers) {',
|
||||||
' Object.defineProperty(constructor.prototype, "_super", { value: basePrototype });',
|
' initializeProperties(constructor.prototype, instanceMembers);',
|
||||||
' Object.defineProperty(constructor.prototype, "constructor", { value: constructor });',
|
' }',
|
||||||
' if (instanceMembers) {',
|
' if (staticMembers) {',
|
||||||
' initializeProperties(constructor.prototype, instanceMembers);',
|
' initializeProperties(constructor, staticMembers);',
|
||||||
' }',
|
' }',
|
||||||
' if (staticMembers) {',
|
' return constructor;',
|
||||||
' initializeProperties(constructor, staticMembers);',
|
' } else {',
|
||||||
' }',
|
' return define(constructor, instanceMembers, staticMembers);',
|
||||||
' return constructor;',
|
' }',
|
||||||
' } else {',
|
' }',
|
||||||
' return define(constructor, instanceMembers, staticMembers);',
|
'',
|
||||||
' }',
|
' function mix(constructor) {',
|
||||||
' }',
|
' /// <summary locid="15">',
|
||||||
'',
|
' /// Defines a class using the given constructor and the union of the set of instance members',
|
||||||
' function mix(constructor) {',
|
' /// specified by all the mixin objects. The mixin parameter list can be of variable length.',
|
||||||
' /// <summary locid="15">',
|
' /// </summary>',
|
||||||
' /// Defines a class using the given constructor and the union of the set of instance members',
|
' /// <param name="constructor" locid="9">',
|
||||||
' /// specified by all the mixin objects. The mixin parameter list can be of variable length.',
|
' /// A constructor function that will be used to instantiate this class.',
|
||||||
' /// </summary>',
|
' /// </param>',
|
||||||
' /// <param name="constructor" locid="9">',
|
' /// <returns locid="12">',
|
||||||
' /// A constructor function that will be used to instantiate this class.',
|
' /// The newly defined class.',
|
||||||
' /// </param>',
|
' /// </returns>',
|
||||||
' /// <returns locid="12">',
|
' constructor = constructor || function () { };',
|
||||||
' /// The newly defined class.',
|
' var i, len;',
|
||||||
' /// </returns>',
|
' for (i = 0, len = arguments.length; i < len; i++) {',
|
||||||
' constructor = constructor || function () { };',
|
' initializeProperties(constructor.prototype, arguments[i]);',
|
||||||
' var i, len;',
|
' }',
|
||||||
' for (i = 0, len = arguments.length; i < len; i++) {',
|
' return constructor;',
|
||||||
' initializeProperties(constructor.prototype, arguments[i]);',
|
' }',
|
||||||
' }',
|
'',
|
||||||
' return constructor;',
|
' // Establish members of "WinJS.Class" namespace',
|
||||||
' }',
|
' WinJS.Namespace.define("WinJS.Class", {',
|
||||||
'',
|
' define: define,',
|
||||||
' // Establish members of "WinJS.Class" namespace',
|
' derive: derive,',
|
||||||
' WinJS.Namespace.define("WinJS.Class", {',
|
' mix: mix',
|
||||||
' define: define,',
|
' });',
|
||||||
' derive: derive,',
|
'',
|
||||||
' mix: mix',
|
' })(WinJS);',
|
||||||
' });',
|
'',
|
||||||
'',
|
'})(this);'
|
||||||
' })(WinJS);',
|
].join('\n');
|
||||||
'',
|
}
|
||||||
'})(this);',
|
|
||||||
].join('\n');
|
|
||||||
}
|
|
||||||
|
|||||||
@ -1,14 +1,14 @@
|
|||||||
.monaco-editor .token.custom-info {
|
.monaco-editor .token.custom-info {
|
||||||
color: grey !important;
|
color: grey !important;
|
||||||
}
|
}
|
||||||
.monaco-editor .token.custom-error {
|
.monaco-editor .token.custom-error {
|
||||||
color: red !important;
|
color: red !important;
|
||||||
font-weight: bold !important;
|
font-weight: bold !important;
|
||||||
font-size: 1.2em !important;
|
font-size: 1.2em !important;
|
||||||
}
|
}
|
||||||
.monaco-editor .token.custom-notice {
|
.monaco-editor .token.custom-notice {
|
||||||
color: orange !important;
|
color: orange !important;
|
||||||
}
|
}
|
||||||
.monaco-editor .token.custom-date {
|
.monaco-editor .token.custom-date {
|
||||||
color: green !important;
|
color: green !important;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,45 +1,50 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||||
<link rel="stylesheet" href="./index.css" />
|
<link rel="stylesheet" href="./index.css" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
Jump to:
|
||||||
Jump to:
|
<a class="loading-opts" href="./smoketest.html">[SMOKETEST]</a>
|
||||||
<a class="loading-opts" href="./smoketest.html">[SMOKETEST]</a>
|
 | 
|
||||||
 | 
|
<a class="loading-opts" href="./playground.generated/index.html">[PLAYGROUND]</a>
|
||||||
<a class="loading-opts" href="./playground.generated/index.html">[PLAYGROUND]</a>
|
 | 
|
||||||
 | 
|
<a class="loading-opts" href="./mouse-fixed.html">[fixed element]</a>
|
||||||
<a class="loading-opts" href="./mouse-fixed.html">[fixed element]</a>
|
 | 
|
||||||
 | 
|
<a class="loading-opts" href="./mouse-scrollable-body.html">[scrollable body]</a>
|
||||||
<a class="loading-opts" href="./mouse-scrollable-body.html">[scrollable body]</a>
|
 | 
|
||||||
 | 
|
<a class="loading-opts" href="./mouse-scrollable-element.html">[scrollable element]</a><br />
|
||||||
<a class="loading-opts" href="./mouse-scrollable-element.html">[scrollable element]</a><br/>
|
 | 
|
||||||
 | 
|
<a class="loading-opts" href="./shadow-dom.html">[Shadow DOM]</a>
|
||||||
<a class="loading-opts" href="./shadow-dom.html">[Shadow DOM]</a>
|
 | 
|
||||||
 | 
|
<a class="loading-opts" href="./colorize.html">[colorize element]</a>
|
||||||
<a class="loading-opts" href="./colorize.html">[colorize element]</a>
|
 | 
|
||||||
 | 
|
<a class="loading-opts" href="./cross-origin-broken.html">[cross origin broken]</a>
|
||||||
<a class="loading-opts" href="./cross-origin-broken.html">[cross origin broken]</a>
|
 | 
|
||||||
 | 
|
<a class="loading-opts" href="./cross-origin-good.html">[cross origin good]</a>
|
||||||
<a class="loading-opts" href="./cross-origin-good.html">[cross origin good]</a>
|
 | 
|
||||||
 | 
|
<a class="loading-opts" href="./diff.html">[diff]</a>
|
||||||
<a class="loading-opts" href="./diff.html">[diff]</a>
|
<br /><br />
|
||||||
<br/><br/>
|
|
||||||
|
<div id="bar" style="margin-bottom: 6px"></div>
|
||||||
<div id="bar" style="margin-bottom: 6px;"></div>
|
<div style="clear: both"></div>
|
||||||
<div style="clear:both"></div>
|
<div
|
||||||
<div id="container" style="float:left;width:800px;height:450px;border: 1px solid grey"></div>
|
id="container"
|
||||||
<div id="options" style="float:left;width:220px;height:450px;border: 1px solid grey"></div>
|
style="float: left; width: 800px; height: 450px; border: 1px solid grey"
|
||||||
<div style="clear:both"></div>
|
></div>
|
||||||
|
<div
|
||||||
<script src="../metadata.js"></script>
|
id="options"
|
||||||
<script src="dev-setup.js"></script>
|
style="float: left; width: 220px; height: 450px; border: 1px solid grey"
|
||||||
<script>
|
></div>
|
||||||
loadEditor(function() {
|
<div style="clear: both"></div>
|
||||||
require(['./index'], function() {});
|
|
||||||
});
|
<script src="../metadata.js"></script>
|
||||||
</script>
|
<script src="dev-setup.js"></script>
|
||||||
</body>
|
<script>
|
||||||
</html>
|
loadEditor(function () {
|
||||||
|
require(['./index'], function () {});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@ -1,396 +1,428 @@
|
|||||||
/// <reference path="../node_modules/monaco-editor-core/monaco.d.ts" />
|
/// <reference path="../../node_modules/monaco-editor-core/monaco.d.ts" />
|
||||||
/// <reference path="../node_modules/monaco-typescript/monaco.d.ts" />
|
/// <reference path="../../monaco-typescript/monaco.d.ts" />
|
||||||
define(['require', './samples'], function(require, SAMPLES) {
|
define(['require', './samples'], function (require, SAMPLES) {
|
||||||
|
var domutils = require('vs/base/browser/dom');
|
||||||
var domutils = require('vs/base/browser/dom');
|
|
||||||
|
var model = monaco.editor.createModel('', 'plaintext');
|
||||||
var model = monaco.editor.createModel('', 'plaintext');
|
|
||||||
|
monaco.languages.typescript.typescriptDefaults.setInlayHintsOptions({
|
||||||
monaco.languages.typescript.typescriptDefaults.setInlayHintsOptions({
|
includeInlayParameterNameHints: 'all',
|
||||||
includeInlayParameterNameHints: 'all',
|
includeInlayParameterNameHintsWhenArgumentMatchesName: true,
|
||||||
includeInlayParameterNameHintsWhenArgumentMatchesName: true,
|
includeInlayFunctionParameterTypeHints: true,
|
||||||
includeInlayFunctionParameterTypeHints: true,
|
includeInlayVariableTypeHints: true,
|
||||||
includeInlayVariableTypeHints: true,
|
includeInlayPropertyDeclarationTypeHints: true,
|
||||||
includeInlayPropertyDeclarationTypeHints: true,
|
includeInlayFunctionLikeReturnTypeHints: true,
|
||||||
includeInlayFunctionLikeReturnTypeHints: true,
|
includeInlayEnumMemberValueHints: true
|
||||||
includeInlayEnumMemberValueHints: true
|
});
|
||||||
});
|
|
||||||
|
var editor = monaco.editor.create(document.getElementById('container'), {
|
||||||
var editor = monaco.editor.create(document.getElementById('container'), {
|
model: model,
|
||||||
model: model,
|
glyphMargin: true,
|
||||||
glyphMargin: true,
|
renderWhitespace: true
|
||||||
renderWhitespace: true
|
});
|
||||||
});
|
|
||||||
|
editor.addCommand(
|
||||||
editor.addCommand({
|
{
|
||||||
ctrlCmd: true,
|
ctrlCmd: true,
|
||||||
key: 'F9'
|
key: 'F9'
|
||||||
}, function(ctx, args) {
|
},
|
||||||
alert('Command Running!!');
|
function (ctx, args) {
|
||||||
console.log(ctx);
|
alert('Command Running!!');
|
||||||
});
|
console.log(ctx);
|
||||||
|
}
|
||||||
editor.addAction({
|
);
|
||||||
id: 'my-unique-id',
|
|
||||||
label: 'My Label!!!',
|
editor.addAction({
|
||||||
keybindings: [monaco.KeyMod.CtrlCmd | monaco.KeyCode.F10],
|
id: 'my-unique-id',
|
||||||
contextMenuGroupId: 'navigation',
|
label: 'My Label!!!',
|
||||||
contextMenuOrder: 2.5,
|
keybindings: [monaco.KeyMod.CtrlCmd | monaco.KeyCode.F10],
|
||||||
run: function(ed) {
|
contextMenuGroupId: 'navigation',
|
||||||
console.log("i'm running => " + ed.getPosition());
|
contextMenuOrder: 2.5,
|
||||||
}
|
run: function (ed) {
|
||||||
});
|
console.log("i'm running => " + ed.getPosition());
|
||||||
|
}
|
||||||
var currentSamplePromise = null;
|
});
|
||||||
var samplesData = {};
|
|
||||||
SAMPLES.sort(function(a,b) {
|
var currentSamplePromise = null;
|
||||||
return a.name.localeCompare(b.name);
|
var samplesData = {};
|
||||||
}).forEach(function(sample) {
|
SAMPLES.sort(function (a, b) {
|
||||||
samplesData[sample.name] = function() {
|
return a.name.localeCompare(b.name);
|
||||||
if (currentSamplePromise !== null) {
|
}).forEach(function (sample) {
|
||||||
currentSamplePromise.cancel();
|
samplesData[sample.name] = function () {
|
||||||
currentSamplePromise = null;
|
if (currentSamplePromise !== null) {
|
||||||
}
|
currentSamplePromise.cancel();
|
||||||
currentSamplePromise = sample.loadText().then(function(modelText) {
|
currentSamplePromise = null;
|
||||||
currentSamplePromise = null;
|
}
|
||||||
updateEditor(sample.mimeType, modelText, sample.name);
|
currentSamplePromise = sample.loadText().then(function (modelText) {
|
||||||
});
|
currentSamplePromise = null;
|
||||||
}
|
updateEditor(sample.mimeType, modelText, sample.name);
|
||||||
});
|
});
|
||||||
var examplesComboBox = new ComboBox('Template', samplesData);
|
};
|
||||||
|
});
|
||||||
|
var examplesComboBox = new ComboBox('Template', samplesData);
|
||||||
var modesData = {};
|
|
||||||
monaco.languages.getLanguages().forEach(function(language) {
|
var modesData = {};
|
||||||
modesData[language.id] = updateEditor.bind(this, language.id);
|
monaco.languages.getLanguages().forEach(function (language) {
|
||||||
});
|
modesData[language.id] = updateEditor.bind(this, language.id);
|
||||||
var modesComboBox = new ComboBox('Mode', modesData);
|
});
|
||||||
|
var modesComboBox = new ComboBox('Mode', modesData);
|
||||||
|
|
||||||
var themesData = {};
|
var themesData = {};
|
||||||
themesData['vs'] = function() { monaco.editor.setTheme('vs') };
|
themesData['vs'] = function () {
|
||||||
themesData['vs-dark'] = function() { monaco.editor.setTheme('vs-dark') };
|
monaco.editor.setTheme('vs');
|
||||||
themesData['hc-black'] = function() { monaco.editor.setTheme('hc-black') };
|
};
|
||||||
var themesComboBox = new ComboBox('Theme', themesData);
|
themesData['vs-dark'] = function () {
|
||||||
|
monaco.editor.setTheme('vs-dark');
|
||||||
|
};
|
||||||
// Do it in a timeout to simplify profiles
|
themesData['hc-black'] = function () {
|
||||||
window.setTimeout(function () {
|
monaco.editor.setTheme('hc-black');
|
||||||
var START_SAMPLE = 'Y___DefaultJS';
|
};
|
||||||
|
var themesComboBox = new ComboBox('Theme', themesData);
|
||||||
var url_matches = location.search.match(/sample=([^?&]+)/i);
|
|
||||||
if (url_matches) {
|
// Do it in a timeout to simplify profiles
|
||||||
START_SAMPLE = url_matches[1];
|
window.setTimeout(function () {
|
||||||
}
|
var START_SAMPLE = 'Y___DefaultJS';
|
||||||
|
|
||||||
if (location.hash) {
|
var url_matches = location.search.match(/sample=([^?&]+)/i);
|
||||||
START_SAMPLE = location.hash.replace(/^\#/, '');
|
if (url_matches) {
|
||||||
START_SAMPLE = decodeURIComponent(START_SAMPLE);
|
START_SAMPLE = url_matches[1];
|
||||||
}
|
}
|
||||||
|
|
||||||
samplesData[START_SAMPLE]();
|
if (location.hash) {
|
||||||
examplesComboBox.set(START_SAMPLE);
|
START_SAMPLE = location.hash.replace(/^\#/, '');
|
||||||
|
START_SAMPLE = decodeURIComponent(START_SAMPLE);
|
||||||
createOptions(editor);
|
}
|
||||||
createToolbar(editor);
|
|
||||||
}, 0);
|
samplesData[START_SAMPLE]();
|
||||||
|
examplesComboBox.set(START_SAMPLE);
|
||||||
|
|
||||||
function updateEditor(mode, value, sampleName) {
|
createOptions(editor);
|
||||||
if (sampleName) {
|
createToolbar(editor);
|
||||||
window.location.hash = sampleName;
|
}, 0);
|
||||||
}
|
|
||||||
|
function updateEditor(mode, value, sampleName) {
|
||||||
if (typeof value !== 'undefined') {
|
if (sampleName) {
|
||||||
var oldModel = model;
|
window.location.hash = sampleName;
|
||||||
model = monaco.editor.createModel(value, mode);
|
}
|
||||||
editor.setModel(model);
|
|
||||||
if (oldModel) {
|
if (typeof value !== 'undefined') {
|
||||||
oldModel.dispose();
|
var oldModel = model;
|
||||||
}
|
model = monaco.editor.createModel(value, mode);
|
||||||
} else {
|
editor.setModel(model);
|
||||||
monaco.editor.setModelLanguage(model, mode);
|
if (oldModel) {
|
||||||
}
|
oldModel.dispose();
|
||||||
|
}
|
||||||
modesComboBox.set(mode);
|
} else {
|
||||||
}
|
monaco.editor.setModelLanguage(model, mode);
|
||||||
|
}
|
||||||
|
|
||||||
function createToolbar(editor) {
|
modesComboBox.set(mode);
|
||||||
var bar = document.getElementById('bar');
|
}
|
||||||
|
|
||||||
bar.appendChild(examplesComboBox.domNode);
|
function createToolbar(editor) {
|
||||||
|
var bar = document.getElementById('bar');
|
||||||
bar.appendChild(modesComboBox.domNode);
|
|
||||||
|
bar.appendChild(examplesComboBox.domNode);
|
||||||
bar.appendChild(themesComboBox.domNode);
|
|
||||||
|
bar.appendChild(modesComboBox.domNode);
|
||||||
bar.appendChild(createButton("Dispose all", function (e) {
|
|
||||||
editor.dispose();
|
bar.appendChild(themesComboBox.domNode);
|
||||||
editor = null;
|
|
||||||
if (model) {
|
bar.appendChild(
|
||||||
model.dispose();
|
createButton('Dispose all', function (e) {
|
||||||
model = null;
|
editor.dispose();
|
||||||
}
|
editor = null;
|
||||||
}));
|
if (model) {
|
||||||
|
model.dispose();
|
||||||
bar.appendChild(createButton("Remove Model", function(e) {
|
model = null;
|
||||||
editor.setModel(null);
|
}
|
||||||
}));
|
})
|
||||||
|
);
|
||||||
bar.appendChild(createButton("Dispose Model", function(e) {
|
|
||||||
if (model) {
|
bar.appendChild(
|
||||||
model.dispose();
|
createButton('Remove Model', function (e) {
|
||||||
model = null;
|
editor.setModel(null);
|
||||||
}
|
})
|
||||||
}));
|
);
|
||||||
|
|
||||||
bar.appendChild(createButton('Ballistic scroll', (function() {
|
bar.appendChild(
|
||||||
var friction = 1000; // px per second
|
createButton('Dispose Model', function (e) {
|
||||||
var speed = 0; // px per second
|
if (model) {
|
||||||
var isRunning = false;
|
model.dispose();
|
||||||
var lastTime;
|
model = null;
|
||||||
var r = 0;
|
}
|
||||||
|
})
|
||||||
var scroll = function() {
|
);
|
||||||
var currentTime = new Date().getTime();
|
|
||||||
var ellapsedTimeS = (currentTime - lastTime) / 1000;
|
bar.appendChild(
|
||||||
lastTime = currentTime;
|
createButton(
|
||||||
|
'Ballistic scroll',
|
||||||
speed = speed - friction * ellapsedTimeS;
|
(function () {
|
||||||
r = r + speed * ellapsedTimeS;
|
var friction = 1000; // px per second
|
||||||
editor.setScrollTop(r);
|
var speed = 0; // px per second
|
||||||
|
var isRunning = false;
|
||||||
if (speed >= 0) {
|
var lastTime;
|
||||||
domutils.scheduleAtNextAnimationFrame(scroll);
|
var r = 0;
|
||||||
} else {
|
|
||||||
isRunning = false;
|
var scroll = function () {
|
||||||
}
|
var currentTime = new Date().getTime();
|
||||||
}
|
var ellapsedTimeS = (currentTime - lastTime) / 1000;
|
||||||
|
lastTime = currentTime;
|
||||||
return function (e) {
|
|
||||||
speed += 2000;
|
speed = speed - friction * ellapsedTimeS;
|
||||||
if (!isRunning) {
|
r = r + speed * ellapsedTimeS;
|
||||||
isRunning = true;
|
editor.setScrollTop(r);
|
||||||
r = editor.getScrollTop();
|
|
||||||
lastTime = new Date().getTime();
|
if (speed >= 0) {
|
||||||
domutils.runAtThisOrScheduleAtNextAnimationFrame(scroll);
|
domutils.scheduleAtNextAnimationFrame(scroll);
|
||||||
}
|
} else {
|
||||||
};
|
isRunning = false;
|
||||||
})()));
|
}
|
||||||
}
|
};
|
||||||
|
|
||||||
function createButton(label, onClick) {
|
return function (e) {
|
||||||
var result = document.createElement("button");
|
speed += 2000;
|
||||||
result.innerHTML = label;
|
if (!isRunning) {
|
||||||
result.onclick = onClick;
|
isRunning = true;
|
||||||
return result;
|
r = editor.getScrollTop();
|
||||||
}
|
lastTime = new Date().getTime();
|
||||||
|
domutils.runAtThisOrScheduleAtNextAnimationFrame(scroll);
|
||||||
function createOptions(editor) {
|
}
|
||||||
var options = document.getElementById('options');
|
};
|
||||||
|
})()
|
||||||
var lineNumbers;
|
)
|
||||||
options.appendChild(createOptionToggle(
|
);
|
||||||
editor,
|
}
|
||||||
'lineNumbers',
|
|
||||||
function() {
|
function createButton(label, onClick) {
|
||||||
return (lineNumbers === false ? false : true);
|
var result = document.createElement('button');
|
||||||
},
|
result.innerHTML = label;
|
||||||
function(editor, newValue) {
|
result.onclick = onClick;
|
||||||
lineNumbers = newValue;
|
return result;
|
||||||
editor.updateOptions({ lineNumbers: lineNumbers ? 'on' : 'off' });
|
}
|
||||||
}
|
|
||||||
));
|
function createOptions(editor) {
|
||||||
|
var options = document.getElementById('options');
|
||||||
var glyphMargin;
|
|
||||||
options.appendChild(createOptionToggle(
|
var lineNumbers;
|
||||||
editor,
|
options.appendChild(
|
||||||
'glyphMargin',
|
createOptionToggle(
|
||||||
function() {
|
editor,
|
||||||
return (glyphMargin === false ? false : true);
|
'lineNumbers',
|
||||||
},
|
function () {
|
||||||
function(editor, newValue) {
|
return lineNumbers === false ? false : true;
|
||||||
glyphMargin = newValue;
|
},
|
||||||
editor.updateOptions({ glyphMargin: glyphMargin });
|
function (editor, newValue) {
|
||||||
}
|
lineNumbers = newValue;
|
||||||
));
|
editor.updateOptions({ lineNumbers: lineNumbers ? 'on' : 'off' });
|
||||||
|
}
|
||||||
var minimap;
|
)
|
||||||
options.appendChild(createOptionToggle(
|
);
|
||||||
editor,
|
|
||||||
'minimap',
|
var glyphMargin;
|
||||||
function() {
|
options.appendChild(
|
||||||
return (minimap === false ? false : true);
|
createOptionToggle(
|
||||||
},
|
editor,
|
||||||
function(editor, newValue) {
|
'glyphMargin',
|
||||||
minimap = newValue;
|
function () {
|
||||||
editor.updateOptions({ minimap: { enabled: minimap } });
|
return glyphMargin === false ? false : true;
|
||||||
}
|
},
|
||||||
));
|
function (editor, newValue) {
|
||||||
|
glyphMargin = newValue;
|
||||||
var roundedSelection;
|
editor.updateOptions({ glyphMargin: glyphMargin });
|
||||||
options.appendChild(createOptionToggle(
|
}
|
||||||
editor,
|
)
|
||||||
'roundedSelection',
|
);
|
||||||
function() {
|
|
||||||
return (roundedSelection === false ? false : true);
|
var minimap;
|
||||||
},
|
options.appendChild(
|
||||||
function(editor, newValue) {
|
createOptionToggle(
|
||||||
roundedSelection = newValue;
|
editor,
|
||||||
editor.updateOptions({ roundedSelection: roundedSelection });
|
'minimap',
|
||||||
}
|
function () {
|
||||||
));
|
return minimap === false ? false : true;
|
||||||
|
},
|
||||||
var scrollBeyondLastLine;
|
function (editor, newValue) {
|
||||||
options.appendChild(createOptionToggle(
|
minimap = newValue;
|
||||||
editor,
|
editor.updateOptions({ minimap: { enabled: minimap } });
|
||||||
'scrollBeyondLastLine',
|
}
|
||||||
function() {
|
)
|
||||||
return (scrollBeyondLastLine === false ? false : true);
|
);
|
||||||
},
|
|
||||||
function(editor, newValue) {
|
var roundedSelection;
|
||||||
scrollBeyondLastLine = newValue;
|
options.appendChild(
|
||||||
editor.updateOptions({ scrollBeyondLastLine: scrollBeyondLastLine });
|
createOptionToggle(
|
||||||
}
|
editor,
|
||||||
));
|
'roundedSelection',
|
||||||
|
function () {
|
||||||
var renderWhitespace;
|
return roundedSelection === false ? false : true;
|
||||||
options.appendChild(createOptionToggle(
|
},
|
||||||
editor,
|
function (editor, newValue) {
|
||||||
'renderWhitespace',
|
roundedSelection = newValue;
|
||||||
function() {
|
editor.updateOptions({ roundedSelection: roundedSelection });
|
||||||
return (renderWhitespace === true ? true : false);
|
}
|
||||||
},
|
)
|
||||||
function(editor, newValue) {
|
);
|
||||||
renderWhitespace = newValue;
|
|
||||||
editor.updateOptions({ renderWhitespace: renderWhitespace });
|
var scrollBeyondLastLine;
|
||||||
}
|
options.appendChild(
|
||||||
));
|
createOptionToggle(
|
||||||
|
editor,
|
||||||
var readOnly;
|
'scrollBeyondLastLine',
|
||||||
options.appendChild(createOptionToggle(
|
function () {
|
||||||
editor,
|
return scrollBeyondLastLine === false ? false : true;
|
||||||
'readOnly',
|
},
|
||||||
function() {
|
function (editor, newValue) {
|
||||||
return (readOnly === true ? true : false);
|
scrollBeyondLastLine = newValue;
|
||||||
},
|
editor.updateOptions({ scrollBeyondLastLine: scrollBeyondLastLine });
|
||||||
function(editor, newValue) {
|
}
|
||||||
readOnly = newValue;
|
)
|
||||||
editor.updateOptions({ readOnly: readOnly });
|
);
|
||||||
}
|
|
||||||
));
|
var renderWhitespace;
|
||||||
|
options.appendChild(
|
||||||
var wordWrap;
|
createOptionToggle(
|
||||||
options.appendChild(createOptionToggle(
|
editor,
|
||||||
editor,
|
'renderWhitespace',
|
||||||
'wordWrap',
|
function () {
|
||||||
function() {
|
return renderWhitespace === true ? true : false;
|
||||||
return (wordWrap === true ? true : false);
|
},
|
||||||
},
|
function (editor, newValue) {
|
||||||
function(editor, newValue) {
|
renderWhitespace = newValue;
|
||||||
wordWrap = newValue;
|
editor.updateOptions({ renderWhitespace: renderWhitespace });
|
||||||
editor.updateOptions({ wordWrap: wordWrap ? 'on' : 'off' });
|
}
|
||||||
}
|
)
|
||||||
));
|
);
|
||||||
|
|
||||||
var folding;
|
var readOnly;
|
||||||
options.appendChild(createOptionToggle(
|
options.appendChild(
|
||||||
editor,
|
createOptionToggle(
|
||||||
'folding',
|
editor,
|
||||||
function() {
|
'readOnly',
|
||||||
return (folding === false ? false : true);
|
function () {
|
||||||
},
|
return readOnly === true ? true : false;
|
||||||
function(editor, newValue) {
|
},
|
||||||
folding = newValue;
|
function (editor, newValue) {
|
||||||
editor.updateOptions({ folding: folding });
|
readOnly = newValue;
|
||||||
}
|
editor.updateOptions({ readOnly: readOnly });
|
||||||
));
|
}
|
||||||
|
)
|
||||||
|
);
|
||||||
var bracketPairColorizationEnabled = false;
|
|
||||||
options.appendChild(createOptionToggle(
|
var wordWrap;
|
||||||
editor,
|
options.appendChild(
|
||||||
'bracketPairColorizationEnabled',
|
createOptionToggle(
|
||||||
function() {
|
editor,
|
||||||
return (bracketPairColorizationEnabled === false ? false : true);
|
'wordWrap',
|
||||||
},
|
function () {
|
||||||
function(editor, newValue) {
|
return wordWrap === true ? true : false;
|
||||||
bracketPairColorizationEnabled = newValue;
|
},
|
||||||
editor.updateOptions({ "bracketPairColorization.enabled": bracketPairColorizationEnabled, });
|
function (editor, newValue) {
|
||||||
}
|
wordWrap = newValue;
|
||||||
));
|
editor.updateOptions({ wordWrap: wordWrap ? 'on' : 'off' });
|
||||||
}
|
}
|
||||||
|
)
|
||||||
|
);
|
||||||
function createOptionToggle(editor, labelText, stateReader, setState) {
|
|
||||||
var domNode = document.createElement('div');
|
var folding;
|
||||||
domNode.className = 'option toggle';
|
options.appendChild(
|
||||||
|
createOptionToggle(
|
||||||
var input = document.createElement('input');
|
editor,
|
||||||
input.type = 'checkbox';
|
'folding',
|
||||||
|
function () {
|
||||||
var label = document.createElement('label');
|
return folding === false ? false : true;
|
||||||
label.appendChild(input);
|
},
|
||||||
label.appendChild(document.createTextNode(labelText));
|
function (editor, newValue) {
|
||||||
|
folding = newValue;
|
||||||
domNode.appendChild(label);
|
editor.updateOptions({ folding: folding });
|
||||||
|
}
|
||||||
var renderState = function() {
|
)
|
||||||
input.checked = stateReader();
|
);
|
||||||
};
|
|
||||||
|
var bracketPairColorizationEnabled = false;
|
||||||
renderState();
|
options.appendChild(
|
||||||
editor.onDidChangeConfiguration(function() {
|
createOptionToggle(
|
||||||
renderState();
|
editor,
|
||||||
});
|
'bracketPairColorizationEnabled',
|
||||||
input.onchange = function() {
|
function () {
|
||||||
setState(editor, !stateReader());
|
return bracketPairColorizationEnabled === false ? false : true;
|
||||||
};
|
},
|
||||||
|
function (editor, newValue) {
|
||||||
return domNode;
|
bracketPairColorizationEnabled = newValue;
|
||||||
}
|
editor.updateOptions({
|
||||||
|
'bracketPairColorization.enabled': bracketPairColorizationEnabled
|
||||||
|
});
|
||||||
function ComboBox(label, externalOptions) {
|
}
|
||||||
this.id = 'combobox-' + label.toLowerCase().replace(/\s/g, '-');
|
)
|
||||||
|
);
|
||||||
this.domNode = document.createElement('div');
|
}
|
||||||
this.domNode.setAttribute('style', 'display: inline; margin-right: 5px;');
|
|
||||||
|
function createOptionToggle(editor, labelText, stateReader, setState) {
|
||||||
this.label = document.createElement('label');
|
var domNode = document.createElement('div');
|
||||||
this.label.innerHTML = label;
|
domNode.className = 'option toggle';
|
||||||
this.label.setAttribute('for', this.id);
|
|
||||||
this.domNode.appendChild(this.label);
|
var input = document.createElement('input');
|
||||||
|
input.type = 'checkbox';
|
||||||
this.comboBox = document.createElement('select');
|
|
||||||
this.comboBox.setAttribute('id', this.id);
|
var label = document.createElement('label');
|
||||||
this.comboBox.setAttribute('name', this.id);
|
label.appendChild(input);
|
||||||
this.comboBox.onchange =(function (e) {
|
label.appendChild(document.createTextNode(labelText));
|
||||||
var target = e.target || e.srcElement;
|
|
||||||
this.options[target.options[target.selectedIndex].value].callback();
|
domNode.appendChild(label);
|
||||||
}).bind(this);
|
|
||||||
|
var renderState = function () {
|
||||||
this.domNode.appendChild(this.comboBox);
|
input.checked = stateReader();
|
||||||
|
};
|
||||||
this.options = [];
|
|
||||||
for (var name in externalOptions) {
|
renderState();
|
||||||
if (externalOptions.hasOwnProperty(name)) {
|
editor.onDidChangeConfiguration(function () {
|
||||||
var optionElement = document.createElement('option');
|
renderState();
|
||||||
optionElement.value = name;
|
});
|
||||||
optionElement.innerHTML = name;
|
input.onchange = function () {
|
||||||
this.options[name] = {
|
setState(editor, !stateReader());
|
||||||
element: optionElement,
|
};
|
||||||
callback: externalOptions[name]
|
|
||||||
};
|
return domNode;
|
||||||
this.comboBox.appendChild(optionElement);
|
}
|
||||||
}
|
|
||||||
}
|
function ComboBox(label, externalOptions) {
|
||||||
}
|
this.id = 'combobox-' + label.toLowerCase().replace(/\s/g, '-');
|
||||||
ComboBox.prototype.set = function (name) {
|
|
||||||
if (this.options[name]) {
|
this.domNode = document.createElement('div');
|
||||||
this.options[name].element.selected = true;
|
this.domNode.setAttribute('style', 'display: inline; margin-right: 5px;');
|
||||||
}
|
|
||||||
};
|
this.label = document.createElement('label');
|
||||||
|
this.label.innerHTML = label;
|
||||||
});
|
this.label.setAttribute('for', this.id);
|
||||||
|
this.domNode.appendChild(this.label);
|
||||||
|
|
||||||
|
this.comboBox = document.createElement('select');
|
||||||
|
this.comboBox.setAttribute('id', this.id);
|
||||||
|
this.comboBox.setAttribute('name', this.id);
|
||||||
|
this.comboBox.onchange = function (e) {
|
||||||
|
var target = e.target || e.srcElement;
|
||||||
|
this.options[target.options[target.selectedIndex].value].callback();
|
||||||
|
}.bind(this);
|
||||||
|
|
||||||
|
this.domNode.appendChild(this.comboBox);
|
||||||
|
|
||||||
|
this.options = [];
|
||||||
|
for (var name in externalOptions) {
|
||||||
|
if (externalOptions.hasOwnProperty(name)) {
|
||||||
|
var optionElement = document.createElement('option');
|
||||||
|
optionElement.value = name;
|
||||||
|
optionElement.innerHTML = name;
|
||||||
|
this.options[name] = {
|
||||||
|
element: optionElement,
|
||||||
|
callback: externalOptions[name]
|
||||||
|
};
|
||||||
|
this.comboBox.appendChild(optionElement);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
ComboBox.prototype.set = function (name) {
|
||||||
|
if (this.options[name]) {
|
||||||
|
this.options[name].element.selected = true;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|||||||
@ -1,23 +1,32 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||||
</head>
|
</head>
|
||||||
<body style="height:2000px">
|
<body style="height: 2000px">
|
||||||
|
<h2>Monaco Editor in fixed element</h2>
|
||||||
<h2>Monaco Editor in fixed element</h2>
|
|
||||||
|
<div
|
||||||
<div style="position: fixed; left: 20%; top: 20%; right: 20%; height: 400px; border:1px solid silver" id="Editor">
|
style="
|
||||||
|
position: fixed;
|
||||||
<script src="../metadata.js"></script>
|
left: 20%;
|
||||||
<script src="dev-setup.js"></script>
|
top: 20%;
|
||||||
<script>
|
right: 20%;
|
||||||
loadEditor(function() {
|
height: 400px;
|
||||||
monaco.editor.create(document.getElementById('Editor'), {
|
border: 1px solid silver;
|
||||||
value: document.documentElement.innerHTML,
|
"
|
||||||
language: 'xml'
|
id="Editor"
|
||||||
});
|
></div>
|
||||||
});
|
|
||||||
</script>
|
<script src="../metadata.js"></script>
|
||||||
</body>
|
<script src="dev-setup.js"></script>
|
||||||
</html>
|
<script>
|
||||||
|
loadEditor(function () {
|
||||||
|
monaco.editor.create(document.getElementById('Editor'), {
|
||||||
|
value: document.documentElement.innerHTML,
|
||||||
|
language: 'xml'
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@ -1,182 +1,287 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||||
<style type="text/css">
|
<style type="text/css">
|
||||||
#editor {
|
#editor {
|
||||||
position: relative;
|
position: relative;
|
||||||
left: 500px;
|
left: 500px;
|
||||||
top: 20px;
|
top: 20px;
|
||||||
width: 600px;
|
width: 600px;
|
||||||
height: 400px;
|
height: 400px;
|
||||||
border: 1px solid #ccc;
|
border: 1px solid #ccc;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<h2>Monaco Editor in scrollable body</h2>
|
||||||
<h2>Monaco Editor in scrollable body</h2>
|
|
||||||
|
<p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
</p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
<p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
</p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
<p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
</p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
<p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
</p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
<p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
</p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
<p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
</p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
<p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
</p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
<p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
</p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
<p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
</p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
<p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
</p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
<p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
<div id="editor"></div>
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
<div style="clear:both"></div>
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
</p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
<p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
</p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
<p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
</p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
<p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
</p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
<p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
</p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
<p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
</p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
<p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
</p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
<div id="editor"></div>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
<div style="clear: both"></div>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
<p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
</p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
<p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
</p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
<p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
</p>
|
||||||
|
<p>
|
||||||
<script src="../metadata.js"></script>
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
<script src="dev-setup.js"></script>
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
<script>
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
loadEditor(function() {
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
monaco.editor.create(document.getElementById('editor'), {
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
value: document.documentElement.innerHTML,
|
</p>
|
||||||
language: 'xml'
|
<p>
|
||||||
});
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
});
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
</script>
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
</body>
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
</html>
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<script src="../metadata.js"></script>
|
||||||
|
<script src="dev-setup.js"></script>
|
||||||
|
<script>
|
||||||
|
loadEditor(function () {
|
||||||
|
monaco.editor.create(document.getElementById('editor'), {
|
||||||
|
value: document.documentElement.innerHTML,
|
||||||
|
language: 'xml'
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@ -1,134 +1,205 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
|
<head>
|
||||||
<head>
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
<style type="text/css">
|
||||||
<style type="text/css">
|
#editor {
|
||||||
#editor {
|
position: relative;
|
||||||
position: relative;
|
left: 500px;
|
||||||
left: 500px;
|
top: 20px;
|
||||||
top: 20px;
|
width: 600px;
|
||||||
width: 600px;
|
height: 400px;
|
||||||
height: 400px;
|
border: 1px solid #ccc;
|
||||||
border: 1px solid #ccc;
|
}
|
||||||
}
|
</style>
|
||||||
</style>
|
</head>
|
||||||
</head>
|
|
||||||
|
<body>
|
||||||
<body>
|
<p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
</p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
<p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
</p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
<p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
</p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
<p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
</p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
<p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
</p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
<p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
</p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
<p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
</p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
<p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
</p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
<p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
</p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
<p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
</p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
|
<p>
|
||||||
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
<div style="height:500px; overflow:scroll">
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
|
</p>
|
||||||
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
<p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
</p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
|
<p>
|
||||||
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
</p>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
<p>
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
</p>
|
||||||
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
<div id="editor"></div>
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
</div>
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
<div style="clear:both"></div>
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
<script src="../metadata.js"></script>
|
<p>
|
||||||
<script src="dev-setup.js"></script>
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
<script>
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
loadEditor(function() {
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
monaco.editor.create(document.getElementById('editor'), {
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
value: document.documentElement.innerHTML,
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
language: 'xml'
|
</p>
|
||||||
});
|
<p>
|
||||||
});
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
</script>
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
</body>
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
</html>
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
|
||||||
|
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
|
||||||
|
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div style="height: 500px; overflow: scroll">
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
|
||||||
|
ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
|
||||||
|
cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
|
||||||
|
ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
|
||||||
|
cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
|
||||||
|
ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
|
||||||
|
cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
|
||||||
|
ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
|
||||||
|
cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
|
||||||
|
ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
|
||||||
|
cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
|
||||||
|
ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
|
||||||
|
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
|
||||||
|
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
|
||||||
|
cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div id="editor"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style="clear: both"></div>
|
||||||
|
|
||||||
|
<script src="../metadata.js"></script>
|
||||||
|
<script src="dev-setup.js"></script>
|
||||||
|
<script>
|
||||||
|
loadEditor(function () {
|
||||||
|
monaco.editor.create(document.getElementById('editor'), {
|
||||||
|
value: document.documentElement.innerHTML,
|
||||||
|
language: 'xml'
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@ -1,18 +1,19 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||||
<base href="../../vscode-prs/out-editor-esm-bundle/" />
|
<base href="../../vscode-prs/out-editor-esm-bundle/" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<h2>Monaco Editor ESM Bundle</h2>
|
||||||
|
|
||||||
<h2>Monaco Editor ESM Bundle</h2>
|
<div style="clear: both"></div>
|
||||||
|
<div
|
||||||
|
id="container"
|
||||||
|
style="float: left; width: 800px; height: 450px; border: 1px solid grey"
|
||||||
|
></div>
|
||||||
|
<div style="clear: both"></div>
|
||||||
|
|
||||||
<div style="clear:both"></div>
|
<script src="core.bundle.js"></script>
|
||||||
<div id="container" style="float:left;width:800px;height:450px;border: 1px solid grey"></div>
|
</body>
|
||||||
<div style="clear:both"></div>
|
|
||||||
|
|
||||||
<script src="core.bundle.js"></script>
|
|
||||||
|
|
||||||
</body>
|
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@ -1,244 +1,287 @@
|
|||||||
/// <reference path="../node_modules/monaco-editor-core/monaco.d.ts" />
|
/// <reference path="../../node_modules/monaco-editor-core/monaco.d.ts" />
|
||||||
|
|
||||||
define(['./samples-all.generated'], function (ALL_SAMPLES) {
|
define(['./samples-all.generated'], function (ALL_SAMPLES) {
|
||||||
|
var XHR_SAMPLES = {};
|
||||||
var XHR_SAMPLES = {};
|
ALL_SAMPLES.forEach(function (sample) {
|
||||||
ALL_SAMPLES.forEach(function (sample) {
|
XHR_SAMPLES[sample.name] = sample.content;
|
||||||
XHR_SAMPLES[sample.name] = sample.content;
|
});
|
||||||
});
|
|
||||||
|
var samples = [];
|
||||||
var samples = [];
|
|
||||||
|
var modesIds = monaco.languages.getLanguages().map(function (language) {
|
||||||
var modesIds = monaco.languages.getLanguages().map(function (language) { return language.id; });
|
return language.id;
|
||||||
modesIds.sort();
|
});
|
||||||
|
modesIds.sort();
|
||||||
modesIds.forEach(function (modeId) {
|
|
||||||
samples.push({
|
modesIds.forEach(function (modeId) {
|
||||||
name: 'sample - ' + modeId,
|
samples.push({
|
||||||
mimeType: modeId,
|
name: 'sample - ' + modeId,
|
||||||
loadText: function () {
|
mimeType: modeId,
|
||||||
return Promise.resolve(XHR_SAMPLES['sample.' + modeId + '.txt']);
|
loadText: function () {
|
||||||
}
|
return Promise.resolve(XHR_SAMPLES['sample.' + modeId + '.txt']);
|
||||||
});
|
}
|
||||||
});
|
});
|
||||||
|
});
|
||||||
function addXHRSample(name, modelUrl, mimeType, textModifier) {
|
|
||||||
textModifier = textModifier || function (text) { return text; };
|
function addXHRSample(name, modelUrl, mimeType, textModifier) {
|
||||||
samples.push({
|
textModifier =
|
||||||
name: name,
|
textModifier ||
|
||||||
mimeType: mimeType,
|
function (text) {
|
||||||
loadText: function () {
|
return text;
|
||||||
return Promise.resolve(XHR_SAMPLES[modelUrl]).then(textModifier);
|
};
|
||||||
}
|
samples.push({
|
||||||
});
|
name: name,
|
||||||
}
|
mimeType: mimeType,
|
||||||
|
loadText: function () {
|
||||||
function addStringPowerXHRSample(name, modelUrl, mimeType, power) {
|
return Promise.resolve(XHR_SAMPLES[modelUrl]).then(textModifier);
|
||||||
addXHRSample(name, modelUrl, mimeType, function (text) {
|
}
|
||||||
var result = text;
|
});
|
||||||
for (var i = 0; i < power; ++i) {
|
}
|
||||||
result += "\n" + result;
|
|
||||||
}
|
function addStringPowerXHRSample(name, modelUrl, mimeType, power) {
|
||||||
return result;
|
addXHRSample(name, modelUrl, mimeType, function (text) {
|
||||||
});
|
var result = text;
|
||||||
}
|
for (var i = 0; i < power; ++i) {
|
||||||
|
result += '\n' + result;
|
||||||
function addSample(name, mimeType, modelText) {
|
}
|
||||||
samples.push({
|
return result;
|
||||||
name: name,
|
});
|
||||||
mimeType: mimeType,
|
}
|
||||||
loadText: function () {
|
|
||||||
return Promise.resolve(modelText);
|
function addSample(name, mimeType, modelText) {
|
||||||
}
|
samples.push({
|
||||||
});
|
name: name,
|
||||||
}
|
mimeType: mimeType,
|
||||||
|
loadText: function () {
|
||||||
addXHRSample('Y___FailingJS', 'run-editor-failing-js.txt', 'text/javascript');
|
return Promise.resolve(modelText);
|
||||||
addXHRSample('Y___DefaultJS', 'run-editor-sample-js.txt', 'text/javascript');
|
}
|
||||||
addStringPowerXHRSample('Y___BigJS', 'run-editor-sample-js.txt', 'text/javascript', 11);
|
});
|
||||||
addXHRSample('Y___BigJS_msn', 'run-editor-sample-msn-js.txt', 'text/javascript');
|
}
|
||||||
addXHRSample('Y___BigCSS', 'run-editor-sample-big-css.txt', 'text/css');
|
|
||||||
addStringPowerXHRSample('Y___BigHTML', 'run-editor-sample-html.txt', 'text/html', 10);
|
addXHRSample('Y___FailingJS', 'run-editor-failing-js.txt', 'text/javascript');
|
||||||
addXHRSample('Y___Korean', 'run-editor-korean.txt', 'text/plain');
|
addXHRSample('Y___DefaultJS', 'run-editor-sample-js.txt', 'text/javascript');
|
||||||
addXHRSample('Y___BOM.cs', 'run-editor-sample-bom-cs.txt', 'text/x-csharp');
|
addStringPowerXHRSample('Y___BigJS', 'run-editor-sample-js.txt', 'text/javascript', 11);
|
||||||
addXHRSample('Z___CR.ps1', 'run-editor-sample-cr-ps1.txt', 'text/x-powershell');
|
addXHRSample('Y___BigJS_msn', 'run-editor-sample-msn-js.txt', 'text/javascript');
|
||||||
|
addXHRSample('Y___BigCSS', 'run-editor-sample-big-css.txt', 'text/css');
|
||||||
addXHRSample('Z___jquery-min.js', 'run-editor-jquery-min-js.txt', 'text/javascript');
|
addStringPowerXHRSample('Y___BigHTML', 'run-editor-sample-html.txt', 'text/html', 10);
|
||||||
|
addXHRSample('Y___Korean', 'run-editor-korean.txt', 'text/plain');
|
||||||
addXHRSample('Z___scrolling-strategy.js', 'run-editor-sample-js.txt', 'text/plain', function (text) {
|
addXHRSample('Y___BOM.cs', 'run-editor-sample-bom-cs.txt', 'text/x-csharp');
|
||||||
console.log('here I am');
|
addXHRSample('Z___CR.ps1', 'run-editor-sample-cr-ps1.txt', 'text/x-powershell');
|
||||||
var lines = text.split('\n');
|
|
||||||
var newLines = lines.slice(0);
|
addXHRSample('Z___jquery-min.js', 'run-editor-jquery-min-js.txt', 'text/javascript');
|
||||||
|
|
||||||
var problemIsAt = 80733 + 5;
|
addXHRSample(
|
||||||
while (newLines.length < problemIsAt) {
|
'Z___scrolling-strategy.js',
|
||||||
newLines = newLines.concat(lines);
|
'run-editor-sample-js.txt',
|
||||||
}
|
'text/plain',
|
||||||
|
function (text) {
|
||||||
newLines = newLines.slice(0, problemIsAt);
|
console.log('here I am');
|
||||||
return newLines.join('\n');
|
var lines = text.split('\n');
|
||||||
});
|
var newLines = lines.slice(0);
|
||||||
|
|
||||||
addSample('Z___special-chars', 'text/plain', [
|
var problemIsAt = 80733 + 5;
|
||||||
"// single line \u000D comment", // Carriage return
|
while (newLines.length < problemIsAt) {
|
||||||
"// single line \u2028 comment", // Line separator
|
newLines = newLines.concat(lines);
|
||||||
"// single line \u2029 comment" // Paragraph separator
|
}
|
||||||
].join('\n'));
|
|
||||||
|
newLines = newLines.slice(0, problemIsAt);
|
||||||
// http://www.cl.cam.ac.uk/~mgk25/ucs/examples/UTF-8-test.txt
|
return newLines.join('\n');
|
||||||
addSample('Z___invalid-unicode', 'text/plain', [
|
}
|
||||||
'\uFFFE\uFFFF',
|
);
|
||||||
'\uD800\uDC00',
|
|
||||||
'\uD800\uDFFF',
|
addSample(
|
||||||
'\uDB7F\uDC00',
|
'Z___special-chars',
|
||||||
'\uDB7F\uDFFF',
|
'text/plain',
|
||||||
'\uDB80\uDC00',
|
[
|
||||||
'\uDB80\uDFFF',
|
'// single line \u000D comment', // Carriage return
|
||||||
'\uDBFF\uDC00',
|
'// single line \u2028 comment', // Line separator
|
||||||
'\uDBFF\uDFFF'
|
'// single line \u2029 comment' // Paragraph separator
|
||||||
].join('\n'));
|
].join('\n')
|
||||||
|
);
|
||||||
addSample('Z___easy-debug.js', 'text/plain', (function () {
|
|
||||||
var myValue = "Line1";
|
// http://www.cl.cam.ac.uk/~mgk25/ucs/examples/UTF-8-test.txt
|
||||||
for (var i = 2; i < 50; i++) {
|
addSample(
|
||||||
myValue += "\nLine" + i;
|
'Z___invalid-unicode',
|
||||||
}
|
'text/plain',
|
||||||
return myValue;
|
[
|
||||||
})());
|
'\uFFFE\uFFFF',
|
||||||
|
'\uD800\uDC00',
|
||||||
addSample('Z___copy-paste.txt', 'text/plain', (function () {
|
'\uD800\uDFFF',
|
||||||
var i = 0, sampleCopyPasteLine = '';
|
'\uDB7F\uDC00',
|
||||||
while (sampleCopyPasteLine.length < 1000) {
|
'\uDB7F\uDFFF',
|
||||||
i++;
|
'\uDB80\uDC00',
|
||||||
sampleCopyPasteLine += i;
|
'\uDB80\uDFFF',
|
||||||
}
|
'\uDBFF\uDC00',
|
||||||
var sampleCopyPaste = sampleCopyPasteLine;
|
'\uDBFF\uDFFF'
|
||||||
for (i = 1; i <= 600; i++) {
|
].join('\n')
|
||||||
sampleCopyPaste += '\n' + sampleCopyPasteLine;
|
);
|
||||||
}
|
|
||||||
return sampleCopyPaste;
|
addSample(
|
||||||
})());
|
'Z___easy-debug.js',
|
||||||
|
'text/plain',
|
||||||
addSample('Z___xss', 'text/html', (function () {
|
(function () {
|
||||||
var xssRepresentations = [
|
var myValue = 'Line1';
|
||||||
'<',
|
for (var i = 2; i < 50; i++) {
|
||||||
'BAD\u2028CHARACTER',
|
myValue += '\nLine' + i;
|
||||||
'%3C',
|
}
|
||||||
'<',
|
return myValue;
|
||||||
'<',
|
})()
|
||||||
'<',
|
);
|
||||||
'<',
|
|
||||||
'<',
|
addSample(
|
||||||
'<',
|
'Z___copy-paste.txt',
|
||||||
'<',
|
'text/plain',
|
||||||
'<',
|
(function () {
|
||||||
'<',
|
var i = 0,
|
||||||
'<',
|
sampleCopyPasteLine = '';
|
||||||
'<',
|
while (sampleCopyPasteLine.length < 1000) {
|
||||||
'<',
|
i++;
|
||||||
'<',
|
sampleCopyPasteLine += i;
|
||||||
'<',
|
}
|
||||||
'<',
|
var sampleCopyPaste = sampleCopyPasteLine;
|
||||||
'<',
|
for (i = 1; i <= 600; i++) {
|
||||||
'<',
|
sampleCopyPaste += '\n' + sampleCopyPasteLine;
|
||||||
'<',
|
}
|
||||||
'<',
|
return sampleCopyPaste;
|
||||||
'<',
|
})()
|
||||||
'<',
|
);
|
||||||
'<',
|
|
||||||
'<',
|
addSample(
|
||||||
'<',
|
'Z___xss',
|
||||||
'<',
|
'text/html',
|
||||||
'<',
|
(function () {
|
||||||
'<',
|
var xssRepresentations = [
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'BAD\u2028CHARACTER',
|
||||||
'<',
|
'%3C',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'<',
|
'<',
|
||||||
'\x3c',
|
'<',
|
||||||
'\x3C',
|
'<',
|
||||||
'\u003c',
|
'<',
|
||||||
'\u003C'
|
'<',
|
||||||
];
|
'<',
|
||||||
return xssRepresentations.length + ':\n' + xssRepresentations.join('\n');
|
'<',
|
||||||
})());
|
'<',
|
||||||
|
'<',
|
||||||
addSample('Z___many-links.js', 'text/javascript', (function () {
|
'<',
|
||||||
var result = "bla bla a url: https://microsoft.com some more bla bla";
|
'<',
|
||||||
for (var i = 0; i < 13; ++i) {
|
'<',
|
||||||
result += "\n" + result;
|
'<',
|
||||||
}
|
'<',
|
||||||
return "/*" + result + "\n*/";
|
'<',
|
||||||
})());
|
'<',
|
||||||
|
'<',
|
||||||
addSample('Z___line-separators.js', 'text/javascript', (function () {
|
'<',
|
||||||
return [
|
'<',
|
||||||
"var x = '1'; // And\u2028 here I have a nice comment.",
|
'<',
|
||||||
"",
|
'<',
|
||||||
"var y = x + ' +\u2028 2 = res';",
|
'<',
|
||||||
"",
|
'<',
|
||||||
"y.replace(/re\u2028s/gi, '3');"
|
'<',
|
||||||
].join('\n');
|
'<',
|
||||||
})());
|
'<',
|
||||||
|
'<',
|
||||||
addXHRSample('Z___intellisense.js', 'run-editor-intellisense-js.txt', 'text/javascript');
|
'<',
|
||||||
|
'<',
|
||||||
addSample('Z___recursion attack', 'text/html', (function () {
|
'<',
|
||||||
var arr = [];
|
'<',
|
||||||
for (var i = 0; i < 10000; i++) {
|
'\x3c',
|
||||||
arr.push('\n<script type="text/html">');
|
'\x3C',
|
||||||
}
|
'\u003c',
|
||||||
return arr.length + ':\n' + arr.join('');
|
'\u003C'
|
||||||
})());
|
];
|
||||||
|
return xssRepresentations.length + ':\n' + xssRepresentations.join('\n');
|
||||||
addSample('empty', 'text/plain', '');
|
})()
|
||||||
|
);
|
||||||
addXHRSample('Z___dynamic', 'run-editor-sample-dynamic.txt', {
|
|
||||||
name: 'custom.1.',
|
addSample(
|
||||||
tokenizer: {
|
'Z___many-links.js',
|
||||||
root: [
|
'text/javascript',
|
||||||
[/\[error.*/, "custom-error"],
|
(function () {
|
||||||
[/\[notice.*/, "custom-notice"],
|
var result = 'bla bla a url: https://microsoft.com some more bla bla';
|
||||||
[/\[info.*/, "custom-info"],
|
for (var i = 0; i < 13; ++i) {
|
||||||
[/\[[a-zA-Z 0-9:]+\]/, "custom-date"],
|
result += '\n' + result;
|
||||||
],
|
}
|
||||||
}
|
return '/*' + result + '\n*/';
|
||||||
});
|
})()
|
||||||
|
);
|
||||||
addXHRSample('Z___f12___css', 'run-editor-sample-f12-css.txt', 'text/css');
|
|
||||||
|
addSample(
|
||||||
return samples;
|
'Z___line-separators.js',
|
||||||
});
|
'text/javascript',
|
||||||
|
(function () {
|
||||||
|
return [
|
||||||
|
"var x = '1'; // And\u2028 here I have a nice comment.",
|
||||||
|
'',
|
||||||
|
"var y = x + ' +\u2028 2 = res';",
|
||||||
|
'',
|
||||||
|
"y.replace(/re\u2028s/gi, '3');"
|
||||||
|
].join('\n');
|
||||||
|
})()
|
||||||
|
);
|
||||||
|
|
||||||
|
addXHRSample('Z___intellisense.js', 'run-editor-intellisense-js.txt', 'text/javascript');
|
||||||
|
|
||||||
|
addSample(
|
||||||
|
'Z___recursion attack',
|
||||||
|
'text/html',
|
||||||
|
(function () {
|
||||||
|
var arr = [];
|
||||||
|
for (var i = 0; i < 10000; i++) {
|
||||||
|
arr.push('\n<script type="text/html">');
|
||||||
|
}
|
||||||
|
return arr.length + ':\n' + arr.join('');
|
||||||
|
})()
|
||||||
|
);
|
||||||
|
|
||||||
|
addSample('empty', 'text/plain', '');
|
||||||
|
|
||||||
|
addXHRSample('Z___dynamic', 'run-editor-sample-dynamic.txt', {
|
||||||
|
name: 'custom.1.',
|
||||||
|
tokenizer: {
|
||||||
|
root: [
|
||||||
|
[/\[error.*/, 'custom-error'],
|
||||||
|
[/\[notice.*/, 'custom-notice'],
|
||||||
|
[/\[info.*/, 'custom-info'],
|
||||||
|
[/\[[a-zA-Z 0-9:]+\]/, 'custom-date']
|
||||||
|
]
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
addXHRSample('Z___f12___css', 'run-editor-sample-f12-css.txt', 'text/css');
|
||||||
|
|
||||||
|
return samples;
|
||||||
|
});
|
||||||
|
|||||||
@ -1,30 +1,25 @@
|
|||||||
define([
|
define(['vs/base/common/severity'], function (severity) {
|
||||||
'vs/base/common/severity'
|
'use strict';
|
||||||
], function(severity) {
|
function ValidateParticipant() {}
|
||||||
'use strict';
|
|
||||||
function ValidateParticipant() {
|
ValidateParticipant.ID = 'doc.validateParticipant';
|
||||||
|
ValidateParticipant.prototype.validate = function (mirrorModel, markerService) {
|
||||||
}
|
var marker = {
|
||||||
|
severity: severity.Error,
|
||||||
ValidateParticipant.ID = 'doc.validateParticipant';
|
message: [
|
||||||
ValidateParticipant.prototype.validate = function(mirrorModel, markerService) {
|
{ isText: true, text: '\u2188 ' },
|
||||||
|
{ tagName: 'span', style: 'color:red', text: 'I AM' },
|
||||||
var marker = {
|
{ isText: true, text: ' A VALIDATION PARTICIPANT \u2188' }
|
||||||
severity: severity.Error,
|
],
|
||||||
message: [
|
startLineNumber: 1,
|
||||||
{ isText: true, text: '\u2188 ' },
|
startColumn: 1,
|
||||||
{ tagName: 'span', style: 'color:red', text: 'I AM' },
|
endLineNumber: 1,
|
||||||
{ isText: true, text: ' A VALIDATION PARTICIPANT \u2188' }
|
endColumn: 3
|
||||||
],
|
};
|
||||||
startLineNumber: 1,
|
|
||||||
startColumn: 1,
|
markerService.changeOne(ValidateParticipant.ID, mirrorModel.getAssociatedResource(), [marker]);
|
||||||
endLineNumber: 1,
|
};
|
||||||
endColumn: 3
|
return {
|
||||||
};
|
ValidateParticipant: ValidateParticipant
|
||||||
|
};
|
||||||
markerService.changeOne(ValidateParticipant.ID, mirrorModel.getAssociatedResource(), [marker]);
|
});
|
||||||
};
|
|
||||||
return {
|
|
||||||
ValidateParticipant: ValidateParticipant
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|||||||
@ -1,59 +1,57 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<h2>Monaco Editor Shadow DOM</h2>
|
||||||
|
|
||||||
<h2>Monaco Editor Shadow DOM</h2>
|
<div style="clear: both"></div>
|
||||||
|
<div
|
||||||
|
id="container"
|
||||||
|
style="float: left; width: 800px; height: 450px; border: 1px solid grey"
|
||||||
|
></div>
|
||||||
|
<div style="clear: both"></div>
|
||||||
|
|
||||||
<div style="clear:both"></div>
|
<script src="../metadata.js"></script>
|
||||||
<div id="container" style="float:left;width:800px;height:450px;border: 1px solid grey"></div>
|
<script src="dev-setup.js"></script>
|
||||||
<div style="clear:both"></div>
|
<script>
|
||||||
|
const container = document.getElementById('container');
|
||||||
|
const shadowRoot = container.attachShadow({
|
||||||
|
mode: 'closed'
|
||||||
|
});
|
||||||
|
loadEditor(function () {
|
||||||
|
const innerContainer = document.createElement('div');
|
||||||
|
shadowRoot.appendChild(innerContainer);
|
||||||
|
innerContainer.style.width = '800px';
|
||||||
|
innerContainer.style.height = '450px';
|
||||||
|
|
||||||
<script src="../metadata.js"></script>
|
// We must move all CSS inside the shadow root, pick only link tags relevant to the editor
|
||||||
<script src="dev-setup.js"></script>
|
const documentLinks = Array.prototype.slice
|
||||||
<script>
|
.call(document.getElementsByTagName('link'), 0)
|
||||||
const container = document.getElementById('container');
|
.filter((documentLink) => {
|
||||||
const shadowRoot = container.attachShadow({
|
if (/vs\/(base|editor|platform)/.test(documentLink.getAttribute('href'))) {
|
||||||
mode: "closed"
|
return true;
|
||||||
});
|
}
|
||||||
loadEditor(function() {
|
console.log(`Not moving: `, documentLink);
|
||||||
const innerContainer = document.createElement('div');
|
return true;
|
||||||
shadowRoot.appendChild(innerContainer);
|
});
|
||||||
innerContainer.style.width = '800px';
|
documentLinks.forEach((documentLink) => shadowRoot.appendChild(documentLink));
|
||||||
innerContainer.style.height = '450px';
|
|
||||||
|
|
||||||
// We must move all CSS inside the shadow root, pick only link tags relevant to the editor
|
// We must define the font face outside the shadowroot
|
||||||
const documentLinks = Array.prototype.slice.call(document.getElementsByTagName('link'), 0).filter((documentLink) => {
|
const codiconCSS = `@font-face { font-family: "codicon"; src: url("${getCodiconPath()}") format("truetype"); }`;
|
||||||
if (/vs\/(base|editor|platform)/.test(documentLink.getAttribute('href'))) {
|
const style = document.createElement('style');
|
||||||
return true;
|
style.type = 'text/css';
|
||||||
}
|
style.media = 'screen';
|
||||||
console.log(`Not moving: `, documentLink);
|
document.getElementsByTagName('head')[0].appendChild(style);
|
||||||
return true;
|
style.innerHTML = codiconCSS;
|
||||||
});
|
|
||||||
documentLinks.forEach(documentLink => shadowRoot.appendChild(documentLink));
|
|
||||||
|
|
||||||
// We must define the font face outside the shadowroot
|
monaco.editor.create(innerContainer, {
|
||||||
const codiconCSS = `@font-face { font-family: "codicon"; src: url("${getCodiconPath()}") format("truetype"); }`;
|
value: ['function hello() {', '\tconsole.log("hello world");', '}', ''].join('\n'),
|
||||||
const style = document.createElement('style');
|
language: 'javascript',
|
||||||
style.type = 'text/css';
|
ariaContainerElement: innerContainer
|
||||||
style.media = 'screen';
|
});
|
||||||
document.getElementsByTagName('head')[0].appendChild(style);
|
});
|
||||||
style.innerHTML = codiconCSS;
|
</script>
|
||||||
|
</body>
|
||||||
monaco.editor.create(innerContainer, {
|
|
||||||
value: [
|
|
||||||
'function hello() {',
|
|
||||||
'\tconsole.log("hello world");',
|
|
||||||
'}',
|
|
||||||
''
|
|
||||||
].join('\n'),
|
|
||||||
language: 'javascript',
|
|
||||||
ariaContainerElement: innerContainer
|
|
||||||
});
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
</body>
|
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@ -1,41 +1,39 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||||
<style>
|
<style>
|
||||||
#errors {
|
#errors {
|
||||||
position:fixed;
|
position: fixed;
|
||||||
top:0;
|
top: 0;
|
||||||
right:0;
|
right: 0;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
width: 100px;
|
width: 100px;
|
||||||
height: 100px;
|
height: 100px;
|
||||||
}
|
}
|
||||||
body {
|
body {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
#editor {
|
#editor {
|
||||||
float:left;
|
float: left;
|
||||||
width: 1250px;
|
width: 1250px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<h2>Smoke Test</h2>
|
||||||
<h2>Smoke Test</h2>
|
|
||||||
|
<div id="control"></div>
|
||||||
<div id="control"></div>
|
<div id="editor"></div>
|
||||||
<div id="editor"></div>
|
<div id="errors"></div>
|
||||||
<div id="errors"></div>
|
<div style="clear: both"></div>
|
||||||
<div style="clear:both"></div>
|
|
||||||
|
<script src="../metadata.js"></script>
|
||||||
<script src="../metadata.js"></script>
|
<script src="dev-setup.js"></script>
|
||||||
<script src="dev-setup.js"></script>
|
<script>
|
||||||
<script>
|
loadEditor(function () {
|
||||||
loadEditor(function() {
|
require(['./smoketest'], function () {});
|
||||||
require(['./smoketest'], function() {});
|
});
|
||||||
});
|
</script>
|
||||||
</script>
|
</body>
|
||||||
|
</html>
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|||||||
@ -1,139 +1,145 @@
|
|||||||
/// <reference path="../node_modules/monaco-editor-core/monaco.d.ts" />
|
/// <reference path="../../node_modules/monaco-editor-core/monaco.d.ts" />
|
||||||
define(['./samples-all.generated'], function(ALL_SAMPLES) {
|
define(['./samples-all.generated'], function (ALL_SAMPLES) {
|
||||||
|
var XHR_SAMPLES = {};
|
||||||
var XHR_SAMPLES = {};
|
ALL_SAMPLES.forEach(function (sample) {
|
||||||
ALL_SAMPLES.forEach(function(sample) {
|
XHR_SAMPLES[sample.name] = sample.content;
|
||||||
XHR_SAMPLES[sample.name] = sample.content;
|
});
|
||||||
});
|
|
||||||
|
var actions = (function () {
|
||||||
var actions = (function() {
|
'use strict';
|
||||||
"use strict";
|
|
||||||
|
return [
|
||||||
return [
|
{
|
||||||
{
|
name: 'Undo',
|
||||||
name: 'Undo',
|
run: function (editor) {
|
||||||
run: function (editor) {
|
editor.trigger('keyboard', monaco.editor.Handler.Undo);
|
||||||
editor.trigger('keyboard', monaco.editor.Handler.Undo);
|
}
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'type & suggest',
|
||||||
name: 'type & suggest',
|
run: function (editor) {
|
||||||
run: function (editor) {
|
editor.setPosition({
|
||||||
editor.setPosition({
|
lineNumber: 1,
|
||||||
lineNumber: 1,
|
column: 1
|
||||||
column: 1
|
});
|
||||||
});
|
var firstChar = editor.getModel().getLineContent(1).charAt(0);
|
||||||
var firstChar = editor.getModel().getLineContent(1).charAt(0);
|
editor.trigger('keyboard', monaco.editor.Handler.CursorEnd);
|
||||||
editor.trigger('keyboard', monaco.editor.Handler.CursorEnd);
|
editor.trigger('keyboard', monaco.editor.Handler.Type, {
|
||||||
editor.trigger('keyboard', monaco.editor.Handler.Type, {
|
text: '\n' + firstChar
|
||||||
text: '\n' + firstChar
|
});
|
||||||
});
|
editor.focus();
|
||||||
editor.focus();
|
editor.trigger('test', 'editor.action.triggerSuggest');
|
||||||
editor.trigger('test', 'editor.action.triggerSuggest');
|
}
|
||||||
}
|
},
|
||||||
},
|
{
|
||||||
{
|
name: 'links',
|
||||||
name: 'links',
|
run: function (editor) {
|
||||||
run: function (editor) {
|
editor.setPosition({
|
||||||
editor.setPosition({
|
lineNumber: 1,
|
||||||
lineNumber: 1,
|
column: 1
|
||||||
column: 1
|
});
|
||||||
});
|
var commentsSupport = editor.getModel().getMode().commentsSupport;
|
||||||
var commentsSupport = editor.getModel().getMode().commentsSupport;
|
var text = 'http://www.test.com';
|
||||||
var text = 'http://www.test.com';
|
if (commentsSupport) {
|
||||||
if (commentsSupport) {
|
var commentsConfig = commentsSupport.getCommentsConfiguration();
|
||||||
var commentsConfig = commentsSupport.getCommentsConfiguration();
|
if (commentsConfig && commentsConfig.lineCommentTokens) {
|
||||||
if (commentsConfig && commentsConfig.lineCommentTokens) {
|
text = commentsConfig.lineCommentTokens[0] + ' ' + text;
|
||||||
text = commentsConfig.lineCommentTokens[0] + ' ' + text;
|
} else if (commentsConfig && commentsConfig.blockCommentStartToken) {
|
||||||
} else if (commentsConfig && commentsConfig.blockCommentStartToken) {
|
text =
|
||||||
text = commentsConfig.blockCommentStartToken + ' ' + text + ' ' + commentsConfig.blockCommentEndToken;
|
commentsConfig.blockCommentStartToken +
|
||||||
}
|
' ' +
|
||||||
}
|
text +
|
||||||
editor.trigger('keyboard', monaco.editor.Handler.Type, {
|
' ' +
|
||||||
text: text + '\n'
|
commentsConfig.blockCommentEndToken;
|
||||||
});
|
}
|
||||||
}
|
}
|
||||||
},
|
editor.trigger('keyboard', monaco.editor.Handler.Type, {
|
||||||
{
|
text: text + '\n'
|
||||||
name: 'multicursor',
|
});
|
||||||
run: function (editor) {
|
}
|
||||||
editor.setPosition({
|
},
|
||||||
lineNumber: 1,
|
{
|
||||||
column: 1
|
name: 'multicursor',
|
||||||
});
|
run: function (editor) {
|
||||||
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
|
editor.setPosition({
|
||||||
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
|
lineNumber: 1,
|
||||||
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
|
column: 1
|
||||||
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
|
});
|
||||||
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
|
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
|
||||||
editor.trigger('keyboard', monaco.editor.Handler.Type, {
|
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
|
||||||
text: 'some text - '
|
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
|
||||||
});
|
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
|
||||||
}
|
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
|
||||||
}
|
editor.trigger('keyboard', monaco.editor.Handler.Type, {
|
||||||
];
|
text: 'some text - '
|
||||||
})();
|
});
|
||||||
|
}
|
||||||
var panelContainer = document.getElementById('control');
|
}
|
||||||
var editorContainer = document.getElementById('editor');
|
];
|
||||||
var editors = {}, models = {};
|
})();
|
||||||
|
|
||||||
function onError(err) {
|
var panelContainer = document.getElementById('control');
|
||||||
console.error(err);
|
var editorContainer = document.getElementById('editor');
|
||||||
alert('error!!');
|
var editors = {},
|
||||||
}
|
models = {};
|
||||||
|
|
||||||
function getAllModes() {
|
function onError(err) {
|
||||||
var result = monaco.languages.getLanguages().map(function(language) { return language.id; });
|
console.error(err);
|
||||||
result.sort();
|
alert('error!!');
|
||||||
return result;
|
}
|
||||||
}
|
|
||||||
|
function getAllModes() {
|
||||||
function createEditor(container, mode) {
|
var result = monaco.languages.getLanguages().map(function (language) {
|
||||||
editors[mode] = monaco.editor.create(container, {
|
return language.id;
|
||||||
value: mode
|
});
|
||||||
});
|
result.sort();
|
||||||
var value = mode + '\n' + XHR_SAMPLES['sample.' + mode + '.txt'];
|
return result;
|
||||||
var model = monaco.editor.createModel(value, mode);
|
}
|
||||||
editors[mode].setModel(model);
|
|
||||||
}
|
function createEditor(container, mode) {
|
||||||
|
editors[mode] = monaco.editor.create(container, {
|
||||||
function createEditors(modes) {
|
value: mode
|
||||||
for (var i = 0; i < modes.length; i++) {
|
});
|
||||||
var container = document.createElement('div');
|
var value = mode + '\n' + XHR_SAMPLES['sample.' + mode + '.txt'];
|
||||||
container.style.width = '300px';
|
var model = monaco.editor.createModel(value, mode);
|
||||||
container.style.cssFloat = 'left';
|
editors[mode].setModel(model);
|
||||||
container.style.height = '200px';
|
}
|
||||||
container.style.border = '1px solid #ccc';
|
|
||||||
container.style.background = 'red';
|
function createEditors(modes) {
|
||||||
container.setAttribute('data-mime', modes[i]);
|
for (var i = 0; i < modes.length; i++) {
|
||||||
editorContainer.appendChild(container);
|
var container = document.createElement('div');
|
||||||
createEditor(container, modes[i]);
|
container.style.width = '300px';
|
||||||
}
|
container.style.cssFloat = 'left';
|
||||||
|
container.style.height = '200px';
|
||||||
var clearer = document.createElement('div');
|
container.style.border = '1px solid #ccc';
|
||||||
clearer.style.clear = 'both';
|
container.style.background = 'red';
|
||||||
editorContainer.appendChild(clearer);
|
container.setAttribute('data-mime', modes[i]);
|
||||||
}
|
editorContainer.appendChild(container);
|
||||||
|
createEditor(container, modes[i]);
|
||||||
function executeAction(action) {
|
}
|
||||||
for (var mime in editors) {
|
|
||||||
if (editors.hasOwnProperty(mime)) {
|
var clearer = document.createElement('div');
|
||||||
action(editors[mime]);
|
clearer.style.clear = 'both';
|
||||||
}
|
editorContainer.appendChild(clearer);
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
function executeAction(action) {
|
||||||
function createActions(actions) {
|
for (var mime in editors) {
|
||||||
for (var i = 0; i < actions.length; i++) {
|
if (editors.hasOwnProperty(mime)) {
|
||||||
var btn = document.createElement('button');
|
action(editors[mime]);
|
||||||
btn.appendChild(document.createTextNode('<<' + actions[i].name + '>>'));
|
}
|
||||||
btn.onclick = executeAction.bind(this, actions[i].run);
|
}
|
||||||
panelContainer.appendChild(btn);
|
}
|
||||||
}
|
|
||||||
}
|
function createActions(actions) {
|
||||||
|
for (var i = 0; i < actions.length; i++) {
|
||||||
createEditors(getAllModes());
|
var btn = document.createElement('button');
|
||||||
createActions(actions);
|
btn.appendChild(document.createTextNode('<<' + actions[i].name + '>>'));
|
||||||
|
btn.onclick = executeAction.bind(this, actions[i].run);
|
||||||
});
|
panelContainer.appendChild(btn);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
createEditors(getAllModes());
|
||||||
|
createActions(actions);
|
||||||
|
});
|
||||||
|
|||||||
@ -1,325 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
|
||||||
<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-2.0.1.css">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<script src="../metadata.js"></script>
|
|
||||||
<script src="dev-setup.js"></script>
|
|
||||||
<script src="tokenization.js"></script>
|
|
||||||
<script src="https://code.jquery.com/qunit/qunit-2.0.1.js"></script>
|
|
||||||
<script>
|
|
||||||
var GENERATE_TOKENS = false;
|
|
||||||
var LIMIT_TO_TEST = null;//'sample - xml';
|
|
||||||
loadEditor(function() {
|
|
||||||
let lazyModules = [
|
|
||||||
'vs/basic-languages/src/bat',
|
|
||||||
'vs/basic-languages/src/coffee',
|
|
||||||
'vs/basic-languages/src/cpp',
|
|
||||||
'vs/basic-languages/src/csharp',
|
|
||||||
'vs/basic-languages/src/dockerfile',
|
|
||||||
'vs/basic-languages/src/fsharp',
|
|
||||||
'vs/basic-languages/src/go',
|
|
||||||
'vs/basic-languages/src/handlebars',
|
|
||||||
'vs/basic-languages/src/html',
|
|
||||||
'vs/basic-languages/src/ini',
|
|
||||||
'vs/basic-languages/src/pug',
|
|
||||||
'vs/basic-languages/src/java',
|
|
||||||
'vs/basic-languages/src/lua',
|
|
||||||
'vs/basic-languages/src/markdown',
|
|
||||||
'vs/basic-languages/src/objective-c',
|
|
||||||
'vs/basic-languages/src/postiats',
|
|
||||||
'vs/basic-languages/src/php',
|
|
||||||
'vs/basic-languages/src/powershell',
|
|
||||||
'vs/basic-languages/src/python',
|
|
||||||
'vs/basic-languages/src/r',
|
|
||||||
'vs/basic-languages/src/razor',
|
|
||||||
'vs/basic-languages/src/ruby',
|
|
||||||
'vs/basic-languages/src/swift',
|
|
||||||
'vs/basic-languages/src/sql',
|
|
||||||
'vs/basic-languages/src/vb',
|
|
||||||
'vs/basic-languages/src/xml',
|
|
||||||
'vs/basic-languages/src/less',
|
|
||||||
'vs/basic-languages/src/scss',
|
|
||||||
'vs/basic-languages/src/css',
|
|
||||||
'vs/basic-languages/src/yaml',
|
|
||||||
|
|
||||||
'vs/language/typescript/src/mode',
|
|
||||||
'vs/language/css/cssMode',
|
|
||||||
'vs/language/json/jsonMode',
|
|
||||||
'vs/language/html/htmlMode'
|
|
||||||
];
|
|
||||||
|
|
||||||
console.log('editor loaded');
|
|
||||||
|
|
||||||
require(lazyModules, function() {
|
|
||||||
console.log('all lazy code loaded');
|
|
||||||
|
|
||||||
function resolveSample(sample) {
|
|
||||||
return sample.loadText().then(function(txt) {
|
|
||||||
return {
|
|
||||||
name: sample.name,
|
|
||||||
language: sample.mimeType,
|
|
||||||
text: txt
|
|
||||||
};
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
require(['./samples'], function(SAMPLES) {
|
|
||||||
Promise.all(
|
|
||||||
SAMPLES.map(resolveSample)
|
|
||||||
).then(function(samples) {
|
|
||||||
renderSamples(samples);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
function renderSamples(samples) {
|
|
||||||
samples = samples.filter(function(sample) {
|
|
||||||
if (typeof sample.language !== 'string') {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
if (sample.language === 'plaintext' || sample.language === 'text/plain') {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
// return sample.name === 'sample - css';
|
|
||||||
return /sample/.test(sample.name);
|
|
||||||
});
|
|
||||||
samples.sort(function(a,b) {
|
|
||||||
if (a.language === b.language) {
|
|
||||||
if (a.text < b.text) {
|
|
||||||
return -1;
|
|
||||||
}
|
|
||||||
if (a.text > b.text) {
|
|
||||||
return 1;
|
|
||||||
}
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
if (a.language < b.language) {
|
|
||||||
return -1;
|
|
||||||
}
|
|
||||||
return 1;
|
|
||||||
});
|
|
||||||
samples.forEach(renderSample);
|
|
||||||
generateTests();
|
|
||||||
}
|
|
||||||
|
|
||||||
var TEST_CASES = [];
|
|
||||||
|
|
||||||
function renderSample(sample, index) {
|
|
||||||
console.log('TEST #' + index + ': ' + sample.name);
|
|
||||||
|
|
||||||
if (LIMIT_TO_TEST && sample.name !== LIMIT_TO_TEST) {
|
|
||||||
TEST_CASES.push({ name: sample.name });
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
var testCase = {
|
|
||||||
name: sample.name,
|
|
||||||
// text: sample.text,
|
|
||||||
language: sample.language,
|
|
||||||
result: {
|
|
||||||
vs: extractColors(sample, 'vs'),
|
|
||||||
vs_dark: extractColors(sample, 'vs-dark'),
|
|
||||||
hc_black: extractColors(sample, 'hc-black'),
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
TEST_CASES.push(testCase);
|
|
||||||
}
|
|
||||||
|
|
||||||
function extractColors(sample, theme) {
|
|
||||||
var out = document.createElement('pre');
|
|
||||||
var txt = document.createTextNode(sample.text);
|
|
||||||
out.appendChild(txt);
|
|
||||||
document.body.appendChild(out);
|
|
||||||
monaco.editor.colorizeElement(out, {
|
|
||||||
theme: theme,
|
|
||||||
mimeType: sample.language
|
|
||||||
});
|
|
||||||
|
|
||||||
if (GENERATE_TOKENS) {
|
|
||||||
var tokens = monaco.editor.tokenize(sample.text || '', sample.language);
|
|
||||||
}
|
|
||||||
|
|
||||||
// console.log(out);
|
|
||||||
|
|
||||||
var lineElement = out.firstElementChild;
|
|
||||||
var allResult = [];
|
|
||||||
while (lineElement) {
|
|
||||||
// console.log(lineElement);
|
|
||||||
var pieces = lineElement.children;
|
|
||||||
var result = [];
|
|
||||||
|
|
||||||
if (GENERATE_TOKENS) {
|
|
||||||
var lineTokens = tokens.shift();
|
|
||||||
if (lineTokens.length > 0) {
|
|
||||||
for (var i = 0; i < lineTokens.length - 1; i++) {
|
|
||||||
lineTokens[i].length = lineTokens[i + 1].offset - lineTokens[i].offset;
|
|
||||||
}
|
|
||||||
lineTokens[lineTokens.length - 1].length = 1000000;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
for (var i = 0; i < pieces.length; i++) {
|
|
||||||
var piece = pieces[i];
|
|
||||||
|
|
||||||
// console.log(piece);
|
|
||||||
|
|
||||||
var text = piece.innerText;
|
|
||||||
|
|
||||||
var r = window.getComputedStyle(piece);
|
|
||||||
var color = rgbToHex(r.color);
|
|
||||||
|
|
||||||
// var isWhitespace = /^\s+$/.test(text);
|
|
||||||
|
|
||||||
// var partTokens = undefined;
|
|
||||||
|
|
||||||
if (GENERATE_TOKENS) {
|
|
||||||
let partTokens = [];
|
|
||||||
let partText = text;
|
|
||||||
while (lineTokens.length > 0 && partText.length > 0) {
|
|
||||||
let t = lineTokens.shift();
|
|
||||||
partTokens.push(t);
|
|
||||||
partText = partText.substr(t.length);
|
|
||||||
}
|
|
||||||
|
|
||||||
result.push({
|
|
||||||
text: text,
|
|
||||||
color: color,
|
|
||||||
tokens: partTokens
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
result.push({
|
|
||||||
text: text,
|
|
||||||
color: color,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
allResult.push(result);
|
|
||||||
|
|
||||||
lineElement = lineElement.nextElementSibling.nextElementSibling;
|
|
||||||
}
|
|
||||||
|
|
||||||
// console.log(JSON.stringify(allResult));
|
|
||||||
|
|
||||||
out.parentNode.removeChild(out);
|
|
||||||
|
|
||||||
return allResult;
|
|
||||||
}
|
|
||||||
|
|
||||||
var rgbCache = {};
|
|
||||||
function rgbToHex(rgb) {
|
|
||||||
if (!rgbCache[rgb]) {
|
|
||||||
var m = rgb.match(/rgb\((\d+), (\d+), (\d+)\)/);
|
|
||||||
var r = parseInt(m[1], 10);
|
|
||||||
var g = parseInt(m[2], 10);
|
|
||||||
var b = parseInt(m[3], 10);
|
|
||||||
var r = '#' + to2Hex(r) + to2Hex(g) + to2Hex(b);
|
|
||||||
rgbCache[rgb] = r;
|
|
||||||
}
|
|
||||||
return rgbCache[rgb];
|
|
||||||
}
|
|
||||||
|
|
||||||
function to2Hex(n) {
|
|
||||||
var r = n.toString(16);
|
|
||||||
if (r.length === 1) {
|
|
||||||
return '0' + r;
|
|
||||||
}
|
|
||||||
return r;
|
|
||||||
}
|
|
||||||
|
|
||||||
function generateTests() {
|
|
||||||
// var ta = document.createElement('textarea');
|
|
||||||
// ta.value = JSON.stringify(TEST_CASES, null, '\t');
|
|
||||||
// ta.style.display = 'fixed';
|
|
||||||
// ta.style.top = '0';
|
|
||||||
// ta.style.left = '0';
|
|
||||||
// document.body.appendChild(ta);
|
|
||||||
// ta.select();
|
|
||||||
// return;
|
|
||||||
|
|
||||||
for (var i = 0, len = TEST_CASES.length; i < len; i++) {
|
|
||||||
if (LIMIT_TO_TEST && TEST_CASES[i].name !== LIMIT_TO_TEST) {
|
|
||||||
|
|
||||||
// if (TEST_CASES[i].name !== 'sample - html') {
|
|
||||||
continue;
|
|
||||||
}
|
|
||||||
generateTest(TEST_CASES[i], EXPECTED[i]);
|
|
||||||
}
|
|
||||||
|
|
||||||
QUnit.start();
|
|
||||||
}
|
|
||||||
|
|
||||||
function mergeEqualColors(source) {
|
|
||||||
// return source;
|
|
||||||
|
|
||||||
let result = [];
|
|
||||||
for (let i = 0; i < source.length; i++) {
|
|
||||||
let color = source[i].color;
|
|
||||||
let text = source[i].text;
|
|
||||||
if (result.length > 0 && result[result.length - 1].color === color) {
|
|
||||||
result[result.length - 1].text += text;
|
|
||||||
} else {
|
|
||||||
result.push({
|
|
||||||
color: color,
|
|
||||||
text: text
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return result;
|
|
||||||
}
|
|
||||||
|
|
||||||
function generateTest(actual, expected) {
|
|
||||||
['vs', 'vs_dark', 'hc_black'].forEach(function(theme) {
|
|
||||||
// if (actual.name !== 'sample - bat') {
|
|
||||||
// return;
|
|
||||||
// }
|
|
||||||
QUnit.test(actual.name + ' ' + theme, function(assert) {
|
|
||||||
var _actual = actual.result[theme];
|
|
||||||
var _expected = expected.result[theme];
|
|
||||||
|
|
||||||
for (var i = 0; i < _actual.length; i++) {
|
|
||||||
var lineActual = mergeEqualColors(_actual[i]);
|
|
||||||
// .slice(0);
|
|
||||||
// for (var j = 1; j < lineActual.length; j++) {
|
|
||||||
// if (lineActual[j-1].color === lineActual[j].color) {
|
|
||||||
// lineActual[j-1] = {
|
|
||||||
// color: lineActual[j-1].color,
|
|
||||||
// text: lineActual[j-1].text + lineActual[j].text
|
|
||||||
// };
|
|
||||||
// lineActual.splice(j, 1);
|
|
||||||
// j--;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
var lineExpected = mergeEqualColors(_expected[i]);
|
|
||||||
// .slice(0);
|
|
||||||
// for (var j = 1; j < lineExpected.length; j++) {
|
|
||||||
// if (lineExpected[j-1].color === lineExpected[j].color) {
|
|
||||||
// lineExpected[j-1] = {
|
|
||||||
// color: lineExpected[j-1].color,
|
|
||||||
// text: lineExpected[j-1].text + lineExpected[j].text
|
|
||||||
// };
|
|
||||||
// // lineExpected[j-1].text += lineExpected[j].text;
|
|
||||||
// lineExpected.splice(j, 1);
|
|
||||||
// j--;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
assert.deepEqual(lineActual, lineExpected, 'Line #' + (i+1));
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
QUnit.config.autostart = false;
|
|
||||||
|
|
||||||
</script>
|
|
||||||
<div id="qunit"></div>
|
|
||||||
<div id="qunit-fixture"></div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
File diff suppressed because it is too large
Load Diff
@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"compilerOptions": {
|
"compilerOptions": {
|
||||||
"module": "CommonJS"
|
"module": "CommonJS"
|
||||||
},
|
},
|
||||||
"include": ["monaco.d.ts"],
|
"include": ["monaco.d.ts"],
|
||||||
"exclude": ["theme"]
|
"exclude": ["theme"]
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,8 +1,8 @@
|
|||||||
{
|
{
|
||||||
"entryPoints": ["monaco.d.ts"],
|
"entryPoints": ["monaco.d.ts"],
|
||||||
"out": "../../monaco-editor-website/api",
|
"out": "../../monaco-editor-website/api",
|
||||||
"theme": "./theme",
|
"theme": "./theme",
|
||||||
"name": "Monaco Editor API",
|
"name": "Monaco Editor API",
|
||||||
"readme": "none",
|
"readme": "none",
|
||||||
"hideGenerator": true
|
"hideGenerator": true
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,291 +1,302 @@
|
|||||||
body {
|
body {
|
||||||
padding: 54px 0 40px 0;
|
padding: 54px 0 40px 0;
|
||||||
overflow-y: scroll;
|
overflow-y: scroll;
|
||||||
}
|
}
|
||||||
|
|
||||||
body.home {
|
body.home {
|
||||||
padding-top: 0;
|
padding-top: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
body,
|
body,
|
||||||
input,
|
input,
|
||||||
button,
|
button,
|
||||||
select,
|
select,
|
||||||
textarea,
|
textarea,
|
||||||
.navbar-search .search-query {
|
.navbar-search .search-query {
|
||||||
font: 400 14px/1.4em "Segoe UI", "Open Sans", Calibri, Candara, Arial, sans-serif;
|
font: 400 14px/1.4em 'Segoe UI', 'Open Sans', Calibri, Candara, Arial, sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar .nav {
|
.navbar .nav {
|
||||||
float: left;
|
float: left;
|
||||||
margin-right: 0;
|
margin-right: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: #0066cc;
|
color: #0066cc;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
h1,
|
||||||
letter-spacing: -0.01em;
|
h2,
|
||||||
margin: 0;
|
h3,
|
||||||
line-height: normal;
|
h4,
|
||||||
}
|
h5,
|
||||||
|
h6 {
|
||||||
/***** Bootstrap Cosmo Overrides *****/
|
letter-spacing: -0.01em;
|
||||||
h1, h2 {
|
margin: 0;
|
||||||
font-family: "Segoe UI Light", "Segoe UI", "Open Sans", Calibri, Candara, Arial, sans-serif;
|
line-height: normal;
|
||||||
font-weight: 300;
|
}
|
||||||
}
|
|
||||||
h1 {
|
/***** Bootstrap Cosmo Overrides *****/
|
||||||
font-size: 72px;
|
h1,
|
||||||
letter-spacing: -0.02em;
|
h2 {
|
||||||
}
|
font-family: 'Segoe UI Light', 'Segoe UI', 'Open Sans', Calibri, Candara, Arial, sans-serif;
|
||||||
|
font-weight: 300;
|
||||||
.hero-unit h1 {
|
}
|
||||||
font-size: 48px;
|
h1 {
|
||||||
}
|
font-size: 72px;
|
||||||
|
letter-spacing: -0.02em;
|
||||||
h2 {
|
}
|
||||||
font-size: 26px;
|
|
||||||
}
|
.hero-unit h1 {
|
||||||
|
font-size: 48px;
|
||||||
h3 {
|
}
|
||||||
font-size: 26px;
|
|
||||||
}
|
h2 {
|
||||||
|
font-size: 26px;
|
||||||
h4 {
|
}
|
||||||
font-size: 16px;
|
|
||||||
}
|
h3 {
|
||||||
|
font-size: 26px;
|
||||||
h1 small,
|
}
|
||||||
h2 small,
|
|
||||||
h3 small,
|
h4 {
|
||||||
h4 small,
|
font-size: 16px;
|
||||||
h5 small,
|
}
|
||||||
h6 small {
|
|
||||||
color: #999;
|
h1 small,
|
||||||
}
|
h2 small,
|
||||||
|
h3 small,
|
||||||
.alert-heading,
|
h4 small,
|
||||||
.alert h1,
|
h5 small,
|
||||||
.alert h2,
|
h6 small {
|
||||||
.alert h3,
|
color: #999;
|
||||||
.alert h4,
|
}
|
||||||
.alert h5,
|
|
||||||
.alert h6 {
|
.alert-heading,
|
||||||
color: inherit;
|
.alert h1,
|
||||||
}
|
.alert h2,
|
||||||
|
.alert h3,
|
||||||
.alert-info {
|
.alert h4,
|
||||||
color: #3a87ad;
|
.alert h5,
|
||||||
background-color: #d9edf7;
|
.alert h6 {
|
||||||
}
|
color: inherit;
|
||||||
|
}
|
||||||
.navbar-inverse .navbar-inner {
|
|
||||||
background-color: #68217A;
|
.alert-info {
|
||||||
-webkit-filter: none;
|
color: #3a87ad;
|
||||||
filter: none;
|
background-color: #d9edf7;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-inverse.home .navbar-inner {
|
.navbar-inverse .navbar-inner {
|
||||||
background-color: transparent;
|
background-color: #68217a;
|
||||||
}
|
-webkit-filter: none;
|
||||||
|
filter: none;
|
||||||
.navbar-inverse .btn-navbar {
|
}
|
||||||
background: transparent;
|
|
||||||
margin-top: 14px;
|
.navbar-inverse.home .navbar-inner {
|
||||||
}
|
background-color: transparent;
|
||||||
|
}
|
||||||
.navbar-inverse .btn-navbar:hover,
|
|
||||||
.navbar-inverse .btn-navbar:focus,
|
.navbar-inverse .btn-navbar {
|
||||||
.navbar-inverse .btn-navbar:active,
|
background: transparent;
|
||||||
.navbar-inverse .btn-navbar.active,
|
margin-top: 14px;
|
||||||
.navbar-inverse .btn-navbar.disabled,
|
}
|
||||||
.navbar-inverse .btn-navbar[disabled] {
|
|
||||||
background: #442359;
|
.navbar-inverse .btn-navbar:hover,
|
||||||
}
|
.navbar-inverse .btn-navbar:focus,
|
||||||
|
.navbar-inverse .btn-navbar:active,
|
||||||
.btn-primary {
|
.navbar-inverse .btn-navbar.active,
|
||||||
background-color: #0072C6;
|
.navbar-inverse .btn-navbar.disabled,
|
||||||
}
|
.navbar-inverse .btn-navbar[disabled] {
|
||||||
|
background: #442359;
|
||||||
.home .hero-unit {
|
}
|
||||||
margin-top: -54px;
|
|
||||||
position: relative;
|
.btn-primary {
|
||||||
z-index: 100;
|
background-color: #0072c6;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hero-unit {
|
.home .hero-unit {
|
||||||
font-weight: normal;
|
margin-top: -54px;
|
||||||
}
|
position: relative;
|
||||||
|
z-index: 100;
|
||||||
.hero-unit h1 {
|
}
|
||||||
margin: 0 0 6px;
|
|
||||||
}
|
.hero-unit {
|
||||||
|
font-weight: normal;
|
||||||
.nav-tabs > li > a {
|
}
|
||||||
color: #999;
|
|
||||||
}
|
.hero-unit h1 {
|
||||||
|
margin: 0 0 6px;
|
||||||
.nav-tabs > li > a:hover {
|
}
|
||||||
color: #555;
|
|
||||||
}
|
.nav-tabs > li > a {
|
||||||
|
color: #999;
|
||||||
.nav-tabs > .active > a,
|
}
|
||||||
.nav-tabs > .active > a:hover,
|
|
||||||
.nav-tabs > .active > a:focus {
|
.nav-tabs > li > a:hover {
|
||||||
color: #0072C6;
|
color: #555;
|
||||||
}
|
}
|
||||||
|
|
||||||
/***** General *****/
|
.nav-tabs > .active > a,
|
||||||
|
.nav-tabs > .active > a:hover,
|
||||||
body > section > .container {
|
.nav-tabs > .active > a:focus {
|
||||||
padding-top: 12px;
|
color: #0072c6;
|
||||||
}
|
}
|
||||||
|
|
||||||
.masthead {
|
/***** General *****/
|
||||||
background-color: #0072C6;
|
|
||||||
color: white;
|
body > section > .container {
|
||||||
}
|
padding-top: 12px;
|
||||||
|
}
|
||||||
.masthead .hero-unit {
|
|
||||||
padding: 30px 0 0;
|
.masthead {
|
||||||
background: none;
|
background-color: #0072c6;
|
||||||
}
|
color: white;
|
||||||
|
}
|
||||||
.navbar.home {
|
|
||||||
position: relative;
|
.masthead .hero-unit {
|
||||||
z-index: 500;
|
padding: 30px 0 0;
|
||||||
}
|
background: none;
|
||||||
|
}
|
||||||
.navbar .nav>li>a {
|
|
||||||
text-shadow: none;
|
.navbar.home {
|
||||||
padding-top: 18px;
|
position: relative;
|
||||||
font-size: 14px;
|
z-index: 500;
|
||||||
text-transform: uppercase;
|
}
|
||||||
}
|
|
||||||
|
.navbar .nav > li > a {
|
||||||
.navbar-inverse .nav-collapse .nav>li>a {
|
text-shadow: none;
|
||||||
color: white;
|
padding-top: 18px;
|
||||||
padding-left: 0;
|
font-size: 14px;
|
||||||
}
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
.navbar-inverse .nav>li>a.nav-item:focus, .navbar-inverse .nav>li>a.nav-item:hover {
|
|
||||||
background-color: rgba(0,0,0,.12);
|
.navbar-inverse .nav-collapse .nav > li > a {
|
||||||
}
|
color: white;
|
||||||
|
padding-left: 0;
|
||||||
.navbar-inverse .nav .active>a.nav-item, .navbar-inverse .nav .active>a.nav-item:hover, .navbar-inverse .nav .active>a.nav-item:focus {
|
}
|
||||||
color:#fff;
|
|
||||||
background-color: rgba(0,0,0,.24);
|
.navbar-inverse .nav > li > a.nav-item:focus,
|
||||||
-webkit-box-shadow: none;
|
.navbar-inverse .nav > li > a.nav-item:hover {
|
||||||
box-shadow: none;
|
background-color: rgba(0, 0, 0, 0.12);
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar .logo {
|
.navbar-inverse .nav .active > a.nav-item,
|
||||||
/*background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyOCIgaGVpZ2h0PSIyOSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTIxIDBsLTExIDEyLTcuMzMzLTUuNjY2LTIuNjY3IDEuNjgydjEzLjk4NGwyLjY2NyAxLjY2NiA3LjMzMy01LjY2NiAxMSAxMSA3LTN2LTIyLjMzM2wtNy0zLjY2N3ptLTE4IDE5di05bDQgNS00IDR6bTExLTRsNy02djEybC03LTZ6Ii8+PC9zdmc+") left center no-repeat;*/
|
.navbar-inverse .nav .active > a.nav-item:hover,
|
||||||
/*padding: 16px 12px 0 34px;*/
|
.navbar-inverse .nav .active > a.nav-item:focus {
|
||||||
padding: 16px 12px 0 0px;
|
color: #fff;
|
||||||
height: 35px;
|
background-color: rgba(0, 0, 0, 0.24);
|
||||||
display: block;
|
-webkit-box-shadow: none;
|
||||||
float: left;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar .logo a {
|
.navbar .logo {
|
||||||
color: #fff;
|
/*background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyOCIgaGVpZ2h0PSIyOSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTIxIDBsLTExIDEyLTcuMzMzLTUuNjY2LTIuNjY3IDEuNjgydjEzLjk4NGwyLjY2NyAxLjY2NiA3LjMzMy01LjY2NiAxMSAxMSA3LTN2LTIyLjMzM2wtNy0zLjY2N3ptLTE4IDE5di05bDQgNS00IDR6bTExLTRsNy02djEybC03LTZ6Ii8+PC9zdmc+") left center no-repeat;*/
|
||||||
font-size: 24px;
|
/*padding: 16px 12px 0 34px;*/
|
||||||
letter-spacing: -1px;
|
padding: 16px 12px 0 0px;
|
||||||
}
|
height: 35px;
|
||||||
|
display: block;
|
||||||
.navbar-fixed-top {
|
float: left;
|
||||||
z-index: 500;
|
}
|
||||||
}
|
|
||||||
|
.navbar .logo a {
|
||||||
.flgroup:after {
|
color: #fff;
|
||||||
content: "";
|
font-size: 24px;
|
||||||
display: block;
|
letter-spacing: -1px;
|
||||||
visibility: hidden;
|
}
|
||||||
height: 0;
|
|
||||||
clear: both;
|
.navbar-fixed-top {
|
||||||
}
|
z-index: 500;
|
||||||
|
}
|
||||||
/* Controls */
|
|
||||||
|
.flgroup:after {
|
||||||
/* Media Queries */
|
content: '';
|
||||||
@media (min-width: 1200px) {
|
display: block;
|
||||||
h1, h2 {
|
visibility: hidden;
|
||||||
letter-spacing: -0.04em;
|
height: 0;
|
||||||
}
|
clear: both;
|
||||||
|
}
|
||||||
.hero-unit h1 {
|
|
||||||
font-size: 72px;
|
/* Controls */
|
||||||
}
|
|
||||||
|
/* Media Queries */
|
||||||
h2 {
|
@media (min-width: 1200px) {
|
||||||
font-size: 36px;
|
h1,
|
||||||
}
|
h2 {
|
||||||
|
letter-spacing: -0.04em;
|
||||||
}
|
}
|
||||||
|
|
||||||
#gh-link {
|
.hero-unit h1 {
|
||||||
display: none;
|
font-size: 72px;
|
||||||
position: fixed;
|
}
|
||||||
top: 0;
|
|
||||||
right: 0;
|
h2 {
|
||||||
border: 0;
|
font-size: 36px;
|
||||||
margin:0;
|
}
|
||||||
z-index: 1000;
|
}
|
||||||
}
|
|
||||||
@media (min-width: 980px) {
|
#gh-link {
|
||||||
#gh-link {
|
display: none;
|
||||||
display: block;
|
position: fixed;
|
||||||
}
|
top: 0;
|
||||||
}
|
right: 0;
|
||||||
|
border: 0;
|
||||||
@media (min-width: 980px) {
|
margin: 0;
|
||||||
.navbar .nav {
|
z-index: 1000;
|
||||||
float: right;
|
}
|
||||||
}
|
@media (min-width: 980px) {
|
||||||
|
#gh-link {
|
||||||
.navbar-inverse .nav-collapse .nav>li>a {
|
display: block;
|
||||||
padding-left: 15px;
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
@media (min-width: 980px) {
|
||||||
@media (min-width: 768px) and (max-width: 979px) {
|
.navbar .nav {
|
||||||
h1 {
|
float: right;
|
||||||
letter-spacing: -0.02em;
|
}
|
||||||
}
|
|
||||||
}
|
.navbar-inverse .nav-collapse .nav > li > a {
|
||||||
|
padding-left: 15px;
|
||||||
@media (max-width: 979px) {
|
}
|
||||||
body {
|
}
|
||||||
padding: inherit;
|
|
||||||
}
|
@media (min-width: 768px) and (max-width: 979px) {
|
||||||
|
h1 {
|
||||||
.navbar-fixed-top, .navbar-fixed-bottom, .navbar-static-top {
|
letter-spacing: -0.02em;
|
||||||
margin-right: inherit;
|
}
|
||||||
margin-left: inherit;
|
}
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
@media (max-width: 979px) {
|
||||||
|
body {
|
||||||
.navbar-fixed-top .navbar-inner {
|
padding: inherit;
|
||||||
padding: 0 20px;
|
}
|
||||||
}
|
|
||||||
|
.navbar-fixed-top,
|
||||||
.navbar .container {
|
.navbar-fixed-bottom,
|
||||||
width: 724px;
|
.navbar-static-top {
|
||||||
}
|
margin-right: inherit;
|
||||||
}
|
margin-left: inherit;
|
||||||
|
margin-bottom: 0;
|
||||||
@media (max-width: 767px) {
|
}
|
||||||
.navbar .container {
|
|
||||||
width: 100%;
|
.navbar-fixed-top .navbar-inner {
|
||||||
}
|
padding: 0 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 480px) {
|
.navbar .container {
|
||||||
.navbar .logo a {
|
width: 724px;
|
||||||
display: none;
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
@media (max-width: 767px) {
|
||||||
|
.navbar .container {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 480px) {
|
||||||
|
.navbar .logo a {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
@ -1,168 +1,229 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
<head>
|
||||||
<head>
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
<meta name="viewport" content="width=device-width" />
|
||||||
<meta name="viewport" content="width=device-width">
|
|
||||||
|
<title>Monaco Editor</title>
|
||||||
<title>Monaco Editor</title>
|
|
||||||
|
<link data-inline="yes-please" href="./lib/bootstrap-cosmo.css" rel="stylesheet" />
|
||||||
<link data-inline="yes-please" href="./lib/bootstrap-cosmo.css" rel="stylesheet">
|
<link data-inline="yes-please" href="./lib/bootstrap-responsive.min.css" rel="stylesheet" />
|
||||||
<link data-inline="yes-please" href="./lib/bootstrap-responsive.min.css" rel="stylesheet">
|
<link data-inline="yes-please" href="./all.css" rel="stylesheet" />
|
||||||
<link data-inline="yes-please" href="./all.css" rel="stylesheet">
|
<link data-inline="yes-please" href="./index/index.css" rel="stylesheet" />
|
||||||
<link data-inline="yes-please" href="./index/index.css" rel="stylesheet">
|
|
||||||
|
<link
|
||||||
<link data-name="vs/editor/editor.main" rel="stylesheet" href="../release/dev/vs/editor/editor.main.css">
|
data-name="vs/editor/editor.main"
|
||||||
</head>
|
rel="stylesheet"
|
||||||
|
href="../release/dev/vs/editor/editor.main.css"
|
||||||
<body>
|
/>
|
||||||
<pre data-preload="index/samples/sample.typescript.txt"></pre>
|
</head>
|
||||||
<pre data-preload="index/samples/diff.lhs.txt"></pre>
|
|
||||||
<pre data-preload="index/samples/diff.rhs.txt"></pre>
|
<body>
|
||||||
<a id="gh-link" href="https://github.com/Microsoft/monaco-editor"><img
|
<pre data-preload="index/samples/sample.typescript.txt"></pre>
|
||||||
width="149" height="149" alt="Fork me on GitHub" src="./fork.png"/></a>
|
<pre data-preload="index/samples/diff.lhs.txt"></pre>
|
||||||
<nav class="navbar navbar-inverse navbar-fixed-top">
|
<pre data-preload="index/samples/diff.rhs.txt"></pre>
|
||||||
<div class="navbar-inner">
|
<a id="gh-link" href="https://github.com/Microsoft/monaco-editor"
|
||||||
<div class="container">
|
><img width="149" height="149" alt="Fork me on GitHub" src="./fork.png"
|
||||||
<div class="logo">
|
/></a>
|
||||||
<a href="index.html">Monaco Editor</a>
|
<nav class="navbar navbar-inverse navbar-fixed-top">
|
||||||
</div>
|
<div class="navbar-inner">
|
||||||
<!-- collapse button for smaller screens -->
|
<div class="container">
|
||||||
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
|
<div class="logo">
|
||||||
<span class="icon-bar"></span>
|
<a href="index.html">Monaco Editor</a>
|
||||||
<span class="icon-bar"></span>
|
</div>
|
||||||
<span class="icon-bar"></span>
|
<!-- collapse button for smaller screens -->
|
||||||
</button>
|
<button
|
||||||
|
type="button"
|
||||||
<!-- navbar title -->
|
class="btn btn-navbar"
|
||||||
<div class="nav-collapse collapse">
|
data-toggle="collapse"
|
||||||
<ul class="nav">
|
data-target=".nav-collapse"
|
||||||
<li><a class="nav-item" href="index.html">Home</a></li>
|
>
|
||||||
<li><a class="nav-item" href="api/index.html">API Doc</a></li>
|
<span class="icon-bar"></span>
|
||||||
<li><a class="nav-item" href="playground.html">Playground</a></li>
|
<span class="icon-bar"></span>
|
||||||
<li><a class="nav-item" href="monarch.html">Monarch</a></li>
|
<span class="icon-bar"></span>
|
||||||
<li><a class="nav-item" target="_blank" href="https://registry.npmjs.org/monaco-editor/-/monaco-editor-{{version}}.tgz">Download {{version}}</a></li>
|
</button>
|
||||||
</ul>
|
|
||||||
</div>
|
<!-- navbar title -->
|
||||||
</div>
|
<div class="nav-collapse collapse">
|
||||||
</div>
|
<ul class="nav">
|
||||||
</nav>
|
<li><a class="nav-item" href="index.html">Home</a></li>
|
||||||
<section class="try">
|
<li><a class="nav-item" href="api/index.html">API Doc</a></li>
|
||||||
<div class="container">
|
<li><a class="nav-item" href="playground.html">Playground</a></li>
|
||||||
<h3>About</h3>
|
<li><a class="nav-item" href="monarch.html">Monarch</a></li>
|
||||||
<div class="row">
|
<li>
|
||||||
<div class="span12">
|
<a
|
||||||
<br/>
|
class="nav-item"
|
||||||
<p>The Monaco Editor is the code editor that powers <a href="https://github.com/Microsoft/vscode">VS Code</a>.
|
target="_blank"
|
||||||
A good page describing the code editor's features is <a href="https://code.visualstudio.com/docs/editor/editingevolved">here</a>.</p>
|
href="https://registry.npmjs.org/monaco-editor/-/monaco-editor-{{version}}.tgz"
|
||||||
|
>Download {{version}}</a
|
||||||
<p>It is licensed under the MIT License and supports Edge, Chrome, Firefox, Safari and Opera.</p>
|
>
|
||||||
|
</li>
|
||||||
<p>The Monaco editor is <span style="font-weight:bold;color:#ff5722;">not</span> supported in mobile browsers or mobile web frameworks. </p>
|
</ul>
|
||||||
|
</div>
|
||||||
<p>Find more information at the <a href="https://github.com/Microsoft/monaco-editor">Monaco Editor repo</a>.</p>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</nav>
|
||||||
<hr/>
|
<section class="try">
|
||||||
<h3>Download v{{version}}</h3>
|
<div class="container">
|
||||||
<div class="row">
|
<h3>About</h3>
|
||||||
<div class="span12">
|
<div class="row">
|
||||||
<br/>
|
<div class="span12">
|
||||||
<p>The latest released version is <strong>{{version}}</strong>.</p>
|
<br />
|
||||||
<p>Download with this direct <a target="_blank" href="https://registry.npmjs.org/monaco-editor/-/monaco-editor-{{version}}.tgz">download link</a>
|
<p>
|
||||||
or <a href="https://www.npmjs.com/package/monaco-editor">from npm</a>:</p>
|
The Monaco Editor is the code editor that powers
|
||||||
<pre style="color:black">npm install monaco-editor@{{version}}</pre>
|
<a href="https://github.com/Microsoft/vscode">VS Code</a>. A good page describing the
|
||||||
</div>
|
code editor's features is
|
||||||
</div>
|
<a href="https://code.visualstudio.com/docs/editor/editingevolved">here</a>.
|
||||||
<hr/>
|
</p>
|
||||||
<h3>Editor</h3>
|
|
||||||
<div class="editor row">
|
<p>
|
||||||
<div class="span3">
|
It is licensed under the MIT License and supports Edge, Chrome, Firefox, Safari and
|
||||||
<h4 title="Syntax colorization plus support for errors, warnings, IntelliSense, formatting and outlining">Rich IntelliSense, Validation</h4>
|
Opera.
|
||||||
<p>TypeScript, JavaScript, CSS, LESS, SCSS, JSON, HTML</p>
|
</p>
|
||||||
<br>
|
|
||||||
<h4 title="Syntax colorization">Basic Syntax Colorization</h4>
|
<p>
|
||||||
<p>XML, PHP, C#, C++, Razor, Markdown, Diff, Java, VB, CoffeeScript, Handlebars, Batch, Pug, F#, Lua, Powershell,
|
The Monaco editor is
|
||||||
Python, Ruby, SASS, R, Objective-C</p>
|
<span style="font-weight: bold; color: #ff5722">not</span>
|
||||||
<br>
|
supported in mobile browsers or mobile web frameworks.
|
||||||
<p>Colorizers are implemented using <a href="monarch.html"
|
</p>
|
||||||
target="_blank">Monarch</a>.</p>
|
|
||||||
</div>
|
<p>
|
||||||
<div class="span9">
|
Find more information at the
|
||||||
<div class="row">
|
<a href="https://github.com/Microsoft/monaco-editor">Monaco Editor repo</a>.
|
||||||
<div class="span4">
|
</p>
|
||||||
<label class="control-label">Language</label>
|
</div>
|
||||||
<select class="language-picker"></select>
|
</div>
|
||||||
</div>
|
<hr />
|
||||||
<div class="span4">
|
<h3>Download v{{version}}</h3>
|
||||||
<label class="control-label">Theme</label>
|
<div class="row">
|
||||||
<select class="theme-picker">
|
<div class="span12">
|
||||||
<option>Visual Studio</option>
|
<br />
|
||||||
<option>Visual Studio Dark</option>
|
<p>The latest released version is <strong>{{version}}</strong>.</p>
|
||||||
<option>High Contrast Dark</option>
|
<p>
|
||||||
</select>
|
Download with this direct
|
||||||
</div>
|
<a
|
||||||
</div>
|
target="_blank"
|
||||||
<div class="editor-frame">
|
href="https://registry.npmjs.org/monaco-editor/-/monaco-editor-{{version}}.tgz"
|
||||||
<div class="loading editor" style="display: none;">
|
>download link</a
|
||||||
<div class="progress progress-striped active">
|
>
|
||||||
<div class="bar"></div>
|
or
|
||||||
</div>
|
<a href="https://www.npmjs.com/package/monaco-editor">from npm</a>:
|
||||||
</div>
|
</p>
|
||||||
<div id="editor"></div>
|
<pre style="color: black">npm install monaco-editor@{{version}}</pre>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<hr />
|
||||||
<hr>
|
<h3>Editor</h3>
|
||||||
<h3>Diff Editor</h3>
|
<div class="editor row">
|
||||||
<div class="editor row">
|
<div class="span3">
|
||||||
<div class="span3">
|
<h4
|
||||||
<h4 title="As you type diffing for all supported languages">Side by side live comparison</h4>
|
title="Syntax colorization plus support for errors, warnings, IntelliSense, formatting and outlining"
|
||||||
<p>Supports all languages out of the box</p>
|
>
|
||||||
</div>
|
Rich IntelliSense, Validation
|
||||||
<div class="span9">
|
</h4>
|
||||||
<div class="row">
|
<p>TypeScript, JavaScript, CSS, LESS, SCSS, JSON, HTML</p>
|
||||||
<div class="span8">
|
<br />
|
||||||
<div class="checkbox">
|
<h4 title="Syntax colorization">Basic Syntax Colorization</h4>
|
||||||
<label class="control-label">
|
<p>
|
||||||
<input id="inline-diff-checkbox" type="checkbox" value=""> Inline diff
|
XML, PHP, C#, C++, Razor, Markdown, Diff, Java, VB, CoffeeScript, Handlebars, Batch,
|
||||||
</label>
|
Pug, F#, Lua, Powershell, Python, Ruby, SASS, R, Objective-C
|
||||||
</div>
|
</p>
|
||||||
</div>
|
<br />
|
||||||
</div>
|
<p>
|
||||||
<div class="editor-frame">
|
Colorizers are implemented using
|
||||||
<div class="loading diff-editor" style="display: none;">
|
<a href="monarch.html" target="_blank">Monarch</a>.
|
||||||
<div class="progress progress-striped active">
|
</p>
|
||||||
<div class="bar"></div>
|
</div>
|
||||||
</div>
|
<div class="span9">
|
||||||
</div>
|
<div class="row">
|
||||||
<div id="diff-editor"></div>
|
<div class="span4">
|
||||||
</div>
|
<label class="control-label">Language</label>
|
||||||
</div>
|
<select class="language-picker"></select>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="span4">
|
||||||
|
<label class="control-label">Theme</label>
|
||||||
</section>
|
<select class="theme-picker">
|
||||||
|
<option>Visual Studio</option>
|
||||||
<footer class="container">
|
<option>Visual Studio Dark</option>
|
||||||
<hr>
|
<option>High Contrast Dark</option>
|
||||||
<p class="text-center">
|
</select>
|
||||||
<a href="https://microsoft.com" title="Microsoft">
|
</div>
|
||||||
<img src="https://opensource.microsoft.com/assets/images/Microsoft_logo.svg" alt="Microsoft" style="max-height:23px;margin-bottom:12px;">
|
</div>
|
||||||
</a>
|
<div class="editor-frame">
|
||||||
<br/>
|
<div class="loading editor" style="display: none">
|
||||||
<small>© {{year}} Microsoft</small>
|
<div class="progress progress-striped active">
|
||||||
</p>
|
<div class="bar"></div>
|
||||||
</footer>
|
</div>
|
||||||
|
</div>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js" integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ=" crossorigin="anonymous"></script>
|
<div id="editor"></div>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.0/bootstrap.min.js" integrity="sha256-u+l2mGjpmGK/mFgUncmMcFKdMijvV+J3odlDJZSNUu8=" crossorigin="anonymous"></script>
|
</div>
|
||||||
|
</div>
|
||||||
<script>var require = { paths: { 'vs': '../release/dev/vs' } };</script>
|
</div>
|
||||||
<script src="../release/dev/vs/loader.js"></script>
|
<hr />
|
||||||
<script src="../release/dev/vs/editor/editor.main.nls.js"></script>
|
<h3>Diff Editor</h3>
|
||||||
<script src="../release/dev/vs/editor/editor.main.js"></script>
|
<div class="editor row">
|
||||||
<script data-inline="yes-please" src="./index/index.js"></script>
|
<div class="span3">
|
||||||
|
<h4 title="As you type diffing for all supported languages">
|
||||||
</body>
|
Side by side live comparison
|
||||||
</html>
|
</h4>
|
||||||
|
<p>Supports all languages out of the box</p>
|
||||||
|
</div>
|
||||||
|
<div class="span9">
|
||||||
|
<div class="row">
|
||||||
|
<div class="span8">
|
||||||
|
<div class="checkbox">
|
||||||
|
<label class="control-label">
|
||||||
|
<input id="inline-diff-checkbox" type="checkbox" value="" />
|
||||||
|
Inline diff
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="editor-frame">
|
||||||
|
<div class="loading diff-editor" style="display: none">
|
||||||
|
<div class="progress progress-striped active">
|
||||||
|
<div class="bar"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="diff-editor"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<footer class="container">
|
||||||
|
<hr />
|
||||||
|
<p class="text-center">
|
||||||
|
<a href="https://microsoft.com" title="Microsoft">
|
||||||
|
<img
|
||||||
|
src="https://opensource.microsoft.com/assets/images/Microsoft_logo.svg"
|
||||||
|
alt="Microsoft"
|
||||||
|
style="max-height: 23px; margin-bottom: 12px"
|
||||||
|
/>
|
||||||
|
</a>
|
||||||
|
<br />
|
||||||
|
<small>© {{year}} Microsoft</small>
|
||||||
|
</p>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
<script
|
||||||
|
src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"
|
||||||
|
integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ="
|
||||||
|
crossorigin="anonymous"
|
||||||
|
></script>
|
||||||
|
<script
|
||||||
|
src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.0/bootstrap.min.js"
|
||||||
|
integrity="sha256-u+l2mGjpmGK/mFgUncmMcFKdMijvV+J3odlDJZSNUu8="
|
||||||
|
crossorigin="anonymous"
|
||||||
|
></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
var require = { paths: { vs: '../release/dev/vs' } };
|
||||||
|
</script>
|
||||||
|
<script src="../release/dev/vs/loader.js"></script>
|
||||||
|
<script src="../release/dev/vs/editor/editor.main.nls.js"></script>
|
||||||
|
<script src="../release/dev/vs/editor/editor.main.js"></script>
|
||||||
|
<script data-inline="yes-please" src="./index/index.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@ -1,256 +1,258 @@
|
|||||||
.try .drops {
|
.try .drops {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
float: right;
|
float: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .drops li {
|
.try .drops li {
|
||||||
float: left;
|
float: left;
|
||||||
width: auto;
|
width: auto;
|
||||||
height: auto;
|
height: auto;
|
||||||
text-indent: 0;
|
text-indent: 0;
|
||||||
font-size: 26px;
|
font-size: 26px;
|
||||||
line-height: normal;
|
line-height: normal;
|
||||||
margin: 0 12px;
|
margin: 0 12px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .drops li a:hover,
|
.try .drops li a:hover,
|
||||||
.try .drops li a:focus {
|
.try .drops li a:focus {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .drops li h4 {
|
.try .drops li h4 {
|
||||||
color: #999;
|
color: #999;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .drops li.active h4,
|
.try .drops li.active h4,
|
||||||
.try .drops li.active:hover h4 {
|
.try .drops li.active:hover h4 {
|
||||||
color: #0072C6;
|
color: #0072c6;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .drops li:hover h4 {
|
.try .drops li:hover h4 {
|
||||||
color: rgba(0, 114, 198, .5);
|
color: rgba(0, 114, 198, 0.5);
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor.row {
|
.try .editor.row {
|
||||||
padding: 18px 0
|
padding: 18px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .row h4 {
|
.try .row h4 {
|
||||||
padding-bottom: 6px;
|
padding-bottom: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .tile {
|
.try .tile {
|
||||||
position: relative;
|
position: relative;
|
||||||
height: 72px;
|
height: 72px;
|
||||||
border: 1px solid #ddd;
|
border: 1px solid #ddd;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
|
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
|
||||||
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
|
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
|
||||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
|
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
|
||||||
|
|
||||||
-webkit-box-sizing: border-box;
|
-webkit-box-sizing: border-box;
|
||||||
-o-box-sizing: border-box;
|
-o-box-sizing: border-box;
|
||||||
-moz-box-sizing: border-box;
|
-moz-box-sizing: border-box;
|
||||||
-ms-box-sizing: border-box;
|
-ms-box-sizing: border-box;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .tile:hover {
|
.try .tile:hover {
|
||||||
-webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
|
-webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
|
||||||
-moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
|
-moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
|
||||||
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
|
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .tile h4 {
|
.try .tile h4 {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 12px;
|
right: 12px;
|
||||||
bottom: 12px;
|
bottom: 12px;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .tile .glyph {
|
.try .tile .glyph {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 12px;
|
left: 12px;
|
||||||
bottom: -6px;
|
bottom: -6px;
|
||||||
background: url('../img/cloud.png') no-repeat;
|
background: url('../img/cloud.png') no-repeat;
|
||||||
background-size: 80px 43px;
|
background-size: 80px 43px;
|
||||||
height: 43px;
|
height: 43px;
|
||||||
width: 80px;
|
width: 80px;
|
||||||
|
|
||||||
opacity: .5;
|
opacity: 0.5;
|
||||||
transition: opacity .5s ease, bottom .5s ease;
|
transition: opacity 0.5s ease, bottom 0.5s ease;
|
||||||
-webkit-transition: opacity .5s ease, bottom .5s ease;
|
-webkit-transition: opacity 0.5s ease, bottom 0.5s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .tile:hover .glyph {
|
.try .tile:hover .glyph {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
bottom: -2px;
|
bottom: -2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor.row h4 small {
|
.try .editor.row h4 small {
|
||||||
color: #555;
|
color: #555;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor.row .control-label {
|
.try .editor.row .control-label {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
position: relative;
|
position: relative;
|
||||||
top: -4px;
|
top: -4px;
|
||||||
margin-right: 4px;
|
margin-right: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor.row .monaco-editor .find-widget input[type="text"] {
|
.try .editor.row .monaco-editor .find-widget input[type='text'] {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
-webkit-box-shadow: none;
|
-webkit-box-shadow: none;
|
||||||
-moz-box-shadow: none;
|
-moz-box-shadow: none;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
-webkit-transition: none;
|
-webkit-transition: none;
|
||||||
-moz-transition: none;
|
-moz-transition: none;
|
||||||
-o-transition: none;
|
-o-transition: none;
|
||||||
transition: none;
|
transition: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor.row .monaco-editor .find-widget .monaco-checkbox .label {
|
.try .editor.row .monaco-editor .find-widget .monaco-checkbox .label {
|
||||||
min-height: 20px;
|
min-height: 20px;
|
||||||
min-width: 20px;
|
min-width: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor.row .monaco-editor .find-widget .close {
|
.try .editor.row .monaco-editor .find-widget .close {
|
||||||
float: none;
|
float: none;
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor .editor-frame {
|
.try .editor .editor-frame {
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor .editor-frame #editor,
|
.try .editor .editor-frame #editor,
|
||||||
.try .editor .editor-frame #diff-editor {
|
.try .editor .editor-frame #diff-editor {
|
||||||
height: 400px;
|
height: 400px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
border: 1px solid #eee;
|
border: 1px solid #eee;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor .editor-frame .loading {
|
.try .editor .editor-frame .loading {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background-color: rgba(255, 255, 255, .5);
|
background-color: rgba(255, 255, 255, 0.5);
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
display: none;
|
display: none;
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor .editor-frame .progress {
|
.try .editor .editor-frame .progress {
|
||||||
width: 50%;
|
width: 50%;
|
||||||
margin: 15% auto 0;
|
margin: 15% auto 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor .editor-frame .progress .bar {
|
.try .editor .editor-frame .progress .bar {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background-color: #4bb1cf;
|
background-color: #4bb1cf;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor .editor-frame #editor .alert,
|
.try .editor .editor-frame #editor .alert,
|
||||||
.try .editor .editor-frame #diff-editor .alert {
|
.try .editor .editor-frame #diff-editor .alert {
|
||||||
margin: 18% auto 0;
|
margin: 18% auto 0;
|
||||||
width: 30%;
|
width: 30%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
color: #b94a48;
|
color: #b94a48;
|
||||||
background-color: #f2dede;
|
background-color: #f2dede;
|
||||||
border-color: #eed3d7;
|
border-color: #eed3d7;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor #editor .monaco-editor .row,
|
.try .editor #editor .monaco-editor .row,
|
||||||
.try .editor #diff-editor .monaco-editor .row {
|
.try .editor #diff-editor .monaco-editor .row {
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor .vs.monaco-editor .context-view.monaco-menu-container a {
|
.try .editor .vs.monaco-editor .context-view.monaco-menu-container a {
|
||||||
color: #646465;
|
color: #646465;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor .vs-dark.monaco-editor .context-view.monaco-menu-container a {
|
.try .editor .vs-dark.monaco-editor .context-view.monaco-menu-container a {
|
||||||
color: #BBB;
|
color: #bbb;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width: 1200px) {
|
@media (min-width: 1200px) {
|
||||||
.try .editor .row {
|
.try .editor .row {
|
||||||
margin-left: 0px;
|
margin-left: 0px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 767px) {
|
@media (max-width: 767px) {
|
||||||
.try .container {
|
.try .container {
|
||||||
margin: 0 24px;
|
margin: 0 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .tile h4 {
|
.try .tile h4 {
|
||||||
right: 6px;
|
right: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor > .span9 .row .span4 {
|
.try .editor > .span9 .row .span4 {
|
||||||
float: left;
|
float: left;
|
||||||
width: 50%;
|
width: 50%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.try .editor h4 {
|
.try .editor h4 {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 520px) {
|
@media (max-width: 520px) {
|
||||||
.try .editor > .span3 p,
|
.try .editor > .span3 p,
|
||||||
.try .editor > .span3 h4 {
|
.try .editor > .span3 h4 {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 320px) {
|
@media (max-width: 320px) {
|
||||||
.try .editor > .span9 {
|
.try .editor > .span9 {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ------- BEGIN bootstrap fixes for the editor ------- */
|
/* ------- BEGIN bootstrap fixes for the editor ------- */
|
||||||
|
|
||||||
.monaco-editor .container:before, .monaco-editor .row:before {
|
.monaco-editor .container:before,
|
||||||
content: "";
|
.monaco-editor .row:before {
|
||||||
display: inherit;
|
content: '';
|
||||||
}
|
display: inherit;
|
||||||
|
}
|
||||||
.monaco-editor .container:after, .monaco-editor .row:after {
|
|
||||||
clear: inherit;
|
.monaco-editor .container:after,
|
||||||
}
|
.monaco-editor .row:after {
|
||||||
|
clear: inherit;
|
||||||
.monaco-editor .container {
|
}
|
||||||
width: auto;
|
|
||||||
margin: inherit;
|
.monaco-editor .container {
|
||||||
padding: inherit;
|
width: auto;
|
||||||
}
|
margin: inherit;
|
||||||
|
padding: inherit;
|
||||||
.monaco-editor .close {
|
}
|
||||||
float: none;
|
|
||||||
font-size: inherit;
|
.monaco-editor .close {
|
||||||
font-weight: inherit;
|
float: none;
|
||||||
line-height: inherit;
|
font-size: inherit;
|
||||||
color: inherit;
|
font-weight: inherit;
|
||||||
text-shadow: inherit;
|
line-height: inherit;
|
||||||
opacity: inherit;
|
color: inherit;
|
||||||
filter: inherit;
|
text-shadow: inherit;
|
||||||
}
|
opacity: inherit;
|
||||||
|
filter: inherit;
|
||||||
.monaco-editor .row {
|
}
|
||||||
margin: inherit;
|
|
||||||
}
|
.monaco-editor .row {
|
||||||
|
margin: inherit;
|
||||||
.monaco-editor .invisible {
|
}
|
||||||
visibility: visible;
|
|
||||||
}
|
.monaco-editor .invisible {
|
||||||
|
visibility: visible;
|
||||||
/* ------- END bootstrap fixes for the editor ------- */
|
}
|
||||||
|
|
||||||
|
/* ------- END bootstrap fixes for the editor ------- */
|
||||||
|
|||||||
@ -1,168 +1,174 @@
|
|||||||
/// <reference path="../../release/monaco.d.ts" />
|
/// <reference path="../../release/monaco.d.ts" />
|
||||||
|
|
||||||
"use strict";
|
'use strict';
|
||||||
|
|
||||||
var editor = null, diffEditor = null;
|
var editor = null,
|
||||||
|
diffEditor = null;
|
||||||
$(document).ready(function() {
|
|
||||||
require(['vs/editor/editor.main'], function () {
|
$(document).ready(function () {
|
||||||
var MODES = (function() {
|
require(['vs/editor/editor.main'], function () {
|
||||||
var modesIds = monaco.languages.getLanguages().map(function(lang) { return lang.id; });
|
var MODES = (function () {
|
||||||
modesIds.sort();
|
var modesIds = monaco.languages.getLanguages().map(function (lang) {
|
||||||
|
return lang.id;
|
||||||
return modesIds.map(function(modeId) {
|
});
|
||||||
return {
|
modesIds.sort();
|
||||||
modeId: modeId,
|
|
||||||
sampleURL: 'index/samples/sample.' + modeId + '.txt'
|
return modesIds.map(function (modeId) {
|
||||||
};
|
return {
|
||||||
});
|
modeId: modeId,
|
||||||
})();
|
sampleURL: 'index/samples/sample.' + modeId + '.txt'
|
||||||
|
};
|
||||||
var startModeIndex = 0;
|
});
|
||||||
for (var i = 0; i < MODES.length; i++) {
|
})();
|
||||||
var o = document.createElement('option');
|
|
||||||
o.textContent = MODES[i].modeId;
|
var startModeIndex = 0;
|
||||||
if (MODES[i].modeId === 'typescript') {
|
for (var i = 0; i < MODES.length; i++) {
|
||||||
startModeIndex = i;
|
var o = document.createElement('option');
|
||||||
}
|
o.textContent = MODES[i].modeId;
|
||||||
$(".language-picker").append(o);
|
if (MODES[i].modeId === 'typescript') {
|
||||||
}
|
startModeIndex = i;
|
||||||
$(".language-picker")[0].selectedIndex = startModeIndex;
|
}
|
||||||
loadSample(MODES[startModeIndex]);
|
$('.language-picker').append(o);
|
||||||
$(".language-picker").change(function() {
|
}
|
||||||
loadSample(MODES[this.selectedIndex]);
|
$('.language-picker')[0].selectedIndex = startModeIndex;
|
||||||
});
|
loadSample(MODES[startModeIndex]);
|
||||||
|
$('.language-picker').change(function () {
|
||||||
$(".theme-picker").change(function() {
|
loadSample(MODES[this.selectedIndex]);
|
||||||
changeTheme(this.selectedIndex);
|
});
|
||||||
});
|
|
||||||
|
$('.theme-picker').change(function () {
|
||||||
loadDiffSample();
|
changeTheme(this.selectedIndex);
|
||||||
|
});
|
||||||
$('#inline-diff-checkbox').change(function () {
|
|
||||||
diffEditor.updateOptions({
|
loadDiffSample();
|
||||||
renderSideBySide: !$(this).is(':checked')
|
|
||||||
});
|
$('#inline-diff-checkbox').change(function () {
|
||||||
});
|
diffEditor.updateOptions({
|
||||||
});
|
renderSideBySide: !$(this).is(':checked')
|
||||||
|
});
|
||||||
window.onresize = function () {
|
});
|
||||||
if (editor) {
|
});
|
||||||
editor.layout();
|
|
||||||
}
|
window.onresize = function () {
|
||||||
if (diffEditor) {
|
if (editor) {
|
||||||
diffEditor.layout();
|
editor.layout();
|
||||||
}
|
}
|
||||||
};
|
if (diffEditor) {
|
||||||
});
|
diffEditor.layout();
|
||||||
|
}
|
||||||
var preloaded = {};
|
};
|
||||||
(function() {
|
});
|
||||||
var elements = Array.prototype.slice.call(document.querySelectorAll('pre[data-preload]'), 0);
|
|
||||||
|
var preloaded = {};
|
||||||
elements.forEach(function(el) {
|
(function () {
|
||||||
var path = el.getAttribute('data-preload');
|
var elements = Array.prototype.slice.call(document.querySelectorAll('pre[data-preload]'), 0);
|
||||||
preloaded[path] = el.innerText || el.textContent;
|
|
||||||
el.parentNode.removeChild(el);
|
elements.forEach(function (el) {
|
||||||
});
|
var path = el.getAttribute('data-preload');
|
||||||
})();
|
preloaded[path] = el.innerText || el.textContent;
|
||||||
|
el.parentNode.removeChild(el);
|
||||||
function xhr(url, cb) {
|
});
|
||||||
if (preloaded[url]) {
|
})();
|
||||||
return cb(null, preloaded[url]);
|
|
||||||
}
|
function xhr(url, cb) {
|
||||||
$.ajax({
|
if (preloaded[url]) {
|
||||||
type: 'GET',
|
return cb(null, preloaded[url]);
|
||||||
url: url,
|
}
|
||||||
dataType: 'text',
|
$.ajax({
|
||||||
error: function () {
|
type: 'GET',
|
||||||
cb(this, null);
|
url: url,
|
||||||
}
|
dataType: 'text',
|
||||||
}).done(function(data) {
|
error: function () {
|
||||||
cb(null, data);
|
cb(this, null);
|
||||||
});
|
}
|
||||||
}
|
}).done(function (data) {
|
||||||
|
cb(null, data);
|
||||||
function loadSample(mode) {
|
});
|
||||||
$('.loading.editor').show();
|
}
|
||||||
xhr(mode.sampleURL, function(err, data) {
|
|
||||||
if (err) {
|
function loadSample(mode) {
|
||||||
if (editor) {
|
$('.loading.editor').show();
|
||||||
if (editor.getModel()) {
|
xhr(mode.sampleURL, function (err, data) {
|
||||||
editor.getModel().dispose();
|
if (err) {
|
||||||
}
|
if (editor) {
|
||||||
editor.dispose();
|
if (editor.getModel()) {
|
||||||
editor = null;
|
editor.getModel().dispose();
|
||||||
}
|
}
|
||||||
$('.loading.editor').fadeOut({ duration: 200 });
|
editor.dispose();
|
||||||
$('#editor').empty();
|
editor = null;
|
||||||
$('#editor').append('<p class="alert alert-error">Failed to load ' + mode.modeId + ' sample</p>');
|
}
|
||||||
return;
|
$('.loading.editor').fadeOut({ duration: 200 });
|
||||||
}
|
$('#editor').empty();
|
||||||
|
$('#editor').append(
|
||||||
if (!editor) {
|
'<p class="alert alert-error">Failed to load ' + mode.modeId + ' sample</p>'
|
||||||
$('#editor').empty();
|
);
|
||||||
editor = monaco.editor.create(document.getElementById('editor'), {
|
return;
|
||||||
model: null,
|
}
|
||||||
});
|
|
||||||
}
|
if (!editor) {
|
||||||
|
$('#editor').empty();
|
||||||
var oldModel = editor.getModel();
|
editor = monaco.editor.create(document.getElementById('editor'), {
|
||||||
var newModel = monaco.editor.createModel(data, mode.modeId);
|
model: null
|
||||||
editor.setModel(newModel);
|
});
|
||||||
if (oldModel) {
|
}
|
||||||
oldModel.dispose();
|
|
||||||
}
|
var oldModel = editor.getModel();
|
||||||
$('.loading.editor').fadeOut({ duration: 300 });
|
var newModel = monaco.editor.createModel(data, mode.modeId);
|
||||||
})
|
editor.setModel(newModel);
|
||||||
}
|
if (oldModel) {
|
||||||
|
oldModel.dispose();
|
||||||
function loadDiffSample() {
|
}
|
||||||
|
$('.loading.editor').fadeOut({ duration: 300 });
|
||||||
var onError = function() {
|
});
|
||||||
$('.loading.diff-editor').fadeOut({ duration: 200 });
|
}
|
||||||
$('#diff-editor').append('<p class="alert alert-error">Failed to load diff editor sample</p>');
|
|
||||||
};
|
function loadDiffSample() {
|
||||||
|
var onError = function () {
|
||||||
$('.loading.diff-editor').show();
|
$('.loading.diff-editor').fadeOut({ duration: 200 });
|
||||||
|
$('#diff-editor').append('<p class="alert alert-error">Failed to load diff editor sample</p>');
|
||||||
var lhsData = null, rhsData = null, jsMode = null;
|
};
|
||||||
|
|
||||||
xhr('index/samples/diff.lhs.txt', function(err, data) {
|
$('.loading.diff-editor').show();
|
||||||
if (err) {
|
|
||||||
return onError();
|
var lhsData = null,
|
||||||
}
|
rhsData = null,
|
||||||
lhsData = data;
|
jsMode = null;
|
||||||
onProgress();
|
|
||||||
})
|
xhr('index/samples/diff.lhs.txt', function (err, data) {
|
||||||
xhr('index/samples/diff.rhs.txt', function(err, data) {
|
if (err) {
|
||||||
if (err) {
|
return onError();
|
||||||
return onError();
|
}
|
||||||
}
|
lhsData = data;
|
||||||
rhsData = data;
|
onProgress();
|
||||||
onProgress();
|
});
|
||||||
})
|
xhr('index/samples/diff.rhs.txt', function (err, data) {
|
||||||
|
if (err) {
|
||||||
function onProgress() {
|
return onError();
|
||||||
if (lhsData && rhsData) {
|
}
|
||||||
diffEditor = monaco.editor.createDiffEditor(document.getElementById('diff-editor'), {
|
rhsData = data;
|
||||||
enableSplitViewResizing: false
|
onProgress();
|
||||||
});
|
});
|
||||||
|
|
||||||
var lhsModel = monaco.editor.createModel(lhsData, 'text/javascript');
|
function onProgress() {
|
||||||
var rhsModel = monaco.editor.createModel(rhsData, 'text/javascript');
|
if (lhsData && rhsData) {
|
||||||
|
diffEditor = monaco.editor.createDiffEditor(document.getElementById('diff-editor'), {
|
||||||
diffEditor.setModel({
|
enableSplitViewResizing: false
|
||||||
original: lhsModel,
|
});
|
||||||
modified: rhsModel
|
|
||||||
});
|
var lhsModel = monaco.editor.createModel(lhsData, 'text/javascript');
|
||||||
|
var rhsModel = monaco.editor.createModel(rhsData, 'text/javascript');
|
||||||
$('.loading.diff-editor').fadeOut({ duration: 300 });
|
|
||||||
}
|
diffEditor.setModel({
|
||||||
}
|
original: lhsModel,
|
||||||
}
|
modified: rhsModel
|
||||||
|
});
|
||||||
function changeTheme(theme) {
|
|
||||||
var newTheme = (theme === 1 ? 'vs-dark' : ( theme === 0 ? 'vs' : 'hc-black' ));
|
$('.loading.diff-editor').fadeOut({ duration: 300 });
|
||||||
monaco.editor.setTheme(newTheme);
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function changeTheme(theme) {
|
||||||
|
var newTheme = theme === 1 ? 'vs-dark' : theme === 0 ? 'vs' : 'hc-black';
|
||||||
|
monaco.editor.setTheme(newTheme);
|
||||||
|
}
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
@ -1,219 +1,296 @@
|
|||||||
|
/* common extra token classes */
|
||||||
|
.monaco-editor .token.invalid {
|
||||||
/* common extra token classes */
|
border-bottom: red dotted 1px;
|
||||||
.monaco-editor .token.invalid { border-bottom: red dotted 1px }
|
}
|
||||||
.monaco-editor .token.identifier { }
|
.monaco-editor .token.comment.doc {
|
||||||
.monaco-editor .token.comment.doc { font-style: normal; }
|
font-style: normal;
|
||||||
|
}
|
||||||
.monaco-editor .token.type { color: teal; }
|
|
||||||
.monaco-editor .token.type.delimiter { color: teal; }
|
.monaco-editor .token.type {
|
||||||
.monaco-editor .token.predefined { color: navy; }
|
color: teal;
|
||||||
.monaco-editor .token.namespace { color: navy; }
|
}
|
||||||
.monaco-editor .token.constructor { color: purple; }
|
.monaco-editor .token.type.delimiter {
|
||||||
|
color: teal;
|
||||||
/* theme all the new token classes */
|
}
|
||||||
|
.monaco-editor .token.predefined {
|
||||||
.monaco-editor.vs-dark .token.type { color: darkcyan;}
|
color: navy;
|
||||||
.monaco-editor.vs-dark .token.predefined { color: darkorchid;}
|
}
|
||||||
.monaco-editor.vs-dark .token.namespace { color: lightsteelblue; }
|
.monaco-editor .token.namespace {
|
||||||
.monaco-editor.vs-dark .token.constructor { color: palegoldenrod; }
|
color: navy;
|
||||||
|
}
|
||||||
.monaco-editor.high-contrast-black .token.type { color: darkcyan;}
|
.monaco-editor .token.constructor {
|
||||||
.monaco-editor.high-contrast-black .token.predefined { color: aquamarine;}
|
color: purple;
|
||||||
.monaco-editor.high-contrast-black .token.namespace { color: lightsteelblue; }
|
}
|
||||||
.monaco-editor.high-contrast-black .token.constructor { color: palegoldenrod; }
|
|
||||||
|
/* theme all the new token classes */
|
||||||
/* specials for functional languages */
|
|
||||||
.token.keyword.dot { color: black; }
|
.monaco-editor.vs-dark .token.type {
|
||||||
.token.typeparam { color: #555; }
|
color: darkcyan;
|
||||||
.token.typevar { font-style: italic; }
|
}
|
||||||
|
.monaco-editor.vs-dark .token.predefined {
|
||||||
|
color: darkorchid;
|
||||||
|
}
|
||||||
|
.monaco-editor.vs-dark .token.namespace {
|
||||||
|
color: lightsteelblue;
|
||||||
|
}
|
||||||
|
.monaco-editor.vs-dark .token.constructor {
|
||||||
|
color: palegoldenrod;
|
||||||
.monaco-editor .current-line,
|
}
|
||||||
.monaco-editor.vs .current-line,
|
|
||||||
.monaco-editor.monaco .current-line { border: none; }
|
.monaco-editor.high-contrast-black .token.type {
|
||||||
.monaco-editor.vs .key.js { color: navy;}
|
color: darkcyan;
|
||||||
|
}
|
||||||
.monaco-editor.vs .token.string.escape,
|
.monaco-editor.high-contrast-black .token.predefined {
|
||||||
.token.regexp.escape { color: dimgray; }
|
color: aquamarine;
|
||||||
.token.regexp.escape.control { color: black; }
|
}
|
||||||
|
.monaco-editor.high-contrast-black .token.namespace {
|
||||||
.token.emphasis { font-style: italic;}
|
color: lightsteelblue;
|
||||||
.token.strong { font-weight: bold; }
|
}
|
||||||
.token.header { color: navy ;}
|
.monaco-editor.high-contrast-black .token.constructor {
|
||||||
|
color: palegoldenrod;
|
||||||
/* -------------------------------------------
|
}
|
||||||
Workbench UI style
|
|
||||||
--------------------------------------------*/
|
/* specials for functional languages */
|
||||||
#editor, #langPane {
|
.token.keyword.dot {
|
||||||
height: 60ex;
|
color: black;
|
||||||
border: 1px solid #ccc
|
}
|
||||||
}
|
.token.typeparam {
|
||||||
|
color: #555;
|
||||||
#langPane {
|
}
|
||||||
height: 72ex;
|
.token.typevar {
|
||||||
}
|
font-style: italic;
|
||||||
|
}
|
||||||
#main {
|
|
||||||
font-family: "Segoe UI Light", "Segoe UI", Arial, "HelveticaNeue-Light", sans-serif;
|
.monaco-editor .current-line,
|
||||||
font-size: 12pt;
|
.monaco-editor.vs .current-line,
|
||||||
width: 94%;
|
.monaco-editor.monaco .current-line {
|
||||||
padding: 0pt;
|
border: none;
|
||||||
margin: 1% 3% 5ex 3%;
|
}
|
||||||
}
|
.monaco-editor.vs .key.js {
|
||||||
|
color: navy;
|
||||||
#leftPane {
|
}
|
||||||
float: left;
|
|
||||||
width: 58%;
|
.monaco-editor.vs .token.string.escape,
|
||||||
margin: 0pt;
|
.token.regexp.escape {
|
||||||
margin-bottom: 2ex;
|
color: dimgray;
|
||||||
}
|
}
|
||||||
|
.token.regexp.escape.control {
|
||||||
#rightPane {
|
color: black;
|
||||||
width: 40%;
|
}
|
||||||
float: right;
|
|
||||||
margin: 0pt;
|
.token.emphasis {
|
||||||
}
|
font-style: italic;
|
||||||
|
}
|
||||||
#header, #footer {
|
.token.strong {
|
||||||
clear: both;
|
font-weight: bold;
|
||||||
font-size: 18pt;
|
}
|
||||||
margin-bottom: 1ex;
|
.token.header {
|
||||||
}
|
color: navy;
|
||||||
|
}
|
||||||
#logo {
|
|
||||||
margin: 0pt 0pt 5pt -17px;
|
/* -------------------------------------------
|
||||||
padding: 0pt;
|
Workbench UI style
|
||||||
width: 17px;
|
--------------------------------------------*/
|
||||||
}
|
#editor,
|
||||||
|
#langPane {
|
||||||
#commandbar {
|
height: 60ex;
|
||||||
margin-top: 4px;
|
border: 1px solid #ccc;
|
||||||
height: 90%;
|
}
|
||||||
}
|
|
||||||
|
#langPane {
|
||||||
|
height: 72ex;
|
||||||
#monarchConsole {
|
}
|
||||||
color: black;
|
|
||||||
overflow: auto;
|
#main {
|
||||||
height: 100px;
|
font-family: 'Segoe UI Light', 'Segoe UI', Arial, 'HelveticaNeue-Light', sans-serif;
|
||||||
border: lightgray 1px solid;
|
font-size: 12pt;
|
||||||
padding-left: 1ex;
|
width: 94%;
|
||||||
margin-top: 10px;
|
padding: 0pt;
|
||||||
white-space: pre-wrap;
|
margin: 1% 3% 5ex 3%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sampleselect {
|
#leftPane {
|
||||||
width: 15ex;
|
float: left;
|
||||||
}
|
width: 58%;
|
||||||
#themeselect, #sampleselect {
|
margin: 0pt;
|
||||||
padding: 0;
|
margin-bottom: 2ex;
|
||||||
margin: 0;
|
}
|
||||||
height: auto;
|
|
||||||
}
|
#rightPane {
|
||||||
|
width: 40%;
|
||||||
.paneheader {
|
float: right;
|
||||||
margin-bottom: 0.5ex;
|
margin: 0pt;
|
||||||
font-size: 14pt;
|
}
|
||||||
}
|
|
||||||
|
#header,
|
||||||
.selectbox {
|
#footer {
|
||||||
float: right;
|
clear: both;
|
||||||
font-size: smaller;
|
font-size: 18pt;
|
||||||
}
|
margin-bottom: 1ex;
|
||||||
|
}
|
||||||
.button {
|
|
||||||
border: 1px solid lightgray;
|
#logo {
|
||||||
cursor: pointer;
|
margin: 0pt 0pt 5pt -17px;
|
||||||
padding: 0ex 0.5ex 0ex 0.5ex;
|
padding: 0pt;
|
||||||
}
|
width: 17px;
|
||||||
|
}
|
||||||
.button:hover {
|
|
||||||
background-color: lightgray;
|
#commandbar {
|
||||||
border-color: dimgray;
|
margin-top: 4px;
|
||||||
}
|
height: 90%;
|
||||||
|
}
|
||||||
.touchbutton:hover {
|
|
||||||
background-color: #F8F8F8;
|
#monarchConsole {
|
||||||
}
|
color: black;
|
||||||
|
overflow: auto;
|
||||||
.touchbutton {
|
height: 100px;
|
||||||
border: 1px solid;
|
border: lightgray 1px solid;
|
||||||
border-radius: 1000px; /* circle */
|
padding-left: 1ex;
|
||||||
height: 3ex;
|
margin-top: 10px;
|
||||||
width: 3ex; /* needed for safari */
|
white-space: pre-wrap;
|
||||||
cursor: pointer;
|
}
|
||||||
}
|
|
||||||
|
#sampleselect {
|
||||||
.touchbutton:hover {
|
width: 15ex;
|
||||||
background-color: #F8F8F8;
|
}
|
||||||
}
|
#themeselect,
|
||||||
|
#sampleselect {
|
||||||
.arrowdown {
|
padding: 0;
|
||||||
font-size: 10pt;
|
margin: 0;
|
||||||
}
|
height: auto;
|
||||||
|
}
|
||||||
/*-------------------------------------------------------------------
|
|
||||||
documentation style
|
.paneheader {
|
||||||
-------------------------------------------------------------------*/
|
margin-bottom: 0.5ex;
|
||||||
#documentation {
|
font-size: 14pt;
|
||||||
clear: both;
|
}
|
||||||
border: lightgray 1px solid;
|
|
||||||
padding: 1ex 4ex 1ex 3ex;
|
.selectbox {
|
||||||
font-family: "Segoe UI", Arial, "HelveticaNeue-Light", sans-serif;
|
float: right;
|
||||||
}
|
font-size: smaller;
|
||||||
|
}
|
||||||
#documentation a {
|
|
||||||
color: navy;
|
.button {
|
||||||
text-decoration: none;
|
border: 1px solid lightgray;
|
||||||
border-bottom: 1px dotted;
|
cursor: pointer;
|
||||||
}
|
padding: 0ex 0.5ex 0ex 0.5ex;
|
||||||
|
}
|
||||||
#documentation .monaco-editor.monaco .current-line,
|
|
||||||
#documentation .monaco-editor { background-color: #fafafa }
|
.button:hover {
|
||||||
#documentation .string.escape { color: dimgray;}
|
background-color: lightgray;
|
||||||
|
border-color: dimgray;
|
||||||
h1,h2,h3,h4
|
}
|
||||||
{ font-weight: normal;
|
|
||||||
margin-top: 0pt;
|
.touchbutton:hover {
|
||||||
margin-left: -1.5ex;
|
background-color: #f8f8f8;
|
||||||
margin-bottom: 0pt;
|
}
|
||||||
}
|
|
||||||
|
.touchbutton {
|
||||||
h2 { font-size: 16pt;}
|
border: 1px solid;
|
||||||
h3 { font-size: 120%;}
|
border-radius: 1000px; /* circle */
|
||||||
|
height: 3ex;
|
||||||
ul { padding-left: 1.5em
|
width: 3ex; /* needed for safari */
|
||||||
; margin-left: 0pt
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.options,
|
.touchbutton:hover {
|
||||||
pre { border: 1px solid #888
|
background-color: #f8f8f8;
|
||||||
; padding: 1ex
|
}
|
||||||
; background: #F8F8F8
|
|
||||||
; font-size: 10pt;
|
.arrowdown {
|
||||||
}
|
font-size: 10pt;
|
||||||
|
}
|
||||||
|
|
||||||
code, pre,dt { font-family: Consolas, monospace }
|
/*-------------------------------------------------------------------
|
||||||
|
documentation style
|
||||||
strong { color: black }
|
-------------------------------------------------------------------*/
|
||||||
|
#documentation {
|
||||||
td { vertical-align: top }
|
clear: both;
|
||||||
img { margin: 2ex }
|
border: lightgray 1px solid;
|
||||||
|
padding: 1ex 4ex 1ex 3ex;
|
||||||
|
font-family: 'Segoe UI', Arial, 'HelveticaNeue-Light', sans-serif;
|
||||||
dt { color: navy; margin-top: 2ex; padding: 2px;}
|
}
|
||||||
.dt { color: navy }
|
|
||||||
.adv { color: maroon; }
|
#documentation a {
|
||||||
|
color: navy;
|
||||||
dl dl dt { margin-top: 1ex;}
|
text-decoration: none;
|
||||||
|
border-bottom: 1px dotted;
|
||||||
#documentation .keyword { color: blue; }
|
}
|
||||||
#documentation .tag { color: navy; }
|
|
||||||
|
#documentation .monaco-editor.monaco .current-line,
|
||||||
|
#documentation .monaco-editor {
|
||||||
|
background-color: #fafafa;
|
||||||
|
}
|
||||||
|
#documentation .string.escape {
|
||||||
|
color: dimgray;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4 {
|
||||||
|
font-weight: normal;
|
||||||
|
margin-top: 0pt;
|
||||||
|
margin-left: -1.5ex;
|
||||||
|
margin-bottom: 0pt;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 16pt;
|
||||||
|
}
|
||||||
|
h3 {
|
||||||
|
font-size: 120%;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
padding-left: 1.5em;
|
||||||
|
margin-left: 0pt;
|
||||||
|
}
|
||||||
|
|
||||||
|
.options,
|
||||||
|
pre {
|
||||||
|
border: 1px solid #888;
|
||||||
|
padding: 1ex;
|
||||||
|
background: #f8f8f8;
|
||||||
|
font-size: 10pt;
|
||||||
|
}
|
||||||
|
|
||||||
|
code,
|
||||||
|
pre,
|
||||||
|
dt {
|
||||||
|
font-family: Consolas, monospace;
|
||||||
|
}
|
||||||
|
|
||||||
|
strong {
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
td {
|
||||||
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
img {
|
||||||
|
margin: 2ex;
|
||||||
|
}
|
||||||
|
|
||||||
|
dt {
|
||||||
|
color: navy;
|
||||||
|
margin-top: 2ex;
|
||||||
|
padding: 2px;
|
||||||
|
}
|
||||||
|
.dt {
|
||||||
|
color: navy;
|
||||||
|
}
|
||||||
|
.adv {
|
||||||
|
color: maroon;
|
||||||
|
}
|
||||||
|
|
||||||
|
dl dl dt {
|
||||||
|
margin-top: 1ex;
|
||||||
|
}
|
||||||
|
|
||||||
|
#documentation .keyword {
|
||||||
|
color: blue;
|
||||||
|
}
|
||||||
|
#documentation .tag {
|
||||||
|
color: navy;
|
||||||
|
}
|
||||||
|
|||||||
@ -1,174 +1,172 @@
|
|||||||
/// <reference path="../../release/monaco.d.ts" />
|
/// <reference path="../../release/monaco.d.ts" />
|
||||||
|
|
||||||
"use strict";
|
'use strict';
|
||||||
|
|
||||||
/*-----------------------------------------
|
/*-----------------------------------------
|
||||||
General helpers
|
General helpers
|
||||||
------------------------------------------*/
|
------------------------------------------*/
|
||||||
function clearInnerText(elem) {
|
function clearInnerText(elem) {
|
||||||
elem.innerHTML = "";
|
elem.innerHTML = '';
|
||||||
}
|
}
|
||||||
|
|
||||||
function getInnerText(elem) {
|
function getInnerText(elem) {
|
||||||
var text = elem.innerText;
|
var text = elem.innerText;
|
||||||
if (!text) text = elem.textContent;
|
if (!text) text = elem.textContent;
|
||||||
return text;
|
return text;
|
||||||
}
|
}
|
||||||
|
|
||||||
function escapeToHTML(text) {
|
function escapeToHTML(text) {
|
||||||
return text.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');
|
return text.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');
|
||||||
}
|
}
|
||||||
|
|
||||||
function appendInnerText(elem, txt) {
|
function appendInnerText(elem, txt) {
|
||||||
txt = escapeToHTML(txt);
|
txt = escapeToHTML(txt);
|
||||||
elem.innerHTML += txt;
|
elem.innerHTML += txt;
|
||||||
}
|
}
|
||||||
|
|
||||||
function setInnerText(elem, txt) {
|
function setInnerText(elem, txt) {
|
||||||
clearInnerText(elem);
|
clearInnerText(elem);
|
||||||
appendInnerText(elem, txt);
|
appendInnerText(elem, txt);
|
||||||
}
|
}
|
||||||
|
|
||||||
function getTextFromId(id) {
|
function getTextFromId(id) {
|
||||||
var elem = document.getElementById(id);
|
var elem = document.getElementById(id);
|
||||||
if (elem == null) return null;
|
if (elem == null) return null;
|
||||||
return getInnerText(elem);
|
return getInnerText(elem);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* -----------------------------------------
|
||||||
/* -----------------------------------------
|
The main loader for the workbench UI
|
||||||
The main loader for the workbench UI
|
------------------------------------------*/
|
||||||
------------------------------------------*/
|
|
||||||
|
var outputPane = document.getElementById('monarchConsole');
|
||||||
var outputPane = document.getElementById("monarchConsole");
|
|
||||||
|
var isDirty = false;
|
||||||
var isDirty = false;
|
window.onbeforeunload = function (ev) {
|
||||||
window.onbeforeunload = function (ev) {
|
if (isDirty) {
|
||||||
if (isDirty) {
|
return 'If you leave this page any unsaved work will be lost.';
|
||||||
return "If you leave this page any unsaved work will be lost.";
|
}
|
||||||
}
|
};
|
||||||
};
|
|
||||||
|
function createLangModel(languageId, text) {
|
||||||
function createLangModel(languageId, text) {
|
monaco.languages.register({ id: languageId });
|
||||||
monaco.languages.register({ id: languageId });
|
|
||||||
|
var langModel = monaco.editor.createModel(text, 'javascript');
|
||||||
var langModel = monaco.editor.createModel(text, 'javascript');
|
var update = function () {
|
||||||
var update = function() {
|
var def = null;
|
||||||
var def = null;
|
try {
|
||||||
try {
|
def = eval('(function(){ ' + langModel.getValue() + '; })()');
|
||||||
def = eval("(function(){ " + langModel.getValue() + "; })()");
|
} catch (err) {
|
||||||
} catch (err) {
|
setInnerText(outputPane, err + '\n');
|
||||||
setInnerText(outputPane, err + '\n');
|
return;
|
||||||
return;
|
}
|
||||||
}
|
monaco.languages.setMonarchTokensProvider(languageId, def);
|
||||||
monaco.languages.setMonarchTokensProvider(languageId, def);
|
setInnerText(outputPane, 'up-to-date\n');
|
||||||
setInnerText(outputPane, 'up-to-date\n');
|
};
|
||||||
};
|
langModel.onDidChangeContent(function () {
|
||||||
langModel.onDidChangeContent(function() {
|
isDirty = true;
|
||||||
isDirty = true;
|
update();
|
||||||
update();
|
});
|
||||||
});
|
update();
|
||||||
update();
|
|
||||||
|
return langModel;
|
||||||
return langModel;
|
}
|
||||||
}
|
|
||||||
|
function readSamples(sampleSelect) {
|
||||||
function readSamples(sampleSelect) {
|
var samples = {};
|
||||||
var samples = {};
|
|
||||||
|
for (var i = 0; i < sampleSelect.options.length; i++) {
|
||||||
for (var i = 0; i < sampleSelect.options.length; i++) {
|
var id = sampleSelect.options[i].value;
|
||||||
var id = sampleSelect.options[i].value;
|
if (!id || sampleSelect.options[i].disabled) {
|
||||||
if (!id || sampleSelect.options[i].disabled) {
|
continue;
|
||||||
continue;
|
}
|
||||||
}
|
|
||||||
|
var languageId = 'monarch-language-' + id;
|
||||||
var languageId = 'monarch-language-' + id;
|
|
||||||
|
var sampleText = getTextFromId(id + '-sample');
|
||||||
var sampleText = getTextFromId(id + "-sample");
|
|
||||||
|
samples[id] = {
|
||||||
samples[id] = {
|
languageId: languageId,
|
||||||
languageId: languageId,
|
langModel: createLangModel(languageId, getTextFromId(id)),
|
||||||
langModel: createLangModel(languageId, getTextFromId(id)),
|
langViewState: null,
|
||||||
langViewState: null,
|
sampleModel: monaco.editor.createModel(sampleText, languageId),
|
||||||
sampleModel: monaco.editor.createModel(sampleText, languageId),
|
sampleViewState: null
|
||||||
sampleViewState: null,
|
};
|
||||||
};
|
}
|
||||||
}
|
|
||||||
|
return samples;
|
||||||
return samples;
|
}
|
||||||
}
|
|
||||||
|
require(['vs/editor/editor.main'], function () {
|
||||||
require(["vs/editor/editor.main"], function () {
|
var sampleSelect = document.getElementById('sampleselect');
|
||||||
var sampleSelect = document.getElementById("sampleselect");
|
var langPane = document.getElementById('langPane');
|
||||||
var langPane = document.getElementById("langPane");
|
var editorPane = document.getElementById('editor');
|
||||||
var editorPane = document.getElementById("editor");
|
|
||||||
|
// Adjust height of editors
|
||||||
// Adjust height of editors
|
var screenHeight = window.innerHeight;
|
||||||
var screenHeight = window.innerHeight;
|
if (screenHeight) {
|
||||||
if (screenHeight) {
|
var paneHeight = 0.76 * screenHeight;
|
||||||
var paneHeight = 0.76 * screenHeight;
|
langPane.style.height = paneHeight + 'px';
|
||||||
langPane.style.height = paneHeight + "px";
|
editorPane.style.height = paneHeight - 112 + 'px'; // 100px + margin 10px + borders 2px
|
||||||
editorPane.style.height = (paneHeight - 112) + "px"; // 100px + margin 10px + borders 2px
|
}
|
||||||
}
|
|
||||||
|
var SAMPLES = readSamples(sampleSelect);
|
||||||
var SAMPLES = readSamples(sampleSelect);
|
var CURRENT_SAMPLE = null;
|
||||||
var CURRENT_SAMPLE = null;
|
|
||||||
|
var langEditor = monaco.editor.create(langPane, {
|
||||||
var langEditor = monaco.editor.create(langPane, {
|
model: null,
|
||||||
model: null,
|
scrollBeyondLastLine: false
|
||||||
scrollBeyondLastLine: false
|
});
|
||||||
});
|
|
||||||
|
var sampleEditor = monaco.editor.create(editorPane, {
|
||||||
var sampleEditor = monaco.editor.create(editorPane, {
|
model: null,
|
||||||
model: null,
|
scrollBeyondLastLine: false
|
||||||
scrollBeyondLastLine: false
|
});
|
||||||
});
|
|
||||||
|
var select = document.getElementById('themeselect');
|
||||||
var select = document.getElementById("themeselect");
|
var currentTheme = 'vs';
|
||||||
var currentTheme = "vs";
|
select.onchange = function () {
|
||||||
select.onchange = function () {
|
currentTheme = select.options[select.selectedIndex].value;
|
||||||
currentTheme = select.options[select.selectedIndex].value;
|
monaco.editor.setTheme(currentTheme);
|
||||||
monaco.editor.setTheme(currentTheme);
|
};
|
||||||
};
|
|
||||||
|
// on resize
|
||||||
// on resize
|
function refreshLayout() {
|
||||||
function refreshLayout() {
|
langEditor.layout();
|
||||||
langEditor.layout();
|
sampleEditor.layout();
|
||||||
sampleEditor.layout();
|
}
|
||||||
};
|
window.onresize = refreshLayout;
|
||||||
window.onresize = refreshLayout;
|
|
||||||
|
// Switch to another sample
|
||||||
// Switch to another sample
|
function setEditorState(name) {
|
||||||
function setEditorState(name) {
|
if (!name || CURRENT_SAMPLE === name || !SAMPLES[name]) {
|
||||||
if (!name || CURRENT_SAMPLE === name || !SAMPLES[name]) {
|
return;
|
||||||
return;
|
}
|
||||||
}
|
|
||||||
|
// Save previous sample's view state
|
||||||
// Save previous sample's view state
|
if (CURRENT_SAMPLE) {
|
||||||
if (CURRENT_SAMPLE) {
|
SAMPLES[CURRENT_SAMPLE].langViewState = langEditor.saveViewState();
|
||||||
SAMPLES[CURRENT_SAMPLE].langViewState = langEditor.saveViewState();
|
SAMPLES[CURRENT_SAMPLE].sampleViewState = sampleEditor.saveViewState();
|
||||||
SAMPLES[CURRENT_SAMPLE].sampleViewState = sampleEditor.saveViewState();
|
}
|
||||||
}
|
|
||||||
|
CURRENT_SAMPLE = name;
|
||||||
CURRENT_SAMPLE = name;
|
|
||||||
|
// Apply new sample
|
||||||
// Apply new sample
|
langEditor.setModel(SAMPLES[CURRENT_SAMPLE].langModel);
|
||||||
langEditor.setModel(SAMPLES[CURRENT_SAMPLE].langModel);
|
if (SAMPLES[CURRENT_SAMPLE].langViewState) {
|
||||||
if (SAMPLES[CURRENT_SAMPLE].langViewState) {
|
langEditor.restoreViewState(SAMPLES[CURRENT_SAMPLE].langViewState);
|
||||||
langEditor.restoreViewState(SAMPLES[CURRENT_SAMPLE].langViewState);
|
}
|
||||||
}
|
sampleEditor.setModel(SAMPLES[CURRENT_SAMPLE].sampleModel);
|
||||||
sampleEditor.setModel(SAMPLES[CURRENT_SAMPLE].sampleModel);
|
if (SAMPLES[CURRENT_SAMPLE].sampleViewState) {
|
||||||
if (SAMPLES[CURRENT_SAMPLE].sampleViewState) {
|
sampleEditor.restoreViewState(SAMPLES[CURRENT_SAMPLE].sampleViewState);
|
||||||
sampleEditor.restoreViewState(SAMPLES[CURRENT_SAMPLE].sampleViewState);
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
// Refresh the sample text
|
||||||
// Refresh the sample text
|
function refreshSample() {
|
||||||
function refreshSample() {
|
var name = sampleSelect.options[sampleSelect.selectedIndex].value;
|
||||||
var name = sampleSelect.options[sampleSelect.selectedIndex].value;
|
setEditorState(name);
|
||||||
setEditorState(name);
|
}
|
||||||
}
|
sampleSelect.onchange = refreshSample;
|
||||||
sampleSelect.onchange = refreshSample;
|
refreshSample(); // initialize initial text
|
||||||
refreshSample(); // initialize initial text
|
}); // require
|
||||||
|
|
||||||
}); // require
|
|
||||||
|
|||||||
@ -1,83 +1,108 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
<head>
|
||||||
<head>
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
<meta name="viewport" content="width=device-width" />
|
||||||
<meta name="viewport" content="width=device-width">
|
|
||||||
|
<title>Monaco Editor Playground</title>
|
||||||
<title>Monaco Editor Playground</title>
|
|
||||||
|
<link data-inline="yes-please" href="./lib/bootstrap-cosmo.css" rel="stylesheet" />
|
||||||
<link data-inline="yes-please" href="./lib/bootstrap-cosmo.css" rel="stylesheet" />
|
<link data-inline="yes-please" href="./lib/bootstrap-responsive.min.css" rel="stylesheet" />
|
||||||
<link data-inline="yes-please" href="./lib/bootstrap-responsive.min.css" rel="stylesheet" />
|
<link data-inline="yes-please" href="./all.css" rel="stylesheet" type="text/css" />
|
||||||
<link data-inline="yes-please" href="./all.css" rel="stylesheet" type="text/css" />
|
<link data-inline="yes-please" href="./playground/spinner.css" rel="stylesheet" />
|
||||||
<link data-inline="yes-please" href="./playground/spinner.css" rel="stylesheet" />
|
<link data-inline="yes-please" href="./playground/playground.css" rel="stylesheet" />
|
||||||
<link data-inline="yes-please" href="./playground/playground.css" rel="stylesheet" />
|
|
||||||
|
<link
|
||||||
<link data-name="vs/editor/editor.main" rel="stylesheet" href="../release/dev/vs/editor/editor.main.css">
|
data-name="vs/editor/editor.main"
|
||||||
</head>
|
rel="stylesheet"
|
||||||
<body class="playground-page">
|
href="../release/dev/vs/editor/editor.main.css"
|
||||||
<pre data-preload="playground/new-samples/creating-the-editor/hello-world/sample.js"></pre>
|
/>
|
||||||
<pre data-preload="playground/new-samples/creating-the-editor/hello-world/sample.css"></pre>
|
</head>
|
||||||
<pre data-preload="playground/new-samples/creating-the-editor/hello-world/sample.html"></pre>
|
<body class="playground-page">
|
||||||
|
<pre data-preload="playground/new-samples/creating-the-editor/hello-world/sample.js"></pre>
|
||||||
<a id="gh-link" href="https://github.com/Microsoft/monaco-editor"><img
|
<pre data-preload="playground/new-samples/creating-the-editor/hello-world/sample.css"></pre>
|
||||||
width="149" height="149" alt="Fork me on GitHub" src="./fork.png"/></a>
|
<pre data-preload="playground/new-samples/creating-the-editor/hello-world/sample.html"></pre>
|
||||||
|
|
||||||
<nav class="navbar navbar-inverse navbar-fixed-top">
|
<a id="gh-link" href="https://github.com/Microsoft/monaco-editor"
|
||||||
<div class="navbar-inner">
|
><img width="149" height="149" alt="Fork me on GitHub" src="./fork.png"
|
||||||
<div class="container">
|
/></a>
|
||||||
<div class="logo">
|
|
||||||
<a href="index.html">Monaco Editor</a>
|
<nav class="navbar navbar-inverse navbar-fixed-top">
|
||||||
</div>
|
<div class="navbar-inner">
|
||||||
<!-- collapse button for smaller screens -->
|
<div class="container">
|
||||||
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
|
<div class="logo">
|
||||||
<span class="icon-bar"></span>
|
<a href="index.html">Monaco Editor</a>
|
||||||
<span class="icon-bar"></span>
|
</div>
|
||||||
<span class="icon-bar"></span>
|
<!-- collapse button for smaller screens -->
|
||||||
</button>
|
<button
|
||||||
|
type="button"
|
||||||
<!-- navbar title -->
|
class="btn btn-navbar"
|
||||||
<div class="nav-collapse collapse">
|
data-toggle="collapse"
|
||||||
<ul class="nav">
|
data-target=".nav-collapse"
|
||||||
<li><a class="nav-item" href="index.html">Home</a></li>
|
>
|
||||||
<li><a class="nav-item" href="api/index.html">API Doc</a></li>
|
<span class="icon-bar"></span>
|
||||||
<li><a class="nav-item" href="playground.html">Playground</a></li>
|
<span class="icon-bar"></span>
|
||||||
<li><a class="nav-item" href="monarch.html">Monarch</a></li>
|
<span class="icon-bar"></span>
|
||||||
<li><a class="nav-item" target="_blank" href="https://registry.npmjs.org/monaco-editor/-/monaco-editor-{{version}}.tgz">Download {{version}}</a></li>
|
</button>
|
||||||
</ul>
|
|
||||||
</div>
|
<!-- navbar title -->
|
||||||
</div>
|
<div class="nav-collapse collapse">
|
||||||
</div>
|
<ul class="nav">
|
||||||
</nav>
|
<li><a class="nav-item" href="index.html">Home</a></li>
|
||||||
<div id="loading">
|
<li><a class="nav-item" href="api/index.html">API Doc</a></li>
|
||||||
<div class="spinner">
|
<li><a class="nav-item" href="playground.html">Playground</a></li>
|
||||||
<div class="rect1"></div>
|
<li><a class="nav-item" href="monarch.html">Monarch</a></li>
|
||||||
<div class="rect2"></div>
|
<li>
|
||||||
<div class="rect3"></div>
|
<a
|
||||||
<div class="rect4"></div>
|
class="nav-item"
|
||||||
<div class="rect5"></div>
|
target="_blank"
|
||||||
</div>
|
href="https://registry.npmjs.org/monaco-editor/-/monaco-editor-{{version}}.tgz"
|
||||||
</div>
|
>Download {{version}}</a
|
||||||
|
>
|
||||||
<section id="playground">
|
</li>
|
||||||
</section>
|
</ul>
|
||||||
|
</div>
|
||||||
<footer class="container">
|
</div>
|
||||||
<hr>
|
</div>
|
||||||
<p class="text-center">
|
</nav>
|
||||||
<small>© {{year}} Microsoft</small>
|
<div id="loading">
|
||||||
</p>
|
<div class="spinner">
|
||||||
</footer>
|
<div class="rect1"></div>
|
||||||
|
<div class="rect2"></div>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js" integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ=" crossorigin="anonymous"></script>
|
<div class="rect3"></div>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.0/bootstrap.min.js" integrity="sha256-u+l2mGjpmGK/mFgUncmMcFKdMijvV+J3odlDJZSNUu8=" crossorigin="anonymous"></script>
|
<div class="rect4"></div>
|
||||||
|
<div class="rect5"></div>
|
||||||
<script>var require = { paths: { 'vs': '../release/dev/vs' } };</script>
|
</div>
|
||||||
<script src="../release/dev/vs/loader.js"></script>
|
</div>
|
||||||
<script src="../release/dev/vs/editor/editor.main.nls.js"></script>
|
|
||||||
<script src="../release/dev/vs/editor/editor.main.js"></script>
|
<section id="playground"></section>
|
||||||
|
|
||||||
<script data-inline="yes-please" src="./playground/new-samples/all.js"></script>
|
<footer class="container">
|
||||||
<script data-inline="yes-please" src="./playground/playground.js"></script>
|
<hr />
|
||||||
</body>
|
<p class="text-center">
|
||||||
</html>
|
<small>© {{year}} Microsoft</small>
|
||||||
|
</p>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
<script
|
||||||
|
src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"
|
||||||
|
integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ="
|
||||||
|
crossorigin="anonymous"
|
||||||
|
></script>
|
||||||
|
<script
|
||||||
|
src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.0/bootstrap.min.js"
|
||||||
|
integrity="sha256-u+l2mGjpmGK/mFgUncmMcFKdMijvV+J3odlDJZSNUu8="
|
||||||
|
crossorigin="anonymous"
|
||||||
|
></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
var require = { paths: { vs: '../release/dev/vs' } };
|
||||||
|
</script>
|
||||||
|
<script src="../release/dev/vs/loader.js"></script>
|
||||||
|
<script src="../release/dev/vs/editor/editor.main.nls.js"></script>
|
||||||
|
<script src="../release/dev/vs/editor/editor.main.js"></script>
|
||||||
|
|
||||||
|
<script data-inline="yes-please" src="./playground/new-samples/all.js"></script>
|
||||||
|
<script data-inline="yes-please" src="./playground/playground.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@ -1,186 +1,184 @@
|
|||||||
(function() {
|
(function () {
|
||||||
|
var PLAY_SAMPLES = [
|
||||||
|
{
|
||||||
|
chapter: 'Creating the editor',
|
||||||
|
name: 'Hello world!',
|
||||||
|
id: 'creating-the-editor-hello-world',
|
||||||
|
path: 'creating-the-editor/hello-world'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Creating the editor',
|
||||||
|
name: 'Editor basic options',
|
||||||
|
id: 'creating-the-editor-editor-basic-options',
|
||||||
|
path: 'creating-the-editor/editor-basic-options'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Creating the editor',
|
||||||
|
name: 'Hard wrapping',
|
||||||
|
id: 'creating-the-editor-hard-wrapping',
|
||||||
|
path: 'creating-the-editor/hard-wrapping'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Creating the editor',
|
||||||
|
name: 'Syntax highlighting for HTML elements',
|
||||||
|
id: 'creating-the-editor-syntax-highlighting-for-html-elements',
|
||||||
|
path: 'creating-the-editor/syntax-highlighting-for-html-elements'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Interacting with the editor',
|
||||||
|
name: 'Adding a command to an editor instance',
|
||||||
|
id: 'interacting-with-the-editor-adding-a-command-to-an-editor-instance',
|
||||||
|
path: 'interacting-with-the-editor/adding-a-command-to-an-editor-instance'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Interacting with the editor',
|
||||||
|
name: 'Adding an action to an editor instance',
|
||||||
|
id: 'interacting-with-the-editor-adding-an-action-to-an-editor-instance',
|
||||||
|
path: 'interacting-with-the-editor/adding-an-action-to-an-editor-instance'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Interacting with the editor',
|
||||||
|
name: 'Revealing a position',
|
||||||
|
id: 'interacting-with-the-editor-revealing-a-position',
|
||||||
|
path: 'interacting-with-the-editor/revealing-a-position'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Interacting with the editor',
|
||||||
|
name: 'Rendering glyphs in the margin',
|
||||||
|
id: 'interacting-with-the-editor-rendering-glyphs-in-the-margin',
|
||||||
|
path: 'interacting-with-the-editor/rendering-glyphs-in-the-margin'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Interacting with the editor',
|
||||||
|
name: 'Line and Inline decorations',
|
||||||
|
id: 'interacting-with-the-editor-line-and-inline-decorations',
|
||||||
|
path: 'interacting-with-the-editor/line-and-inline-decorations'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Interacting with the editor',
|
||||||
|
name: 'Customizing the line numbers',
|
||||||
|
id: 'interacting-with-the-editor-customizing-the-line-numbers',
|
||||||
|
path: 'interacting-with-the-editor/customizing-the-line-numbers'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Interacting with the editor',
|
||||||
|
name: 'Listening to mouse events',
|
||||||
|
id: 'interacting-with-the-editor-listening-to-mouse-events',
|
||||||
|
path: 'interacting-with-the-editor/listening-to-mouse-events'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Interacting with the editor',
|
||||||
|
name: 'Listening to key events',
|
||||||
|
id: 'interacting-with-the-editor-listening-to-key-events',
|
||||||
|
path: 'interacting-with-the-editor/listening-to-key-events'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Customizing the appearence',
|
||||||
|
name: 'Exposed colors',
|
||||||
|
id: 'customizing-the-appearence-exposed-colors',
|
||||||
|
path: 'customizing-the-appearence/exposed-colors'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Customizing the appearence',
|
||||||
|
name: 'Scrollbars',
|
||||||
|
id: 'customizing-the-appearence-scrollbars',
|
||||||
|
path: 'customizing-the-appearence/scrollbars'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Customizing the appearence',
|
||||||
|
name: 'Tokens and colors',
|
||||||
|
id: 'customizing-the-appearence-tokens-and-colors',
|
||||||
|
path: 'customizing-the-appearence/tokens-and-colors'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Creating the DiffEditor',
|
||||||
|
name: 'Hello diff world!',
|
||||||
|
id: 'creating-the-diffeditor-hello-diff-world',
|
||||||
|
path: 'creating-the-diffeditor/hello-diff-world'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Creating the DiffEditor',
|
||||||
|
name: 'Multi-line example',
|
||||||
|
id: 'creating-the-diffeditor-multi-line-example',
|
||||||
|
path: 'creating-the-diffeditor/multi-line-example'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Creating the DiffEditor',
|
||||||
|
name: 'Inline Diff Example',
|
||||||
|
id: 'creating-the-diffeditor-inline-diff-example',
|
||||||
|
path: 'creating-the-diffeditor/inline-diff-example'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Creating the DiffEditor',
|
||||||
|
name: 'Navigating a Diff',
|
||||||
|
id: 'creating-the-diffeditor-navigating-a-diff',
|
||||||
|
path: 'creating-the-diffeditor/navigating-a-diff'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Extending Language Services',
|
||||||
|
name: 'Custom languages',
|
||||||
|
id: 'extending-language-services-custom-languages',
|
||||||
|
path: 'extending-language-services/custom-languages'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Extending Language Services',
|
||||||
|
name: 'Completion provider example',
|
||||||
|
id: 'extending-language-services-completion-provider-example',
|
||||||
|
path: 'extending-language-services/completion-provider-example'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Extending Language Services',
|
||||||
|
name: 'Codelens provider example',
|
||||||
|
id: 'extending-language-services-codelens-provider-example',
|
||||||
|
path: 'extending-language-services/codelens-provider-example'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Extending Language Services',
|
||||||
|
name: 'Color provider example',
|
||||||
|
id: 'extending-language-services-color-provider-example',
|
||||||
|
path: 'extending-language-services/color-provider-example'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Extending Language Services',
|
||||||
|
name: 'Symbols provider example',
|
||||||
|
id: 'extending-language-services-symbols-provider-example',
|
||||||
|
path: 'extending-language-services/symbols-provider-example'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Extending Language Services',
|
||||||
|
name: 'Folding provider example',
|
||||||
|
id: 'extending-language-services-folding-provider-example',
|
||||||
|
path: 'extending-language-services/folding-provider-example'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Extending Language Services',
|
||||||
|
name: 'Hover provider example',
|
||||||
|
id: 'extending-language-services-hover-provider-example',
|
||||||
|
path: 'extending-language-services/hover-provider-example'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Extending Language Services',
|
||||||
|
name: 'Semantic tokens provider example',
|
||||||
|
id: 'extending-language-services-semantic-tokens-provider-example',
|
||||||
|
path: 'extending-language-services/semantic-tokens-provider-example'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Extending Language Services',
|
||||||
|
name: 'Configure JavaScript defaults',
|
||||||
|
id: 'extending-language-services-configure-javascript-defaults',
|
||||||
|
path: 'extending-language-services/configure-javascript-defaults'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
chapter: 'Extending Language Services',
|
||||||
|
name: 'Configure JSON defaults',
|
||||||
|
id: 'extending-language-services-configure-json-defaults',
|
||||||
|
path: 'extending-language-services/configure-json-defaults'
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
var PLAY_SAMPLES = [
|
if (typeof exports !== 'undefined') {
|
||||||
{
|
exports.PLAY_SAMPLES = PLAY_SAMPLES;
|
||||||
chapter: "Creating the editor",
|
} else {
|
||||||
name: "Hello world!",
|
self.PLAY_SAMPLES = PLAY_SAMPLES;
|
||||||
id: "creating-the-editor-hello-world",
|
|
||||||
path: "creating-the-editor/hello-world"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Creating the editor",
|
|
||||||
name: "Editor basic options",
|
|
||||||
id: "creating-the-editor-editor-basic-options",
|
|
||||||
path: "creating-the-editor/editor-basic-options"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Creating the editor",
|
|
||||||
name: "Hard wrapping",
|
|
||||||
id: "creating-the-editor-hard-wrapping",
|
|
||||||
path: "creating-the-editor/hard-wrapping"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Creating the editor",
|
|
||||||
name: "Syntax highlighting for HTML elements",
|
|
||||||
id: "creating-the-editor-syntax-highlighting-for-html-elements",
|
|
||||||
path: "creating-the-editor/syntax-highlighting-for-html-elements"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Interacting with the editor",
|
|
||||||
name: "Adding a command to an editor instance",
|
|
||||||
id: "interacting-with-the-editor-adding-a-command-to-an-editor-instance",
|
|
||||||
path: "interacting-with-the-editor/adding-a-command-to-an-editor-instance"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Interacting with the editor",
|
|
||||||
name: "Adding an action to an editor instance",
|
|
||||||
id: "interacting-with-the-editor-adding-an-action-to-an-editor-instance",
|
|
||||||
path: "interacting-with-the-editor/adding-an-action-to-an-editor-instance"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Interacting with the editor",
|
|
||||||
name: "Revealing a position",
|
|
||||||
id: "interacting-with-the-editor-revealing-a-position",
|
|
||||||
path: "interacting-with-the-editor/revealing-a-position"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Interacting with the editor",
|
|
||||||
name: "Rendering glyphs in the margin",
|
|
||||||
id: "interacting-with-the-editor-rendering-glyphs-in-the-margin",
|
|
||||||
path: "interacting-with-the-editor/rendering-glyphs-in-the-margin"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Interacting with the editor",
|
|
||||||
name: "Line and Inline decorations",
|
|
||||||
id: "interacting-with-the-editor-line-and-inline-decorations",
|
|
||||||
path: "interacting-with-the-editor/line-and-inline-decorations"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Interacting with the editor",
|
|
||||||
name: "Customizing the line numbers",
|
|
||||||
id: "interacting-with-the-editor-customizing-the-line-numbers",
|
|
||||||
path: "interacting-with-the-editor/customizing-the-line-numbers"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Interacting with the editor",
|
|
||||||
name: "Listening to mouse events",
|
|
||||||
id: "interacting-with-the-editor-listening-to-mouse-events",
|
|
||||||
path: "interacting-with-the-editor/listening-to-mouse-events"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Interacting with the editor",
|
|
||||||
name: "Listening to key events",
|
|
||||||
id: "interacting-with-the-editor-listening-to-key-events",
|
|
||||||
path: "interacting-with-the-editor/listening-to-key-events"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Customizing the appearence",
|
|
||||||
name: "Exposed colors",
|
|
||||||
id: "customizing-the-appearence-exposed-colors",
|
|
||||||
path: "customizing-the-appearence/exposed-colors"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Customizing the appearence",
|
|
||||||
name: "Scrollbars",
|
|
||||||
id: "customizing-the-appearence-scrollbars",
|
|
||||||
path: "customizing-the-appearence/scrollbars"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Customizing the appearence",
|
|
||||||
name: "Tokens and colors",
|
|
||||||
id: "customizing-the-appearence-tokens-and-colors",
|
|
||||||
path: "customizing-the-appearence/tokens-and-colors"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Creating the DiffEditor",
|
|
||||||
name: "Hello diff world!",
|
|
||||||
id: "creating-the-diffeditor-hello-diff-world",
|
|
||||||
path: "creating-the-diffeditor/hello-diff-world"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Creating the DiffEditor",
|
|
||||||
name: "Multi-line example",
|
|
||||||
id: "creating-the-diffeditor-multi-line-example",
|
|
||||||
path: "creating-the-diffeditor/multi-line-example"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Creating the DiffEditor",
|
|
||||||
name: "Inline Diff Example",
|
|
||||||
id: "creating-the-diffeditor-inline-diff-example",
|
|
||||||
path: "creating-the-diffeditor/inline-diff-example"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Creating the DiffEditor",
|
|
||||||
name: "Navigating a Diff",
|
|
||||||
id: "creating-the-diffeditor-navigating-a-diff",
|
|
||||||
path: "creating-the-diffeditor/navigating-a-diff"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Extending Language Services",
|
|
||||||
name: "Custom languages",
|
|
||||||
id: "extending-language-services-custom-languages",
|
|
||||||
path: "extending-language-services/custom-languages"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Extending Language Services",
|
|
||||||
name: "Completion provider example",
|
|
||||||
id: "extending-language-services-completion-provider-example",
|
|
||||||
path: "extending-language-services/completion-provider-example"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Extending Language Services",
|
|
||||||
name: "Codelens provider example",
|
|
||||||
id: "extending-language-services-codelens-provider-example",
|
|
||||||
path: "extending-language-services/codelens-provider-example"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Extending Language Services",
|
|
||||||
name: "Color provider example",
|
|
||||||
id: "extending-language-services-color-provider-example",
|
|
||||||
path: "extending-language-services/color-provider-example"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Extending Language Services",
|
|
||||||
name: "Symbols provider example",
|
|
||||||
id: "extending-language-services-symbols-provider-example",
|
|
||||||
path: "extending-language-services/symbols-provider-example"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Extending Language Services",
|
|
||||||
name: "Folding provider example",
|
|
||||||
id: "extending-language-services-folding-provider-example",
|
|
||||||
path: "extending-language-services/folding-provider-example"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Extending Language Services",
|
|
||||||
name: "Hover provider example",
|
|
||||||
id: "extending-language-services-hover-provider-example",
|
|
||||||
path: "extending-language-services/hover-provider-example"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Extending Language Services",
|
|
||||||
name: "Semantic tokens provider example",
|
|
||||||
id: "extending-language-services-semantic-tokens-provider-example",
|
|
||||||
path: "extending-language-services/semantic-tokens-provider-example"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Extending Language Services",
|
|
||||||
name: "Configure JavaScript defaults",
|
|
||||||
id: "extending-language-services-configure-javascript-defaults",
|
|
||||||
path: "extending-language-services/configure-javascript-defaults"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
chapter: "Extending Language Services",
|
|
||||||
name: "Configure JSON defaults",
|
|
||||||
id: "extending-language-services-configure-json-defaults",
|
|
||||||
path: "extending-language-services/configure-json-defaults"
|
|
||||||
}
|
}
|
||||||
];
|
|
||||||
|
|
||||||
if (typeof exports !== 'undefined') {
|
|
||||||
exports.PLAY_SAMPLES = PLAY_SAMPLES
|
|
||||||
} else {
|
|
||||||
self.PLAY_SAMPLES = PLAY_SAMPLES;
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
|||||||
@ -1 +1 @@
|
|||||||
<div id="container" style="height:100%;"></div>
|
<div id="container" style="height: 100%"></div>
|
||||||
|
|||||||
@ -1 +1 @@
|
|||||||
<div id="container" style="height:100%;"></div>
|
<div id="container" style="height: 100%"></div>
|
||||||
|
|||||||
@ -1 +1 @@
|
|||||||
<div id="container" style="height:100%;"></div>
|
<div id="container" style="height: 100%"></div>
|
||||||
|
|||||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue