blob: 07729db405ff665637ddbc7a2feaa145e14438ca (
plain) (
tree)
|
|
<div>
<form method="post" action="?do=usblockoff" id="addGenericRuleForm">
<input type="hidden" name="token" value="{{token}}">
<input type="hidden" name="action" value="addGenericRule">
<div class="panel panel-default">
<div class="panel-heading">{{lang_generalOptions}}</div>
<div class="panel-body">
<div class="list-group">
{{#settings}}
{{{settingHtml}}}
{{/settings}}
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">{{lang_modeOptions}}
<input class="settings-bs-switch" id="expert_Switch" type="checkbox" name="expert_Switch"
data-on-text="Expert" data-off-text="Casual" data-size="small">
</div>
<div class="panel-body">
<div class="list-group">
<div id="casualMode">
<div class="list-group-item">
<div class="row">
<div class="col-md-3"><label>{{lang_deviceClasses}}</label></div>
<div class="col-md-7">
<select class="form-control" id="casual_selected">
<option value="08:*:*" selected>{{lang_mass-storage}}</option>
<option value="03:*:*">{{lang_hid}}</option>
<option value="09:*:*">{{lang_hub}}</option>
<option value="07:*:*">{{lang_printer}}</option>
<option value="01:*:*">{{lang_audio}}</option>
<option value="*:*:*">{{lang_all-devices}}</option>
</select>
</div>
<div class="col-md-2">
<a class="btn btn-default" title="{{lang_classes-helptext}}">
<span class="glyphicon glyphicon-question-sign"></span>
</a>
</div>
</div>
</div>
<div class="list-group-item">
<div class="row">
<div class="col-md-3"><label>{{lang_contains}}</label></div>
<div class="col-md-7">
<input class="settings-bs-switch" id="contains" type="checkbox" value="1" checked
data-size="small">
</div>
<div class="col-md-2">
<a class="btn btn-default" title="{{lang_contains-helptext}}">
<span class="glyphicon glyphicon-question-sign"></span>
</a>
</div>
</div>
</div>
</div>
<div id="expertMode" style="display: none;">
<div class="list-group-item">
<div class="row">
<div class="col-md-3"><label>{{lang_operator}}</label></div>
<div class="col-md-7">
<select class="form-control" id="expert_selected">
<option value="all-of">{{lang_all-of}}</option>
<option value="one-of">{{lang_one-of}}</option>
<option value="none-of">{{lang_none-of}}</option>
<option value="equals" selected>{{lang_equals}}</option>
<option value="equals-ordered">{{lang_equals-ordered}}</option>
</select>
</div>
<div class="col-md-2">
<a class="btn btn-default" title="{{lang_operator-helptext}}">
<span class="glyphicon glyphicon-question-sign"></span>
</a>
</div>
</div>
</div>
<div class="list-group-item">
<div class="row">
<div class="col-md-3"><label>{{lang_deviceClass}}</label></div>
<div class="col-md-7">
<input class="form-control" type="input" id="input_deviceClass"
value="">
</div>
<div class="col-md-2">
<a class="btn btn-default" title="{{lang_deviceClass-helptext}}">
<span class="glyphicon glyphicon-question-sign"></span>
</a>
</div>
</div>
</div>
<div class="list-group-item">
<div class="row">
<div class="col-md-3"><label>{{lang_deviceSubClass}}</label></div>
<div class="col-md-7">
<input class="form-control" type="input" id="input_deviceSubClass"
value="">
</div>
<div class="col-md-2">
<a class="btn btn-default" title="{{lang_deviceSubClass-helptext}}">
<span class="glyphicon glyphicon-question-sign"></span>
</a>
</div>
</div>
</div>
<div class="list-group-item">
<div class="row">
<div class="col-md-3"><label>{{lang_deviceProtocol}}</label></div>
<div class="col-md-7">
<input class="form-control" type="input" id="input_deviceProtocol"
value="">
</div>
<div class="col-md-2">
<a class="btn btn-default" title="{{lang_deviceProtocol-helptext}}">
<span class="glyphicon glyphicon-question-sign"></span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
<script type="text/javascript">
$('a.btn[title]').tooltip({placement: "auto", html: true});
var contains = true;
var c = $('#contains');
c.bootstrapSwitch();
c.on('switchChange.bootstrapSwitch', function(event, state) {
contains = state;
});
var s = $('#expert_Switch');
var mode = "casual";
s.bootstrapSwitch();
s.parent().parent().addClass('pull-right');
s.parent().parent().css("margin", "-5px");
s.on('switchChange.bootstrapSwitch', function(event, state) {
if (state) {
// Expert mode.
$('#casualMode').hide();
$('#expertMode').show();
mode = "expert";
} else {
// Casual mode.
$('#expertMode').hide();
$('#casualMode').show();
mode = "casual";
}
});
// Add handler to the modal Button.
$('#myModalAddButton').unbind().click(addRule);
$('#myModalAddButtonText').text('{{lang_addRule}}');
function addRule() {
if ($('#rules').val() != "") {
$('#rules').val($('#rules').val() + "\r\n");
}
if (mode == "casual") {
if (contains) {
$('#rules').val($('#rules').val() + $('#prop-action').val() + ' with-interface one-of' + ' { ' +
$('#casual_selected option:selected').val() + ' }');
} else {
$('#rules').val($('#rules').val() + $('#prop-action').val() + ' with-interface ' + $('#casual_selected option:selected').val());
}
} else {
$('#rules').val($('#rules').val() + $('#prop-action').val() + ' with-interface ' + $('#expert_selected option:selected').val()
+ ' { ' + $("#input_deviceClass").val() + ":" + $("#input_deviceSubClass").val() + ":"
+ $('#input_deviceProtocol').val() + ' }');
}
$('#myModal').modal('hide');
}
</script>
|
