Play slides on VS Code through exported HTML

marp-team / marp-vscode

Marp for VS Code: Create slide deck written in Marp Markdown on VS Code

https://marketplace.visualstudio.com/items?itemName=marp-team.marp-vscode

MIT License

1.57k stars 74 forks source link

Play slides on VS Code through exported HTML #87

Open yhatt opened 4 years ago

yhatt commented 4 years ago

Marp for VS Code is just a extension to Markdown pane for preview Marp slides when writing. Normally user should use exported HTML/PDF/PPTX for the practical presentation.

However, We have received some (silent) feedbacks to want to play slideshow on VS Code. We are considering to support playing the exported HTML from Marp CLI directly in VS Code, ~~by adding custom WebView by Marp extension~~.

~~A vscode-reveal extension, based on reveal.js, has already supported playing slideshow within VS Code. So we should be able the same with similar approach.~~

ToDo

[ ] Consider a way to export HTML for custom WebView via Marp CLI
- Generate HTML when executing command? (Presented slides cannot edit dynamically)
- Use server mode (--server)? (Should pay attention to the behavior of remote extension)
[ ] Add command to play slideshow
~~Add custom WebView to render converted HTML~~
- UPDATED: We might not use VS Code WebView in favor of Marp CLI's preview window.

apavlenko commented 4 years ago

it would be really great to present slides directly from the VS code! now I use the preview window for that maximizing it as much as possible...

lukebrowell commented 3 years ago

Same here - even if there was a keyboard shortcut for next and previous slide in the preview, and we could full-screen the preview, this would help immensely. I wonder if there is a simpler way to implement this within vscode than how the op is proposing?

Here's the link to the currently open Vscode issue which intersects with this IMO: https://github.com/microsoft/vscode/issues/16927

yhatt commented 3 years ago

The latest VS Code 1.58 is testing an official Live Preview extension for replacing unmaintained one. By using exported HTML, we can try what if Marp slide can play within VS Code.

As pointed out by @lukebrowell, many features are limited in VS Code (e.g. Full screen, presenter view). So we are considering to use Marp CLI's preview window as the backend instead of VS Code's WebView. It requires Google Chrome or the flavored browser but there is no restrictions for playing presentation.

Jaykul commented 3 years ago

For what it's worth, I prefer the browser option (because of the full-screen option and presenter-mode with notes).

The current experience really just needs:

Default to html export instead of pdf
Hotkey to re-export without prompting for the file name or overwrite

sbibauw commented 2 years ago

I'm unsure why people would need to present from VSCode except for it being a faster work flow (can you confirm, @apavlenko & @lukebrowell?). If that's the case, I think implementing @Jaykul suggestions would make much sense: default to HTML, default of subsequent exports to erase the same file in HTML. To this, I'd add:

Add an "Export and present in HTML" button or something like it ("Present immediately"?) which would do the same thing as Exporting to HTML, without prompting for filename (default to same filename as .md + erase existing .html export) + Opening the file (which it already does; though, not sure if it's just me who screwed up the config, but it used to open the HTML in the browser, but now it opens the HTML in VSCode, which isn't really helpful... so make sure that it does something like open slides.html rather than code slides.html)

Actually, I'd also recommend having multiple options in the Marp menu in VSCode:

Export to HTML
Export to PDF
Export to PPT rather than the current single Export option with subsequent choice of file type.

lukebrowell commented 2 years ago

Confirmed @sbibauw - I use markdown to author slides rapidly in vscode for immediate presentation in teams calls and workshops. Workflows which don’t rely on the mouse pointer are optimum.

yhatt commented 2 years ago

Nice. Let me organize features:

"Start presentation": Opens a new UI-less window for presentation, as just same as Marp CLI's preview window, and then enlarge the slide to fullscreen. It is following a general workflow on the famous presentation tools like PowerPoint and Keynote. (So HTML file for presentation would be located in tmp directory)
Quick export commands -> #311
- It should split into an another issue.

Remaining

What a key conbination is better if Marp commands have the default keyboard shortcuts?
Look into how to control Marp CLI preview window from VS Code
Support virtual workspace (e.g. Marp document on the remote repository)

serverhorror commented 1 year ago

I would love to be able to present directly from VS Code. The case I have is to present the IDE next to auxiliary content in video calls.

Especially MS Teams is only sharing a single window, the full screen, or a camera. It is hard to get this to work nicely for users when one has to switch between programs.

The other case that makes this interesting is that it would be nice to have an IDE to show details about what's on a slide.

It would be enough for me if <Space> would actually page thru the slides. Perfect if it was a bit more elaborate to work with <Up>, <Down>, <Left>, <Right>, <Space>, <Page-Up>, <Page-Down>, .... vscode-reveal is doing that, although I have no clue how and I much prefer MARP :)