path: root/modules-available/usblockoff/templates/usb-choose-config.html

<form method="post" action="?do=usblockoff" id="configForm">
	<input type="hidden" name="token" value="{{token}}">
	<input type="hidden" name="action" id="formAction" value="updateConfig">
	<input type="hidden" name="id" value="0" id="configID">
	<input type="hidden" name="saveAsNewConfig" value="0" id="saveAsNewConfig">

	<div class="panel panel-default">
		<div class="panel-heading">{{lang_general}}</div>
		<div class="panel-body">
			<div class="list-group">

				<div class="list-group-item">
					<div class="row">
						<div class="col-sm-3">
							<label>{{lang_config}}</label>
						</div>
						<div class="col-sm-7">
							<!--<input class="form-control" name="{{name}}" id="{{name}}" value="{{value}}">-->
							<select class="form-control" id="select_config" name="select_config"
									  onchange="loadConfig(this);">
								<option value="0">{{lang_createNewConfig}}</option>
								{{#config_list}}
								<option value={{config_id}}>{{config_name}}</option>
								{{/config_list}}
							</select>
						</div>
						<div class="col-sm-2">
							<a class="btn btn-default" title="{{lang_config_helptext}}">
								<span class="glyphicon glyphicon-question-sign"></span>
							</a>
						</div>
					</div>
				</div>

				<div class="list-group-item">
					<div class="row">
						<div class="col-sm-3">
							<label>{{lang_configName}}</label>
						</div>
						<div class="col-sm-7">
							<input required class="form-control" name="configName" id="configName" value="{{configName}}">
						</div>
						<div class="col-sm-2">
							<a class="btn btn-default" title="{{lang_configName_helptext}}">
								<span class="glyphicon glyphicon-question-sign"></span>
							</a>
						</div>
					</div>
				</div>

				<div class="list-group-item">
					<div class="row">
						<div class="col-sm-3">
							<label>{{lang_saveAsNewConfig}}</label>
						</div>
						<div class="col-sm-7">
							<input class="settings-bs-switch" id="saveAsNewConfig_CB" type="checkbox" value="0" data-size="small">
						</div>
						<div class="col-sm-2">
							<a class="btn btn-default" title="{{lang_saveAsNewConfig-helptext}}">
								<span class="glyphicon glyphicon-question-sign"></span>
							</a>
						</div>
					</div>
				</div>

				<div class="list-group-item">
					<div class="row">
						<div class="col-sm-3">
							<label>{{lang_deleteConfig}}</label>
						</div>
						<div class="col-sm-7">
							<!--	<button class="btn btn-danger confirm-delete" type="submit" onclick="deleteConfig();">{{lang_delete}}</button>-->
							<button class="btn btn-danger" value="" id="deleteConfigButton" title="{{lang_delete}}"
									  onclick="deleteConfig(event);">
								<span class="glyphicon glyphicon-trash"></span> {{lang_delete}}
							</button>
						</div>
						<div class="col-sm-2">
							<a class="btn btn-default" title="{{lang_deleteConfig_helptext}}">
								<span class="glyphicon glyphicon-question-sign"></span>
							</a>
						</div>
					</div>
				</div>

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

	<ul class="nav nav-tabs">
		<li class="active"><a data-toggle="tab" href="#rulesConfigMenu">{{lang_rulesConfig}}</a></li>
		<li><a data-toggle="tab" href="#deamonConfigMenu">{{lang_daemonConfig}}</a></li>
		<li><a data-toggle="tab" href="#assignMenu">{{lang_assignMenu}}</a></li>
	</ul>

	<div class="tab-content">
		<div id="rulesConfigMenu" class="tab-pane fade in active">
			<div id="rulesConfigDIV"></div>
		</div>
		<div id="deamonConfigMenu" class="tab-pane fade">
			<div id="daemonConfigDIV"></div>
		</div>
		<div id="assignMenu" class="tab-pane fade">
			<h3>Work in progress ...</h3>
			<p>Todo: Implement this.</p>
			<p>Or not.</p>
			<p>¯\_(ツ)_/¯</p>
		</div>
	</div>

	<div class="pull-right">
		<!-- TODO: Reset Button should't call loadConfig instead do not reset the select input... but how? -->
		<button class="btn btn-warning" type="reset" onclick="loadConfig($('#select_config'));">
			<!-- TODO: Add discardChanges to the main-> globalVariables -->
			<span class="glyphicon glyphicon-refresh"></span> {{lang_discardChanges}}
		</button>
		<button type="submit" id="configFormButton" class="btn btn-primary">
			<span class="glyphicon glyphicon-floppy-disk"></span> {{lang_save}}
		</button>
	</div>

</form>
<script type="text/javascript">
	document.addEventListener("DOMContentLoaded", function () {
		$('#select_config').change();
		$('#saveAsNewConfig_CB').bootstrapSwitch().on('switchChange.bootstrapSwitch', function(event, state) {
			if (state) {
				$('#saveAsNewConfig').val(1);
			} else {
				$('#saveAsNewConfig').val(0);
			}
		});
	});

	function loadConfig(selectedOption) {
		var configID = selectedOption.value;
		var configName = $('#select_config option:selected').text();
		$('#daemonConfigDIV').load("?do=usblockoff&action=loadDaemonConfig&id=" + configID);
		$('#rulesConfigDIV').load("?do=usblockoff&action=loadRulesConfig&id=" + configID);
		$('#configID').val(configID);
		if (configID == 0) {
			$('#configName').val('');
		} else {
			$('#configName').val(configName);
		}
	}

	function deleteConfig(event) {
		event.preventDefault();

		BootstrapDialog.confirm({
			title: '{{lang_delete}}',
			message: '{{lang_deleteConfigMessage}}',
			type: BootstrapDialog.TYPE_DANGER, // <-- Default value is BootstrapDialog.TYPE_PRIMARY
			closable: false, // <-- Default value is false
			draggable: false, // <-- Default value is false
			btnCancelLabel: '{{lang_cancel}}', // <-- Default value is 'Cancel',
			btnOKLabel: '<span class="glyphicon glyphicon-trash"></span> {{lang_delete}}', // <-- Default value is 'OK',
			btnOKClass: 'btn-danger', // <-- If you didn't specify it, dialog type will be used,
			callback: function (result) {
				if (result) {
					var configID = $('#select_config option:selected').val();
					$('#configID').val(configID);
					$('#formAction').val('deleteConfig');
					$('#configForm').submit();
				}
			}
		});
	}
</script>