https://github.com/feezal/feezal
Web Components based Dashboard UI with WYSIWYG Editor
https://github.com/feezal/feezal
custom-elements dashboard iot mqtt node-red smart-home visualization web-components web-ui wysiwyg
Last synced: 18 days ago
JSON representation
Web Components based Dashboard UI with WYSIWYG Editor
- Host: GitHub
- URL: https://github.com/feezal/feezal
- Owner: feezal
- Created: 2020-03-21T14:05:49.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2021-01-10T00:15:35.000Z (about 5 years ago)
- Last Synced: 2025-10-10T02:30:00.151Z (3 months ago)
- Topics: custom-elements, dashboard, iot, mqtt, node-red, smart-home, visualization, web-components, web-ui, wysiwyg
- Language: JavaScript
- Size: 187 KB
- Stars: 5
- Watchers: 4
- Forks: 2
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# feezal
> Web Components based Dashboard UI with WYSIWYG Editor
**WORK IN PROGRESS** This Project is in an early development stage and far away from being "done" or "ready for
production". Nevertheless I'm happy if you're already willing to test and it, Feedback of any kind (via the Issue
Tracker) is highly appreciated!
## Usage
You just have to add the Feezal Node and deploy. Then open the Node Configuration again and click on the Editor Button
to enter the Editor. The Editor itself should be quite self-explanatory, it aims to be similar to the Node-RED Flow
Editor (Drag&Drop from the Palette, Element Configuration in Editor on the right).
## Node Input
If you set a topic on a element you can just send messages with that topic into the feezal node. To manipulate a
specific html attribute of the element append that to the topic (e.g. you configured `button` as topic of the element,
if you want to disable it send a msg like this: `{"topic":"button/disabled","payload":true}`)
Another Example:
Put a "basic template" element on your view, use `template` as topic and `Hello ${msg.payload}` as template. Now send a message
to the feezal node: `{"topic":"template","payload":"world"}`. To change a style attribute you could just send a message
like `{"topic":"template/style","payload":{"color":"green"}}`.
## Node Output
Events generated by an Element will be outputted by the feezal node.
## License
GPLv3 (c) Sebastian Raff