{header}

<script type="text/javascript" src="{url_tmpl_administration}js/jquery.validate.js{cache_version_param}"></script>
<script type="text/javascript" src="{url_tmpl_administration}js/jquery.timeentry.js{cache_version_param}"></script>
<script type="text/javascript" src="{url_main}_server/jquery/jquery.location.js{cache_version_param}"></script>

<div class="content-header row">
	<div class="content-header-left col-md-4 col-12 mb-2">
		<h3 class="content-header-title">{l_title_current}</h3>
	</div>
	<div class="content-header-right col-md-8 col-12">
		<div class="breadcrumbs-top float-md-right">
			<div class="breadcrumb-wrapper mr-1">
				<ol class="breadcrumb">
					<li class="breadcrumb-item">
						<a href="{url_main}administration/events_events.php">{l_menu_events}</a>
					</li>
					<li class="breadcrumb-item active">
						{l_title_current}
					</li>
				</ol>
			</div>
		</div>
	</div>
</div>

{menu_page}

<div class="alert alert-success border-0 alert-dismissible mb-2-1" role="alert">{l_changes_save}</div>
<div class="alert alert-danger alert-dismissible mb-2-1" role="alert">{l_changes_delete}</div>

<div class="content-body">
	<div class="row">
		<div class="col-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">{l_title_current} {blogger_name}</h4>
                    <a class="heading-elements-toggle"><i class="la la-ellipsis-v font-medium-3"></i></a>
                    <div class="heading-elements">
                        <ul class="list-inline mb-0">
                            <li><a data-action="collapse"><i class="ft-minus"></i></a></li>
                        </ul>
                    </div>
				</div>
				<div class="card-content collapse show">
					<div class="card-body">
						<h5>
							{event_title}
						</h5>
						<hr class="mb-2">
						<form method="POST" id="event_edit_form" action="{url_main}administration/events_event_edit.php?cmd=update&event_id={event_id}">

							<fieldset class="form-group">
								<label>{l_event_title}:</label>
								<input type="text" name="event_title" value="{event_title}" class="form-control" >
							</fieldset>
							<fieldset class="form-group">
								<label>{l_event_description}:</label>
								<textarea name="event_description" id="event_description" class="form-control h_200 mt-1">{event_description}</textarea>
							</fieldset>

							<div class="row">
								<fieldset class="form-group col-md-6">
									<label>{l_event_date}:</label>
									<input type="text" class="form-control" id="event_date" name="event_date" value="{event_date}">
								</fieldset>
								<fieldset class="form-group col-md-6">
									<label>{l_event_time}:</label>
									<input  id="event_time" name="event_time" type="text" value="{event_time}" class="form-control"/>
								</fieldset>
							</div>

							<!-- begin_event_private_off -->
							<fieldset class="form-group">
								<label>{l_country}:</label>
								<select  class="form-control" name="country" id="country">
								{country_options}
								</select>
							</fieldset>
							<div class="row">
								<fieldset class="form-group col-md-6">
									<label>{l_state}:</label>
									<select class="form-control" name="state" id="state">
										<option value="-1">- {l_state_province} -</option>
										{state_options}
									</select>
								</fieldset>
								<fieldset class="form-group col-md-6">
									<label>{l_city}:</label>
									<select class="form-control" name="city" id="city">
										<option value="-1">- {l_city} -</option>
										{city_options}
									</select>
								</fieldset>
							</div>

							<div class="row">
								<fieldset class="form-group col-md-6">
									<label>{l_category}:</label>
									<select name="category" class="form-control">
									{category_options}
									</select>
								</fieldset>
								<fieldset class="form-group col-md-6">
									<label>{l_event_address}:</label>
									<input class="form-control" type="text" name="event_address" value="{event_address}">
								</fieldset>
							</div>

							<div class="row">
								<fieldset class="form-group col-md-6">
									<label>{l_event_place}:</label>
									<input class="form-control" type="text" name="event_place" value="{event_place}">
								</fieldset>
								<fieldset class="form-group col-md-6">
									<label>{l_event_site}:</label>
									<input  class="form-control" type="text" name="event_site" value="{event_site}">
								</fieldset>
							</div>

							<fieldset class="form-group">
								<label>{l_event_phone}:</label>
								<input class="form-control" type="text" name="event_phone" value="{event_phone}">
							</fieldset>

							<!-- begin_photo_edit -->
							<h5 class="mt-3">{l_edit_photos}</h5>
							<hr>

							<fieldset class="form-group">
								<!-- begin_photo-->
								<div class="image_list_pl" style="width:85px;" id="event_img_bl_{image_id}">
									<a id="event_img_{image_id}_lb" class="edit_image_gallery" href="{image_file}">
										<img id="group_img_{image_id}" width="85" height="64" src="{image_thumbnail}">
									</a>
									<p class="no_gallery">
										<a onClick="return edit_delete_image({image_id});">{l_delete}</a>
									</p>
								</div>
								<!-- begin_photo_odd-->
								<!-- end_photo_odd-->
								<!-- begin_photo_even-->
								<!-- end_photo_even-->
								<!-- end_photo-->
							</fieldset>

							<!-- begin_no_photos -->
							<div class="alert alert-light mb-2 alert-info-1" role="alert">
                            {l_no_photo}
							</div>
							<!-- end_no_photos -->
							<!-- end_photo_edit -->

							<fieldset class="form-group">
								<div class="wrap_button">
									<button class="btn btn-primary btn_submit" type="submit">{l_save}</button>
									<div class="button_submit_instruction">{l_or_use_ctrl_s}</div>
								</div>
							</fieldset>
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<script>
$('#country').location({first_option_state: '- {j_state_province} -', first_option_city: '- {j_city} -', location: 'users_edit.php'});
$('#state').location({method: 'cities', first_option_city: '- {j_city} -', location: 'users_edit.php'});

function edit_delete_image(image_id){
	confirmCustom('{j_are_you_sure}',function(){
		$('#event_img_bl_' + image_id).animate({
			width: 0, marginRight:0}, 300, function() {
			$('#event_img_bl_' + image_id).remove();
			$.ajax({
				type: 'POST',
				url: '{url_main}administration/events_event_image_delete_ajax.php',
				data: {
					image_id: image_id
				}
			})
		})
	})
}

$(function(){
	$("#event_date").daterangepicker({
        singleDatePicker: true,
        showDropdowns: true,
		locale: {
            format: 'MM/DD/YYYY'
        }
    })
	$("#event_time").timeEntry({show24Hours: true, spinnerImage: ''});

    $("#event_edit_form").validate({
        rules: {
            event_title: "required",
            event_description: "required",
            event_date: "required",
            event_time: "required",
        },
        messages: {
        	event_title: "{j_please_specify_title}",
                event_date: "{j_please_specify_date}",
                event_time: "{j_please_specify_time}",
        	event_description: "{j_please_enter_text}",
        }
    })
})

_initLightbox();
</script>

{footer}