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

VvebJS Use Case Audit #335

Open
kaimou1357 opened this issue Feb 6, 2024 · 3 comments
Open

VvebJS Use Case Audit #335

kaimou1357 opened this issue Feb 6, 2024 · 3 comments

Comments

@kaimou1357
Copy link

kaimou1357 commented Feb 6, 2024

My current use case here is that I'd actually like to use VvebJs to act as an editable HTML canvas.

For example - I have a generated JSX component with HTML code. I'd basically like VvebJs to provide a Javascript Canvas where the user can select something, make edits, or comment on it. Would VvebJS be able to provide the entire markdown + the selected component? If so - would you be able to direct me to the feature set/APIS needed?

I actually do NOT need the other features like the sidebar etc. I just want to edit pure JSX code.

@givanz
Copy link
Owner

givanz commented Feb 15, 2024

I have a generated JSX component with HTML code

VvvebJs does not use React and JSX it can only work with plain html.

@kaimou1357
Copy link
Author

Got it. If we render the plain HTML from the components themselves, how can we load it into VVEBJS to act as a drag and drop editor?

@givanz
Copy link
Owner

givanz commented Feb 21, 2024

You can load html code with setHtml

Vvveb.Builder.setHtml("<h1>Hello world!</h1>");

To start with a blank page and set the html at startup

Vvveb.Builder.init("about:blank", function() {
		//load code after page is loaded here
		Vvveb.Builder.setHtml("<h1>Hello world!</h1>");
});

You can replace "about:blank" with a custom empty html file something like "blank.html" to add proper <head><body> tags.

The easiest way is to load the html page directly

Vvveb.Builder.init("my-page.html", function() {
		//run code after page is loaded here
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants