From aab115e1322138de273c3e9c930d31095198ac4b Mon Sep 17 00:00:00 2001 From: Lucas Serven Date: Tue, 21 May 2013 16:11:07 -0400 Subject: [PATCH 1/4] Cleaned up code to prepare for updates --- js/rem.js | 103 ++++++++++++++++++++++++++------------------------ js/rem.min.js | 14 +++---- 2 files changed, 60 insertions(+), 57 deletions(-) diff --git a/js/rem.js b/js/rem.js index 3cb57e9..63a3650 100644 --- a/js/rem.js +++ b/js/rem.js @@ -1,5 +1,5 @@ (function (window, undefined) { - + "use strict"; // test for REM unit support var cssremunit = function() { var div = document.createElement( 'div' ); @@ -12,7 +12,7 @@ isStyleSheet = function () { var styles = document.getElementsByTagName('link'), filteredStyles = []; - for (i = 0; i < styles.length; i++) { + for ( var i = 0; i < styles.length; i++) { if ( styles[i].rel.toLowerCase() === 'stylesheet' && !styles[i].hasAttribute('data-norem') ) { filteredStyles.push( styles[i] ); } @@ -23,35 +23,35 @@ processSheets = function () { var links = []; - sheets = isStyleSheet(); //search for link tags and confirm it's a stylesheet - sheets.og = sheets.length; //store the original length of sheets as a property + sheets = isStyleSheet(); // search for link tags and confirm it's a stylesheet + sheets.og = sheets.length; // store the original length of sheets as a property for( var i = 0; i < sheets.length; i++ ){ links[i] = sheets[i].href; - xhr( links[i], matchcss, i ); + xhr( links[i], matchCSS, i ); } }, - matchcss = function ( response, i ) { //collect all of the rules from the xhr response texts and match them to a pattern + matchCSS = function ( response, i ) { // collect all of the rules from the xhr response texts and match them to a pattern var clean = removeComments( response.responseText ), - pattern = /[\w\d\s\-\/\\\[\]:,.'"*()<>+~%#^$_=|]+\{[\w\d\s\-\/\\%#:;,.'"*()]+\d*\.{0,1}\d+rem[\w\d\s\-\/\\%#:;,.'"*()]*\}/g, //find selectors that use rem in one or more of their rules + pattern = /[\w\d\s\-\/\\\[\]:,.'"*()<>+~%#^$_=|@]+\{[\w\d\s\-\/\\%#:;,.'"*()]+\d*\.?\d+rem[\w\d\s\-\/\\%#:;,.'"*()]*\}/g, //find selectors that use rem in one or more of their rules current = clean.match(pattern), - remPattern =/\d*\.{0,1}\d+rem/g, + remPattern =/\d*\.?\d+rem/g, remCurrent = clean.match(remPattern); if( current !== null && current.length !== 0 ){ - found = found.concat( current ); //save all of the blocks of rules with rem in a property - foundProps = foundProps.concat( remCurrent ); //save all of the properties with rem + found = found.concat( current ); // save all of the blocks of rules with rem in a property + foundProps = foundProps.concat( remCurrent ); // save all of the properties with rem } if( i === sheets.og-1 ){ - buildIt(); + buildCSS(); } }, - buildIt = function () { //first build each individual rule from elements in the found array and then add it to the string of rules. - var pattern = /[\w\d\s\-\/\\%#:,.'"*()]+\d*\.{0,1}\d+rem[\w\d\s\-\/\\%#:,.'"*()]*[;}]/g; //find properties with rem values in them + buildCSS = function () { // first build each individual rule from elements in the found array and then add it to the string of rules. + var pattern = /[\w\d\s\-\/\\%#:,.'"*()]+\d*\.?\d+rem[\w\d\s\-\/\\%#:,.'"*()]*[;}]/g; // find properties with rem values in them for( var i = 0; i < found.length; i++ ){ - rules = rules + found[i].substr(0,found[i].indexOf("{")+1); //save the selector portion of each rule with a rem value + rules = rules + found[i].substr(0,found[i].indexOf("{")+1); // save the selector portion of each rule with a rem value var current = found[i].match( pattern ); - for( var j = 0; j= 0 ) { - fontSize = body.currentStyle['fontSize'].replace('px', ''); - } else if ( body.currentStyle['fontSize'].indexOf("em") >= 0 ) { - fontSize = body.currentStyle['fontSize'].replace('em', ''); - } else if ( body.currentStyle['fontSize'].indexOf("pt") >= 0 ) { - fontSize = body.currentStyle['fontSize'].replace('pt', ''); + if ( body.currentStyle.fontSize.indexOf("px") >= 0 ) { + fontSize = body.currentStyle.fontSize.replace('px', ''); + } else if ( body.currentStyle.fontSize.indexOf("em") >= 0 ) { + fontSize = body.currentStyle.fontSize.replace('em', ''); + } else if ( body.currentStyle.fontSize.indexOf("pt") >= 0 ) { + fontSize = body.currentStyle.fontSize.replace('pt', ''); } else { - fontSize = (body.currentStyle['fontSize'].replace('%', '') / 100) * 16; //IE8 returns the percentage while other browsers return the computed value + fontSize = (body.currentStyle.fontSize.replace('%', '') / 100) * 16; // IE8 returns the percentage while other browsers return the computed value } - } else if (window.getComputedStyle) - fontSize = document.defaultView.getComputedStyle(body, null).getPropertyValue('font-size').replace('px', ''); //find font-size in body element + } else if (window.getComputedStyle) { + fontSize = document.defaultView.getComputedStyle(body, null).getPropertyValue('font-size').replace('px', ''); // find font-size in body element + } processSheets(); - } else { - // do nothing, you are awesome and have REM support - } + } // else { do nothing, you are awesome and have REM support } })(window); diff --git a/js/rem.min.js b/js/rem.min.js index da5dd08..44923b6 100644 --- a/js/rem.min.js +++ b/js/rem.min.js @@ -1,7 +1,7 @@ -(function(window,undefined){var cssremunit=function(){var div=document.createElement("div");div.style.cssText="font-size: 1rem;";return/rem/.test(div.style.fontSize)},isStyleSheet=function(){var styles=document.getElementsByTagName("link"),filteredStyles=[];for(i=0;i+~%#^$_=|]+\{[\w\d\s\-\/\\%#:;,.'"*()]+\d*\.{0,1}\d+rem[\w\d\s\-\/\\%#:;,.'"*()]*\}/g,current=clean.match(pattern),remPattern=/\d*\.{0,1}\d+rem/g,remCurrent=clean.match(remPattern);if(current!==null&¤t.length!==0){found=found.concat(current);foundProps=foundProps.concat(remCurrent)}if(i===sheets.og-1)buildIt()},buildIt=function(){var pattern= -/[\w\d\s\-\/\\%#:,.'"*()]+\d*\.{0,1}\d+rem[\w\d\s\-\/\\%#:,.'"*()]*[;}]/g;for(var i=0;i-1&&end>start){css=css.substring(0,start)+css.substring(end+2);return removeComments(css)}else return css},getXMLHttpRequest=function(){if(window.XMLHttpRequest)return new XMLHttpRequest;else try{return new ActiveXObject("MSXML2.XMLHTTP")}catch(e1){try{return new ActiveXObject("Microsoft.XMLHTTP")}catch(e2){}}}; -if(!cssremunit()){var rules="",sheets=[],found=[],foundProps=[],css=[],body=document.getElementsByTagName("body")[0],fontSize="";if(body.currentStyle)if(body.currentStyle["fontSize"].indexOf("px")>=0)fontSize=body.currentStyle["fontSize"].replace("px","");else if(body.currentStyle["fontSize"].indexOf("em")>=0)fontSize=body.currentStyle["fontSize"].replace("em","");else if(body.currentStyle["fontSize"].indexOf("pt")>=0)fontSize=body.currentStyle["fontSize"].replace("pt","");else fontSize=body.currentStyle["fontSize"].replace("%", -"")/100*16;else if(window.getComputedStyle)fontSize=document.defaultView.getComputedStyle(body,null).getPropertyValue("font-size").replace("px","");processSheets()}else;})(window); \ No newline at end of file +(function(window,undefined){var cssremunit=function(){var div=document.createElement("div");div.style.cssText="font-size: 1rem;";return/rem/.test(div.style.fontSize)},isStyleSheet=function(){var styles=document.getElementsByTagName("link"),filteredStyles=[];for(var i=0;i+~%#^$_=|@]+\{[\w\d\s\-\/\\%#:;,.'"*()]+\d*\.?\d+rem[\w\d\s\-\/\\%#:;,.'"*()]*\}/g,current=clean.match(pattern),remPattern=/\d*\.?\d+rem/g,remCurrent=clean.match(remPattern);if(current!==null&¤t.length!==0){found=found.concat(current);foundProps=foundProps.concat(remCurrent)}if(i===sheets.og-1)buildCSS()}, +buildCSS=function(){var pattern=/[\w\d\s\-\/\\%#:,.'"*()]+\d*\.?\d+rem[\w\d\s\-\/\\%#:,.'"*()]*[;}]/g;for(var i=0;i-1&&end>start){css=css.substring(0,start)+css.substring(end+2);return removeComments(css)}else return css}, +getXMLHttpRequest=function(){if(window.XMLHttpRequest)return new XMLHttpRequest;else try{return new ActiveXObject("MSXML2.XMLHTTP")}catch(e1){try{return new ActiveXObject("Microsoft.XMLHTTP")}catch(e2){}}};if(!cssremunit()){var rules="",sheets=[],found=[],foundProps=[],css=[],body=document.getElementsByTagName("body")[0],fontSize="";if(body.currentStyle)if(body.currentStyle.fontSize.indexOf("px")>=0)fontSize=body.currentStyle.fontSize.replace("px","");else if(body.currentStyle.fontSize.indexOf("em")>= +0)fontSize=body.currentStyle.fontSize.replace("em","");else if(body.currentStyle.fontSize.indexOf("pt")>=0)fontSize=body.currentStyle.fontSize.replace("pt","");else fontSize=body.currentStyle.fontSize.replace("%","")/100*16;else if(window.getComputedStyle)fontSize=document.defaultView.getComputedStyle(body,null).getPropertyValue("font-size").replace("px","");processSheets()}})(window); \ No newline at end of file From 8079f2ad4053d1408b81f5e68157b4077f4390d9 Mon Sep 17 00:00:00 2001 From: Lucas Serven Date: Tue, 4 Jun 2013 11:47:18 -0400 Subject: [PATCH 2/4] Patch for issue 15 --- js/rem.js | 3 ++- js/rem.min.js | 14 +++++++------- 2 files changed, 9 insertions(+), 8 deletions(-) diff --git a/js/rem.js b/js/rem.js index 3cb57e9..bb3c7ff 100644 --- a/js/rem.js +++ b/js/rem.js @@ -13,7 +13,8 @@ var styles = document.getElementsByTagName('link'), filteredStyles = []; for (i = 0; i < styles.length; i++) { - if ( styles[i].rel.toLowerCase() === 'stylesheet' && !styles[i].hasAttribute('data-norem') ) { + // here we need to use getAttribute instead of hasAttribute to support IE < 8 + if ( styles[i].rel.toLowerCase() === 'stylesheet' && styles[i].getAttribute('data-norem') !== null ) { filteredStyles.push( styles[i] ); } } diff --git a/js/rem.min.js b/js/rem.min.js index da5dd08..77b73f0 100644 --- a/js/rem.min.js +++ b/js/rem.min.js @@ -1,7 +1,7 @@ -(function(window,undefined){var cssremunit=function(){var div=document.createElement("div");div.style.cssText="font-size: 1rem;";return/rem/.test(div.style.fontSize)},isStyleSheet=function(){var styles=document.getElementsByTagName("link"),filteredStyles=[];for(i=0;i+~%#^$_=|]+\{[\w\d\s\-\/\\%#:;,.'"*()]+\d*\.{0,1}\d+rem[\w\d\s\-\/\\%#:;,.'"*()]*\}/g,current=clean.match(pattern),remPattern=/\d*\.{0,1}\d+rem/g,remCurrent=clean.match(remPattern);if(current!==null&¤t.length!==0){found=found.concat(current);foundProps=foundProps.concat(remCurrent)}if(i===sheets.og-1)buildIt()},buildIt=function(){var pattern= -/[\w\d\s\-\/\\%#:,.'"*()]+\d*\.{0,1}\d+rem[\w\d\s\-\/\\%#:,.'"*()]*[;}]/g;for(var i=0;i-1&&end>start){css=css.substring(0,start)+css.substring(end+2);return removeComments(css)}else return css},getXMLHttpRequest=function(){if(window.XMLHttpRequest)return new XMLHttpRequest;else try{return new ActiveXObject("MSXML2.XMLHTTP")}catch(e1){try{return new ActiveXObject("Microsoft.XMLHTTP")}catch(e2){}}}; -if(!cssremunit()){var rules="",sheets=[],found=[],foundProps=[],css=[],body=document.getElementsByTagName("body")[0],fontSize="";if(body.currentStyle)if(body.currentStyle["fontSize"].indexOf("px")>=0)fontSize=body.currentStyle["fontSize"].replace("px","");else if(body.currentStyle["fontSize"].indexOf("em")>=0)fontSize=body.currentStyle["fontSize"].replace("em","");else if(body.currentStyle["fontSize"].indexOf("pt")>=0)fontSize=body.currentStyle["fontSize"].replace("pt","");else fontSize=body.currentStyle["fontSize"].replace("%", -"")/100*16;else if(window.getComputedStyle)fontSize=document.defaultView.getComputedStyle(body,null).getPropertyValue("font-size").replace("px","");processSheets()}else;})(window); \ No newline at end of file +(function(window,undefined){var cssremunit=function(){var div=document.createElement("div");div.style.cssText="font-size: 1rem;";return/rem/.test(div.style.fontSize)},isStyleSheet=function(){var styles=document.getElementsByTagName("link"),filteredStyles=[];for(i=0;i+~%#^$_=|]+\{[\w\d\s\-\/\\%#:;,.'"*()]+\d*\.{0,1}\d+rem[\w\d\s\-\/\\%#:;,.'"*()]*\}/g,current=clean.match(pattern),remPattern=/\d*\.{0,1}\d+rem/g,remCurrent=clean.match(remPattern);if(current!==null&¤t.length!==0){found=found.concat(current);foundProps=foundProps.concat(remCurrent)}if(i=== +sheets.og-1)buildIt()},buildIt=function(){var pattern=/[\w\d\s\-\/\\%#:,.'"*()]+\d*\.{0,1}\d+rem[\w\d\s\-\/\\%#:,.'"*()]*[;}]/g;for(var i=0;i-1&&end>start){css=css.substring(0,start)+css.substring(end+2);return removeComments(css)}else return css}, +getXMLHttpRequest=function(){if(window.XMLHttpRequest)return new XMLHttpRequest;else try{return new ActiveXObject("MSXML2.XMLHTTP")}catch(e1){try{return new ActiveXObject("Microsoft.XMLHTTP")}catch(e2){}}};if(!cssremunit()){var rules="",sheets=[],found=[],foundProps=[],css=[],body=document.getElementsByTagName("body")[0],fontSize="";if(body.currentStyle)if(body.currentStyle["fontSize"].indexOf("px")>=0)fontSize=body.currentStyle["fontSize"].replace("px","");else if(body.currentStyle["fontSize"].indexOf("em")>= +0)fontSize=body.currentStyle["fontSize"].replace("em","");else if(body.currentStyle["fontSize"].indexOf("pt")>=0)fontSize=body.currentStyle["fontSize"].replace("pt","");else fontSize=body.currentStyle["fontSize"].replace("%","")/100*16;else if(window.getComputedStyle)fontSize=document.defaultView.getComputedStyle(body,null).getPropertyValue("font-size").replace("px","");processSheets()}else;})(window); \ No newline at end of file From 63718bca380c8f01711865e679b2e41ffb1fe88f Mon Sep 17 00:00:00 2001 From: Lucas Serven Date: Tue, 4 Jun 2013 11:51:40 -0400 Subject: [PATCH 3/4] Fixed comparison logic --- js/rem.js | 2 +- js/rem.min.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/js/rem.js b/js/rem.js index bb3c7ff..3814ba3 100644 --- a/js/rem.js +++ b/js/rem.js @@ -14,7 +14,7 @@ filteredStyles = []; for (i = 0; i < styles.length; i++) { // here we need to use getAttribute instead of hasAttribute to support IE < 8 - if ( styles[i].rel.toLowerCase() === 'stylesheet' && styles[i].getAttribute('data-norem') !== null ) { + if ( styles[i].rel.toLowerCase() === 'stylesheet' && styles[i].getAttribute('data-norem') === null ) { filteredStyles.push( styles[i] ); } } diff --git a/js/rem.min.js b/js/rem.min.js index 77b73f0..6d7c4ec 100644 --- a/js/rem.min.js +++ b/js/rem.min.js @@ -1,4 +1,4 @@ -(function(window,undefined){var cssremunit=function(){var div=document.createElement("div");div.style.cssText="font-size: 1rem;";return/rem/.test(div.style.fontSize)},isStyleSheet=function(){var styles=document.getElementsByTagName("link"),filteredStyles=[];for(i=0;i+~%#^$_=|]+\{[\w\d\s\-\/\\%#:;,.'"*()]+\d*\.{0,1}\d+rem[\w\d\s\-\/\\%#:;,.'"*()]*\}/g,current=clean.match(pattern),remPattern=/\d*\.{0,1}\d+rem/g,remCurrent=clean.match(remPattern);if(current!==null&¤t.length!==0){found=found.concat(current);foundProps=foundProps.concat(remCurrent)}if(i=== sheets.og-1)buildIt()},buildIt=function(){var pattern=/[\w\d\s\-\/\\%#:,.'"*()]+\d*\.{0,1}\d+rem[\w\d\s\-\/\\%#:,.'"*()]*[;}]/g;for(var i=0;i Date: Tue, 4 Jun 2013 16:05:16 -0400 Subject: [PATCH 4/4] Added try/catch to support IE7 --- js/rem.js | 7 +++++-- js/rem.min.js | 8 ++++---- 2 files changed, 9 insertions(+), 6 deletions(-) diff --git a/js/rem.js b/js/rem.js index 3814ba3..5be50d9 100644 --- a/js/rem.js +++ b/js/rem.js @@ -90,13 +90,16 @@ var xhr = getXMLHttpRequest(); xhr.open( 'GET', url, true ); xhr.send(); - if ( window.XMLHttpRequest ){ //If browser supports AJAX + try { + // This targets modern browsers and modern versions of IE, + // which don't need the "new" keyword. xhr.onreadystatechange = function() { if ( xhr.readyState === 4 ){ callback(xhr, i); } else { /*callback function on AJAX error*/ } }; - } else { // Then we expect the browser should support AJAX through ActiveX (basically used to target IE6 and IE7) + } catch (e) { + // This block targets old versions of IE, which require "new". xhr.onreadystatechange = new function() { //IE6 and IE7 need the "new function()" syntax to work properly if ( xhr.readyState === 4 ){ callback(xhr, i); diff --git a/js/rem.min.js b/js/rem.min.js index 6d7c4ec..c028202 100644 --- a/js/rem.min.js +++ b/js/rem.min.js @@ -1,7 +1,7 @@ (function(window,undefined){var cssremunit=function(){var div=document.createElement("div");div.style.cssText="font-size: 1rem;";return/rem/.test(div.style.fontSize)},isStyleSheet=function(){var styles=document.getElementsByTagName("link"),filteredStyles=[];for(i=0;i+~%#^$_=|]+\{[\w\d\s\-\/\\%#:;,.'"*()]+\d*\.{0,1}\d+rem[\w\d\s\-\/\\%#:;,.'"*()]*\}/g,current=clean.match(pattern),remPattern=/\d*\.{0,1}\d+rem/g,remCurrent=clean.match(remPattern);if(current!==null&¤t.length!==0){found=found.concat(current);foundProps=foundProps.concat(remCurrent)}if(i=== sheets.og-1)buildIt()},buildIt=function(){var pattern=/[\w\d\s\-\/\\%#:,.'"*()]+\d*\.{0,1}\d+rem[\w\d\s\-\/\\%#:,.'"*()]*[;}]/g;for(var i=0;i-1&&end>start){css=css.substring(0,start)+css.substring(end+2);return removeComments(css)}else return css}, -getXMLHttpRequest=function(){if(window.XMLHttpRequest)return new XMLHttpRequest;else try{return new ActiveXObject("MSXML2.XMLHTTP")}catch(e1){try{return new ActiveXObject("Microsoft.XMLHTTP")}catch(e2){}}};if(!cssremunit()){var rules="",sheets=[],found=[],foundProps=[],css=[],body=document.getElementsByTagName("body")[0],fontSize="";if(body.currentStyle)if(body.currentStyle["fontSize"].indexOf("px")>=0)fontSize=body.currentStyle["fontSize"].replace("px","");else if(body.currentStyle["fontSize"].indexOf("em")>= -0)fontSize=body.currentStyle["fontSize"].replace("em","");else if(body.currentStyle["fontSize"].indexOf("pt")>=0)fontSize=body.currentStyle["fontSize"].replace("pt","");else fontSize=body.currentStyle["fontSize"].replace("%","")/100*16;else if(window.getComputedStyle)fontSize=document.defaultView.getComputedStyle(body,null).getPropertyValue("font-size").replace("px","");processSheets()}else;})(window); \ No newline at end of file +3)*fontSize))+"px";loadCSS()},loadCSS=function(){for(var i=0;i-1&&end>start){css=css.substring(0,start)+css.substring(end+2);return removeComments(css)}else return css},getXMLHttpRequest= +function(){if(window.XMLHttpRequest)return new XMLHttpRequest;else try{return new ActiveXObject("MSXML2.XMLHTTP")}catch(e1){try{return new ActiveXObject("Microsoft.XMLHTTP")}catch(e2){}}};if(!cssremunit()){var rules="",sheets=[],found=[],foundProps=[],css=[],body=document.getElementsByTagName("body")[0],fontSize="";if(body.currentStyle)if(body.currentStyle["fontSize"].indexOf("px")>=0)fontSize=body.currentStyle["fontSize"].replace("px","");else if(body.currentStyle["fontSize"].indexOf("em")>=0)fontSize= +body.currentStyle["fontSize"].replace("em","");else if(body.currentStyle["fontSize"].indexOf("pt")>=0)fontSize=body.currentStyle["fontSize"].replace("pt","");else fontSize=body.currentStyle["fontSize"].replace("%","")/100*16;else if(window.getComputedStyle)fontSize=document.defaultView.getComputedStyle(body,null).getPropertyValue("font-size").replace("px","");processSheets()}else;})(window); \ No newline at end of file