+
+<&| /Widgets/TitleBox, title => loc("Calculate"), class => "chart-calculate" &>
+
+<fieldset><legend><% loc('Calculate values of') %></legend>
+<& Elements/SelectChartFunction, Default => $query{'ChartFunction'}[0] &>
+</fieldset>
+<fieldset><legend><% loc('and then') %></legend>
+<& Elements/SelectChartFunction, Default => $query{'ChartFunction'}[1] // q{}, ShowEmpty => 1 &>
+</fieldset>
+<fieldset><legend><% loc('and then') %></legend>
+<& Elements/SelectChartFunction, Default => $query{'ChartFunction'}[2] // q{}, ShowEmpty => 1 &>
+</fieldset>
+
+</&>
+
+<&| /Widgets/TitleBox, title => loc('Picture'), class => "chart-picture" &>
+<input name="ChartStyle" type="hidden" value="<% $query{ChartStyle}[0] %>" />
+<label><% loc('Style') %>: <& Elements/SelectChartType, Default => $query{ChartStyle}[0] =~ /^(pie|bar|table)\b/ ? $1 : undef &></label>
+<span class="width">
+<label><% loc("Width") %>: <input type="text" name="Width" value="<% $query{'Width'} || q{} %>"> <% loc("px") %></label>
+</span>
+<span class="height">
+ ×
+ <label><% loc("Height") %>: <input type="text" name="Height" value="<% $query{'Height'} || q{} %>"> <% loc("px") %></label>
+</span>
+<div class="include-table">
+ <input type="checkbox" name="ChartStyleIncludeTable" <% $query{ChartStyle}[0] =~ /\btable\b/ ? 'checked="checked"' : '' |n %>> <% loc('Include data table') %>
+</div>
+<div class="include-sql">
+ <input type="checkbox" name="ChartStyleIncludeSQL" <% $query{ChartStyle}[0] =~ /\bsql\b/ ? 'checked="checked"' : '' |n %>> <% loc('Include TicketSQL query') %>
+</div>
+</&>
+<script type="text/javascript">
+var updateChartStyle = function() {
+ var val = jQuery(".chart-picture [name=ChartType]").val();
+ if ( val != 'table' && jQuery(".chart-picture [name=ChartStyleIncludeTable]").is(':checked') ) {
+ val += '+table';
+ }
+ if ( jQuery(".chart-picture [name=ChartStyleIncludeSQL]").is(':checked') ) {
+ val += '+sql';
+ }
+ jQuery(".chart-picture [name=ChartStyle]").val(val);
+};
+jQuery(".chart-picture [name=ChartType]").change(function(){
+ var t = jQuery(this);
+ t.closest("form").find("[name=Height]").closest(".height").toggle( t.val() == 'bar' );
+ t.closest("form").find("[name=Width]").closest(".width").toggle( t.val() !== 'table' );
+ t.closest("form .chart-picture").find("div.include-table").toggle( t.val() !== 'table' );
+ updateChartStyle();
+}).change();
+
+jQuery(".chart-picture [name=ChartStyleIncludeTable]").change( updateChartStyle );
+jQuery(".chart-picture [name=ChartStyleIncludeSQL]").change( updateChartStyle );
+</script>
+
+<& /Elements/Submit, Label => loc('Update Chart'), Name => 'Update' &>
+</form>
+