new component to make the owner = parent then we can set context, thi…

…s is a hack for react 0.13 , refer to facebook/react#3392

lib/fluxex.js

@@ -3,6 +3,7 @@
 var react = require('react'),
     FluxexObject = require('./fluxobj'),
     FluxexStore = require('./fluxstore'),
+    FluxexHtml = require('./fluxhtml'),
 
 countWeight = function (O, N, names) {
     var weight = 1;
@@ -62,8 +63,11 @@ Object.assign(Fluxex.prototype,
      * @param {Object=} props - properties for HTML
      * @return {element} the HTML react element
      */
-    getHtmlJsx: function (props) {
-        return react.createFactory(require(this.HtmlJsx.replace(/\/\//, './')))(props);
+    getHtmlJsx: function getHtmlJsx () {
+        return react.createFactory(FluxexHtml)({
+            fluxex: this,
+            html: react.createFactory(require(this.HtmlJsx.replace(/\/\//, './')))
+        });
     },
 
     /**
@@ -74,7 +78,7 @@ Object.assign(Fluxex.prototype,
      */
     renderHtml: function (action, payload) {
         return this.executeAction(action, payload).then(function () {
-            return react.renderToString(this.getHtmlJsx({fluxex: this}));
+            return react.renderToString(this.getHtmlJsx());
         }.bind(this));
     },
 
@@ -83,7 +87,7 @@ Object.assign(Fluxex.prototype,
      */
     initClient: function () {
         /*global document*/
-        react.render(this.getHtmlJsx({fluxex: this}), document.body.parentNode.parentNode);
+        react.render(this.getHtmlJsx(), document.body.parentNode.parentNode);
         this.inited = true;
     },
 

lib/fluxcontext.js → lib/fluxhtml.js

@@ -4,28 +4,24 @@
  * @external ReactComponent
  * @see {@link http://facebook.github.io/react/docs/component-api.html}
  */
-var react = require('react'),
+var React = require('react'),
 
-/**
- * A React component mixin to provide Fluxex context container
- * @mixin
- * @mixes external:ReactComponent
- */
-FluxexContextMixin = {
+FluxexHtml = React.createClass({
     /**
      * Define required property for fluxex context receiving
      * @instance
      */
     propTypes: {
-        fluxex: react.PropTypes.object.isRequired
+        fluxex: React.PropTypes.object.isRequired,
+        html: React.PropTypes.func.isRequired
     },
 
     /**
      * Define property for fluxex context delivery
      * @instance
      */
     childContextTypes: {
-        fluxex: react.PropTypes.object.isRequired
+        fluxex: React.PropTypes.object.isRequired
     },
 
     /**
@@ -36,7 +32,14 @@ FluxexContextMixin = {
      */
     getChildContext: function () {
         return {fluxex: this.props.fluxex};
+    },
+
+    /**
+     * Change the owner of all children to self and pass context
+     */
+    render: function () {
+        return this.props.html(this.props);
     }
-};
+});
 
-module.exports = FluxexContextMixin;
+module.exports = FluxexHtml;

lib/fluxmixin.js

@@ -14,6 +14,14 @@ var react = require('react'),
  * @mixes external:ReactComponent
  */
 FluxexMixin = {
+    /**
+     * Define property for fluxex context delivery
+     * @instance
+     */
+    contextTypes: {
+        fluxex: react.PropTypes.object.isRequired
+    },
+
     /**
      * Get the fluxex application. This is internal method for other mixin method, you will not use this directly.
      * @protected