vsm / vsm-box

Web-component for creating & showing VSM-sentences — Visual Syntax Method
https://vsm.github.io
GNU Affero General Public License v3.0
30 stars 1 forks source link

Readonly mode #4

Open carlosvega opened 3 years ago

carlosvega commented 3 years ago

After going through the great documentation of this project I have been unable to find any reference to readonly mode. Is there any way to make the vsm-boxes readonly?, preventing the user from making any change but still able to show the popup for detailed information about the terms?

Thank you very much in advance.

stcruy commented 3 years ago

Thank you for acknowledging my work of writing solid documentation! That is really nice to hear! 😊

This 'readonly' feature is on the to-do list, indeed. But at the moment I have to prioritize more urgent tasks.

After developing the many core components of VSM, I'm now focusing for a while on demonstrating VSM's usefulness in many application areas. This will be essential to secure stable funding and to develop more nice-to-have features.

stcruy commented 3 years ago

Here is a quick fix, perhaps: you could add a listener to your vsm-box, and when it emits a change event, just set the original initialValue back onto the vsm-box. That should make it clear to the user that you do not want them to use the editing function! A bit as in youtu.be/Nqk_nWAjBus. ^-^ (and check that the change doesn't echo back what you just put in!)

carlosvega commented 3 years ago

For now I will be preventing the events of some parts with css pointer-events: none; but I wonder if there is any way to customize the contextual menu of the terms to remove the options remove/edit/insert . Thanks for the support!

stcruy commented 3 years ago

Ha, that's a clever fix! : ) Could you add the list of CSS-overrides that work for you here, once you find them? It might help others.

For the contextual menus maybe the same approach does it... Have you tried setting display: none; on the .menu class (or some more specific selector) in ThePopup component?


Edit (Apr 2021): however, note that also in a readonly mode, the connector-highlighters should still appear when mousing over connectors. Because this helps users to see clearly which terms are connected by connectors that span longer distances.

carlosvega commented 3 years ago

Yes, that's my fallback solution :-) display:none for those options but I was hoping for a exclude list of the options. Fair enough. In the end I might go for pointer-events: none for the whole vsm-box since I can't avoid the user from double clicking the term box and show the input box. I will be losing the contextual menu because hover event won't be trigger but I couldn't find a better solution (i.e. disable connectors, double click and only keep the contextual menu).

As a mini-request, perhaps the vsm-box events should respond to preventDefault. This way developers could intercept all events and disable them one by one as needed.