import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
// import {createStore} from 'redux';

// ReactDOM.render(<App />, document.getElementById('app'));

const counter = (state = 0, action) => {
  switch(action.type) {
    case 'INCREMENT':
      return state + 1;
    case 'DECREMENT':
      return state - 1;
    default:
      return state;
  }
}

const createStore = (render) => {
  let state;
  let listeners = [];

  const getState = () => state;

  const   = (action) => {
    state = render(state, action);
    listeners.forEach(listener => listener());
  };

  const subscribe = (listener) => {
    listeners.push(listener);
    return () => {
      listeners = listeners.filter(l => l !== listener);
    }
  };

  dispatch({});

  return {getState, dispatch, subscribe};
}

const store = createStore(counter);

// This is the callback for store
// whenver there is an dispatcher event.
const render = () => {
  document.body.innerText = store.getState();
  if (store.getState() === 10) {
    // Unsubscribe!!
    subsciption();
  }
};

var subsciption = store.subscribe(render);

render();

document.addEventListener('click', () => {
  store.dispatch({type: 'INCREMENT'});
});

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
// import {createStore} from 'redux';

// ReactDOM.render(<App />, document.getElementById('app'));

const counter = (state = 0, action) => {
  switch(action.type) {
    case 'INCREMENT':
      return state + 1;
    case 'DECREMENT':
      return state - 1;
    default:
      return state;
  }
}

const createStore = (render) => {
  let state;
  let listeners = [];

  const getState = () => state;

  const dispatch = (action) => {
    state = render(state, action);
    listeners.forEach(listener => listener());
  };

  const subscribe = (listener) => {
    listeners.push(listener);
    return () => {
      listeners = listeners.filter(l => l !== listener);
    }
  };

  dispatch({});

  return {getState, dispatch, subscribe};
}

const store = createStore(counter);

// This is the callback for store
// whenver there is an dispatcher event.
const render = () => {
  document.body.innerText = store.getState();
  if (store.getState() === 10) {
    // Unsubscribe!!
    subsciption();
  }
};

var subsciption = store.subscribe(render);

render();

document.addEventListener('click', () => {
  store.dispatch({type: 'INCREMENT'});
});

Create our own createStore and fix typo


var VML = require('./vml');
var Canvas = require('./canvas');
//var Flash = require('./flash');

var hasCanvas = function(){

	var canvas = document.createElement('canvas');
	return canvas && !!canvas.getContext;

};

/*
var hasFlash = function(){

	var flash = navigator.plugins && navigator.plugins['Shockwave Flash'];
	try {
		flash = flash ? flash.description :
			new ActiveXObject('ShockwaveFlash.ShockwaveFlash')
			.GetVariable('$version');
	} catch (x){ }
	return flash && flash.match(/\d+/) >= 9;

};
*/

var MODE = hasCanvas() ? Canvas : /*hasFlash() ? Flash :*/ VML;

exports.Surface = MODE.Surface;
exports.Path = MODE.Path;
exports.Shape = MODE.Shape;
exports.Group = MODE.Group;
exports.ClippingRectangle = MODE.ClippingRectangle;
exports.Text = MODE.Text;

require('./current').setCurrent(exports);

var VML = require('./vml');
var Canvas = require('./canvas');
var Base = require('./canvas/base');
//var Flash = require('./flash');

/*
var hasFlash = function(){

	var flash = navigator.plugins && navigator.plugins['Shockwave Flash'];
	try {
		flash = flash ? flash.description :
			new ActiveXObject('ShockwaveFlash.ShockwaveFlash')
			.GetVariable('$version');
	} catch (x){ }
	return flash && flash.match(/\d+/) >= 9;

};
*/

var MODE = Base._genericContext ? Canvas : /*hasFlash() ? Flash :*/ VML;

exports.Surface = MODE.Surface;
exports.Path = MODE.Path;
exports.Shape = MODE.Shape;
exports.Group = MODE.Group;
exports.ClippingRectangle = MODE.ClippingRectangle;
exports.Text = MODE.Text;

require('./current').setCurrent(exports);

Use an existing check for canvas capabilities


module.exports = function(config){
  config.set({

    basePath : '../',

    files : [
      'app/bower_components/angular/angular.js',
      'app/bower_components/angular-route/angular-route.js',
      'app/bower_components/angular-mocks/angular-mocks.js',
      'app/js/**/*.js',
      'test/unit/**/*.js'
    ],

    autoWatch : true,

    frameworks: ['jasmine'],

    browsers : ['PhantomJS'],
    hostname: process.env.IP,
    port: process.env.PORT,

    plugins : [
            'karma-chrome-launcher',
            'karma-firefox-launcher',
            'karma-jasmine',
            'karma-junit-reporter',
            'karma-phantomjs-launcher'
            ],

    junitReporter : {
      outputFile: 'test_out/unit.xml',
      suite: 'unit'
    },

  });
};

module.exports = function(config){
  config.set({

    basePath : '../',

    files : [
      'app/bower_components/angular/angular.js',
      'app/bower_components/angular-route/angular-route.js',
      'app/bower_components/angular-mocks/angular-mocks.js',
      'app/js/**/*.js',
      'test/unit/**/*.js'
    ],

    autoWatch : true,

    frameworks: ['jasmine'],

    browsers : ['PhantomJS'],
    hostname: process.env.IP || 'localhost',
    port: process.env.PORT || '9876',

    plugins : [
            'karma-chrome-launcher',
            'karma-firefox-launcher',
            'karma-jasmine',
            'karma-junit-reporter',
            'karma-phantomjs-launcher'
            ],

    junitReporter : {
      outputFile: 'test_out/unit.xml',
      suite: 'unit'
    },

  });
};

Set defaults for karma server


import React from 'react';
import JSONTree from './JSONTree';

const styles = {
  actionBar: {
    paddingTop: 7,
    paddingBottom: 6,
    paddingLeft: 10,
    marginBottom: 1
  },
  payload: {
    paddingLeft: 15
  }
};

export default class LogMonitorAction extends React.Component {

  renderPayload(payload) {
    return (

        { Object.keys(payload).length > 0 ? <JSONTree theme={this.props.theme} keyName={'action'} data={payload}/> : '' }

    );
  }

  render() {
    const { type, ...payload } = this.props.action;
    return (

{type}

        {!this.props.collapsed ? this.renderPayload(payload) : ''}

    );
  }
}

import React from 'react';
import JSONTree from './JSONTree';

const styles = {
  actionBar: {
    paddingTop: 8,
    paddingBottom: 7,
    paddingLeft: 16
  },
  payload: {
    paddingLeft: 15
  }
};

export default class LogMonitorAction extends React.Component {

  renderPayload(payload) {
    return (

        { Object.keys(payload).length > 0 ? <JSONTree theme={this.props.theme} keyName={'action'} data={payload}/> : '' }

    );
  }

  render() {
    const { type, ...payload } = this.props.action;
    return (

{type}

        {!this.props.collapsed ? this.renderPayload(payload) : ''}

    );
  }
}

Bump padding on section titles