Shows an FPS / Ping / Speed counter wherever you go!
// ==UserScript==
// @name Global Debugger
// @namespace https://greasyfork.org/en/scripts/450102-global-debugger
// @version 1.0.1
// @description Shows an FPS / Ping / Speed counter wherever you go!
// @author HYDROFLAME521
// @match *://*/*
// @license CDDL-1.0
// @icon https://c.tenor.com/je-huTL1vwgAAAAi/loading-buffering.gif
// @grant none
// @require https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.6.5/dat.gui.min.js
// ==/UserScript==
'use strict';
(function(window, e) {
if ("object" === typeof exports && "undefined" !== typeof module) {
module.exports = e();
} else {
if ("function" === typeof define && define.amd) {
define(e);
} else {
window.Stats = e();
}
}
})(this, function() {
var init = function() {
function addPanel(panel) {
container.appendChild(panel.dom);
return panel;
}
function showPanel(id) {
var i = 0;
for (; i < container.children.length; i++) {
container.children[i].style.display = i === id ? "block" : "none";
}
p = id;
}
var p = 0;
var container = document.createElement("div");
container.style.cssText = "position:fixed;bottom:0;right:0;cursor:pointer;opacity:0.9;z-index:10000";
container.addEventListener("click", function(event) {
event.preventDefault();
showPanel(++p % container.children.length);
}, false);
var beginTime = (performance || Date).now();
var prevTime = beginTime;
var value = 0;
var fpsPanel = addPanel(new init.Panel("FPS", "#0ff", "#002"));
var msPanel = addPanel(new init.Panel("PING", "#0f0", "#020"));
if (self.performance && self.performance.memory) {
var memPanel = addPanel(new init.Panel("MB", "#f08", "#201"));
}
showPanel(0);
return {
REVISION : 16,
dom : container,
addPanel : addPanel,
showPanel : showPanel,
begin : function() {
beginTime = (performance || Date).now();
},
end : function() {
value++;
var time = (performance || Date).now();
msPanel.update(time - beginTime, 200);
if (time > prevTime + 1E3 && (fpsPanel.update(1E3 * value / (time - prevTime), 100), prevTime = time, value = 0, memPanel)) {
var m = performance.memory;
memPanel.update(m.usedJSHeapSize / 1048576, m.jsHeapSizeLimit / 1048576);
}
return time;
},
update : function() {
beginTime = this.end();
},
domElement : container,
setMode : showPanel
};
};
init.Panel = function(label, container, position) {
var t = Infinity;
var val = 0;
var round = Math.round;
var r = round(window.devicePixelRatio || 1);
var w = 80 * r;
var h = 48 * r;
var right = 3 * r;
var padding = 2 * r;
var x = 3 * r;
var y = 15 * r;
var width = 74 * r;
var height = 30 * r;
var elem = document.createElement("canvas");
elem.width = w;
elem.height = h;
elem.style.cssText = "width:200px;height:120px";
var context = elem.getContext("2d");
context.font = "bold " + 11 * r + "px Helvetica,Arial,sans-serif";
context.textBaseline = "top";
context.fillStyle = position;
context.fillRect(0, 0, w, h);
context.fillStyle = container;
context.fillText(label, right, padding);
context.fillRect(x, y, width, height);
context.fillStyle = position;
context.globalAlpha = .9;
context.fillRect(x, y, width, height);
return {
dom : elem,
update : function(i, radius) {
t = Math.min(t, i);
val = Math.max(val, i);
context.fillStyle = position;
context.globalAlpha = 1;
context.fillRect(0, 0, w, y);
context.fillStyle = container;
context.fillText(round(i) + " " + label + " (" + round(t) + "-" + round(val) + ")", right, padding);
context.drawImage(elem, x + r, y, width - r, height, x, y, width - r, height);
context.fillRect(x + width - r, y, r, height);
context.fillStyle = position;
context.globalAlpha = .9;
context.fillRect(x + width - r, y, r, round((1 - i / radius) * height));
}
};
};
return init;
});
(function() {
'use strict';
const stats = new Stats();
const statsParentNode = document.body;
statsParentNode.appendChild(stats.dom);
requestAnimationFrame(function loop() {
stats.update();
requestAnimationFrame(loop);
});
})();