Untitled

<!DOCTYPE html>
<html>

<head>
  <link href="//cdn.jsdelivr.net/picnicss/4.1.1/picnic.min.css" rel="stylesheet">
  <style>
    li:empty {
      list-style-type: none;
    }
  </style>
</head>

<body>

  <h1>Hello Mag.JS - Redux remote!</h1>
  <a target="_tab" href="https://github.com/magnumjs/mag.js">GitHub</a>
  <hr/>

  <div id="test">
    <p>
      <button></button>
    </p>
  </div>

  <script src="//rawgit.com/magnumjs/mag.js/master/dist/mag.0.21.3.min.js"></script>
  <script src="//rawgit.com/magnumjs/mag.js/master/dist/mag.addons.0.21.min.js"></script>
  <script src="//rawgit.com/magnumjs/mag.js/master/src/addons/redux.js"></script>
  <script src="//rawgit.com/magnumjs/mag.js/master/src/addons/redux-middleware.js"></script>

  <script src="script.js"></script>
</body>

</html>


var storeCreator = Redux.applyMiddleware(Redux.middle.logger)(Redux.createStore);

var store = storeCreator(function(state, action) {
  if (!state) {
    return {
      text: "ZZZ"
    };
  }

  switch (action.type) {
    case "TEXT_CHANGE":
      return Object.assign({}, state, {
        text: action.text
      });

    default:
      return state;
  }
});

var mod = mag.module('test', {
  controller: function() {
    var clickText = function(e) {
      e.preventDefault();

      store.dispatch({
        type: "TEXT_CHANGE",
        text: "It's currently: " + (new Date()).toTimeString()
      });
    };

    this.button = {
      _onclick: clickText,
      _text: "What time is it?"
    }
  },

  view: function(state) {
    var stately = store.getState();
    state.p = stately.text
  }
});

store.subscribe(function() {
  mod.draw()
});