Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Supporting creating a new document virtually #272

Closed
cfjedimaster opened this issue Nov 19, 2015 · 51 comments
Closed

Supporting creating a new document virtually #272

cfjedimaster opened this issue Nov 19, 2015 · 51 comments
Assignees
Labels
api feature-request Request for new features or functionality
Milestone

Comments

@cfjedimaster
Copy link

Extensions should be able to create a new panel/document and open it in the editor, much like how markdown preview does.

@jrieken jrieken added the feature-request Request for new features or functionality label Nov 24, 2015
@jrieken
Copy link
Member

jrieken commented Nov 24, 2015

@cfjedimaster The idea is that you can register for a URI-scheme, like foo and that someone will ask you provide the contents for foo://something/anotherthing when a corresponding call to openTextDocument is made.

Those document must not be able to be saved and can be readonly by some mechanism (TBD). Will that be enough for your needs?

@cfjedimaster
Copy link
Author

Sure.

@jrieken
Copy link
Member

jrieken commented Dec 22, 2015

Idea is to allow to contribute content (?) provider, like so

interface TextDocumentContentProvider {
  open(uri:Uri):Thenable<string|Buffer>;
  close(uri:Uri):Thenable<any>;
}

registerTextDocumentProvider(scheme | pattern, provider);

@cfjedimaster
Copy link
Author

Open would require a uri? Does that mean I'd need to save the text locally first?

@jrieken
Copy link
Member

jrieken commented Dec 22, 2015

no, it's more to allow to define your own space using a scheme, like so myextension://project1/path/to/fake/resource would be a valid Uri and it would be up to you to resolve that somehow, like deriving info from a dll-file or generated markup.

@cfjedimaster
Copy link
Author

Ok... I kinda get it. :) I'd love to test this when possible. Let me know.

@jrieken
Copy link
Member

jrieken commented Dec 23, 2015

I will keep you in the loop once we sketch out the API for this.

@DickvdBrink
Copy link
Contributor

I would love this feature as well :)

@jrieken jrieken modified the milestones: Jan 2016, Backlog Jan 4, 2016
@jrieken
Copy link
Member

jrieken commented Jan 4, 2016

Optimistically scheduling this for Jan ;-)

@daviwil
Copy link
Contributor

daviwil commented Jan 5, 2016

I'd love to see this feature happen! Since the Markdown preview is being used as an example, does this mean we'd be able to return HTML as content and have it be rendered correctly for rich output?

cc @dfinke

@jrieken
Copy link
Member

jrieken commented Jan 5, 2016

Unsure what you mean by output, but a goal is to allow others to generate markdown and have it shown/previewed in VS Code

@daviwil
Copy link
Contributor

daviwil commented Jan 5, 2016

Sorry, the term 'output' was a little vague :) To rephrase, I'm asking if this would allow a content provider to return arbitrary (within reason) HTML to be rendered. For example, if I create a mode for editing TODO list files with a special text format, it'd be nice if I could register a content provider that can render some nicely-formatted overview details for the user's TODO items.

Returning Markdown to be rendered could also work but would be less flexible.

@cfjedimaster
Copy link
Author

Hmm, I'd keep it "agnostic". Make the "view" a HTML view so I can send
whatever I want, but making it parse Markdown means I'd have to escape if I
didn't want the automatic conversion.

Basically - make it a web view and I can send whatever I want.

On Tue, Jan 5, 2016 at 9:25 AM, Johannes Rieken notifications@github.com
wrote:

Unsure what you mean by output, but a goal is to allow others to generate
markdown and have it shown/previewed in VS Code


Reply to this email directly or view it on GitHub
#272 (comment).

Raymond Camden, Developer Advocate for MobileFirst at IBM

Email : raymondcamden@gmail.com
Blog : www.raymondcamden.com
Twitter: raymondcamden

@dfinke
Copy link

dfinke commented Jan 5, 2016

One possibility could be someone editing a CSV file and the VS Code extension would take it as input, render it through d3.js creating a visual and displaying the resulting HTML in the view

@jrieken
Copy link
Member

jrieken commented Jan 5, 2016

Great ideas. I will spin it around with the team. We do have a Markdown_Editor_ and a HTML_Editor_ so it shouldn't be too hard.

@sergey-tihon
Copy link

It allows things like ionide-webview https://twitter.com/IonideProject/status/648945352100421632

@Krzysztof-Cieslak
Copy link
Contributor

Ionide-webview is very naive - since Atom allows direct DOM access, it's just HTML iframe showing arbitrary webpage.

@tht13
Copy link
Contributor

tht13 commented Jan 6, 2016

Being able to pass the view HTML to render would be great, as I'd like to make a extension similar to the Markdown one, which would render ReStructuredText in the preview mode just like parkdown does.

@egamma egamma mentioned this issue Jan 6, 2016
59 tasks
@daviwil
Copy link
Contributor

daviwil commented Jan 6, 2016

One potential requirement for this feature is that the content provider should be able to get notifications to refresh itself. @jrieken's proposed API doesn't include that yet, but is it possible that this could be enabled as well?

@jrieken
Copy link
Member

jrieken commented Jan 6, 2016

@daviwil that or the other way around where the provider emits an event to tell the editor to refresh. That would cover the case of virtual.md being generated from on_disk.file.

@jrieken
Copy link
Member

jrieken commented Jan 12, 2016

The mechanics to create a virtual document are in, the preview/render html command is tracked in #1946

@jrieken jrieken closed this as completed Jan 12, 2016
@siegebell
Copy link

Feature request: API support for making a virtual document preview-only.

This would allow extensions an easy way to provide a mostly-seamless GUI using an HTML preview and web sockets. (Allowing javascript calls directly between the HTML preview and extension might also be nice...)

@jrieken
Copy link
Member

jrieken commented Jan 26, 2016

@siegebell If you mean 'readonly' by preview then you are ok

@siegebell
Copy link

@jrieken no, I mean preview-only: there is a "preview" button at the top-right of a document that allows the user to toggle between preview or code view. I am requesting that this button and its keybinding optionally be disabled so that a [virtual] document is stuck in preview mode.

Use case

I am developing a vscode extension for the Coq Proof Assistant, which allows the user to manually step through each line of their proof scipt and see how their hypotheses and proof obligations change. Such interaction falls outside the debug and compilation metaphor that vscode supports in its interface, so I need to write a custom interface to display this information.

Ideally, vscode would provide me an API to write my own interface extensions. Until it does, I've found a nearly sufficient alternative: display an HTML document in preview mode that interacts with my extension using web sockets to display information as the user steps through their proof. It is even interactive. Virtual read-only documents will make this easier.

But if "toggle preview" is still enabled, the user may accidentally switch to the HTML code and become confused. Since viewing the underlying code is of no use to the user, I am requesting that the API provide me a way of:

  1. Turing preview on (versus toggling, which sometimes has strange behavior if the document is already loaded in preview mode from the last session before my extension starts up)
  2. Preventing the user from toggling preview for virtual documents that my extension has created.

@jrieken
Copy link
Member

jrieken commented Jan 26, 2016

no worries, with the new html preview part there is no toggle botton but it will show the path of the URI. having said that, the preview mechanism isn't designed to be a UI extension API. While you can render html and run scripts you should not go crazy in there. The updating (when a document emits a change event) is not built/tested for high frequency of changes

screen shot 2016-01-26 at 14 59 59

@cfjedimaster
Copy link
Author

I believe that this is now implemented in the Insider build. By any chance is there a sample extension that demonstrates this?

@egamma
Copy link
Member

egamma commented Feb 5, 2016

@jrieken suggest to add a sample in https://github.com/Microsoft/vscode-extension-samples

@jrieken
Copy link
Member

jrieken commented Feb 5, 2016

@cfjedimaster As long as we don't have a sample you should check with our api-test: https://github.com/Microsoft/vscode/blob/master/extensions/vscode-api-tests/src/commands.test.ts#L42

@cfjedimaster
Copy link
Author

Hmm, I appreciate the link, but it doesn't make much sense to me yet how I
would use it. I'm willing to wait though till it is documented more. :)

On Fri, Feb 5, 2016 at 3:01 AM, Johannes Rieken notifications@github.com
wrote:

@cfjedimaster https://github.com/cfjedimaster As long as we don't have
a sample you should check with our api-test:
https://github.com/Microsoft/vscode/blob/master/extensions/vscode-api-tests/src/commands.test.ts#L42


Reply to this email directly or view it on GitHub
#272 (comment).

Raymond Camden, Developer Advocate for MobileFirst at IBM

Email : raymondcamden@gmail.com
Blog : www.raymondcamden.com
Twitter: raymondcamden

@egamma egamma assigned egamma and unassigned jrieken Feb 6, 2016
@egamma
Copy link
Member

egamma commented Feb 9, 2016

I've added a sample that illustrates how to use TextContentProviders and the vscode.previewHtml commands.

Pls see: https://github.com/Microsoft/vscode-extension-samples/blob/master/textdocumentprovider-sample/README.md

@cfjedimaster
Copy link
Author

Thank you - will give this a shot!

On Tue, Feb 9, 2016 at 4:30 PM, Erich Gamma notifications@github.com
wrote:

I've added a sample that illustrates how to use TextContentProviders and
the vscode.previewHtml commands.

Pls see:
https://github.com/Microsoft/vscode-extension-samples/blob/master/textdocumentprovider-sample/README.md


Reply to this email directly or view it on GitHub
#272 (comment).

Raymond Camden, Developer Advocate for MobileFirst at IBM

Email : raymondcamden@gmail.com
Blog : www.raymondcamden.com
Twitter: raymondcamden

@cfjedimaster
Copy link
Author

Should this work in the most recent mainline release? I'm getting errors
when I try it:

Activating extension eg2.vscode-css-properties failed: Cannot find module
'/Users/raymondcamden/Downloads/vscode-extension-samples-master/textdocumentprovider-sample/out/src/extension'.
Activating extension eg2.vscode-css-properties failed: Cannot find
module
'/Users/raymondcamden/Downloads/vscode-extension-samples-master/textdocumentprovider-sample/out/src/extension'

On Wed, Feb 10, 2016 at 7:17 AM, Raymond Camden raymondcamden@gmail.com
wrote:

Thank you - will give this a shot!

On Tue, Feb 9, 2016 at 4:30 PM, Erich Gamma notifications@github.com
wrote:

I've added a sample that illustrates how to use TextContentProviders and
the vscode.previewHtml commands.

Pls see:
https://github.com/Microsoft/vscode-extension-samples/blob/master/textdocumentprovider-sample/README.md


Reply to this email directly or view it on GitHub
#272 (comment).

Raymond Camden, Developer Advocate for MobileFirst at IBM

Email : raymondcamden@gmail.com
Blog : www.raymondcamden.com
Twitter: raymondcamden

Raymond Camden, Developer Advocate for MobileFirst at IBM

Email : raymondcamden@gmail.com
Blog : www.raymondcamden.com
Twitter: raymondcamden

@cfjedimaster
Copy link
Author

Forgot to run npm install - sorry about that.

On Wed, Feb 10, 2016 at 7:49 AM, Raymond Camden raymondcamden@gmail.com
wrote:

Should this work in the most recent mainline release? I'm getting errors
when I try it:

Raymond Camden, Developer Advocate for MobileFirst at IBM

Email : raymondcamden@gmail.com
Blog : www.raymondcamden.com
Twitter: raymondcamden

@egamma
Copy link
Member

egamma commented Feb 10, 2016

I've also published the sample to the market place just in case.

@cfjedimaster
Copy link
Author

WOOT! I have it working. I'm kinda guessing at a few things and it is 99%
your code still, but it is there. I literally just need to polish it up a
bit and then I can publish mine too. :) Thank you so much.

Quick question. This line:

var previewUri =

vscode.Uri.parse('css-preview://authority/css-preview');

How would you describe that URI? This is what I went with but I was just
guessing:

let previewUri =

vscode.Uri.parse('html-escape://cfjedimaster/html-escape');

On Wed, Feb 10, 2016 at 8:04 AM, Erich Gamma notifications@github.com
wrote:

I've also published the sample to the market place just in case.


Reply to this email directly or view it on GitHub
#272 (comment).

Raymond Camden, Developer Advocate for MobileFirst at IBM

Email : raymondcamden@gmail.com
Blog : www.raymondcamden.com
Twitter: raymondcamden

@cfjedimaster
Copy link
Author

@egamma
Copy link
Member

egamma commented Feb 10, 2016

Cool that it worked for you.

vscode.Uri.parse('html-escape://cfjedimaster/html-escape');

This looks good to me, you define your own URI scheme html-escape and all the rest is yours.

@cfjedimaster
Copy link
Author

So 100% of the string is - basically - whatever we want? Well, within reason, and named something at least similar to what it is doing?

@egamma
Copy link
Member

egamma commented Feb 10, 2016

Yes, as long as it properly identifies the resource and conforms to an URI.

@dfinke
Copy link

dfinke commented Feb 10, 2016

@cfjedimaster I ran yo code and updated the package devDependencies for ^0.11.x, also added a "postinstall": "node ./node_modules/vscode/bin/install". Ran npm install.

My extension stills says here is no exported member TextDocumentContentProvider.

I'm missing a step somewhere

@egamma
Copy link
Member

egamma commented Feb 11, 2016

Emphasized the missing step to update the engines field in the release notes.

@vscodebot vscodebot bot locked and limited conversation to collaborators Nov 18, 2017
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
api feature-request Request for new features or functionality
Projects
None yet
Development

No branches or pull requests