From 8873061dffe136cdbf55ab7a6292982dfc02efdb Mon Sep 17 00:00:00 2001
From: Hixie <github.com@spam.hixie.ch>
Date: Mon, 11 May 2015 16:20:20 -0700
Subject: [PATCH] [Effen] Move 'flex' out of CSS also.

This introduces a new kind of ContentNode similar to Style but which
instead of changing the styles that apply to the node, provides new
settings to apply to the "parentData" structure.

If you have better ideas for the class names here let me know.

Note that the layout.dart backend of this is hacky (more so than
before, even); once we have something other than the DOM and CSS to
back it, it'll get rewritten.

R=eseidel@chromium.org

Review URL: https://codereview.chromium.org/1129893006
---
 framework/components/action_bar.dart |  7 ++---
 framework/fn.dart                    | 22 +++++++++++++++-
 framework/layout.dart                | 38 ++++++++++++++++++++++++++--
 3 files changed, 61 insertions(+), 6 deletions(-)

diff --git a/framework/components/action_bar.dart b/framework/components/action_bar.dart
index f874009412c..309fb9b8661 100644
--- a/framework/components/action_bar.dart
+++ b/framework/components/action_bar.dart
@@ -16,8 +16,9 @@ class ActionBar extends Component {
     padding-top: ${kStatusBarHeight}px;''');
 
   static Style _centerStyle = new Style('''
-    padding-left: 24px;
-    flex: 1;''');
+    padding-left: 24px;''');
+
+  static FlexBoxParentData _centerLayoutSettings = new FlexBoxParentData()..flex = 1;
 
   UINode left;
   UINode center;
@@ -31,7 +32,7 @@ class ActionBar extends Component {
   }) : super(key: key);
 
   UINode build() {
-    List<UINode> children = [left, new StyleNode(center, _centerStyle)];
+    List<UINode> children = [left, new StyleNode(new ParentDataNode(center, _centerLayoutSettings), _centerStyle)];
 
     if (right != null)
       children.addAll(right);
diff --git a/framework/fn.dart b/framework/fn.dart
index 1a1118c07e5..29caedab927 100644
--- a/framework/fn.dart
+++ b/framework/fn.dart
@@ -148,6 +148,12 @@ class StyleNode extends ContentNode {
   StyleNode(UINode content, this.style): super(content);
 }
 
+class ParentDataNode extends ContentNode {
+  final ParentData parentData;
+
+  ParentDataNode(UINode content, this.parentData): super(content);
+}
+
 /*
  * SkyNodeWrappers correspond to a desired state of a RenderCSS. They are fully
  * immutable, with one exception: A UINode which is a Component which lives within
@@ -389,14 +395,28 @@ abstract class SkyElementWrapper extends SkyNodeWrapper {
     List<Style> styles = new List<Style>();
     if (style != null)
       styles.add(style);
+    ParentData parentData = null;
     UINode parent = _parent;
     while (parent != null && parent is! SkyNodeWrapper) {
       if (parent is StyleNode && parent.style != null)
         styles.add(parent.style);
+      else
+      if (parent is ParentDataNode && parent.parentData != null) {
+        if (parentData != null)
+          parentData.merge(parent.parentData); // this will throw if the types aren't the same
+        else
+          parentData = parent.parentData;
+      }
       parent = parent._parent;
     }
     _root.updateStyles(styles);
-
+    if (parentData != null) {
+      assert(_root.parentData != null);
+      _root.parentData.merge(parentData); // this will throw if the types aren't approriate
+      assert(parent != null);
+      assert(parent._root != null);
+      parent._root.markNeedsLayout();
+    }
     _root.updateInlineStyle(inlineStyle);
 
     _syncChildren(oldSkyElementWrapper);
diff --git a/framework/layout.dart b/framework/layout.dart
index 5678fd88f35..a17b8220170 100644
--- a/framework/layout.dart
+++ b/framework/layout.dart
@@ -53,6 +53,10 @@ class ParentData {
     detachSiblings();
   }
   void detachSiblings() { } // workaround for lack of inter-class mixins in Dart
+  void merge(ParentData other) {
+    // override this in subclasses to merge in data from other into this
+    assert(other.runtimeType == this.runtimeType);
+  }
 }
 
 abstract class RenderNode extends Node {
@@ -261,8 +265,16 @@ abstract class RenderCSS extends RenderBox {
     return styles.map((s) => s._className).join(' ');
   }
 
+  String _inlineStyles = '';
+  String _additionalStylesFromParent = ''; // used internally to propagate parentData settings to the child
+
   void updateInlineStyle(String newStyle) {
-    _skyElement.setAttribute('style', newStyle);
+    _inlineStyles = newStyle;
+    _updateInlineStyleAttribute();
+  }
+
+  void _updateInlineStyleAttribute() {
+    _skyElement.setAttribute('style', "$_inlineStyles;$_additionalStylesFromParent");
   }
 
   double get width {
@@ -320,7 +332,14 @@ class RenderCSSContainer extends RenderCSS with ContainerRenderNodeMixin<RenderC
 
 }
 
-class FlexBoxParentData extends CSSParentData { }
+class FlexBoxParentData extends CSSParentData {
+  int flex;
+  void merge(FlexBoxParentData other) {
+    if (other.flex != null)
+      flex = other.flex;
+    super.merge(other);
+  }
+}
 
 enum FlexDirection { Row }
 
@@ -351,6 +370,21 @@ class RenderCSSFlex extends RenderCSSContainer {
     return super.stylesToClasses(styles) + ' ' + settings;
   }
 
+  void markNeedsLayout() {
+    super.markNeedsLayout();
+
+    // pretend we did the layout:
+    RenderCSS child = _firstChild;
+    while (child != null) {
+      assert(child.parentData is FlexBoxParentData);
+      if (child.parentData.flex != null) {
+        child._additionalStylesFromParent = 'flex:${child.parentData.flex};';
+        child._updateInlineStyleAttribute();
+      }
+      child = child.parentData.nextSibling;
+    }
+  }
+
 }
 
 class RenderCSSText extends RenderCSS {