Skip to content

Added support for root ems #30

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
StarsoftAnalysis wants to merge 3 commits into
base: master
Choose a base branch
from
Open

Added support for root ems #30

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
0c625ee
Added support for root ems
StarsoftAnalysis Nov 7, 2015
b7610be
Added support for root ems
StarsoftAnalysis Nov 7, 2015
8dc08a3
Added support for root ems
StarsoftAnalysis Nov 7, 2015
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
29 changes: 19 additions & 10 deletions elementQuery.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
if (selector != "") {
var parts;
if (!number && !value) {
parts = /^([0-9]*.?[0-9]+)(px|em)$/.exec(pair)
parts = /^([0-9]*.?[0-9]+)(px|em|rem)$/.exec(pair)
if (parts != null) {
number = Number(parts[1]);
if (number + "" != "NaN") {
Expand Down Expand Up @@ -78,7 +78,7 @@

if (selectorText) {

var regex = /(\[(min\-width|max\-width|min\-height|max\-height)\~\=(\'|\")([0-9]*.?[0-9]+)(px|em)(\'|\")\])(\[(min\-width|max\-width|min\-height|max\-height)\~\=(\'|\")([0-9]*.?[0-9]+)(px|em)(\'|\")\])?/gi;
var regex = /(\[(min\-width|max\-width|min\-height|max\-height)\~\=(\'|\")([0-9]*.?[0-9]+)(px|em|rem)(\'|\")\])(\[(min\-width|max\-width|min\-height|max\-height)\~\=(\'|\")([0-9]*.?[0-9]+)(px|em|rem)(\'|\")\])?/gi;

// Split out the full selectors separated by a comma ','
var selectors = selectorText.split(",");
Expand All @@ -94,7 +94,7 @@

// result[2] = min-width|max-width|min-height|max-height
// result[4] = number
// result[5] = px|em
// result[5] = px|em|rem
// result[7] = has another

// Ensure that it contains a valid numeric value to compare against
Expand All @@ -117,7 +117,7 @@
}

// Remove any sibling element queries
tail = tail.replace(/(\[(min\-width|max\-width|min\-height|max\-height)\~\=(\'|\")([0-9]*.?[0-9]+)(px|em)(\'|\")\])/gi, "");
tail = tail.replace(/(\[(min\-width|max\-width|min\-height|max\-height)\~\=(\'|\")([0-9]*.?[0-9]+)(px|em|rem)(\'|\")\])/gi, "");
selector += tail;
}
}
Expand Down Expand Up @@ -265,14 +265,23 @@
// For each min|max-width|height string
for (j in queryData[i]) {

// For each number px|em value pair
// For each number px|em|rem value pair
for (k in queryData[i][j]) {

val = queryData[i][j][k][0];

if (queryData[i][j][k][1] == "em") {
// Convert EMs to pixels
val = val * (window.getEmPixels ? getEmPixels(element) : 16); // NOTE: Using getEmPixels() has a small performance impact
// NOTE: Using getEmPixels() has a small performance impact
switch (queryData[i][j][k][1]) {
case 'em':
// Convert EMs to pixels
val = val * (window.getEmPixels ? getEmPixels(element) : 16);
break;
case 'rem':
// Convert root EMs to pixels
val = val * (window.getEmPixels ? getEmPixels(document.body) : 16);
break;
default:
// assume 'px' - val is already in pixels
}

/* NOTE: Using offsetWidth/Height so an element can be adjusted when it reaches a specific size.
Expand Down Expand Up @@ -336,7 +345,7 @@
// For each min|max-width|height string
for (j in queryData[i]) {

// For each number px|em value pair
// For each number px|em|rem value pair
for (k in queryData[i][j]) {

if (data[i] === undefined) {
Expand Down Expand Up @@ -403,4 +412,4 @@
// Return the em value in pixels
return value;
};
}(document, document.documentElement));
}(document, document.documentElement));