Bug 638176 - Make <progress> friendly with -moz-appearance:none and author styling. r=bz

This commit is contained in:
Mounir Lamouri 2011-05-06 12:00:30 +02:00
Родитель d17d6f1f68
Коммит aad2cc1c6e
7 изменённых файлов: 126 добавлений и 4 удалений

Просмотреть файл

@ -137,6 +137,7 @@ nsProgressFrame::AppendAnonymousContentTo(nsBaseContentList& aElements,
} }
NS_QUERYFRAME_HEAD(nsProgressFrame) NS_QUERYFRAME_HEAD(nsProgressFrame)
NS_QUERYFRAME_ENTRY(nsProgressFrame)
NS_QUERYFRAME_ENTRY(nsIAnonymousContentCreator) NS_QUERYFRAME_ENTRY(nsIAnonymousContentCreator)
NS_QUERYFRAME_TAIL_INHERITING(nsHTMLContainerFrame) NS_QUERYFRAME_TAIL_INHERITING(nsHTMLContainerFrame)
@ -213,12 +214,11 @@ nsProgressFrame::ReflowBarFrame(nsIFrame* aBarFrame,
// The bar width is fixed in these cases: // The bar width is fixed in these cases:
// - the progress position is determined: the bar width is fixed according // - the progress position is determined: the bar width is fixed according
// to it's value. // to it's value.
// - the progress position is indeterminate and the bar appearance is the // - the progress position is indeterminate and the bar appearance should be
// native one ('progresschunk'): the bar width is forced to 100%. // shown as native: the bar width is forced to 100%.
// Otherwise (when the progress is indeterminate and the bar appearance isn't // Otherwise (when the progress is indeterminate and the bar appearance isn't
// native), the bar width isn't fixed and can be set by the author. // native), the bar width isn't fixed and can be set by the author.
if (position != -1 || if (position != -1 || ShouldUseNativeStyle()) {
aBarFrame->GetStyleDisplay()->mAppearance == NS_THEME_PROGRESSBAR_CHUNK) {
width -= reflowState.mComputedMargin.LeftRight() + width -= reflowState.mComputedMargin.LeftRight() +
reflowState.mComputedBorderPadding.LeftRight(); reflowState.mComputedBorderPadding.LeftRight();
width = NS_MAX(width, 0); width = NS_MAX(width, 0);
@ -272,3 +272,18 @@ nsProgressFrame::ComputeAutoSize(nsRenderingContext *aRenderingContext,
return autoSize; return autoSize;
} }
bool
nsProgressFrame::ShouldUseNativeStyle() const
{
// Use the native style if these conditions are satisfied:
// - both frames use the native appearance;
// - neither frame has author specified rules setting the border or the
// background.
return GetStyleDisplay()->mAppearance == NS_THEME_PROGRESSBAR &&
mBarDiv->GetPrimaryFrame()->GetStyleDisplay()->mAppearance == NS_THEME_PROGRESSBAR_CHUNK &&
!PresContext()->HasAuthorSpecifiedRules(const_cast<nsProgressFrame*>(this),
NS_AUTHOR_SPECIFIED_BORDER | NS_AUTHOR_SPECIFIED_BACKGROUND) &&
!PresContext()->HasAuthorSpecifiedRules(mBarDiv->GetPrimaryFrame(),
NS_AUTHOR_SPECIFIED_BORDER | NS_AUTHOR_SPECIFIED_BACKGROUND);
}

Просмотреть файл

@ -92,6 +92,11 @@ public:
~(nsIFrame::eReplaced | nsIFrame::eReplacedContainsBlock)); ~(nsIFrame::eReplaced | nsIFrame::eReplacedContainsBlock));
} }
/**
* Returns whether the frame and its child should use the native style.
*/
bool ShouldUseNativeStyle() const;
protected: protected:
// Helper function which reflow the anonymous div frame. // Helper function which reflow the anonymous div frame.
void ReflowBarFrame(nsIFrame* aBarFrame, void ReflowBarFrame(nsIFrame* aBarFrame,

Просмотреть файл

@ -0,0 +1,64 @@
<!DOCTYPE html>
<html>
<style>
div.progress-element {
/**
* The purpose of this test is to not show the native style.
* -moz-appearance: progressbar;
*/
display: inline-block;
height: 1em;
width: 10em;
vertical-align: -0.2em;
/* Default style in case of there is -moz-appearance: none; */
border: 2px solid;
-moz-border-top-colors: ThreeDShadow -moz-Dialog;
-moz-border-right-colors: ThreeDHighlight -moz-Dialog;
-moz-border-bottom-colors: ThreeDHighlight -moz-Dialog;
-moz-border-left-colors: ThreeDShadow -moz-Dialog;
background-color: -moz-Dialog;
}
div.progress-bar {
/**
* The purpose of this test is to not show the native style.
* -moz-appearance: progresschunk;
*/
height: 100%;
width: 100%;
/* Default style in case of there is -moz-appearance: none; */
background-color: ThreeDShadow;
}
div.progress-element { padding: 5px; }
body > div:nth-child(1) { -moz-appearance: none; }
body > div:nth-child(2) > .progress-bar { -moz-appearance: none; }
body > div:nth-child(3) { background-color: red; }
body > div:nth-child(4) > .progress-bar { background-color: red; }
body > div:nth-child(5) { border: 2px solid red; }
body > div:nth-child(6) > .progress-bar { border: 5px solid red; }
</style>
<body>
<div class="progress-element">
<div class="progress-bar"></div>
</div>
<div class="progress-element">
<div class="progress-bar"></div>
</div>
<div class="progress-element">
<div class="progress-bar"></div>
</div>
<div class="progress-element">
<div class="progress-bar"></div>
</div>
<div class="progress-element">
<div class="progress-bar"></div>
</div>
<div class="progress-element">
<div class="progress-bar"></div>
</div>
</body>
</html>

Просмотреть файл

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<style>
progress { padding: 5px }
body > progress:nth-child(1) { -moz-appearance: none; }
body > progress:nth-child(2)::-moz-progress-bar { -moz-appearance: none; }
body > progress:nth-child(3) { background-color: red; }
body > progress:nth-child(4)::-moz-progress-bar { background-color: red; }
body > progress:nth-child(5) { border: 2px solid red; }
body > progress:nth-child(6)::-moz-progress-bar { border: 5px solid red; }
</style>
<body>
<progress></progress>
<progress></progress>
<progress></progress>
<progress></progress>
<progress></progress>
<progress></progress>
</body>
</html>

Просмотреть файл

@ -1 +1,2 @@
skip-if(!cocoaWidget) != 507947.html about:blank skip-if(!cocoaWidget) != 507947.html about:blank
== progressbar-fallback-default-style.html progressbar-fallback-default-style-ref.html

Просмотреть файл

@ -100,6 +100,9 @@ endif
LOCAL_INCLUDES += \ LOCAL_INCLUDES += \
-I$(srcdir)/../$(MOZ_WIDGET_TOOLKIT) \ -I$(srcdir)/../$(MOZ_WIDGET_TOOLKIT) \
-I$(srcdir)/../shared \ -I$(srcdir)/../shared \
-I$(topsrcdir)/layout/forms \
-I$(topsrcdir)/layout/generic \
-I$(topsrcdir)/layout/xul/base/src \
-I$(srcdir) \ -I$(srcdir) \
$(NULL) $(NULL)

Просмотреть файл

@ -51,6 +51,7 @@
#include "nsThemeConstants.h" #include "nsThemeConstants.h"
#include "nsIComponentManager.h" #include "nsIComponentManager.h"
#include "nsPIDOMWindow.h" #include "nsPIDOMWindow.h"
#include "nsProgressFrame.h"
nsNativeTheme::nsNativeTheme() nsNativeTheme::nsNativeTheme()
: mAnimatedContentTimeout(PR_UINT32_MAX) : mAnimatedContentTimeout(PR_UINT32_MAX)
@ -251,6 +252,19 @@ nsNativeTheme::IsWidgetStyled(nsPresContext* aPresContext, nsIFrame* aFrame,
} }
} }
/**
* Progress bar appearance should be the same for the bar and the container
* frame. nsProgressFrame owns the logic and will tell us what we should do.
*/
if (aWidgetType == NS_THEME_PROGRESSBAR_CHUNK ||
aWidgetType == NS_THEME_PROGRESSBAR) {
nsProgressFrame* progressFrame = do_QueryFrame(aWidgetType == NS_THEME_PROGRESSBAR_CHUNK
? aFrame->GetParent() : aFrame);
if (progressFrame) {
return !progressFrame->ShouldUseNativeStyle();
}
}
return (aWidgetType == NS_THEME_BUTTON || return (aWidgetType == NS_THEME_BUTTON ||
aWidgetType == NS_THEME_TEXTFIELD || aWidgetType == NS_THEME_TEXTFIELD ||
aWidgetType == NS_THEME_TEXTFIELD_MULTILINE || aWidgetType == NS_THEME_TEXTFIELD_MULTILINE ||