|
|
@@ -0,0 +1,39 @@
|
|
|
+// ==UserScript==
|
|
|
+// @name production.staging.highlight
|
|
|
+// @namespace http://tampermonkey.net/
|
|
|
+// @version 0.1
|
|
|
+// @updateURL https://git.koehls.de/ric/monkeyscripts/raw/master/production.staging.highlight.js
|
|
|
+// @description Colors the local/staging/production site differently.
|
|
|
+// @author Richard Köhl
|
|
|
+// @match *://*.wikipedia.org/*
|
|
|
+// @grant none
|
|
|
+// ==/UserScript==
|
|
|
+/* jshint -W097 */
|
|
|
+"use strict";
|
|
|
+
|
|
|
+// in this example we use wikipedia where language subdomain "de" acts as local environment,
|
|
|
+// "en" as staging and all other languages as productive environments.
|
|
|
+let background = "rgba(170, 0, 0, 0.8)";
|
|
|
+if ( window.location.href.match(/^https?:\/\/en\./) ) {
|
|
|
+ background = "rgba(0, 130, 60, 0.8)";
|
|
|
+} else if ( window.location.href.match(/^https?:\/\/de\./) ) {
|
|
|
+ background = "rgba(90, 0, 130, 0.8)";
|
|
|
+}
|
|
|
+
|
|
|
+// color a specific element (e.g. header)
|
|
|
+const navBar = document.querySelector("#mw-head-base");
|
|
|
+if ( navBar ) {
|
|
|
+ navBar.style.background = background;
|
|
|
+}
|
|
|
+
|
|
|
+// put an overlay over the page that colors the borders
|
|
|
+const div = document.createElement("div");
|
|
|
+div.style.pointerEvents = "none";
|
|
|
+div.style.position = "fixed";
|
|
|
+div.style.left = 0;
|
|
|
+div.style.top = 0;
|
|
|
+div.style.right = 0;
|
|
|
+div.style.bottom = 0;
|
|
|
+div.style.boxShadow = "0 0 50px 10px " + background + " inset";
|
|
|
+div.style.zIndex = 100001;
|
|
|
+document.body.appendChild(div);
|