diff options
Diffstat (limited to 'src/index.html')
| -rw-r--r-- | src/index.html | 40 |
1 files changed, 31 insertions, 9 deletions
diff --git a/src/index.html b/src/index.html index b25d1db..02246db 100644 --- a/src/index.html +++ b/src/index.html @@ -7,6 +7,7 @@ <link rel="stylesheet" href="/web/jquery-ui.css"/> <script src="/web/jquery.js"></script> <script src="/web/jquery-ui.js"></script> + <script src="/web/jquery.ui.waitbutton.js"></script> <script> $( function( ) { @@ -57,28 +58,42 @@ var status = fields[2]; var workertype = fields[3]; - var start_button = "<button id=\"start_" + name + "\">Start</button><script>$( \"#start_" + name + "\" ).button( );<\/script>"; - var stop_button = "<button id=\"stop_" + name + "\">Stop</button><script>$( \"#stop_" + name + "\" ).button( );<\/script>"; + var start_button = + "<button id=\"start_" + name + "\">Start</button><script>$( \"#start_" + name + "\" )" + + ".waitbutton( { waitLabel: 'Starting ...' })" + + ".on( 'buttonwaiting', function ( e, ui ) {" + + " setTimeout( function () { ui.done(); }, 5000 );" + + " startWorker( '" + name + "' );" + + "});" + + "<\/script>"; + + var stop_button = + "<button id=\"stop_" + name + "\">Stop</button><script>$( \"#stop_" + name + "\" )" + + ".waitbutton( { waitLabel: 'Stopping ...' })" + + ".on( 'buttonwaiting', function ( e, ui ) {" + + " setTimeout( function () { ui.done(); }, 5000 );" + + " stopWorker( '" + name + "' );" + + "});" + + "<\/script>"; + var details_button = "<button id=\"details_" + name + "\">Details</button><script>$( \"#details_" + name + "\" ).button( );<\/script>"; var buttons = start_button + stop_button + details_button; html += "<tr><td>" + name + "</td><td>" + status + "</td><td>" + buttons + "</td></tr>\n"; if( status == "running" ) { - html += '<script>$( "#start_' + name + '" ).button( "option", "disabled", true );<\/script>\n'; + html += '<script>$( "#start_' + name + '" ).waitbutton( "option", "disabled", true );<\/script>\n'; } if( status == "stopped" ) { - html += '<script>$( "#stop_' + name + '" ).button( "option", "disabled", true );<\/script>\n'; + html += '<script>$( "#stop_' + name + '" ).waitbutton( "option", "disabled", true );<\/script>\n'; } if( workertype == "disabled" ) { - html += '<script>$( "#start_' + name + '" ).button( "option", "disabled", true );<\/script>\n'; - html += '<script>$( "#stop_' + name + '" ).button( "option", "disabled", true );<\/script>\n'; + html += '<script>$( "#start_' + name + '" ).waitbutton( "option", "disabled", true );<\/script>\n'; + html += '<script>$( "#stop_' + name + '" ).waitbutton( "option", "disabled", true );<\/script>\n'; html += '<script>$( "#details_' + name + '" ).button( "option", "disabled", true );<\/script>\n'; } - html += '<script>$( "#start_' + name + '" ).click( function( ) { startWorker( "' + name + '" ); } );<\/script>\n'; - html += '<script>$( "#stop_' + name + '" ).click( function( ) { stopWorker( "' + name + '" ); } );<\/script>\n'; html += '<script>$( "#details_' + name + '" ).click( function( ) { showWorkerTab( "' + name + '" ); } );<\/script>\n'; } }); @@ -112,7 +127,7 @@ tabs.tabs( "option", "active", $( "#" + id ).index( ) - 1 ); } - function startWorker( worker ) { + function startWorker( worker ) { $.post( "/worker?op=start&name=" + worker, { } ) .done( function( data ) { }).fail( function( ) { @@ -138,7 +153,14 @@ font-family: "Trebuchet MS", "Helvetica", "Arial", "Verdana", "sans-serif"; font-size: 62.5%; } + #tabs li .ui-icon-close { float: left; margin: 0.4em 0.2em 0 0; cursor: pointer; } + + .ui-wait-button .ui-icon-waiting { + background-image: url( "/web/images/loading.gif" ); + background-position: 0 center; + } + </style> </head> |