⚠ Archived content — this site is no longer maintained.   Current WebKit documentation is at docs.webkit.org.

Changeset 120414 in webkit


Ignore:
Timestamp:
Jun 15, 2012, 12:19:53 AM (14 years ago)
Author:
commit-queue@webkit.org
Message:

Add fullscreen button to Chrome video controls for video.
​https://bugs.webkit.org/show_bug.cgi?id=88818

Patch by Silvia Pfeiffer <​silviapf@chromium.org> on 2012-06-15
Reviewed by Eric Carlson.

No new tests, final patch will contain the rebaselined tests.

The Chrome video controls are receiving a visual update.
This patch includes a fullscreen button for video elements and the rendering of the controls
in fullscreen including hiding them after 2 seconds when the mouse is out of the controls
and not moved.

  • css/fullscreen.css:

(video:-webkit-full-screen, audio:-webkit-full-screen):
Add audio to the default fullscreen styling rules.

  • css/mediaControlsChromium.css:

(video:-webkit-full-page-media::-webkit-media-controls-panel):
Align controls to the bottom of the fullscreen page.
(audio::-webkit-media-controls-fullscreen-button, video::-webkit-media-controls-fullscreen-button):
Include styling for the fullscreen button.

  • html/shadow/MediaControlRootElementChromium.cpp:

(WebCore):
Add a constant for when to hide the controls in fullscreen.
(WebCore::MediaControlRootElementChromium::MediaControlRootElementChromium):
Add member fields for fullscreen button, hiding timer and tracking of whether we are in fullscreen.
(WebCore::MediaControlRootElementChromium::create):
Add fullscreen button element to the visual layout.
(WebCore::MediaControlRootElementChromium::setMediaController):
Add fullscreen button element to the media controller.
(WebCore::MediaControlRootElementChromium::reset):
Show the fullscreen button if the controller supports fullscreen.
(WebCore::MediaControlRootElementChromium::playbackStarted):
Start the timer to hide the controls in fullscreen.
(WebCore::MediaControlRootElementChromium::playbackStopped):
Don't hide the controls when the video is paused in fullscreen.
(WebCore::MediaControlRootElementChromium::reportedError):
Hide the fullscreen button when we hit an error.
(WebCore::MediaControlRootElementChromium::defaultEventHandler):
Add logic for mouse events in fullscreen to start/stop the hiding timer.
(WebCore::MediaControlRootElementChromium::startHideFullscreenControlsTimer):
Start the fullscreen hiding timer.
(WebCore::MediaControlRootElementChromium::hideFullscreenControlsTimerFired):
Timer fired: hide the video controls in fullscreen.
(WebCore::MediaControlRootElementChromium::stopHideFullscreenControlsTimer):
Reset the fullscreen hiding timer.
(WebCore::MediaControlRootElementChromium::enteredFullscreen):
Add logic to enter fullscreen.
(WebCore::MediaControlRootElementChromium::exitedFullscreen):
Add logic to exit fullscreen.

  • html/shadow/MediaControlRootElementChromium.h:

(MediaControlRootElementChromium):
Add declaration of member functions and fields for fullscreen.

  • rendering/RenderMediaControlsChromium.cpp:

(WebCore::paintMediaFullscreenButton):
Use the new image for the fullscreen button.

  • rendering/RenderThemeChromiumMac.h:

(RenderThemeChromiumMac):
Declare the fullscreen painting function for Chrome Mac.

  • rendering/RenderThemeChromiumMac.mm:

(WebCore::RenderThemeChromiumMac::paintMediaFullscreenButton):
Hook up the fullscreen paining function for Chrome Mac.

  • rendering/RenderThemeChromiumSkia.cpp:

(WebCore::RenderThemeChromiumSkia::paintMediaFullscreenButton):
Hook up the fullscreen paining function for Chrome Skia.

  • rendering/RenderThemeChromiumSkia.h:

(RenderThemeChromiumSkia):
Declare the fullscreen painting function for Chrome Skia.

Location:
trunk/Source
Files:
11 edited

Legend:

Unmodified
Added
Removed

  • trunk/Source/WebCore/ChangeLog

    r120413 r120414  
     12012-06-15  Silvia Pfeiffer  <silviapf@chromium.org>
     2
     3        Add fullscreen button to Chrome video controls for video.
     4        https://bugs.webkit.org/show_bug.cgi?id=88818
     5
     6        Reviewed by Eric Carlson.
     7
     8        No new tests, final patch will contain the rebaselined tests.
     9
     10        The Chrome video controls are receiving a visual update.
     11        This patch includes a fullscreen button for video elements and the rendering of the controls
     12        in fullscreen including hiding them after 2 seconds when the mouse is out of the controls
     13        and not moved.
     14
     15        * css/fullscreen.css:
     16        (video:-webkit-full-screen, audio:-webkit-full-screen):
     17        Add audio to the default fullscreen styling rules.
     18        * css/mediaControlsChromium.css:
     19        (video:-webkit-full-page-media::-webkit-media-controls-panel):
     20        Align controls to the bottom of the fullscreen page.
     21        (audio::-webkit-media-controls-fullscreen-button, video::-webkit-media-controls-fullscreen-button):
     22        Include styling for the fullscreen button.
     23        * html/shadow/MediaControlRootElementChromium.cpp:
     24        (WebCore):
     25        Add a constant for when to hide the controls in fullscreen.
     26        (WebCore::MediaControlRootElementChromium::MediaControlRootElementChromium):
     27        Add member fields for fullscreen button, hiding timer and tracking of whether we are in fullscreen.
     28        (WebCore::MediaControlRootElementChromium::create):
     29        Add fullscreen button element to the visual layout.
     30        (WebCore::MediaControlRootElementChromium::setMediaController):
     31        Add fullscreen button element to the media controller.
     32        (WebCore::MediaControlRootElementChromium::reset):
     33        Show the fullscreen button if the controller supports fullscreen.
     34        (WebCore::MediaControlRootElementChromium::playbackStarted):
     35        Start the timer to hide the controls in fullscreen.
     36        (WebCore::MediaControlRootElementChromium::playbackStopped):
     37        Don't hide the controls when the video is paused in fullscreen.
     38        (WebCore::MediaControlRootElementChromium::reportedError):
     39        Hide the fullscreen button when we hit an error.
     40        (WebCore::MediaControlRootElementChromium::defaultEventHandler):
     41        Add logic for mouse events in fullscreen to start/stop the hiding timer.
     42        (WebCore::MediaControlRootElementChromium::startHideFullscreenControlsTimer):
     43        Start the fullscreen hiding timer.
     44        (WebCore::MediaControlRootElementChromium::hideFullscreenControlsTimerFired):
     45        Timer fired: hide the video controls in fullscreen.
     46        (WebCore::MediaControlRootElementChromium::stopHideFullscreenControlsTimer):
     47        Reset the fullscreen hiding timer.
     48        (WebCore::MediaControlRootElementChromium::enteredFullscreen):
     49        Add logic to enter fullscreen.
     50        (WebCore::MediaControlRootElementChromium::exitedFullscreen):
     51        Add logic to exit fullscreen.
     52        * html/shadow/MediaControlRootElementChromium.h:
     53        (MediaControlRootElementChromium):
     54        Add declaration of member functions and fields for fullscreen.
     55        * rendering/RenderMediaControlsChromium.cpp:
     56        (WebCore::paintMediaFullscreenButton):
     57        Use the new image for the fullscreen button.
     58        * rendering/RenderThemeChromiumMac.h:
     59        (RenderThemeChromiumMac):
     60        Declare the fullscreen painting function for Chrome Mac.
     61        * rendering/RenderThemeChromiumMac.mm:
     62        (WebCore::RenderThemeChromiumMac::paintMediaFullscreenButton):
     63        Hook up the fullscreen paining function for Chrome Mac.
     64        * rendering/RenderThemeChromiumSkia.cpp:
     65        (WebCore::RenderThemeChromiumSkia::paintMediaFullscreenButton):
     66        Hook up the fullscreen paining function for Chrome Skia.
     67        * rendering/RenderThemeChromiumSkia.h:
     68        (RenderThemeChromiumSkia):
     69        Declare the fullscreen painting function for Chrome Skia.
     70
    1712012-06-14  Kent Tamura  <tkent@chromium.org>
    272

  • trunk/Source/WebCore/css/fullscreen.css

    r113498 r120414  
    2121}
    2222
    23 video:-webkit-full-screen {
     23video:-webkit-full-screen, audio:-webkit-full-screen {
    2424    background-color: transparent !important;
    2525    position: static !important;

  • trunk/Source/WebCore/css/mediaControlsChromium.css

    r120322 r120414  
    3838    max-height: 100%;
    3939    max-width: 100%;
     40}
     41
     42audio:-webkit-full-page-media::-webkit-media-controls-panel,
     43video:-webkit-full-page-media::-webkit-media-controls-panel {
     44    bottom: 0px;
    4045}
    4146
    … …  
    172177    margin-right: -7px;
    173178}
     179
     180audio::-webkit-media-controls-fullscreen-button, video::-webkit-media-controls-fullscreen-button {
     181    -webkit-appearance: media-enter-fullscreen-button;
     182    display: inline;
     183    border: none;
     184    box-sizing: border-box;
     185    width: 30px;
     186    height: 30px;
     187    line-height: 30px;
     188    margin-left: -5px;
     189    margin-right: 9px;
     190    padding: 0;
     191}

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

    r120337 r120414  
    4747namespace WebCore {
    4848
     49static const double timeWithoutMouseMovementBeforeHidingControls = 2;
     50
    4951MediaControlChromiumEnclosureElement::MediaControlChromiumEnclosureElement(Document* document)
    5052    : HTMLDivElement(HTMLNames::divTag, document->document())
    … …  
    8284#endif
    8385    , m_opaque(true)
     86    , m_hideFullscreenControlsTimer(this, &MediaControlRootElementChromium::hideFullscreenControlsTimerFired)
    8487    , m_isMouseOverControls(false)
     88    , m_isFullscreen(false)
    8589{
    8690}
    … …  
    255259    m_durationDisplay->hide();
    256260    updateTimeDisplay();
     261
     262    if (m_isFullscreen)
     263        startHideFullscreenControlsTimer();
    257264}
    258265
    … …  
    272279    updateTimeDisplay();
    273280    makeOpaque();
     281
     282    stopHideFullscreenControlsTimer();
    274283}
    275284
    … …  
    340349        if (!containsRelatedTarget(event)) {
    341350            m_isMouseOverControls = true;
    342             if (!m_mediaController->canPlay())
     351            if (!m_mediaController->canPlay()) {
    343352                makeOpaque();
     353                if (shouldHideControls())
     354                    startHideFullscreenControlsTimer();
     355            }
    344356        }
    345357    } else if (event->type() == eventNames().mouseoutEvent) {
    346         if (!containsRelatedTarget(event))
     358        if (!containsRelatedTarget(event)) {
    347359            m_isMouseOverControls = false;
     360            stopHideFullscreenControlsTimer();
     361        }
     362    } else if (event->type() == eventNames().mousemoveEvent) {
     363        if (m_isFullscreen) {
     364            // When we get a mouse move in fullscreen mode, show the media controls, and start a timer
     365            // that will hide the media controls after a 2 seconds without a mouse move.
     366            makeOpaque();
     367            if (shouldHideControls())
     368                startHideFullscreenControlsTimer();
     369        }
    348370    }
     371}
     372
     373void MediaControlRootElementChromium::startHideFullscreenControlsTimer()
     374{
     375    if (!m_isFullscreen)
     376        return;
     377
     378    m_hideFullscreenControlsTimer.startOneShot(timeWithoutMouseMovementBeforeHidingControls);
     379}
     380
     381void MediaControlRootElementChromium::hideFullscreenControlsTimerFired(Timer<MediaControlRootElementChromium>*)
     382{
     383    if (m_mediaController->paused())
     384        return;
     385
     386    if (!m_isFullscreen)
     387        return;
     388
     389    if (!shouldHideControls())
     390        return;
     391
     392    makeTransparent();
     393}
     394
     395void MediaControlRootElementChromium::stopHideFullscreenControlsTimer()
     396{
     397    m_hideFullscreenControlsTimer.stop();
    349398}
    350399
    … …  
    370419void MediaControlRootElementChromium::enteredFullscreen()
    371420{
     421    m_isFullscreen = true;
     422    m_fullscreenButton->setIsFullscreen(true);
     423    startHideFullscreenControlsTimer();
    372424}
    373425
    374426void MediaControlRootElementChromium::exitedFullscreen()
    375427{
     428    m_isFullscreen = false;
     429    m_fullscreenButton->setIsFullscreen(false);
     430    stopHideFullscreenControlsTimer();
    376431}
    377432

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

    r120322 r120414  
    127127
    128128    virtual void defaultEventHandler(Event*);
     129    void hideFullscreenControlsTimerFired(Timer<MediaControlRootElementChromium>*);
     130    void startHideFullscreenControlsTimer();
     131    void stopHideFullscreenControlsTimer();
    129132
    130133    virtual const AtomicString& shadowPseudoId() const;
    … …  
    151154
    152155    bool m_opaque;
     156    Timer<MediaControlRootElementChromium> m_hideFullscreenControlsTimer;
    153157    bool m_isMouseOverControls;
     158    bool m_isFullscreen;
    154159};
    155160

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

    r120337 r120414  
    275275        return false;
    276276
    277     DEFINE_STATIC_LOCAL(Image*, mediaFullscreen, (platformResource("mediaFullscreen")));
    278     return paintMediaButton(paintInfo.context, rect, mediaFullscreen);
     277    static Image* mediaFullscreenButton = platformResource("mediaplayerFullscreen");
     278    return paintMediaButton(paintInfo.context, rect, mediaFullscreenButton);
    279279}
    280280

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

    r120322 r120414  
    5959    virtual String formatMediaControlsCurrentTime(float currentTime, float duration) const;
    6060    virtual String formatMediaControlsRemainingTime(float currentTime, float duration) const;
     61    virtual bool paintMediaFullscreenButton(RenderObject*, const PaintInfo&, const IntRect&);
    6162#endif
    6263

  • trunk/Source/WebCore/rendering/RenderThemeChromiumMac.mm

    r120322 r120414  
    239239    return RenderThemeChromiumMac::formatMediaControlsRemainingTime(currentTime, duration);
    240240}
     241
     242bool RenderThemeChromiumMac::paintMediaFullscreenButton(RenderObject* object, const PaintInfo& paintInfo, const IntRect& rect)
     243{
     244    return RenderMediaControlsChromium::paintMediaControlsPart(MediaEnterFullscreenButton, object, paintInfo, rect);
     245}
    241246#endif
    242247

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

    r120322 r120414  
    492492}
    493493
     494bool RenderThemeChromiumSkia::paintMediaFullscreenButton(RenderObject* object, const PaintInfo& paintInfo, const IntRect& rect)
     495{
     496#if ENABLE(VIDEO)
     497    return RenderMediaControlsChromium::paintMediaControlsPart(MediaEnterFullscreenButton, object, paintInfo, rect);
     498#else
     499    UNUSED_PARAM(object);
     500    UNUSED_PARAM(paintInfo);
     501    UNUSED_PARAM(rect);
     502    return false;
     503#endif
     504}
     505
    494506void RenderThemeChromiumSkia::adjustMenuListStyle(StyleResolver*, RenderStyle* style, WebCore::Element*) const
    495507{

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

    r120322 r120414  
    102102        virtual String formatMediaControlsCurrentTime(float currentTime, float duration) const;
    103103        virtual String formatMediaControlsRemainingTime(float currentTime, float duration) const;
     104        virtual bool paintMediaFullscreenButton(RenderObject*, const PaintInfo&, const IntRect&);
    104105
    105106        // MenuList refers to an unstyled menulist (meaning a menulist without

  • trunk/Source/WebKit/chromium/features.gypi

    r120312 r120414  
    162162          'ENABLE_CALENDAR_PICKER=1',
    163163          'ENABLE_FONT_BOOSTING=0',
    164           'ENABLE_FULLSCREEN_MEDIA_CONTROLS=0',
     164          'ENABLE_FULLSCREEN_MEDIA_CONTROLS=1',
    165165          'ENABLE_INPUT_SPEECH=1',
    166166          'ENABLE_JAVASCRIPT_I18N_API=1',
Note: See TracChangeset for help on using the changeset viewer.