<div class="df_w">
	<div class="df{if !$_MODEL->existsUsers} hidden{/if}" data-presentation="slide-remove-results-layer">
		<div class="space space_15"></div>
		<div class="df_title"><span>Usuń wyniki quizu</span><div class="df_tooltip" data-toggle="tooltip" data-placement="top" title="" data-original-title="Usuwa wyniki quizu dla tego pytania"><div class="df_tooltip_mask"></div><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-help-circle"></use></svg></div></div> 
		<div class="space space_10"></div>
		<div class="df_ct"><button type="button" data-presentation="slide-remove-results" class="btn btn-primary btn-outline full-width"><div class="icon"><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-trash"/></svg></div><span>Usuń wyniki</span></button></div>
		<div class="space space_15"></div> 
	</div>
	{assign var=element value=$_MODEL->getElement("name")}
	<div class="df">
		<div class="space space_15"></div>
		<div class="df_title"><span>Pytanie</span><div class="df_tooltip" data-toggle="tooltip" data-placement="top" title="" data-original-title="Maksymalna długość tekstu to 100 znaków"><div class="df_tooltip_mask"></div><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-help-circle"></use></svg></div></div> 
		<div class="space space_10"></div>
		<div class="df_ct">
			<div class="input-group"><input type="text" name="name" value="{htmlspecialchars($element->getValue())}" class="form-control fn_data_max_length" data-max-length="100"><span class="input-group-addon input-group-addon-max-length">100</span></div>
		</div>
		<div class="space space_15"></div> 
	</div>
	{assign var=element value=$_MODEL->getElement("image")}
	{assign var=element_name value=$_MODEL->getElement("image_name")}
	<div class="df">
		<div class="space space_15"></div>
		<div class="df_title"><span>Obrazek do pytania</span><div class="df_tooltip" data-toggle="tooltip" data-placement="top" title="" data-original-title="Wstawia ukryty obrazek do slajdu"><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-help-circle"/></svg></div></div> 
		<div class="space space_10"></div>
		<div class="df_ct">
			{include file="../../../helper/form/image.tpl" value=$element name=$element_name fieldFile="image_upload" fieldValue="image" fieldName="image_name"}
		</div>
		<div class="space space_15"></div> 
	</div>
	{assign var=element value=$_MODEL->getElement("description")}
	<div class="df">
		<div class="space space_15"></div>
		<div class="df_title"><span>Opis pytania</span><div class="df_tooltip" data-toggle="tooltip" data-placement="top" title="" data-original-title="Maksymalna długość tekstu to 200 znaków"><div class="df_tooltip_mask"></div><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-help-circle"></use></svg></div></div> 
		<div class="space space_10"></div>
		<div class="df_ct">
			<div class="input-group input-group-textarea"><textarea name="description" class="form-control fn_data_max_length" rows="4" data-max-length="200">{htmlspecialchars($element->getValue())}</textarea></div>
		</div>
		<div class="space space_15"></div> 
	</div>
	{assign var=element value=$_MODEL->getElement("options")}
	<div class="df">
		<div class="space space_15"></div>
		<div class="df_title"><span>Dostępne opcje</span><div class="df_tooltip" data-toggle="tooltip" data-placement="top" title="" data-original-title="Maksymalna ilość opcji to 10"><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-help-circle"/></svg></div></div> 
		<div class="space space_5"></div>
		<div class="df_ct">
			{assign var=element_values value=$element->getValue()}
			{assign var=idx value=1}
			<div class="sortable_options">
				{foreach from=$element_values item=option}
					<div class="input-group"><span class="input-group-addon input-group-addon-move"><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-move"/></svg></span><input type="text" name="options[]" value="{$option.text}" class="form-control fn_data_max_length" data-max-length="40"><span class="input-group-addon input-group-addon-max-length">40</span><span class="input-group-addon input-group-addon-btn" data-presentation="slide-form-option-remove"><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-trash"/></svg></span></div>
					{$idx=$idx+1}
				{/foreach}
			</div>
			<div class="space space_5"></div>
			<div data-presentation="slide-form-option-add" data-type="with-max-length" class="btn btn-primary full-width"><div class="icon"><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-plus"/></svg></div><span>Dodaj opcję</span></div>
		</div>
		<div class="space space_15"></div> 
	</div>
	{assign var=element_min value=$_MODEL->getElement("min")}
	{assign var=element_max value=$_MODEL->getElement("max")}
	<div class="df">
		<div class="space space_15"></div>
		<div class="df_title"><span>Wartość minimlna i maksymalna</span><div class="df_tooltip" data-toggle="tooltip" data-placement="top" title="" data-original-title="Minimalna i maksymalna wartość którą można przypisać opcji"><div class="df_tooltip_mask"></div><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-help-circle"></use></svg></div></div> 
		<div class="space space_10"></div>
		<div class="df_ct">
			<div class="row">
				<div class="col-xs-6">
					<input type="text" name="min" value="{htmlspecialchars($element_min->getValue())}" class="touchspin_1">
					<script>
						$(document).ready(function(){
							$(".touchspin_1").TouchSpin({
								verticalbuttons: true,
								buttondown_class: 'btn btn-white',
								buttonup_class: 'btn btn-white'
							});
						});
					</script>
				</div>
				<div class="col-xs-6">
					<input type="text" name="max" value="{htmlspecialchars($element_max->getValue())}" class="touchspin_2">
					<script>
						$(document).ready(function(){
							$(".touchspin_2").TouchSpin({
								verticalbuttons: true,
								buttondown_class: 'btn btn-white',
								buttonup_class: 'btn btn-white'
							});
						});
					</script>
				</div>
			</div>
		</div>
		<div class="space space_15"></div> 
	</div>
	{assign var=element value=$_MODEL->getElement("y_name")}
	<div class="df">
		<div class="space space_15"></div>
		<div class="df_title"><span>Lewa etykieta</span><div class="df_tooltip" data-toggle="tooltip" data-placement="top" title="" data-original-title="Maksymalna długość tekstu to 40 znaków"><div class="df_tooltip_mask"></div><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-help-circle"></use></svg></div></div> 
		<div class="space space_10"></div>
		<div class="df_ct">
			<div class="input-group"><input type="text" name="y_name" value="{htmlspecialchars($element->getValue())}" class="form-control fn_data_max_length" data-max-length="40"><span class="input-group-addon input-group-addon-max-length">40</span></div>
		</div>
		<div class="space space_15"></div> 
	</div>
	{assign var=element value=$_MODEL->getElement("x_name")}
	<div class="df">
		<div class="space space_15"></div>
		<div class="df_title"><span>Dolna etykieta</span><div class="df_tooltip" data-toggle="tooltip" data-placement="top" title="" data-original-title="Maksymalna długość tekstu to 40 znaków"><div class="df_tooltip_mask"></div><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-help-circle"></use></svg></div></div> 
		<div class="space space_10"></div>
		<div class="df_ct">
			<div class="input-group"><input type="text" name="x_name" value="{htmlspecialchars($element->getValue())}" class="form-control fn_data_max_length" data-max-length="40"><span class="input-group-addon input-group-addon-max-length">40</span></div>
		</div>
		<div class="space space_15"></div> 
	</div>
	{assign var=element value=$_MODEL->getElement("show_type")}
	{assign var=element_rotate value=$_MODEL->getElement("show_type_rotate")}
	<div class="df">
		<div class="space space_15"></div>
		<div class="df_title"><span>Tło wykresu</span><div class="df_tooltip" data-toggle="tooltip" data-placement="top" title="" data-original-title="Wybierz tło wykresu"><div class="df_tooltip_mask"></div><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-help-circle"></use></svg></div></div> 
		<div class="space space_10"></div>
		<div class="df_ct">
			<div class="df_results">
				<div class="df_result">
					<input type="radio" name="show_type" value="1" id="result_type_chart_1"{if $element->getValue()=="1"} checked{/if}>
					<label for="result_type_chart_1"><div class="df_result_img"><div><img src="{url mode="root"}theme/dobry-start/images/chart_type_6_bg_1.png" alt=""></div></div></label>
				</div>
				<div class="df_result">
					<input type="radio" name="show_type" value="2" id="result_type_chart_2"{if $element->getValue()=="2"} checked{/if}>
					<label for="result_type_chart_2"><div class="df_result_img"><div><img src="{url mode="root"}theme/dobry-start/images/chart_type_6_bg_2.png" alt=""></div></div></label>
				</div>
				<div class="df_result">
					<input type="radio" name="show_type" value="3" id="result_type_chart_3"{if $element->getValue()=="3"} checked{/if}>
					<label for="result_type_chart_3"><div class="df_result_img"><div><img src="{url mode="root"}theme/dobry-start/images/chart_type_6_bg_3.png" alt=""></div></div></label>
				</div>
				<div class="df_result">
					<div class="rotate_deg_icon">
						<div class="rotate_deg_icon_ct">
							<div class="rotate_deg_icon_ct_c"><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-rotate-right"></use></svg></div>
						</div>
					</div>
					<input type="radio" name="show_type" value="4" id="result_type_chart_4"{if $element->getValue()=="4"} checked{/if}>
					<input type="hidden" name="show_type_rotate" value="{htmlspecialchars($element_rotate->getValue())}">
					<label for="result_type_chart_4">
						<div class="df_result_img">
							<div>
								<div class="rotate_deg_mask"></div>
								<img src="{url mode="root"}theme/dobry-start/images/chart_type_6_bg_4_deg_0.png" class="rotate_deg{if $element_rotate->getValue() == "0"} active{/if}" alt="" data-value="0">
								<img src="{url mode="root"}theme/dobry-start/images/chart_type_6_bg_4_deg_90.png" class="rotate_deg{if $element_rotate->getValue() == "90"} active{/if}" alt="" data-value="90">
								<img src="{url mode="root"}theme/dobry-start/images/chart_type_6_bg_4_deg_180.png" class="rotate_deg{if $element_rotate->getValue() == "180"} active{/if}" alt="" data-value="180">
								<img src="{url mode="root"}theme/dobry-start/images/chart_type_6_bg_4_deg_270.png" class="rotate_deg{if $element_rotate->getValue() == "270"} active{/if}" alt="" data-value="270">
							</div>
						</div>
					</label>
				</div>
			</div>
		</div>
		<div class="space space_15"></div> 
	</div>
	{assign var=element value=$_MODEL->getElement("background")}
	{assign var=element_name value=$_MODEL->getElement("background_name")}
	<div class="df">
		<div class="space space_15"></div>
		<div class="df_title"><span>Własne tło wykresu</span><div class="df_tooltip" data-toggle="tooltip" data-placement="top" title="" data-original-title="Wstawia tło wykresu. Zalecany rozmiar to 1200 x 1200 px"><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-help-circle"/></svg></div></div> 
		<div class="space space_10"></div>
		<div class="df_ct">
			{include file="../../../helper/form/image.tpl" value=$element name=$element_name fieldFile="background_upload" fieldValue="background" fieldName="background_name"}
		</div>
		<div class="space space_15"></div> 
	</div>
	{assign var=element value=$_MODEL->getElement("hide_button")}
	<div class="df">
		<div class="space space_15"></div>
		<div class="df_title"><span>Zezwól na pominięcie opcji</span><div class="df_tooltip" data-toggle="tooltip" data-placement="top" title="" data-original-title="Przedstawia wyniki głosowania jako wybrane wartości"><div class="df_tooltip_mask"></div><svg><use xlink:href="{url mode="root"}theme/dobry-start/images/icons/svg/sprite.svg#shape-help-circle"></use></svg></div></div> 
		<div class="space space_10"></div>
		<div class="df_ct">
			<div class="df_options">
				<div class="df_option">
					<input type="radio" name="hide_button" value="0" id="result_type_0"{if $element->getValue()=="0"} checked{/if}>
					<label for="result_type_0"><span>Nie</span></label>
				</div>
				<div class="df_option">
					<input type="radio" name="hide_button" value="1" id="result_type_1"{if $element->getValue()=="1"} checked{/if}>
					<label for="result_type_1"><span>Tak</span></label>
				</div>
			</div>
		</div>
		<div class="space space_15"></div> 
	</div>
</div>
<script type="text/javascript">
	$(document).ready(function () {
		$('.df_result .rotate_deg_icon').on('click',function () {
			var current_img = $(this).parent().find('.rotate_deg.active');
			var first_img   = $(this).parent().find('.rotate_deg:eq(0)');

			if(current_img.next().length) {
				current_img.removeClass('active');
				$(current_img).next().addClass('active');

				$("input[name='show_type_rotate']").val($(current_img).next().data("value"));
				$.fn.presentation.slideSave();
			} else {
				current_img.removeClass('active');
				first_img.addClass('active');

				$("input[name='show_type_rotate']").val($(first_img).data("value"));
				$.fn.presentation.slideSave();
			};
		});
	});
</script>