https://glaucoma.org.au/sites/default/files/js/optimized/js_PJAmcL…cQHpFhl9BddxLd-E4Hh9Ftj7TdK0eVDLY.js?tm5jem

1/* Source and licensing information for the line(s) below can be found at https://glaucoma.org.au/themes/custom/glaucoma/components/js/polyfills/css-var-polyfill.js. */
2/*!
3 * css-var-polyfill.js - v1.1.2
4 *
5 * Copyright (c) 2019 Aaron Barker <http://aaronbarker.net>
6 * Released under the MIT license
7 *
8 * Date: 2019-03-23
9 */
10let cssVarPoly = {
11  init: function() {
12    // first lets see if the browser supports CSS variables
13    // No version of IE supports window.CSS.supports, so if that isn't supported in the first place we know CSS variables is not supported
14    // Edge supports supports, so check for actual variable support
15    if (window.CSS && window.CSS.supports && window.CSS.supports('(--foo: red)')) {
16      // this browser does support variables, abort
17      console.log('your browser supports CSS variables, aborting and letting the native support handle things.');
18      return;
19    } else {
20      // edge barfs on console statements if the console is not open... lame!
21      console.log('no support for you! polyfill all (some of) the things!!');
22      document.querySelector('body').classList.add('cssvars-polyfilled');
23    }
24
25    cssVarPoly.ratifiedVars = {};
26    cssVarPoly.varsByBlock = {};
27    cssVarPoly.oldCSS = {};
28
29    // start things off
30    cssVarPoly.findCSS();
31    cssVarPoly.updateCSS();
32  },
33
34  // find all the css blocks, save off the content, and look for variables
35  findCSS: function() {
36    let styleBlocks = document.querySelectorAll('style:not(.inserted),link[rel="stylesheet"],link[rel="import"]');
37
38    // we need to track the order of the style/link elements when we save off the CSS, set a counter
39    let counter = 1;
40
41    // loop through all CSS blocks looking for CSS variables being set
42    [].forEach.call(styleBlocks, function(block) {
43      // console.log(block.nodeName);
44      let theCSS;
45      if (block.nodeName === 'STYLE') {
46        // console.log("style");
47        theCSS = block.innerHTML;
48        cssVarPoly.findSetters(theCSS, counter);
49      } else if (block.nodeName === 'LINK') {
50        // console.log("link");
51        cssVarPoly.getLink(block.getAttribute('href'), counter, function(counter, request) {
52          cssVarPoly.findSetters(request.responseText, counter);
53          cssVarPoly.oldCSS[counter] = request.responseText;
54          cssVarPoly.updateCSS();
55        });
56        theCSS = '';
57      }
58      // save off the CSS to parse through again later. the value may be empty for links that are waiting for their ajax return, but this will maintain the order
59      cssVarPoly.oldCSS[counter] = theCSS;
60      counter++;
61    });
62  },
63
64  // find all the "--variable: value" matches in a provided block of CSS and add them to the master list
65  findSetters: function(theCSS, counter) {
66    // console.log(theCSS);
67    cssVarPoly.varsByBlock[counter] = theCSS.match(/(--[^:)]+:[\s]*[^;}]+)/g) || [];
68  },
69
70  // run through all the CSS blocks to update the variables and then inject on the page
71  updateCSS: function() {
72    // first lets loop through all the variables to make sure later vars trump earlier vars
73    cssVarPoly.ratifySetters(cssVarPoly.varsByBlock);
74
75    // loop through the css blocks (styles and links)
76    for (let curCSSID in cssVarPoly.oldCSS) {
77      // console.log("curCSS:", cssVarPoly.oldCSS[curCSSID]);
78      let newCSS = cssVarPoly.replaceGetters(cssVarPoly.oldCSS[curCSSID], cssVarPoly.ratifiedVars);
79      // put it back into the page
80      // first check to see if this block exists already
81      if (document.querySelector('#inserted' + curCSSID)) {
82        // console.log("updating")
83        document.querySelector('#inserted' + curCSSID).innerHTML = newCSS;
84      } else {
85        // console.log("adding");
86        var style = document.createElement('style');
87        style.type = 'text/css';
88        style.innerHTML = newCSS;
89        style.classList.add('inserted');
90        style.id = 'inserted' + curCSSID;
91        document.getElementsByTagName('head')[0].appendChild(style);
92      }
93    };
94  },
95
96  // parse a provided block of CSS looking for a provided list of variables and replace the --var-name with the correct value
97  replaceGetters: function(curCSS, varList) {
98    // console.log(varList);
99    for (let theVar in varList) {
100      // console.log(theVar);
101      // match the variable with the actual variable name
102      let getterRegex = new RegExp('var\\(\\s*' + theVar + '\\s*\\)', 'g');
103      // console.log(getterRegex);
104      // console.log(curCSS);
105      curCSS = curCSS.replace(getterRegex, varList[theVar]);
106
107      // now check for any getters that are left that have fallbacks
108      let getterRegex2 = new RegExp('var\\([^\\)]+,\\s*([^\\)]+)\\)', 'g');
109      // console.log(getterRegex);
110      // console.log(curCSS);
111      let matches = curCSS.match(getterRegex2);
112      if (matches) {
113        // console.log("matches",matches);

114        matches.forEach(function(match) {
115          // console.log(match.match(/var\(.+,\s*(.+)\)/))
116          // find the fallback within the getter
117          curCSS = curCSS.replace(match, match.match(/var\([^\)]+,\s*([^\)]+)\)/)[1]);
118        });
119
120      }
121
122      // curCSS = curCSS.replace(getterRegex2,varList[theVar]);
123    };
124    // console.log(curCSS);
125    return curCSS;
126  },
127
128  // determine the css variable name value pair and track the latest
129  ratifySetters: function(varList) {
130    // console.log("varList:",varList);
131    // loop through each block in order, to maintain order specificity
132    for (let curBlock in varList) {
133      let curVars = varList[curBlock];
134      // console.log("curVars:",curVars);
135      // loop through each var in the block
136      curVars.forEach(function(theVar) {
137        // console.log(theVar);
138        // split on the name value pair separator
139        let matches = theVar.split(/:\s*/);
140        // console.log(matches);
141        // put it in an object based on the varName. Each time we do this it will override a previous use and so will always have the last set be the winner
142        // 0 = the name, 1 = the value, strip off the ; if it is there
143        cssVarPoly.ratifiedVars[matches[0]] = matches[1].replace(/;/, '');
144      });
145    };
146    // console.log(cssVarPoly.ratifiedVars);
147  },
148
149  // get the CSS file (same domain for now)
150  getLink: function(url, counter, success) {
151    var request = new XMLHttpRequest();
152    request.open('GET', url, true);
153    request.overrideMimeType('text/css;');
154    request.onload = function() {
155      if (request.status >= 200 && request.status < 400) {
156        // Success!
157        // console.log(request.responseText);
158        if (typeof success === 'function') {
159          success(counter, request);
160        }
161      } else {
162        // We reached our target server, but it returned an error
163        console.warn('an error was returned from:', url);
164      }
165    };
166
167    request.onerror = function() {
168      // There was a connection error of some sort
169      console.warn('we could not get anything from:', url);
170    };
171
172    request.send();
173  }
174};
175
176cssVarPoly.init();
177
178/* Source and licensing information for the above line(s) can be found at https://glaucoma.org.au/themes/custom/glaucoma/components/js/polyfills/css-var-polyfill.js. */