Skip to content

Add support for CSS3 calc #128

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.

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

Merged
merged 6 commits into from
Jul 2, 2018
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
2 changes: 1 addition & 1 deletion lib/Sabberworm/CSS/OutputFormat.php
Original file line number Diff line number Diff line change
Expand Up @@ -286,4 +286,4 @@ private function prepareSpace($sSpaceString) {
private function indent() {
return str_repeat($this->oFormat->sIndentation, $this->oFormat->level());
}
}
}
40 changes: 40 additions & 0 deletions lib/Sabberworm/CSS/Parser.php
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,9 @@
use Sabberworm\CSS\CSSList\AtRuleBlockList;
use Sabberworm\CSS\RuleSet\DeclarationBlock;
use Sabberworm\CSS\Value\CSSFunction;
use Sabberworm\CSS\Value\CalcFunction;
use Sabberworm\CSS\Value\RuleValueList;
use Sabberworm\CSS\Value\CalcRuleValueList;
use Sabberworm\CSS\Value\Size;
use Sabberworm\CSS\Value\Color;
use Sabberworm\CSS\Value\URL;
Expand Down Expand Up @@ -434,6 +436,8 @@ private function parsePrimitiveValue() {
$oValue = $this->parseColorValue();
} else if ($this->comes('url', true)) {
$oValue = $this->parseURLValue();
} else if ($this->comes('calc', true) || $this->comes('-webkit-calc', true) || $this->comes('-moz-calc', true)) {
$oValue = $this->parseCalcValue();
} else if ($this->comes("'") || $this->comes('"')) {
$oValue = $this->parseStringValue();
} else if ($this->comes("progid:") && $this->oParserSettings->bLenientParsing) {
Expand Down Expand Up @@ -520,6 +524,42 @@ private function parseURLValue() {
return $oResult;
}

private function parseCalcValue() {
$aOperators = array('+', '-', '*', '/', '(', ')');
$sFunction = trim($this->consumeUntil('(', false, true));
$oCalcList = new CalcRuleValueList($this->iLineNo);
$oList = new RuleValueList(',', $this->iLineNo);
$iNestingLevel = 0;
$iLastComponentType = NULL;
while(!$this->comes(')') || $iNestingLevel > 0) {
$this->consumeWhiteSpace();
if (in_array($this->peek(), $aOperators)) {
if (($this->comes('-') || $this->comes('+'))) {
if ($this->peek(1, -1) != ' ' || !($this->comes('- ') || $this->comes('+ '))) {
throw new UnexpectedTokenException(" {$this->peek()} ", $this->peek(1, -1) . $this->peek(2), 'literal', $this->iLineNo);
}
} else if ($this->comes('(')) {
$iNestingLevel++;
} else if ($this->comes(')')) {
$iNestingLevel--;
}
$oCalcList->addListComponent($this->consume(1));
$iLastComponentType = CalcFunction::T_OPERATOR;
} else {
$oVal = $this->parsePrimitiveValue();
if ($iLastComponentType == CalcFunction::T_OPERAND) {
throw new UnexpectedTokenException(sprintf('Next token was expected to be an operand of type %s. Instead "%s" was found.', implode(', ', $aOperators), $oVal), '', 'custom', $this->iLineNo);
}

$oCalcList->addListComponent($oVal);
$iLastComponentType = CalcFunction::T_OPERAND;
}
}
$oList->addListComponent($oCalcList);
$this->consume(')');
return new CalcFunction($sFunction, $oList, ',', $this->iLineNo);
}

/**
* Tests an identifier for a given value. Since identifiers are all keywords, they can be vendor-prefixed. We need to check for these versions too.
*/
Expand Down
4 changes: 2 additions & 2 deletions lib/Sabberworm/CSS/Value/CSSFunction.php
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@

class CSSFunction extends ValueList {

private $sName;
protected $sName;

public function __construct($sName, $aArguments, $sSeparator = ',', $iLineNo = 0) {
if($aArguments instanceof RuleValueList) {
Expand Down Expand Up @@ -37,4 +37,4 @@ public function render(\Sabberworm\CSS\OutputFormat $oOutputFormat) {
return "{$this->sName}({$aArguments})";
}

}
}
8 changes: 8 additions & 0 deletions lib/Sabberworm/CSS/Value/CalcFunction.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
<?php

namespace Sabberworm\CSS\Value;

class CalcFunction extends CSSFunction {
const T_OPERAND = 1;
const T_OPERATOR = 2;
}
14 changes: 14 additions & 0 deletions lib/Sabberworm/CSS/Value/CalcRuleValueList.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
<?php

namespace Sabberworm\CSS\Value;

class CalcRuleValueList extends RuleValueList {
public function __construct($iLineNo = 0) {
parent::__construct(array(), ',', $iLineNo);
}

public function render(\Sabberworm\CSS\OutputFormat $oOutputFormat) {
return $oOutputFormat->implode(' ', $this->aComponents);
}

}
14 changes: 14 additions & 0 deletions tests/Sabberworm/CSS/ParserTest.php
Original file line number Diff line number Diff line change
Expand Up @@ -387,6 +387,20 @@ function testUrlInFile() {
$this->assertSame($sExpected, $oDoc->render());
}

function testCalcInFile() {
$oDoc = $this->parsedStructureForFile('calc', Settings::create()->withMultibyteSupport(true));
$sExpected = 'div {width: calc(100% / 4);}
div {height: -webkit-calc(9 / 16 * 100%) !important;width: -moz-calc(( 50px - 50% ) * 2);}';
$this->assertSame($sExpected, $oDoc->render());
}

/**
* @expectedException Sabberworm\CSS\Parsing\UnexpectedTokenException
*/
function testCalcFailure() {
$this->parsedStructureForFile('-calc-no-space-around-minus', Settings::create()->withLenientParsing(false));
}

function testUrlInFileMbOff() {
$oDoc = $this->parsedStructureForFile('url', Settings::create()->withMultibyteSupport(false));
$sExpected = 'body {background: #fff url("http://somesite.com/images/someimage.gif") repeat top center;}
Expand Down
1 change: 1 addition & 0 deletions tests/files/-calc-no-space-around-minus.css
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
div { width: calc(50% -8px); }
5 changes: 5 additions & 0 deletions tests/files/calc.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
div { width: calc(100% / 4); }
div {
height: -webkit-calc(9/16 * 100%)!important;
width: -moz-calc((50px - 50%)*2);
}