/** * ----------------------------------------------------------------------------- * @package smartVISU * @author Martin Gleiß * @copyright 2012 * @license GPL [http://www.gnu.de] * ----------------------------------------------------------------------------- */ {% extends "index.html" %} {% block content %}

Icons

{{ lib.smartvisu }} uses two kinds of icons:
{% import "icon.html" as icon %} {% set widgetlist = docu('widgets/icon.html') %}
{{ widgetlist|length }}
icons

Dynamic Icons

Dynamic icons are based on svg-images. They are directly rendered in the browser and are the fastest way to show dynamic changes. Use the slider to see how the dynamic icon changes.
{% filter trim|escape|nl2br %}{% verbatim %} {{ icon.arrow('icon1', '', 'bath_light_value') }} {{ icon.battery('icon2', '', 'bath_light_value') }} {% endverbatim %}{% endfilter %}

{{ basic.slider('slider1', 'bath_light_value', 0, 255, 1) }}
{% for widget in widgetlist %}
{{ attribute(icon, widget.name, [widget.name, '', 'bath_light_value'] ) }}
{{ widget.command }}
{% endfor %}


{% set iconlist = dir(icon0, '(.*\.svg)') %}
{{ iconlist|length }}
icons

Static Icons

A static icon may be based on .png-image or .svg-image. Use "icon0" to show the "normal" version. If you like to show the "hilighted" version .png and .svg differ. The .png based images need a completed directory (located in icons) with all icons rendered in the highlighted color. Highlighted .svg-images only need a style-sheet, defined in the design (located in design).
normal:
{% filter trim|escape|nl2br %}{% verbatim %} {% endverbatim %}{% endfilter %}
highlighted:
{% filter trim|escape|nl2br %}{% verbatim %} {% endverbatim %}{% endfilter %}
Examples
Icons located in "{{ icon0 }}"
{% set cat = 'au' %} {% for file in iconlist %} {% if cat != file.name|slice(0, 2) %}


{% set cat = file.name|slice(0, 2) %} {% endif %}
{{ file.name }}
{% endfor %} {% endblock %}