Made sections collapsable

This commit is contained in:
WouterJ 2013-12-26 10:33:42 +01:00 committed by Fabien Potencier
parent b223527373
commit b02c227fab

View File

@ -236,6 +236,23 @@
var tabView = new TabView();
tabView.init();
var elements = {};
function toggle(data_id, section) {
if (!elements[data_id]) {
elements[data_id] = {};
}
if (!elements[data_id][section]) {
elements[data_id][section] = {
on: document.getElementById(data_id + '-' + section + '-open'),
off: document.getElementById(data_id + '-' + section + '-close'),
section_id: data_id + '-' + section
};
}
var data = elements[data_id][section];
Sfjs.toggle(data.section_id, data.on, data.off);
}
</script>
{% endblock %}
@ -288,39 +305,54 @@
{% endif %}
{% if data.default_data is defined %}
<h3>Default Data</h3>
<h3>
<a onclick="toggle('{{ data.id }}', 'default_data')">
<img style="display:none" id="{{ data.id }}-default_data-open" src="{{ asset('bundles/framework/images/blue_picto_more.gif') }}">
<img style="display:inline" id="{{ data.id }}-default_data-close" src="{{ asset('bundles/framework/images/blue_picto_less.gif') }}">
</a>
Default Data
</h3>
<table>
<tr>
<th width="180">Model Format</th>
<td>
{% if data.default_data.model is defined %}
<pre>{{ data.default_data.model }}</pre>
{% else %}
<em>same as normalized format</em>
{% endif %}
</td>
</tr>
<tr>
<th>Normalized Format</th>
<td><pre>{{ data.default_data.norm }}</pre></td>
</tr>
<tr>
<th>View Format</th>
<td>
{% if data.default_data.view is defined %}
<pre>{{ data.default_data.view }}</pre>
{% else %}
<em>same as normalized format</em>
{% endif %}
</td>
</tr>
</table>
<div id="{{ data.id }}-default_data">
<table>
<tr>
<th width="180">Model Format</th>
<td>
{% if data.default_data.model is defined %}
<pre>{{ data.default_data.model }}</pre>
{% else %}
<em>same as normalized format</em>
{% endif %}
</td>
</tr>
<tr>
<th>Normalized Format</th>
<td><pre>{{ data.default_data.norm }}</pre></td>
</tr>
<tr>
<th>View Format</th>
<td>
{% if data.default_data.view is defined %}
<pre>{{ data.default_data.view }}</pre>
{% else %}
<em>same as normalized format</em>
{% endif %}
</td>
</tr>
</table>
</div>
{% endif %}
{% if data.submitted_data is defined %}
<h3>Submitted Data</h3>
<h3>
<a onclick="toggle('{{ data.id }}', 'submitted_data')">
<img style="display:none" id="{{ data.id }}-submitted_data-open" src="{{ asset('bundles/framework/images/blue_picto_more.gif') }}">
<img style="display:inline" id="{{ data.id }}-submitted_data-close" src="{{ asset('bundles/framework/images/blue_picto_less.gif') }}">
</a>
Submitted Data
</h3>
<div id="{{ data.id }}-submitted_data">
{% if data.submitted_data.norm is defined %}
<table>
<tr>
@ -351,69 +383,94 @@
{% else %}
<p><em>This form was not submitted.</em></p>
{% endif %}
</div>
{% endif %}
{% if data.passed_options is defined %}
<h3>Passed Options</h3>
<h3>
<a onclick="toggle('{{ data.id }}', 'passed_options')">
<img style="display:none" id="{{ data.id }}-passed_options-open" src="{{ asset('bundles/framework/images/blue_picto_more.gif') }}">
<img style="display:inline" id="{{ data.id }}-passed_options-close" src="{{ asset('bundles/framework/images/blue_picto_less.gif') }}">
</a>
Passed Options
</h3>
{% if data.passed_options|length %}
<table>
<tr>
<th width="180">Option</th>
<th>Passed Value</th>
<th>Resolved Value</th>
</tr>
{% for option, value in data.passed_options %}
<tr>
<th>{{ option }}</th>
<td><pre>{{ value }}</pre></td>
<td>
{% if data.resolved_options[option] is sameas(value) %}
<em>same as passed value</em>
{% else %}
<pre>{{ data.resolved_options[option] }}</pre>
{% endif %}
</td>
</tr>
{% endfor %}
</table>
{% else %}
<p><em>No options where passed when constructing this form.</em></p>
{% endif %}
<div id="{{ data.id }}-passed_options">
{% if data.passed_options|length %}
<table>
<tr>
<th width="180">Option</th>
<th>Passed Value</th>
<th>Resolved Value</th>
</tr>
{% for option, value in data.passed_options %}
<tr>
<th>{{ option }}</th>
<td><pre>{{ value }}</pre></td>
<td>
{% if data.resolved_options[option] is sameas(value) %}
<em>same as passed value</em>
{% else %}
<pre>{{ data.resolved_options[option] }}</pre>
{% endif %}
</td>
</tr>
{% endfor %}
</table>
{% else %}
<p><em>No options where passed when constructing this form.</em></p>
{% endif %}
</div>
{% endif %}
{% if data.resolved_options is defined %}
<h3>Resolved Options</h3>
<h3>
<a onclick="toggle('{{ data.id }}', 'resolved_options')">
<img style="display:inline" id="{{ data.id }}-resolved_options-open" src="{{ asset('bundles/framework/images/blue_picto_more.gif') }}">
<img style="display:none" id="{{ data.id }}-resolved_options-close" src="{{ asset('bundles/framework/images/blue_picto_less.gif') }}">
</a>
Resolved Options
</h3>
<table>
<tr>
<th width="180">Option</th>
<th>Value</th>
</tr>
{% for option, value in data.resolved_options %}
<tr>
<th>{{ option }}</th>
<td><pre>{{ value }}</pre></td>
</tr>
{% endfor %}
</table>
<div id="{{ data.id }}-resolved_options" style="display:none">
<table>
<tr>
<th width="180">Option</th>
<th>Value</th>
</tr>
{% for option, value in data.resolved_options %}
<tr>
<th>{{ option }}</th>
<td><pre>{{ value }}</pre></td>
</tr>
{% endfor %}
</table>
</div>
{% endif %}
{% if data.view_vars is defined %}
<h3>View Variables</h3>
<h3>
<a onclick="toggle('{{ data.id }}', 'view_vars')">
<img style="display:inline" id="{{ data.id }}-view_vars-open" src="{{ asset('bundles/framework/images/blue_picto_more.gif') }}">
<img style="display:none" id="{{ data.id }}-view_vars-close" src="{{ asset('bundles/framework/images/blue_picto_less.gif') }}">
</a>
View Variables
</h3>
<table>
<tr>
<th width="180">Variable</th>
<th>Value</th>
</tr>
{% for variable, value in data.view_vars %}
<tr>
<th>{{ variable }}</th>
<td><pre>{{ value }}</pre></td>
</tr>
{% endfor %}
</table>
<div id="{{ data.id }}-view_vars" style="display:none">
<table>
<tr>
<th width="180">Variable</th>
<th>Value</th>
</tr>
{% for variable, value in data.view_vars %}
<tr>
<th>{{ variable }}</th>
<td><pre>{{ value }}</pre></td>
</tr>
{% endfor %}
</table>
</div>
{% endif %}
</div>