Script execution is now done via an async js request, preventing die() and exception to mess up the entire console

Seldaek · Seldaek · commit f54dc1291198 · 2010-08-31T20:47:02.000+02:00
diff --git a/README.mdown b/README.mdown
@@ -31,6 +31,7 @@ Changelog
 ---------
 
 - 1.1.0
+  - Script execution is now done via an async js request, preventing die() and exception to mess up the entire console
   - Added a toggle button to expand/collapse all krumo sub-trees at once
 - 1.0.0
   - Initial Public Release
diff --git a/index.php b/index.php
@@ -48,7 +48,13 @@
 
     ob_start();
     eval($code);
-    $debugOutput = '<div class="output">'.ob_get_clean().'</div>';
+    $debugOutput = ob_get_clean();
+
+    if (isset($_GET['js'])) {
+        header('Content-Type: text/plain');
+        echo $debugOutput;
+        die('#end-php-console-output#');
+    }
 }
 
 ?>
@@ -63,7 +69,8 @@
         <script type="text/javascript" src="php-console.js"></script>
         </script>
     </head>
-    <body><?php echo $debugOutput ?>
+    <body>
+        <div class="output"><?php echo $debugOutput ?></div>
         <form method="POST" action="">
             <textarea cols="100" rows="20" name="code"><?php echo (isset($_POST['code']) ? htmlentities($_POST['code'], ENT_QUOTES, 'UTF-8') : null) ?></textarea>
             <input type="submit" name="subm" value="Try this!" />
diff --git a/loader.gif b/loader.gif
diff --git a/php-console.js b/php-console.js
@@ -36,7 +36,8 @@ $(function() {
                 }
                 caret = $(this).getCaret();
                 part = $(this).val().substring(0, caret);
-                if (matches = part.match(/(\r?\n +)[^\r\n]*$/)) {
+                matches = part.match(/(\r?\n +)[^\r\n]*$/);
+                if (matches) {
                     $(this).val(function(idx, val) {
                         return val.substring(0, caret) + matches[1] + val.substring(caret);
                     });
@@ -56,6 +57,18 @@ $(function() {
         }
     });
 
+    $('form').submit(function(e){
+        e.preventDefault();
+        $('div.output').html('<img src="loader.gif" class="loader" alt="" /> Loading ...');
+        $.post('?js=1', $(this).serializeArray(), function(res) {
+            if (res.match(/#end-php-console-output#$/)) {
+                $('div.output').html(res.substring(0, res.length-24));
+            } else {
+                $('div.output').html(res + "<br /><br /><em>Script ended unexpectedly.</em>");
+            }
+        });
+    });
+
     // adds a toggle button to expand/collapse all krumo sub-trees at once
     if ($('.krumo-expand').length > 0) {
         $('<a class="expand" href="#">Toggle all</a>')
diff --git a/styles.css b/styles.css
@@ -29,6 +29,10 @@ a {
     margin: 10px .4%;
 }
 
+.output img.loader {
+    margin-bottom: -4px;
+}
+
 .output, textarea {
     -moz-border-radius: 5px;
     -webkit-border-radius: 5px;
