<?php
/**
 * @package     VikRentItems
 * @subpackage  com_vikrentitems
 * @author      Alessio Gaggii - e4j - Extensionsforjoomla.com
 * @copyright   Copyright (C) 2022 e4j - Extensionsforjoomla.com. All rights reserved.
 * @license     GNU General Public License version 2 or later; see LICENSE
 * @link        https://vikwp.com
 */

defined('ABSPATH') or die('No script kiddies please!');

$dbo = JFactory::getDbo();
$app = JFactory::getApplication();
$vri_app = VikRentItems::getVriApplication();

$document = JFactory::getDocument();
$document->addStyleSheet(VRI_SITE_URI.'resources/jquery.fancybox.css');
$document->addStyleSheet(VRI_ADMIN_URI.'resources/js_upload/colorpicker.css');
JHtml::fetch('script', VRI_SITE_URI.'resources/jquery.fancybox.js');
JHtml::fetch('script', VRI_ADMIN_URI.'resources/js_upload/colorpicker.js');
JHtml::fetch('script', VRI_ADMIN_URI.'resources/js_upload/eye.js');
JHtml::fetch('script', VRI_ADMIN_URI.'resources/js_upload/utils.js');

VikRentItems::getConditionalRulesInstance(true);
$tpl_names = VikRentItemsHelperConditionalRules::getTemplateFilesNames();
$tpl_contents = VikRentItemsHelperConditionalRules::getTemplateFilesContents();

$lim = $app->getUserStateFromRequest("com_vikrentitems.limit", 'limit', $app->get('list_limit'), 'int');
$lim0 = VikRequest::getVar('limitstart', 0, '', 'int');

// load lang vars for JS
JText::script('VRIDELCONFIRM');
JText::script('VRCONFIGEDITTMPLFILE');
JText::script('VRI_CONDTEXT_TAG_ADD_HELP');
JText::script('VRI_CONDTEXT_TAG_RM_HELP');
JText::script('VRI_CSS_EDITING_HELP');
JText::script('VRI_INSPECTOR_START');
JText::script('VRI_EDITTPL_FATALERROR');

$rows = array();
$navbut = "";

$q = "SELECT SQL_CALC_FOUND_ROWS * FROM `#__vikrentitems_condtexts` ORDER BY `#__vikrentitems_condtexts`.`lastupd` DESC";
$dbo->setQuery($q, $lim0, $lim);
$dbo->execute();
if ($dbo->getNumRows() > 0) {
	$rows = $dbo->loadAssocList();
	$dbo->setQuery('SELECT FOUND_ROWS();');
	jimport('joomla.html.pagination');
	$pageNav = new JPagination($dbo->loadResult(), $lim0, $lim);
	$navbut = "<table align=\"center\"><tr><td>".$pageNav->getPagesLinks()."</td></tr></table>";
}

?>
<div class="vri-config-maintab-top">
	<fieldset class="adminform vri-config-fieldset-large">
		<div class="vri-params-wrap">
			<legend class="adminlegend"><?php echo JText::translate('VRI_COND_TEXT_RULES'); ?></legend>
			<div class="vri-params-container">
				<div class="vri-param-container">
					<div class="vri-param-setting">
						<a href="index.php?option=com_vikrentitems&task=newcondtext" class="btn vri-config-btn"><?php VikRentItemsIcons::e('plus-circle'); ?> <?php echo JText::translate('VRI_NEW_COND_TEXT'); ?></a>
					</div>
				</div>
				<div class="vri-param-container">
					<div class="vri-param-setting">
						<div class="table-responsive vri-list-table-rounded">
							<table cellpadding="4" cellspacing="0" border="0" width="100%" class="table table-striped vri-list-table">
								<thead>
									<tr>
										<th class="title left" width="200"><?php echo JText::translate('VRI_CONDTEXT_NAME'); ?></th>
										<th class="title left" width="200"><?php echo JText::translate('VRI_CONDTEXT_TKN'); ?></th>
										<th class="title center" width="100"><?php echo JText::translate('VRI_WIDGETS_LASTUPD'); ?></th>
										<th class="title center" width="300"><?php echo JText::translate('VRI_TEMPLATE_FILES'); ?></th>
										<th class="title center" width="100">&nbsp;</th>
									</tr>
								</thead>
							<?php
							$k = 0;
							$i = 0;
							for ($i = 0, $n = count($rows); $i < $n; $i++) {
								$row = $rows[$i];
								?>
								<tr class="row<?php echo $k; ?>">
									<td>
										<a href="index.php?option=com_vikrentitems&amp;task=editcondtext&amp;cid[]=<?php echo $row['id']; ?>"><?php echo $row['name']; ?></a>
									</td>
									<td>
										<span class="vri-condtext-token-full"><?php echo $row['token']; ?></span>
									</td>
									<td class="center"><?php echo $row['lastupd']; ?></td>
									<td class="center">
									<?php
									foreach ($tpl_names as $file => $name) {
										$tag_used = VikRentItemsHelperConditionalRules::isTagInContent($row['token'], $tpl_contents[$file]);
										$btn_icon = $tag_used ? VikRentItemsIcons::i('check-circle') : VikRentItemsIcons::i('plus');
										$btn_classes = array(
											'btn',
											'vri-condtext-tmpl-status',
										);
										if ($tag_used) {
											array_push($btn_classes, 'btn-success');
											array_push($btn_classes, 'vri-condtext-intmpl');
										} else {
											array_push($btn_classes, 'btn-secondary');
											array_push($btn_classes, 'vri-condtext-notintmpl');
										}
										?>
										<button type="button" class="<?php echo implode(' ', $btn_classes); ?>" data-inspectfile="<?php echo $file; ?>" data-specialtag="<?php echo $row['token']; ?>"><i class="<?php echo $btn_icon; ?>"></i> <?php echo $name; ?></button>
										<?php
									}
									?>
									</td>
									<td class="center">
										<a href="index.php?option=com_vikrentitems&amp;task=removecondtext&amp;cid[]=<?php echo $row['id']; ?>" class="btn btn-danger" onclick="return confirm(Joomla.JText._('VRIDELCONFIRM'));"><?php VikRentItemsIcons::e('trash'); ?> <?php echo JText::translate('VRIMAINCRONDEL'); ?></a>
									</td>
								</tr>	
								<?php
								$k = 1 - $k;
							}
							?>
							</table>
							<?php echo $navbut; ?>
						</div>
					</div>
				</div>
			</div>
		</div>
	</fieldset>
	<fieldset class="adminform vri-config-fieldset-small">
		<div class="vri-params-wrap">
			<legend class="adminlegend"><?php echo JText::translate('VRCONFIGEDITTMPLFILE'); ?></legend>
			<div class="vri-params-container">
				<div class="vri-param-container">
					<div class="vri-param-label"><?php echo JText::translate('VRCONFIGEMAILTEMPLATE'); ?></div>
					<div class="vri-param-setting">
						<button type="button" class="btn vri-inspector-btn" title="<?php echo addslashes(JText::translate('VRI_INSPECTOR_START')); ?>" data-inspectfile="email_tmpl.php"><?php VikRentItemsIcons::e('paint-brush'); ?></button>
					</div>
				</div>
				<div class="vri-param-container">
					<div class="vri-param-label"><?php echo JText::translate('VRCONFIGPDFTEMPLATE'); ?></div>
					<div class="vri-param-setting">
						<button type="button" class="btn vri-inspector-btn" title="<?php echo addslashes(JText::translate('VRI_INSPECTOR_START')); ?>" data-inspectfile="pdf_tmpl.php"><?php VikRentItemsIcons::e('paint-brush'); ?></button>
					</div>
				</div>
				<div class="vri-param-container">
					<div class="vri-param-label"><?php echo JText::translate('VRI_CONT_WRAPPER'); ?></div>
					<div class="vri-param-setting">
						<button type="button" class="btn vri-contwrapper-btn" onclick="jQuery('.vri-contwrapper-edit').toggle();"><?php VikRentItemsIcons::e('code'); ?></button>
					</div>
				</div>
				<div class="vri-param-container vri-param-nested vri-contwrapper-edit" style="display: none;">
					<?php
					$cont_wrapper_opening = VRIMailParser::getWrapperLayout($opening = true);
					$cont_wrapper_closing = VRIMailParser::getWrapperLayout($opening = false);
					?>
					<div class="vri-param-setting">
						<textarea id="vri-contwrapper-html" style="width: 100% !important; min-height: 250px;"><?php echo JHtml::fetch('esc_textarea', $cont_wrapper_opening . "\n\n\t\t--- " . JText::translate('VRI_TPL_TEXT') . " ---\n\n" . $cont_wrapper_closing); ?></textarea>
						<div class="vri-param-setting-comment"><?php echo JText::translate('VRI_CONT_WRAPPER_HELP'); ?></div>
					</div>
				</div>
				<div class="vri-param-container vri-param-nested vri-contwrapper-edit" style="display: none;">
					<div class="vri-param-setting">
						<button id="vri-contwrapper-save" type="button" class="btn btn-success"><?php VikRentItemsIcons::e('save'); ?> <?php echo JText::translate('VRSAVE'); ?></button>
					</div>
				</div>
			</div>
		</div>
	</fieldset>
</div>

<div id="vri-inspector-outer" class="vri-config-maintab-bottom" style="display: none;">
	<fieldset class="adminform">
		<div class="vri-params-wrap">
			<legend class="adminlegend"><span id="vri-inspector-title"></span></legend>
			<div class="vri-params-container">
				<div class="vri-param-container">
					<div class="vri-param-setting">
						<div class="vri-inspector-cmds">
							<button id="vri-inspector-save" type="button" class="btn btn-success" disabled><?php VikRentItemsIcons::e('save'); ?> <?php echo JText::translate('VRSAVE'); ?></button>
							<button id="vri-inspector-cancel" type="button" class="btn btn-secondary"><?php VikRentItemsIcons::e('times'); ?> <?php echo JText::translate('VRANNULLA'); ?></button>
						</div>
					</div>
				</div>
				<div class="vri-param-container">
					<div class="vri-param-setting">
						<p id="vri-inspector-help" class="info notice-noicon"></p>
					</div>
				</div>
				<div class="vri-param-container vri-inspector-css-param" style="display: none;">
					<div class="vri-param-label"><?php echo JText::translate('VRI_INSP_HTML_TAG'); ?></div>
					<div class="vri-param-setting">
						<span id="vri-inspector-css-tag" class="vri-inspector-css-tag"></span>
					</div>
				</div>
				<div class="vri-param-container vri-inspector-css-param" style="display: none;">
					<div class="vri-param-label"><?php echo JText::translate('VRI_INSP_CSS_FONTCOLOR'); ?></div>
					<div class="vri-param-setting">
						<span class="vri-inspector-colorpicker-wrap">
							<span id="vri-inspector-css-color" class="vri-inspector-colorpicker vri-inspector-colorpicker-trig"><?php VikRentItemsIcons::e('palette'); ?></span>
						</span>
					</div>
				</div>
				<div class="vri-param-container vri-inspector-css-param" style="display: none;">
					<div class="vri-param-label"><?php echo JText::translate('VRI_INSP_CSS_BACKGCOLOR'); ?></div>
					<div class="vri-param-setting">
						<span class="vri-inspector-colorpicker-wrap">
							<span id="vri-inspector-css-backgcolor" class="vri-inspector-colorpicker vri-inspector-colorpicker-trig"><?php VikRentItemsIcons::e('palette'); ?></span>
						</span>
					</div>
				</div>
				<div class="vri-param-container vri-inspector-css-param" style="display: none;">
					<div class="vri-param-label"><?php echo JText::translate('VRI_INSP_CSS_BORDER'); ?></div>
					<div class="vri-param-setting vri-toggle-small">
						<?php echo $vri_app->printYesNoButtons('vri-inspector-css-border', JText::translate('VRYES'), JText::translate('VRNO'), 0, 1, 0, 'vriToggleCSSBorderParams();'); ?>
					</div>
				</div>
				<div class="vri-param-container vri-inspector-css-border-param" style="display: none;">
					<div class="vri-param-label"><?php echo JText::translate('VRI_INSP_CSS_BORDERWIDTH'); ?> (px)</div>
					<div class="vri-param-setting">
						<input type="number" min="0" id="vri-inspector-css-borderwidth" value="0" />
					</div>
				</div>
				<div class="vri-param-container vri-inspector-css-border-param" style="display: none;">
					<div class="vri-param-label"><?php echo JText::translate('VRI_INSP_CSS_BORDERCOLOR'); ?></div>
					<div class="vri-param-setting">
						<span class="vri-inspector-colorpicker-wrap">
							<span id="vri-inspector-css-bordercolor" class="vri-inspector-colorpicker vri-inspector-colorpicker-trig"><?php VikRentItemsIcons::e('palette'); ?></span>
						</span>
					</div>
				</div>
				<div class="vri-param-container">
					<div class="vri-param-setting">
						<div class="vri-inspector-wrap" data-inspectfile=""></div>
					</div>
				</div>
			</div>
		</div>
	</fieldset>
</div>

<?php
foreach ($tpl_contents as $file => $content) {
	?>
<div class="vri-tplcontent-inspector-ghost" style="display: none;" data-inspectfile="<?php echo $file; ?>">
	<?php echo $content; ?>
</div>
	<?php
}
?>

<a class="vri-reload-plchld-link" href="index.php?option=com_vikrentitems&task=config" style="display: none;">&nbsp;</a>

<script type="text/javascript">
	/**
	 * Define global scope vars.
	 */
	var tpl_names = <?php echo json_encode($tpl_names); ?>;
	var current_tag = null,
		current_file = null,
		current_target = null,
		css_editing = false,
		css_custom_classes = [];

	/**
	 * Generates a unique class for the target in the CSS inspector.
	 */
	function vriTargetUniqueClassName() {
		var now = new Date;
		return 'vri-inspector-custom-' + now.getTime();
	}

	/**
	 * Adds the temporary class of the current target to the pool.
	 * Should be called when target's CSS properties have been modified.
	 * All classes in the pool may be processed via PHP for update.
	 */
	function vriCSSTargetChanged() {
		if (current_target === null) {
			return false;
		}
		var tmpclass = current_target.data('tmpclass');
		if (!tmpclass) {
			return false;
		}
		if (css_custom_classes.indexOf(tmpclass) < 0) {
			// push custom/temporary CSS rule
			css_custom_classes.push(tmpclass);
			// enable save button
			jQuery('#vri-inspector-save').prop('disabled', false);
		}
	}

	/**
	 * Unbinds the hover events for the inspector.
	 */
	function vriUnregisterInspector() {
		jQuery('.vri-inspector-wrap').find('*').not('center, table, thead, tbody, tr').unbind('mouseenter mouseleave');
	}

	/**
	 * Register the hover events for the inspector.
	 */
	function vriRegisterInspector(unregister) {
		if (unregister === true) {
			vriUnregisterInspector();
		}

		jQuery('.vri-inspector-wrap').find('*').not('center, table, thead, tbody, tr').hover(function() {
			jQuery('.vri-inspector-hover').removeClass('vri-inspector-hover');
			jQuery(this).addClass('vri-inspector-hover');
		}, function() {
			if (jQuery(this).parent().length && jQuery(this).parent().is(':hover')) {
				jQuery(this).parent().addClass('vri-inspector-hover');
			}
			jQuery(this).removeClass('vri-inspector-hover');
		});

		jQuery('.vri-inspector-wrap').mouseleave(function() {
			jQuery('.vri-inspector-hover').removeClass('vri-inspector-hover');
		});
	}

	/**
	 * Enables the CSS editing mode.
	 */
	function vriEnableCSSEditing() {
		css_editing = true;
	}

	/**
	 * Disables the CSS editing mode.
	 */
	function vriDisableCSSEditing() {
		css_editing = false;
		// hide CSS params
		jQuery('.vri-inspector-css-param, .vri-inspector-css-border-param').hide();
	}

	/**
	 * Starts the CSS inspector. Can be called also by other tabs in this page.
	 */
	function vriStartCSSInspector(file) {
		// when a specific file is requested, simulate the cancel action
		if (file && jQuery('.vri-tplcontent-inspector-ghost[data-inspectfile="' + file + '"]').length) {
			// hide current CSS params
			jQuery('.vri-inspector-css-param, .vri-inspector-css-border-param').hide();
			// unset current target
			current_target = null;
			// make the list of targets with custom CSS empty
			css_custom_classes = [];
			// disable save button
			jQuery('#vri-inspector-save').prop('disabled', true);
			// sanitize template source code from any script tag in case of malformed markup
			jQuery('.vri-tplcontent-inspector-ghost[data-inspectfile="' + file + '"]').find('script').remove();
			// grab requested content and move it to the inspector wrapper
			jQuery('.vri-inspector-wrap').html(jQuery('.vri-tplcontent-inspector-ghost[data-inspectfile="' + file + '"]').html()).attr('data-inspectfile', file);
			// register hovering event
			vriRegisterInspector(true);
		}
		if (!file && current_file !== null) {
			// triggers after adding and saving a conditional text tag
			file = current_file;
		}
		if (!tpl_names.hasOwnProperty(file)) {
			console.error('file not found', file, tpl_names);
			return false;
		}
		// turn off adding tag mode
		current_tag = null;
		// define global file editing
		current_file = file;
		// enable flag for CSS editing
		vriEnableCSSEditing();
		// update title
		jQuery('#vri-inspector-title').text(tpl_names[file] + ' - ' + Joomla.JText._('VRI_INSPECTOR_START'));
		// update helper
		jQuery('#vri-inspector-help').html('<?php VikRentItemsIcons::e('paint-brush'); ?> ' + Joomla.JText._('VRI_CSS_EDITING_HELP')).show();
		// display inspector outer
		jQuery('#vri-inspector-outer').show();
		if (current_target !== null) {
			// render CSS properties
			vriRenderCSSInspector();
		} else {
			// animate scroll to the outer position
			jQuery('html,body').animate({scrollTop: jQuery('#vri-inspector-outer').offset().top - 40}, {duration: 400});
		}
	}

	/**
	 * Displays the CSS properties of the selected target.
	 * Creates a new class identifier for the current target.
	 */
	function vriRenderCSSInspector() {
		if (current_target === null || !css_editing) {
			console.error('CSS editing not available', current_target, css_editing);
			return false;
		}
		// add the unique class to the target element
		var unique_class_id = vriTargetUniqueClassName();
		current_target.removeClass('vri-inspector-hover').addClass(unique_class_id).data('tmpclass', unique_class_id);
		// set current tag name
		jQuery('#vri-inspector-css-tag').text(current_target.prop('tagName'));
		// set current font color
		jQuery('#vri-inspector-css-color').css('backgroundColor', current_target.css('color'));
		// set current background color
		jQuery('#vri-inspector-css-backgcolor').css('backgroundColor', current_target.css('backgroundColor'));
		// check if element has borders and set values
		var elborder = current_target.css('border-left-width').match(/^([0-9.]+)/);
		if (elborder && elborder[1] > 0) {
			// has got a border
			jQuery('input[name="vri-inspector-css-border"]').prop('checked', true);
			jQuery('.vri-inspector-css-border-param').show();
			jQuery('#vri-inspector-css-borderwidth').val(elborder[1]);
			jQuery('#vri-inspector-css-bordercolor').css('backgroundColor', current_target.css('border-left-color'));
		} else {
			// has got no border
			jQuery('input[name="vri-inspector-css-border"]').prop('checked', false);
			jQuery('.vri-inspector-css-border-param').hide();
			jQuery('#vri-inspector-css-borderwidth').val('0');
			// unset background completely, not just the bgcolor
			jQuery('#vri-inspector-css-bordercolor').css('background', '');
		}
		// display CSS params
		jQuery('.vri-inspector-css-param').show();
		// animate scroll to the outer position
		jQuery('html,body').animate({scrollTop: jQuery('#vri-inspector-outer').offset().top - 40}, {duration: 400});
	}

	/**
	 * Toggles the CSS params for the border
	 */
	function vriToggleCSSBorderParams() {
		if (jQuery('input[name="vri-inspector-css-border"]').is(':checked')) {
			jQuery('.vri-inspector-css-border-param').show();
			if (current_target !== null) {
				// restore border, if any
				var borderwidth = jQuery('#vri-inspector-css-borderwidth').val();
				if (borderwidth.length && !isNaN(borderwidth) && borderwidth > 0) {
					current_target.css('border', borderwidth + 'px solid ' + vriRgb2Hex(jQuery('#vri-inspector-css-bordercolor').css('backgroundColor')));
				}
			}
		} else {
			jQuery('.vri-inspector-css-border-param').hide();
			if (current_target !== null) {
				// unset border completely
				current_target.css('border', '');
			}
		}
	}

	/**
	 * AJAX request to remove a special tag from a template file.
	 */
	function vriRemoveCondTextTagFromTpl(tag, file) {
		var jqxhr = jQuery.ajax({
			type: "POST",
			url: "<?php echo VikRentItems::ajaxUrl('index.php?option=com_vikrentitems&task=condtext_update_tmpl'); ?>",
			data: {
				tmpl: "component",
				tagaction: 'remove',
				tag: tag,
				file: file
			}
		}).done(function(response) {
			try {
				var obj_res = typeof response === 'string' ? JSON.parse(response) : response;
				if (!obj_res.hasOwnProperty('newhtml')) {
					console.error('Unexpected JSON response', obj_res);
					return false;
				}
				// update template file HTML code
				jQuery('.vri-tplcontent-inspector-ghost[data-inspectfile="' + file + '"]').html(obj_res['newhtml']);
				// update button classes and icon
				var btn_triggering = jQuery('.vri-condtext-tmpl-status[data-inspectfile="' + file + '"][data-specialtag="' + tag + '"]');
				btn_triggering.removeClass('btn-success vri-condtext-intmpl').addClass('btn-secondary vri-condtext-notintmpl');
				btn_triggering.find('i').removeClass().addClass('<?php echo VikRentItemsIcons::i('plus'); ?>');
			} catch(err) {
				console.error('could not parse JSON response', err, response);
				alert('Request failed');
			}
		}).fail(function() {
			alert('Request failed');
			console.error('Request failed');
		});
	}

	/**
	 * Removes (undo) a special tag from the inspector.
	 */
	function vriRemoveTagFromInspector() {
		if (current_tag === null) {
			return false;
		}
		var escape_tag = current_tag.replace(/[.*+\-?^${}()|[\]\\]/g, '\\$&');
		// replace all occurrences of escaped tag
		var empty_html = jQuery('.vri-inspector-wrap').html();
		empty_html = empty_html.replace(new RegExp(escape_tag, 'g'), '');
		// restore correct HTML
		jQuery('.vri-inspector-wrap').html(empty_html);
	}

	/**
	 * When manipulating the source code of the template files, errors may occur.
	 * This function makes a new AJAX request to restore the file from the backup.
	 */
	function vriRestoreBackupFile() {
		if (current_file === null) {
			console.error('file cannot be null, unable to restore file');
			return false;
		}
		// make the request
		var jqxhr = jQuery.ajax({
			type: "POST",
			url: "<?php echo VikRentItems::ajaxUrl('index.php?option=com_vikrentitems&task=condtext_update_tmpl'); ?>",
			data: {
				tmpl: "component",
				tagaction: 'restore',
				file: current_file
			}
		}).done(function(response) {
			var reload_href = jQuery('.vri-reload-plchld-link').attr('href');
			try {
				var obj_res = typeof response === 'string' ? JSON.parse(response) : response;
				if (!obj_res.hasOwnProperty('newhtml')) {
					console.error('Unexpected JSON response while restoring', obj_res, response);
					return false;
				}
				location.href = reload_href;
				return;
			} catch(err) {
				console.error('could not parse JSON response when restoring', err, response);
				// display error message
				alert('Restoring failed. The template file ' + current_file + ' may be corrupted');
				location.href = reload_href;
				return;
			}
		}).fail(function() {
			alert('Restoring request failed');
			console.error('Restoring request failed');
		});
	}

	/**
	 * Declare the functions for the document ready event.
	 */
	jQuery(function() {

		/**
		 * Register border width number input change event.
		 */
		jQuery('#vri-inspector-css-borderwidth').change(function() {
			if (current_target === null) {
				return;
			}
			var borderwidth = jQuery(this).val();
			if (borderwidth.length && !isNaN(borderwidth) && borderwidth > 0) {
				// use short-hand syntax to update the border
				current_target.css('border', borderwidth + 'px solid ' + vriRgb2Hex(jQuery('#vri-inspector-css-bordercolor').css('backgroundColor')));
			} else {
				// unset the border completely
				current_target.css('border', '');
			}
			// trigger target style modification
			vriCSSTargetChanged();
		});

		/**
		 * Register color-picker for CSS editing parameters.
		 */
		jQuery('.vri-inspector-colorpicker-trig').ColorPicker({
			color: '#ffffff',
			onShow: function (colpkr, el) {
				if (current_target === null) {
					return false;
				}
				var cur_color = jQuery(el).css('backgroundColor');
				jQuery(el).ColorPickerSetColor(vriRgb2Hex(cur_color));
				jQuery(colpkr).show();
				return false;
			},
			onChange: function (hsb, hex, rgb, el) {
				var element = jQuery(el);
				var elid = element.attr('id');
				element.css('backgroundColor', '#'+hex);
				if (current_target !== null) {
					var css_prop = 'backgroundColor';
					if (elid == 'vri-inspector-css-color') {
						css_prop = 'color';
					} else if (elid == 'vri-inspector-css-bordercolor') {
						css_prop = 'borderColor';
					}
					current_target.css(css_prop, '#'+hex);
				}
				// trigger target style modification
				vriCSSTargetChanged();
			},
			onSubmit: function(hsb, hex, rgb, el) {
				var element = jQuery(el);
				var elid = element.attr('id');
				element.css('backgroundColor', '#'+hex);
				if (current_target !== null) {
					var css_prop = 'backgroundColor';
					if (elid == 'vri-inspector-css-color') {
						css_prop = 'color';
					} else if (elid == 'vri-inspector-css-bordercolor') {
						css_prop = 'borderColor';
					}
					current_target.css(css_prop, '#'+hex);
				}
				element.ColorPickerHide();
				// trigger target style modification
				vriCSSTargetChanged();
			}
		});

		/**
		 * Listens to the buttons to start the CSS editing mode. May be used on different tabs.
		 */
		jQuery('.vri-inspector-btn').click(function() {
			var file = jQuery(this).attr('data-inspectfile');
			if (!file || !tpl_names.hasOwnProperty(file)) {
				alert('Template not found');
				console.error('Template not found ' + file, tpl_names);
				return false;
			}
			// make sure the proper configuration tab is active
			var proper_tab_cont = jQuery('.vri-inspector-wrap').closest('dd.tabs');
			if (!proper_tab_cont.is(':visible')) {
				var tab_id = proper_tab_cont.attr('id').replace('pt', '');
				if (jQuery('dt.tabs[data-ptid="' + tab_id + '"]').length) {
					// simulate click on proper tab, as CSS editing can be started also from another tab
					jQuery('dt.tabs[data-ptid="' + tab_id + '"]').trigger('click');
				}
			}
			// start CSS inspector
			vriStartCSSInspector(file);
		});

		/**
		 * Listens to the click on the buttons to add or remove special tags.
		 */
		jQuery('.vri-condtext-tmpl-status').click(function() {
			// always hide inspector outer
			jQuery('#vri-inspector-outer').hide();
			// always make the helper text empty
			jQuery('#vri-inspector-help').html('');
			// always disable the save button
			jQuery('#vri-inspector-save').prop('disabled', true);
			// always disable CSS editing
			vriDisableCSSEditing();
			// find file name and tag
			var file = jQuery(this).attr('data-inspectfile');
			if (!file || !tpl_names.hasOwnProperty(file)) {
				alert('Template not found');
				console.error('Template not found ' + file, tpl_names);
				return false;
			}
			// update global current tag and file selected
			var tag = jQuery(this).attr('data-specialtag');
			current_tag = tag;
			current_file = file;
			// check if tag is already in the template file
			if (jQuery(this).hasClass('vri-condtext-intmpl')) {
				// ask to remove it
				var rmtxt = Joomla.JText._('VRI_CONDTEXT_TAG_RM_HELP');
				if (confirm(rmtxt.replace('%s', tpl_names[file]))) {
					vriRemoveCondTextTagFromTpl(current_tag, file);
				} else {
					current_tag = null;
					current_file = null;
				}
				return false;
			}
			// update title
			jQuery('#vri-inspector-title').text(tpl_names[file] + ' - ' + Joomla.JText._('VRCONFIGEDITTMPLFILE'));
			// update helper
			var helper_txt = Joomla.JText._('VRI_CONDTEXT_TAG_ADD_HELP');
			jQuery('#vri-inspector-help').html('<?php VikRentItemsIcons::e('magic'); ?> ' + helper_txt.replace('%s', current_tag)).show();
			// sanitize template source code from any script tag in case of malformed markup
			jQuery('.vri-tplcontent-inspector-ghost[data-inspectfile="' + file + '"]').find('script').remove();
			// grab requested content and move it to the inspector wrapper
			jQuery('.vri-inspector-wrap').html(jQuery('.vri-tplcontent-inspector-ghost[data-inspectfile="' + file + '"]').html()).attr('data-inspectfile', file);
			// display inspector outer
			jQuery('#vri-inspector-outer').show();
			// animate scroll to the outer position
			jQuery('html,body').animate({scrollTop: jQuery('#vri-inspector-outer').offset().top - 40}, {duration: 400});
			// register hovering event
			vriRegisterInspector(true);
		});

		/**
		 * Listens to the click on the elements of the HTML inspector.
		 * It can append a special tag, remove one before, or start the CSS editing.
		 */
		jQuery('.vri-inspector-wrap').click(function(e) {
			if (current_file === null) {
				// file cannot be null
				return false;
			}
			// update current target
			var target = jQuery(e.target);
			current_target = target;
			// insert tag, if requested
			if (current_tag != null) {
				// check if the tag was already added
				var removed = false;
				if (jQuery('.vri-inspector-wrap').html().indexOf(current_tag) >= 0) {
					// remove current tag before appending it to the new position
					vriRemoveTagFromInspector();
					removed = true;
				}
				target.append(current_tag);
				// enable the save button
				jQuery('#vri-inspector-save').prop('disabled', false);
				if (removed) {
					// inspector hovering needs to be re-registered after removing the tag
					vriRegisterInspector(true);
				}
				return;
			}
			// if we reach this point, start CSS inspector
			vriStartCSSInspector(null);
		});

		/**
		 * Tries to undo the last action. Behaves differently depending on the active mode.
		 */
		jQuery('#vri-inspector-cancel').click(function() {
			if (current_file === null) {
				// file cannot be null, hide inspector outer no matter what
				jQuery('#vri-inspector-outer').hide();
				return false;
			}
			if (current_tag != null) {
				// unset all occurrences of the current tag (if any)
				var empty_html = jQuery('.vri-inspector-wrap').html();
				if (empty_html.length && empty_html.indexOf(current_tag) >= 0) {
					// remove tag from inspector
					vriRemoveTagFromInspector();
					// inspector hovering needs to be re-registered after editing the content
					vriRegisterInspector(true);
				} else {
					// hide inspector outer, as the tag was not added yet
					jQuery('#vri-inspector-outer').hide();
				}
			} else {
				if (css_editing && current_target !== null) {
					// hide current CSS params
					jQuery('.vri-inspector-css-param, .vri-inspector-css-border-param').hide();
					// unset current target
					current_target = null;
					// make the list of targets with custom CSS empty
					css_custom_classes = [];
					// disable save button
					jQuery('#vri-inspector-save').prop('disabled', true);
					// sanitize template source code from any script tag in case of malformed markup
					jQuery('.vri-tplcontent-inspector-ghost[data-inspectfile="' + current_file + '"]').find('script').remove();
					// cancelling during CSS editing means restoring the original source code
					jQuery('.vri-inspector-wrap').html(jQuery('.vri-tplcontent-inspector-ghost[data-inspectfile="' + current_file + '"]').html()).attr('data-inspectfile', current_file);
					// register hovering event is necessary
					vriRegisterInspector(true);
				} else {
					// hide inspector outer, tag not yet added or already added and saved
					jQuery('#vri-inspector-outer').hide();
				}
			}
		});

		/**
		 * Saves the last action made through the inspector.
		 */
		jQuery('#vri-inspector-save').click(function() {
			if (current_file === null) {
				console.error('file cannot be null');
				return false;
			}
			var savebtn = jQuery(this);
			// show loading
			savebtn.find('i').removeClass().addClass('<?php echo VikRentItemsIcons::i('refresh', 'fa-spin fa-fw'); ?>');
			// detect action type
			var action_type = 'add';
			if (css_editing && css_custom_classes.length) {
				action_type = 'styles';
			}
			// make the request
			var jqxhr = jQuery.ajax({
				type: "POST",
				url: "<?php echo VikRentItems::ajaxUrl('index.php?option=com_vikrentitems&task=condtext_update_tmpl'); ?>",
				data: {
					tmpl: "component",
					tagaction: action_type,
					tag: current_tag,
					file: current_file,
					newcontent: jQuery('.vri-inspector-wrap').html(),
					custom_classes: css_custom_classes
				}
			}).done(function(response) {
				try {
					var obj_res = typeof response === 'string' ? JSON.parse(response) : response;
					if (!obj_res.hasOwnProperty('newhtml')) {
						console.error('Unexpected JSON response', obj_res);
						return false;
					}
					// stop loading
					savebtn.find('i').removeClass().addClass('<?php echo VikRentItemsIcons::i('check-circle'); ?>');
					// disable another saving
					savebtn.prop('disabled', true);
					if (current_tag !== null) {
						// update button classes and icon
						var btn_triggering = jQuery('.vri-condtext-tmpl-status[data-inspectfile="' + current_file + '"][data-specialtag="' + current_tag + '"]');
						btn_triggering.removeClass('btn-secondary vri-condtext-notintmpl').addClass('btn-success vri-condtext-intmpl');
						btn_triggering.find('i').removeClass().addClass('<?php echo VikRentItemsIcons::i('check-circle'); ?>');
						// hide helper
						jQuery('#vri-inspector-help').hide().html('');
						// unset tag editing mode
						current_tag = null;
					}
					if (css_editing && css_custom_classes.length) {
						// empty the list of custom CSS classes as they were all saved
						css_custom_classes = [];
					}
					// update template file HTML code
					jQuery('.vri-tplcontent-inspector-ghost[data-inspectfile="' + current_file + '"]').html(obj_res['newhtml']);
				} catch(err) {
					console.error('could not parse JSON response after saving', err, response);
					// display error message
					alert(Joomla.JText._('VRI_EDITTPL_FATALERROR'));
					// restore backup of the file source code
					vriRestoreBackupFile();
				}
			}).fail(function() {
				console.error('Request failed completely');
				// display error message
				alert(Joomla.JText._('VRI_EDITTPL_FATALERROR'));
				// restore backup of the file source code
				vriRestoreBackupFile();
			});
		});

		jQuery('#vri-contwrapper-save').click(function() {
			var wrapper_code = jQuery('#vri-contwrapper-html').val();
			if (!wrapper_code || !wrapper_code.length) {
				return false;
			}
			jQuery(this).prop('disabled', true);
			VRICore.doAjax('<?php echo VikRentItems::ajaxUrl('index.php?option=com_vikrentitems&task=mail.update_ve_contwraper'); ?>', {
				wrapper_content: wrapper_code
			}, (resp) => {
				// hide editing mode
				jQuery('.vri-contwrapper-edit').hide();
				jQuery(this).prop('disabled', false);
			}, (err) => {
				alert(err.responseText);
				jQuery(this).prop('disabled', false);
			});
		});

	});
</script>
