{% extends 'base_catalog.html' %}
{% load static %}
{% load i18n %}

{% block bread_scrumbs %}
<div class="bread-crumbs">
	<a href="/">{% trans 'Главная страница' %}</a>
	<strong>{% trans 'Добавить событие' %}</strong>
</div>
{% endblock %}

{% block page_title %}
<div class="page-title">
	<h1>{% trans 'Добавить событие' %}</h1>
</div>
{% endblock %}

{% block page_body %}

<div class="page-body clearfix add-event-page">
	<div class="set-sect p-form adm-form" id="step-1">
		<div class="set-sect-title clearfix">
			<h3>{% trans 'Шаг 1. Основная информация' %}</h3>
		</div>
		<div class="form-wrap">

			<form action="/organiser/add-event/" id="summary-form">

				<hr/>

				<div class="mf-line afs-type event-type">
					<label>Тип события:</label>

					<div class="mf-field">
						<label class="check"><input type="radio" name="nt"/> {% trans 'выставка' %}</label>
						<label class="check"><input type="radio" name="nt"/> {% trans 'конференция' %}</label>
						<label class="check"><input type="radio" name="nt"/> {% trans 'семинар' %}</label>
						<label class="check"><input type="radio" name="nt"/> {% trans 'вебинар' %}</label>
					</div>
				</div>

				<hr/>

				<div class="adm-form-body">

					<div class="mf-line s-subj-tag">
						<div class="mf-field">
							<label>{% trans 'Тематика' %}:</label>

							<div class="c-select-box select" data-placeholder="{% trans 'Выберите тематику' %}">
								<div class="csb-selected-items"></div>
								<div class="csb-menu-wrap">
									<div class="scroll-container csb-menu">
										<div class="scroll-content clearfix">
											<ul>
												{% for val, choice in form.theme.field.choices %}
												<li><label><input type="checkbox" name="theme" value="{{ val }}"/>{{
													choice }}</label></li>
												{% endfor %}
											</ul>
										</div>
									</div>
								</div>

							</div>
						</div>

						<div class="mf-field">
							<label>{% trans 'Теги' %}:</label>

							<div class="c-select-box select" data-placeholder="{% trans 'Выберете ключевые теги' %}">
								<div class="csb-selected-items"></div>
								<div class="csb-menu-wrap">
									<div class="scroll-container csb-menu">
										<div class="scroll-content clearfix">
											<ul>

											</ul>
										</div>
									</div>
								</div>

							</div>
						</div>
					</div>

					<hr/>

					<h2>{% trans 'Описание выставки' %}</h2>

					<div class="mf-line">
						<div class="mf-field">
							{{ form.name }}
						</div>
					</div>

					<div class="mf-line full-width">
						<div class="mf-field">
							{{ form.main_title }}
						</div>
					</div>

					<div class="mf-line full-width">
						<div class="mf-field">
							<textarea name="description" cols="30" rows="10"
									  placeholder="{% trans 'Полное описание выставки' %}"></textarea>
						</div>
					</div>

					<hr/>

					<div id="dates-range" class="mf-line">
						<label class="h2">{% trans 'Даты проведения' %}:</label>

						<div class="mf-field">
							<div class="period date-to-date">
								<div class="pwf-field">
									<label>{% trans 'с' %}</label>
									<input type="text" class="date dateFrom" name="dateFrom"
										   placeholder="{% trans 'дд.мм.гггг' %}"/>
								</div>
								<div class="pwf-field">
									<label>{% trans 'по' %}</label>
									<input type="text" class="date dateTo" name="dateTo"
										   placeholder="{% trans 'дд.мм.гггг' %}"/>
								</div>
							</div>
						</div>
					</div>

					<hr/>

					<div class="mfs-location">

						<h2>{% trans 'Локация' %}</h2>

						<div class="mf-line">
							<div class="mf-field">
								<input type="text" name="pntitle" placeholder="{% trans 'Место проведения' %}"/>
							</div>
						</div>

						<div class="mf-line">
							<div class="mf-field">
								<input type="text" name="pntitle" placeholder="{% trans 'Страна' %}"/>
							</div>

							<div class="mf-field">
								<input type="text" name="pntitle" placeholder="{% trans 'Город' %}"/>
							</div>
						</div>

					</div>

					<hr/>

					<div class="mfs-additional">
						<h2>{% trans 'Дополнительная информация' %}</h2>

						<div class="mf-line mf-targets">
							<label>{% trans 'Аудитория' %}:</label>

							<div class="mf-field">

								<div class="clearfix">
									<div class="mff-col">
										<label class="check"><input type="checkbox" name="c01"/>{% trans 'специалисты'%}</label>
										<label class="check"><input type="checkbox" name="c02"/>{% trans 'специалисты и потребители' %}</label>
										<label class="check"><input type="checkbox" name="c03"/>{% trans 'широкая публика' %}</label>
									</div>

									<div class="mff-col">
										<select name="period">
											<option value="">{% trans 'Периодичность' %}</option>
											<option value="1">{% trans 'Еженедельно' %}</option>
											<option value="2">{% trans '2 раза в месяц' %}</option>
											<option value="3">{% trans 'Ежемесячно' %}</option>
										</select>
									</div>
								</div>

								<hr/>

							</div>
						</div>

						<div class="mf-line mf-membership">
							<label>{% trans 'Членства и знаки качества' %}:</label>

							<div class="mf-field">

								<label class="check"><input type="checkbox" name="c01"/>{% trans 'Российско-Британская торговая палата' %}</label>
								<label class="check"><input type="checkbox" name="c02"/>{% trans 'Ассоциация Европейского Бизнеса' %}</label>
								<label class="check"><input type="checkbox" name="c03"/>{% trans 'Российский союз выставок и ярмарок' %}</label>
								<label class="check"><input type="checkbox" name="c04"/>{% trans 'Американская торговая	палата' %}</label>
								<label class="check"><input type="checkbox" name="c05"/>{% trans 'UFI' %}</label>

								<hr/>

							</div>
						</div>

						<div class="mf-line mf-prod">
							<div class="mf-field">

								<input type="text" name="pntitle" placeholder="{% trans 'Веб-сайт (необязательно)' %}"/>

								<textarea name="pnprod" cols="30" rows="10"
										  placeholder="{% trans 'Экспонируемые продукты' %}"></textarea>

								<hr/>

							</div>
						</div>

						<div class="mf-line mf-time">
							<label>{% trans 'Время работы' %}:</label>

							<div id="work-time" class="mf-field">
								<div class="w-time">
									<div class="w-time-day">
										<select name="d01">
											<option value="12.04.2014">12.04.2014</option>
										</select>
									</div>

									<div class="w-time-wrap">
										<label>{% trans 'c' %}</label>
										<select name="tFrom01">
											<option value="">{% trans 'чч:мм' %}</option>
											<option value="1">08:00</option>
											<option value="2">09:00</option>
											<option value="3">10:00</option>
											<option value="4">11:00</option>
											<option value="5">12:00</option>
											<option value="6">13:00</option>
											<option value="7">14:00</option>
											<option value="8">15:00</option>
											<option value="9">16:00</option>
											<option value="10">17:00</option>
											<option value="11">18:00</option>
											<option value="12">19:00</option>
											<option value="13">20:00</option>
										</select>
									</div>

									<div class="w-time-wrap">
										<label>{% trans 'до' %}</label>
										<select name="tTo01">
											<option value="">{% trans 'чч:мм' %}</option>
											<option value="1">09:00</option>
											<option value="2">10:00</option>
											<option value="3">11:00</option>
											<option value="4">12:00</option>
											<option value="5">13:00</option>
											<option value="6">14:00</option>
											<option value="7">15:00</option>
											<option value="8">16:00</option>
											<option value="9">17:00</option>
											<option value="10">18:00</option>
											<option value="11">19:00</option>
											<option value="12">20:00</option>
											<option value="13">21:00</option>
										</select>
									</div>

									<label class="check"><input type="checkbox" class="w-time-switcher" name="c05"
																checked/>{% trans 'Один график на все дни' %}</label>
								</div>

							</div>
						</div>

					</div>

					<hr/>

					<div class="mf-line mf-logo">
						<label class="h2">{% trans 'Логотип' %}:</label>

						<div class="mf-field">
							<div class="input-file clearfix">
								<div class="button big icon-clip">{% trans 'выберите файл' %}</div>
								<div class="file-text"
									 data-placeholder="{% trans 'Не выбрано ни одного файла' %}"></div>
								<div class="if-field-wrap"><input type="file" name="avatar"/></div>
							</div>
						</div>
					</div>

					<hr/>

				</div>


				<div class="a-bot-buttons-line clearfix">

					<div class="abb-left">
						<a class="button big icon-save" href="#">{% trans 'сохранить как черновик' %}</a>
					</div>

					<div class="abb-right">
						<a class="button big orange a-more" href="#">{% trans 'далее' %}</a>
					</div>

				</div>

			</form>
		</div>
	</div>

	<div class="set-sect p-form adm-form " id="step-2">
		<div class="set-sect-title clearfix">
			<h3>{% trans 'Шаг 2. Добавление фото' %}</h3>

			<div class="afh-right">
				<div class="sst-info"><b>+ 1,2 балла</b> к рейтингу</div>
			</div>
		</div>
		<div class="form-wrap">

			<form action="#" id="add-photo-form">

				<hr>

				<div class="mf-photos-list">
					<div class="mfpl-button-line">
						<div class="mfpl-button">
							<a class="button big icon-camera" href="#">выберите фотографии</a>
						</div>

						<div class="mfpl-text">
							<p>более полная информация повышает рейтинг вашего мероприятия и позволяет ранжировать его
								выше других</p>
						</div>
					</div>

					<!--<div class="i-wait">
						<hr />
						<img src="img/wait.gif" alt="" /> Подождите, идет загрузка фотографий ...
					</div>


					<ul>

						<li>
							<div class="mfpli-pict"><img src="img/_del-temp/phr-1.jpg" alt="" /></div>
							<div class="mfpli-body">
								<div class="mf-line full-width">
									<div class="mf-field">
										<textarea name="pdescr" cols="30" rows="10" placeholder="Описание"></textarea>
									</div>
								</div>

								<div class="mf-button-line">
									<a class="button red icon-del" href="#">удалить</a>
								</div>
							</div>
						</li>

						<li>
							<div class="mfpli-pict"><img src="img/_del-temp/phr-2.jpg" alt="" /></div>
							<div class="mfpli-body">
								<div class="mf-line full-width">
									<div class="mf-field">
										<textarea name="pdescr" cols="30" rows="10" placeholder="Описание"></textarea>
									</div>
								</div>

								<div class="mf-button-line">
									<a class="button red icon-del" href="#">удалить</a>
								</div>
							</div>
						</li>

					</ul>-->

				</div>

				<hr>

				<div class="a-bot-buttons-line clearfix">

					<div class="abb-left">
						<a class="button big grey a-more" href="#">пропустить этот шаг</a>
					</div>

					<div class="abb-right">
						<a class="button big orange a-more" href="#">далее</a>
					</div>

				</div>

			</form>
		</div>
	</div>

	<div class="set-sect p-form adm-form ">
		<div class="set-sect-title clearfix">
			<h3>{% trans 'Шаг 3. Статистика и условия участия тест' %}</h3>

			<div class="afh-right">
				<div class="sst-info"><b>+ 0,9 баллов</b> к рейтингу</div>
			</div>
		</div>
		<div class="form-wrap">

			<form class="af-statistic" id="statistics-form" action="#">
				<hr>

				<div class="mfs-additional mf-stat">

					<div class="mf-line mf-prod mf-short-input">
						<label>Год основания:</label>

						<div class="mf-field">
							<input type="text" name="fyear" placeholder="">
						</div>
					</div>

					<div class="mf-stat-item">

						<hr>

						<div class="mf-line mf-prod">
							<label class="h3">Статистика за</label>

							<div class="mf-field">

								<div class="mf-year">
									<div class="custom-select">
										<select name="syear01" >
											<option value="">Выберите год</option>
											<option value="2010">2010</option>
											<option value="2011">2011</option>
											<option value="2012">2012</option>
											<option value="2013">2013</option>
											<option value="2014">2014</option>
										</select>


									</div>
								</div>

								<div class="mf-stat-data">

									<div class="sd-visitors">
										<input type="text" name="svisitors" placeholder="Колличество посетителей">
									</div>

									<div class="sd-participants">
										<input type="text" name="sparticipants" placeholder="Колличество участников">
									</div>

									<div class="sd-area">
										<input type="text" name="sarea" placeholder="Площадь">
										м²
									</div>
								</div>

							</div>
						</div>

						<div class="mf-line mf-prod mf-stat-countries">
							<label>Страны:</label>

							<div class="mf-field">

								<div class="c-select-box select">
									<div class="csb-selected-items">
										<div class="csb-selected">
											<div class="csbs-text">Россия</div>
											<a class="csbs-del" href="#">x</a></div>
										<div class="csb-selected">
											<div class="csbs-text">Украина</div>
											<a class="csbs-del" href="#">x</a></div>
										<div class="csb-selected">
											<div class="csbs-text">Беларусь</div>
											<a class="csbs-del" href="#">x</a></div>
										<div class="csb-selected">
											<div class="csbs-text">Бельгия</div>
											<a class="csbs-del" href="#">x</a></div>
										<div class="csb-selected">
											<div class="csbs-text">Германия</div>
											<a class="csbs-del" href="#">x</a></div>
										<div class="csb-selected">
											<div class="csbs-text">Франция</div>
											<a class="csbs-del" href="#">x</a></div>
									</div>
									<div class="csb-menu-wrap" style="">
										<div class="scroll-container csb-menu mCustomScrollbar _mCS_14"
											 style="overflow: hidden;">
											<div class="mCustomScrollBox mCS-light" id="mCSB_14"
												 style="position: relative; height: 100%; overflow: hidden; max-width: 100%; max-height: 230px;">
												<div class="mCSB_container mCS_no_scrollbar"
													 style="position: relative; top: 0px;">
													<div class="scroll-content clearfix">
														<ul>
															<li><label class="custom-radio-check"><span
																	class="custom-checkbox"><input type="checkbox"
																								   name="country"
																								   value="1"></span>Россия</label>
															</li>
															<li><label class="custom-radio-check"><span
																	class="custom-checkbox"><input type="checkbox"
																								   name="country"
																								   value="2"></span>Украина</label>
															</li>
															<li><label class="custom-radio-check"><span
																	class="custom-checkbox"><input type="checkbox"
																								   name="country"
																								   value="3"></span>Беларусь</label>
															</li>
															<li><label class="custom-radio-check"><span
																	class="custom-checkbox"><input type="checkbox"
																								   name="country"
																								   value="4"></span>Бельгия</label>
															</li>
															<li><label class="custom-radio-check"><span
																	class="custom-checkbox"><input type="checkbox"
																								   name="country"
																								   value="5"></span>Германия</label>
															</li>
															<li><label class="custom-radio-check"><span
																	class="custom-checkbox"><input type="checkbox"
																								   name="country"
																								   value="6"></span>Франция</label>
															</li>
														</ul>
													</div>
												</div>
												<div class="mCSB_scrollTools"
													 style="position: absolute; display: none;">
													<div class="mCSB_draggerContainer">
														<div class="mCSB_dragger" style="position: absolute; top: 0px;"
															 oncontextmenu="return false;">
															<div class="mCSB_dragger_bar"
																 style="position:relative;"></div>
														</div>
														<div class="mCSB_draggerRail"></div>
													</div>
												</div>
											</div>
										</div>
									</div>

								</div>

							</div>
						</div>

					</div>

					<div class="mf-stat-add-button">
						<a class="button big icon-add" href="#">добавить данные за другой период</a>
					</div>

				</div>

				<hr>

				<h2>Стоимость посещения и участия</h2>

				<div class="e-price-wrap">
					<div class="epr-layout">

						<div class="eprl-col">
							<div class="eprl-col-wrap">

								<div class="epr-subtitle">Стоимость билетов</div>

								<div class="tp-wrap">

									<ul class="pr-list">

										<li>
											<input type="text" name="oneDay1" placeholder="на один день">

											<div class="custom-select">
												<select name="oneDayCurrency1" >
													<option value="1">руб</option>
													<option value="2">usd</option>
													<option value="3">eur</option>
												</select>


											</div>
										</li>

										<li>
											<input type="text" name="allDays1" placeholder="на все дни">

											<div class="custom-select">
												<select name="allDaysCurrency1" >
													<option value="1">руб</option>
													<option value="2">usd</option>
													<option value="3">eur</option>
												</select>


											</div>
										</li>

									</ul>

									<div class="tp-descr">Предварительная регистрация</div>

								</div>

								<hr>

								<div class="tp-wrap">

									<ul class="pr-list">

										<li>
											<input type="text" name="oneDay2" placeholder="на один день">

											<div class="custom-select">
												<select name="oneDayCurrency2">
													<option value="1">руб</option>
													<option value="2">usd</option>
													<option value="3">eur</option>
												</select>


											</div>
										</li>

										<li>
											<input type="text" name="allDays2" placeholder="на все дни">

											<div class="custom-select">
												<select name="allDaysCurrency2" >
													<option value="1">руб</option>
													<option value="2">usd</option>
													<option value="3">eur</option>
												</select>

											</div>
										</li>

									</ul>

									<div class="tp-descr grey">Регистрация на&nbsp;стойке</div>

								</div>

							</div>

						</div>

						<div class="eprl-col">
							<div class="eprl-col-wrap">

								<div class="epr-subtitle">Стоимость аренды 1м²</div>

								<ul class="pr-list">

									<li>
										<input type="text" name="area1" placeholder="оборудованная площадь">

										<div class="custom-select">
											<select name="areaCurrency1">
												<option value="1">руб</option>
												<option value="2">usd</option>
												<option value="3">eur</option>
											</select>


										</div>
									</li>

									<li>
										<input type="text" name="area2" placeholder="необорудованная площадь">

										<div class="custom-select">
											<select name="areaCurrency2">
												<option value="1">руб</option>
												<option value="2">usd</option>
												<option value="3">eur</option>
											</select>


										</div>
									</li>

									<li>
										<input type="text" name="area3" placeholder="открытая площадь">

										<div class="custom-select">
											<select name="areaCurrency3">
												<option value="1">руб</option>
												<option value="2">usd</option>
												<option value="3">eur</option>
											</select>

										</div>
									</li>

								</ul>

								<hr>

								<div class="mf-line mf-min-area">
									<label>Минимальная площадь:</label>

									<div class="mf-field">
										<input type="text" name="fyear" placeholder="">
										м²
									</div>
								</div>

								<hr>

								<div class="mf-line mf-reg-payment">
									<label>Регистрационный взнос:</label>

									<div class="mf-field">
										<input type="text" name="area3" placeholder="">

										<div class="custom-select">
											<select name="areaCurrency3" >
												<option value="1">руб</option>
												<option value="2">usd</option>
												<option value="3">eur</option>
											</select>

										</div>
									</div>
								</div>

								<hr>

								<div class="mf-line mf-deadline">
									<label>Крайний срок подачи заявки:</label>

									<div class="mf-field">
										<div class="period">
											<div class="pwf-field">
												<!-- todo: поправить верстку чтобы работал календарь-->
												<input type="text" class="date dateFromLast hasDatepicker" name="dateFrom"
													   placeholder="дд.мм.гггг" id="dp1422281596212">
												<button type="button" class="ui-datepicker-trigger">...</button>
											</div>
										</div>
									</div>
								</div>

							</div>
						</div>

					</div>
				</div>

				<hr>

				<div class="a-bot-buttons-line clearfix">

					<div class="abb-left">
						<div class="mfpl-button-line">
							<div class="mfpl-button">
								<a class="button big grey a-more" href="#">пропустить этот шаг</a>
							</div>

							<div class="mfpl-text">
								<p>более полная информация повышает рейтинг вашего мероприятия и позволяет ранжировать
									его выше других</p>
							</div>
						</div>

					</div>

					<div class="abb-right">
						<a class="button big orange a-more" href="#">далее</a>
					</div>

				</div>
			</form>
		</div>

	</div>


	<script src="{% static 'client/js/_modules/page.organizer.add.js' %}"></script>
	<script>
		EXPO.organizer.add.init({
			steps: [
				{
					id: 'summary-form',
					formBodyClass: 'adm-form-body',
					typeClass: 'event-type',
					typeInputName: 'nt',
					dateClasses: ['dateFrom', 'dateTo', 'dateFromLast']
				}
			]
		});
	</script>
	{% endblock %}