if (process.env.NODE_ENV !== 'production') {
require('../dev-jquery-auth.js');
}
// Third party
import 'babel-polyfill';
import React from 'react';
import ReactDOM from 'react-dom';
import log from 'loglevel';
import appStoreStore from './stores/appStore.store';
import installedAppStore from './stores/installedApp.store';
import actions from './actions';
import injectTapEventPlugin from 'react-tap-event-plugin'; injectTapEventPlugin();
// D2 / D2-UI
import D2Library from 'd2/lib/d2';
import LoadingMask from 'd2-ui/lib/loading-mask/LoadingMask.component';
// Components
import App from './components/App.component';
require('../scss/style.scss');
log.setLevel(process.env.NODE_ENV === 'production' ? log.levels.WARN : log.levels.TRACE);
D2Library.getManifest(process.env.NODE_ENV === 'production' ? 'manifest.webapp' : 'dev_manifest.webapp')
.then(manifest => {
D2Library.config.baseUrl = `${manifest.getBaseUrl()}/api`;
constructor(props) {
super(props);
injectTapEventPlugin();
this.state = {}
}
import PropTypes from 'prop-types';
import getMuiTheme from 'material-ui/styles/getMuiTheme';
import lightBaseTheme from 'material-ui/styles/baseThemes/lightBaseTheme';
import tapEventPlugin from 'react-tap-event-plugin';
import randomIds from 'uniforms/randomIds';
import createSchema from './_createSchema';
tapEventPlugin();
const randomId = randomIds();
const createContext = (schema, context) => ({
context: {
muiTheme: getMuiTheme(lightBaseTheme, {userAgent: false}),
uniforms: {
error: null,
model: {},
name: [],
onChange () {},
...context,
randomId,
schema: createSchema(schema),
state: {
changedMap: {},
changed: false,
disabled: false,
// // compare: compareReducer
// // // routing: routeReducer
// // });
// const reducer = combineReducers(_.merge(reducers, appReducers));
// // console.log(reducer);
// // const reduxRouterMiddleware = syncHistory(history);
// const createStoreWithMiddleware = applyMiddleware(sagaMiddleware(sagas))(createStore);
// const store = createStoreWithMiddleware(reducer, window.__INITIAL_STATE__);
const store = getStore(window.__INITIAL_STATE__);
// console.log(store);
if (!window.env || window.env === 'development') {
// store.dispatch(bootstrapAction());
}
ReactTapEventPlugin();
render(
<Provider store={ store }>
<Router routes={ routes } history={ history } />
</Provider>,
document.getElementById('react-root')
);
defonce(module, () => {
const injectTapEventPlugin = require('react-tap-event-plugin');
injectTapEventPlugin();
});
import React from 'react';
import { Component } from 'react';
import injectTapEventPlugin from 'react-tap-event-plugin';
injectTapEventPlugin(); // For Material-ui touch events
export default class App extends Component {
render() {
return (
<div className="container">
{this.props.children}
</div>
);
}
}
componentDidMount: function() {
injectTapEventPlugin();
},
window.init = function() {
var token = localStorage.getItem('token');
setInterval(function() {
token = localStorage.getItem('token');
} , 1000);
var React = require('react'),
superagent = require('superagent'),
AppHeader = require('./AppHeader.jsx'),
AppFooter = require('./AppFooter.jsx'),
AppBody = require('./AppBody.jsx'),
injectTapEventPlugin = require("react-tap-event-plugin");
injectTapEventPlugin();
function getSongData(callback) {
superagent
.get('/api/musicList')
.query({token : token})
.end(function(err, res) {
if (err) throw new Error(err);
var sykoFolder = JSON.parse(res.text).folder;
var songList = JSON.parse(res.text).songs;
var playlist = {}, songCount;
for (songCount = 0; songCount < songList.length; songCount++) {
playlist[songList[songCount].id] = songList[songCount].src;
}
callback(songList, playlist, songCount, sykoFolder);
});
}
var Syko = React.createClass({
getInitialState: function() {
return {
currentSong: null,
currentSongId: null,
data: [],
playlist: [],
shuffle: false,
folder: null,
repeat: 'continuous',
resetPlayer: false,
songPosition: 0,
uploadProgress: 0,
repeatSong: false,
songCount: 0
};
},
componentDidMount: function() {
var that = this;
getSongData(function(data, playlist, songCount, sykoFolder) {
that.setState({
data: data,
playlist: playlist,
songCount: songCount,
folder: JSON.stringify(sykoFolder)
});
});
},
resetPlayerComplete: function() {
this.setState({
resetPlayer: false
});
},
pollPosition: function(currentTime) {
this.currentTime = currentTime;
},
toggleShuffle: function() {
this.setState({shuffle: !this.state.shuffle});
},
shufflePlay: function() {
function shuffle(min, max) {
return Math.floor((Math.random() * max) + min);
}
var nextSongId = shuffle(0, this.state.songCount);
if(this.state.currentSongId == nextSongId)
return this.shufflePlay();
this.playSong(nextSongId);
},
changeRepeatMode: function() {
if(this.state.repeat === 'continuous')
return this.setState({repeat: 'single'});
if(this.state.repeat === 'single')
return this.setState({repeat: 'none'});
return this.setState({repeat: 'continuous'});
},
playSong: function(songId) {
if (songId == this.state.currentSongId) {
this.setState({currentSong: this.state.playlist[songId], repeatSong: true});
this.setState({repeatSong: false});
}
this.setState({currentSong: this.state.playlist[songId], currentSongId: songId});
},
playNextSong: function() {
if(this.state.repeat === 'single')
return this.playSong(this.state.currentSongId);
if (this.state.shuffle)
return this.shufflePlay();
if(this.state.currentSongId < (this.state.songCount-1))
return this.playSong(parseInt(this.state.currentSongId)+1);
if(this.state.repeat === 'none')
return this.setState({currentSongId: null, resetPlayer: true});
this.playSong(0);
},
playPrevSong: function() {
if(this.currentTime > 10 || this.state.repeat === 'single')
return this.playSong(this.state.currentSongId);
if (this.state.shuffle)
return this.shufflePlay();
if(this.state.currentSongId > 0)
return this.playSong(parseInt(this.state.currentSongId)-1);
if(this.state.repeat === 'none')
return this.playSong(0);
this.playSong(this.state.songCount-1);
},
handleUpload: function(uploadEl) {
var that = this;
superagent
.post('/api/audio')
.field('token', token)
.field('filename', uploadEl.files[0].name)
.field('folder', this.state.folder)
.attach('file', uploadEl.files[0], uploadEl.files[0].name)
.on('progress', function(e) {
that.setState({uploadProgress: Math.floor(e.percent)});
})
.end(function(err, res){
if (err) throw new Error(err);
that.setState({uploadProgress: 'done'});
getSongData(function(data, playlist) {
that.setState({data: data, playlist: playlist});
});
});
},
handleDelete: function(fileId) {
var that = this;
superagent
.post('/api/delete')
.query({token : token})
.query({deleteId: fileId})
.end(function(err, res) {
if (err) throw new Error(err);
getSongData(function(data, playlist) {
that.setState({data: data, playlist: playlist});
});
});
},
render: function() {
return (
<div>
<AppHeader title="Syko"
handleTouch={this.handleTouch}
handleUpload={this.handleUpload}
uploadProgress={this.state.uploadProgress} />
<AppBody
data={this.state.data}
playSong={this.playSong}
currentSongId={this.state.currentSongId}
resetPlayer={this.state.resetPlayer}
resetPlayerComplete={this.resetPlayerComplete}
handleDelete={this.handleDelete} />
<AppFooter
musicUrl={this.state.currentSong}
playNextSong={this.playNextSong}
playPrevSong={this.playPrevSong}
repeatSong={this.state.repeatSong}
pollPosition={this.pollPosition}
songPosition={this.state.songPosition}
repeat={this.state.repeat}
changeRepeatMode={this.changeRepeatMode}
shuffle={this.state.shuffle}
toggleShuffle={this.toggleShuffle}
resetPlayer={this.state.resetPlayer}
resetPlayerComplete={this.resetPlayerComplete} />
</div>
);
}
});
React.render( <Syko />, document.getElementById('content') );
}
function start(app, ms) {
var GroceryList = React.createClass({
getInitialState: function() {
return {
app: app,
status: 'online',
}
},
componentDidMount: function () {
var self = this;
var yielding = setInterval(function () {
self.state.app.client.yield();
self.setState({
app: self.state.app,
});
//console.log('yielding..');
}, ms);
stop = function () { clearInterval(yielding); };
},
addGrocery: function(item, quantity){
this.state.app.toBuy(item, parseInt(quantity));
this.setState({
app: this.state.app,
});
},
changeConnection: function(e, toggled) {
if (toggled) {
var self = this
app.client.connect('http://localhost:8080', function(state) {
self.state.app.state = state;
self.setState({
app: self.state.app,
status: 'online'
});
});
} else {
app.client.disconnect();
this.setState({
status: 'offline'
});
}
},
childContextTypes: {
muiTheme: React.PropTypes.object
},
getChildContext: function() {
return {
muiTheme: ThemeManager.getCurrentTheme()
};
},
render: function(){
return (
<div>
<span id='toggle'>
<mui.Toggle name="connectivity" label={this.state.status} onToggle={this.changeConnection} labelPosition="right" defaultToggled={true} />
</span>
<h1>CloudTypes Example: Grocery list</h1>
<p>This is a shared grocery list. Add new groceries using the form at the bottom and mark the amount you bought of an item by using negative numbers. </p>
<GroceryItems app={this.state.app}/>
<AddGrocery addNew={this.addGrocery}/>
</div>
)
}
});
var GroceryItems = React.createClass({
render: function() {
var groceries = [];
for (var key in this.props.app.state.fields) {
if (key.indexOf('groceries') == 0) {
var name = key.substring(key.indexOf("<")+1,key.indexOf(">"));
var value = this.props.app.get(name);
if (value != 0) {
groceries.push(<Grocery name={name} value={value}/>);
}
}
}
return (
<div>
<h2> Groceries </h2>
<mui.List>
{groceries}
</mui.List>
</div>
)
}
});
var Grocery = React.createClass({
render: function(){
return (
<mui.ListItem primaryText={this.props.value + ' ' + this.props.name} />
)
}
});
var AddGrocery = React.createClass({
getInitialState: function(){
return {
newGrocery: '',
quantity: ''
}
},
updateNewGrocery: function(e){
this.setState({
newGrocery: e.target.value
});
},
updateNewQuantity: function(e){
this.setState({
quantity: e.target.value
});
},
handleAddNew: function(){
if (this.state.newGrocery == '' || this.state.quantity == '') {
//
} else {
this.props.addNew(this.state.newGrocery, this.state.quantity);
this.setState({
newGrocery: '',
quantity: ''
});
}
},
render: function(){
return (
<form id="form">
<mui.TextField id='quantity' value={this.state.quantity} hintText='quantity' onChange={this.updateNewQuantity}/>
<mui.TextField ref='grocery' value={this.state.newGrocery} hintText='grocery' onChange={this.updateNewGrocery}/>
<mui.FlatButton label="Primary" secondary={true} onClick={this.handleAddNew} label="add"/>
</form>
);
}
});
injectTapEventPlugin();
React.render(<GroceryList/>, document.getElementById('app'));
}
import React from 'react';
import ReactDOM from 'react-dom';
import { Router, browserHistory } from 'react-router';
import {Provider} from 'react-redux';
import configureStore from './store/configureStore';
import routes from './routes';
import './index.css';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import injectTapEventPlugin from 'react-tap-event-plugin';
injectTapEventPlugin(); // temporary. will go away once the official React version is released
const store = configureStore();
ReactDOM.render(
<MuiThemeProvider>
<Provider store={store}>
<Router history={browserHistory} routes={routes} />
</Provider>
</MuiThemeProvider>,
document.getElementById('root')
);
const router = Router.run(routes, Router.HashLocation, function (Handler) {
injectTapEventPlugin();
React.render(<Handler/>, document.getElementById('actor-web-app'));
});
import $ from "jquery";
import _ from "underscore";
import Backbone from "backbone";
import React from "react";
import ReactDOM from "react-dom";
// Needed for MUI's onTouchTap
// http://stackoverflow.com/a/34015469/988941
import injectTapEvent from "react-tap-event-plugin";
injectTapEvent();
import SplashScreen from "components/SplashScreen";
import LoginMaster from "components/login/LoginMaster";
// Fixes aberrant lint violation found by TravisCI
//import MaintenanceScreen from "components/MaintenanceScreen";
import FunctionalCollection from "collections/FunctionalCollection";
import browserBondo from "utilities/browserBondo";
// Important:
// Disconnect all Backbone Events from Models and Collections
Object.keys(Backbone.Events).forEach(function(functionName) {
Backbone.Model.prototype[functionName] = function() {};
Backbone.Collection.prototype[functionName] = function() {};
});
Backbone.Collection.prototype.get = function(obj) {
if (obj == null) return void 0;
return _.find(this.models, function(model) {
return model.id == obj || model.id === obj.id || model.cid === obj.cid;
});
};
(function () {
var React = require('react');
var Firebase = require('firebase');
var constant = require('./config');
var injectTapEventPlugin = require("react-tap-event-plugin");
var MD = require('material-ui');
var SelectField = MD.SelectField;
var MenuItem = MD.MenuItem;
injectTapEventPlugin();
var BasicList = React.createClass({
onChange: function (e, index, value) {
if (this.props.onChange) {
this.props.onChange(value);
}
},
getInitialState: function () {
return {
items: []
}
},
componentWillMount: function () {
var dataList = this.props.dataList;
this.firebaseRef = new Firebase(constant.host + '/' + dataList);
this.firebaseRef.once('value', function (snap) {
var value = snap.val();
if (value) {
var items = [];
for (var i in value) {
items.push(value[i]);
}
this.setState({
items: items
});
}
}.bind(this));
},
componentWillUnmount: function () {
this.firebaseRef.off();
},
render: function () {
function renderItem(item) {
return <MenuItem key={item.id} value={item.id} primaryText={item.name}/>;
}
return (
<SelectField value={this.props.value} onChange={this.onChange}
floatingLabelText={this.props.floatingLabelText}>
{this.state.items.map(renderItem)}
</SelectField>
)
}
});
var ProjectList = React.createClass({
onChange: function (data) {
this.props.onChange(data);
},
render: function () {
this.props.value = parseInt(this.props.value);
return (
<BasicList dataList="project" value={parseInt(this.props.value)} onChange={this.onChange}
floatingLabelText={this.props.floatingLabelText}></BasicList>
)
}
});
var ReleaseSelect = React.createClass({
onChange: function (data) {
this.props.onChange(data);
},
render: function () {
return (
<BasicList dataList="release" value={parseInt(this.props.value)} onChange={this.onChange}
floatingLabelText={this.props.floatingLabelText}></BasicList>
)
}
});
var MemberList = React.createClass({
onChange: function (data) {
this.props.onChange(data);
},
render: function () {
this.props.value = parseInt(this.props.value);
return (
<BasicList dataList="member" value={parseInt(this.props.value)} onChange={this.onChange}
floatingLabelText={this.props.floatingLabelText}></BasicList>
)
}
});
var BugList = React.createClass({
onChange: function (data) {
this.props.onChange(data);
},
render: function () {
this.props.value = parseInt(this.props.value);
return (
<BasicList dataList="bug" value={parseInt(this.props.value)} onChange={this.onChange}
floatingLabelText={this.props.floatingLabelText}></BasicList>
)
}
});
module.exports = {
ProjectList: ProjectList,
ReleaseSelect: ReleaseSelect,
MemberList: MemberList,
BasicList: BasicList,
BugList: BugList
};
})();
describe('TextInputGroup', () => {
injectTapEventPlugin();
let ThemedTextInputGroup;
beforeEach(() => {
ThemedTextInputGroup = injectTheme(TextInputGroup);
});
it('should display button label when label props is passed', () => {
const render = TestUtils.renderIntoDocument(<ThemedTextInputGroup label="Click me" />);
const button = TestUtils.findRenderedDOMComponentWithTag(render, 'button');
expect(button.textContent).to.equal('Click me');
});
it('should verify if the input is disabled', () => {
const render = TestUtils.renderIntoDocument(<ThemedTextInputGroup inputDisabled/>);
const input = TestUtils.findRenderedDOMComponentWithTag(render, 'input');
expect(input.disabled).to.equal(true);
});
it('should verify if the button is disabled', () => {
const render = TestUtils.renderIntoDocument(<ThemedTextInputGroup buttonDisabled/>);
const button = TestUtils.findRenderedDOMComponentWithTag(render, 'button');
expect(button.disabled).to.equal(true);
});
it('should triggered Callback when input is blurred', () => {
const mockBlur = spy();
const render = TestUtils.renderIntoDocument(<ThemedTextInputGroup onBlur={mockBlur}/>);
const input = TestUtils.findRenderedDOMComponentWithTag(render, 'input');
TestUtils.Simulate.blur(input);
expect(mockBlur.called).to.equal(true);
});
it('should trigger the onTouchTap event on button press', () => {
const onTouchTapSpy = spy();
const render = TestUtils.renderIntoDocument(
<ThemedTextInputGroup
onTouchTap={onTouchTapSpy}
label="Click me"
/>
);
const button = TestUtils.findRenderedDOMComponentWithTag(render, 'button');
TestUtils.Simulate.click(button);
expect(onTouchTapSpy.called).to.equal(true);
});
it('input field text color and button color should be darker when it is not disabled', () => {
const render = TestUtils.renderIntoDocument(
<ThemedTextInputGroup label="Click me"/>
);
const input = TestUtils.findRenderedDOMComponentWithTag(render, 'input');
expect(input.style.color).to.equal('rgba(0, 0, 0, 0.867188)');
});
it('input field text color should be faint when it is disabled', () => {
const render = TestUtils.renderIntoDocument(
<ThemedTextInputGroup label="Click me" inputDisabled/>
);
const input = TestUtils.findRenderedDOMComponentWithTag(render, 'input');
expect(input.style.color).to.equal('rgba(0, 0, 0, 0.296875)');
});
});
import React from 'react';
import { render } from 'react-dom';
import { Provider } from 'react-redux';
import configureStore from './store/configureStore';
import { Router, Route, Redirect, browserHistory } from 'react-router';
import { syncHistoryWithStore } from 'react-router-redux';
// Route components
import SignIn from './containers/SignIn.jsx';
import SignedIn from './containers/SignedIn.jsx';
import appRoutes from './appRoutes.js';
import injectTouchTapEvent from 'react-tap-event-plugin';
injectTouchTapEvent();
const store = configureStore();
const history = syncHistoryWithStore(browserHistory, store);
render(
<Provider store={store}>
<Router history={history}>
<Route path="/sign-in" component={SignIn} />
<Route path="/signed-in" component={SignedIn} />
{appRoutes}
<Redirect from="*" to="/dashboard" />
</Router>
</Provider>,
document.getElementById('root'));
import React from 'react';
import ReactDOM from 'react-dom';
import injectTpEventPlugin from 'react-tap-event-plugin';
import { Routes } from './routes/Routes.jsx';
import 'babel-polyfill';
import 'animate.css';
import 'jquery';
import 'font-awesome/css/font-awesome.min.css';
import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap/dist/js/bootstrap.min.js';
import './style/index.style.scss';
const ELEMENT_TO_BOOTSTRAP = 'root';
const BootstrapedElement = document.getElementById(ELEMENT_TO_BOOTSTRAP);
injectTpEventPlugin();
ReactDOM.render(<Routes />, BootstrapedElement);
Meteor.startup(() => {
// Required by Material UI http://material-ui.com/#/get-started
injectTapEventPlugin();
render(renderRoutes(), document.getElementById('app'));
});
init: () => {
injectTapEventPlugin();
routes();
},
constructor(props) {
super(props);
injectTapEventPlugin();
}
Meteor.startup(() => {
//c4w 8.6
injectTapEventPlugin();
render(renderRoutes(), document.getElementById('app'));
});
componentWillMount() {
injectTapEventPlugin();
}
import React from "react"
import ReactDom from "react-dom"
import {Router, Route, IndexRoute, Redirect, hashHistory} from "react-router" //router stuff and dev history
import createBrowserHistory from 'history/lib/createBrowserHistory' //use this for actual history
import { Provider } from "react-redux"
import injectTapEventPlugin from "react-tap-event-plugin" //fixes touch event for material ui
injectTapEventPlugin(); //click fix
import Layout from "./containers/layout.js"
import store from "./store.js"
import Home from "./components/home/main.js"
import Tiger from "./components/tiger/main.js"
import Signin from "./components/admin/main.js"
import Reset from "./components/reset/main.js"
import Login from "./components/login/login.js"
import SockHolder from "./actions/websocket.js"
import mainReducer from "./reducers/reducer.js"
//creates the render point for react
const app = document.getElementById('app');
ReactDom.render(
<Provider store={store}>
<SockHolder>
<Router history={hashHistory}>
<Route component={Layout} path="/">
<IndexRoute component={Home} />
<Route path="/signin" component={Signin} />
<Route path="/admin" component={Tiger} />
import React from 'react';
import {render} from 'react-dom';
import App from './App';
//Material ui
import injectTapEventPlugin from 'react-tap-event-plugin';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
// Needed for onTouchTap
// http://stackoverflow.com/a/34015469/988941
injectTapEventPlugin();
const RENDER = () => (
<MuiThemeProvider >
<App />
</MuiThemeProvider>
);
render(
<RENDER />,
document.getElementById('root')
);
constructor(props) {
super(props);
this.state = {employees: []};
injectTapEventPlugin();
}