widgetti / solara

A Pure Python, React-style Framework for Scaling Your Jupyter and Web Apps
https://solara.dev
MIT License
1.62k stars 105 forks source link

Ability to add oncontextmenu attribute to body tag #164

Closed hkayabilisim closed 11 months ago

hkayabilisim commented 11 months ago

I'm preparing a Solara interface to be run fullscreen on a 4K touchscreen which will be displayed in an exhibition. We would like to disable the right click. Currently, I'm adding "oncontextmenu" attribute via developer tools as a last step in deployment.

<body oncontextmenu="return false;">

I wonder if you can add a new command-line parameter such as "solara run --disable-contextmenu app.py" for this purpose.

maartenbreddels commented 11 months ago

I'm preparing a Solara interface to be run fullscreen on a 4K touchscreen which will be displayed in an exhibition

Really cool! Will you make a photo of this and share it here? :)

What about the following:

import solara
clicks = solara.reactive(0)

@solara.component
def Page():
    color = "green"
    if clicks.value >= 5:
        color = "red"

    def increment():
        clicks.value += 1
        print("clicks", clicks)  # noqa

    solara.Button(label=f"Clicked: {clicks}", on_click=increment, color=color)

@solara.component
def Layout(children):
    # if you need the normal applayout
    # layout = solara.AppLayout(children=children, style)
    layout = solara.Div(children=children, style={"width": "100%", "min-height": "100vh"})

    def log(*args):
        print("stop doing that!", args)

    solara.v.use_event(layout, "contextmenu.prevent", log)
    return layout

We are using the event modifiers: https://vuejs.org/guide/essentials/event-handling.html#event-modifiers

hkayabilisim commented 11 months ago

Your trick is very cool and more importantly it works! Thank you!

By the way, here is what we've prepared so far:

image
maartenbreddels commented 11 months ago

Looks great! Is this open source, or is the source visible?

hkayabilisim commented 11 months ago

The sources are in a private GitHub repo. The code is a little messy so I don't want anyone to see it at least now :) But the output is presented on a 4K TV right now in this exhibition: https://saltonline.org/en/2565/sergi-yarinin-depreme-dayanikli-sehirleri?agenda

maartenbreddels commented 11 months ago

Feel free to share more information here, and maybe you also want to share this on our #showcase discord channel!