From 5495ef8ddc3ae9e4995667649c96b5954bfd52e1 Mon Sep 17 00:00:00 2001
From: Jo Michael <me@mynetx.net>
Date: Sat, 7 Apr 2012 15:59:59 +0200
Subject: [PATCH 1/3] Added PHP 5.4+ session.upload_progress to documentation

---
 Documentation.html | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/Documentation.html b/Documentation.html
index fdd519c9ea..dd08e4438f 100644
--- a/Documentation.html
+++ b/Documentation.html
@@ -3399,11 +3399,16 @@ RewriteRule .* - [F]
     <a href="#faq2_9">2.9 Seeing an upload progress bar</a></h4>
 
 <p> To be able to see a progress bar during your uploads, your server must
-have either the <a href="http://pecl.php.net/package/APC">APC</a> extension
-    or the <a href="http://pecl.php.net/package/uploadprogress">uploadprogress</a>
-    one. Moreover, the JSON extension has to be enabled in your PHP.</p>
+    have the <a href="http://pecl.php.net/package/APC">APC</a> extension,
+    the <a href="http://pecl.php.net/package/uploadprogress">uploadprogress</a>
+    one, or you must be running PHP 5.4.0 or higher. 
+    Moreover, the JSON extension has to be enabled in your PHP.</p>
+
     <p> If using APC, you must set <code>apc.rfc1867</code> to <code>on</code> in your php.ini.</p>
 
+    <p> If using PHP 5.4.0 or higher, you must set <code>session.upload_progress.enabled</code> 
+        to <code>1</code> in your php.ini.</p>
+
 <h3 id="faqlimitations">Known limitations</h3>
 
 <h4 id="login_bug">

From 321b8cc8806d1a9f311515d73ef90edef8214633 Mon Sep 17 00:00:00 2001
From: Jo Michael <me@mynetx.net>
Date: Sat, 7 Apr 2012 16:02:47 +0200
Subject: [PATCH 2/3] Added width and height attributes to ajax throbber img.

---
 libraries/display_import.lib.php | 6 +++---
 server_status.php                | 6 +++---
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/libraries/display_import.lib.php b/libraries/display_import.lib.php
index 656f5844a0..da9479aaab 100644
--- a/libraries/display_import.lib.php
+++ b/libraries/display_import.lib.php
@@ -63,7 +63,7 @@ if ($_SESSION[$SESSION_KEY]["handler"]!="noplugin") {
                         complete = response.complete;
 
                           if (total==0 && complete==0 && percent==0) {
-                              $('#upload_form_status_info').html('<img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" alt="ajax clock" /> <?php echo PMA_jsFormat(__('The file being uploaded is probably larger than the maximum allowed size or this is a known bug in webkit based (Safari, Google Chrome, Arora etc.) browsers.'), false); ?>');
+                              $('#upload_form_status_info').html('<img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" width="16" height="16" alt="ajax clock" /> <?php echo PMA_jsFormat(__('The file being uploaded is probably larger than the maximum allowed size or this is a known bug in webkit based (Safari, Google Chrome, Arora etc.) browsers.'), false); ?>');
                               $('#upload_form_status').css("display", "none");
                           } else {
                               $('#upload_form_status_info').html(' '+Math.round(percent)+'%, '+complete+'/'+total);
@@ -73,7 +73,7 @@ if ($_SESSION[$SESSION_KEY]["handler"]!="noplugin") {
                           if (finished==true) {
                                     $('#importmain').css('display', 'none');
                                     $('#import_form_status').css('display', 'inline');
-                                    $('#import_form_status').html('<img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" alt="ajax clock" /> <?php echo PMA_jsFormat(__('The file is being processed, please be patient.'), false); ?> ');
+                                    $('#import_form_status').html('<img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" width="16" height="16" alt="ajax clock" /> <?php echo PMA_jsFormat(__('The file is being processed, please be patient.'), false); ?> ');
                                     $('#import_form_status').load('import_status.php?message=true&<?php echo PMA_generate_common_url(); ?>'); // loads the message, either success or mysql error
                                     <?php
                                     // reload the left sidebar when the import is finished
@@ -95,7 +95,7 @@ if ($_SESSION[$SESSION_KEY]["handler"]!="noplugin") {
     <?php
 } else { // no plugin available
     ?>
-                        $('#upload_form_status_info').html('<img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" alt="ajax clock" /> <?php echo PMA_jsFormat(__('Please be patient, the file is being uploaded. Details about the upload are not available.'), false) . PMA_showDocu('faq2_9'); ?>');
+                        $('#upload_form_status_info').html('<img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" width="16" height="16" alt="ajax clock" /> <?php echo PMA_jsFormat(__('Please be patient, the file is being uploaded. Details about the upload are not available.'), false) . PMA_showDocu('faq2_9'); ?>');
                         $('#upload_form_status').css("display", "none");
     <?php
 } // else
diff --git a/server_status.php b/server_status.php
index ef395563e2..5c5e498e85 100644
--- a/server_status.php
+++ b/server_status.php
@@ -806,7 +806,7 @@ echo __('Runtime Information');
         <div id="statustabs_traffic" class="clearfloat">
             <div class="buttonlinks jsfeature">
                 <a class="tabRefresh" href="<?php echo $PMA_PHP_SELF . '?show=server_traffic&amp;' . PMA_generate_common_url(); ?>" >
-                    <img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" alt="ajax clock" style="display: none;" />
+                    <img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" width="16" height="16" alt="ajax clock" style="display: none;" />
                     <?php echo __('Refresh'); ?>
                 </a>
                 <span class="refreshList" style="display:none;">
@@ -828,7 +828,7 @@ echo __('Runtime Information');
         <div id="statustabs_queries" class="clearfloat">
             <div class="buttonlinks jsfeature">
                 <a class="tabRefresh"  href="<?php echo $PMA_PHP_SELF . '?show=query_statistics&amp;' . PMA_generate_common_url(); ?>" >
-                    <img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" alt="ajax clock" style="display: none;" />
+                    <img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" width="16" height="16" alt="ajax clock" style="display: none;" />
                     <?php echo __('Refresh'); ?>
                 </a>
                 <span class="refreshList" style="display:none;">
@@ -848,7 +848,7 @@ echo __('Runtime Information');
                 <legend><?php echo __('Filters'); ?></legend>
                 <div class="buttonlinks">
                     <a class="tabRefresh" href="<?php echo $PMA_PHP_SELF . '?show=variables_table&amp;' . PMA_generate_common_url(); ?>" >
-                        <img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" alt="ajax clock" style="display: none;" />
+                        <img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" width="16" height="16" alt="ajax clock" style="display: none;" />
                         <?php echo __('Refresh'); ?>
                     </a>
                 </div>

From 263d0137fd68e56aa7f7ea6222935f2b7360a47a Mon Sep 17 00:00:00 2001
From: Jo Michael <me@mynetx.net>
Date: Sat, 7 Apr 2012 19:55:45 +0200
Subject: [PATCH 3/3] Show progress bar with timing for import uploads

---
 js/functions.js                         |  24 +++++
 libraries/display_import.lib.php        | 112 +++++++++++++++++-------
 themes/original/css/theme_right.css.php |  33 ++++++-
 themes/pmahomme/css/theme_right.css.php |  32 +++++++
 4 files changed, 167 insertions(+), 34 deletions(-)

diff --git a/js/functions.js b/js/functions.js
index 8c3cf665e9..30e5511ce0 100644
--- a/js/functions.js
+++ b/js/functions.js
@@ -3644,6 +3644,30 @@ function toggleRowColors($start)
     }
 }
 
+/**
+ * Formats a byte number to human-readable form
+ *
+ * @param bytes the bytes to format
+ * @param optional subdecimals the number of digits after the point
+ * @param optional pointchar the char to use as decimal point
+ */
+function formatBytes(bytes, subdecimals, pointchar) {
+    if (!subdecimals) {
+        var subdecimals = 0;
+    }
+    if (!pointchar) {
+        var pointchar = '.';
+    }
+    var units = ['B', 'KiB', 'MiB', 'GiB'];
+    for (var i = 0; bytes > 1024 && i < units.length; i++) {
+        bytes /= 1024;
+    }
+    var factor = Math.pow(10, subdecimals);
+    bytes = Math.round(bytes * factor) / factor;
+    bytes = bytes.toString().split('.').join(pointchar);
+    return bytes + ' ' + units[i];
+}
+
 /**
  * Opens pma more themes link in themes browser, in new window instead of popup
  * This way, we don't break HTML validity
diff --git a/libraries/display_import.lib.php b/libraries/display_import.lib.php
index da9479aaab..733f676dbf 100644
--- a/libraries/display_import.lib.php
+++ b/libraries/display_import.lib.php
@@ -40,19 +40,14 @@ if (empty($import_list)) {
 <?php
 if ($_SESSION[$SESSION_KEY]["handler"]!="noplugin") {
     ?>
-                $('#upload_form_status').html('<div class="upload_progress_bar_outer"><div id="status" class="upload_progress_bar_inner"></div></div>'); // add the progress bar
-
                 var finished = false;
                 var percent  = 0.0;
                 var total    = 0;
                 var complete = 0;
+                var original_title = parent && parent.document ? parent.document.title : false;
+                var import_start;
 
-                var perform_upload;
-                var periodical_upload;
-
-                var request_upload = [];
-
-                perform_upload = function () {
+                var perform_upload = function () {
                     new $.getJSON(
                     'import_status.php?id=<?php echo $upload_id ; ?>&<?php echo PMA_generate_common_url(); ?>',
                     {},
@@ -62,35 +57,86 @@ if ($_SESSION[$SESSION_KEY]["handler"]!="noplugin") {
                         total = response.total;
                         complete = response.complete;
 
-                          if (total==0 && complete==0 && percent==0) {
-                              $('#upload_form_status_info').html('<img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" width="16" height="16" alt="ajax clock" /> <?php echo PMA_jsFormat(__('The file being uploaded is probably larger than the maximum allowed size or this is a known bug in webkit based (Safari, Google Chrome, Arora etc.) browsers.'), false); ?>');
-                              $('#upload_form_status').css("display", "none");
-                          } else {
-                              $('#upload_form_status_info').html(' '+Math.round(percent)+'%, '+complete+'/'+total);
-                              $('#status').animate({width: Math.round(percent)*2+'px'},150);
-                          } // else
+                        if (total==0 && complete==0 && percent==0) {
+                            $('#upload_form_status_info').html('<img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" width="16" height="16" alt="ajax clock" /> <?php echo PMA_jsFormat(__('The file being uploaded is probably larger than the maximum allowed size or this is a known bug in webkit based (Safari, Google Chrome, Arora etc.) browsers.'), false); ?>');
+                            $('#upload_form_status').css("display", "none");
+                        } else {
+                            var now = new Date();
+                            now = Date.UTC(
+                                now.getFullYear(), now.getMonth(), now.getDate(), 
+                                now.getHours(), now.getMinutes(), now.getSeconds()) 
+                                + now.getMilliseconds() - 1000;
+                            var statustext = 
+                                formatBytes(complete, 1, PMA_messages.strDecimalSeperator)
+                                + ' <?php echo PMA_jsFormat(__('of'), false); ?> ' 
+                                + formatBytes(total, 1, PMA_messages.strDecimalSeperator);
 
-                          if (finished==true) {
-                                    $('#importmain').css('display', 'none');
-                                    $('#import_form_status').css('display', 'inline');
-                                    $('#import_form_status').html('<img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" width="16" height="16" alt="ajax clock" /> <?php echo PMA_jsFormat(__('The file is being processed, please be patient.'), false); ?> ');
-                                    $('#import_form_status').load('import_status.php?message=true&<?php echo PMA_generate_common_url(); ?>'); // loads the message, either success or mysql error
-                                    <?php
-                                    // reload the left sidebar when the import is finished
-                                    $GLOBALS['reload']=true;
-                                    PMA_reloadNavigation(true);
-                                    ?>
+                            if ($('#importmain').is(':visible')) {
+                                // show progress UI
+                                $('#importmain').hide();
+                                $('#import_form_status')
+                                    .html('<div class="upload_progress"><div class="upload_progress_bar_outer"><div class="percentage"></div><div id="status" class="upload_progress_bar_inner"><div class="percentage"></div></div></div><div><img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" width="16" height="16" alt="ajax clock" /> <?php echo PMA_jsFormat(__('Uploading your import file...'), false); ?></div><div id="statustext"></div></div>')
+                                    .show();
+                                import_start = now;
+                            }
+                            else if (percent > 9) {
+                                // calculate estimated time
+                                var used_time = now - import_start;
+                                var seconds = parseInt(((total - complete) / complete) * used_time / 1000);
+                                var minutes = parseInt(seconds / 60);
+                                seconds %= 60;
+                                var estimated_time;
+                                if (minutes > 0) {
+                                    estimated_time = '<?php echo PMA_jsFormat(__('About %MIN min. %SEC sec. remaining.'), false); ?>'
+                                        .replace('%MIN', minutes).replace('%SEC', seconds);
+                                }
+                                else {
+                                    estimated_time = '<?php echo PMA_jsFormat(__('About %SEC sec. remaining.'), false); ?>'
+                                        .replace('%SEC', seconds);
+                                }
 
-                          } // if finished
-                          else {
-                                window.setTimeout(perform_upload, 1000);
-                          }
+                                statustext += '<br /><br />' + estimated_time;
+                            }
 
-                      }
-                  );
+                            var percent_str = Math.round(percent) + '%';
+                            $('#status').animate({width: percent_str}, 150);
+                            $('.percentage').text(percent_str);
 
-              }
-                window.setTimeout(perform_upload, 1000);
+                            // show percent in window title
+                            if (original_title !== false) {
+                                parent.document.title = percent_str + ' - ' + original_title;
+                            }
+                            else {
+                                document.title = percent_str + ' - ' + original_title;
+                            }
+                            $('#statustext').html(statustext);
+                        } // else
+
+                        if (finished == true) {
+                            if (original_title !== false) {
+                                parent.document.title = original_title;
+                            }
+                            else {
+                                document.title = original_title;
+                            }
+                            $('#importmain').hide();
+                            $('#import_form_status')
+                                .html('<img src="<?php echo $GLOBALS['pmaThemeImage'];?>ajax_clock_small.gif" width="16" height="16" alt="ajax clock" /> <?php echo PMA_jsFormat(__('The file is being processed, please be patient.'), false); ?> ')
+                                .show();
+                            $('#import_form_status').load('import_status.php?message=true&<?php echo PMA_generate_common_url(); ?>'); // loads the message, either success or mysql error
+                            <?php
+                            // reload the left sidebar when the import is finished
+                            $GLOBALS['reload'] = true;
+                            PMA_reloadNavigation(true);
+                            ?>
+
+                        } // if finished
+                        else {
+                            setTimeout(perform_upload, 1000);
+                        }
+                    });
+                }
+                setTimeout(perform_upload, 1000);
 
     <?php
 } else { // no plugin available
diff --git a/themes/original/css/theme_right.css.php b/themes/original/css/theme_right.css.php
index 6cf97d961f..794fcc2a84 100644
--- a/themes/original/css/theme_right.css.php
+++ b/themes/original/css/theme_right.css.php
@@ -1495,10 +1495,20 @@ textarea#partitiondefinition {
 /**
   *  Progress bar styles
   */
+div.upload_progress
+{
+    width: 400px;
+    margin: 3em auto;
+    text-align: center;
+}
+
 div.upload_progress_bar_outer
 {
-    border: 1px solid black;
+    border: 1px solid #000;
     width: 202px;
+    position: relative;
+    margin: 0 auto 1em;
+    color: <?php echo $GLOBALS['cfg']['MainColor']; ?>;
 }
 
 div.upload_progress_bar_inner
@@ -1507,6 +1517,27 @@ div.upload_progress_bar_inner
     width: 0;
     height: 12px;
     margin: 1px;
+    overflow: hidden;
+    color: <?php echo $GLOBALS['cfg']['BrowseMarkerColor']; ?>;
+    position: relative;
+}
+
+div.upload_progress_bar_outer div.percentage
+{
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 202px;
+}
+
+div.upload_progress_bar_inner div.percentage
+{
+    top: -1px;
+    left: -1px;
+}
+
+div#statustext {
+    margin-top: .5em;
 }
 
 table#serverconnection_src_remote,
diff --git a/themes/pmahomme/css/theme_right.css.php b/themes/pmahomme/css/theme_right.css.php
index 122eb4a187..de5b46816f 100644
--- a/themes/pmahomme/css/theme_right.css.php
+++ b/themes/pmahomme/css/theme_right.css.php
@@ -1905,10 +1905,21 @@ textarea#partitiondefinition {
 /**
   *  Progress bar styles
   */
+
+div.upload_progress
+{
+    width: 400px;
+    margin: 3em auto;
+    text-align: center;
+}
+
 div.upload_progress_bar_outer
 {
     border: 1px solid #000;
     width: 202px;
+    position: relative;
+    margin: 0 auto 1em;
+    color: <?php echo $GLOBALS['cfg']['MainColor']; ?>;
 }
 
 div.upload_progress_bar_inner
@@ -1917,6 +1928,27 @@ div.upload_progress_bar_inner
     width: 0;
     height: 12px;
     margin: 1px;
+    overflow: hidden;
+    color: <?php echo $GLOBALS['cfg']['BrowseMarkerColor']; ?>;
+    position: relative;
+}
+
+div.upload_progress_bar_outer div.percentage
+{
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 202px;
+}
+
+div.upload_progress_bar_inner div.percentage
+{
+    top: -1px;
+    left: -1px;
+}
+
+div#statustext {
+    margin-top: .5em;
 }
 
 table#serverconnection_src_remote,