Widget:Colorblind

 Colorvision Prota- / Deuteranopia Tritanopia            function setColorblind(mode) { mode = mode.toLowerCase; var svgMaps = document.getElementsByClassName('replaced-svg'); if (svgMaps.length == 0) { // if svg-files are not yet replaced with inline-code replaceSVGWithInline; }       var colorBlindEls = document.getElementsByClassName('colorBlindToggleable'); Array.from(colorBlindEls).forEach(function(el) {           // remove other colorblind-classes				            el.classList.remove('spawningMap-deuteranopia', 'spawningMap-tritanopia');            if (mode != 'colorvision')                el.classList.add('spawningMap-' + mode);        }); }

function replaceSVGWithInline { /*        * Replace all SVG images with inline SVG. source: https://stackoverflow.com/a/43015413/1523086 */       document.querySelectorAll('.svgCreatureMap img').forEach(function(img) {            var imgID = img.id;            var imgClass = img.className;            var imgURL = img.src.substring(0, img.src.indexOf('.svg', 74) + 4);            fetch(imgURL, {cache:'reload'}).then(function(response) { return response.text; }).then(function(text) { var parser = new DOMParser; var xmlDoc = parser.parseFromString(text, "text/xml"); // Get the SVG tag, ignore the rest var svg = xmlDoc.getElementsByTagName('svg')[0]; // Add replaced image's ID to the new SVG if (svg != null && typeof imgID !== 'undefined') { svg.setAttribute('id', imgID); }               // Add replaced image's classes to the new SVG if (typeof imgClass !== 'undefined') { svg.classList.add('replaced-svg'); }

// Remove any invalid XML tags as per http://validator.w3.org svg.removeAttribute('xmlns:a');

svg.setAttribute('width', img.getAttribute('width')); svg.setAttribute('height', img.getAttribute('height')); // Unset the absolute positioning of the SVG. Force the element to occupy // only as much width as its parent allows, and determine the height automatically // using SVG's viewbox. svg.setAttribute('style', 'max-width:100%; height: auto');

// Check if the viewport is set, if the viewport is not set the SVG wont't scale. if (!svg.getAttribute('viewBox') && svg.getAttribute('height') && svg.getAttribute('width')) { svg.setAttribute('viewBox', '0 0 ' + svg.getAttribute('height') + ' ' + svg.getAttribute('width')) }

// remove the style-definitions (they're defined on the page), so they're not ambigious when multiple files are on one page svg.removeChild(svg.children[0]);

// Replace image with new SVG img.parentNode.replaceChild(svg, img); });       });    }