applications/luci-firewall: complete rework firewall ui
[project/luci.git] / applications / luci-firewall / luasrc / view / cbi_addforward.htm
diff --git a/applications/luci-firewall/luasrc/view/cbi_addforward.htm b/applications/luci-firewall/luasrc/view/cbi_addforward.htm
new file mode 100644 (file)
index 0000000..6a49266
--- /dev/null
@@ -0,0 +1,90 @@
+<div class="cbi-section-create cbi-tblsection-create">
+       <br />
+       <table class="cbi-section-table" style="width:700px; margin-left:5px">
+               <tr class="cbi-section-table-titles">
+                       <th class="cbi-section-table-cell" colspan="6"><%:New port forward%>:</th>
+               </tr>
+               <tr class="cbi-section-table-descr">
+                       <th class="cbi-section-table-cell"><%:Name%></th>
+                       <th class="cbi-section-table-cell"><%:Protocol%></th>
+                       <th class="cbi-section-table-cell"><%:External port%></th>
+                       <th class="cbi-section-table-cell"><%:Internal IP address%></th>
+                       <th class="cbi-section-table-cell"><%:Internal port%></th>
+                       <th class="cbi-section-table-cell"></th>
+               </tr>
+               <tr class="cbi-section-table-row">
+                       <td class="cbi-section-table-cell">
+                               <input type="text" class="cbi-input-text" id="_newfwd.name" name="_newfwd.name" placeholder="<%:New port forward%>" />
+                       </td>
+                       <td class="cbi-section-table-cell" style="width:110px">
+                               <select class="cbi-input-select" id="_newfwd.proto" name="_newfwd.proto">
+                                       <option value="tcp udp">TCP+UDP</option>
+                                       <option value="tcp">TCP</option>
+                                       <option value="udp">UDP</option>
+                                       <option value="other"><%:Other...%></option>
+                               </select>
+                       </td>
+                       <td class="cbi-section-table-cell" style="width:110px">
+                               <input type="text" class="cbi-input-text" id="_newfwd.extport" name="_newfwd.extport" />
+                       </td>
+                       <td class="cbi-section-table-cell" style="width:110px">
+                               <input type="text" class="cbi-input-text" id="_newfwd.intaddr" name="_newfwd.intaddr" />
+                       </td>
+                       <td class="cbi-section-table-cell" style="width:110px">
+                               <input type="text" class="cbi-input-text" id="_newfwd.intport" name="_newfwd.intport" />
+                       </td>
+                       <td class="cbi-section-table-cell">
+                               <input type="submit" class="cbi-button cbi-button-add" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>.<%=section%>" value="<%:Add%>" />
+                       </td>
+               </tr>
+       </table>
+
+       <script type="text/javascript">//<![CDATA[
+               cbi_validate_field('_newfwd.extport', true, 'portrange');
+               cbi_validate_field('_newfwd.intaddr', true, 'host');
+               cbi_validate_field('_newfwd.intport', true, 'portrange');
+
+               cbi_combobox_init('_newfwd.intaddr', {
+                       <% local i, e; for i, e in ipairs(luci.sys.net.arptable()) do -%>
+                               <%- if i > 1 then %>,<% end -%>'<%=e["IP address"]%>': '<%=e["IP address"]%>'
+                       <%- end %> }, '', '<%: -- custom -- %>');
+
+               cbi_bind(document.getElementById('_newfwd.extport'), 'blur',
+                       function() {
+                               var n = document.getElementById('_newfwd.name');
+                               var p = document.getElementById('_newfwd.proto');
+                               var i = document.getElementById('_newfwd.intport');
+                               var hints = {
+                               /*  port    name     0=both, 1=tcp, 2=udp, 3=other */
+                                       21:   [ 'FTP',   1 ],
+                                       22:   [ 'SSH',   1 ],
+                                       53:   [ 'DNS',   0 ],
+                                       80:   [ 'HTTP',  1 ],
+                                       443:  [ 'HTTPS', 1 ],
+                                       3389: [ 'RDP',   1 ],
+                                       5900: [ 'VNC',   1 ],
+                               };
+
+                               if (!this.className.match(/invalid/))
+                               {
+                                       if (!i.value) i.value = this.value;
+
+                                       var hint = hints[this.value || 0] || hints[i.value || 0];
+                                       if (hint)
+                                       {
+                                               p.selectedIndex = hint[1];
+
+                                               if (!n.value)
+                                                       n.value = hint[0];
+                                       }
+                                       else if (!n.value)
+                                       {
+                                               n.value = 'Forward' + this.value;
+                                       }
+                               }
+                       });
+
+
+               cbi_validate_field('cbi.cts.<%=self.config%>.<%=self.sectiontype%>.<%=section%>', true, 'uciname');
+       //]]></script>
+</div>