{header}

<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/flashchat_rooms.php">{l_menu_flashchat_rooms}</a>
					</li>
					<li class="breadcrumb-item active">
						{l_title_current}
					</li>
				</ol>
			</div>
		</div>
	</div>
</div>

{menu_page}

<div class="content-body">

	<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">{error}</div>

	<div class="row">
		<div class="col-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">
						<!-- begin_add_rooms_title -->{l_title_current}<!-- end_add_rooms_title -->
						<!-- begin_edit_rooms_title -->{l_editing_room}<!-- end_edit_rooms_title -->
					</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">
						<!-- begin_edit_rooms_title_name -->
						<h5>{name}</h5>
						<hr>
						<!-- end_edit_rooms_title_name -->


						<form id="form" action="{url_page}" enctype="multipart/form-data" method="POST">
							<!-- begin_edit_form -->
							<input type="hidden" name="cmd" value="edit">
							<input type="hidden" name="id" value="{id}">
							<!-- end_edit_form -->

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

							<!-- begin_add_form -->
							<input type="hidden" name="cmd" value="add">
							<fieldset class="form-group">
								<label>{l_background_room}:</label>
								<input type="file" name="bg"/>
							</fieldset>
							<!-- end_add_form -->

							<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>


						<!-- begin_upload_rooms_bg -->
						<form id="bg_form" action="{url_page}" method="POST" enctype="multipart/form-data">
							<input type="hidden" name="cmd" value="update_bg">
							<input type="hidden" name="id" value="{id}">

							<fieldset class="form-group">
							<div id="bg_output" class="block_logo room_logo bl_room">
								<img id="bg_output_img" src="{url_files}3dchat/{id}.jpg?rand={rand}" alt=""/>
							</div>
							</fieldset>
							<fieldset class="form-group">
								<input class="upload" type="file" name="bg"/>
							</fieldset>
							<fieldset class="form-group">
								<div class="wrap_button">
									<button id="bg_form_btn" class="btn btn-primary btn_submit" type="submit"><span>{l_upload}</span></button>
								</div>
							</fieldset>
						</form>
						<!-- end_upload_rooms_bg -->


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

<!-- begin_upload_rooms_bg_js -->
<script>
$(function() {
    $('#bg_form').ajaxForm({
            beforeSubmit: function(a,f,o) {
                $('#bg_form_btn').addChildrenLoader();
            },
            success: function(data) {
                var obj = jQuery.parseJSON(data),
                    url = '{url_files}3dchat/{id}.jpg';
                if (typeof obj.url != 'undefined') {
                    url = obj.url;
                }
                $('#bg_output').html('<img src="'+url+'?' + Math.random() + '" alt=""/>');
                if (obj.status == 0) {
                    alertCustom(obj.msg);
                }
				$('#bg_form_btn').removeChildrenLoader();
            }
	})
})
</script>
<!-- end_upload_rooms_bg_js -->

{footer}