Python to generate nice looking SVG graph http://pygal.org/
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

101 lines
4.4 KiB

{% extends '_layout.jinja2' %}
{% block side %}
<form class="form">
<div class="tabbable tabs-left">
<ul class="nav nav-tabs">
<li class="active"><a href="#main" data-toggle="tab">Main</a></li>
{% for group in configs[0]._categories if group != 'Style' %}
<li><a href="#{{ group }}" data-toggle="tab">{{ group }}</a></li>
{% endfor %}
</ul>
<div class="tab-content">
<div class="tab-pane active" id="main">
<legend>Main</legend>
<div class="control-group tt" title="Chose the chart type">
<label class="control-label" for="type">Type</label>
<div class="controls">
<select id="type">
{% for name in charts_names %}
<option value="{{ name }}">{{ name }}</option>
{% endfor %}
</select>
</div>
</div>
<div class="control-group data tt" title="Enter the chart data">
<label class="control-label" for="data">Data</label>
<div class="controls form-inline">
<input type="text" class="input-small serie-label" value="Serie" placeholder="Serie Name"/>
<input type="text" class="input-small serie-value" value="1, 1, 3, 7, 21" placeholder="Values" />
<button type="button" class="btn btn-small rem">-</button>
</div>
<button type="button" class="btn btn-small add">+</button>
</div>
<div class="control-group tt" title="Chose the chart style">
<label class="control-label" for="style">Style</label>
<div class="controls">
<select id="style">
{% for style in styles_names | sort(-1) %}
<option value="{{ style }}">{{ style.replace('_', ' ') | title }}</option>
{% endfor %}
</select>
</div>
</div>
<div class="control-group tt" title="Add interpolation">
<label class="control-label" for="interpolation">Interpolation</label>
<div class="controls">
<select id="interpolation">
<option value=""></option>
{% for interpolation in interpolations %}
<option value="{{ interpolation }}">{{ interpolation | title }}</option>
{% endfor %}
</select>
</div>
</div>
</div>
{% for group, keys in configs | groupby('category') %}
<div class="tab-pane" id="{{ group }}">
<legend>{{ group }}</legend>
{% for key in keys if key.name not in ['js', 'css', 'style', 'interpolate'] %}
{% set doc = 'title="' + key.doc + ' <br /><small>' + key.subdoc + '</small>"' %}
<div class="control-group tt" {{ doc }}>
{% if key.is_boolean %}
<div class="controls">
<label class="checkbox" for="c-{{ key.name }}">
<input type="checkbox" id="c-{{ key.name }}" class="c-opts" {{ 'checked' if key.value }} />{{ key.name.replace('_', ' ') |title }}
</label>
</div>
{% else %}
<label class="control-label" for="c-{{ key.name }}" > {{ key.name.replace('_', ' ') | title }}</label>
<div class="controls">
{% if key.is_numeric %}
<input type="number" id="c-{{ key.name }}" class="c-opts" value="{{ key.value or ''}}" />
{% elif key.is_string %}
<input type="text" id="c-{{ key.name }}" class="c-opts" value="{{ key.value or ''}}" />
{% elif key.is_dict %}
<input type="text" id="c-{{ key.name }}" class="c-opts dict-of-{{ key.subtype }}" value="{{ key.value or ''}}" placeholder="key1: value1, key2: value2, ..." />
{% elif key.is_list %}
<input type="text" id="c-{{ key.name }}" class="c-opts list-of-{{ key.subtype }}" placeholder="value1, value2{{ ', ...' if key.name != 'range' }}" value="{{ key.value or ''}}" />
{% endif %}
</div>
{% endif %}
</div>
{% endfor %}
</div>
{% endfor %}
</div>
</div>
</form>
{% endblock side %}
{% block section %}
<figure>
<div></div>
<figcaption></figcaption>
</figure>
{% endblock section %}