var roomsManage = {
	room_data: {},
	room_data_id: 1,
	create: function(replay_data) {

		this.initRoomEvents();

		//

		if (replay_data && Object.keys(replay_data).length) {

			this.replayData(replay_data);

		}

		this.controllerRooms();

	},
	initRoomEvents: function() {

		$("#rooms-list-btn").on('click', function() {

			roomsManage.addRoom();

			return false;

		});

		$("#rooms-list").delegate('.delete-link', 'click', function() {

			var room_id = $(this).closest('.e').attr('data-room-id');

			roomsManage.deleteRoom(room_id);

			return false;

		}).delegate('.input-name', 'keyup', function() {

			var $this = $(this),
					room_id = $this.closest('.e').attr('data-room-id');

			roomsManage.roomDataUpdate(room_id, {
				name: $this.langInputVal()
			});

		}).delegate('.input-desc', 'keyup', function() {

			var $this = $(this),
					room_id = $this.closest('.e').attr('data-room-id');

			roomsManage.roomDataUpdate(room_id, {
				desc: $this.langInputVal()
			});

		}).delegate('.upload-photo-file', 'change', function() {

			var room_id = $(this).closest('.e').attr('data-room-id');

			roomsManage.uploadImage(room_id);

			return false;

		}).delegate('.input-guest', 'change', function() {

			var room_id = $(this).closest('.e').attr('data-room-id');

			roomsManage.roomDataUpdate(room_id, {
				guest: this.value
			});

		}).delegate('.input-currency', 'change', function() {

			var room_id = $(this).closest('.e').attr('data-room-id');

			roomsManage.roomDataUpdate(room_id, {
				currency: this.value
			});

		}).delegate('.input-price', 'keyup', function() {

			var room_id = $(this).closest('.e').attr('data-room-id');

			roomsManage.roomDataUpdate(room_id, {
				price: this.value
			});

		}).delegate('.input-features', 'change', function() {

			var room_id = $(this).closest('.e').attr('data-room-id'),
					this_value = $(this).val();

			roomsManage.roomDataUpdate(room_id, {
				features: this_value
			});

		});

		$("#rooms-list-save").on('click', function() {

			roomsManage.saveData();

			return false;

		});

	},
	//

	saveData: function() {

		var xhr_url = themeOptions.admin_url + 'admin-ajax.php?action=hotel_save_rooms_data';

		var export_data = this.exportData();

		$.ajax({
			type: 'POST',
			url: xhr_url,
			data: {
				saveData: encodeURIComponent(export_data)
			}
		}).done(function() {
			$('.hotel-theme h2 span').show().delay(500).animate({
				'opacity': 0,
			}, 500, function() {
				$(this).hide().css('opacity', 1);
			});
		});

	},
	exportData: function() {

		var room_data = [];

		for (i in this.room_data) {

			room_data.push(this.room_data[i]);

		}

		return JSON.stringify(room_data);

	},
	replayData: function(room_list) {

		for (i in room_list) {

			var e = room_list[i];

			delete e.id;

			//

			var room_id = this.roomDataAdd(e);

			this.addRoomView(room_id);

		}

	},
	//

	addRoom: function() {

		var room_id = this.roomDataAdd();

		this.addRoomView(room_id);


	},
	addRoomView: function(room_id) {

		var room_data = this.roomDataGet(room_id);

		var html = Mustache.render(document.getElementById('template-rooms-e').innerHTML, {
			room_data: room_data,
		});

		$("#rooms-list").append(html);

		//

		var $this = $("#rooms-list > .e:last");

		$this.find("select").dataSelected();

		$this.langInputValSetup();

		$this.find('.input-features').val(room_data['features']);

		//

		this.controllerRooms();

	},
	deleteRoom: function(room_id) {

		this.roomDataRemove(room_id);

		$("#rooms-list > .e[data-room-id=" + room_id + "]").remove();

		this.controllerRooms();

	},
	controllerRooms: function() {

		if (!$("#rooms-list .e").length) {

			$("#rooms-list").html('<div class="alert alert-info">No added rooms.</div>');

		} else if ($("#rooms-list > .alert").length) {

			$("#rooms-list > .alert").remove();

		}

	},
	// UPLOAD IMAGE

	uploadImage: function(room_id) {

		var client = new XMLHttpRequest(),
				file = document.getElementById('room-e-' + room_id + '-upload-image'),
				formData = new FormData(),
				xhr_url = themeOptions.admin_url + 'admin-ajax.php?action=hotel_upload_image';

		//

		formData.append("upload", file.files[0]);

		client.open("post", xhr_url, true);

		// client.setRequestHeader("Content-Type", "multipart/form-data");

		client.send(formData);

		//

		$("#dialog-operator-details-avatar-preview").removeClass('avatar-preview').addClass('avatar-preview-loading').attr('style', '');

		//

		client.onreadystatechange = function() {

			var response = null;

			try {
				response = JSON.parse(client.response)
			} catch (e) {
			}

			if (!response)
				return false;


			//

			if (client.readyState == 4 && client.status == 200) {

				if (response.status && response.value) {

					roomsManage.uploadImageAfter(room_id, response.value);

				}


			}

		};

	},
	uploadImageAfter: function(room_id, upload_data) {

		// console.log('uploadImageAfter', room_id, upload_data);

		$("#room-e-" + room_id + "-image").html(
				'<img src="' + upload_data.fileUrl + '" alt="" />'
				);

		//

		this.roomDataUpdate(room_id, {
			photo: {
				url: upload_data.fileUrl,
				width: null,
				height: null
			}
		});

	},
	// DATA

	roomDataAdd: function(room_data) {

		var room_id = this.room_data_id;

		var room_data_default = {
			id: room_id,
			name: '',
			desc: '',
			photo: null,
			features: '',
			price: '',
			currency: 'EUR',
			guest: '0',
			features: null
		};

		room_data = $.extend(room_data_default, room_data);

		//

		this.room_data[room_id] = room_data;

		//

		this.room_data_id++;

		return room_id;

	},
	roomDataRemove: function(room_id) {

		if (!this.room_data[room_id])
			return false;

		delete this.room_data[room_id];

		return true;

	},
	roomDataUpdate: function(room_id, update_data) {

		if (!this.room_data[room_id])
			return false;

		this.room_data[room_id] = $.extend(this.room_data[room_id], update_data);

		return room_id;

	},
	roomDataGet: function(room_id) {

		if (!this.room_data[room_id])
			return false;

		return this.room_data[room_id];

	},
};