/* MagJS Example - Boilerplate v0.23 - Random Message components */

​

​

//From: http://www.sitepoint.com/getting-started-react-jsx/

​

//Html fixture for isolated dynamic dom generation

var fixture = 'div MessageView + p input[type="button"][value="Change Message"]';

​

var RandomMessage = mag.create(affix(fixture), {

  controller: function(props) {

​

    props.message = 'Hello, Universe';

​

    props.onClick = function() {

      var messages = ['Hello, World', 'Hello, Planet', 'Hello, Universe'];

      var randomMessage = messages[Math.floor((Math.random() * 3))];

​

      props.message = randomMessage;

    };

  },

  view: function(state, props) {

    state.MessageView = MessageView({

      message: props.message

    });

    state.input = {

      _onClick: props.onClick

    };

  }

});

​

//Dummy component:

var MessageView = mag.create(affix('div p'), {

  view: function(state, props) {

    state.p = props.message;

  }

});

​

//Mount:

mag.module(document.body, {

  view: function(state) {

    state.div = RandomMessage();

  }

});