luci-mod-network: move wifi overview markup and JS code into external files

Signed-off-by: Jo-Philipp Wich <jo@mein.io>

2 files changed, 61 insertions, 127 deletions

diff --git a/modules/luci-mod-network/luasrc/view/admin_network/wifi_overview.htm b/modules/luci-mod-network/luasrc/view/admin_network/wifi_overview.htm
new file mode 100644
index 0000000000..89bb404fd8
--- /dev/null
+++ b/modules/luci-mod-network/luasrc/view/admin_network/wifi_overview.htm
@@ -0,0 +1,61 @@
+<div class="cbi-section-node">
+	<div class="table">
+		<!-- physical device -->
+		<div class="tr cbi-rowstyle-2">
+			<div class="td col-2 center middle">
+				<span class="ifacebadge"><img src="<%=resource%>/icons/wifi_disabled.png" id="<%=self.dev:name()%>-iw-upstate" /> <%=self.dev:name()%></span>
+			</div>
+			<div class="td col-7 left middle">
+				<big><strong><%=self.hw%></strong></big><br />
+				<span id="<%=self.dev:name()%>-iw-devinfo"></span>
+			</div>
+			<div class="td middle cbi-section-actions">
+				<div>
+					<input type="button" class="cbi-button cbi-button-neutral" title="<%:Restart radio interface%>" value="<%:Restart%>" data-radio="<%=self.dev:name()%>" onclick="wifi_restart(event)" />
+					<input type="button" class="cbi-button cbi-button-action important" title="<%:Find and join network%>" value="<%:Scan%>" onclick="cbi_submit(this, 'device', '<%=self.dev:name()%>', '<%=url('admin/network/wireless_join')%>')" />
+					<input type="button" class="cbi-button cbi-button-add" title="<%:Provide new network%>" value="<%:Add%>" onclick="cbi_submit(this, 'device', '<%=self.dev:name()%>', '<%=url('admin/network/wireless_add')%>')" />
+				</div>
+			</div>
+		</div>
+		<!-- /physical device -->
+
+		<!-- network list -->
+		<% if #self.wnets > 0 then %>
+			<% for i, net in ipairs(self.wnets) do local disabled = (self.dev:get("disabled") == "1" or net:get("disabled") == "1") %>
+			<div class="tr cbi-rowstyle-<%=1 + ((i-1) % 2)%>">
+				<div class="td col-2 center middle" id="<%=net:id()%>-iw-signal">
+					<span class="ifacebadge" title="<%:Not associated%>"><img src="<%=resource%>/icons/signal-<%= disabled and "none" or "0" %>.png" /> 0%</span>
+				</div>
+				<div class="td col-7 left middle" id="<%=net:id()%>-iw-status" data-network="<%=net:id()%>" data-disabled="<%= disabled and "true" or "false" %>">
+					<em><%= disabled and translate("Wireless is disabled") or translate("Collecting data...") %></em>
+				</div>
+				<div class="td middle cbi-section-actions">
+					<div>
+						<% if disabled then %>
+							<input name="cbid.wireless.<%=net:name()%>.__disable__" type="hidden" value="1" />
+							<input name="cbi.apply" type="submit" class="cbi-button cbi-button-neutral" title="<%:Enable this network%>" value="<%:Enable%>" onclick="this.previousElementSibling.value='0'" />
+						<% else %>
+							<input name="cbid.wireless.<%=net:name()%>.__disable__" type="hidden" value="0" />
+							<input name="cbi.apply" type="submit" class="cbi-button cbi-button-neutral" title="<%:Disable this network%>" value="<%:Disable%>" onclick="this.previousElementSibling.value='1'" />
+						<% end %>
+
+						<input type="button" class="cbi-button cbi-button-action important" onclick="location.href='<%=net:adminlink()%>'" title="<%:Edit this network%>" value="<%:Edit%>" />
+
+						<input name="cbid.wireless.<%=net:name()%>.__delete__" type="hidden" value="" />
+						<input name="cbi.apply" type="submit" class="cbi-button cbi-button-negative" title="<%:Delete this network%>" value="<%:Remove%>" onclick="wifi_delete(event)" />
+					</div>
+				</div>
+			</div>
+			<% end %>
+		<% else %>
+			<div class="tr placeholder">
+				<div class="td">
+					<em><%:No network configured on this device%></em>
+				</div>
+			</div>
+		<% end %>
+		<!-- /network list -->
+	</div>
+</div>
+
+<script type="text/javascript" src="<%=resource%>/view/network/wireless.js"></script>
diff --git a/modules/luci-mod-network/luasrc/view/admin_network/wifi_overview_status.htm b/modules/luci-mod-network/luasrc/view/admin_network/wifi_overview_status.htm
deleted file mode 100644
index 9730bc2c92..0000000000
--- a/modules/luci-mod-network/luasrc/view/admin_network/wifi_overview_status.htm
+++ /dev/null
@@ -1,127 +0,0 @@
-<%#
- Copyright 2008-2009 Steven Barth <steven@midlink.org>
- Copyright 2008-2018 Jo-Philipp Wich <jo@mein.io>
- Licensed to the public under the Apache License 2.0.
--%>
-
-<script type="text/javascript">//<![CDATA[
-	function wifi_delete(ev) {
-		if (!confirm(<%=luci.http.write_json(translate('Really delete this wireless network? The deletion cannot be undone! You might lose access to this device if you are connected via this network.'))%>)) {
-			ev.preventDefault();
-			return false;
-		}
-
-		ev.target.previousElementSibling.value = '1';
-		return true;
-	}
-
-	function wifi_restart(ev) {
-		XHR.halt();
-
-		findParent(ev.target, '.table').querySelectorAll('[data-disabled="false"]').forEach(function(s) {
-			s.innerHTML = '<em><%:Wireless is restarting...%></em>';
-		});
-
-		(new XHR()).post('<%=url('admin/network/wireless_reconnect')%>/' + ev.target.getAttribute('data-radio'),
-			{ token: '<%=token%>' }, XHR.run);
-	}
-
-	var networks = [ ];
-
-	document.querySelectorAll('[data-network]').forEach(function(n) {
-		networks.push(n.getAttribute('data-network'));
-	});
-
-	XHR.poll(5, '<%=url('admin/network/wireless_status')%>/' + networks.join(','), null,
-		function(x, st)
-		{
-			if (st)
-			{
-				var rowstyle = 1;
-				var radiostate = { };
-
-				st.forEach(function(s) {
-					var r = radiostate[s.device.device] || (radiostate[s.device.device] = {});
-
-					s.is_assoc = (s.bssid && s.bssid != '00:00:00:00:00:00' && s.channel && s.mode != 'Unknown' && !s.disabled);
-
-					r.up        = r.up        || s.is_assoc;
-					r.channel   = r.channel   || s.channel;
-					r.bitrate   = r.bitrate   || s.bitrate;
-					r.frequency = r.frequency || s.frequency;
-				});
-
-				for( var i = 0; i < st.length; i++ )
-				{
-					var iw = st[i],
-					    sig = document.getElementById(iw.id + '-iw-signal'),
-					    info = document.getElementById(iw.id + '-iw-status'),
-					    disabled = (info && info.getAttribute('data-disabled') === 'true');
-
-					var p = iw.quality;
-					var q = disabled ? -1 : p;
-
-					var icon;
-					if (q < 0)
-						icon = "<%=resource%>/icons/signal-none.png";
-					else if (q == 0)
-						icon = "<%=resource%>/icons/signal-0.png";
-					else if (q < 25)
-						icon = "<%=resource%>/icons/signal-0-25.png";
-					else if (q < 50)
-						icon = "<%=resource%>/icons/signal-25-50.png";
-					else if (q < 75)
-						icon = "<%=resource%>/icons/signal-50-75.png";
-					else
-						icon = "<%=resource%>/icons/signal-75-100.png";
-
-
-					if (sig)
-						sig.innerHTML = String.format(
-							'<span class="ifacebadge" title="<%:Signal%>: %d <%:dBm%> / <%:Noise%>: %d <%:dBm%>"><img src="%s" /> %d%%</span>',
-							iw.signal, iw.noise, icon, p
-						);
-
-					if (info)
-					{
-						if (iw.is_assoc)
-							info.innerHTML = String.format(
-								'<strong><%:SSID%>:</strong> %h | ' +
-								'<strong><%:Mode%>:</strong> %s<br />' +
-								'<strong><%:BSSID%>:</strong> %s | ' +
-								'<strong><%:Encryption%>:</strong> %s',
-									iw.ssid, iw.mode, iw.bssid,
-									iw.encryption ? iw.encryption : '<%:None%>'
-							);
-						else
-							info.innerHTML = String.format(
-								'<strong><%:SSID%>:</strong> %h | ' +
-								'<strong><%:Mode%>:</strong> %s<br />' +
-								'<em>%s</em>',
-									iw.ssid || '?', iw.mode,
-									disabled ? '<em><%:Wireless is disabled%></em>'
-										     : '<em><%:Wireless is not associated%></em>'
-							);
-					}
-				}
-
-				for (var dev in radiostate)
-				{
-					var img = document.getElementById(dev + '-iw-upstate');
-					if (img)
-						img.src = '<%=resource%>/icons/wifi' + (radiostate[dev].up ? '' : '_disabled') + '.png';
-
-					var stat = document.getElementById(dev + '-iw-devinfo');
-					if (stat)
-						stat.innerHTML = String.format(
-							'<strong><%:Channel%>:</strong> %s (%s <%:GHz%>) | ' +
-							'<strong><%:Bitrate%>:</strong> %s <%:Mbit/s%>',
-								radiostate[dev].channel ? radiostate[dev].channel : '?',
-								radiostate[dev].frequency ? radiostate[dev].frequency : '?',
-								radiostate[dev].bitrate ? radiostate[dev].bitrate : '?'
-						);
-				}
-			}
-		}
-	);
-//]]></script>