Reviewers: felix8a,
Description:
http://dev.w3.org/csswg/css-transforms/
CSS Transforms Level 1
The CSS visual formatting model describes a coordinate system within
each element is positioned. Positions and sizes in this coordinate
space can be thought of as being expressed in pixels, starting in the
origin of point with positive values proceeding to the right and down.
This coordinate space can be modified with the ‘transform’
property. Using transform, elements can be translated, rotated and
scaled in two or three dimensional space.
Additional properties make working with transforms easier, and allow
the author to control how nested three-dimensional transforms
interact.
Please review this at https://codereview.appspot.com/11963043/
Affected files:
M src/com/google/caja/lang/css/CssPropertyPatterns.java
M src/com/google/caja/lang/css/CssSchema.java
M src/com/google/caja/lang/css/css-extensions-defs.json
M src/com/google/caja/lang/css/css-extensions-whitelist.json
M tests/com/google/caja/lang/css/CssPropertyPatternsTest.java
Index: src/com/google/caja/lang/css/CssPropertyPatterns.java
===================================================================
--- src/com/google/caja/lang/css/CssPropertyPatterns.java (revision 5512)
+++ src/com/google/caja/lang/css/CssPropertyPatterns.java (working copy)
@@ -139,6 +139,7 @@
final Set<CssPropertySignature.CallSignature> fns;
CssPropertyData(String key, CssPropertySignature sig) {
+ assert key.equals(Strings.lower(key)) : key;
this.key = key;
this.sig = sig;
this.properties = EnumSet.noneOf(CssPropBit.class);
@@ -644,6 +645,7 @@
* The result will have base as a prefix.
*/
private static final String allocateKey(String base, Set<String>
allocated) {
+ base = Strings.lower(base);
int counter = 0;
String candidate = base;
while (!allocated.add(candidate)) {
Index: src/com/google/caja/lang/css/CssSchema.java
===================================================================
--- src/com/google/caja/lang/css/CssSchema.java (revision 5511)
+++ src/com/google/caja/lang/css/CssSchema.java (working copy)
@@ -225,11 +225,20 @@
}
}
List<String> members = new ArrayList<String>();
+ if (!(type instanceof List<?>)) {
+ throw new IllegalArgumentException(
+ "type=" + type + ":"
+ + (type != null ? type.getClass().getSimpleName() : "<null>"));
+ }
for (Object member : (List<?>) type) {
if (member instanceof String) {
members.add((String) member);
+ } else if (member instanceof Map<?, ?>) {
+ members.add((String) ((Map<?, ?>) member).get("key"));
} else {
- members.add((String) ((Map<?, ?>) member).get("key"));
+ throw new IllegalArgumentException(
+ "type=" + type + ", member=" + member + ":"
+ + (member != null ?
member.getClass().getSimpleName() : "<null>"));
}
}
Criterion<String> set = in(members.toArray(new String[0]));
Index: src/com/google/caja/lang/css/css-extensions-defs.json
===================================================================
--- src/com/google/caja/lang/css/css-extensions-defs.json (revision 5512)
+++ src/com/google/caja/lang/css/css-extensions-defs.json (working copy)
@@ -88,6 +88,10 @@
"source":
"http://dev.w3.org/csswg/css-animations/#animation-timing-function";
},
+ { "key": "backface-visibility",
+ "as": "visibility"
+ },
+
{ "key": "background",
"signature": "[ [ <bg-image> || [<bg-position> [/ <bg-size>]? | /
<bg-size>] || <repeat-style> || <attachment> || <bg-origin> ] , ]*
['background-color' || <bg-image> || [<bg-position> [/ <bg-size>]? | /
<bg-size>] || <repeat-style> || <attachment> || <bg-origin>]",
"appliesTo": "*",
@@ -391,6 +395,24 @@
},
{ "key": "overflow-y", "as": "overflow-x", "dom2property": "overflowY"
},
+ { "key": "perspective",
+ "signature": "none | <length>",
+ "default": "none",
+ "appliesTo": "*",
+ "inherited": false,
+ "mediaGroups": ["visual"],
+ "source": "http://dev.w3.org/csswg/css-transforms/#perspective";
+ },
+
+ { "key": "perspective-origin",
+ "signature": "[ left | center | right | top | bottom | <percentage>
| <length> ] | [ left | center | right | <percentage> | <length> ] [ top |
center | bottom | <percentage> | <length> ] | [ top | bottom ] [ left |
center | right | <percentage> | <length> ]",
+ "default": "50% 50%",
+ "appliesTo": "*",
+ "inherited": false,
+ "mediaGroups": ["visual"],
+ "source": "http://dev.w3.org/csswg/css-transforms/#perspective-origin";
+ },
+
{ "key": "text-overflow",
"signature": "clip | ellipsis",
"default": null,
@@ -439,6 +461,33 @@
"dom2property": "textWrap",
"source": "http://www.w3.org/TR/css3-text/#text-wrap"; },
+ { "key": "transform",
+ "signature": "none | <transform-function> [ <transform-function> ]*",
+ "default": "none",
+ "appliesTo": "*",
+ "inherited": false,
+ "mediaGroups": ["visual"],
+ "source": "http://dev.w3.org/csswg/css-transforms/#transform";
+ },
+
+ { "key": "transform-origin",
+ "signature": "none | <transform-function> [ <transform-function> ]*",
+ "default": "50% 50%",
+ "appliesTo": "*",
+ "inherited": false,
+ "mediaGroups": ["visual"],
+ "source": "http://dev.w3.org/csswg/css-transforms/#transform-origin";
+ },
+
+ { "key": "transform-style",
+ "signature": "flat | preserve-3d",
+ "default": "flat",
+ "appliesTo": "*",
+ "inherited": false,
+ "mediaGroups": ["visual"],
+ "source": "http://dev.w3.org/csswg/css-transforms/#transform-style";
+ },
+
{ "key": "transition",
"signature": "<single-transition> [, <single-transition>]*",
"appliesTo": "*",
@@ -699,6 +748,32 @@
{ "key": "<single-transition-property>",
"signature": "all | <property-name>",
"source":
"http://dev.w3.org/csswg/css-transitions/#single-transition-property";
+ },
+
+ { "key": "<transform-function>",
+ "signature": "<transform-matrix> | <transform-function-2d> |
<transform-function-3d>",
+ "source": "http://dev.w3.org/csswg/css-transforms/#transform-functions";
+ },
+
+ { "key": "<transform-matrix>",
+ "signature": "matrix(<number>, <number>, <number>, <number>,
<number>, <number>[, <number>, <number>, <number>, <number>, <number>,
<number>, <number>, <number>, <number>, <number>])",
+ "comment": "6 number version is a 2D transform matrix, and the 16
number version is the full 3-D transform matrix.",
+ "source": "http://dev.w3.org/csswg/css-transforms/#transform-functions";
+ },
+
+ { "key": "<transform-function-2d>",
+ "signature": "translate(<translation-value>[, <translation-value>])
| translateX(<translation-value>) | translateY(<translation-value>) |
scale(<number>[, <number>]) | scaleX(<number>) | scaleY(<number>) |
rotate(<angle>) | skew(<angle>[, <angle>]) | skewX(<angle>) |
skewY(<angle>)",
+ "source":
"http://dev.w3.org/csswg/css-transforms/#two-d-transform-functions";
+ },
+
+ { "key": "<transform-function-3d>",
+ "signature": "translate3d(<translation-value>, <translation-value>,
<length>) | translateZ(<length>) | scale3d(<number>, <number>, <number>) |
scaleZ(<number>) | rotate3d(<number>, <number>, <number>, <angle>) |
rotateX(<angle>) | rotateY(<angle>) | rotateZ(<angle>) |
perspective(<length>)",
+ "source":
"http://dev.w3.org/csswg/css-transforms/#three-d-transform-functions";
+ },
+
+ { "key": "<translation-value>",
+ "signature": "<number> | <length>",
+ "source": "http://dev.w3.org/csswg/css-transforms/#svg-transform-value";
}
]
Index: src/com/google/caja/lang/css/css-extensions-whitelist.json
===================================================================
--- src/com/google/caja/lang/css/css-extensions-whitelist.json (revision
5512)
+++ src/com/google/caja/lang/css/css-extensions-whitelist.json (working
copy)
@@ -7,6 +7,7 @@
"animation", "animation-delay", "animation-direction",
"animation-duration",
"animation-fill-mode", "animation-iteration-count", "animation-name",
"animation-play-state", "animation-timing-function",
+ "backface-visibility",
"border-bottom-left-radius", "border-bottom-right-radius", "border-radius",
"border-top-left-radius", "border-top-right-radius",
"box-shadow",
@@ -17,7 +18,9 @@
"-moz-opacity", "-moz-outline", "-moz-outline-color", "-moz-outline-style",
"-moz-outline-width", "-o-text-overflow",
"opacity", "overflow-x", "overflow-y",
+ "perspective", "perspective-origin",
"text-overflow", "text-shadow", "text-wrap",
+ "transform", "transform-origin", "transform-style",
"transition", "transition-delay", "transition-duration",
"transition-property", "transition-timing-function",
"-webkit-border-bottom-left-radius", "-webkit-border-bottom-right-radius",
Index: tests/com/google/caja/lang/css/CssPropertyPatternsTest.java
===================================================================
--- tests/com/google/caja/lang/css/CssPropertyPatternsTest.java (revision
5511)
+++ tests/com/google/caja/lang/css/CssPropertyPatternsTest.java (working
copy)
@@ -226,7 +226,7 @@
boolean expectedMatchResult, String sig, String... cssPropertyValues)
throws ParseException {
CssPropertyPatterns.CssPropertyData data = pp.cssPropertyToData(
- this.getName(), parseSignature(sig));
+ Strings.lower(this.getName()), parseSignature(sig));
// Collect failures altogether and report at once.
List<String> failures = Lists.newArrayList();
--
---
You received this message because you are subscribed to the Google Groups "Google Caja Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
For more options, visit https://groups.google.com/groups/opt_out.
