summaryrefslogtreecommitdiffhomepage
path: root/applications/luci-app-openvpn/luasrc/view/openvpn/cbi-select-input-add.htm
blob: 60f9e8e288a698382f727e21a882e8e5ea3afe33 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111

<script type="text/javascript">
//<![CDATA[
	function vpn_add()
	{
		var vpn_name     = div_add.querySelector("#instance_name1").value.replace(/[^\x00-\x7F]|[\s\.!@#$%^&*()\-+=\[\]{};':"\\|,<>\/?]/g,'');
		var vpn_template = div_add.querySelector("#instance_template").value;
		var form         = document.getElementsByName('cbi')[0];

		if (!vpn_name || !vpn_name.length)
		{
			return info_message(vpn_output, "<%=pcdata(translate("The 'Name' field must not be empty!"))%>", 2000);
		}

		document.getElementById("instance_name1").value = vpn_name;
		if (document.getElementById("cbi-openvpn-" + vpn_name) != null)
		{
			return info_message(vpn_output, "<%=pcdata(translate("Instance with that name already exists!"))%>", 2000);
		}

		if (!vpn_template || !vpn_template.length)
		{
			return info_message(vpn_output, "<%=pcdata(translate("Please select a valid VPN template!"))%>", 2000);
		}

		if (form)
		{
			form.submit();
		}
	}

	function vpn_upload()
	{
		var vpn_name = div_upload.querySelector("#instance_name2").value.replace(/[^\x00-\x7F]|[\s\.!@#$%^&*()\-+=\[\]{};':"\\|,<>\/?]/g,'');
		var vpn_file = document.getElementById("ovpn_file").value;
		var form     = document.getElementsByName('cbi')[0];

		if (!vpn_name || !vpn_name.length)
		{
			return info_message(vpn_output, "<%=pcdata(translate("The 'Name' field must not be empty!"))%>", 2000);
		}

		document.getElementById("instance_name2").value = vpn_name;
		if (document.getElementById("cbi-openvpn-" + vpn_name) != null)
		{
			return info_message(vpn_output, "<%=pcdata(translate("Instance with that name already exists!"))%>", 2000);
		}

		if (!vpn_file || !vpn_file.length)
		{
			return info_message(vpn_output, "<%=pcdata(translate("Please select a valid OVPN config file to upload!"))%>", 2000);
		}

		if (form)
		{
			form.enctype = 'multipart/form-data';
			form.action  = '<%=url('admin/vpn/openvpn/upload')%>';
			form.submit();
		}
	}

	function info_message(output, msg, timeout)
	{
		timeout = timeout || 0;
		output.innerHTML = '<em>' + msg + '</em>';
		if (timeout > 0)
		{
			setTimeout(function(){ output.innerHTML=""}, timeout);
		}
	}
//]]>
</script>

<%+openvpn/ovpn_css%>

<div class="cbi-section-node">
	<div class="table cbi-section-table">
		<h4><%:Template based configuration%></h4>
		<div class="tr cbi-section-table-row" id="div_add">
			<div class="td left">
				<input type="text" maxlength="20" placeholder="Instance name" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>.text" id="instance_name1" />
			</div>
			<div class="td left">
				<select id="instance_template" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>.select">
					<option value="" selected="selected" disabled="disabled"><%:Select template ...%></option>
					<%- for k, v in luci.util.kspairs(self.add_select_options) do %>
						<option value="<%=k%>"><%=luci.xml.pcdata(v)%></option>
					<% end -%>
				</select>
			</div>
			<div class="td left">
				<input class="btn cbi-button cbi-button-add" type="submit" onclick="vpn_add(); return false;" value="<%:Add%>" title="<%:Add template based configuration%>" /><br />
			</div>
		</div>
		<h4><%:OVPN configuration file upload%></h4>
		<div class="tr cbi-section-table-row" id="div_upload">
			<div class="td left">
				<input type="text" maxlength="20" placeholder="Instance name" name="instance_name2" id="instance_name2" />
			</div>
			<div class="td left">
				<input type="file" name="ovpn_file" id="ovpn_file" accept="application/x-openvpn-profile,.ovpn" />
			</div>
			<div class="td left">
				<input class="btn cbi-button cbi-button-add" type="submit" onclick="vpn_upload(); return false;" value="<%:Upload%>" title="<%:Upload ovpn file%>" />
			</div>
		</div>
	</div>
	<div class="vpn-output">
		<span id="vpn_output"></span>
	</div>
</div>