tazpanel rev 519
tazpanel.js, footer.html: fix AJAX loader display; misc tiny edits
| author | Aleksej Bobylev <al.bobylev@gmail.com> |
|---|---|
| date | Tue Aug 04 02:32:11 2015 +0300 (2015-08-04) |
| parents | e2a7569a50d8 |
| children | fe7c4edfa21b |
| files | lib/tazpanel.js settings.cgi styles/default/base.css styles/default/footer.html styles/default/header.html test.cgi |
line diff
1.1 --- a/lib/tazpanel.js Mon Aug 03 17:39:38 2015 +0200 1.2 +++ b/lib/tazpanel.js Tue Aug 04 02:32:11 2015 +0300 1.3 @@ -339,7 +339,15 @@ 1.4 // AJAX code for dynamic requests 1.5 // 1.6 1.7 +// Global status of the AJAX loader 1.8 +// Increment ajaxLoader on the start, decrement on the finish, 1.9 +// Show it if value > 0 1.10 +ajaxLoader = 0 1.11 + 1.12 function ajax(cgiUrl, command, ajaxOut) { 1.13 + // (0) show AJAX loader 1.14 + ajaxLoader++ 1.15 + 1.16 // (1) create object for server request 1.17 var req = new XMLHttpRequest(); 1.18 1.19 @@ -351,11 +359,19 @@ 1.20 1.21 if (req.readyState == XMLHttpRequest.DONE) { 1.22 // if request done 1.23 - if (req.statusText == 'OK') { 1.24 - statusElem.innerHTML = "<span data-icon='ok'></span>" 1.25 + ajaxLoader-- 1.26 + if (ajaxLoader == 0) { 1.27 + 1.28 + statusbar('') 1.29 + 1.30 + if (req.statusText == 'OK') { 1.31 + statusElem.innerHTML = '<span data-img="ok"></span>' 1.32 + } else { 1.33 + statusElem.innerHTML = '<span data-img="delete">' + 1.34 + req.statusText + '</span>' // show status (Not Found, ...) 1.35 + } 1.36 } else { 1.37 - statusElem.innerHTML = "<span data-icon='delete'>" + 1.38 - req.statusText + "</span>" // show status (Not Found, ...) 1.39 + statusElem.innerHTML = '<span data-img="clock"></span>' 1.40 } 1.41 1.42 // if status 200 (ОК) - show answer to user 1.43 @@ -550,7 +566,7 @@ 1.44 ds.style.display = 'none'; sb.innerHTML = status; sb.style.display = ''; 1.45 // show optional ticker 1.46 if (ticker != '') { 1.47 - as.innerHTML = '<img src="/styles/default/images/loader.gif"/>'; 1.48 + as.innerHTML = '<span data-img="clock"></span>'; 1.49 } 1.50 } 1.51 }
2.1 --- a/settings.cgi Mon Aug 03 17:39:38 2015 +0200 2.2 +++ b/settings.cgi Tue Aug 04 02:32:11 2015 +0300 2.3 @@ -331,7 +331,7 @@ 2.4 cat <<EOT 2.5 <footer> 2.6 $(_ 'Password:') 2.7 - <input type="password" name="password"/> 2.8 + <input type="password" name="password" placeholder="$(_ 'New password')"/> 2.9 <button type="submit" name="do" value="chpasswd" data-icon="ok">$(_ 'Change password')</button> 2.10 </footer> 2.11 </form>
3.1 --- a/styles/default/base.css Mon Aug 03 17:39:38 2015 +0200 3.2 +++ b/styles/default/base.css Tue Aug 04 02:32:11 2015 +0300 3.3 @@ -18,6 +18,7 @@ 3.4 position: fixed; top: 0; left: 0; 3.5 width: 100%; height: 40px; 3.6 background-color: #222; 3.7 + background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJAQMAAADaX5RTAAAABlBMVEUXFxciIygUb+JNAAAAEUlEQVQIHWNkYGDMFQYhDAYAJbADCjwbCYUAAAAASUVORK5CYII='); 3.8 } 3.9 3.10 body > header h1 { 3.11 @@ -160,6 +161,8 @@ 3.12 } 3.13 section header button, section footer button { margin: 0; } 3.14 3.15 +section header a { float: right; } 3.16 + 3.17 section footer { 3.18 padding: 0 0.3rem 0.2rem; margin: 0; 3.19 display: block;
4.1 --- a/styles/default/footer.html Mon Aug 03 17:39:38 2015 +0200 4.2 +++ b/styles/default/footer.html Tue Aug 04 02:32:11 2015 +0300 4.3 @@ -1,11 +1,11 @@ 4.4 export TEXTDOMAIN='tazpanel' 4.5 -cat << EOT 4.6 +cat <<EOT 4.7 <!-- End of content--> 4.8 </div> 4.9 4.10 <script type="text/javascript"> 4.11 window.onbeforeunload = null; 4.12 - statusbar(''); 4.13 + if (ajaxLoader == 0) statusbar(''); 4.14 dupTableHead(); 4.15 </script> 4.16 </body>
5.1 --- a/styles/default/header.html Mon Aug 03 17:39:38 2015 +0200 5.2 +++ b/styles/default/header.html Tue Aug 04 02:32:11 2015 +0300 5.3 @@ -22,7 +22,7 @@ 5.4 <!DOCTYPE html> 5.5 <html lang="${LANG%%_*}"> 5.6 <head> 5.7 - <title>$TITLE</title> 5.8 + <title>TazPanel</title> 5.9 <link rel="shortcut icon" href="/styles/$STYLE/favicon.ico"/> 5.10 <meta name="viewport" content="width=device-width,initial-scale=1"/> 5.11 $(printf '\t<link rel="stylesheet" type="text/css" href="/%s"/>\n' $(cd /var/www/tazpanel; ls styles/$STYLE/*.css))
6.1 --- a/test.cgi Mon Aug 03 17:39:38 2015 +0200 6.2 +++ b/test.cgi Tue Aug 04 02:32:11 2015 +0300 6.3 @@ -54,8 +54,7 @@ 6.4 --><button data-icon="toggle" >Toggle </button><button data-icon="chlock" >ChLock </button><!-- 6.5 --><button data-icon="calendar" >Calendar </button><button data-icon="modem" >Modem </button><!-- 6.6 --><button data-icon="vpn" >VPN </button><button data-icon="display" >Display </button><!-- 6.7 ---><button data-icon="cpu" >CPU </button><button data-icon="display" >Display </button><!-- 6.8 ---> 6.9 +--><button data-icon="cpu" >CPU </button> 6.10 </section> 6.11 6.12