From c7a3e42fe69ae8a7c916fe20b9d0a100c45946ff Mon Sep 17 00:00:00 2001 From: Alex Dima Date: Fri, 24 Jun 2016 21:55:01 +0200 Subject: [PATCH] Add hover provider example --- website/playground/playground.mdoc | 38 +++++++++++++++++++ website/playground/samples/all.js | 2 +- ...anguage-services-hover-provider-example.js | 3 ++ 3 files changed, 42 insertions(+), 1 deletion(-) create mode 100644 website/playground/samples/extending-language-services-hover-provider-example.js diff --git a/website/playground/playground.mdoc b/website/playground/playground.mdoc index f6330a65..cf700a61 100644 --- a/website/playground/playground.mdoc +++ b/website/playground/playground.mdoc @@ -1009,6 +1009,44 @@ function getCode() { +== Hover provider example +=======================JS +var quoteOfTheDay = new monaco.Promise(function(c,e) { + window.parseResponse = function(rawQOD) { + c(rawQOD.data.contents.quotes[0].quote); + } + var script = document.createElement('script'); + script.src='http://quotes.rest/qod.js'; + document.head.appendChild(script); +}); + +monaco.languages.register({ id: 'mySpecialLanguage' }); + +monaco.languages.registerHoverProvider('mySpecialLanguage', { + provideHover: function(model, position) { + return quoteOfTheDay.then(function(quoteText) { + return { + range: new monaco.Range(1, 1, model.getLineCount(), model.getLineMaxColumn(model.getLineCount())), + contents: ['**' + quoteText + '**'] + } + }); + } +}); + +monaco.editor.create(document.getElementById("container"), { + value: '\n\nHover over this text', + language: 'mySpecialLanguage' +}); + +=======================HTML +
+ +=======================CSS + +=======================END + + + == Configure JavaScript defaults =======================JS diff --git a/website/playground/samples/all.js b/website/playground/samples/all.js index 89e7e936..b3a84cb1 100644 --- a/website/playground/samples/all.js +++ b/website/playground/samples/all.js @@ -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":"Configure JavaScript defaults","sampleId":"extending-language-services-configure-javascript-defaults"}]; \ No newline at end of file +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"}]; \ No newline at end of file diff --git a/website/playground/samples/extending-language-services-hover-provider-example.js b/website/playground/samples/extending-language-services-hover-provider-example.js new file mode 100644 index 00000000..0e88d35b --- /dev/null +++ b/website/playground/samples/extending-language-services-hover-provider-example.js @@ -0,0 +1,3 @@ +// This is a generated file. Please do not edit directly. +var SAMPLES = this.SAMPLES || []; +SAMPLES.push({"id":"extending-language-services-hover-provider-example","js":"//---------------------------------------------------\n// Extending Language Services > Hover provider example\n//---------------------------------------------------\n\nvar quoteOfTheDay = new monaco.Promise(function(c,e) {\n\twindow.parseResponse = function(rawQOD) {\n\t\tc(rawQOD.data.contents.quotes[0].quote);\n\t}\n\tvar script = document.createElement('script');\n\tscript.src='http://quotes.rest/qod.js';\n\tdocument.head.appendChild(script);\n});\n\nmonaco.languages.register({ id: 'mySpecialLanguage' });\n\nmonaco.languages.registerHoverProvider('mySpecialLanguage', {\n\tprovideHover: function(model, position) {\n\t\treturn quoteOfTheDay.then(function(quoteText) {\n\t\t\treturn {\n\t\t\t\trange: new monaco.Range(1, 1, model.getLineCount(), model.getLineMaxColumn(model.getLineCount())),\n\t\t\t\tcontents: ['**' + quoteText + '**']\n\t\t\t}\n\t\t});\n\t}\n});\n\nmonaco.editor.create(document.getElementById(\"container\"), {\n\tvalue: '\\n\\nHover over this text',\n\tlanguage: 'mySpecialLanguage'\n});\n","html":"
\n","css":""});