/** * ----------------------------------------------------------------------------- * @package smartVISU * @author Wolfram v. Huelsen * @copyright 2020 * @license GPL [http://www.gnu.de] * ----------------------------------------------------------------------------- */ {% extends "widget_device.html" %} {% block example %} The widget creates lines with shutter control elements (up, stop, down, saved position) and a dynamic status icon. Tables can be built by grouping these lines.

The lines take 85% of a blocks width. So e.g. an uzsuicon can be placed inline with the other elements.
To adapt the widget to the needs of your layout, the styles can be overridden in your custom visu.css file.

Styles are:
- .smallshut for the widget properties
- .smallshut .ui-shut-btn for the buttons
- .smallshut .ui-shut-pic for the dynamic icon (with a .icon section to control the icons position)

Example
Hint: click into the shutter to see the status icon changing Hint: to improve readability in the code area, "b.xxx" represents "bath.blind.xxx"
{% filter trim|escape|nl2br %}{% verbatim %}
Shutter Table
{{ device.smallshut('SmS1', 'Wohnzimmer', 'b.move', 'b.stop', 'b.pos', 'b.adjust') }}
{{ device.smallshut('SmS2', 'Bad', 'bath.blind.move', 'bath.blind.stop', 'bath.blind.pos', '') }} {{ device.uzsuicon('uzsu1', 'uzsuitem') }}
{% endverbatim %}{% endfilter %}
Shutter Table
{{ device.smallshut('SmS1', 'Wohnzimmer', 'bath.blind.move', 'bath.blind.stop', 'bath.blind.pos', 'bath.blind.adjust') }}
{{ device.smallshut('SmS2', 'Bad', 'bath.blind.move', 'bath.blind.stop', 'bath.blind.pos', '') }} {{ device.uzsuicon('uzsu1', 'uzsuitem') }}
Click into the picture to control shutter
{{ device.shutter ('', 'Shutter 1', '', '', 'bath.blind.pos') }}
Shutter Table with type = midi
{{ device.smallshut('SmS3', 'Wohnzimmer', 'bath.blind.move', 'bath.blind.stop', 'bath.blind.pos', 'bath.blind.adjust', 'mini') }} {{ device.smallshut('SmS4', 'Bad', 'bath.blind.move', 'bath.blind.stop', 'bath.blind.pos', '', 'mini') }} {{ device.uzsuicon('uzsu2', 'uzsuitem') }}
{% endblock %}