haikuwebkit/LayoutTests/compositing/media-controls-bar-appearan...

48 lines
1.2 KiB
HTML
Raw Permalink Normal View History

Controls panel should have system blurry background https://bugs.webkit.org/show_bug.cgi?id=142154 <rdar://problem/20000964> Reviewed by Simon Fraser. Source/WebCore: In order to replicate the system style of media controls on OS X and iOS, we need to expose a special -webkit-appearance. This patch adds the new property value, and implements the iOS part of the appearance, which is a blurry shaded background. Test: compositing/media-controls-bar-appearance.html * css/CSSPrimitiveValueMappings.h: (WebCore::CSSPrimitiveValue::CSSPrimitiveValue): Map the new keywords from ControlParts. * css/CSSValueKeywords.in: Add media-controls-light-bar-background and media-controls-dark-bar-background. Darin suggested they be sorted, so I did this at the same time. * platform/ThemeTypes.h: New ControlParts for the values, and sort the values since they need to be in sync with CSSValueKeywords.in. * platform/graphics/GraphicsLayer.h: Expose two new custom appearance values. * platform/graphics/ca/GraphicsLayerCA.cpp: (WebCore::GraphicsLayerCA::GraphicsLayerCA): (WebCore::layerTypeForCustomBackdropAppearance): Helper function. (WebCore::isCustomBackdropLayerType): Ditto. (WebCore::GraphicsLayerCA::commitLayerChangesBeforeSublayers): Merge setting a system backdrop layer in with the code that swaps to/from tiled layers. (WebCore::GraphicsLayerCA::changeLayerTypeTo): New method that does what swapFromOrToTiledLayer implemented, but also allows us to change to a system backdrop layer. (WebCore::GraphicsLayerCA::swapFromOrToTiledLayer): Deleted. * platform/graphics/ca/GraphicsLayerCA.h: * platform/graphics/ca/PlatformCALayer.h: New layer types. * platform/graphics/ca/mac/PlatformCALayerMac.mm: For now expose these as regular backdrop layers. (PlatformCALayerMac::PlatformCALayerMac): (PlatformCALayerMac::updateCustomAppearance): * rendering/RenderLayerBacking.cpp: (WebCore::RenderLayerBacking::createPrimaryGraphicsLayer): Make sure to update custom appearance, (WebCore::RenderLayerBacking::updateCustomAppearance): New method. * rendering/RenderLayerBacking.h: Source/WebKit2: In order to replicate the system style of media controls on OS X and iOS, we need to expose a special -webkit-appearance. This patch adds the new property value, and implements the iOS part of the appearance, which is a blurry shaded background. * Shared/mac/RemoteLayerBackingStore.mm: (WebKit::RemoteLayerBackingStore::drawInContext): Add entries for the new layer types, even though they are not correct yet. * Shared/mac/RemoteLayerTreePropertyApplier.mm: (WebKit::updateCustomAppearance): (WebKit::RemoteLayerTreePropertyApplier::applyProperties): UIBackdropViews have a defined hierarchy that we don't create. We need to make sure we add our children to the right subview. * Shared/mac/RemoteLayerTreeTransaction.mm: (WebKit::RemoteLayerTreeTransaction::description): Logging. * UIProcess/ios/RemoteLayerTreeHostIOS.mm: Rename existing WKBackdropView to WKSimpleBackdropView, and add a new WKBackdropView that inherits from UIBackdropView. (-[WKBackdropView hitTest:withEvent:]): (-[WKBackdropView description]): (WebKit::RemoteLayerTreeHost::createLayer): Handle the new LayerTypes. * UIProcess/mac/RemoteLayerTreeHost.mm: (WebKit::RemoteLayerTreeHost::createLayer): LayoutTests: Make sure content with a -webkit-appearance of media-controls-light-bar-background or media-controls-dark-bar-background doesn't get composited unless explicitly requested. This avoids a performance hit for a rarely used feature. * compositing/media-controls-bar-appearance-expected.txt: Added. * compositing/media-controls-bar-appearance.html: Added. Canonical link: https://commits.webkit.org/160289@main git-svn-id: https://svn.webkit.org/repository/webkit/trunk@180965 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2015-03-04 00:39:36 +00:00
<!DOCTYPE html>
<html>
<head>
<style>
div {
position: relative;
height: 100px;
width: 100px;
}
.media-controls-dark {
-webkit-appearance: media-controls-dark-bar-background;
}
.media-controls-light {
-webkit-appearance: media-controls-light-bar-background;
}
.with-layer {
-webkit-transform: translate3d(0, 0, 0);
}
</style>
<script>
if (window.testRunner)
testRunner.dumpAsText();
function dumpLayers()
{
var layersResult = document.getElementById('layers');
if (window.testRunner)
layersResult.innerText = window.internals.layerTreeAsText(document);
}
window.addEventListener('load', dumpLayers, false)
</script>
</head>
<body>
<p>These elements should not get their own layers.</p>
<div class="media-controls-dark">
</div>
<div class="media-controls-light">
</div>
<p>These elements explicitly request layers.</p>
<div class="media-controls-dark with-layer">
</div>
<div class="media-controls-light with-layer">
</div>
<pre id="layers"></pre>
</body>
</html>