Tracy core updates for panel zIndex issues, and module updates to go with new approach to setting the panel base zIndex.

Author: adrianbj

TracyDebugger.module

@@ -32,7 +32,7 @@ class TracyDebugger extends WireData implements Module, ConfigurableModule {
             'summary' => __('Tracy debugger from Nette with several PW specific custom tools.', __FILE__),
             'author' => 'Adrian Jones',
             'href' => 'https://processwire.com/talk/topic/12208-tracy-debugger/',
-            'version' => '4.9.21',
+            'version' => '4.9.22',
             'autoload' => true,
             'singular' => true,
             'requires'  => 'ProcessWire>=2.7.2, PHP>=5.4.4',
@@ -871,31 +871,17 @@ class TracyDebugger extends WireData implements Module, ConfigurableModule {
                     }
                     modifyTracyLogo();
 
-
                     function bsZIndex() {
                         if(!document.getElementById("tracy-bs")) {
                             window.requestAnimationFrame(bsZIndex);
                         } else {
                             if(document.getElementById("tracy-bs"))
-                                document.getElementById("tracy-bs").style.zIndex = z = '.$this->data['panelZindex'].';
+                                document.getElementById("tracy-bs").style.zIndex = ' . $this->data['panelZindex'] .';
                         }
                     }
                     bsZIndex();
 
-                    function panelsZIndex() {
-                        if(!document.getElementById("tracy-debug-bar")) {
-                            window.requestAnimationFrame(panelsZIndex);
-                        } else {
-                            window.Tracy.DebugPanel.zIndex = z = '.$this->data['panelZindex'].';
-                            var panels = document.getElementsByClassName("tracy-panel");
-                            if(panels.length > 0) {
-                                for (var i = 0; i < panels.length; i++) {
-                                    panels[i].style.zIndex = z++;
-                                }
-                            }
-                        }
-                    }
-                    panelsZIndex();
+                    window.Tracy.panelZIndex = ' . ($this->data['panelZindex'] + 1) . ';
                 ';
 
                 if($this->data['hideDebugBar'] && $this->showServerTypeIndicator() && $this->data['styleAdminType'] == 'custom' && !$this->wire('input')->cookie->tracyShow) {

tracy-master/examples/assets/E_COMPILE_ERROR.php

@@ -0,0 +1,3 @@
+<?php
+
+$this = 2;

tracy-master/examples/fatal-error.php

@@ -15,27 +15,8 @@
 
 <?php
 
-
-function first($arg1, $arg2)
-{
-	second(true, false);
-}
-
-
-function second($arg1, $arg2)
-{
-	third([1, 2, 3]);
-}
-
-
-function third($arg1)
-{
-	echo html_special_chars($arg1); // this function doesn't exist
-}
-
-
 if (Debugger::$productionMode) {
 	echo '<p><b>For security reasons, Tracy is visible only on localhost. Look into the source code to see how to enable Tracy.</b></p>';
 }
 
-first(10, 'any string');
+require __DIR__ . '/assets/E_COMPILE_ERROR.php';

tracy-master/readme.md

@@ -68,7 +68,7 @@ The Debugger Bar is a floating panel. It is displayed in the bottom right corner
 
 You can add other useful panels into the Debugger Bar. You can find interesing ones in [Addons](https://addons.nette.org) or you can create your own.
 
-Implementation of custom bar is easy, just implement interface `Tracy\IBarPanel` with two methods `getTab` and `getContent`, both returning content to be displayed.
+Implementation of custom panel is easy, just implement interface `Tracy\IBarPanel` with two methods `getTab` and `getPanel`, both returning HTML content to be displayed.
 Afterward, registering via `Debugger::getBar()->addPanel(new CustomPanel());` is everything you will need to do.
 
 

tracy-master/src/Tracy/Debugger.php

@@ -8,7 +8,6 @@
 namespace Tracy;
 
 use ErrorException;
-use Tracy;
 
 
 /**

tracy-master/src/Tracy/Dumper.php

@@ -7,8 +7,6 @@
 
 namespace Tracy;
 
-use Tracy;
-
 
 /**
  * Dumps a variable.

tracy-master/src/Tracy/FireLogger.php

@@ -7,8 +7,6 @@
 
 namespace Tracy;
 
-use Tracy;
-
 
 /**
  * FireLogger console logger.

tracy-master/src/Tracy/assets/Bar/bar.css

@@ -205,7 +205,6 @@ body#tracy-debug { /* in popup window */
 	background: white;
 	color: #333;
 	text-align: left;
-	z-index: 20001;
 }
 
 body#tracy-debug .tracy-panel { /* in popup window */
@@ -360,4 +359,4 @@ body#tracy-debug .tracy-panel { /* in popup window */
 	#tracy-debug * {
 		display: none;
 	}
-}
+}

tracy-master/src/Tracy/assets/Bar/bar.js

@@ -14,6 +14,8 @@
 		return contentId;
 	};
 
+	Tracy.panelZIndex = Tracy.panelZIndex || 20000;
+
 	var Panel = Tracy.DebugPanel = function(id) {
 		this.id = id;
 		this.elem = document.getElementById(this.id);
@@ -24,7 +26,7 @@
 	Panel.FLOAT = 'tracy-mode-float';
 	Panel.WINDOW = 'tracy-mode-window';
 	Panel.FOCUSED = 'tracy-focused';
-	Panel.zIndex = 20000;
+	Panel.zIndexCounter = 1;
 
 	Panel.prototype.init = function() {
 		var _this = this, elem = this.elem;
@@ -39,15 +41,22 @@
 			handles: elem.querySelectorAll('h1'),
 			start: function() {
 				_this.toFloat();
+				_this.focus();
 			}
 		});
 
-		elem.addEventListener('mouseover', function(e) {
+		elem.addEventListener('mousedown', function(e) {
 			if (isTargetChanged(e.relatedTarget, this)) {
 				_this.focus();
 			}
 		});
 
+		elem.addEventListener('mouseover', function(e) {
+			if (isTargetChanged(e.relatedTarget, this)) {
+				clearTimeout(elem.Tracy.displayTimeout);
+			}
+		});
+
 		elem.addEventListener('mouseout', function(e) {
 			if (isTargetChanged(e.relatedTarget, this)) {
 				_this.blur();
@@ -74,7 +83,7 @@
 				clearTimeout(elem.Tracy.displayTimeout);
 				if (this.rel === 'close') {
 					_this.toPeek();
-				} else if (this.rel === 'window') {
+				} else {
 					_this.toWindow();
 				}
 				e.preventDefault();
@@ -98,7 +107,7 @@
 			clearTimeout(elem.Tracy.displayTimeout);
 			elem.Tracy.displayTimeout = setTimeout(function() {
 				elem.classList.add(Panel.FOCUSED);
-				elem.style.zIndex = Panel.zIndex++;
+				elem.style.zIndex = Tracy.panelZIndex + Panel.zIndexCounter++;
 				if (callback) {
 					callback();
 				}
@@ -184,7 +193,7 @@
 		if (this.is(Panel.WINDOW)) {
 			localStorage.setItem(this.id, JSON.stringify({window: true}));
 		} else if (pos.width) {
-			localStorage.setItem(this.id, JSON.stringify({right: pos.right, bottom: pos.bottom}));
+			localStorage.setItem(this.id, JSON.stringify({right: pos.right, bottom: pos.bottom, zIndex: this.elem.style.zIndex - Tracy.panelZIndex}));
 		} else {
 			localStorage.removeItem(this.id);
 		}
@@ -201,6 +210,8 @@
 			this.init();
 			this.toFloat();
 			setPosition(this.elem, pos);
+			this.elem.style.zIndex = Tracy.panelZIndex + (pos.zIndex || 1);
+			Panel.zIndexCounter = Math.max(Panel.zIndexCounter, (pos.zIndex || 1)) + 1;
 		}
 	};
 
@@ -588,4 +599,4 @@
 		Array.prototype.forEach.call(arr, cb);
 	}
 
-})();
+})();