How to use fluxxor - 10 common examples

'use strict';

var React           = require('react');
var Fluxxor         = require('fluxxor');
var FluxMixin       = Fluxxor.FluxMixin(React);
var PureRenderMixin = require('react/addons').addons.PureRenderMixin;
var CodeMirror      = require('react-code-mirror');
var Marked          = require('marked');

// load markdown syntax for codemirror
require('codemirror/mode/markdown/markdown');

var EditorContent = React.createClass({
  mixins: [
    FluxMixin,
    PureRenderMixin
  ],

  propTypes: {
    content: React.PropTypes.string.isRequired,
  },

m = matrix.multiply(translateMatrix, m);
  return valuesFromMatrix(m);
};

var getCropOverflow = function(media, anchorX, anchorY, values) {
  // Sometimes we scale too far, so work out the scale necessary to fix it.
  var x1 = values.x1 < 0 ? -values.x1 / (anchorX - values.x1) : 0;
  var y1 = values.y1 < 0 ? -values.y1 / (anchorY - values.y1): 0;
  var x2 = values.x2 > media.get('width') ? (values.x2 - media.get('width')) / (values.x2 - anchorX) : 0;
  var y2 = values.y2 > media.get('height') ? (values.y2 - media.get('height')) / (values.y2 - anchorY) : 0;

  return {x1, y1, x2, y2, reverseScale: 1 - Math.max(x1, y1, x2, y2)};
};


var CropStore = Fluxxor.createStore({
  initialize: function(options) {
    this.bindActions(
      constants.CATEGORY_SELECTED, this.onCategorySelect,
      constants.MEDIA_SELECTED, this.onMediaSelect,
      constants.CROP_GET_START, this.onCropGetStart,
      constants.CROP_GET_SUCCESS, this.onCropGetSuccess,
      constants.CROP_SELECTED, this.onCropSelect,
      constants.CROP_DESELECTED, this.onCropDeselect,
      constants.CROP_MOVE, this.onCropMove,
      constants.CROP_RESIZE, this.onCropResize,
      constants.CROP_ADD, this.onCropAdd,
      constants.CROP_SAVE_START, this.onSaveStart,
      constants.CROP_SAVE_SUCCESS, this.onSaveSuccess,
      constants.CROP_PICK_START, this.onPickStart,
      constants.CROP_PICK_SUCCESS, this.onPickSuccess    
    );

define(function (require, exports) {
    "use strict";

    var Fluxxor = require("fluxxor");

    var FluxController = require("js/fluxcontroller");

    var _dispatch = function (type, payload) {
        this.dispatcher.dispatch({ type: type, payload: payload });
    };

    var _bindTestActions = function () {
        this.bindActions.apply(this, arguments);
    };

    var TestStore = Fluxxor.createStore({});

    var setup = function () {
        var testStore = new TestStore(),
            testStores = { test: testStore },
            controller = new FluxController(testStores),
            flux = controller.flux;

        this.flux = flux;
        this.dispatch = _dispatch.bind(flux);
        this.bindTestAction = this.bindTestActions = _bindTestActions.bind(testStore);
    };

    exports.setup = setup;
});

constructor() {
        this.v = Fluxxor.FluxMixin(React);
    }

);
	},

	onLoadMenuExclusions() {
		this.loading = true;
		this.emit('change');
	},

	onLoadMenuExclusionsComplete(payload) {
		this.loading = false;
		this.exclusions = payload.exclusions;
		this.emit('change');
	}
});

var MenuStore = Fluxxor.createStore({
	initialize() {
		this.litefare = [];
		this.entree = [];
		this._exclusions = [];
		this._collection = [];
		this._games = [];
		this._rnd = seedrandom(moment().format('YYYY-MM-DD'));
		this.bindActions(
			constants.LoadMenuExclusionsComplete, this.onLoadMenuExclusionsComplete,
			constants.LoadCollectionComplete, this.onLoadCollectionComplete,
			constants.ReseedMenu, this.onReseedMenu
		);
	},

	onLoadCollectionComplete(payload) {
		this.waitFor(['CollectionStore'], collectionStore => {

init(React) {
    initActions();
    Flux = new Fluxxor.Flux(_stores, _actions);
    Brawndo.StoreLoader = StoreLoader.init(Flux);
    Brawndo.FluxMixin = Fluxxor.FluxMixin(React);
    exposeToBrowser(Flux);
    return Flux;
  }
};

var Fluxxor = require('fluxxor');
var constants = require('../constants/Constants');

/**
* Store
*/
var DevicesStore = Fluxxor.createStore({
  initialize: function() {
    this.data = [];

    this.bindActions(
      constants.LOAD_DEVICES, this.onLoad,
      constants.LOAD_DEVICES_SUCCESS, this.onLoadSuccess
    );
  },
  onLoad: function() {
    this.loading = true;
    this.emit("change");
  },
  onLoadSuccess: function(result) {
    this.loading = false;
    this.error = null;

 "use strict";

var Fluxxor = require('fluxxor');
var Immutable = require('immutable');

var constants = require('../constants');


var DraggingStore = Fluxxor.createStore({
  initialize: function(options) {
    this.bindActions(
      constants.DRAG_MEDIA_START, this.onDragMediaStart,
      constants.DRAG_MEDIA_MOVE, this.onDragMediaMove,
      constants.DRAG_MEDIA_END, this.onDragMediaStartEnd 
    );

    this.setMaxListeners(0);    
    this.state = Immutable.fromJS(options);
  },

  onDragMediaStart: function(payload) {
    this.state = this.state.withMutations(function(state) {
      state.set('top', payload.y).set('left', payload.x).set('draggingMedia', payload.media);
    });
    this.emit('change');

var hoodie = new global.Hoodie();
var React = require('react');
var Fluxxor = require('fluxxor');

var constants = {
  LOAD: 'LOAD',
  LOAD_SUCCESS: 'LOAD_SUCCESS',
  LOAD_ERROR: 'LOAD_ERROR',
  ADD_TODO: 'ADD_TODO',
  TOGGLE_TODO: 'TOGGLE_TODO',
  CLEAR_TODOS: 'CLEAR_TODOS'
};

var TodoStore = Fluxxor.createStore({
  initialize: function () {
    this.loading = false;
    this.error = null;
    this.todos = [];

    this.bindActions(
      constants.LOAD, this.onLoad,
      constants.LOAD_SUCCESS, this.onLoadSuccess,
      constants.LOAD_ERROR, this.onLoadError,
      constants.ADD_TODO, this.onAddTodo,
      constants.TOGGLE_TODO, this.onToggleTodo,
      constants.CLEAR_TODOS, this.onClearTodos
    );
  },

  onLoad: function (payload) {

this.replaceState = newState => {
      this.state = newState;
      return this;
    };

    this.setPayload = newPayload => {
      this.payload = newPayload;
      return this;
    };

    mixinInitializers.forEach(initializer => initializer.call(this));
    this.bindActions(fluxxorActions);
  };

  var FluxxorStore = Fluxxor.createStore(Store);
  this.addStore(name, new FluxxorStore());
};