File webif-diskgraph.diff of Package webif
Index: webif_0.3-8/www/cgi-bin/webif/data.sh
===================================================================
--- webif_0.3-8.orig/www/cgi-bin/webif/data.sh
+++ webif_0.3-8/www/cgi-bin/webif/data.sh
@@ -4,8 +4,10 @@ Content-Type: text/plain; charset=UTF-8
<?
TZ=GMT date
if [ "$FORM_if" ]; then
grep "${FORM_if}:" /proc/net/dev
+elif [ "$FORM_disk" ]; then
+ grep " ${FORM_disk} " /proc/diskstats
else
head -n 1 /proc/stat
fi
?>
Index: webif_0.3-8/www/cgi-bin/webif/graph_disk_svg.sh
===================================================================
--- /dev/null
+++ webif_0.3-8/www/cgi-bin/webif/graph_disk_svg.sh
@@ -0,0 +1,9 @@
+#!/usr/bin/webif-page
+Content-Type: image/svg+xml
+Content-Disposition: inline
+Pragma: no-cache
+
+<?
+. /etc/webif/webif-paths.sh
+cat $wwwdir/svggraph/graph_disk.svg
+?>
Index: webif_0.3-8/www/cgi-bin/webif/graphs-disk.sh
===================================================================
--- /dev/null
+++ webif_0.3-8/www/cgi-bin/webif/graphs-disk.sh
@@ -0,0 +1,20 @@
+#!/usr/bin/webif-page
+<?
+#
+#credit goes to arantius and GasFed
+#
+. /etc/webif/webif-paths.sh
+. $libdir/webif.sh
+. $cgidir/graphs-subcategories.sh
+
+header "Graphs" "graphs_disk_Throughput#Throughput>> $FORM_disk@TR<<" "@TR<<graphs_disk_Throughput#Throughput of Disk>> $FORM_disk" "" ""
+# IE (all versions) does not support the object tag with svg!
+# <object data="" width="600" height="300" type="image/svg+xml">@TR<<graphs_svg_required#This object requires the SVG support.>></object>
+?>
+<center>
+<?if [ "$FORM_disk" ] ?>
+ <embed src="/cgi-bin/webif/graph_disk_svg.sh?disk=<? echo -n ${FORM_disk} ?>"
+ width="600" height="300" type="image/svg+xml" />
+<?fi?>
+</center>
+<? footer ?>
Index: webif_0.3-8/www/cgi-bin/webif/graphs-subcategories.sh
===================================================================
--- webif_0.3-8.orig/www/cgi-bin/webif/graphs-subcategories.sh
+++ webif_0.3-8/www/cgi-bin/webif/graphs-subcategories.sh
@@ -3,10 +3,15 @@ subcategories() {
(
echo "#""#WEBIF:name:Graphs:1:graphs_cpu_subcategory#CPU:graphs-cpu.sh"
cat /proc/net/dev | \
egrep -v "No statistics available" | \
- sed -n '/:/{s/:.*//;s/^ *\(.*\)/##WEBIF:name:Graphs:2:graphs_if_Traffic#Traffic\>\> \1@TR\<\<:graphs-if.sh?if=\1/;p}'
+ egrep -v "0 0 0 0 0 0" | \
+ sed -n '/:/{s/:.*//;s/^ *\(.*\)/##WEBIF:name:Graphs:2:graphs_if_Traffic#Traffic\>\> \1@TR\<\<:graphs-if.sh?if=\1/;p}';
+ cat /proc/diskstats | \
+ egrep -v '(loop|ram|hd[a-z][0-9]{1,2}|sd[a-z][a-z]*[0-9]{1,2})' | \
+ egrep -v '0 0 0 0 0 0 0 0 0 0 0' | \
+ sed 's/^ *[0-9]* *[0-9]* *\([^ ]*\).*$/##WEBIF:name:Graphs:3:graphs_disk_Throughput#Throughput\>\> \1@TR\<\<:graphs-disk.sh?disk=\1/'
) | \
awk -v "selected=$2" \
- -v "rootdir=$rootdir" \
+ -v rootdir="$rootdir" \
-f /usr/lib/webif/subcategories.awk -
}
Index: webif_0.3-8/www/svggraph/graph_disk.svg
===================================================================
--- /dev/null
+++ webif_0.3-8/www/svggraph/graph_disk.svg
@@ -0,0 +1,290 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+OpenWRT port of this file based originally on the following:
+
+
+$Id: graph_cpu.php 41 2006-01-12 18:48:27Z mkasper $
+part of m0n0wall (http://m0n0.ch/wall)
+
+Copyright (C) 2004-2005 T. Lechat <dev@lechat.org>, Manuel Kasper <mk@neon1.net>
+and Jonathan Watt <jwatt@jwatt.org>.
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+1. Redistributions of source code must retain the above copyright notice,
+ this list of conditions and the following disclaimer.
+
+2. Redistributions in binary form must reproduce the above copyright
+ notice, this list of conditions and the following disclaimer in the
+ documentation and/or other materials provided with the distribution.
+
+THIS SOFTWARE IS PROVIDED ``AS IS'' AND ANY EXPRESS OR IMPLIED WARRANTIES,
+INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
+AUTHOR BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY,
+OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+POSSIBILITY OF SUCH DAMAGE.
+-->
+<svg xml:space='preserve' xmlns='http://www.w3.org/2000/svg'
+ xmlns:xlink='http://www.w3.org/1999/xlink'
+ width='100%' height='100%'
+ viewBox='0 0 600 300'
+ preserveAspectRatio='none'
+ onload='init(evt)'
+>
+<g id='graph'>
+ <rect id='bg' x1='0' y1='0' width='600' height='300' fill='white' />
+
+ <text id='graph_read_lbl' x='50' y='15' fill='#435370' text-anchor='end'>@TR<<graph_disk_Read#Read>></text>
+ <text id='graph_write_lbl' x='50' y='35' fill='#8092B3' text-anchor='end'>@TR<<graph_disk_Write#Write>></text>
+
+ <text id='graph_read_txt' x='54' y='15' fill='#435370'>--</text>
+ <text id='graph_write_txt' x='54' y='35' fill='#8092B3'>--</text>
+
+ <text id='switch_scale' x='200' y='35' fill='#435370' cursor='pointer'>@TR<<graph_if_Autoscale_follow#Autoscale (follow)>></text>
+
+ <text id='error' x='300' y='125' text-anchor='middle' visibility='hidden' fill='blue'>@TR<<graph_if_Cannot_get_data_iface#Cannot get data about interface>></text>
+ <text id='collect_initial' x='300' y='125' text-anchor='middle' visibility='hidden' fill='gray'>@TR<<graph_Collecting_initial_data#Collecting initial data, please wait...>></text>
+
+ <path id='grid' d='M 2 75 L 600 75 M 2 150 L 600 150 M 2 225 L 600 225' stroke='gray' stroke-opacity='0.5' />
+ <text id='grid_txt3' x='600' y='223' fill='gray' text-anchor='end'>--</text>
+ <text id='grid_txt2' x='600' y='148' fill='gray' text-anchor='end'>--</text>
+ <text id='grid_txt1' x='600' y='73' fill='gray' text-anchor='end'>--</text>
+
+ <path id='graph_write' d='' fill='none' stroke='#8092B3' stroke-width='2' stroke-opacity='0.8' />
+ <path id='graph_read' d='' fill='none' stroke='#435370' stroke-width='2' stroke-opacity='0.8' />
+
+ <line id='axis_x' x1='2' y1='299' x2='600' y2='299' stroke='black' />
+ <line id='axis_y' x1='1' y1='300' x2='1' y2='0' stroke='black' />
+</g>
+<script type="text/ecmascript">
+<![CDATA[
+if (typeof getURL == 'undefined') {
+ getURL = function(url, callback) {
+ if (!url) throw '@TR<<graph_No_URL_getURL#No URL for getURL>>';
+
+ try {
+ if (typeof callback.operationComplete == 'function') {
+ callback = callback.operationComplete;
+ }
+ } catch (e) {}
+
+ if (typeof callback != 'function') {
+ throw '@TR<<graph_No_callback_function#No callback function for getURL>>';
+ }
+
+ var http_request = null;
+ if (typeof XMLHttpRequest != 'undefined') {
+ http_request = new XMLHttpRequest();
+ } else if (typeof ActiveXObject != 'undefined') {
+ try {
+ http_request = new ActiveXObject('Msxml2.XMLHTTP');
+ } catch (e) {
+ try {
+ http_request = new ActiveXObject('Microsoft.XMLHTTP');
+ } catch (e) {}
+ }
+ }
+ if (!http_request) {
+ throw '@TR<<graph_Both_undefined#Both getURL and XMLHttpRequest are undefined>>';
+ }
+
+ http_request.onreadystatechange = function() {
+ if (http_request.readyState == 4) {
+ callback(
+ {
+ success : true,
+ content : http_request.responseText,
+ contentType : http_request.getResponseHeader("Content-Type")
+ }
+ );
+ }
+ }
+ http_request.open('GET', url, true);
+ http_request.send(null);
+ }
+}
+
+var SVGDoc = null;
+var last_diskRead = 0;
+var last_diskWrite = 0;
+var last_ugmt = 0;
+var max = 0;
+var plot_read = new Array();
+var plot_write = new Array();
+
+var max_num_points = 120; // maximum number of plot data points
+var step = 600 / max_num_points ;
+var scale_type = '@TR<<graph_if_follow#follow>>';
+
+var fetch_url='';
+
+function init(evt) {
+ /* hacked in fix for all browsers by spectra
+ * he says is 'ugly', and someone may want to redo the 'right' way */
+ var loc = document.location;
+ fetch_url = location.search.split('?');
+ fetch_url = loc.protocol + '//' + loc.host + '/cgi-bin/webif/data.sh?' + fetch_url[fetch_url.length-1];
+ /* end hacked in fix */
+ SVGDoc = evt.target.ownerDocument;
+ SVGDoc.getElementById("switch_scale").addEventListener("mousedown", switch_scale, false);
+
+ fetch_data();
+ setInterval('fetch_data()', 1000);
+}
+
+function switch_scale(event) {
+ scale_type = (scale_type == '@TR<<graph_if_up#up>>') ? '@TR<<graph_if_follow#follow>>' : '@TR<<graph_if_up#up>>';
+ SVGDoc.getElementById('switch_scale').firstChild.data = '@TR<<graph_if_AutoScale#AutoScale>> (' + scale_type + ')';
+}
+
+function fetch_data() {
+ if (fetch_url) {
+ getURL(fetch_url, plot_data);
+ } else {
+ handle_error();
+ }
+}
+
+function plot_data(obj) {
+ if (!obj.success) return handle_error(); // getURL failed to get data
+
+ // parse incoming data
+ // (format: "date" output, newline, proper line of /proc/net/dev)
+ var data=obj.content.split("\n");
+ var dateStr=data[0];
+ //fake timezone cause the real value might confuse JS
+ //dateStr=dateStr.replace(/ [A-Z]+ /, ' GMT ');
+ var ugmt=(Date.parse(dateStr))/1000;
+
+ data=data[1].split(/\s+|:/);
+ while (data[0]!=parseInt(data[0])) {
+ data.shift();
+
+ if (0==data.length) return;
+ }
+ // assume 512byte sector size, record kB
+ var diskRead=parseInt(data[5])/2;
+ var diskWrite=parseInt(data[9])/2;
+
+ if (!isNumber(diskRead) || !isNumber(diskWrite)) {
+ return handle_error();
+ }
+
+ var diff_ugmt = ugmt - last_ugmt;
+ var diff_diskRead = diskRead - last_diskRead;
+ var diff_diskWrite = diskWrite - last_diskWrite;
+
+ if (diff_ugmt == 0) diff_ugmt = 1; // avoid division by zero
+
+ last_ugmt = ugmt;
+ last_diskRead = diskRead;
+ last_diskWrite = diskWrite;
+
+ switch (plot_read.length) {
+ case 0:
+ SVGDoc.getElementById("collect_initial").setAttributeNS(null, 'visibility', 'visible');
+ plot_read[0] = diff_diskRead / diff_ugmt;
+ plot_write[0] = diff_diskWrite / diff_ugmt;
+ return;
+ case 1:
+ SVGDoc.getElementById("collect_initial").setAttributeNS(null, 'visibility', 'hidden');
+ break;
+ case max_num_points:
+ // shift plot to left if the maximum number of plot points has been reached
+ var i = 0;
+ while (i < max_num_points) {
+ plot_read[i] = plot_read[i+1];
+ plot_write[i] = plot_write[++i];
+ }
+ plot_read.length--;
+ plot_write.length--;
+ }
+
+ plot_read[plot_read.length] = diff_diskRead / diff_ugmt;
+ plot_write[plot_write.length]= diff_diskWrite / diff_ugmt;
+ var index_plot = plot_read.length - 1;
+
+ SVGDoc.getElementById('graph_read_txt').firstChild.data = formatSpeedBytes(plot_read[index_plot]);
+ SVGDoc.getElementById('graph_write_txt').firstChild.data = formatSpeedBytes(plot_write[index_plot]);
+
+ // determine peak for sensible scaling
+ if (scale_type == '@TR<<graph_if_up#up>>') {
+ if (plot_read[index_plot] > max) max = plot_read[index_plot];
+ if (plot_write[index_plot] > max) max = plot_write[index_plot];
+ } else if (scale_type == '@TR<<graph_if_follow#follow>>') {
+ i = 0;
+ max = 0;
+ while (i < plot_read.length) {
+ if (plot_read[i] > max) max = plot_read[i];
+ if (plot_write[i] > max) max = plot_write[i];
+ i++;
+ }
+ }
+
+ var rmax=makeRoundMax(max);
+
+ var scale = 298 / rmax;
+
+ // change labels accordingly
+ SVGDoc.getElementById('grid_txt1').firstChild.data = formatSpeedBytes(3*rmax/4);
+ SVGDoc.getElementById('grid_txt2').firstChild.data = formatSpeedBytes(2*rmax/4);
+ SVGDoc.getElementById('grid_txt3').firstChild.data = formatSpeedBytes(rmax/4);
+
+ var path_read = "M 0 " + (298 - (plot_read[0] * scale));
+ var path_write = "M 0 " + (298 - (plot_write[0] * scale));
+ for (i = 1; i < plot_read.length; i++) {
+ var x = step * i;
+ var y_in = 298 - (plot_read[i] * scale);
+ var y_out = 298 - (plot_write[i] * scale);
+ path_read += " L" + x + " " + y_in;
+ path_write += " L" + x + " " + y_out;
+ }
+
+ SVGDoc.getElementById('error').setAttributeNS(null, 'visibility', 'hidden');
+ SVGDoc.getElementById('graph_read').setAttributeNS(null, 'd', path_read);
+ SVGDoc.getElementById('graph_write').setAttributeNS(null, 'd', path_write);
+}
+
+function makeRoundMax(max) {
+ rmax = 1024;
+ i = 0;
+ while (max > rmax) {
+ i++;
+ if (i && (i % 4 == 0)) {
+ rmax *= 1.25;
+ } else {
+ rmax *= 2;
+ }
+
+ if (i == 8) rmax *= 1.024;
+ }
+ return rmax;
+}
+
+function handle_error() {
+ SVGDoc.getElementById("error").setAttributeNS(null, 'visibility', 'visible');
+}
+
+function isNumber(a) {
+ return typeof a == 'number' && isFinite(a);
+}
+
+function formatSpeedBytes(speed) {
+ // format speed in kbytes/sec, input: kbytes/sec
+ if (speed < 1024) return Math.round(speed) + " @TR<<graph_if_KB_s#KB/s>>";
+ if (speed < 1048576) return Math.round(speed / 10.24)/100 + " @TR<<graph_if_MB_s#MB/s>>";
+ if (speed < 1073741824) return Math.round(speed / 10485.76)/100 + " @TR<<graph_if_GB_s#GB/s>>";
+ // else
+ return Math.round(speed / 10737418.24)/100 + " @TR<<graph_if_TB_s#TB/s>>"; // wow!
+}
+
+]]>
+</script>
+</svg>
