'use strict';


define('admin/extend/rewards', [
	'alerts',
	'jquery-ui/widgets/sortable',
], function (alerts) {
	const rewards = {};

	let available;
	let active;
	let conditions;
	let conditionals;

	rewards.init = function () {
		available = ajaxify.data.rewards;
		active = ajaxify.data.active;
		conditions = ajaxify.data.conditions;
		conditionals = ajaxify.data.conditionals;

		$('[data-selected]').each(function () {
			select($(this));
		});

		$('#active')
			.on('change', '[data-selected]', function () {
				update($(this));
			})
			.on('click', '.delete', function () {
				const parent = $(this).parents('[data-id]');
				const id = parent.attr('data-id');

				socket.emit('admin.rewards.delete', { id: id }, function (err) {
					if (err) {
						alerts.error(err);
					} else {
						alerts.success('[[admin/extend/rewards:alert.delete-success]]');
					}
				});

				parent.remove();
				return false;
			})
			.on('click', '.toggle', function () {
				const btn = $(this);
				btn.parent().find('.toggle').removeClass('hidden');
				btn.addClass('hidden');
				// send disable api call
				return false;
			})
			.sortable({
				handle: '[component="sort/handle"]',
				axis: 'y',
				zIndex: 9999,
			});

		$('#new').on('click', newReward);
		$('#save').on('click', saveRewards);

		populateInputs();
	};

	function select(el) {
		el.val(el.attr('data-selected'));
		switch (el.attr('name')) {
			case 'rid':
				selectReward(el);
				break;
		}
	}

	function update(el) {
		el.attr('data-selected', el.val());
		switch (el.attr('name')) {
			case 'rid':
				selectReward(el);
				break;
		}
	}

	function selectReward(el) {
		const parent = el.parents('[data-rid]');
		const div = parent.find('.inputs');
		let inputs;
		let html = '';

		for (const reward in available) {
			if (available.hasOwnProperty(reward)) {
				if (available[reward].rid === el.attr('data-selected')) {
					inputs = available[reward].inputs;
					parent.attr('data-rid', available[reward].rid);
					break;
				}
			}
		}

		if (!inputs) {
			return alerts.error('[[admin/extend/rewards:alert.no-inputs-found]] ' + el.attr('data-selected'));
		}

		inputs.forEach(function (input) {
			html += `<label class="form-label text-nowrap" for="${input.name}">${input.label}<br />`;
			switch (input.type) {
				case 'select':
					html += `<select class="form-select form-select-sm" name="${input.name}" >`;
					input.values.forEach(function (value) {
						html += `<option value="${value.value}">${value.name}</option>`;
					});
					break;
				case 'text':
					html += `<input type="text" class="form-control form-control-sm" name="${input.name}"  />`;
					break;
			}
			html += '</label>';
		});

		div.html(html);
	}

	function populateInputs() {
		$('[data-rid]').each(function (i) {
			const div = $(this).find('.inputs');
			const rewards = active[i].rewards;

			for (const reward in rewards) {
				if (rewards.hasOwnProperty(reward)) {
					div.find('[name="' + reward + '"]').val(rewards[reward]);
				}
			}
		});
	}

	function newReward() {
		const ul = $('#active');

		const data = {
			active: [{
				disabled: true,
				value: '',
				claimable: 1,
				rid: null,
				id: null,
			}],
			conditions: conditions,
			conditionals: conditionals,
			rewards: available,
		};

		app.parseAndTranslate('admin/extend/rewards', 'active', data, function (li) {
			ul.append(li);
			li.find('select').val('');
		});
	}

	function saveRewards() {
		const activeRewards = [];

		$('#active li').each(function () {
			const data = { rewards: {} };
			const main = $(this).find('form.main').serializeArray();
			const rewards = $(this).find('form.rewards').serializeArray();

			main.forEach(function (obj) {
				data[obj.name] = obj.value;
			});

			rewards.forEach(function (obj) {
				data.rewards[obj.name] = obj.value;
			});

			data.id = $(this).attr('data-id');
			data.disabled = $(this).find('.toggle.disable').hasClass('hidden');

			activeRewards.push(data);
		});

		socket.emit('admin.rewards.save', activeRewards, function (err, result) {
			if (err) {
				return alerts.error(err);
			}

			const saveBtn = document.getElementById('save');
			saveBtn.classList.toggle('saved', true);
			setTimeout(() => {
				saveBtn.classList.toggle('saved', false);
			}, 5000);

			// newly added rewards are missing data-id, update to prevent rewards getting duplicated
			$('#active li').each(function (index) {
				if (!$(this).attr('data-id')) {
					$(this).attr('data-id', result[index].id);
				}
			});
		});
	}

	return rewards;
});
