Commit a6db1130 authored by Ad Schellevis's avatar Ad Schellevis

(openvpn client) fix javascript code and improve spacing,...

(openvpn client) fix javascript code and improve spacing, https://github.com/opnsense/core/issues/1005
parent c38a74bb
...@@ -361,14 +361,6 @@ $main_buttons = array( ...@@ -361,14 +361,6 @@ $main_buttons = array(
<script type="text/javascript"> <script type="text/javascript">
//<![CDATA[ //<![CDATA[
$( document ).ready(function() { $( document ).ready(function() {
// init form (old stuff)
if (document.iform != undefined) {
mode_change();
autokey_change();
tlsauth_change();
useproxy_changed();
}
// link delete buttons // link delete buttons
$(".act_delete").click(function(){ $(".act_delete").click(function(){
var id = $(this).data("id"); var id = $(this).data("id");
...@@ -430,90 +422,70 @@ $( document ).ready(function() { ...@@ -430,90 +422,70 @@ $( document ).ready(function() {
}); });
// watch scroll position and set to last known on page load // watch scroll position and set to last known on page load
watchScrollPosition(); watchScrollPosition();
});
$("#mode").change(function(){
function mode_change() { switch($(this).val()) {
index = document.iform.mode.selectedIndex;
value = document.iform.mode.options[index].value;
switch(value) {
case "p2p_tls": case "p2p_tls":
document.getElementById("tls").style.display=""; $(".tls_option").show();
document.getElementById("tls_ca").style.display=""; $(".psk_option").hide();
document.getElementById("tls_cert").style.display="";
document.getElementById("psk").style.display="none";
break; break;
case "p2p_shared_key": case "p2p_shared_key":
document.getElementById("tls").style.display="none"; $(".psk_option").show();
document.getElementById("tls_ca").style.display="none"; $(".tls_option").hide();
document.getElementById("tls_cert").style.display="none";
document.getElementById("psk").style.display="";
break; break;
} }
} });
$("#mode").change();
function dev_mode_change() { $("#dev_mode").change(function(){
index = document.iform.dev_mode.selectedIndex; switch($(this).val()) {
value = document.iform.dev_mode.options[index].value;
switch(value) {
case "tun": case "tun":
document.getElementById("chkboxNoTunIPv6").style.display=""; $(".chkboxNoTunIPv6").show();
break; break;
case "tap": case "tap":
document.getElementById("chkboxNoTunIPv6").style.display="none"; $(".chkboxNoTunIPv6").hide();
break; break;
} }
} });
$("#dev_mode").change();
function autokey_change() { $("#autokey_enable").change(function(){
if (document.iform.autokey_enable != undefined && document.iform.autokey_enable.checked) { if ($("#autokey_enable:checked").val() != undefined) {
document.getElementById("autokey_opts").style.display="none"; $("#autokey_opts").hide();
} else { } else {
document.getElementById("autokey_opts").style.display=""; $("#autokey_opts").show();
} }
} });
$("#autokey_enable").change();
function useproxy_changed() { $("#proxy_authtype").change(function(){
if ($('#proxy_authtype').val() != 'none') { if ($('#proxy_authtype').val() != 'none') {
$('#proxy_authtype_opts').show(); $('#proxy_authtype_opts').show();
} else { } else {
$('#proxy_authtype_opts').hide(); $('#proxy_authtype_opts').hide();
} }
} });
$("#proxy_authtype").change();
function tlsauth_change() {
<?php if (empty($pconfig['tls'])) :
?>
if (document.iform.tlsauth_enable.checked)
document.getElementById("tlsauth_opts").style.display="";
else
document.getElementById("tlsauth_opts").style.display="none";
<?php
endif; ?>
autotls_change();
}
function autotls_change() {
<?php if (empty($pconfig['tls'])) :
?>
autocheck = document.iform.autotls_enable.checked;
<?php
else :
?>
autocheck = false;
<?php
endif; ?>
if (document.iform.tlsauth_enable.checked && !autocheck) { $("#autotls_enable").change(function(){
document.getElementById("autotls_opts").style.display=""; if ($("#autotls_enable:checked").val() != undefined) {
$("#autotls_opts").hide();
} else { } else {
document.getElementById("autotls_opts").style.display="none"; $("#autotls_opts").show();
} }
} });
$("#tlsauth_enable").change(function(){
if ($("#tlsauth_opts").val() != undefined) {
if ($("#tlsauth_enable:checked").val() != undefined) {
$("#tlsauth_opts").show();
} else {
$("#tlsauth_opts").hide();
}
}
$("#autotls_enable").change();
});
$("#tlsauth_enable").change();
});
//]]> //]]>
</script> </script>
<section class="page-content-main"> <section class="page-content-main">
...@@ -526,11 +498,11 @@ endif; ?> ...@@ -526,11 +498,11 @@ endif; ?>
if (isset($savemsg)) { if (isset($savemsg)) {
print_info_box($savemsg); print_info_box($savemsg);
}?> }?>
<section class="col-xs-12">
<div class="tab-content content-box col-xs-12">
<?php <?php
if ($act=="new" || $act=="edit") :?> if ($act=="new" || $act=="edit") :?>
<form method="post" name="iform" id="iform"> <form method="post" name="iform" id="iform">
<section class="col-xs-12">
<div class="tab-content content-box col-xs-12">
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-striped opnsense_standard_table_form"> <table class="table table-striped opnsense_standard_table_form">
<tr> <tr>
...@@ -552,7 +524,7 @@ endif; ?> ...@@ -552,7 +524,7 @@ endif; ?>
<tr> <tr>
<td><i class="fa fa-info-circle text-muted"></i> <?=gettext("Server Mode");?></td> <td><i class="fa fa-info-circle text-muted"></i> <?=gettext("Server Mode");?></td>
<td> <td>
<select name="mode" id="mode" class="form-control" onchange="mode_change()"> <select name="mode" id="mode">
<?php <?php
$openvpn_client_modes = array( $openvpn_client_modes = array(
'p2p_tls' => gettext("Peer to Peer ( SSL/TLS )"), 'p2p_tls' => gettext("Peer to Peer ( SSL/TLS )"),
...@@ -587,7 +559,7 @@ endif; ?> ...@@ -587,7 +559,7 @@ endif; ?>
<tr> <tr>
<td><i class="fa fa-info-circle text-muted"></i> <?=gettext("Device mode");?></td> <td><i class="fa fa-info-circle text-muted"></i> <?=gettext("Device mode");?></td>
<td> <td>
<select name='dev_mode' class="form-control" onchange="dev_mode_change()"> <select name="dev_mode" id="dev_mode">
<?php <?php
foreach (array("tun", "tap") as $mode) : foreach (array("tun", "tap") as $mode) :
$selected = ""; $selected = "";
...@@ -676,7 +648,7 @@ endif; ?> ...@@ -676,7 +648,7 @@ endif; ?>
<td><i class="fa fa-info-circle text-muted"></i> <?=gettext("Proxy authentication extra options");?></td> <td><i class="fa fa-info-circle text-muted"></i> <?=gettext("Proxy authentication extra options");?></td>
<td> <td>
<?=gettext("Authentication method"); ?> <?=gettext("Authentication method"); ?>
<select name="proxy_authtype" id="proxy_authtype" class="form-control select" onchange="useproxy_changed()"> <select name="proxy_authtype" id="proxy_authtype" class="form-control select">
<option value="none" <?=$pconfig['proxy_authtype'] == "none" ? "selected=\"selected\"" : "" ?> > <?=gettext("none"); ?></option> <option value="none" <?=$pconfig['proxy_authtype'] == "none" ? "selected=\"selected\"" : "" ?> > <?=gettext("none"); ?></option>
<option value="basic" <?=$pconfig['proxy_authtype'] == "basic" ? "selected=\"selected\"" : "" ?> > <?=gettext("basic"); ?></option> <option value="basic" <?=$pconfig['proxy_authtype'] == "basic" ? "selected=\"selected\"" : "" ?> > <?=gettext("basic"); ?></option>
<option value="basic" <?=$pconfig['proxy_authtype'] == "ntlm" ? "selected=\"selected\"" : "" ?> > <?=gettext("ntlm"); ?></option> <option value="basic" <?=$pconfig['proxy_authtype'] == "ntlm" ? "selected=\"selected\"" : "" ?> > <?=gettext("ntlm"); ?></option>
...@@ -708,15 +680,20 @@ endif; ?> ...@@ -708,15 +680,20 @@ endif; ?>
</div> </div>
</td> </td>
</tr> </tr>
</table>
</div>
</div>
</section>
<section class="col-xs-12">
<div class="tab-content content-box col-xs-12">
<div class="table-responsive">
<table class="table table-striped opnsense_standard_table_form">
<tr> <tr>
<td colspan="2" class="list" height="12"></td> <td colspan="2"><strong><?=gettext("User Authentication Settings"); ?></strong></td>
</tr>
<tr>
<td colspan="2"><?=gettext("User Authentication Settings"); ?></td>
</tr> </tr>
<tr> <tr>
<td><a id="help_for_auth_user_pass" href="#" class="showhelp"><i class="fa fa-info-circle"></i></a> <?=gettext("User name/pass"); ?></td> <td width="22%"><a id="help_for_auth_user_pass" href="#" class="showhelp"><i class="fa fa-info-circle"></i></a> <?=gettext("User name/pass"); ?></td>
<td> <td width="78%">
<div><?=gettext("Username"); ?></div> <div><?=gettext("Username"); ?></div>
<div><input name="auth_user" id="auth_user" class="form-control unknown" type="text" size="20" value="<?=htmlspecialchars($pconfig['auth_user']);?>" /></div> <div><input name="auth_user" id="auth_user" class="form-control unknown" type="text" size="20" value="<?=htmlspecialchars($pconfig['auth_user']);?>" /></div>
<div><?=gettext("Password"); ?></div> <div><?=gettext("Password"); ?></div>
...@@ -727,18 +704,27 @@ endif; ?> ...@@ -727,18 +704,27 @@ endif; ?>
<br/> <br/>
</td> </td>
</tr> </tr>
</table>
</div>
</div>
</section>
<section class="col-xs-12">
<div class="tab-content content-box col-xs-12">
<div class="table-responsive">
<table class="table table-striped opnsense_standard_table_form">
<tr> <tr>
<td colspan="2"><?=gettext("Cryptographic Settings"); ?></td> <td width="22%"><strong><?=gettext("Cryptographic Settings"); ?></strong></td>
<td width="78%"></td>
</tr> </tr>
<tr id="tls"> <tr class="tls_option">
<td><i class="fa fa-info-circle text-muted"></i> <?=gettext("TLS Authentication"); ?></td> <td><i class="fa fa-info-circle text-muted"></i> <?=gettext("TLS Authentication"); ?></td>
<td> <td>
<input name="tlsauth_enable" id="tlsauth_enable" type="checkbox" value="yes" <?= !empty($pconfig['tlsauth_enable']) ? "checked=\"checked\"" : "";?> onclick="tlsauth_change()" /> <input name="tlsauth_enable" id="tlsauth_enable" type="checkbox" value="yes" <?= !empty($pconfig['tlsauth_enable']) ? "checked=\"checked\"" : "";?> />
<?=gettext("Enable authentication of TLS packets"); ?>. <?=gettext("Enable authentication of TLS packets"); ?>.
<?php <?php
if (empty($pconfig['tls'])) :?> if (empty($pconfig['tls'])) :?>
<div id="tlsauth_opts"> <div id="tlsauth_opts">
<input name="autotls_enable" id="autotls_enable" type="checkbox" value="yes" <?= !empty($pconfig['autotls_enable']) ? "checked=\"checked\"" : "";?> onclick="autotls_change()" > <input name="autotls_enable" id="autotls_enable" type="checkbox" value="yes" <?= !empty($pconfig['autotls_enable']) ? "checked=\"checked\"" : "";?> >
<?=gettext("Automatically generate a shared TLS authentication key"); ?>. <?=gettext("Automatically generate a shared TLS authentication key"); ?>.
</div> </div>
<?php <?php
...@@ -749,7 +735,7 @@ endif; ?> ...@@ -749,7 +735,7 @@ endif; ?>
</div> </div>
</td> </td>
</tr> </tr>
<tr id="tls_ca"> <tr class="tls_option">
<td><i class="fa fa-info-circle text-muted"></i> <?=gettext("Peer Certificate Authority"); ?></td> <td><i class="fa fa-info-circle text-muted"></i> <?=gettext("Peer Certificate Authority"); ?></td>
<td> <td>
<?php <?php
...@@ -773,7 +759,7 @@ endif; ?> ...@@ -773,7 +759,7 @@ endif; ?>
endif; ?> endif; ?>
</td> </td>
</tr> </tr>
<tr id="tls_cert"> <tr class="tls_option">
<td><i class="fa fa-info-circle text-muted"></i> <?=gettext("Client Certificate"); ?></td> <td><i class="fa fa-info-circle text-muted"></i> <?=gettext("Client Certificate"); ?></td>
<td> <td>
<select name='certref' class="form-control"> <select name='certref' class="form-control">
...@@ -813,12 +799,12 @@ endif; ?> ...@@ -813,12 +799,12 @@ endif; ?>
endif; ?> endif; ?>
</td> </td>
</tr> </tr>
<tr id="psk"> <tr class="psk_option">
<td><?=gettext("Shared Key"); ?></td> <td><i class="fa fa-info-circle text-muted"></i> <?=gettext("Shared Key"); ?></td>
<td> <td>
<?php <?php
if (empty($pconfig['shared_key'])) :?> if (empty($pconfig['shared_key'])) :?>
<input name="autokey_enable" id="autokey_enable" type="checkbox" value="yes" <?= !empty($pconfig['autokey_enable']) ? "checked=\"checked\"" : "";?> onclick="autokey_change()" /> <input name="autokey_enable" id="autokey_enable" type="checkbox" value="yes" <?= !empty($pconfig['autokey_enable']) ? "checked=\"checked\"" : "";?> />
<?=gettext("Automatically generate a shared key"); ?>. <?=gettext("Automatically generate a shared key"); ?>.
<?php <?php
endif; ?> endif; ?>
...@@ -882,15 +868,20 @@ endif; ?> ...@@ -882,15 +868,20 @@ endif; ?>
</select> </select>
</td> </td>
</tr> </tr>
</table>
</div>
</div>
</section>
<section class="col-xs-12">
<div class="tab-content content-box col-xs-12">
<div class="table-responsive">
<table class="table table-striped opnsense_standard_table_form">
<tr> <tr>
<td colspan="2" class="list" height="12"></td> <td colspan="2"><strong><?=gettext("Tunnel Settings"); ?></strong></td>
</tr>
<tr>
<td colspan="2"><?=gettext("Tunnel Settings"); ?></td>
</tr> </tr>
<tr> <tr>
<td><a id="help_for_tunnel_network" href="#" class="showhelp"><i class="fa fa-info-circle"></i></a> <?=gettext("IPv4 Tunnel Network"); ?></td> <td width="22%"><a id="help_for_tunnel_network" href="#" class="showhelp"><i class="fa fa-info-circle"></i></a> <?=gettext("IPv4 Tunnel Network"); ?></td>
<td> <td width="78%">
<input name="tunnel_network" type="text" class="form-control unknown" size="20" value="<?=$pconfig['tunnel_network'];?>" /> <input name="tunnel_network" type="text" class="form-control unknown" size="20" value="<?=$pconfig['tunnel_network'];?>" />
<div class="hidden" for="help_for_tunnel_network"> <div class="hidden" for="help_for_tunnel_network">
<?=gettext("This is the virtual network used for private " . <?=gettext("This is the virtual network used for private " .
...@@ -989,7 +980,7 @@ endif; ?> ...@@ -989,7 +980,7 @@ endif; ?>
</div> </div>
</td> </td>
</tr> </tr>
<tr id="chkboxNoTunIPv6"> <tr class="chkboxNoTunIPv6">
<td><a id="help_for_no_tun_ipv6" href="#" class="showhelp"><i class="fa fa-info-circle"></i></a> <?=gettext("Disable IPv6"); ?></td> <td><a id="help_for_no_tun_ipv6" href="#" class="showhelp"><i class="fa fa-info-circle"></i></a> <?=gettext("Disable IPv6"); ?></td>
<td> <td>
<input name="no_tun_ipv6" type="checkbox" value="yes" <?=!empty($pconfig['no_tun_ipv6']) ? "checked=\"checked\"" : "" ;?> /> <input name="no_tun_ipv6" type="checkbox" value="yes" <?=!empty($pconfig['no_tun_ipv6']) ? "checked=\"checked\"" : "" ;?> />
...@@ -1016,15 +1007,20 @@ endif; ?> ...@@ -1016,15 +1007,20 @@ endif; ?>
</div> </div>
</td> </td>
</tr> </tr>
</table>
</div>
</div>
</section>
<section class="col-xs-12">
<div class="tab-content content-box col-xs-12">
<div class="table-responsive">
<table class="table table-striped opnsense_standard_table_form">
<tr> <tr>
<td colspan="2" class="list" height="12"></td> <td colspan="2"><strong><?=gettext("Advanced configuration"); ?></strong></td>
</tr>
<tr>
<td colspan="2"><?=gettext("Advanced configuration"); ?></td>
</tr> </tr>
<tr> <tr>
<td><a id="help_for_custom_options" href="#" class="showhelp"><i class="fa fa-info-circle"></i></a> <?=gettext("Advanced"); ?></td> <td width="22%"><a id="help_for_custom_options" href="#" class="showhelp"><i class="fa fa-info-circle"></i></a> <?=gettext("Advanced"); ?></td>
<td> <td width="78%">
<textarea rows="6" cols="78" name="custom_options" id="custom_options"><?=$pconfig['custom_options'];?></textarea><br /> <textarea rows="6" cols="78" name="custom_options" id="custom_options"><?=$pconfig['custom_options'];?></textarea><br />
<div class="hidden" for="help_for_custom_options"> <div class="hidden" for="help_for_custom_options">
<?=gettext("Enter any additional options you would like to add to the OpenVPN client configuration here, separated by a semicolon"); ?><br /> <?=gettext("Enter any additional options you would like to add to the OpenVPN client configuration here, separated by a semicolon"); ?><br />
...@@ -1056,8 +1052,13 @@ endif; ?> ...@@ -1056,8 +1052,13 @@ endif; ?>
</td> </td>
</tr> </tr>
</table> </table>
<br /> </div>
<table width="100%" border="0" cellpadding="6" cellspacing="0" summary="icons"> </div>
</section>
<section class="col-xs-12">
<div class="tab-content content-box col-xs-12">
<div class="table-responsive">
<table class="table table-striped opnsense_standard_table_form">
<tr> <tr>
<td>&nbsp;</td> <td>&nbsp;</td>
<td width="78%"> <td width="78%">
...@@ -1068,14 +1069,19 @@ endif; ?> ...@@ -1068,14 +1069,19 @@ endif; ?>
<input name="id" type="hidden" value="<?=htmlspecialchars($id);?>" /> <input name="id" type="hidden" value="<?=htmlspecialchars($id);?>" />
<?php <?php
endif; ?> endif; ?>
<br/><br/>
</td> </td>
</tr> </tr>
</table> </table>
</div> </div>
</div>
</section>
</form> </form>
<?php <?php
else:?> else:?>
<form method="post" name="iform2" id="iform2"> <form method="post" name="iform2" id="iform2">
<section class="col-xs-12">
<div class="tab-content content-box col-xs-12">
<input type="hidden" id="id" name="id" value="" /> <input type="hidden" id="id" name="id" value="" />
<input type="hidden" id="action" name="act" value="" /> <input type="hidden" id="action" name="act" value="" />
<table class="table table-striped"> <table class="table table-striped">
...@@ -1141,13 +1147,13 @@ endif; ?> ...@@ -1141,13 +1147,13 @@ endif; ?>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div>
</section>
</form> </form>
<?php <?php
endif; ?> endif; ?>
</div> </div>
</section>
</div>
</div> </div>
</section> </section>
<?php include("foot.inc"); ?> <?php include("foot.inc"); ?>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment