cshark.htm 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290
  1. <%#
  2. LuCI - Lua Configuration Interface
  3. Copyright (C) 2014, QA Cafe, Inc.
  4. Licensed under the Apache License, Version 2.0 (the "License");
  5. you may not use this file except in compliance with the License.
  6. You may obtain a copy of the License at
  7. http://www.apache.org/licenses/LICENSE-2.0
  8. $Id$
  9. -%>
  10. <fieldset class="cbi-section">
  11. <legend><%:Start network capture%></legend>
  12. <div class="cbi-section-node">
  13. <table class="cbi-section-table">
  14. <tr>
  15. <th><%:Interface%></th>
  16. <th colspan='2'><%:seconds, packets, bytes%></th>
  17. <th><%:Filter%></th>
  18. <th><%:Actions%></th>
  19. </tr>
  20. <tr>
  21. <td>
  22. <select title="<%:Interface%>" style="width:auto" id="s_interfaces">
  23. <%
  24. local nixio = require "nixio"
  25. for k, v in ipairs(nixio.getifaddrs()) do
  26. if v.family == "packet" then
  27. %>
  28. <option value="<%=v.name%>"><%=v.name%> </option>
  29. <%
  30. end
  31. end
  32. %>
  33. <option value="any"><%:any%></option>
  34. </select>
  35. </td>
  36. <td colspan='2'>
  37. <input id="tx_value" type="text" value="0" />
  38. <select title="<%:timeout, bytes, seconds%>" id="s_value_type" style="width:auto">
  39. <option value="T"><%:seconds%></option>
  40. <option value="P"><%:packets%></option>
  41. <option value="S"><%:bytes%></option>
  42. </select>
  43. </td>
  44. <td>
  45. <input style="margin: 5px 0" type="text" title="<%:Filter%>" placeholder="filter" id="i_filter" />
  46. </td>
  47. <td>
  48. <input type="button" id="bt_action" data-action="start" value="<%:Start capture%>" class="cbi-button" />
  49. </td>
  50. </tr>
  51. </table>
  52. </div>
  53. </fieldset>
  54. <fieldset class="cbi-section">
  55. <span id="cshark-rc-output"></span>
  56. </fieldset>
  57. <hr/>
  58. <fieldset class="cbi-section">
  59. <legend><%:Capture links%></legend>
  60. <div class="cbi-section-node">
  61. <table id="t_link_list" class="cbi-section-table">
  62. <tr class="cbi-section-table-titles">
  63. <th class="cbi-section-table-cell"><%:Capture URL%></th>
  64. <th class="cbi-section-table-cell"><%:Capture time%></th>
  65. </tr>
  66. </table>
  67. </div>
  68. </fieldset>
  69. <fieldset class="cbi-section">
  70. <a href="https://support.cloudshark.org/openwrt/openwrt-cloudshark.html" target="_blank">Visit support.cloudshark.org for help.</a>
  71. </fieldset>
  72. <hr/>
  73. <script type="text/javascript">//<![CDATA[
  74. var capture_running = 0;
  75. var pid_file = 0;
  76. var bt_action = document.getElementById('bt_action');
  77. var a_clear_links = document.getElementById('a_clear_links');
  78. var output = document.getElementById('cshark-rc-output');
  79. var loader = '<img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" width="16" height="16" style="vertical-align:middle" /> ';
  80. var msg = { 'start' : '<%:Waiting for capture to complete...%>', 'stop' : '<%:Waiting for upload to complete...%>' };
  81. var status_msg = msg['start'];
  82. function get_date(timestamp)
  83. {
  84. function pad_str(str)
  85. {
  86. return (str < 10) ? "0" + str : str;
  87. }
  88. var current_date = new Date(timestamp * 1000);
  89. return current_date.getFullYear() + "-" +
  90. pad_str(current_date.getMonth() + 1) + "-" +
  91. pad_str(current_date.getDate()) + " " +
  92. pad_str(current_date.getHours()) + ":" +
  93. pad_str(current_date.getMinutes()) + ":" +
  94. pad_str(current_date.getSeconds());
  95. }
  96. bt_action.onclick = function()
  97. {
  98. var action = this.getAttribute("data-action");
  99. var csxhr = new XHR();
  100. if (action == "stop")
  101. {
  102. update_status(action);
  103. bt_action.disabled = true;
  104. csxhr.get('<%=luci.dispatcher.build_url("admin", "network")%>/cshark_iface_dump_stop', null,
  105. function(x)
  106. {
  107. if (!x || x.responseText.trim() != "0")
  108. {
  109. update_status("failed", "Invalid response on stop.");
  110. }
  111. });
  112. }
  113. else if (action == "start")
  114. {
  115. var s_interfaces = document.getElementById('s_interfaces');
  116. var s_value_type = document.getElementById('s_value_type');
  117. var i_filter = document.getElementById('i_filter');
  118. var if_n = s_interfaces.selectedIndex;
  119. var t_n = s_value_type.selectedIndex;
  120. var ifname = s_interfaces.options[if_n].value.trim();
  121. var filter_val = i_filter.value.trim();
  122. var tx_val = document.getElementById('tx_value').value.trim();
  123. var type_val = s_value_type.options[t_n].value.trim();
  124. if (type_val != 'P' && type_val != 'T' && type_val != 'S') type_val = 'T';
  125. if (!ifname || !type_val) return;
  126. if (isNaN(tx_val)) return alert("<%:value for [seconds, packets, bytes] must be Integer%>");
  127. update_status(action);
  128. csxhr.get('<%=luci.dispatcher.build_url("admin", "network")%>/cshark_iface_dump_start/' + ifname + '/' + tx_val + '/' + type_val + '/'+ filter_val, null,
  129. function(x)
  130. {
  131. if (!x)
  132. update_status("failed", "Invalid response on start.");
  133. else
  134. update_status("running");
  135. });
  136. }
  137. }
  138. function update_status(status, message)
  139. {
  140. switch (status)
  141. {
  142. case 'start':
  143. case 'stop':
  144. status_msg = msg[status];
  145. output.innerHTML = loader + status_msg;
  146. break
  147. case 'running':
  148. if (capture_running) break;;
  149. output.innerHTML = loader + status_msg;
  150. bt_action.value = '<%:Stop capture%>';
  151. bt_action.setAttribute('data-action', 'stop');
  152. capture_running = 1;
  153. break;
  154. case 'completed':
  155. case 'failed':
  156. if (!capture_running) break;
  157. if (status == "completed")
  158. {
  159. link_list_update();
  160. }
  161. output.innerHTML = "<pre>" + message + "</pre>";
  162. bt_action.value = '<%:Start capture%>';
  163. bt_action.setAttribute('data-action', 'start');
  164. bt_action.disabled = false;
  165. capture_running = 0;
  166. break;
  167. }
  168. }
  169. function check_status()
  170. {
  171. XHR.poll(3, '<%=luci.dispatcher.build_url("admin", "network")%>/cshark_check_status', null,
  172. function(x, data)
  173. {
  174. if (!x)
  175. {
  176. if (capture_running)
  177. update_status("failed", "Invalid response when fetching status.");
  178. return;
  179. }
  180. console.log(data)
  181. update_status( (data.status == 1) && "running" || "completed", data.msg);
  182. })
  183. }
  184. function link_list_clear()
  185. {
  186. var csxhr_del = new XHR();
  187. csxhr_del.get('<%=luci.dispatcher.build_url("admin", "network")%>/cshark_link_list_clear', null,
  188. function(x)
  189. {
  190. if (!x)
  191. return false;
  192. link_list_update();
  193. });
  194. }
  195. function link_list_update()
  196. {
  197. var t_link = document.getElementById("t_link_list");
  198. if (!t_link) return;
  199. var row_count = t_link.rows.length;
  200. while(--row_count) t_link.deleteRow(row_count);
  201. var cell = t_link.insertRow(-1).insertCell(0);
  202. cell.colSpan = 2;
  203. cell.innerHTML = loader;
  204. var csxhr_link = new XHR();
  205. csxhr_link.get('<%=luci.dispatcher.build_url("admin", "network")%>/cshark_link_list_get', null,
  206. function(x, entries)
  207. {
  208. var row = t_link.deleteRow(1);
  209. if (!x) return;
  210. if (!entries || !entries.length)
  211. {
  212. var cell = t_link.insertRow(-1).insertCell(0);
  213. cell.colSpan = 2;
  214. cell.innerHTML = '<em><br />There are no captures available yet.</em>';
  215. return;
  216. }
  217. for (var i = 0, len = entries.length; i < len ; i++)
  218. {
  219. var entry = entries[i][0];
  220. if (!entry) continue;
  221. var data = entry.split(",");
  222. var url = data[0];
  223. var timestamp = data[1];
  224. var row = t_link.insertRow(-1);
  225. row.insertCell(0).innerHTML = '<a href="'+url+'" target="_blank">'+url+'</a>';
  226. row.insertCell(1).innerHTML = get_date(timestamp);
  227. }
  228. var cell = t_link.insertRow(-1).insertCell(0);
  229. cell.colSpan = 2;
  230. cell.style.textAlign="center";
  231. cell.innerHTML = '<input type="button" onclick="link_list_clear()" class="cbi-button" value ="<%:Clear list%>" />';
  232. })
  233. }
  234. check_status();
  235. link_list_update();
  236. //]]></script>