1 files changed, 22 insertions, 240 deletions

diff --git a/node_modules/montage/ui/slot.reel/slot.js b/node_modules/montage/ui/slot.reel/slot.js
index 41220373..9d7ceb6f 100755
--- a/node_modules/montage/ui/slot.reel/slot.js
+++ b/node_modules/montage/ui/slot.reel/slot.js
@@ -14,12 +14,13 @@ var Montage = require("montage").Montage,
  @class module:"montage/ui/slot.reel".Slot
  @extends module:montage/ui/component.Component
  */
-var Slot = exports.Slot = Montage.create(Component, /** @lends module:"montage/ui/slot.reel".Slot# */ {
+exports.Slot = Montage.create(Component, /** @lends module:"montage/ui/slot.reel".Slot# */ {
 
     hasTemplate: {
         enumerable: false,
         value: false
     },
+
 /**
         Description TODO
         @type {Property}
@@ -30,47 +31,7 @@ var Slot = exports.Slot = Montage.create(Component, /** @lends module:"montage/u
         value: null,
         serializable: true
     },
-/**
-        Description TODO
-        @type {Property}
-        @default null
-    */
-    transition: {
-        enumerable: false,
-        value: null
-    },
-/**
-  Description TODO
-  @private
-*/
-    _content: {
-        enumerable: false,
-        value: null
-    },
-/**
-  Description TODO
-  @private
-*/
-    _contentToRemove: {
-        enumerable: false,
-        value: null
-    },
-/**
-  Description TODO
-  @private
-*/
-    _contentToAppend: {
-        enumerable: false,
-        value: null
-    },
-/**
-  Description TODO
-  @private
-*/
-    _contentHasChanged: {
-        enumerable: false,
-        value: true
-    },
+
 /**
         Description TODO
         @type {Function}
@@ -79,222 +40,43 @@ var Slot = exports.Slot = Montage.create(Component, /** @lends module:"montage/u
     content: {
         enumerable: false,
         get: function() {
-            return this._content;
+            return Object.getPropertyDescriptor(Component, "domContent").get.call(this);
         },
         set: function(value) {
-
-            // if no change or busy drawing a switch, ignore this "new" value
-            if ((!!value && this._content === value)|| (!!this._contentToAppend && value === this._contentToAppend) || this._isSwitchingContent) {
-                return;
-            }
-
-            if (this._contentToAppend) {
-                // If we already had some content that was going to be appended, don't bother with it
-                // the new value we just received will supercede it
-                this._contentToAppend.needsDraw = false;
-                this._drawList = [];
-            }
-
-            // TODO if given a serialized component or something (a template) we should be able to handle that
-
-            this._contentToAppend = value;
-
-            if (this._contentToAppend && typeof this._contentToAppend.needsDraw !== "undefined") {
-
+            var element;
+            if (value && typeof value.needsDraw !== "undefined") {
                 // If the incoming content was a component; make sure it has an element before we say it needs to draw
-                if (!this._contentToAppend.element) {
-                    var nodeToAppend = document.createElement("div");
-                    nodeToAppend.id = "appendDiv";
+                if (!value.element) {
+                    element = document.createElement("div");
+                    element.id = "appendDiv"; // TODO: This should be uniquely generated
 
                     if (this.delegate && typeof this.delegate.slotElementForComponent === "function") {
-                        nodeToAppend = this.delegate.slotElementForComponent(this, this._contentToAppend, nodeToAppend);
+                        element = this.delegate.slotElementForComponent(this, value, element);
                     }
-                    this._contentToAppend.setElementWithParentComponent(nodeToAppend, this);
                 } else {
-                    this._contentToAppend.setElementWithParentComponent(this._contentToAppend.element, this);
+                    element = value.element;
                 }
-
                 // The child component will need to draw; this may trigger a draw for the slot itself
-                this._contentToAppend.needsDraw = true;
+                Object.getPropertyDescriptor(Component, "domContent").set.call(this, element);
+                value.setElementWithParentComponent(element, this);
+                value.needsDraw = true;
+            } else {
+                Object.getPropertyDescriptor(Component, "domContent").set.call(this, value);
             }
-
             this.needsDraw = true;
-            this._contentToRemove = this._content;
-            this._contentHasChanged = true;
-
-            return value;
-        }
-    },
-/**
-  Description TODO
-  @private
-*/
-    _isSwitchingContent: {
-        enumerable: false,
-        value: false
-    },
-
-    childComponentWillPrepareForDraw: {
-        value: function(child) {
-            if (child.element.parentElement == null) {
-                // by the time a child component lets us know it's about to prepare to draw for the first time
-                // we know we need to append its element to our own element.
-                this._element.appendChild(child.element);
-                this.needsDraw = true;
-            }
         }
     },
 
-    _canAppendContent: {
-        enumerable: false,
-        value: false
-    },
-
-    canDraw: {
-        value: function() {
-
-            if (this._contentToAppend) {
-                if (typeof this._contentToAppend.needsDraw !== "undefined") {
-                    this._canAppendContent = this._contentToAppend.canDraw();
-                    if (this._canAppendContent) {
-                        this.needsDraw = true;
-                    }
-                } else {
-                    this._canAppendContent = true;
-                }
-            } else {
-                // No content to append, but we can render that situation (empty out the slot)
-                this._canAppendContent = true;
-            }
-
-            // We'll always offer to draw if asked to allow children to draw, but what the slot does when it draws
-            // will depend on the _canAppendContent flag determined at this point
-            return true;
-        }
-    },
 /**
-    Description TODO
-    @function
+        Description TODO
+        @type {Function}
+        @default null
     */
-    draw: {
-        value: function() {
-
-
-            if (!this._canAppendContent) {
-                return;
-            }
-
-            // Prevent other switching while we're in the middle of rendering this current switch
-            this._isSwitchingContent = true;
-
-            var nodeToAppend, nodeToRemove, rangeToRemove;
-
-            // If there's no content currently inside the slot we need to have one for transition support which expects
-            // a start and an end node; but we want to make sure the node is included in the rangeToRemove
-            if (this._contentToRemove) {
-                if (this._contentToRemove.nodeType) {
-                    // The content is a node itself; use this node
-                    nodeToRemove = this._contentToRemove;
-                } else if (this._contentToRemove.element) {
-                    // The content has an element property set; use the element
-                    nodeToRemove = this._contentToRemove.element;
-                }
-            } else {
-                if (this.transition) {
-                    nodeToRemove = document.createElement("div");
-                    nodeToRemove.id = "removeDiv";
-                    // Since we're trying to remove this node it's expected to be in the slot already; put it there
+    contentDidChange: {
+        value: function(newContent, oldContent) {