<link rel="stylesheet" href="{{ IncludeAsset('assets/lib/jquery-file-upload/css/jquery.fileupload.css') }}">

<!-- form section -->
<div class="row">
	<div class="col-lg-1">
		&nbsp;
	</div>
	<div class="col-lg-10">

		<div class="box dark">
			<header>
				<h5>
					{{ @lang_banner_ad_urls }} <small>| {{ @lang_image_banner_urls }}</small>
				</h5>
				<!-- .toolbar -->
				<div class="toolbar">
					<ul class="nav">
						<li>
							<a class="minimize-box" data-toggle="collapse" href="#div-5">
								<i class="fa fa-chevron-up"></i>
							</a>
						</li>
					</ul>
				</div>
				<!-- /.toolbar -->
			</header>

			<div id="div-5" class="accordion-body collapse in body">		
				<div class="form-group">
					<label for="src_lg" class="tips control-label col-lg-3"
					       title="{{ @lang_url_pointing_to_the_large_banner_image__jpg__gif__png__that_will_be_displayed_to_larger_screens__tablets__desktops_ }}.">{{ @lang_large_banner_url }}</label>

					<div class="col-lg-8">
						<div class="input-group">
							<input class="form-control" type="url" placeholder="http://" id="src_lg" name="src_lg" value="{{ @ad->type_banner->src_lg }}"/>
							<span class="input-group-btn">

						    <span class="btn btn-sm btn-success fileinput-button">
						        <i class="glyphicon glyphicon-plus"></i> {{ @lang_upload }}
						        <!-- The file input field used as target for the file upload widget -->
						        <input id="fileupload_lg" type="file" name="files_lg[]">
						    </span>

							</span>&nbsp;
							<span class="input-group-btn">

						    <span class="btn btn-sm btn-metis-6 btn-gallery" data-size="src_lg">
						        <i class="glyphicon glyphicon-plus"></i> {{ @lang_gallery }}
						    </span>

							</span>
						</div>
						<div id="progress_lg" class="progress">
							<div class="progress-bar progress-bar-success"></div>
						</div>
						<!-- The container for the uploaded files -->
						<div id="files_lg" class="files">
						<button data-src="src_lg" type="button" data-content="" data-toggle="popover" class="btn btn-sm btn-metis-2 preview">{{ @lang_preview }}</button><div data-src="src_lg" class="modal fade text-center" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div></div>
					</div>
				</div>
				<!-- /.form-group -->
				<div class="form-group">
					<label for="src_sm" class="tips control-label col-lg-3"
					       title="{{ @lang_url_pointing_to_the_small_banner_image__jpg__gif__png__that_will_be_displayed_to_smaller_screens__smartphones_ }}. {{ @lang_if_not_used__the_large_banner_will_be_displayed_to_all_devices }}.">{{ @lang_small_banner_url }}</label>

					<div class="col-lg-8">
						<div class="input-group">
							<input class="form-control" type="url" placeholder="http://" id="src_sm" name="src_sm" value="{{ @ad->type_banner->src_sm }}"/>
							<span class="input-group-btn">

						    <span class="btn btn-sm btn-success fileinput-button">
						        <i class="glyphicon glyphicon-plus"></i> {{ @lang_upload }}
						        <!-- The file input field used as target for the file upload widget -->
						        <input id="fileupload_sm" type="file" name="files_sm[]">
						    </span>

							</span>&nbsp;
							<span class="input-group-btn">

						    <span class="btn btn-sm btn-metis-6 btn-gallery" data-size="src_sm">
						        <i class="glyphicon glyphicon-plus"></i> {{ @lang_gallery }}
						    </span>

							</span>
						</div>
						<div id="progress_sm" class="progress">
							<div class="progress-bar progress-bar-success"></div>
						</div>
						<!-- The container for the uploaded files -->
						<div id="files_sm" class="files">
						<button data-src="src_sm" type="button" data-content="" data-toggle="popover" class="btn btn-sm btn-metis-2 preview">{{ @lang_preview }}</button><div data-src="src_sm" class="modal fade text-center" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div></div>
					</div>
				</div>
				<!-- /.form-group -->
				<input type="hidden" id="modal_select" value=""/>
				<input type="hidden" id="modal_size" value=""/>
				<span class="text-danger" id="uploaderror"/></span>
			</div>
		</div>
	</div>
</div>
<!-- /form section -->

<!-- form section -->
<div class="row">
	<div class="col-lg-1">
		&nbsp;
	</div>
	<div class="col-lg-10">

		<div class="box dark">
			<header>
				<h5>
					{{ @lang_banner_ad_settings }} <small>| {{ @lang_image_banner_ad_settings }}</small>
				</h5>
				<!-- .toolbar -->
				<div class="toolbar">
					<ul class="nav">
						<li>
							<a class="minimize-box" data-toggle="collapse" href="#div-6">
								<i class="fa fa-chevron-up"></i>
							</a>
						</li>
					</ul>
				</div>
				<!-- /.toolbar -->
			</header>

			<div id="div-6" class="accordion-body collapse in body">

				<div class="form-group">
					<label for="url" class="tips control-label col-lg-3" title="{{ @lang_url_image_will_link_to }}.">{{ @lang_link_url }}</label>
					<div class="col-lg-8">
						<input class="form-control" placeholder="http://" type="url" id="url" name="url" value="{{ @ad->type_banner->url }}" maxlength="256" />
					</div>
				</div><!-- /.form-group -->
				<div class="form-group">
					<label for="alt" class="tips control-label col-lg-3" title="{{ @lang_text_for_the_image_alt_tag }}.">{{ @lang_banner_alt_text }}</label>
					<div class="col-lg-8">
						<input class="form-control" type="text" id="alt" name="alt" value="{{ @ad->type_banner->alt }}" maxlength="256" />
					</div>
				</div><!-- /.form-group -->
				<div class="form-group">
				<label for="caption_top" class="tips control-label col-lg-3" title="{{ @lang_text_to_display_around_the_image__may_contain_html_ }}.">{{ @lang_caption_top }}</label>
				<div class="col-lg-8">
					<input class="form-control" type="text" id="caption_top" name="caption_top" value="{{ @ad->type_banner->caption_top }}" maxlength="256" />
				</div>
			</div><!-- /.form-group -->
				<div class="form-group">
					<label for="caption_bottom" class="tips control-label col-lg-3" title="{{ @lang_text_to_display_around_the_image__may_contain_html_ }}.">{{ @lang_caption_bottom }}</label>
					<div class="col-lg-8">
						<input class="form-control" type="text" id="caption_bottom" name="caption_bottom" value="{{ @ad->type_banner->caption_bottom }}" maxlength="256" />
					</div>
				</div><!-- /.form-group -->
				<div class="form-group">
					<label for="caption_left" class="tips control-label col-lg-3" title="{{ @lang_text_to_display_around_the_image__may_contain_html_ }}.">{{ @lang_caption_left }}</label>
					<div class="col-lg-8">
						<input class="form-control" type="text" id="caption_left" name="caption_left" value="{{ @ad->type_banner->caption_left }}" maxlength="256" />
					</div>
				</div><!-- /.form-group -->
				<div class="form-group">
					<label for="caption_right" class="tips control-label col-lg-3" title="{{ @lang_text_to_display_around_the_image__may_contain_html_ }}.">{{ @lang_caption_right }}</label>
					<div class="col-lg-8">
						<input class="form-control" type="text" id="caption_right" name="caption_right" value="{{ @ad->type_banner->caption_right }}" maxlength="256" />
					</div>
				</div><!-- /.form-group -->
				<div class="form-group">
					<label for="css_class" class="tips control-label col-lg-3" title="{{ @lang_css_class_to_assign_to_the_image }}.">{{ @lang_css_class }}</label>
					<div class="col-lg-8">
						<input class="form-control" type="text" id="css_class" name="css_class" value="{{ @ad->type_banner->css_class }}" maxlength="256" />
					</div>
				</div><!-- /.form-group -->

			</div>
		</div>
	</div>
</div>
<!-- /form section -->


<!-- Modal -->
<div class="modal fade" id="galleryModal" tabindex="-1" role="dialog" aria-labelledby="GalleryModal" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">{{ @lang_gallery }}</h4>
			</div>
			<div id="galleryModalBody" class="modal-body">
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">{{ @lang_close }}</button>
			</div>
		</div>
	</div>
</div>

<script src="{{ IncludeAsset('assets/lib/jquery-file-upload/js/vendor/jquery.ui.widget.js') }}"></script>
<script src="{{ IncludeAsset('assets/lib/jquery-file-upload/js/jquery.fileupload.js') }}"></script>
<script src="{{ IncludeAsset('assets/lib/jquery-file-upload/js/jquery.fileupload-process.js') }}"></script>
<script src="{{ IncludeAsset('assets/lib/jquery-file-upload/js/jquery.fileupload-validate.js') }}"></script>

<script>var preview = '{{ @lang_preview }}';</script>
<script>var ad_id = {{ (empty(@ad->id)) ? 0 : @ad->id }};</script>
<script src="{{ IncludeAsset('assets/js/ads-edit-type-banner.js') }}"></script>
