diff options
author | Scott Dale <sdale@pfsense.org> | 2008-03-17 01:55:45 +0000 |
---|---|---|
committer | Scott Dale <sdale@pfsense.org> | 2008-03-17 01:55:45 +0000 |
commit | 34eac803ea56372ba994fb961db5d9f64c90a8fe (patch) | |
tree | 7dd68991a20c91c28872435070fe0052d222675c /usr/local | |
parent | 62d57e6dca82bf4db55805af91f9b8c34b60707f (diff) | |
download | pfsense-34eac803ea56372ba994fb961db5d9f64c90a8fe.zip pfsense-34eac803ea56372ba994fb961db5d9f64c90a8fe.tar.gz |
Show loading icon while loading new widget through AJAX. Note: loading icon needs improvement.
Diffstat (limited to 'usr/local')
-rwxr-xr-x | usr/local/www/index.php | 65 | ||||
-rw-r--r-- | usr/local/www/javascript/index/sajax.js | 53 | ||||
-rw-r--r-- | usr/local/www/themes/metallic/images/misc/widget_loader.gif | bin | 0 -> 5794 bytes | |||
-rw-r--r-- | usr/local/www/themes/nervecenter/images/misc/widget_loader.gif | bin | 0 -> 5794 bytes | |||
-rw-r--r-- | usr/local/www/themes/pfsense-dropdown/images/misc/widget_loader.gif | bin | 0 -> 5794 bytes | |||
-rw-r--r-- | usr/local/www/themes/pfsense/images/misc/widget_loader.gif | bin | 0 -> 5794 bytes |
6 files changed, 72 insertions, 46 deletions
diff --git a/usr/local/www/index.php b/usr/local/www/index.php index cf8cafe..9dff35c 100755 --- a/usr/local/www/index.php +++ b/usr/local/www/index.php @@ -196,29 +196,35 @@ $jscriptstr = <<<EOD function widgetAjax(widget) { - uri = "widgets/widgets/" + widget + ".widget.php"; - var opt = { - // Use GET - method: 'get', - evalScripts: 'true', - asynchronous: true, - // Handle 404 - on404: function(t) { - alert('Error 404: location "' + t.statusText + '" was not found.'); - }, - // Handle other errors - onFailure: function(t) { - alert('Error ' + t.status + ' -- ' + t.statusText); - } - } - new Ajax.Updater(widget, uri, opt); - } + uri = "widgets/widgets/" + widget + ".widget.php"; + var opt = { + // Use GET + method: 'get', + evalScripts: 'true', + asynchronous: true, + // Handle 404 + on404: function(t) { + alert('Error 404: location "' + t.statusText + '" was not found.'); + }, + // Handle other errors + onFailure: function(t) { + alert('Error ' + t.status + ' -- ' + t.statusText); + }, + onSuccess: function(t) { + widget2 = widget + "-loader"; + Effect.Fade(widget2, {queue:'front'}); + Effect.Appear(widget, {queue:'end'}); + } + } + new Ajax.Updater(widget, uri, opt); +} function addDiv(selectedDiv){ selectedDiv2 = selectedDiv + "-container"; d = document; textlink = d.getElementById(selectedDiv2); + Effect.Appear(selectedDiv2, {duration:1}); if (textlink.style.display != "none") { Effect.Shake(selectedDiv2); @@ -226,7 +232,6 @@ function addDiv(selectedDiv){ else { widgetAjax(selectedDiv); - Effect.Appear(selectedDiv2, {duration:1}); selectIntLink = selectedDiv2 + "-input"; textlink = d.getElementById(selectIntLink); textlink.value = "show"; @@ -485,7 +490,7 @@ echo $jscriptstr; $printed = false; $firstprint = false; ?> - <div id="col1" style="float:left;width:49%;padding: 2px;padding-bottom:40px"> + <div id="col1" style="float:left;width:50%;padding-bottom:40px"> <?php if ($config['widgets']){ @@ -574,7 +579,7 @@ echo $jscriptstr; $printed = true; ?> </div> - <div id="col2" style="float:right;width:49%;padding: 2px;padding-bottom:40px"> + <div id="col2" style="float:right;width:50%;padding-bottom:40px"> <?php } } @@ -582,7 +587,7 @@ echo $jscriptstr; $printed = true; ?> </div> - <div id="col2" style="float:right;width:49%;padding: 2px;padding-bottom:40px"> + <div id="col2" style="float:right;width:50%;padding-bottom:40px"> <?php } @@ -627,12 +632,24 @@ echo $jscriptstr; </div> <div style="clear:both;"></div> </div> - <div id="<?php echo $widgetname;?>" style="display:<?php echo $display; ?>;"> + <?php if ($displayarray[$widgetcounter] != "show") { ?> + <div id="<?php echo $widgetname;?>-loader" style="display:<?php echo $display; ?>;"><br> + <div id="<?php echo $widgetname;?>-loader" style="display:<?php echo $display; ?>;"> + <center> + <img src="./themes/<?= $g['theme']; ?>/images/misc/widget_loader.gif" width=25 height=25 alt="Loading selected widget..."> + </center> + </div><br> + </div> <?php } + if ($displayarray[$widgetcounter] != "show") $display = none; ?> + <div id="<?php echo $widgetname;?>" style="display:<?php echo $display; ?>;"> <?php if ($displayarray[$widgetcounter] != "close") { include($directory . $widget); - } + } + else + { ?> + <?php } ?> </div> <div style="clear:both;"></div> @@ -647,7 +664,7 @@ echo $jscriptstr; $printed = true; ?> </div> - <div id="col2" style="float:right;width:49%;padding: 2px;padding-bottom:40px"></div> + <div id="col2" style="float:right;width:50%;padding-bottom:40px"></div> <?php } ?> <div style="clear:both;"></div> diff --git a/usr/local/www/javascript/index/sajax.js b/usr/local/www/javascript/index/sajax.js index fd9b00a..b7dd82a 100644 --- a/usr/local/www/javascript/index/sajax.js +++ b/usr/local/www/javascript/index/sajax.js @@ -74,8 +74,7 @@ function updateState(x) } function updateInterfaceStats(x){ - var widget = document.getElementById("interface_statistics-container"); - if (widget.style.display != "none"){ + if (widgetActive("interface_statistics")){ statistics_split = x.split(","); var counter = 1; for (var y=0; y<statistics_split.length-1; y++){ @@ -86,30 +85,40 @@ function updateInterfaceStats(x){ } function updateInterfaces(x){ - interfaces = x.split("~"); - for (var z=0; z<interfaces.length-1; z++){ - details = interfaces[z].split(","); - if (details[1] == "up"){ - document.getElementById(details[0] + '-up').style.display = "inline"; - document.getElementById(details[0] + '-down').style.display = "none"; - document.getElementById(details[0] + '-block').style.display = "none"; - document.getElementById(details[0] + '-ip').innerHTML = details[2]; - document.getElementById(details[0] + '-media').innerHTML = details[3]; - } else if (details[1] == "down"){ - document.getElementById(details[0] + '-down').style.display = "inline"; - document.getElementById(details[0] + '-up').style.display = "none"; - document.getElementById(details[0] + '-block').style.display = "none"; - document.getElementById(details[0] + '-ip').innerHTML = details[2]; - document.getElementById(details[0] + '-media').innerHTML = details[3]; - } else if (details[1] == "block"){ - document.getElementById(details[0] + '-block').style.display = "inline"; - document.getElementById(details[0] + '-down').style.display = "none"; - document.getElementById(details[0] + '-up').style.display = "none"; + if (widgetActive("interfaces")){ + interfaces = x.split("~"); + for (var z=0; z<interfaces.length-1; z++){ + details = interfaces[z].split(","); + if (details[1] == "up"){ + document.getElementById(details[0] + '-up').style.display = "inline"; + document.getElementById(details[0] + '-down').style.display = "none"; + document.getElementById(details[0] + '-block').style.display = "none"; + document.getElementById(details[0] + '-ip').innerHTML = details[2]; + document.getElementById(details[0] + '-media').innerHTML = details[3]; + } else if (details[1] == "down"){ + document.getElementById(details[0] + '-down').style.display = "inline"; + document.getElementById(details[0] + '-up').style.display = "none"; + document.getElementById(details[0] + '-block').style.display = "none"; + document.getElementById(details[0] + '-ip').innerHTML = details[2]; + document.getElementById(details[0] + '-media').innerHTML = details[3]; + } else if (details[1] == "block"){ + document.getElementById(details[0] + '-block').style.display = "inline"; + document.getElementById(details[0] + '-down').style.display = "none"; + document.getElementById(details[0] + '-up').style.display = "none"; + } + } - } } +function widgetActive(x){ + var widget = document.getElementById(x + '-container'); + if (widget.style.display != "none") + return TRUE; + else + return FALSE; +} + /* start ajax helper "thread" if not started */ if(!ajaxStarted) { window.setTimeout('updateMeters()', update_interval); diff --git a/usr/local/www/themes/metallic/images/misc/widget_loader.gif b/usr/local/www/themes/metallic/images/misc/widget_loader.gif Binary files differnew file mode 100644 index 0000000..47127fd --- /dev/null +++ b/usr/local/www/themes/metallic/images/misc/widget_loader.gif diff --git a/usr/local/www/themes/nervecenter/images/misc/widget_loader.gif b/usr/local/www/themes/nervecenter/images/misc/widget_loader.gif Binary files differnew file mode 100644 index 0000000..47127fd --- /dev/null +++ b/usr/local/www/themes/nervecenter/images/misc/widget_loader.gif diff --git a/usr/local/www/themes/pfsense-dropdown/images/misc/widget_loader.gif b/usr/local/www/themes/pfsense-dropdown/images/misc/widget_loader.gif Binary files differnew file mode 100644 index 0000000..47127fd --- /dev/null +++ b/usr/local/www/themes/pfsense-dropdown/images/misc/widget_loader.gif diff --git a/usr/local/www/themes/pfsense/images/misc/widget_loader.gif b/usr/local/www/themes/pfsense/images/misc/widget_loader.gif Binary files differnew file mode 100644 index 0000000..47127fd --- /dev/null +++ b/usr/local/www/themes/pfsense/images/misc/widget_loader.gif |