Skip to content
This repository was archived by the owner on May 5, 2022. It is now read-only.

Bugfix/319 Add support for transparent color value to several functions #320

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open
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
Original file line number Diff line number Diff line change
Expand Up @@ -990,19 +990,18 @@ public String buildString(BuildStringStrategy strategy) {
case LexicalUnit.SAC_COUNTERS_FUNCTION:
case LexicalUnit.SAC_RECT_FUNCTION:
case LexicalUnit.SAC_FUNCTION:
if (ColorUtil.isColor(this)) {
if (ColorUtil.isTransparent(this)) {
text = "transparent";
break;
} else if (ColorUtil.isColor(this)) {
text = ColorUtil.rgbToColorString(ColorUtil
.colorToRgb(this));
break;
} else if (ColorUtil.isRgba(this) || ColorUtil.isHsla(this)) {
float alpha = params.get(params.size() - 1)
.getContainedValue().getFloatValue();
rgb = ColorUtil.colorToRgb(this);
if (alpha == 0.0f && rgb[0] == 0 && rgb[1] == 0
&& rgb[2] == 0) {
text = "transparent";
break;
} else if (alpha == 1.0f) {
if (alpha == 1.0f) {
text = ColorUtil.rgbToColorString(ColorUtil
.colorToRgb(this));
break;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -43,12 +43,17 @@ protected SassListItem computeForArgumentList(LexicalUnitImpl function,
checkParams(function, actualArguments);
LexicalUnitImpl color = getColor(function, actualArguments);
float alpha = 1;
if (ColorUtil.isRgba(color) || ColorUtil.isHsla(color)) {
if (ColorUtil.isTransparent(color)) {
alpha = 0f;
} else if (ColorUtil.isRgba(color) || ColorUtil.isHsla(color)) {
int lastIndex = color.getParameterList().size() - 1;
alpha = color.getParameterList().get(lastIndex).getContainedValue()
.getFloatValue();
}
Float[] adjustBy = getAdjustments(function, actualArguments);
if (!anySet(adjustBy, 0, 7) && ColorUtil.isTransparent(color)) {
return LexicalUnitImpl.createIdent(ColorUtil.transparent);
}
if (adjustBy[6] != null) {
if ("adjust-color".equals(functionName)) {
alpha += adjustBy[6];
Expand Down Expand Up @@ -151,7 +156,7 @@ private LexicalUnitImpl getColor(LexicalUnitImpl function,
}
LexicalUnitImpl result = (LexicalUnitImpl) resultItem;
if (!ColorUtil.isColor(result) && !ColorUtil.isRgba(result)
&& !ColorUtil.isHsla(result)) {
&& !ColorUtil.isHsla(result) && !ColorUtil.isTransparent(result)) {
throw new ParseException(
"The color argument must represent a valid color", function);
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,8 @@ protected SassListItem computeForArgumentList(LexicalUnitImpl function,
ActualArgumentList parameterList = color.getParameterList();
SassListItem last = parameterList.get(parameterList.size() - 1);
opacity = ((LexicalUnitImpl) last).getFloatValue();
} else if (ColorUtil.isTransparent(color)) {
opacity = 0f;
}
return LexicalUnitImpl.createNumber(function.getLineNumber(),
function.getColumnNumber(), opacity);
Expand All @@ -52,7 +54,7 @@ private void checkParameters(LexicalUnitImpl function,
LexicalUnitImpl color = (LexicalUnitImpl) getParam(args, "color");
if (!(color instanceof LexicalUnitImpl)
|| (!ColorUtil.isColor(color) && !ColorUtil.isRgba(color) && !ColorUtil
.isHsla(color))) {
.isHsla(color)) && !ColorUtil.isTransparent(color)) {
throw new ParseException("The function "
+ function.getFunctionName()
+ " requires a color as its first parameter", function);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,7 @@ private void checkParameters(LexicalUnitImpl function,
}
LexicalUnitImpl firstParam = (LexicalUnitImpl) arg;
if (!ColorUtil.isColor(firstParam) && !ColorUtil.isRgba(firstParam)
&& !ColorUtil.isHsla(firstParam)) {
&& !ColorUtil.isHsla(firstParam) && !ColorUtil.isTransparent(firstParam)) {
throw new ParseException("The parameter of the function "
+ function.getFunctionName() + " must be a valid color",
function);
Expand Down
22 changes: 20 additions & 2 deletions src/main/java/com/vaadin/sass/internal/util/ColorUtil.java
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ public class ColorUtil {
.compile("#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})");
private static Map<String, String> colorNameToHex = new HashMap<String, String>();
private static Map<String, String> hexToColorName = new HashMap<String, String>();
public static String transparent = "transparent";

static {
colorNameToHex.put("aqua", "#00ffff");
Expand Down Expand Up @@ -168,6 +169,18 @@ public static boolean isHslColor(LexicalUnitImpl unit) {
&& unit.getParameterList().size() == 3;
}

/**
* Returns true if the lexical unit represents the transparent keyword, false
* otherwise.
*
* @param unit lexical unit
* @return true if unit represents the transparent color
*/
public static boolean isTransparent(LexicalUnitImpl unit) {
return unit.getLexicalUnitType() == LexicalUnit.SAC_IDENT
&& transparent.equals(unit.getStringValue());
}

/**
* Returns the alpha component of the color. For colors that do not have an
* explicit alpha component, returns 1.
Expand All @@ -177,7 +190,9 @@ public static boolean isHslColor(LexicalUnitImpl unit) {
* @return The alpha component of color.
*/
public static float getAlpha(LexicalUnitImpl color) {
if (isHsla(color) || isRgba(color)) {
if (isTransparent(color)) {
return 0;
} else if (isHsla(color) || isRgba(color)) {
ActualArgumentList params = color.getParameterList();
return params.get(params.size() - 1).getContainedValue()
.getFloatValue();
Expand All @@ -198,7 +213,10 @@ public static float getAlpha(LexicalUnitImpl color) {
* @return RGB components or null if not a color
*/
public static int[] colorToRgb(LexicalUnitImpl color) {
if (isRgba(color)) {
if (isTransparent(color)) {
// as per https://www.w3.org/TR/css-color-3/#transparent-def
return new int[] { 0, 0, 0, 0 };
} else if (isRgba(color)) {
if (color.getParameterList().size() == 2
&& color.getParameterList().get(0) instanceof LexicalUnitImpl) {
return colorToRgb((LexicalUnitImpl) color.getParameterList()
Expand Down
5 changes: 5 additions & 0 deletions src/test/resources/automatic/css/adjust-color.css
Original file line number Diff line number Diff line change
Expand Up @@ -37,4 +37,9 @@
.hsla {
rb: rgba(41, 112, 127, 0.5);
sla: rgba(45, 134, 134, 0.25);
}

.transparent {
t1: transparent;
t2: rgba(0, 0, 5, 0);
}
12 changes: 12 additions & 0 deletions src/test/resources/automatic/css/color-component-functions.css
Original file line number Diff line number Diff line change
Expand Up @@ -41,4 +41,16 @@
alpha: 1;
opacity: 1;
alpha2: 0.5;
}

.transparent{
red: 0;
green: 0;
blue: 0;
alpha: 0;
opacity: 0;
colorA: rgba(0, 0, 0, 0);
colorB: transparent;
colorC: rgba(0, 0, 0, 0);
colorD: rgba(255, 255, 255, 0);
}
5 changes: 5 additions & 0 deletions src/test/resources/automatic/css/scale-color.css
Original file line number Diff line number Diff line change
Expand Up @@ -33,4 +33,9 @@
rb: rgba(75, 112, 133, 0.5);
sla: rgba(36, 129, 129, 0.375);
ga: rgba(16, 56, 112, 0.75);
}

.transparent {
t1: transparent;
t2: rgba(0, 0, 12, 0);
}
5 changes: 5 additions & 0 deletions src/test/resources/automatic/scss/adjust-color.scss
Original file line number Diff line number Diff line change
Expand Up @@ -51,4 +51,9 @@
$hsla: hsla(180, 75%, 25%, 0.5);
rb: adjust-color($hsla, $red: 25, $blue: 15);
sla: adjust-color($hsla, $saturation: -25%, $lightness: 10%, $alpha: -0.25);
}

.transparent {
t1: adjust-color(transparent);
t2: adjust-color(transparent, $blue: 5);
}
13 changes: 13 additions & 0 deletions src/test/resources/automatic/scss/color-component-functions.scss
Original file line number Diff line number Diff line change
Expand Up @@ -52,4 +52,17 @@ $blue:3;
alpha: alpha($hslcolor);
opacity: opacity($hslcolor);
alpha2: alpha($hslacolor);
}

.transparent{
$transparentcolor: transparent;
red: red($transparentcolor);
green: green($transparentcolor);
blue: blue($transparentcolor);
alpha: alpha($transparentcolor);
opacity: opacity($transparentcolor);
colorA: rgba(0,0,0,0);
colorB: $transparentcolor;
colorC: darken($transparentcolor, 50);
colorD: lighten($transparentcolor, 100);
}
5 changes: 5 additions & 0 deletions src/test/resources/automatic/scss/scale-color.scss
Original file line number Diff line number Diff line change
Expand Up @@ -44,4 +44,9 @@
rb: scale-color($hsla, $red: 25%, $blue: 15%);
sla: scale-color($hsla, $saturation: -25%, $lightness: 10%, $alpha: -25%);
ga: scale-color($color: $hsla, $green: -50%, $alpha: 50%);
}

.transparent {
t1: scale-color(transparent);
t2: scale-color(transparent, $blue: 5%);
}