github-forks
/
monaco-editor
mirror of https://github.com/microsoft/monaco-editor.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add language-service examples to playground

Browse Source
pull/76/head
Martin Aeschlimann 9 years ago
parent 36f649087d
commit ac3194b4b8
4 changed files with 101 additions and 1 deletions
Show Stats Download Patch File Download Diff File

94
website/playground/playground.mdoc
Unescape Escape View File

@ -1008,6 +1008,55 @@ function getCode() {
=======================END
== Completion provider example
=======================JS
function createDependencyProposals() {
// returning a static list of proposals, not even looking at the prefix (filtering is done by the Monaco editor),
// here you could do a server side lookup
return [
{
label: '"lodash"',
kind: monaco.languages.CompletionItemKind.Function,
documentation: "The Lodash library exported as Node.js modules.",
insertText: '"lodash": "*"'
},
{
label: '"express"',
kind: monaco.languages.CompletionItemKind.Function,
documentation: "Fast, unopinionated, minimalist web framework",
insertText: '"express": "*"'
},
{
label: '"mkdirp"',
kind: monaco.languages.CompletionItemKind.Function,
documentation: "Recursively mkdir, like <code>mkdir -p</code>",
insertText: '"mkdirp": "*"'
}
];
}
monaco.languages.registerCompletionItemProvider('json', {
provideCompletionItems: function(model, position) {
// find out if we are completing a property in the 'dependencies' object.
var textUntilPosition = model.getValueInRange({startLineNumber: 1, startColumn: 1, endLineNumber: position.lineNumber, endColumn: position.column});
var match = textUntilPosition.match(/"dependencies"\s*:\s*{\s*("[^"]*"\s*:\s*"[^"]*"\s*,\s*)*("[^"]"]*)?$/);
if (match) {
return createDependencyProposals();
}
return [];
}
});
monaco.editor.create(document.getElementById("container"), {
value: "{\n\t\"dependencies\": {\n\t\t\n\t}\n}\n",
language: "json"
});
=======================HTML
<div id="container" style="height:100%;"></div>
=======================END
== Hover provider example
=======================JS
@ -1120,4 +1169,49 @@ monaco.editor.create(document.getElementById("container"), {
=======================END
== Configure JSON defaults
=======================JS
// Configures two JSON schemas, with references.
monaco.languages.json.jsonDefaults.setDiagnosticsOptions({
schemas: [{
uri: "http://myserver/foo-schema.json",
schema: {
type: "object",
properties: {
p1: {
enum: [ "v1", "v2"]
},
p2: {
$ref: "http://myserver/bar-schema.json"
}
}
}
},{
uri: "http://myserver/bar-schema.json",
schema: {
type: "object",
properties: {
q1: {
enum: [ "x1", "x2"]
}
}
}
}]
});
var jsonCode = [
'{',
' "$schema": "http://myserver/foo-schema.json"',
"}"
].join('\n');
monaco.editor.create(document.getElementById("container"), {
value: jsonCode,
language: "json"
});
=======================HTML
<div id="container" style="height:100%;"></div>
=======================END

2
website/playground/samples/all.js
Unescape Escape View File

@ -1,3 +1,3 @@
// This is a generated file. Please do not edit directly.
this.SAMPLES = [];
this.ALL_SAMPLES = [{"chapter":"Creating the editor","name":"Hello world!","sampleId":"creating-the-editor-hello-world"},{"chapter":"Creating the editor","name":"Editor basic options","sampleId":"creating-the-editor-editor-basic-options"},{"chapter":"Creating the editor","name":"Hard wrapping","sampleId":"creating-the-editor-hard-wrapping"},{"chapter":"Creating the editor","name":"Syntax highlighting for HTML elements","sampleId":"creating-the-editor-syntax-highlighting-for-html-elements"},{"chapter":"Interacting with the editor","name":"Adding a command to an editor instance","sampleId":"interacting-with-the-editor-adding-a-command-to-an-editor-instance"},{"chapter":"Interacting with the editor","name":"Adding an action to an editor instance","sampleId":"interacting-with-the-editor-adding-an-action-to-an-editor-instance"},{"chapter":"Interacting with the editor","name":"Revealing a position","sampleId":"interacting-with-the-editor-revealing-a-position"},{"chapter":"Interacting with the editor","name":"Rendering glyphs in the margin","sampleId":"interacting-with-the-editor-rendering-glyphs-in-the-margin"},{"chapter":"Interacting with the editor","name":"Line and Inline decorations","sampleId":"interacting-with-the-editor-line-and-inline-decorations"},{"chapter":"Interacting with the editor","name":"Customizing the line numbers","sampleId":"interacting-with-the-editor-customizing-the-line-numbers"},{"chapter":"Interacting with the editor","name":"Listening to mouse events","sampleId":"interacting-with-the-editor-listening-to-mouse-events"},{"chapter":"Interacting with the editor","name":"Listening to key events","sampleId":"interacting-with-the-editor-listening-to-key-events"},{"chapter":"Customizing the appearence","name":"Exposed CSS classes","sampleId":"customizing-the-appearence-exposed-css-classes"},{"chapter":"Customizing the appearence","name":"Scrollbars","sampleId":"customizing-the-appearence-scrollbars"},{"chapter":"Customizing the appearence","name":"Tokens and colors","sampleId":"customizing-the-appearence-tokens-and-colors"},{"chapter":"Creating the DiffEditor","name":"Hello diff world!","sampleId":"creating-the-diffeditor-hello-diff-world"},{"chapter":"Creating the DiffEditor","name":"Multi-line example","sampleId":"creating-the-diffeditor-multi-line-example"},{"chapter":"Creating the DiffEditor","name":"Inline Diff Example","sampleId":"creating-the-diffeditor-inline-diff-example"},{"chapter":"Creating the DiffEditor","name":"Navigating a Diff","sampleId":"creating-the-diffeditor-navigating-a-diff"},{"chapter":"Extending Language Services","name":"Custom languages","sampleId":"extending-language-services-custom-languages"},{"chapter":"Extending Language Services","name":"Hover provider example","sampleId":"extending-language-services-hover-provider-example"},{"chapter":"Extending Language Services","name":"Configure JavaScript defaults","sampleId":"extending-language-services-configure-javascript-defaults"}];
this.ALL_SAMPLES = [{"chapter":"Creating the editor","name":"Hello world!","sampleId":"creating-the-editor-hello-world"},{"chapter":"Creating the editor","name":"Editor basic options","sampleId":"creating-the-editor-editor-basic-options"},{"chapter":"Creating the editor","name":"Hard wrapping","sampleId":"creating-the-editor-hard-wrapping"},{"chapter":"Creating the editor","name":"Syntax highlighting for HTML elements","sampleId":"creating-the-editor-syntax-highlighting-for-html-elements"},{"chapter":"Interacting with the editor","name":"Adding a command to an editor instance","sampleId":"interacting-with-the-editor-adding-a-command-to-an-editor-instance"},{"chapter":"Interacting with the editor","name":"Adding an action to an editor instance","sampleId":"interacting-with-the-editor-adding-an-action-to-an-editor-instance"},{"chapter":"Interacting with the editor","name":"Revealing a position","sampleId":"interacting-with-the-editor-revealing-a-position"},{"chapter":"Interacting with the editor","name":"Rendering glyphs in the margin","sampleId":"interacting-with-the-editor-rendering-glyphs-in-the-margin"},{"chapter":"Interacting with the editor","name":"Line and Inline decorations","sampleId":"interacting-with-the-editor-line-and-inline-decorations"},{"chapter":"Interacting with the editor","name":"Customizing the line numbers","sampleId":"interacting-with-the-editor-customizing-the-line-numbers"},{"chapter":"Interacting with the editor","name":"Listening to mouse events","sampleId":"interacting-with-the-editor-listening-to-mouse-events"},{"chapter":"Interacting with the editor","name":"Listening to key events","sampleId":"interacting-with-the-editor-listening-to-key-events"},{"chapter":"Customizing the appearence","name":"Exposed CSS classes","sampleId":"customizing-the-appearence-exposed-css-classes"},{"chapter":"Customizing the appearence","name":"Scrollbars","sampleId":"customizing-the-appearence-scrollbars"},{"chapter":"Customizing the appearence","name":"Tokens and colors","sampleId":"customizing-the-appearence-tokens-and-colors"},{"chapter":"Creating the DiffEditor","name":"Hello diff world!","sampleId":"creating-the-diffeditor-hello-diff-world"},{"chapter":"Creating the DiffEditor","name":"Multi-line example","sampleId":"creating-the-diffeditor-multi-line-example"},{"chapter":"Creating the DiffEditor","name":"Inline Diff Example","sampleId":"creating-the-diffeditor-inline-diff-example"},{"chapter":"Creating the DiffEditor","name":"Navigating a Diff","sampleId":"creating-the-diffeditor-navigating-a-diff"},{"chapter":"Extending Language Services","name":"Custom languages","sampleId":"extending-language-services-custom-languages"},{"chapter":"Extending Language Services","name":"Completion provider example","sampleId":"extending-language-services-completion-provider-example"},{"chapter":"Extending Language Services","name":"Hover provider example","sampleId":"extending-language-services-hover-provider-example"},{"chapter":"Extending Language Services","name":"Configure JavaScript defaults","sampleId":"extending-language-services-configure-javascript-defaults"},{"chapter":"Extending Language Services","name":"Configure JSON defaults","sampleId":"extending-language-services-configure-json-defaults"}];

3
website/playground/samples/extending-language-services-completion-provider-example.js
Unescape Escape View File

@ -0,0 +1,3 @@
// This is a generated file. Please do not edit directly.
var SAMPLES = this.SAMPLES || [];
SAMPLES.push({"id":"extending-language-services-completion-provider-example","js":"//---------------------------------------------------\n// Extending Language Services > Completion provider example\n//---------------------------------------------------\n\nfunction createDependencyProposals() {\n // returning a static list of proposals, not even looking at the prefix (filtering is done by the Monaco editor),\n // here you could do a server side lookup\n return [\n {\n label: '\"lodash\"',\n kind: monaco.languages.CompletionItemKind.Function,\n documentation: \"The Lodash library exported as Node.js modules.\",\n insertText: '\"lodash\": \"*\"'\n },\n {\n label: '\"express\"',\n kind: monaco.languages.CompletionItemKind.Function,\n documentation: \"Fast, unopinionated, minimalist web framework\",\n insertText: '\"express\": \"*\"'\n },\n {\n label: '\"mkdirp\"',\n kind: monaco.languages.CompletionItemKind.Function,\n documentation: \"Recursively mkdir, like <code>mkdir -p</code>\",\n insertText: '\"mkdirp\": \"*\"'\n }\n ];\n}\n\n\nmonaco.languages.registerCompletionItemProvider('json', {\n provideCompletionItems: function(model, position) {\n // find out if we are completing a property in the 'dependencies' object.\n var textUntilPosition = model.getValueInRange({startLineNumber: 1, startColumn: 1, endLineNumber: position.lineNumber, endColumn: position.column});\n var match = textUntilPosition.match(/\"dependencies\"\\s*:\\s*{\\s*(\"[^\"]*\"\\s*:\\s*\"[^\"]*\"\\s*,\\s*)*(\"[^\"]\"]*)?$/);\n if (match) {\n return createDependencyProposals();\n }\n return [];\n }\n});\n\nmonaco.editor.create(document.getElementById(\"container\"), {\n value: \"{\\n\\t\\\"dependencies\\\": {\\n\\t\\t\\n\\t}\\n}\\n\",\n language: \"json\"\n});","html":"<div id=\"container\" style=\"height:100%;\"></div>\n","css":""});

3
website/playground/samples/extending-language-services-configure-json-defaults.js
Unescape Escape View File

@ -0,0 +1,3 @@
// This is a generated file. Please do not edit directly.
var SAMPLES = this.SAMPLES || [];
SAMPLES.push({"id":"extending-language-services-configure-json-defaults","js":"//---------------------------------------------------\n// Extending Language Services > Configure JSON defaults\n//---------------------------------------------------\n\n// Configures two JSON schemas, with references.\n\nmonaco.languages.json.jsonDefaults.setDiagnosticsOptions({\n\tschemas: [{\n uri: \"http://myserver/foo-schema.json\",\n schema: {\n type: \"object\",\n properties: {\n p1: {\n enum: [ \"v1\", \"v2\"]\n },\n p2: {\n $ref: \"http://myserver/bar-schema.json\"\n }\n }\n }\n },{\n uri: \"http://myserver/bar-schema.json\",\n schema: {\n type: \"object\",\n properties: {\n q1: {\n enum: [ \"x1\", \"x2\"]\n }\n }\n }\n }]\n});\n\n\nvar jsonCode = [\n\t'{',\n\t' \"$schema\": \"http://myserver/foo-schema.json\"',\n\t\"}\"\n].join('\\n');\n\nmonaco.editor.create(document.getElementById(\"container\"), {\n\tvalue: jsonCode,\n\tlanguage: \"json\"\n});","html":"<div id=\"container\" style=\"height:100%;\"></div>\n","css":""});
Write Preview
Loading…
Cancel
Save