{% extends '@layout/_layout.twig' %}
{% block title %}
    {{ 'BDSM.fm - View club'|trans }}
{% endblock %}
{% block content %}
<!-- BEGIN typical-view -->
<div class='typical-view typical-view--studios'>
	<header class="typical-view__header">
		<div class="typical-view__title">
			<h1>Клуб</h1>
		</div>
		<div class="typical-view__tabs">
			<ul class="tabs-list">
				<li class="tabs-list-item {#{% if path()==path('poster/list') %}active{% endif %}#}">
					<a href="#{#{{ path('poster/list') }}#}" class="tabs-list-item-link">
						<span class="tabs-list-item-inner">Афиша <span class="count">160</span></span>
					</a>
				</li>
				<li class="tabs-list-item {#{% if path()==path('studio/list') %} active{% endif %}#}">
					<a href="#{#{{ path('studio/list') }}#}" class="tabs-list-item-link">
						<span class="tabs-list-item-inner">Студии <span class="count">160</span></span>
					</a>
				</li>
			</ul>
		</div>
		<div class="typical-view__search" style="background: transparent url('/img/bdsm-studios-search-bg.jpg') center no-repeat/cover">
			<input type="text" class="typical-search typical-search--studios js-search-studios"
								placeholder="{{ 'Search for text or title'|trans }}">
		</div>
		<div class="typical-view__sort custom-sort">
			<div class="custom-sort__item form-label custom-sort--input js-sort-studios">
				<select name="filterDiaries" class="form-select">
						<option value="0" selected="selected">По городу</option>
						<option value="1">Россия, Москва</option>
						<option value="2">Россия, СПБ</option>
				</select>
			</div>
			<div class="custom-sort__item form-label custom-sort--select js-sort-studios">
				<select name="filterDiaries" class="form-select">
						<option value="0" selected="selected">{{ 'By date'|trans }}</option>
						<option value="1">{{ 'Popularity'|trans }}</option>
						<option value="2">{{ 'By views'|trans }}</option>
				</select>
			</div>
			{% if not isguest() %}
			<a href="#" class="btn btn--black {#js-get-owner-status#} btn-owner-status js-modal-call"
				data-modal-id="owner_status-modal"
				data-default-text="Получить статус владельца"
				data-success-text="Ваша заявка на рассмотрении">
				Получить статус владельца
			</a>
			{% endif %}
		</div>
	</header>
	<!-- BEGIN body -->
	<div class="typical-view__body club">
		<div class="club-item">
			<div class="club-item-wrapper">
				<div class="club-item__picture">
					<a href="#" class="club-item-link club-item__image" style="background: transparent url('/img/studios-placeholder-little.svg') center no-repeat"></a>
				</div>
				<div class="club-item__info">
					<span class="club-item__city">Россия, Санкт-Петербург</span>
					<a href="#" class="club-item__title">
						<h3>Студия «Студия»</h3>
						<div class="club-item__comment club-comment">
							<span class="club-comment__wrapper">
								Мы рады приветствовать Вас на наших вечерах в клубе Эдем Lesandra Lesandra ниже есть ссылка на анкету и способы связи. 
								Так же можете обратится по поводу записи и всех вопросов к Ветер Ветер. Мы рады приветствовать Вас на наших вечерах в клубе Эдем Lesandra Lesandra ниже есть ссылка на анкету и способы связи. 
							</span>
						</div>
					</a>
					<div class="blogs-list-elem-tags">
						<a class="blogs-tags-elem" href="#">
							nesciunt modi iure.
						</a>
						<a class="blogs-tags-elem" href="#">
							et quaerat ipsum.
						</a>
					</div>
				</div>
			</div>
		</div>
		<div class="club-item">
			<div class="club-item-wrapper">
				<div class="club-item__picture">
					<a href="#" class="club-item-link club-item__image" style="background: transparent url('/img/studios-placeholder-little.svg') center no-repeat"></a>
				</div>
				<div class="club-item__info">
					<span class="club-item__city">Россия, Санкт-Петербург</span>
					<a href="#" class="club-item__title">
						<h3>Студия «Студия»</h3>
						<div class="club-item__comment club-comment">
							<span class="club-comment__wrapper">
								Мы рады приветствовать Вас на наших вечерах в клубе Эдем Lesandra Lesandra ниже есть ссылка на анкету и способы связи. 
								Так же можете обратится по поводу записи и всех вопросов к Ветер Ветер. Мы рады приветствовать Вас на наших вечерах в клубе Эдем Lesandra Lesandra ниже есть ссылка на анкету и способы связи. 
							</span>
						</div>
					</a>
					<div class="blogs-list-elem-tags">
						<a class="blogs-tags-elem" href="#">
							nesciunt modi iure.
						</a>
						<a class="blogs-tags-elem" href="#">
							et quaerat ipsum.
						</a>
					</div>
				</div>
			</div>
		</div>
		<div class="club-item">
			<div class="club-item-wrapper">
				<div class="club-item__picture">
					<a href="#" class="club-item-link club-item__image" style="background: transparent url('/img/studios-placeholder-little.svg') center no-repeat"></a>
				</div>
				<div class="club-item__info">
					<span class="club-item__city">Россия, Санкт-Петербург</span>
					<a href="#" class="club-item__title">
						<h3>Студия «Студия»</h3>
						<div class="club-item__comment club-comment">
							<span class="club-comment__wrapper">
								Мы рады приветствовать Вас на наших вечерах в клубе Эдем Lesandra Lesandra ниже есть ссылка на анкету и способы связи. 
								Так же можете обратится по поводу записи и всех вопросов к Ветер Ветер. Мы рады приветствовать Вас на наших вечерах в клубе Эдем Lesandra Lesandra ниже есть ссылка на анкету и способы связи. 
							</span>
						</div>
					</a>
					<div class="blogs-list-elem-tags">
						<a class="blogs-tags-elem" href="#">
							nesciunt modi iure.
						</a>
						<a class="blogs-tags-elem" href="#">
							et quaerat ipsum.
						</a>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- END body -->
</div>
<!-- END typical-view -->

<div class="bdsm-modal" id="owner_status-modal">
	<span class="modal-close">Закрыть</span>
	<div class="bdsm-modal__body">
		<h3 class="bdsm-modal__title">Заявка на статус владельца студии</h3>
		<h5 class="bdsm-modal__subtitle centered">Модерация заявок в течении 24 часов. После одобрения <br> вы получите возможность добавлять студии</h5>

		<form class="formAuth-form" autocomplete="off">
			<input type="text" style="display:none;">
			<input type="text" style="display:none;">
			<input type="text" style="display:none;">
			<input type="email" style="display:none;">
			<textarea style="display:none;"></textarea>

			<div class="bdsm-modal__wrapper">
				<label class="form-label">
					<span class="form-label-name">Настоящее полное имя</span>
					<input type="text" name="owner[name]" class="form-input formAuth-input" autocomplete="off">
				</label>
				<label class="form-label">
					<span class="form-label-name">Название студии</span>
					<input type="text" name="owner[studioname]" class="form-input formAuth-input" autocomplete="off">
				</label>
				<div class="form-label js-owner-city">
					<span class="form-label-name">Страна и город</span>
					<select name="owner[city]" class="form-select">
							<option value="0" selected="selected">Не выбрано</option>
							<option value="1">Россия, Москва</option>
							<option value="2">Россия, СПБ</option>
					</select>
				</div>
				<div class="form-label js-owner-city">
					<span class="form-label-name">Точный адрес</span>
					<select name="owner[address]" class="form-select">
							<option value="0" selected="selected">Не выбрано</option>
							<option value="1">ул. АААА</option>
							<option value="2">ул. ББББ</option>
					</select>
				</div>
				<label class="form-label">
					<span class="form-label-name">Точный адрес</span>
					<input type="text" name="owner[address]" class="form-input formAuth-input" autocomplete="off">
				</label>
				<label class="form-label" for="writeUs[Text]">
					<span class="form-label-name">Краткое описание. Ссылки на группы в соцсетях, сайт, если есть</span>
					<textarea name="owner[description]" autocomplete="off"></textarea>
				</label>
			</div>
			<a href="#" class="button button--lg js-owner_status-send">
				<span class="button-inner">Отправить заявку</span>
			</a>
		</form>
	</div>
</div>

<div class="bdsm-modal" id="owner_status_sended-modal">
	<span class="modal-close">Закрыть</span>
	<div class="bdsm-modal__body centered">
		<h3 class="bdsm-modal__title">Заявка отправлена</h3>
		<h5 class="bdsm-modal__subtitle">Модерация заявок в течении 24 часов. После одобрения <br> вы получите возможность добавлять студии</h5>
	</div>
</div>
{% endblock %}