How to use the fluxxor.FluxMixin function in fluxxor

To help you get started, we’ve selected a few fluxxor examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github stayradiated / rango / admin / lib / components / editorContent.jsx View on Github external
'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,
  },
github reapp / reapp-ui / repo_modules / brawndo / index.js View on Github external
init(React) {
    initActions();
    Flux = new Fluxxor.Flux(_stores, _actions);
    Brawndo.StoreLoader = StoreLoader.init(Flux);
    Brawndo.FluxMixin = Fluxxor.FluxMixin(React);
    exposeToBrowser(Flux);
    return Flux;
  }
};
github stayradiated / rango / admin / lib / components / header.jsx View on Github external
'use strict';

var React           = require('react');
var PureRenderMixin = require('react/addons').addons.PureRenderMixin;
var Fluxxor         = require('fluxxor');
var FluxMixin       = Fluxxor.FluxMixin(React);

var Header = React.createClass({
  mixins: [
    FluxMixin,
    PureRenderMixin,
  ],
  
  propTypes: {
    app: React.PropTypes.object.isRequired,
    editor: React.PropTypes.object.isRequired,
    browser: React.PropTypes.object.isRequired,
  },

  render: function () {
    return (
      <header></header>
github stayradiated / rango / admin / lib / components / app.jsx View on Github external
'use strict';

var React           = require('react');
var Fluxxor         = require('fluxxor');
var FluxMixin       = Fluxxor.FluxMixin(React);
var StoreWatchMixin = Fluxxor.StoreWatchMixin;

var Header    = require('./header');
var Browser   = require('./browser');
var Editor    = require('./editor');

var App = React.createClass({
  mixins: [
    FluxMixin,
    StoreWatchMixin('App', 'Browser', 'Editor'),
  ],

  getStateFromFlux: function () {
    var flux = this.getFlux();
    return {
      app: flux.store('App').state,
github larrymyers / react-mini-router / example / app / components / createtodolist.jsx View on Github external
var React = require('react'),
    Fluxxor = require('fluxxor');

var CreateTodoList = React.createClass({

    mixins: [Fluxxor.FluxMixin(React)],

    render: function() {
        return (
            <form>
                <input>
                <button type="submit">Create New List</button>
            </form>
        );
    },

    createList: function(evt) {
        evt.preventDefault();

        var input = this.refs.listName,
            listName = input.value;
github larrymyers / react-mini-router / example / app / components / todoform.jsx View on Github external
var React = require('react'),
    navigate = require('./../../../lib/navigate'),
    Fluxxor = require('fluxxor');

var TodoForm = React.createClass({

    mixins: [Fluxxor.FluxMixin(React)],

    componentDidMount: function() {
        this.componentDidUpdate();
    },

    componentDidUpdate: function() {
        this.refs.textInput.focus();
    },

    render: function() {
        return (
            <form>
                <input placeholder="Enter Task" type="text">
                <button type="submit">Save</button>
            </form>
        );
github larrymyers / react-mini-router / example / app / components / todolist.jsx View on Github external
var React = require('react'),
    Fluxxor = require('fluxxor'),
    RouterMixin = require('./../../../lib/RouterMixin'),
    CreateTodo = require('./createtodo'),
    _find = require('lodash/collection/find'),
    _map = require('lodash/collection/map');

var TodoList = React.createClass({

	mixins: [RouterMixin, Fluxxor.FluxMixin(React)],

	routes: {
		'/': 'showAll',
		'/edit/:id': 'showAll'
	},

    render: function () {
	    var list = this.props.list;

        return (
	        <div>
		        <h2>{list.name}</h2>
	            {this.renderCurrentRoute()}
                <footer>
                    <a href="/">Back to All Lists</a>
                </footer></div>
github larrymyers / react-mini-router / example / app / components / createtodo.jsx View on Github external
var React = require('react'),
    Fluxxor = require('fluxxor');

var CreateTodo = React.createClass({

    mixins: [Fluxxor.FluxMixin(React)],

    render: function() {
        return (
            <form>
                <input>
                <button type="submit">Save</button>
            </form>
        );
    },

    createTodo: function(evt) {
        evt.preventDefault();

        var input = this.refs.text,
            text = input.value;
github ToneDen / Player / sdk / js / player / components / themes / common / PlaybackButtons.jsx View on Github external
var Fluxxor = require('fluxxor');
var React = require('react');

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

var PlaybackButtons = React.createClass({
    mixins: [
        Fluxxor.FluxMixin(React),
        require('../../mixins/PlayerControls')
    ],
    getDefaultProps: function() {
        return {
            showNextAndPrevious: true
        };
    },
    render: function() {
        var playButtonClass;

        if(this.props.player.getIn(['nowPlaying', 'playing'])) {
            playButtonClass = 'tdicon-pause-circle-outline player-play play';
        } else {
            playButtonClass = 'tdicon-play-circle-outline player-play play';
        }

fluxxor

Flux architecture tools for React

MIT
Latest version published 9 years ago

Package Health Score

42 / 100
Full package analysis

Popular fluxxor functions