Elgato_dark/bunkerweb
1
0
Fork 0
mirror of https://github.com/bunkerity/bunkerweb synced 2026-05-24 09:28:37 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

update plugin page doc

Browse source
This commit is contained in:
Jordan Blasenhauer 2024-02-02 11:15:37 +01:00
parent fe013b6c99
commit 93fb398aa6
1 changed files with 39 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
docs/plugins.md
View file

@ -544,9 +544,9 @@ BunkerWeb uses an internal job scheduler for periodic tasks like renewing certif
### Plugin page
Plugin pages are used to display information about your plugin and interact with the user inside the plugins section of the [web UI](web-ui.md).
Everything related to the web UI is located inside the subfolder **ui** as we seen in the [previous structure section.](#structure)
Everything related to the web UI is located inside a subfolder named **ui** at the root directory of your plugin. A template file named **template.html** and located inside the **ui** subfolder contains the client code and logic to display your page. Another file named **actions.py** and also located inside the **ui** subfolder contains code that will be executed when the user is interacting with your page (filling a form for example).
#### Basic example
!!! info "Jinja 2 template"
The **template.html** file is a Jinja2 template, please refer to the [Jinja2 documentation](https://jinja.palletsprojects.com) if needed.
@ -584,3 +584,40 @@ def myplugin() :
!!! info "Python libraries"
You can use Python libraries that are already available like :
`Flask`, `Flask-Login`, `Flask-WTF`, `beautifulsoup4`, `docker`, `Jinja2`, `python-magic` and `requests`. To see the full list, you can have a look at the Web UI [requirements.txt](https://github.com/bunkerity/bunkerweb/blobsrc/ui/requirements.txt). If you need external libraries, you can install them inside the **ui** folder of your plugin and then use the classical **import** directive.
#### Utils
To easily update the content of a template inside the UI with JSON, a **SetupPlugin class** is available in `src/ui/static/js/plugins/setup.js` and will be executed when the plugin template is load.
For example, in case **actions.py** return this JSON :
```python
def plugin():
return {"message": "ok", "data": {"name": "test"}}
```
I need to add this on my **template.html** :
```html
<script>
new SetupPlugin({
name: {
el: document.querySelector('[data-name]'),
value: '',
type: 'text',
},
});
</script>
```
!!! info "Check core plugins"
Core plugins are using this utils. Feel free to look at them in order to see in details how each `key` is working.
| key | Type | Description |
| :--------: | :----: | :------------------------------------------------------------------------------------------- |
| `name ` | string | Replace `name` by the JSON key to extract the related value. |
| `el` | element| Select element you want the value to be updated. |
| `value` | any | Default value on template load or in case retrieving JSON failed. |
| `type` | string | Define the script behavior with the incoming value. Available : `text`, `list` and `status`. |
| `textEl` | element| Optional additionnal text content when type is `status`. |
| `listNames`| string | List of data keys when type is `list`. |