w-fullscreen Component

[Greendogo]

Can you add a fullscreen component that handles in-page and real "fullscreen" functionality?

I think it would be easier to use this as part of Wave-UI, as I see you've already done some of the work with dialog.

"True" Fullscreen" The thing that's missing is the "True" fullscreen, as seen the "Live Example" here on the Mozilla developer website: https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API#simple_fullscreen_usage

There's a developer agnostic API as well: https://github.com/rafgraph/fscreen

"In Page" Fullscreen Like how you can do it with Dialog.

An example usage would be:

<w-fullscreen v-model="isFullscreen">
...content
</w-fullscreen>

If you wanted to toggle the "page only" type of fullscreen you would do:

<w-fullscreen v-model="isFullscreen" pageonly="false">
...content
</w-fullscreen>

or

<w-fullscreen v-model="isFullscreen" pageonly="true">
...content
</w-fullscreen>

[antoniandre]

Hi @Greendogo, I don't think the fullscreen toggle feature should be in Wave UI as it is already JS built-in and easy to implement. Also not all the browsers support it atm.

I created a demo of how you can do it here: https://codepen.io/antoniandre/pen/GRyqeVe?editors=0010

Hope it helps. :)