Viewport-percentage Length units does not work for Replaced elements size
authorcommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Sat, 14 Apr 2012 21:29:05 +0000 (21:29 +0000)
committercommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Sat, 14 Apr 2012 21:29:05 +0000 (21:29 +0000)
https://bugs.webkit.org/show_bug.cgi?id=83425

Patch by Joe Thomas <joethomas@motorola.com> on 2012-04-14
Reviewed by Antti Koivisto.

Added the support for viewport-percentage length units while calculating the width/height of replaced elements.

Source/WebCore:

Tests: css3/viewport-percentage-lengths/viewport-percentage-image-size.html

* platform/Length.h:
(WebCore::Length::isSpecified):
* rendering/RenderBox.cpp:
(WebCore::RenderBox::computeReplacedLogicalWidthUsing):

LayoutTests:

* css3/viewport-percentage-lengths/resources: Added.
* css3/viewport-percentage-lengths/resources/colorsquare.png: Added.
* css3/viewport-percentage-lengths/viewport-percentage-image-size-expected.html: Added.
* css3/viewport-percentage-lengths/viewport-percentage-image-size.html: Added.

git-svn-id: http://svn.webkit.org/repository/webkit/trunk@114208 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/ChangeLog
LayoutTests/css3/viewport-percentage-lengths/resources/colorsquare.png [new file with mode: 0644]
LayoutTests/css3/viewport-percentage-lengths/viewport-percentage-image-size-expected.html [new file with mode: 0644]
LayoutTests/css3/viewport-percentage-lengths/viewport-percentage-image-size.html [new file with mode: 0644]
Source/WebCore/ChangeLog
Source/WebCore/platform/Length.h
Source/WebCore/rendering/RenderBox.cpp

index 27910ab..6bb9080 100644 (file)
@@ -1,5 +1,19 @@
 2012-04-14  Joe Thomas  <joethomas@motorola.com>
 
+        Viewport-percentage Length units does not work for Replaced elements size
+        https://bugs.webkit.org/show_bug.cgi?id=83425
+
+        Reviewed by Antti Koivisto.
+
+        Added the support for viewport-percentage length units while calculating the width/height of replaced elements.
+
+        * css3/viewport-percentage-lengths/resources: Added.
+        * css3/viewport-percentage-lengths/resources/colorsquare.png: Added.
+        * css3/viewport-percentage-lengths/viewport-percentage-image-size-expected.html: Added.
+        * css3/viewport-percentage-lengths/viewport-percentage-image-size.html: Added.
+
+2012-04-14  Joe Thomas  <joethomas@motorola.com>
+
         CSSStyleDeclaration.getPropertyValue() for 'border-radius' returns null when value is set
         https://bugs.webkit.org/show_bug.cgi?id=80736
 
diff --git a/LayoutTests/css3/viewport-percentage-lengths/resources/colorsquare.png b/LayoutTests/css3/viewport-percentage-lengths/resources/colorsquare.png
new file mode 100644 (file)
index 0000000..f80e0ea
Binary files /dev/null and b/LayoutTests/css3/viewport-percentage-lengths/resources/colorsquare.png differ
diff --git a/LayoutTests/css3/viewport-percentage-lengths/viewport-percentage-image-size-expected.html b/LayoutTests/css3/viewport-percentage-lengths/viewport-percentage-image-size-expected.html
new file mode 100644 (file)
index 0000000..49ebc84
--- /dev/null
@@ -0,0 +1,30 @@
+<!DOCTYPE HTML>
+<style>
+img         { margin-top: 10px;}
+</style>
+
+<div style="width:500px; height:500px">
+    <img id="image-vw" src="./resources/colorsquare.png">
+    <img id="image-vh"  src="./resources/colorsquare.png">
+    <img id="image-vmin" src="./resources/colorsquare.png">
+</div>
+<script>
+function applyStyle() {
+    var viewportWidth = window.innerWidth;
+    var viewportHeight = window.innerHeight;
+    var viewportMinLength = Math.min(viewportWidth, viewportHeight);
+
+    var elementStyle = document.getElementById("image-vw").style;
+    elementStyle.width = Math.floor(2 * viewportWidth / 100) + "px";
+    elementStyle.height = Math.floor(3 * viewportWidth / 100) + "px";
+
+    elementStyle = document.getElementById("image-vh").style;
+    elementStyle.width = Math.floor(3 * viewportHeight / 100) + "px";
+    elementStyle.height = Math.floor(4 * viewportHeight / 100) + "px";
+
+    elementStyle = document.getElementById("image-vmin").style;
+    elementStyle.width = Math.floor(4 * viewportMinLength / 100) + "px";
+    elementStyle.height = Math.floor(5 * viewportMinLength / 100) + "px";
+}
+applyStyle();
+</script>
\ No newline at end of file
diff --git a/LayoutTests/css3/viewport-percentage-lengths/viewport-percentage-image-size.html b/LayoutTests/css3/viewport-percentage-lengths/viewport-percentage-image-size.html
new file mode 100644 (file)
index 0000000..a782e24
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE HTML>
+<style>
+img         { margin-top: 10px;}
+#image-vw   { width: 2vw; height: 3vw; }
+#image-vh   { width: 3vh; height: 4vh; }
+#image-vmin { width: 4vmin; height: 5vmin; }
+</style>
+
+<div style="width:500px; height:500px">
+    <img id="image-vw" src="./resources/colorsquare.png">
+    <img id="image-vh"  src="./resources/colorsquare.png">
+    <img id="image-vmin" src="./resources/colorsquare.png">
+</div>
index 19455a1..00b9b7e 100644 (file)
@@ -1,5 +1,21 @@
 2012-04-14  Joe Thomas  <joethomas@motorola.com>
 
+        Viewport-percentage Length units does not work for Replaced elements size
+        https://bugs.webkit.org/show_bug.cgi?id=83425
+
+        Reviewed by Antti Koivisto.
+
+        Added the support for viewport-percentage length units while calculating the width/height of replaced elements.
+
+        Tests: css3/viewport-percentage-lengths/viewport-percentage-image-size.html
+
+        * platform/Length.h:
+        (WebCore::Length::isSpecified):
+        * rendering/RenderBox.cpp:
+        (WebCore::RenderBox::computeReplacedLogicalWidthUsing):
+
+2012-04-14  Joe Thomas  <joethomas@motorola.com>
+
         CSSStyleDeclaration.getPropertyValue() for 'border-radius' returns null when value is set
         https://bugs.webkit.org/show_bug.cgi?id=80736
 
index 71ead78..8a5e152 100644 (file)
@@ -212,7 +212,7 @@ public:
     bool isPercent() const { return type() == Percent || type() == Calculated; }
     bool isFixed() const { return type() == Fixed; }
     bool isIntrinsicOrAuto() const { return type() == Auto || type() == MinIntrinsic || type() == Intrinsic; }
-    bool isSpecified() const { return type() == Fixed || type() == Percent || type() == Calculated; }
+    bool isSpecified() const { return type() == Fixed || type() == Percent || type() == Calculated || isViewportPercentage(); }
     bool isCalculated() const { return type() == Calculated; }
 
     Length blend(const Length& from, double progress) const
index 4915c6d..b0fa865 100644 (file)
@@ -2290,6 +2290,10 @@ LayoutUnit RenderBox::computeReplacedLogicalWidthUsing(Length logicalWidth) cons
     switch (logicalWidth.type()) {
         case Fixed:
             return computeContentBoxLogicalWidth(logicalWidth.value());
+        case ViewportPercentageWidth:
+        case ViewportPercentageHeight:
+        case ViewportPercentageMin:
+            return computeContentBoxLogicalWidth(valueForLength(logicalWidth, 0, view()));
         case Percent: 
         case Calculated: {
             // FIXME: containingBlockLogicalWidthForContent() is wrong if the replaced element's block-flow is perpendicular to the