{extends file="layout.html"}
{block name=title}LMS: {$layout.pagetitle|striphtml}{/block}
{block name=module_content}
<style>

	table#configlist-datatable tr td p {
		margin-top: 0;
		margin-bottom: 0;
	}

	table#configlist-datatable tr th {
		background-position: bottom 0.7em right;
	}

	#command-buttons {
		display: flex;
		flex-direction: column;
	}

	.row-container {
		display: flex;
		flex-wrap: nowrap;
		flex-direction: row;
		justify-content: space-between;
		align-items: flex-start;
		text-align: left;
	}

	.row-container-buttons {
		display: flex;
		flex-wrap: nowrap;
		flex-direction: row;
		justify-content: flex-end;
		align-items: center;
	}

	.row-container-buttons > div {
		padding-left: 0.5em;
	}

	.row-container-actions {
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		justify-content: flex-start;
		align-items: flex-start;
		flex-grow: 0;
	}

	#clone-container, #export-container {
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		justify-content: flex-start;
		align-items: center;
	}

	#clone-container > div {
		padding-right: 0.5em;
	}

	#export-container > div {
		padding-right: 0.5em;
	}

	.lms-ui-button-clipboard {
		margin-left: 0.3em;
	}

	.show-full-value {
		float: right;
	}

	@media all and (max-width: 1200px) {
		.row-container-buttons {
			flex-direction: column;
			align-items: flex-end;
		}
	}

</style>
<!--// $Id$ //-->
<h1>{$layout.pagetitle}</h1>

<form name="configform" id="configform" method="POST" action="?m=config"></form>

<table id="configlist-datatable" class="lmsbox lms-ui-multi-check lms-ui-datatable lms-ui-datatable-column-search"
		data-state-duration='-1'
		data-order='[[ 1, "asc" ]]'
		data-page-length="{$pagelimit}"
		data-state-save="true"
		data-search-columns='[ {if !empty($section)}{ "search": "{$section}" }{else}null{/if}, {if !empty($name)}{ "search": "{$name}" }{else}null{/if}, null, null, {if !empty($scope)}{ "search": "{$scope}" }{else}null{/if}, {if !empty($user)}{ "search": "{$user}" }{else}null{/if}, {if !empty($division)}{ "search": "{$division}" }{else}null{/if}, null ]'
		data-empty-table-message='{t a="?m=configload"}No configuration options in database.<br>Click <A href="$a">here</A> to import them from lms.ini.{/t}'
		style="display: none;" width="100%">
    <colgroup>
		<col style="width: 1%;">
		<col style="width: 1%;">
		<col style="width: 1%;">
		<col style="width: 93%;">
		<col style="width: 1%;">
		<col style="width: 1%;">
		<col style="width: 1%;">
		<col style="width: 1%;">
    </colgroup>
    <thead>
		<tr>
			<th scope="col" class="valign-bottom nobr" data-searchable="true" data-select-value="true" data-filter-id="section-filter">
				<span>{trans("Section")}</span>
				{icon name="url" class="lms-ui-button-section-link" tip="Copy link"
					data_clipboard_text="{$url}?m=configlist&s=%section%"}
			</th>
			<th scope="col" class="valign-bottom bold nobr" data-filter-id="name-filter">
				{trans("Name")}
			</th>
			<th scope="col" class="text-center valign-bottom">
				{trans("Value")}
			</th>
			<th scope="col" class="text-center valign-bottom">
				{trans("Comment")}
			</th>
			<th scope="col" class="valign-bottom nobr" data-searchable="true" data-select-value="true" data-filter-id="type-filter">
				{trans("Scope")}
			</th>
			<th scope="col" class="valign-bottom nobr" data-searchable="true" data-select-value="true" data-filter-id="user-filter">
				{trans("User")}
			</th>
			<th scope="col" class="valign-bottom nobr" data-searchable="true" data-select-value="true" data-filter-id="division-filter">
				{trans("Division")}
			</th>
			<th scope="col" class="text-right valign-bottom nobr" data-searchable="false" data-sortable="false">
				<div id="command-buttons">
					{button icon="add" label="Add option" class="configadd"}
				</div>
			</th>
		</tr>
    </thead>
    <tbody>
		{foreach $configlist as $config}
		<tr class="{if $config.disabled} blend{/if}" data-name="{$config.section}.{$config.var}" data-target-url="?m=configedit&id={$config.id}&action=init">
			<td>
				{$config.section}
			</td>
			<td class="bold">
				{$config.var}
			</td>
			<td{if isset($config.fullvalue)} data-full-value="{base64_encode(nl2br($config.fullvalue|escape|replace:" ":"&nbsp;"))}"{/if}>
				{if isset($config.fullvalue)}
					<div>
						<div class="show-full-value lms-ui-ignore-target-url">
							{icon name="next"}
						</div>
						<div>
							{nl2br($config.value|escape|replace:" ":"&nbsp;")}
						</div>
					</div>
				{else}
					{nl2br($config.value|escape|replace:" ":"&nbsp;")}
				{/if}
			</td>
			<td>
				{$config.description|truncate:5000:"&hellip;"}
				{if $config.usercomment != ''}<p><SPAN class="bold">{trans("Comment:")}</SPAN> {$config.usercomment|truncate:2000:"&hellip;"}</p>{/if}
			</td>
			<td>
				{trans($config.reftypedescription)}
			</td>
			<td>
				{if $config.userid}{$config.rusername} ({$config.login}){else}{trans('<!filter>— none —')}{/if}
			</td>
			<td>
				{if $config.divisionid}{$config.shortname|escape}{else}{trans('<!filter>— none —')}{/if}
			</td>
			<td class="lms-ui-buttons text-right nobr">
				{if $config.disabled}
					{button type="link" icon="disconnected" tip="Enable" href="?m=configedit&id={$config.id}&statuschange=1"}
				{else}
					{button type="link" icon="connected" tip="Disable" href="?m=configedit&id={$config.id}&statuschange=1"}
				{/if}
				{icon name="url" class="lms-ui-button-clipboard lms-ui-static" tip="Copy link"
					data_clipboard_text="{$url}?m=configedit&s={$config.section}&v={$config.var}{if $config.userid}&u={$config.userid}{/if}{if $config.divisionid}&d={$config.divisionid}{/if}"}
				{if empty($config.configid)}
					{button type="link" icon="clone" tip="Clone" href="?m=configadd&id={$config.id}&action=init"}
				{/if}
				{button type="link" icon="delete" class="delete-config" tip="Delete" href="?m=configdel&id={$config.id}"}
				{button type="link" icon="edit" tip="Edit" href="?m=configedit&id={$config.id}&action=init"}
				<input type="checkbox" name="marks[{$config.id}]" value="{$config.id}" form="configform" class="lms-ui-multi-check">
			</td>
		</tr>
		{/foreach}
    </tbody>
    <tfoot>
		<tr>
			<td colspan="8" class="text-right bold">
				<div class="row-container">
					<div class="row-container-actions">
						<fieldset id="clone">
							<legend>{trans("Cloning")}</legend>
							<div id="clone-container">
								<div class="clone-container-section-input">
									<div>
										<label for="section-name-input" class="lms-ui-label">
											{trans("Target section")}
										</label>
									</div>
									<div>
										<input type="text" id="section-name-input" {tip text="Enter new section name"}>
									</div>
								</div>

								<div class="clone-container-section-select">
									<div>
										<label for="section-name-select" class="lms-ui-label">
											{trans("Target section")}
										</label>
									</div>
									<div>
										<select size="1" id="section-name-select" {tip class="lms-ui-combobox" text="Select section" trigger="section"}>
											<option value="samesection" selected>{trans('to_the_source_sections')}</option>
											{foreach $sections as $section}
												<option value="{$section}">{$section}</option>
											{/foreach}
										</select>
									</div>
								</div>

								<div class="clone-container-user">
									<div>
										<label for="user-name" class="lms-ui-label">
											{trans("Target user")}
										</label>
									</div>
									<div>
										<select size="1" id="user-name" {tip text="Select user" trigger="user"}>
											{foreach $users as $user}
												<option value="{$user.id}">{$user.login} / {$user.rname|escape}</option>
											{/foreach}
										</select>
									</div>
								</div>

								<div class="clone-container-division">
									<div>
										<label for="division-name" class="lms-ui-label">
											{trans("Target division")}
										</label>
									</div>
									<div>
										<select size="1" id="division-name" {tip text="Select user" trigger="division"}>
											{foreach $divisions as $division}
												<option value="{$division.id}">{$division.label|escape}</option>
											{/foreach}
										</select>
									</div>
								</div>

								<div class="withchildbindings">
									<label>{strip}
										<input type="checkbox" id="withchildbindings">
										<span class="lms-ui-label">
											{trans("descendant bindings")}
										</span>
									{/strip}</label>
								</div>

								<div class="withparentbindings">
									<label>{strip}
										<input type="checkbox" id="withparentbindings">
										<span class="lms-ui-label">
											{trans("create the missing ancestor bindings")}
										</span>
									{/strip}</label>
								</div>

								<div class="override">
									<label>{strip}
										<input type="checkbox" id="override">
										<span class="lms-ui-label">
											{trans("override existing")}
										</span>
									{/strip}</label>
								</div>

								<div>
									{button icon="clone" label="Clone selected" id="clone-configs"}
								</div>
							</div>
						</fieldset>
						<fieldset id="export">
							<legend>{trans("Export")}</legend>
							<div id="export-container">
								<div>
									<label>{strip}
										<input type="radio" name="export_filetype" id="export_ini" value="ini" checked>
										<span class="lms-ui-label">
											{trans("ini")}
										</span>
									{/strip}</label>
									<label>{strip}
										<input type="radio" name="export_filetype" id="export_sql" value="sql">
										<span class="lms-ui-label">
											{trans("sql")}
										</span>
									{/strip}</label>
								</div>

								<div>
									{button icon="importsource" label="Export selected" id="export-configs"}
								</div>
							</div>
						</fieldset>
					</div>
					<div class="row-container-buttons">
						<div>
							{button icon="delete" label="Delete selected" id="delete-configs"}
						</div>
						<div>
							{button icon="url" label="Copy as links" id="copy-links-configs" data_clipboard_text=""}
						</div>
						<div>
							<label>{trans("Check All")}
								<INPUT type="checkbox" id="checkall" class="lms-ui-multi-check-all">
							</label>
						</div>
					</div>
				</div>
			</td>
		</tr>
    </tfoot>
</table>

<script>

$(function() {
	var withchildbindings = $('#withchildbindings');
	withchildbindings.prop('checked', true);
	var withparentbindings = $('#withparentbindings');
	withparentbindings.prop('checked', true);
	var override = $('#override');
	override.prop('checked', true);

	$('.configadd').click(function() {
		var select = $('thead tr select', $(this).closest('table'));
		href = '?m=configadd&action=init';
		if (select.prop('selectedIndex')) {
			href += '&section=' + select.val();
		}
		window.location.href = href;
	});

	$('.delete-config').click(function() {
		var name = $(this).closest('tr').attr('data-name');
		confirmDialog($t("Are you sure, you want to delete option \'$a\' from database?\n\nIf option has related options this action will remove all of them.", name), this).done(function() {
				location.href = $(this).attr('href');
			});
		return false;
	});

	$('#delete-configs').click(function() {
		if (!$(this).closest('.lms-ui-multi-check').find('input.lms-ui-multi-check:checked').length) {
			alertDialog($t("No option has been selected!"), this);
			return;
		}
		confirmDialog($t("Are you sure, you want to delete all selected options from database?"), this).done(function () {
			document.configform.action="?m=configdel";
			document.configform.submit();
			return;
		});
	});

	$(".show-full-value").click(function() {
		var elem = $(this).closest("[data-full-value]");
		elem.html(Base64.decode(elem.attr('data-full-value')));
	});

	$('#export-configs').click(function() {
		if (!$(this).closest('.lms-ui-multi-check').find('input.lms-ui-multi-check:checked').length) {
			alertDialog($t("No option has been selected!"), this);
			return;
		} else {
			var type_filter = $('#type-filter').val();
			var user_filter = $('#user-filter').val();
			var division_filter = $('#division-filter').val();
			var fileType = $('input[name="export_filetype"]:checked').val();
			var export_args = '';

			if (typeof(type_filter) === 'undefined'
					|| (
							type_filter === $t("global value")
							&& (
									typeof(division_filter) === 'undefined'
									|| division_filter === $t("<!filter>— none —")
									|| (typeof(division_filter) !== 'undefined' && division_filter.length === 0)
							)
							&& (
									typeof(user_filter) === 'undefined'
									|| user_filter === $t("<!filter>— none —")
									|| (typeof(user_filter) !== 'undefined' && user_filter.length === 0)
							)
					)
			) {
				var export_type_filter = $t("global value");
				export_args += '&source-type=' + export_type_filter + '';
			}

			if (type_filter === $t("division value")
				&& division_filter != $t("<!filter>— none —")
				&& division_filter.length > 0
				&& (
					typeof(user_filter) === 'undefined'
					|| user_filter === $t("<!filter>— none —")
					|| (typeof(user_filter) !== 'undefined' && user_filter.length === 0)
				)
			) {
				export_args += '&source-division=' + division_filter + '';
			}

			if (type_filter === $t("user in division value")
					&& division_filter != $t("<!filter>— none —") && division_filter.length > 0
					&& user_filter !== $t("<!filter>— none —") && user_filter.length > 0) {
				export_args += '&source-division=' + division_filter + '';
				export_args += '&source-user=' + user_filter + '';
			}

			if (type_filter === $t("user value")
				&& user_filter !== $t("<!filter>— none —")
				&& user_filter.length > 0
				&& (
					typeof(division_filter) === 'undefined'
					|| division_filter === $t("<!filter>— none —")
					|| (typeof(division_filter) !== 'undefined' && division_filter.length === 0)
				)
			) {
				export_args += '&source-user=' + user_filter + '';
			}

			export_args += '&fileType=' + fileType + '';

			document.configform.action = '?m=configexport' + export_args + '';
			document.configform.submit();
			return;
		}
	});

	$('#clone-configs').click(function() {
		if (!$(this).closest('.lms-ui-multi-check').find('input.lms-ui-multi-check:checked').length) {
			alertDialog($t("No option has been selected!"), this);
			return;
		}

		var section_name_input = $('#section-name-input');
		var section_name_input_visible = section_name_input.is(':visible');

		var section_name_select = $('#section-name-select');
		var section_name_select_input = section_name_select.find('input.scombobox-value');
		var section_name_select_visible = section_name_select.is(':visible');

		var user_name = $('#user-name');
		var user_name_visible = user_name.is(':visible');

		var division_name = $('#division-name');
		var division_name_visible = division_name.is(':visible');

		var withchildbindings_visible = withchildbindings.is(':visible');
		var withparentbindings_visible = withparentbindings.is(':visible');
		var override_visible = override.is(':visible');

		var args = '';

		if (section_name_input_visible) {
			var section_name_input_val = section_name_input.val();
			if (!section_name_input_val.length) {
				alertDialog($t("Section name can't be empty"), this);
				return false;
			}
			if (!section_name_input_val.match(/^[a-z0-9_-]+$/)) {
				alertDialog($t("Section name contains forbidden characters!"), this);
				return false;
			}

			if (section_name_input_val.length) {
				args += '&target-section=' + section_name_input_val + '';
			}

		}

		if (section_name_select_visible) {
			var section_name_select_input_val = section_name_select_input.val();

			if (!section_name_select_input_val.length) {
				alertDialog($t("Section name can't be empty"), this);
				return false;
			}
			if (!section_name_select_input_val.match(/^[a-z0-9_-]+$/)) {
				alertDialog($t("Section name contains forbidden characters!"), this);
				return false;
			}

			if (section_name_select_input_val.length) {
				args += '&target-section=' + section_name_select_input_val + '';
			}
		}

		if (user_name_visible) {
			var user_id = user_name.val();
			if (user_id) {
				args += '&target-user=' + user_id + '';
			}
		}

		if (division_name_visible) {
			var division_id = division_name.val();
			if (division_id) {
				args += '&target-division=' + division_id + '';
			}
		}

		if (withchildbindings_visible) {
			if ($(withchildbindings).is(':checked')) {
				args += '&withchildbindings=1';
			}
		}

		if (withparentbindings_visible) {
			if ($(withparentbindings).is(':checked')) {
				args += '&withparentbindings=1';
			}
		}

		if (override_visible) {
			if ($(override).is(':checked')) {
				args += '&override=1';
			}
		}

		confirmDialog($t("Are you sure, you want to clone all selected options?"), this).done(function () {
			document.configform.action = '?m=configadd' + args + '';
			document.configform.submit();
			return;
		});
	});

	function toggleActions() {
		$("#clone").find("legend").addClass("lms-ui-disabled").end()
			.find("input,select,button").prop("disabled", true).end()
			.find(".lms-ui-label").addClass("lms-ui-disabled").end()
			.find(".clone-container-section-select,.clone-container-section-input").hide();
		$("#export").find("legend").addClass("lms-ui-disabled").end()
			.find("input,select,button").prop("disabled", true).end()
			.find(".lms-ui-label").addClass("lms-ui-disabled");

		{if !empty($configlist)}
			var type_filter = $('#type-filter').val();
			var user_filter = $('#user-filter').val();
			var division_filter = $('#division-filter').val();

			if (typeof(type_filter) === 'undefined'
				|| (
					type_filter === $t("global value")
					&& (
						typeof(division_filter) === 'undefined'
						|| division_filter === $t("<!filter>— none —")
						|| (typeof(division_filter) !== 'undefined' && division_filter.length === 0)
					)
					&& (
						typeof(user_filter) === 'undefined'
						|| user_filter === $t("<!filter>— none —")
						|| (typeof(user_filter) !== 'undefined' && user_filter.length === 0)
					)
				)
			) {
				$("#clone").find("legend").removeClass("lms-ui-disabled").end()
					.find("input,select,button").prop("disabled", false).end()
					.find(".lms-ui-label").removeClass("lms-ui-disabled").end()
					.find(".clone-container-section-input").show().end()
					.find(".withparentbindings,.override,.clone-container-user,.clone-container-division")
						.find("input,select,button").prop("disabled", true).end()
						.find(".lms-ui-label").addClass("lms-ui-disabled");
				$("#export").find("legend").removeClass('lms-ui-disabled').end()
					.find("input,select,button").prop('disabled', false).end()
					.find(".lms-ui-label").removeClass("lms-ui-disabled");

				return;
			}

			if (type_filter === $t("division value")
				&& division_filter != $t("<!filter>— none —")
				&& division_filter.length > 0
				&& (
					typeof(user_filter) === 'undefined'
					|| user_filter === $t("<!filter>— none —")
					|| (typeof(user_filter) !== 'undefined' && user_filter.length === 0)
				)
			) {
				$("#clone").find("legend").removeClass("lms-ui-disabled").end()
					.find("input,select,button").prop("disabled", false).end()
					.find(".lms-ui-label").removeClass("lms-ui-disabled").end()
					.find(".clone-container-section-select").show().end()
					.find(".clone-container-user")
						.find("input,select,button").prop("disabled", true).end()
						.find(".lms-ui-label").addClass("lms-ui-disabled");
				$("#export").find("legend").removeClass('lms-ui-disabled').end()
					.find("input,select,button").prop("disabled", false).end()
					.find(".lms-ui-label").removeClass("lms-ui-disabled");

				return;
			}

			if (type_filter === $t("user in division value")
					&& division_filter != $t("<!filter>— none —") && division_filter.length > 0
					&& user_filter !== $t("<!filter>— none —") && user_filter.length > 0) {
				$("#clone").find("legend").removeClass("lms-ui-disabled").end()
					.find("input,select,button").prop("disabled", false).end()
					.find(".lms-ui-label").removeClass("lms-ui-disabled").end()
					.find(".clone-container-section-select").show().end()
					.find(".withchildbindings")
						.find("input,select,button").prop("disabled", true).end()
						.find(".lms-ui-label").addClass("lms-ui-disabled");
				$("#export").find("legend").removeClass('lms-ui-disabled').end()
					.find("input,select,button").prop("disabled", false).end()
					.find(".lms-ui-label").removeClass("lms-ui-disabled");

				return;
			}

			if (type_filter === $t("user value")
				&& user_filter !== $t("<!filter>— none —")
				&& user_filter.length > 0
				&& (
					typeof(division_filter) === 'undefined'
					|| division_filter === $t("<!filter>— none —")
					|| (typeof(division_filter) !== 'undefined' && division_filter.length === 0)
				)
			) {
				$("#clone").find("legend").removeClass("lms-ui-disabled").end()
					.find("input,select,button").prop("disabled", false).end()
					.find(".lms-ui-label").removeClass("lms-ui-disabled").end()
					.find(".clone-container-section-select").show().end()
					.find(".withchildbindings,.clone-container-division")
						.find("input,select,button").prop("disabled", true).end()
						.find(".lms-ui-label").addClass("lms-ui-disabled");
				$("#export").find("legend").removeClass('lms-ui-disabled').end()
					.find("input,select,button").prop("disabled", false).end()
					.find(".lms-ui-label").removeClass("lms-ui-disabled");

				return;
			}
		{/if}
	}

	$('#type-filter').change(function() {
		toggleActions();
	})
	$('#user-filter').change(function() {
		toggleActions();
	})
	$('#division-filter').change(function() {
		toggleActions();
	})

	toggleActions();

	$('[data-filter-id="section-filter"]').off('click');

	new ClipboardJS('.lms-ui-button-section-link', {
		text: function(trigger) {
			var copylink = "";

			var section = $('#section-filter').val();
			if (section && section.length) {
				copylink += $(trigger).attr('data-clipboard-text').replace('%section%', section);
			}

			var name = $('#name-filter').val();
			if (name && name.length) {
				copylink += "&v="+name;
			}

			var scope = $('#type-filter').val();
			if (scope && scope.length) {
				copylink += "&sc="+encodeURIComponent(scope);
			}

			var user = $('#user-filter').val();
			if (user && user.length) {
				copylink += "&u="+encodeURIComponent(user);
			}

			var division = $('#division-filter').val();
			if (division && division.length) {
				copylink += "&d="+encodeURIComponent(division);
			}

			return copylink;
		}
	});

	$('#configlist-datatable').DataTable().order.listener('thead span', 0);
	$('#copy-links-configs').click(function() {
		if (!$(this).closest('.lms-ui-multi-check').find('input.lms-ui-multi-check:checked').length) {
			alertDialog($t("No option has been selected!"), this);
			return;
		}
	});

	new ClipboardJS('#copy-links-configs', {
		text: function(trigger) {
			var checkedRows = $(trigger).closest('.lms-ui-multi-check').find('input.lms-ui-multi-check:checked');
			var checkedClipboardText = '';
			checkedRows.each(function() {
				checkedClipboardText += $(this).closest('td').find('.lms-ui-button-clipboard').attr('data-clipboard-text') + '\n';
			});
			$(trigger).attr('data-clipboard-text', checkedClipboardText);
			return $(trigger).attr('data-clipboard-text');
		}
	});
});

</script>
{/block}