Changeset 88757 in webkit


Ignore:
Timestamp:
Jun 13, 2011 8:46:30 PM (13 years ago)
Author:
tkent@chromium.org
Message:

2011-06-10 Kent Tamura <​tkent@chromium.org>

Reviewed by Dimitri Glazkov.

Use CSS machinery to position slider thumb.
​https://bugs.webkit.org/show_bug.cgi?id=52920

Add two new tests, and update tests with sliders.

  • fast/dom/HTMLInputElement/input-slider-update-styled-expected.txt:
  • fast/forms/input-appearance-range.html: Added.
  • fast/forms/slider-thumb-stylability.html: Remove text.
  • fast/forms/validation-message-on-range-expected.txt: Added.
  • fast/forms/validation-message-on-range.html: Added.
  • fast/multicol/client-rects-expected.txt:
  • fast/repaint/slider-thumb-float-expected.txt:
  • media/audio-repaint-expected.txt:
  • media/controls-without-preload-expected.txt:
  • media/media-document-audio-repaint-expected.txt:
  • platform/chromium/test_expectations.txt:
  • platform/gtk/Skipped: Skip validaiton-message-on-range.html because this platform doesn't support the interactive validation.
  • platform/mac-wk2/Skipped: Skip validaiton-message-on-range.html.
  • platform/mac/fast/dom/HTMLInputElement/input-slider-update-expected.png:
  • platform/mac/fast/dom/HTMLInputElement/input-slider-update-expected.txt:
  • platform/mac/fast/forms/box-shadow-override-expected.png:
  • platform/mac/fast/forms/box-shadow-override-expected.txt:
  • platform/mac/fast/forms/input-appearance-height-expected.png:
  • platform/mac/fast/forms/input-appearance-height-expected.txt:
  • platform/mac/fast/forms/input-appearance-range-expected.png: Added.
  • platform/mac/fast/forms/input-appearance-range-expected.txt: Added.
  • platform/mac/fast/forms/range-thumb-height-percentage-expected.txt:
  • platform/mac/fast/forms/slider-padding-expected.png:
  • platform/mac/fast/forms/slider-padding-expected.txt:
  • platform/mac/fast/forms/slider-thumb-shared-style-expected.png:
  • platform/mac/fast/forms/slider-thumb-shared-style-expected.txt:
  • platform/mac/fast/forms/slider-thumb-stylability-expected.png:
  • platform/mac/fast/forms/slider-thumb-stylability-expected.txt:
  • platform/mac/fast/forms/thumbslider-no-parent-slider-expected.png:
  • platform/mac/fast/forms/thumbslider-no-parent-slider-expected.txt:
  • platform/mac/fast/repaint/slider-thumb-drag-release-expected.png:
  • platform/mac/fast/repaint/slider-thumb-drag-release-expected.txt:
  • platform/mac/media/audio-controls-rendering-expected.png:
  • platform/mac/media/audio-controls-rendering-expected.txt:
  • platform/mac/media/controls-after-reload-expected.png:
  • platform/mac/media/controls-after-reload-expected.txt:
  • platform/mac/media/controls-styling-expected.png:
  • platform/mac/media/controls-styling-expected.txt:
  • platform/qt/Skipped: Skip validaiton-message-on-range.html.
  • platform/win/Skipped: Skip validaiton-message-on-range.html.

2011-06-10 Kent Tamura <​tkent@chromium.org>

Reviewed by Dimitri Glazkov.

Use CSS machinery to position slider thumb.
​https://bugs.webkit.org/show_bug.cgi?id=52920

Remove RenderSlider::layout().
In order to remove it, we introduce new three shadow nodes:

  • A flex box container occupying the whole box
  • A flex box item representing a movable area of the thumb
  • A flex box item limiting the movable area of the thumb

The thumb position is specified by percentage position in the second element.

This change also fixes Bug 60353.

Tests: fast/forms/input-appearance-range.html

fast/forms/validation-message-on-range.html

  • accessibility/AccessibilitySlider.cpp: (WebCore::AccessibilitySliderThumb::elementRect): Use Node::getRect() for the thumb element.
  • css/html.css: Add new style definitions for the new node layout. (input[type="range"]::-webkit-slider-container): (input[type="range"]::-webkit-slider-runnable-track): (input[type="range"]::-webkit-slider-thumb):
  • html/RangeInputType.cpp: (WebCore::RangeInputType::handleMouseDownEvent): Accepts events on shadow nodes, use sliderThumbElementOf(). (WebCore::RangeInputType::createShadowSubtree): Creates new nodes layout. (WebCore::RangeInputType::valueChanged): Use sliderThumbElementOf().
  • html/RangeInputType.h: Remove shadowSliderThumb().
  • html/shadow/SliderThumbElement.cpp: (WebCore::sliderPosition): Moved from RenderSlider.cpp. (WebCore::hasVerticalAppearance): New utility function. (WebCore::sliderThumbElementOf): New utility function. (WebCore::RenderSliderThumb::layout): Sets CSS top/left values. (WebCore::RenderSliderContainer::RenderSliderContainer): (WebCore::RenderSliderContainer::layout): Add some adjustment code.
    • Setting box-orient
    • Adjust heights of some nodes. It is required to pass existing tests.

(WebCore::SliderThumbElement::setPositionFromValue):

Update comments.

(WebCore::SliderThumbElement::setPositionFromPoint):

Calculate the current position from absolute positions.

(WebCore::SliderThumbElement::hostInput):

Removed unnecessary variable.

(WebCore::TrackLimiterElement::TrackLimiterElement):
(WebCore::TrackLimiterElement::create): Adjust style.
(WebCore::TrackLimiterElement::createRenderer):

This node uses RenderSliderThumb.

(WebCore::TrackLimiterElement::shadowPseudoId):

This node also uses -webkit-slider-thumb.

(WebCore::SliderContainerElement::SliderContainerElement):
(WebCore::SliderContainerElement::create):
(WebCore::SliderContainerElement::createRenderer):

Uses RenderSliderContainer.

(WebCore::SliderContainerElement::shadowPseudoId):

  • html/shadow/SliderThumbElement.h: Make hostInput() public, add declarations of TrackLimiterElement and SliderContainerElement.
  • rendering/RenderSlider.cpp: (WebCore::RenderSlider::RenderSlider): Added an assertion. (WebCore::RenderSlider::inDragMode): Uses sliderThumbElementOf().
  • rendering/RenderSlider.h: Remove declarations of removed functions.
  • rendering/RenderTheme.cpp: (WebCore::RenderTheme::adjustSliderThumbStyle): Calls adjustSliderThumbSize().
Location:
trunk
Files:
5 added
46 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r88752 r88757  
     12011-06-10  Kent Tamura  <tkent@chromium.org>
     2
     3        Reviewed by Dimitri Glazkov.
     4
     5        Use CSS machinery to position slider thumb.
     6        https://bugs.webkit.org/show_bug.cgi?id=52920
     7
     8        Add two new tests, and update tests with sliders.
     9
     10        * fast/dom/HTMLInputElement/input-slider-update-styled-expected.txt:
     11        * fast/forms/input-appearance-range.html: Added.
     12        * fast/forms/slider-thumb-stylability.html: Remove text.
     13        * fast/forms/validation-message-on-range-expected.txt: Added.
     14        * fast/forms/validation-message-on-range.html: Added.
     15        * fast/multicol/client-rects-expected.txt:
     16        * fast/repaint/slider-thumb-float-expected.txt:
     17        * media/audio-repaint-expected.txt:
     18        * media/controls-without-preload-expected.txt:
     19        * media/media-document-audio-repaint-expected.txt:
     20        * platform/chromium/test_expectations.txt:
     21        * platform/gtk/Skipped: Skip validaiton-message-on-range.html because
     22          this platform doesn't support the interactive validation.
     23        * platform/mac-wk2/Skipped: Skip validaiton-message-on-range.html.
     24        * platform/mac/fast/dom/HTMLInputElement/input-slider-update-expected.png:
     25        * platform/mac/fast/dom/HTMLInputElement/input-slider-update-expected.txt:
     26        * platform/mac/fast/forms/box-shadow-override-expected.png:
     27        * platform/mac/fast/forms/box-shadow-override-expected.txt:
     28        * platform/mac/fast/forms/input-appearance-height-expected.png:
     29        * platform/mac/fast/forms/input-appearance-height-expected.txt:
     30        * platform/mac/fast/forms/input-appearance-range-expected.png: Added.
     31        * platform/mac/fast/forms/input-appearance-range-expected.txt: Added.
     32        * platform/mac/fast/forms/range-thumb-height-percentage-expected.txt:
     33        * platform/mac/fast/forms/slider-padding-expected.png:
     34        * platform/mac/fast/forms/slider-padding-expected.txt:
     35        * platform/mac/fast/forms/slider-thumb-shared-style-expected.png:
     36        * platform/mac/fast/forms/slider-thumb-shared-style-expected.txt:
     37        * platform/mac/fast/forms/slider-thumb-stylability-expected.png:
     38        * platform/mac/fast/forms/slider-thumb-stylability-expected.txt:
     39        * platform/mac/fast/forms/thumbslider-no-parent-slider-expected.png:
     40        * platform/mac/fast/forms/thumbslider-no-parent-slider-expected.txt:
     41        * platform/mac/fast/repaint/slider-thumb-drag-release-expected.png:
     42        * platform/mac/fast/repaint/slider-thumb-drag-release-expected.txt:
     43        * platform/mac/media/audio-controls-rendering-expected.png:
     44        * platform/mac/media/audio-controls-rendering-expected.txt:
     45        * platform/mac/media/controls-after-reload-expected.png:
     46        * platform/mac/media/controls-after-reload-expected.txt:
     47        * platform/mac/media/controls-styling-expected.png:
     48        * platform/mac/media/controls-styling-expected.txt:
     49        * platform/qt/Skipped: Skip validaiton-message-on-range.html.
     50        * platform/win/Skipped: Skip validaiton-message-on-range.html.
     51
    1522011-06-13  Ryosuke Niwa  <rniwa@webkit.org>
    253

  • trunk/LayoutTests/fast/dom/HTMLInputElement/input-slider-update-styled-expected.txt

    r81216 r88757  
    55    RenderBody {BODY} at (8,8) size 784x584
    66      RenderSlider {INPUT} at (2,2) size 100x10 [bgcolor=#FF0000]
    7         RenderBlock {DIV} at (90,0) size 10x10 [bgcolor=#008000]
     7        RenderFlexibleBox {DIV} at (0,0) size 100x10
     8          RenderBlock {DIV} at (0,0) size 90x10
     9          RenderBlock {DIV} at (90,0) size 10x10 [bgcolor=#008000]
    810      RenderText {#text} at (0,0) size 0x0
     11layer at (100,10) size 10x10
     12  RenderBlock (relative positioned) {DIV} at (0,0) size 10x10 [bgcolor=#008000]

  • trunk/LayoutTests/fast/forms/slider-thumb-stylability.html

    r21789 r88757  
    1111</head>
    1212<body>
    13     <p>
    14         This tests styling of the slider thumb.
    15     </p>
    16     <p>
    17         You should see a green 20&times;20px square.
    18     </p>
    19     <input type="range" value="0" style="-webkit-appearance: none;">
     13<!--
     14  This tests styling of the slider thumb.
     15  You should see a green 20x20px square.
     16-->
     17<input type="range" value="0" style="-webkit-appearance: none;">
    2018</body>
    2119</html>

  • trunk/LayoutTests/fast/multicol/client-rects-expected.txt

    r67660 r88757  
    6262      RenderBR {BR} at (0,0) size 0x25
    6363      RenderSlider {INPUT} at (2,27) size 25x25 [color=#000000] [bgcolor=#ADD8E6]
    64         RenderBlock {DIV} at (12,12) size 0x0
     64        RenderFlexibleBox {DIV} at (0,0) size 25x25
     65          RenderBlock {DIV} at (0,12) size 25x0
     66          RenderBlock {DIV} at (25,12) size 0x0
    6567layer at (8,483) size 136x76
    6668  RenderBlock {DIV} at (0,475) size 136x76 [color=#ADD8E6] [border: (3px solid #000000)]

  • trunk/LayoutTests/fast/repaint/slider-thumb-float-expected.txt

    r81285 r88757  
    55    RenderBody {BODY} at (8,8) size 784x584
    66      RenderSlider {INPUT} at (2,2) size 100x10 [bgcolor=#FF0000]
    7         RenderBlock {DIV} at (90,0) size 10x10 [bgcolor=#008000]
     7        RenderFlexibleBox {DIV} at (0,0) size 100x10
     8          RenderBlock {DIV} at (0,0) size 90x10
     9          RenderBlock {DIV} at (90,0) size 10x10 [bgcolor=#008000]
     10layer at (100,10) size 10x10
     11  RenderBlock (relative positioned) {DIV} at (0,0) size 10x10 [bgcolor=#008000]

  • trunk/LayoutTests/media/audio-repaint-expected.txt

    r80857 r88757  
    2323    RenderFlexibleBox {DIV} at (49,5) size 126x15
    2424      RenderSlider {INPUT} at (0,2) size 126x13
    25         RenderBlock {DIV} at (58,2) size 10x8
     25        RenderFlexibleBox {DIV} at (0,0) size 126x13
     26          RenderBlock {DIV} at (0,2) size 116x8
     27          RenderBlock {DIV} at (116,2) size 10x8
    2628    RenderButton {INPUT} at (177,6) size 14x12
     29layer at (115,76) size 10x8
     30  RenderBlock (relative positioned) {DIV} at (0,0) size 10x8
    2731layer at (8,42) size 200x25
    2832  RenderBlock (relative positioned) {DIV} at (0,0) size 200x25
    … …  
    3337    RenderFlexibleBox {DIV} at (49,5) size 126x15
    3438      RenderSlider {INPUT} at (0,2) size 126x13
    35         RenderBlock {DIV} at (58,2) size 10x8
     39        RenderFlexibleBox {DIV} at (0,0) size 126x13
     40          RenderBlock {DIV} at (0,2) size 116x8
     41          RenderBlock {DIV} at (116,2) size 10x8
    3642    RenderButton {INPUT} at (177,6) size 14x12
     43layer at (115,51) size 10x8
     44  RenderBlock (relative positioned) {DIV} at (0,0) size 10x8
    3745layer at (8,144) size 200x25
    3846  RenderMedia {AUDIO} at (0,102) size 200x25
    … …  
    4553    RenderFlexibleBox {DIV} at (49,5) size 126x15
    4654      RenderSlider {INPUT} at (0,2) size 126x13
    47         RenderBlock {DIV} at (58,2) size 10x8
     55        RenderFlexibleBox {DIV} at (0,0) size 126x13
     56          RenderBlock {DIV} at (0,2) size 116x8
     57          RenderBlock {DIV} at (116,2) size 10x8
    4858    RenderButton {INPUT} at (177,6) size 14x12
     59layer at (115,153) size 10x8
     60  RenderBlock (relative positioned) {DIV} at (0,0) size 10x8

  • trunk/LayoutTests/media/controls-without-preload-expected.txt

    r79027 r88757  
    1919    RenderFlexibleBox {DIV} at (49,5) size 216x15
    2020      RenderSlider {INPUT} at (45,2) size 126x13
    21         RenderBlock {DIV} at (0,2) size 10x8
     21        RenderFlexibleBox {DIV} at (0,0) size 126x13
     22          RenderBlock {DIV} at (0,2) size 116x8
     23          RenderBlock {DIV} at (116,2) size 10x8
    2224    RenderButton {INPUT} at (297,4) size 16x16
    2325    RenderButton {INPUT} at (267,6) size 14x12
    … …  
    3234      RenderText {#text} at (0,0) size 31x11
    3335        text run at (0,0) width 31: "-00:06"
     36layer at (102,266) size 10x8
     37  RenderBlock (relative positioned) {DIV} at (0,0) size 10x8

  • trunk/LayoutTests/media/media-document-audio-repaint-expected.txt

    r83939 r88757  
    2828        RenderFlexibleBox {DIV} at (49,5) size 226x15
    2929          RenderSlider {INPUT} at (45,2) size 136x13
    30             RenderBlock {DIV} at (63,2) size 10x8
     30            RenderFlexibleBox {DIV} at (0,0) size 136x13
     31              RenderBlock {DIV} at (0,2) size 126x8
     32              RenderBlock {DIV} at (126,2) size 10x8
    3133        RenderButton {INPUT} at (277,6) size 14x12
    3234    layer at (89,147) size 45x11
    … …  
    4042          RenderText {#text} at (0,0) size 31x11
    4143            text run at (0,0) width 31: "-00:00"
     44    layer at (197,149) size 10x8
     45      RenderBlock (relative positioned) {DIV} at (0,0) size 10x8

  • trunk/LayoutTests/platform/chromium/test_expectations.txt

    r88748 r88757  
    39503950BUGABARTH LINUX : svg/text/scaling-font-with-geometric-precision.html = IMAGE PASS
    39513951
     3952// Need rebaseline for all of rendering tests with <input type=range> including media controls.
     3953BUGWK52920 : fast/dom/HTMLInputElement/input-slider-update.html = FAIL
     3954BUGWK52920 LINUX WIN : fast/forms/box-shadow-override.html = FAIL
     3955BUGWK52920 LINUX WIN : fast/forms/input-appearance-height.html = FAIL
     3956BUGWK52920 : fast/forms/input-appearance-range.html = FAIL
     3957BUGWK52920 : fast/forms/range-thumb-height-percentage.html = FAIL
     3958BUGWK52920 : fast/forms/slider-delete-while-dragging-thumb.html = FAIL
     3959BUGWK52920 : fast/forms/slider-mouse-events.html = FAIL
     3960BUGWK52920 : fast/forms/slider-onchange-event.html = FAIL
     3961BUGWK52920 : fast/forms/slider-padding.html = FAIL
     3962BUGWK52920 : fast/forms/slider-thumb-shared-style.html = FAIL
     3963BUGWK52920 : fast/forms/slider-thumb-stylability.html = FAIL
     3964BUGWK52920 : fast/forms/thumbslider-no-parent-slider.html = FAIL
     3965BUGWK52920 : fast/layers/video-layer.html = FAIL
     3966BUGWK52920 : fast/multicol/client-rects.html = FAIL
     3967BUGWK52920 : fast/repaint/slider-thumb-drag-release.html = FAIL
     3968BUGWK52920 : media/audio-controls-rendering.html = FAIL
     3969BUGWK52920 : media/audio-repaint.html = FAIL
     3970BUGWK52920 : media/controls-after-reload.html = FAIL
     3971BUGWK52920 : media/controls-strict.html = FAIL
     3972BUGWK52920 : media/controls-styling.html = FAIL
     3973BUGWK52920 : media/controls-without-preload.html = FAIL
     3974BUGWK52920 : media/video-controls-rendering.html = FAIL
     3975BUGWK52920 : media/video-display-toggle.html = FAIL
     3976BUGWK52920 : media/video-empty-source.html = FAIL
     3977BUGWK52920 : media/video-no-audio.html = FAIL
     3978BUGWK52920 : media/video-volume-slider.html = FAIL
     3979BUGWK52920 : media/video-zoom-controls.html = FAIL
    39523980
    39533981BUGCR84157 GPU : plugins/embed-attributes-style.html = IMAGE+TEXT

  • trunk/LayoutTests/platform/gtk/Skipped

    r88742 r88757  
    12411241fast/forms/validation-message-on-menulist.html
    12421242fast/forms/validation-message-on-radio.html
     1243fast/forms/validation-message-on-range.html
    12431244fast/forms/validation-message-on-textarea.html
    12441245

  • trunk/LayoutTests/platform/mac-wk2/Skipped

    r88663 r88757  
    15191519fast/forms/validation-message-on-menulist.html
    15201520fast/forms/validation-message-on-radio.html
     1521fast/forms/validation-message-on-range.html
    15211522fast/forms/validation-message-on-textarea.html
    15221523

  • trunk/LayoutTests/platform/mac/fast/dom/HTMLInputElement/input-slider-update-expected.txt

    r77500 r88757  
    55    RenderBody {BODY} at (8,8) size 784x584
    66      RenderSlider {INPUT} at (2,2) size 129x15 [bgcolor=#FFFFFF]
    7         RenderBlock {DIV} at (114,0) size 15x15
     7        RenderFlexibleBox {DIV} at (0,0) size 129x15
     8          RenderBlock {DIV} at (0,0) size 114x15
     9          RenderBlock {DIV} at (114,0) size 15x15
    810      RenderText {#text} at (0,0) size 0x0
     11layer at (124,10) size 15x15
     12  RenderBlock (relative positioned) {DIV} at (0,0) size 15x15

  • trunk/LayoutTests/platform/mac/fast/forms/box-shadow-override-expected.txt

    r80755 r88757  
    3636          text run at (36,9) width 4: " "
    3737        RenderSlider {INPUT} at (42,8) size 129x15 [bgcolor=#FFFFFF]
    38           RenderBlock {DIV} at (57,0) size 15x15
     38          RenderFlexibleBox {DIV} at (0,0) size 129x15
     39            RenderBlock {DIV} at (0,0) size 114x15
     40            RenderBlock {DIV} at (114,0) size 15x15
    3941        RenderText {#text} at (173,9) size 4x18
    4042          text run at (173,9) width 4: " "
    … …  
    7779layer at (35,127) size 84x13
    7880  RenderBlock {DIV} at (22,0) size 84x13
     81layer at (107,153) size 15x15
     82  RenderBlock (relative positioned) {DIV} at (0,0) size 15x15

  • trunk/LayoutTests/platform/mac/fast/forms/input-appearance-height-expected.txt

    r80755 r88757  
    5151          text run at (0,127) width 39: "range "
    5252        RenderSlider {INPUT} at (41,126) size 129x15 [bgcolor=#FFFFFF]
    53           RenderBlock {DIV} at (57,0) size 15x15
     53          RenderFlexibleBox {DIV} at (0,0) size 129x15
     54            RenderBlock {DIV} at (0,0) size 114x15
     55            RenderBlock {DIV} at (114,0) size 15x15
    5456        RenderText {#text} at (172,127) size 4x18
    5557          text run at (172,127) width 4: " "
    … …  
    102104layer at (65,266) size 98x13
    103105  RenderBlock {DIV} at (8,0) size 98x13
     106layer at (106,152) size 15x15
     107  RenderBlock (relative positioned) {DIV} at (0,0) size 15x15

  • trunk/LayoutTests/platform/mac/fast/forms/range-thumb-height-percentage-expected.txt

    r42080 r88757  
    99      RenderBlock (anonymous) at (0,34) size 784x24
    1010        RenderSlider {INPUT} at (2,2) size 200x20 [bgcolor=#C0C0C0]
    11           RenderBlock {DIV} at (95,5) size 10x10 [bgcolor=#008000]
     11          RenderFlexibleBox {DIV} at (0,0) size 200x20
     12            RenderBlock {DIV} at (0,5) size 190x10
     13            RenderBlock {DIV} at (190,5) size 10x10 [bgcolor=#008000]
    1214        RenderText {#text} at (0,0) size 0x0
     15layer at (105,49) size 10x10
     16  RenderBlock (relative positioned) {DIV} at (0,0) size 10x10 [bgcolor=#008000]

  • trunk/LayoutTests/platform/mac/fast/forms/slider-padding-expected.txt

    r41972 r88757  
    1010      RenderBlock {DIV} at (0,18) size 784x39 [bgcolor=#ADD8E6]
    1111        RenderSlider {INPUT} at (2,2) size 100x35 [bgcolor=#FFFFFF]
    12           RenderBlock {DIV} at (10,10) size 15x15
     12          RenderFlexibleBox {DIV} at (10,10) size 80x15
     13            RenderBlock {DIV} at (0,0) size 65x15
     14            RenderBlock {DIV} at (65,0) size 15x15
    1315        RenderText {#text} at (0,0) size 0x0
    1416      RenderBlock {PRE} at (0,70) size 784x0
     17layer at (20,38) size 15x15
     18  RenderBlock (relative positioned) {DIV} at (0,0) size 15x15

  • trunk/LayoutTests/platform/mac/fast/forms/slider-thumb-shared-style-expected.txt

    r41972 r88757  
    2121      RenderBlock {DIV} at (0,68) size 784x38
    2222        RenderSlider {INPUT} at (2,2) size 129x15 [bgcolor=#FFFFFF]
    23           RenderBlock {DIV} at (0,0) size 15x15
     23          RenderFlexibleBox {DIV} at (0,0) size 129x15
     24            RenderBlock {DIV} at (0,0) size 114x15
     25            RenderBlock {DIV} at (114,0) size 15x15
    2426        RenderBR {BR} at (133,17) size 0x0
    2527        RenderSlider {INPUT} at (2,21) size 129x15 [bgcolor=#FFFFFF]
    26           RenderBlock {DIV} at (114,0) size 15x15
     28          RenderFlexibleBox {DIV} at (0,0) size 129x15
     29            RenderBlock {DIV} at (0,0) size 114x15
     30            RenderBlock {DIV} at (114,0) size 15x15
    2731        RenderText {#text} at (0,0) size 0x0
     32layer at (10,78) size 15x15
     33  RenderBlock (relative positioned) {DIV} at (0,0) size 15x15
     34layer at (124,97) size 15x15
     35  RenderBlock (relative positioned) {DIV} at (0,0) size 15x15

  • trunk/LayoutTests/platform/mac/fast/forms/slider-thumb-stylability-expected.txt

    r63403 r88757  
    44  RenderBlock {HTML} at (0,0) size 800x600
    55    RenderBody {BODY} at (8,8) size 784x584
    6       RenderBlock {P} at (0,0) size 784x18
    7         RenderText {#text} at (0,0) size 231x18
    8           text run at (0,0) width 231: "This tests styling of the slider thumb."
    9       RenderBlock {P} at (0,34) size 784x18
    10         RenderText {#text} at (0,0) size 258x18
    11           text run at (0,0) width 258: "You should see a green 20\x{D7}20px square."
    12       RenderBlock (anonymous) at (0,68) size 784x24
    13         RenderSlider {INPUT} at (2,2) size 129x20 [bgcolor=#FFFFFF]
    14           RenderBlock {DIV} at (0,0) size 20x20 [bgcolor=#008000]
    15         RenderText {#text} at (0,0) size 0x0
     6      RenderSlider {INPUT} at (2,2) size 129x20 [bgcolor=#FFFFFF]
     7        RenderFlexibleBox {DIV} at (0,0) size 129x20
     8          RenderBlock {DIV} at (0,0) size 109x20
     9          RenderBlock {DIV} at (109,0) size 20x20 [bgcolor=#008000]
     10      RenderText {#text} at (0,0) size 0x0
     11layer at (10,10) size 20x20
     12  RenderBlock (relative positioned) {DIV} at (0,0) size 20x20 [bgcolor=#008000]

  • trunk/LayoutTests/platform/mac/fast/forms/thumbslider-no-parent-slider-expected.txt

    r88415 r88757  
    44  RenderBlock {HTML} at (0,0) size 800x600
    55    RenderBody {BODY} at (8,8) size 784x584
    6       RenderBlock {SPAN} at (0,0) size 20x20
    7       RenderBR {BR} at (20,20) size 0x0
    8       RenderBlock {SPAN} at (0,20) size 20x20
     6      RenderBlock {SPAN} at (0,0) size 15x15
     7      RenderBR {BR} at (15,15) size 0x0
     8      RenderBlock {SPAN} at (0,15) size 15x15
    99      RenderText {#text} at (0,0) size 0x0

  • trunk/LayoutTests/platform/mac/fast/repaint/slider-thumb-drag-release-expected.txt

    r77644 r88757  
    55    RenderBody {BODY} at (8,8) size 784x584
    66      RenderSlider {INPUT} at (2,2) size 129x15 [bgcolor=#FFFFFF]
    7         RenderBlock {DIV} at (114,0) size 15x15
     7        RenderFlexibleBox {DIV} at (0,0) size 129x15
     8          RenderBlock {DIV} at (0,0) size 114x15
     9          RenderBlock {DIV} at (114,0) size 15x15
    810      RenderText {#text} at (0,0) size 0x0
     11layer at (124,10) size 15x15
     12  RenderBlock (relative positioned) {DIV} at (0,0) size 15x15

  • trunk/LayoutTests/platform/mac/media/audio-controls-rendering-expected.txt

    r80857 r88757  
    2323    RenderFlexibleBox {DIV} at (49,5) size 126x15
    2424      RenderSlider {INPUT} at (0,2) size 126x13
    25         RenderBlock {DIV} at (0,2) size 10x8
     25        RenderFlexibleBox {DIV} at (0,0) size 126x13
     26          RenderBlock {DIV} at (0,2) size 116x8
     27          RenderBlock {DIV} at (116,2) size 10x8
    2628    RenderButton {INPUT} at (177,6) size 14x12
     29layer at (57,51) size 10x8
     30  RenderBlock (relative positioned) {DIV} at (0,0) size 10x8
    2731layer at (8,85) size 320x25
    2832  RenderBlock (relative positioned) {DIV} at (0,0) size 320x25
    … …  
    3337    RenderFlexibleBox {DIV} at (49,5) size 246x15
    3438      RenderSlider {INPUT} at (45,2) size 156x13
    35         RenderBlock {DIV} at (0,2) size 10x8
     39        RenderFlexibleBox {DIV} at (0,0) size 156x13
     40          RenderBlock {DIV} at (0,2) size 146x8
     41          RenderBlock {DIV} at (146,2) size 10x8
    3642    RenderButton {INPUT} at (297,6) size 14x12
    3743layer at (57,92) size 45x11
    … …  
    4551      RenderText {#text} at (0,0) size 31x11
    4652        text run at (0,0) width 31: "-00:07"
     53layer at (102,94) size 10x8
     54  RenderBlock (relative positioned) {DIV} at (0,0) size 10x8
    4755layer at (8,128) size 320x100
    4856  RenderMedia {AUDIO} at (8,128) size 320x100 [bgcolor=#0000FF]
    … …  
    5563    RenderFlexibleBox {DIV} at (49,5) size 246x15
    5664      RenderSlider {INPUT} at (45,2) size 156x13
    57         RenderBlock {DIV} at (0,2) size 10x8
     65        RenderFlexibleBox {DIV} at (0,0) size 156x13
     66          RenderBlock {DIV} at (0,2) size 146x8
     67          RenderBlock {DIV} at (146,2) size 10x8
    5868    RenderButton {INPUT} at (297,6) size 14x12
    5969layer at (57,210) size 45x11
    … …  
    6777      RenderText {#text} at (0,0) size 31x11
    6878        text run at (0,0) width 31: "-00:07"
     79layer at (102,212) size 10x8
     80  RenderBlock (relative positioned) {DIV} at (0,0) size 10x8

  • trunk/LayoutTests/platform/mac/media/controls-after-reload-expected.txt

    r78910 r88757  
    1919    RenderFlexibleBox {DIV} at (49,5) size 216x15
    2020      RenderSlider {INPUT} at (45,2) size 126x13
    21         RenderBlock {DIV} at (0,2) size 10x8
     21        RenderFlexibleBox {DIV} at (0,0) size 126x13
     22          RenderBlock {DIV} at (0,2) size 116x8
     23          RenderBlock {DIV} at (116,2) size 10x8
    2224    RenderButton {INPUT} at (297,4) size 16x16
    2325    RenderButton {INPUT} at (267,6) size 14x12
    … …  
    3234      RenderText {#text} at (0,0) size 31x11
    3335        text run at (0,0) width 31: "-00:06"
     36layer at (102,266) size 10x8
     37  RenderBlock (relative positioned) {DIV} at (0,0) size 10x8

  • trunk/LayoutTests/platform/mac/media/controls-styling-expected.txt

    r78910 r88757  
    2323    RenderFlexibleBox {DIV} at (49,5) size 216x15
    2424      RenderSlider {INPUT} at (45,2) size 126x13
    25         RenderBlock {DIV} at (0,2) size 10x8
     25        RenderFlexibleBox {DIV} at (0,0) size 126x13
     26          RenderBlock {DIV} at (0,2) size 116x8
     27          RenderBlock {DIV} at (116,2) size 10x8
    2628    RenderButton {INPUT} at (297,4) size 16x16
    2729    RenderButton {INPUT} at (267,6) size 14x12
    … …  
    3638      RenderText {#text} at (0,0) size 31x11
    3739        text run at (0,0) width 31: "-00:06"
     40layer at (112,266) size 10x8
     41  RenderBlock (relative positioned) {DIV} at (0,0) size 10x8
    3842layer at (8,282) size 320x240
    3943  RenderBlock (relative positioned) {DIV} at (0,0) size 320x240
    … …  
    4448    RenderFlexibleBox {DIV} at (49,5) size 216x15
    4549      RenderSlider {INPUT} at (45,2) size 126x13
    46         RenderBlock {DIV} at (0,2) size 10x8
     50        RenderFlexibleBox {DIV} at (0,0) size 126x13
     51          RenderBlock {DIV} at (0,2) size 116x8
     52          RenderBlock {DIV} at (116,2) size 10x8
    4753    RenderButton {INPUT} at (297,4) size 16x16
    4854    RenderButton {INPUT} at (267,6) size 14x12
    … …  
    5763      RenderText {#text} at (0,0) size 31x11
    5864        text run at (0,0) width 31: "-00:06"
     65layer at (102,506) size 10x8
     66  RenderBlock (relative positioned) {DIV} at (0,0) size 10x8

  • trunk/LayoutTests/platform/qt/Skipped

    r88673 r88757  
    20112011fast/forms/validation-message-on-menulist.html
    20122012fast/forms/validation-message-on-radio.html
     2013fast/forms/validation-message-on-range.html
    20132014fast/forms/validation-message-on-textarea.html
    20142015

  • trunk/LayoutTests/platform/win/Skipped

    r88694 r88757  
    11091109fast/forms/validation-message-on-menulist.html
    11101110fast/forms/validation-message-on-radio.html
     1111fast/forms/validation-message-on-range.html
    11111112fast/forms/validation-message-on-textarea.html
    11121113

  • trunk/Source/WebCore/ChangeLog

    r88754 r88757  
     12011-06-10  Kent Tamura  <tkent@chromium.org>
     2
     3        Reviewed by Dimitri Glazkov.
     4
     5        Use CSS machinery to position slider thumb.
     6        https://bugs.webkit.org/show_bug.cgi?id=52920
     7
     8        Remove RenderSlider::layout().
     9        In order to remove it, we introduce new three shadow nodes:
     10         - A flex box container occupying the whole box
     11         - A flex box item representing a movable area of the thumb
     12         - A flex box item limiting the movable area of the thumb
     13        The thumb position is specified by percentage position in the second element.
     14
     15        This change also fixes Bug 60353.
     16
     17        Tests: fast/forms/input-appearance-range.html
     18               fast/forms/validation-message-on-range.html
     19
     20        * accessibility/AccessibilitySlider.cpp:
     21        (WebCore::AccessibilitySliderThumb::elementRect):
     22          Use Node::getRect() for the thumb element.
     23        * css/html.css: Add new style definitions for the new node layout.
     24        (input[type="range"]::-webkit-slider-container):
     25        (input[type="range"]::-webkit-slider-runnable-track):
     26        (input[type="range"]::-webkit-slider-thumb):
     27        * html/RangeInputType.cpp:
     28        (WebCore::RangeInputType::handleMouseDownEvent):
     29          Accepts events on shadow nodes, use sliderThumbElementOf().
     30        (WebCore::RangeInputType::createShadowSubtree):
     31          Creates new nodes layout.
     32        (WebCore::RangeInputType::valueChanged): Use sliderThumbElementOf().
     33        * html/RangeInputType.h: Remove shadowSliderThumb().
     34        * html/shadow/SliderThumbElement.cpp:
     35        (WebCore::sliderPosition): Moved from RenderSlider.cpp.
     36        (WebCore::hasVerticalAppearance): New utility function.
     37        (WebCore::sliderThumbElementOf): New utility function.
     38        (WebCore::RenderSliderThumb::layout):
     39          Sets CSS top/left values.
     40        (WebCore::RenderSliderContainer::RenderSliderContainer):
     41        (WebCore::RenderSliderContainer::layout):
     42          Add some adjustment code.
     43          - Setting box-orient
     44          - Adjust heights of some nodes. It is required to pass existing tests.
     45        (WebCore::SliderThumbElement::setPositionFromValue):
     46          Update comments.
     47        (WebCore::SliderThumbElement::setPositionFromPoint):
     48          Calculate the current position from absolute positions.
     49        (WebCore::SliderThumbElement::hostInput):
     50          Removed unnecessary variable.
     51        (WebCore::TrackLimiterElement::TrackLimiterElement):
     52        (WebCore::TrackLimiterElement::create): Adjust style.
     53        (WebCore::TrackLimiterElement::createRenderer):
     54          This node uses RenderSliderThumb.
     55        (WebCore::TrackLimiterElement::shadowPseudoId):
     56          This node also uses -webkit-slider-thumb.
     57        (WebCore::SliderContainerElement::SliderContainerElement):
     58        (WebCore::SliderContainerElement::create):
     59        (WebCore::SliderContainerElement::createRenderer):
     60          Uses RenderSliderContainer.
     61        (WebCore::SliderContainerElement::shadowPseudoId):
     62        * html/shadow/SliderThumbElement.h:
     63          Make hostInput() public, add declarations of TrackLimiterElement
     64          and SliderContainerElement.
     65        * rendering/RenderSlider.cpp:
     66        (WebCore::RenderSlider::RenderSlider): Added an assertion.
     67        (WebCore::RenderSlider::inDragMode): Uses sliderThumbElementOf().
     68        * rendering/RenderSlider.h: Remove declarations of removed functions.
     69        * rendering/RenderTheme.cpp:
     70        (WebCore::RenderTheme::adjustSliderThumbStyle):
     71          Calls adjustSliderThumbSize().
     72
    1732011-06-13  Joone Hur  <joone.hur@collabora.co.uk>
    274

  • trunk/Source/WebCore/accessibility/AccessibilitySlider.cpp

    r83479 r88757  
    3535#include "RenderObject.h"
    3636#include "RenderSlider.h"
     37#include "SliderThumbElement.h"
    3738
    3839namespace WebCore {
    … …  
    176177IntRect AccessibilitySliderThumb::elementRect() const
    177178{
    178     if (!m_parentSlider->renderer())
     179    RenderObject* sliderRenderer = m_parentSlider->renderer();
     180    if (!sliderRenderer || !sliderRenderer->isSlider())
    179181        return IntRect();
    180 
    181     IntRect intRect = toRenderSlider(m_parentSlider->renderer())->thumbRect();
    182     FloatQuad floatQuad = m_parentSlider->renderer()->localToAbsoluteQuad(FloatRect(intRect));
    183 
    184     return floatQuad.enclosingBoundingBox();
     182    return sliderThumbElementOf(sliderRenderer->node())->getRect();
    185183}
    186184

  • trunk/Source/WebCore/css/html.css

    r88228 r88757  
    547547}
    548548
     549input[type="range"]::-webkit-slider-container {
     550    -webkit-box-align: center;
     551    -webkit-box-orient: horizontal; /* This property is updated by C++ code. */
     552    -webkit-box-sizing: border-box;
     553    display: -webkit-box;
     554    height: 100%;
     555    width: 100%;
     556}
     557
     558input[type="range"]::-webkit-slider-runnable-track {
     559    -webkit-box-flex: 1;
     560    -webkit-box-sizing: border-box;
     561    display: block;
     562}
     563
    549564input[type="range"]::-webkit-slider-thumb {
    550565    -webkit-appearance: sliderthumb-horizontal;
    551     display: block;
     566    -webkit-box-sizing: border-box;
     567    display: block;
     568    position: relative;
    552569}
    553570

  • trunk/Source/WebCore/html/RangeInputType.cpp

    r84683 r88757  
    3333#include "RangeInputType.h"
    3434
     35#include "ElementWithPseudoId.h"
    3536#include "HTMLInputElement.h"
    3637#include "HTMLNames.h"
    … …  
    152153void RangeInputType::handleMouseDownEvent(MouseEvent* event)
    153154{
    154     if (event->button() != LeftButton || event->target() != element())
     155    Node* targetNode = event->target()->toNode();
     156    if (event->button() != LeftButton || !targetNode || (targetNode != element() && !targetNode->isDescendantOf(element()->shadowRoot())))
    155157        return;
    156158
    157     if (SliderThumbElement* thumb = shadowSliderThumb())
    158         thumb->dragFrom(event->absoluteLocation());
     159    SliderThumbElement* thumb = sliderThumbElementOf(element());
     160    thumb->dragFrom(event->absoluteLocation());
    159161}
    160162
    … …  
    204206{
    205207    ExceptionCode ec = 0;
    206     element()->ensureShadowRoot()->appendChild(SliderThumbElement::create(element()->document()), ec);
     208    Document* document = element()->document();
     209    RefPtr<HTMLElement> track = ElementWithPseudoId::create(document, "-webkit-slider-runnable-track");
     210    track->appendChild(SliderThumbElement::create(document), ec);
     211    RefPtr<HTMLElement> container = SliderContainerElement::create(document);
     212    container->appendChild(track.release(), ec);
     213    container->appendChild(TrackLimiterElement::create(document), ec);
     214    element()->ensureShadowRoot()->appendChild(container.release(), ec);
    207215}
    208216
    … …  
    249257void RangeInputType::valueChanged()
    250258{
    251     shadowSliderThumb()->setPositionFromValue();
     259    sliderThumbElementOf(element())->setPositionFromValue();
    252260}
    253261
    … …  
    273281}
    274282
    275 SliderThumbElement* RangeInputType::shadowSliderThumb() const
    276 {
    277     Node* shadow = element()->shadowRoot();
    278     return shadow ? toSliderThumbElement(shadow->firstChild()) : 0;
    279 }
    280 
    281283} // namespace WebCore

  • trunk/Source/WebCore/html/RangeInputType.h

    r84683 r88757  
    7171    virtual String sanitizeValue(const String& proposedValue);
    7272    virtual bool shouldRespectListAttribute();
    73 
    74     SliderThumbElement* shadowSliderThumb() const;
    7573};
    7674

  • trunk/Source/WebCore/html/shadow/SliderThumbElement.cpp

    r88415 r88757  
    3434#include "SliderThumbElement.h"
    3535
     36#include "CSSValueKeywords.h"
    3637#include "Event.h"
    3738#include "Frame.h"
    … …  
    3940#include "HTMLParserIdioms.h"
    4041#include "MouseEvent.h"
     42#include "RenderFlexibleBox.h"
    4143#include "RenderSlider.h"
    4244#include "RenderTheme.h"
     45#include "ShadowRoot.h"
    4346#include "StepRange.h"
    4447#include <wtf/MathExtras.h>
    … …  
    4851namespace WebCore {
    4952
     53inline static double sliderPosition(HTMLInputElement* element)
     54{
     55    StepRange range(element);
     56    return range.proportionFromValue(range.valueFromElement(element));
     57}
     58
     59inline static bool hasVerticalAppearance(HTMLInputElement* input)
     60{
     61    ASSERT(input->renderer());
     62    RenderStyle* sliderStyle = input->renderer()->style();
     63    return sliderStyle->appearance() == SliderVerticalPart || sliderStyle->appearance() == MediaVolumeSliderPart;
     64}
     65
     66SliderThumbElement* sliderThumbElementOf(Node* node)
     67{
     68    ASSERT(node);
     69    Node* shadow = node->toInputElement()->shadowRoot();
     70    ASSERT(shadow);
     71    Node* thumb = shadow->firstChild()->firstChild()->firstChild();
     72    ASSERT(thumb);
     73    return toSliderThumbElement(thumb);
     74}
     75
     76// --------------------------------
     77
    5078// FIXME: Find a way to cascade appearance (see the layout method) and get rid of this class.
     79// http://webkit.org/b/62535
    5180class RenderSliderThumb : public RenderBlock {
    5281public:
    … …  
    6493void RenderSliderThumb::layout()
    6594{
     95    // Do not cast node() to SliderThumbElement. This renderer is used for
     96    // TrackLimitElement too.
     97    HTMLInputElement* input = node()->shadowAncestorNode()->toInputElement();
    6698    // FIXME: Hard-coding this cascade of appearance is bad, because it's something
    6799    // that CSS usually does. We need to find a way to express this in CSS.
    68     RenderStyle* parentStyle = parent()->style();
    69     if (parentStyle->appearance() == SliderVerticalPart)
     100    RenderStyle* parentStyle = input->renderer()->style();
     101    bool isVertical = false;
     102    if (parentStyle->appearance() == SliderVerticalPart) {
    70103        style()->setAppearance(SliderThumbVerticalPart);
    71     else if (parentStyle->appearance() == SliderHorizontalPart)
     104        isVertical = true;
     105    } else if (parentStyle->appearance() == SliderHorizontalPart)
    72106        style()->setAppearance(SliderThumbHorizontalPart);
    73107    else if (parentStyle->appearance() == MediaSliderPart)
    74108        style()->setAppearance(MediaSliderThumbPart);
    75     else if (parentStyle->appearance() == MediaVolumeSliderPart)
     109    else if (parentStyle->appearance() == MediaVolumeSliderPart) {
    76110        style()->setAppearance(MediaVolumeSliderThumbPart);
    77 
     111        isVertical = true;
     112    }
    78113    if (style()->hasAppearance())
    79114        theme()->adjustSliderThumbSize(style());
     115
     116    double fraction = sliderPosition(input) * 100;
     117    if (isVertical)
     118        style()->setTop(Length(100 - fraction, Percent));
     119    else
     120        style()->setLeft(Length(fraction, Percent));
     121
    80122    RenderBlock::layout();
    81123}
    82124
     125// --------------------------------
     126
     127// FIXME: Find a way to cascade appearance and adjust heights, and get rid of this class.
     128// http://webkit.org/b/62535
     129class RenderSliderContainer : public RenderFlexibleBox {
     130public:
     131    RenderSliderContainer(Node* node)
     132        : RenderFlexibleBox(node) { }
     133
     134private:
     135    virtual void layout();
     136};
     137
     138void RenderSliderContainer::layout()
     139{
     140    HTMLInputElement* input = node()->shadowAncestorNode()->toInputElement();
     141    bool isVertical = hasVerticalAppearance(input);
     142    style()->setBoxOrient(isVertical ? VERTICAL : HORIZONTAL);
     143    // Sets the concrete height if the height of the <input> is not fixed or a
     144    // percentage value because a percentage height value of this box won't be
     145    // based on the <input> height in such case.
     146    Length inputHeight = input->renderer()->style()->height();
     147    RenderObject* trackRenderer = node()->firstChild()->renderer();
     148    if (!isVertical && input->renderer()->isSlider() && !inputHeight.isFixed() && !inputHeight.isPercent()) {
     149        RenderObject* thumbRenderer = input->shadowRoot()->firstChild()->firstChild()->firstChild()->renderer();
     150        if (thumbRenderer) {
     151            style()->setHeight(thumbRenderer->style()->height());
     152            if (trackRenderer)
     153                trackRenderer->style()->setHeight(thumbRenderer->style()->height());
     154        }
     155    } else {
     156        style()->setHeight(Length(100, Percent));
     157        if (trackRenderer)
     158            trackRenderer->style()->setHeight(Length());
     159    }
     160
     161    RenderFlexibleBox::layout();
     162
     163    // Percentage 'top' for the thumb doesn't work if the parent style has no
     164    // concrete height.
     165    Node* track = node()->firstChild();
     166    if (track && track->renderer()->isBox()) {
     167        RenderBox* trackBox = track->renderBox();
     168        trackBox->style()->setHeight(Length(trackBox->height() - trackBox->borderAndPaddingHeight(), Fixed));
     169    }
     170}
     171
     172// --------------------------------
     173
    83174void SliderThumbElement::setPositionFromValue()
    84175{
    85     // Since today the code to calculate position is in the RenderSlider layout
     176    // Since the code to calculate position is in the RenderSliderThumb layout
    86177    // path, we don't actually update the value here. Instead, we poke at the
    87178    // renderer directly to trigger layout.
    88     // FIXME: Move the logic of positioning the thumb here.
    89179    if (renderer())
    90180        renderer()->setNeedsLayout(true);
    … …  
    120210{
    121211    HTMLInputElement* input = hostInput();
    122     ASSERT(input);
    123212
    124213    if (!input->renderer() || !renderer())
    … …  
    126215
    127216    IntPoint offset = roundedIntPoint(input->renderer()->absoluteToLocal(point, false, true));
    128     RenderStyle* sliderStyle = input->renderer()->style();
    129     bool isVertical = sliderStyle->appearance() == SliderVerticalPart || sliderStyle->appearance() == MediaVolumeSliderPart;
    130 
     217    bool isVertical = hasVerticalAppearance(input);
    131218    int trackSize;
    132219    int position;
    133220    int currentPosition;
     221    // We need to calculate currentPosition from absolute points becaue the
     222    // renderer for this node is usually on a layer and renderBox()->x() and
     223    // y() are unusable.
     224    IntPoint absoluteThumbOrigin = renderBox()->absoluteBoundingBoxRect().location();
     225    IntPoint absoluteSliderContentOrigin = roundedIntPoint(input->renderer()->localToAbsolute());
    134226    if (isVertical) {
    135227        trackSize = input->renderBox()->contentHeight() - renderBox()->height();
     228        // FIXME: The following expression assumes the pointer position is
     229        // always the center of the thumb. If a user presses the mouse button at
     230        // non-center of the thumb and start moving the pointer, the thumb is
     231        // forcely adjusted so that the pointer is at the center of the thumb.
    136232        position = offset.y() - renderBox()->height() / 2;
    137         currentPosition = renderBox()->y() - input->renderBox()->contentBoxRect().y();
     233        currentPosition = absoluteThumbOrigin.y() - absoluteSliderContentOrigin.y();
    138234    } else {
    139235        trackSize = input->renderBox()->contentWidth() - renderBox()->width();
     236        // FIXME: The following expression assumes the pointer position is
     237        // always the center of the thumb. If a user presses the mouse button at
     238        // non-center of the thumb and start moving the pointer, the thumb is
     239        // forcely adjusted so that the pointer is at the center of the thumb.
    140240        position = offset.x() - renderBox()->width() / 2;
    141         currentPosition = renderBox()->x() - input->renderBox()->contentBoxRect().x();
     241        currentPosition = absoluteThumbOrigin.x() - absoluteSliderContentOrigin.x();
    142242    }
    143243    position = max(0, min(position, trackSize));
    … …  
    216316    // Only HTMLInputElement creates SliderThumbElement instances as its shadow nodes.
    217317    // So, shadowAncestorNode() must be an HTMLInputElement.
    218     HTMLInputElement* input = shadowAncestorNode()->toInputElement();
    219     return input;
     318    return shadowAncestorNode()->toInputElement();
    220319}
    221320
    … …  
    226325}
    227326
    228 }
    229 
     327// --------------------------------
     328
     329inline TrackLimiterElement::TrackLimiterElement(Document* document)
     330    : HTMLDivElement(HTMLNames::divTag, document)
     331{
     332}
     333
     334PassRefPtr<TrackLimiterElement> TrackLimiterElement::create(Document* document)
     335{
     336    RefPtr<TrackLimiterElement> element = adoptRef(new TrackLimiterElement(document));
     337    element->getInlineStyleDecl()->setProperty(CSSPropertyVisibility, CSSValueHidden);
     338    element->getInlineStyleDecl()->setProperty(CSSPropertyPosition, CSSValueStatic);
     339    return element.release();
     340}
     341
     342RenderObject* TrackLimiterElement::createRenderer(RenderArena* arena, RenderStyle*)
     343{
     344    return new (arena) RenderSliderThumb(this);
     345}
     346
     347const AtomicString& TrackLimiterElement::shadowPseudoId() const
     348{
     349    DEFINE_STATIC_LOCAL(AtomicString, sliderThumb, ("-webkit-slider-thumb"));
     350    return sliderThumb;
     351}
     352
     353// --------------------------------
     354
     355inline SliderContainerElement::SliderContainerElement(Document* document)
     356    : HTMLDivElement(HTMLNames::divTag, document)
     357{
     358}
     359
     360PassRefPtr<SliderContainerElement> SliderContainerElement::create(Document* document)
     361{
     362    return adoptRef(new SliderContainerElement(document));
     363}
     364
     365RenderObject* SliderContainerElement::createRenderer(RenderArena* arena, RenderStyle*)
     366{
     367    return new (arena) RenderSliderContainer(this);
     368}
     369
     370const AtomicString& SliderContainerElement::shadowPseudoId() const
     371{
     372    DEFINE_STATIC_LOCAL(AtomicString, sliderThumb, ("-webkit-slider-container"));
     373    return sliderThumb;
     374}
     375
     376}
     377

  • trunk/Source/WebCore/html/shadow/SliderThumbElement.h

    r88415 r88757  
    5656    virtual void detach();
    5757    virtual const AtomicString& shadowPseudoId() const;
     58    HTMLInputElement* hostInput() const;
    5859
    5960private:
    … …  
    6768    void stopDragging();
    6869    void setPositionFromPoint(const IntPoint&);
    69     HTMLInputElement* hostInput() const;
    7070
    7171    bool m_inDragMode;
    … …  
    9494}
    9595
     96// This always return a valid pointer.
     97// An assertion fails if the specified node is not a range input.
     98SliderThumbElement* sliderThumbElementOf(Node*);
     99
     100// --------------------------------
     101
     102class TrackLimiterElement : public HTMLDivElement {
     103public:
     104    static PassRefPtr<TrackLimiterElement> create(Document*);
     105
     106private:
     107    TrackLimiterElement(Document*);
     108    virtual RenderObject* createRenderer(RenderArena*, RenderStyle*);
     109    virtual const AtomicString& shadowPseudoId() const;
     110};
     111
     112// --------------------------------
     113
     114class SliderContainerElement : public HTMLDivElement {
     115public:
     116    static PassRefPtr<SliderContainerElement> create(Document*);
     117
     118private:
     119    SliderContainerElement(Document*);
     120    virtual RenderObject* createRenderer(RenderArena*, RenderStyle*);
     121    virtual const AtomicString& shadowPseudoId() const;
     122};
     123
    96124}
    97125

  • trunk/Source/WebCore/rendering/RenderSlider.cpp

    r88415 r88757  
    4949static const int defaultTrackLength = 129;
    5050
    51 // Returns a value between 0 and 1.
    52 static double sliderPosition(HTMLInputElement* element)
    53 {
    54     StepRange range(element);
    55     return range.proportionFromValue(range.valueFromElement(element));
    56 }
    57 
    5851RenderSlider::RenderSlider(HTMLInputElement* element)
    5952    : RenderBlock(element)
    6053{
     54    // We assume RenderSlider works only with <input type=range>.
     55    ASSERT(element->isRangeControl());
    6156}
    6257
    … …  
    10196}
    10297
    103 IntRect RenderSlider::thumbRect()
    104 {
    105     SliderThumbElement* thumbElement = shadowSliderThumb();
    106     if (!thumbElement)
    107         return IntRect();
    108 
    109     IntRect thumbRect;
    110     RenderBox* thumb = toRenderBox(thumbElement->renderer());
    111 
    112     thumbRect.setWidth(thumb->style()->width().calcMinValue(contentWidth()));
    113     thumbRect.setHeight(thumb->style()->height().calcMinValue(contentHeight()));
    114 
    115     double fraction = sliderPosition(static_cast<HTMLInputElement*>(node()));
    116     IntRect contentRect = contentBoxRect();
    117     if (style()->appearance() == SliderVerticalPart || style()->appearance() == MediaVolumeSliderPart) {
    118         thumbRect.setX(contentRect.x() + (contentRect.width() - thumbRect.width()) / 2);
    119         thumbRect.setY(contentRect.y() + static_cast<int>(nextafter((contentRect.height() - thumbRect.height()) + 1, 0) * (1 - fraction)));
    120     } else {
    121         thumbRect.setX(contentRect.x() + static_cast<int>(nextafter((contentRect.width() - thumbRect.width()) + 1, 0) * fraction));
    122         thumbRect.setY(contentRect.y() + (contentRect.height() - thumbRect.height()) / 2);
    123     }
    124 
    125     return thumbRect;
    126 }
    127 
    128 void RenderSlider::layout()
    129 {
    130     ASSERT(needsLayout());
    131 
    132     SliderThumbElement* thumbElement = shadowSliderThumb();
    133     RenderBox* thumb = thumbElement ? toRenderBox(thumbElement->renderer()) : 0;
    134 
    135     IntSize baseSize(borderAndPaddingWidth(), borderAndPaddingHeight());
    136 
    137     if (thumb) {
    138         // Allow the theme to set the size of the thumb.
    139         if (thumb->style()->hasAppearance())
    140             theme()->adjustSliderThumbSize(thumb->style());
    141 
    142         baseSize.expand(thumb->style()->width().calcMinValue(0), thumb->style()->height().calcMinValue(0));
    143     }
    144 
    145     LayoutRepainter repainter(*this, checkForRepaintDuringLayout());
    146 
    147     IntSize oldSize = size();
    148 
    149     setSize(baseSize);
    150     computeLogicalWidth();
    151     computeLogicalHeight();
    152     updateLayerTransform();
    153 
    154     m_overflow.clear();
    155 
    156     if (thumb) {
    157         if (oldSize != size())
    158             thumb->setChildNeedsLayout(true, false);
    159 
    160         LayoutStateMaintainer statePusher(view(), this, IntSize(x(), y()), style()->isFlippedBlocksWritingMode());
    161 
    162         IntRect oldThumbRect = thumb->frameRect();
    163 
    164         thumb->layoutIfNeeded();
    165 
    166         IntRect rect = thumbRect();
    167         thumb->setFrameRect(rect);
    168         if (thumb->checkForRepaintDuringLayout())
    169             thumb->repaintDuringLayoutIfMoved(oldThumbRect);
    170 
    171         statePusher.pop();
    172         addOverflowFromChild(thumb);
    173     }
    174 
    175     repainter.repaintAfterLayout();   
    176 
    177     setNeedsLayout(false);
    178 }
    179 
    180 SliderThumbElement* RenderSlider::shadowSliderThumb() const
    181 {
    182     Node* shadow = static_cast<Element*>(node())->shadowRoot();
    183     return shadow ? toSliderThumbElement(shadow->firstChild()) : 0;
    184 }
    185 
    18698bool RenderSlider::inDragMode() const
    18799{
    188     SliderThumbElement* thumbElement = shadowSliderThumb();
    189     return thumbElement && thumbElement->active();
     100    return sliderThumbElementOf(node())->active();
    190101}
    191102

  • trunk/Source/WebCore/rendering/RenderSlider.h

    r83256 r88757  
    3636
    3737        bool inDragMode() const;
    38         IntRect thumbRect();
    3938
    4039    private:
    … …  
    4443        virtual int baselinePosition(FontBaseline, bool firstLine, LineDirectionMode, LinePositionMode = PositionOnContainingLine) const;
    4544        virtual void computePreferredLogicalWidths();
    46         virtual void layout();
    47 
    48         // FIXME: Eventually, the logic of manipulating slider thumb should move to
    49         // SliderThumbElement and accessing shadowSliderThumb should not be necessary in this class.
    50         SliderThumbElement* shadowSliderThumb() const;
    51 
    5245        virtual bool requiresForcedStyleRecalcPropagation() const { return true; }
    5346    };

  • trunk/Source/WebCore/rendering/RenderTheme.cpp

    r88415 r88757  
    963963}
    964964
    965 void RenderTheme::adjustSliderThumbStyle(CSSStyleSelector*, RenderStyle*, Element*) const
    966 {
    967     // FIXME: Should call adjustSliderThumbSize().
     965void RenderTheme::adjustSliderThumbStyle(CSSStyleSelector*, RenderStyle* style, Element*) const
     966{
     967    adjustSliderThumbSize(style);
    968968}
    969969
Note: See TracChangeset for help on using the changeset viewer.