Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2025-02-13 11:38:16 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 696253, patch 2: implement parsing/computation for CSS property 'order'. r=dbaron

Browse Source
This commit is contained in:
Daniel Holbert 2012-07-06 17:06:19 -07:00
parent e193caf93a
commit 4fe6be60d1
11 changed files with 73 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
dom/interfaces/css/nsIDOMCSS2Properties.idl
View File

@ -762,6 +762,9 @@ interface nsIDOMCSS2Properties : nsISupports
layout engine responds to them. In builds with MOZ_FLEXBOX enabled, this
block should be uncommented (and this interface's uuid should be revved).
(This would be #ifdef MOZ_FLEXBOX, if that worked in IDL files.)
attribute DOMString MozOrder;
// raises(DOMException) on setting
attribute DOMString MozJustifyContent;
// raises(DOMException) on setting
*/

5
layout/base/nsStyleConsts.h
View File

@ -398,6 +398,11 @@ static inline mozilla::css::Side operator++(mozilla::css::Side& side, int) {
#endif // MOZ_FLEXBOX
#ifdef MOZ_FLEXBOX
// See nsStylePosition
// NOTE: This is the initial value of the integer-valued 'order' property
// (rather than an internal numerical representation of some keyword).
#define NS_STYLE_ORDER_INITIAL 0
// See nsStylePosition
#define NS_STYLE_JUSTIFY_CONTENT_FLEX_START 0
#define NS_STYLE_JUSTIFY_CONTENT_FLEX_END 1

10
layout/style/nsCSSPropList.h
View File

@ -1512,6 +1512,16 @@ CSS_PROP_TABLEBORDER(
CSS_PROP_NO_OFFSET,
eStyleAnimType_None)
#ifdef MOZ_FLEXBOX
CSS_PROP_POSITION(
-moz-order,
order,
CSS_PROP_DOMPROP_PREFIXED(Order),
CSS_PROPERTY_PARSE_VALUE,
"",
VARIANT_HI,
nsnull,
offsetof(nsStylePosition, mOrder),
eStyleAnimType_Custom) // <integer>
CSS_PROP_POSITION(
-moz-justify-content,
justify_content,

9
layout/style/nsComputedDOMStyle.cpp
View File

@ -2925,6 +2925,14 @@ nsComputedDOMStyle::DoGetBorderImageRepeat()
}
#ifdef MOZ_FLEXBOX
nsIDOMCSSValue*
nsComputedDOMStyle::DoGetOrder()
{
nsROCSSPrimitiveValue* val = GetROCSSPrimitiveValue();
val->SetNumber(GetStylePosition()->mOrder);
return val;
}
nsIDOMCSSValue*
nsComputedDOMStyle::DoGetJustifyContent()
{
@ -4658,6 +4666,7 @@ nsComputedDOMStyle::GetQueryablePropertyMap(PRUint32* aLength)
COMPUTED_STYLE_MAP_ENTRY(image_region, ImageRegion),
#ifdef MOZ_FLEXBOX
COMPUTED_STYLE_MAP_ENTRY(justify_content, JustifyContent),
COMPUTED_STYLE_MAP_ENTRY(order, Order),
#endif // MOZ_FLEXBOX
COMPUTED_STYLE_MAP_ENTRY(orient, Orient),
COMPUTED_STYLE_MAP_ENTRY_LAYOUT(_moz_outline_radius_bottomLeft, OutlineRadiusBottomLeft),

1
layout/style/nsComputedDOMStyle.h
View File

@ -359,6 +359,7 @@ private:
#ifdef MOZ_FLEXBOX
/* CSS Flexbox properties */
nsIDOMCSSValue* DoGetOrder();
nsIDOMCSSValue* DoGetJustifyContent();
#endif // MOZ_FLEXBOX

6
layout/style/nsRuleNode.cpp
View File

@ -6425,6 +6425,12 @@ nsRuleNode::ComputePositionData(void* aStartStruct,
NS_STYLE_BOX_SIZING_CONTENT, 0, 0, 0, 0);
#ifdef MOZ_FLEXBOX
// order: integer, inherit, initial
SetDiscrete(*aRuleData->ValueForOrder(),
pos->mOrder, canStoreInRuleTree,
SETDSC_INTEGER, parentPos->mOrder,
NS_STYLE_ORDER_INITIAL, 0, 0, 0, 0);
// justify-content: enum, inherit, initial
SetDiscrete(*aRuleData->ValueForJustifyContent(),
pos->mJustifyContent, canStoreInRuleTree,

10
layout/style/nsStyleAnimation.cpp
View File

@ -2553,6 +2553,16 @@ nsStyleAnimation::ExtractComputedValue(nsCSSProperty aProperty,
break;
}
#ifdef MOZ_FLEXBOX
case eCSSProperty_order: {
const nsStylePosition *stylePosition =
static_cast<const nsStylePosition*>(styleStruct);
aComputedValue.SetIntValue(stylePosition->mOrder,
eUnit_Integer);
break;
}
#endif // MOZ_FLEXBOX
case eCSSProperty_text_decoration_color: {
const nsStyleTextReset *styleTextReset =
static_cast<const nsStyleTextReset*>(styleStruct);

9
layout/style/nsStyleStruct.cpp
View File

@ -1127,6 +1127,7 @@ nsStylePosition::nsStylePosition(void)
mBoxSizing = NS_STYLE_BOX_SIZING_CONTENT;
#ifdef MOZ_FLEXBOX
mJustifyContent = NS_STYLE_JUSTIFY_CONTENT_FLEX_START;
mOrder = NS_STYLE_ORDER_INITIAL;
#endif // MOZ_FLEXBOX
mZIndex.SetAutoValue();
}
@ -1153,6 +1154,14 @@ nsChangeHint nsStylePosition::CalcDifference(const nsStylePosition& aOther) cons
}
#ifdef MOZ_FLEXBOX
// Properties that apply to flex items:
// NOTE: Changes to "order" on a flex item may trigger some repositioning.
// If we're in a multi-line flex container, it also may affect our size
// (and that of our container & siblings) by shuffling items between lines.
if (mOrder != aOther.mOrder) {
return NS_CombineHint(hint, nsChangeHint_ReflowFrame);
}
// Properties that apply to flexbox containers:
// Changing justify-content on a flexbox might affect the positioning of its
// children, but it won't affect any sizing.

1
layout/style/nsStyleStruct.h
View File

@ -1095,6 +1095,7 @@ struct nsStylePosition {
PRUint8 mBoxSizing; // [reset] see nsStyleConsts.h
#ifdef MOZ_FLEXBOX
PRUint8 mJustifyContent; // [reset] see nsStyleConsts.h
PRInt32 mOrder; // [reset] integer
#endif // MOZ_FLEXBOX
nsStyleCoord mZIndex; // [reset] integer, auto

8
layout/style/test/property_database.js
View File

@ -738,6 +738,14 @@ var gCSSProperties = {
},
/* XXXdholbert In builds with MOZ_FLEXBOX enabled, this should be uncommented.
(This would be #ifdef MOZ_FLEXBOX, if that worked in JS files.)
"-moz-order": {
domProp: "MozOrder",
inherited: false,
type: CSS_TYPE_LONGHAND,
initial_values: [ "0" ],
other_values: [ "1", "99999", "-1", "-50" ],
invalid_values: [ "0px", "1.0", "1.", "1%", "0.2", "3em", "stretch" ]
},
"-moz-justify-content": {
domProp: "MozJustifyContent",
inherited: false,

16
layout/style/test/test_transitions_per_property.html
View File

@ -115,6 +115,12 @@ var supported_properties = {
// opacity is clamped in computed style
// (not parsing/interpolation)
test_float_zeroToOne_clamped ],
/* XXXdholbert In builds with MOZ_FLEXBOX enabled, this should be uncommented.
(This would be #ifdef MOZ_FLEXBOX, if that worked in JS files.)
"-moz-order": [ test_integer_transition ],
*/
"flood-color": [ test_color_transition ],
"flood-opacity" : [ test_float_zeroToOne_transition,
// opacity is clamped in computed style
@ -233,7 +239,7 @@ var supported_properties = {
test_length_percent_calc_transition,
test_length_clamped, test_percent_clamped ],
"word-spacing": [ test_length_transition, test_length_unclamped ],
"z-index": [ test_zindex_transition, test_pos_integer_or_auto_transition ],
"z-index": [ test_integer_transition, test_pos_integer_or_auto_transition ],
};
var div = document.getElementById("display");
@ -849,7 +855,7 @@ function test_radius_transition(prop) {
div.style.removeProperty("padding");
}
function test_zindex_transition(prop) {
function test_integer_transition(prop) {
div.style.setProperty("-moz-transition-property", "none", "");
div.style.setProperty(prop, "4", "");
is(cs.getPropertyValue(prop), "4",
@ -859,12 +865,12 @@ function test_zindex_transition(prop) {
is(cs.getPropertyValue(prop), "-1",
"integer-valued property " + prop + ": interpolation of integers");
check_distance(prop, "6", "1", "-14");
div.style.setProperty(prop, "auto", "");
is(cs.getPropertyValue(prop), "auto",
"integer-valued property " + prop + ": auto not interpolable");
div.style.setProperty("-moz-transition-property", "none", "");
div.style.setProperty(prop, "-4", "");
is(cs.getPropertyValue(prop), "-4",
"integer-valued property " + prop + ": computed value before transition");
div.style.setProperty("-moz-transition-property", prop, "");
div.style.setProperty(prop, "8", "");
is(cs.getPropertyValue(prop), "-1",
"integer-valued property " + prop + ": interpolation of integers");