Added ability to click on tabs when the profiler is hidden

Author: Steven Surowiec

resources/profiler.css

@@ -12,12 +12,12 @@
 
 /* ----- IDS ----- */
 #profiler-container { z-index: 9999; }
-#profiler-metrics{ background: #000; width:100%; }
+#profiler-metrics { background: #000; width: 100%; }
 #profiler-console,
 #profiler-speed,
 #profiler-queries,
 #profiler-memory,
-#profiler-files{ background: url(../images/pqp/overlay.gif); border-top: 1px solid #ccc; height: 200px; overflow: auto; }
+#profiler-file { background: url(../images/pqp/overlay.gif); border-top: 1px solid #ccc; height: 200px; overflow: auto; }
 
 /* ----- Logic ----- */
 #profiler,
@@ -39,17 +39,17 @@
 .profiler .memory #profiler-memory,
 .profiler .files #profiler-files { display: block; }
 
-.console td#console,
-.speed td#speed,
-.queries td#queries,
-.memory td#memory,
-.files td#files { background: #222 !important; border-bottom: 6px solid #fff !important; cursor: default !important; }
+.console td#console.active,
+.speed td#speed.active,
+.queries td#queries.active,
+.memory td#memory.active,
+.files td#files.active { background: #222 !important; border-bottom: 6px solid #fff !important; cursor: default !important; }
 
 .tallDetails #profiler .profiler-box { height: 500px; }
 .tallDetails #profiler .profiler-box h3 { line-height: 500px; }
-.hideDetails #profiler .profiler-box { display: none !important; }
+.hideDetails #profiler .profiler-box { display: none; }
 .hideDetails #profiler-footer { border-top: 1px dotted #444; }
-.hideDetails #profiler #profiler-metrics td { height: 50px; background: #000 !important; border-bottom: none !important; cursor: default !important; }
+.hideDetails #profiler #profiler-metrics td { height: 50px; }
 .hideDetails #profiler var { font-size: 18px; margin: 0 0 2px 0; }
 .hideDetails #profiler h4 { font-size: 10px; }
 .hideDetails .heightToggle{ visibility: hidden; }

resources/profiler.js

@@ -1,7 +1,5 @@
 (function($) {
-    var PQP_DETAILS = false;
-    var PQP_HEIGHT = 'short';
-    var PROFILER_DETAILS = false;
+    var profiler_details = false;
 
     function hideAllTabs() {
         $('#profiler').removeClass('console')
@@ -12,7 +10,7 @@
     }
 
     $(document).ready(function() {
-    setTimeout(function() { $('#profiler-container').css('display', 'block') }, 10);
+        setTimeout(function() { $('#profiler-container').css('display', 'block') }, 10);
 
         $('.query-profile H4').css('cursor', 'pointer').click(function() {
             if ($('table', $(this).parent()).is(':hidden')) {
@@ -25,28 +23,37 @@
         });
 
         $('.detailsToggle').click(function() {
-            if (PQP_DETAILS) {
+            if (profiler_details) {
                 $('#profiler-container').addClass('hideDetails');
-                PQP_DETAILS = false;
+                profiler_details = false;
             } else {
-            $('#profiler-container').removeClass('hideDetails');
-                PQP_DETAILS = true;
+                $('#profiler-container').removeClass('hideDetails');
+                profiler_details = true;
             }
+
             return false;
         });
 
         $('.heightToggle').click(function() {
-            var container = $('#pqp-container');
+            var container = $('#profiler-container');
 
-            if (container.hasClass('tallDetails'))
+            if (container.hasClass('tallDetails')) {
                 container.removeClass('tallDetails');
-            else
+            } else {
                 container.addClass('tallDetails');
+            }
         });
 
-        $('.tab').click(function() {
+        $('.tab').css('cursor', 'pointer').click(function() {
             hideAllTabs();
+
+            $(this).addClass('active');
             $('#profiler').addClass($(this).attr('id'));
+
+            if (!profiler_details) {
+                profiler_details = true;
+                $('#profiler-container').removeClass('hideDetails');
+            }
         });
     });
 })(jQuery);