reduce-css-calc
Advanced tools
Comparing version
@@ -0,1 +1,8 @@ | ||
# 1.1.0 - 2014-08-06 | ||
* support more complex formulas | ||
* use `reduce-function-call` | ||
* better error message | ||
# 1.0.0 - 2014-08-04 | ||
@@ -2,0 +9,0 @@ |
93
index.js
@@ -1,68 +0,21 @@ | ||
/* | ||
/** | ||
* Module dependencies | ||
*/ | ||
var balanced = require("balanced-match") | ||
var reduceFunctionCall = require("reduce-function-call") | ||
/** | ||
* Constantes | ||
*/ | ||
var CALC_FUNC_IDENTIFIER = "calc" | ||
var EXPRESSION_OPT_VENDOR_PREFIX = "(\\-[a-z]+\\-)?" | ||
var EXPRESSION_METHOD_REGEXP = EXPRESSION_OPT_VENDOR_PREFIX + CALC_FUNC_IDENTIFIER | ||
var EXPRESSION_REGEXP = "\\b" + EXPRESSION_METHOD_REGEXP + "\\(" | ||
module.exports = resolveValue | ||
/** | ||
* Walkthrough all expressions, evaluate them and insert them into the declaration | ||
* Expose reduceCssCalc plugin | ||
* | ||
* @param {Array} expressions | ||
* @param {Object} declaration | ||
* @type {Function} | ||
*/ | ||
module.exports = reduceCssCalc | ||
function resolveValue(value) { | ||
getExpressions(value).forEach(function(expression) { | ||
var result = evaluateExpression(expression.body) | ||
value = value.replace( | ||
expression.fn + "(" + expression.body + ")", | ||
result.resolved ? | ||
result.value : | ||
expression.fn + "(" + result.value + ")" | ||
) | ||
}) | ||
return value | ||
} | ||
/** | ||
* Parses expressions in a value | ||
* Reduce CSS calc() in a string, whenever it's possible | ||
* | ||
* @param {String} value | ||
* @returns {Array} | ||
* @api private | ||
* @param {String} value css input | ||
*/ | ||
function getExpressions(value) { | ||
var expressions = [] | ||
var fnRE = new RegExp(EXPRESSION_METHOD_REGEXP) | ||
do { | ||
var searchMatch = fnRE.exec(value) | ||
var fn = searchMatch[0] | ||
var calcStartIndex = searchMatch.index | ||
var calcRef = balanced("(", ")", value.substring(calcStartIndex)) | ||
if (!calcRef) { | ||
throw new SyntaxError("calc(): missing closing ')' in the value '" + value + "'") | ||
} | ||
if (calcRef.body === "") { | ||
throw new Error("calc(): calc() must contain a non-whitespace string") | ||
} | ||
expressions.push({fn: fn, body: calcRef.body}) | ||
value = calcRef.post | ||
} | ||
while (fnRE.test(value)) | ||
return expressions | ||
function reduceCssCalc(value) { | ||
return reduceFunctionCall(value, /((?:\-[a-z]+\-)?calc)\(/, evaluateExpression) | ||
} | ||
@@ -78,13 +31,23 @@ | ||
function evaluateExpression (expression) { | ||
// Remove method names for possible nested expressions: | ||
expression = expression.replace(new RegExp(EXPRESSION_REGEXP, "g"), "(") | ||
function evaluateExpression (expression, functionIdentifier, call) { | ||
if (expression === "") { | ||
throw new Error(functionIdentifier + "(): '" + call + "' must contain a non-whitespace string") | ||
} | ||
var balancedExpr = balanced("(", ")", expression) | ||
if (balancedExpr) { | ||
while (balancedExpr) { | ||
if (balancedExpr.body === "") { | ||
throw new Error("calc(): () must contain a non-whitespace string") | ||
throw new Error(functionIdentifier + "(): '" + expression + "' must contain a non-whitespace string") | ||
} | ||
expression = balancedExpr.pre + evaluateExpression(balancedExpr.body).value + balancedExpr.post | ||
var evaluated = evaluateExpression(balancedExpr.body, functionIdentifier, call) | ||
// if result didn't change since the last try, we consider it won't change anymore | ||
if (evaluated === balancedExpr.body) { | ||
balancedExpr = false | ||
} | ||
else { | ||
expression = balancedExpr.pre + evaluated + balancedExpr.post | ||
balancedExpr = balanced("(", ")", expression) | ||
} | ||
} | ||
@@ -96,3 +59,3 @@ | ||
if (units.length > 1) { | ||
return {resolved: false, value: expression} | ||
return functionIdentifier + "(" + expression + ")" | ||
} | ||
@@ -117,3 +80,3 @@ | ||
catch (e) { | ||
return {resolved: false, value: expression} | ||
return functionIdentifier + "(" + expression + ")" | ||
} | ||
@@ -131,3 +94,3 @@ | ||
return {resolved: true, value: result} | ||
return result | ||
} | ||
@@ -134,0 +97,0 @@ |
{ | ||
"name": "reduce-css-calc", | ||
"version": "1.0.0", | ||
"version": "1.1.0", | ||
"description": "Reduce CSS calc() function to the maximum", | ||
@@ -23,3 +23,4 @@ "keywords": [ | ||
"dependencies": { | ||
"balanced-match": "~0.1.0" | ||
"balanced-match": "~0.1.0", | ||
"reduce-function-call": "^1.0.0" | ||
}, | ||
@@ -34,6 +35,6 @@ "devDependencies": { | ||
"scripts": { | ||
"jscc": "jscs *.js", | ||
"jshint": "jshint *.js --reporter node_modules/jshint-stylish/stylish.js", | ||
"jscs": "jscs *.js **/*.js", | ||
"jshint": "jshint . --exclude node_modules --reporter node_modules/jshint-stylish/stylish.js", | ||
"test": "npm run jscs && npm run jshint && tape test | tap-colorize" | ||
} | ||
} |
# reduce-css-calc [](https://travis-ci.org/MoOx/reduce-css-calc) | ||
Reduce CSS calc() function at the maximum. | ||
Reduce CSS calc() function to the maximum. | ||
@@ -5,0 +5,0 @@ Particularly useful for packages like [rework-calc](https://github.com/reworkcss/rework-calc) or [postcss-calc](https://github.com/postcss/postcss-calc). |
6441
-9.42%2
100%98
-22.83%+ Added
+ Added
+ Added