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/www/index.php | |
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/www/index.php')
-rwxr-xr-x | usr/local/www/index.php | 65 |
1 files changed, 41 insertions, 24 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> |