From 9a1939268c9cfd7c6f1d9fc71cae7f438874b808 Mon Sep 17 00:00:00 2001 From: ButuzGOL Date: Sat, 27 Jun 2015 10:05:16 +0300 Subject: [PATCH] Moved to babel --- data/bundles/buildings.json | 5 + gulpfile.js | 2 +- package.json | 30 ++--- public/gulpfile.js | 30 +++-- public/package.json | 49 +++---- public/src/app/actions/app-actions.js | 2 +- public/src/app/actions/hero-actions.js | 18 +-- public/src/app/actions/hero-image-actions.js | 8 +- public/src/app/actions/island-actions.js | 8 +- public/src/app/actions/skill-actions.js | 8 +- public/src/app/app-dispatcher.js | 10 +- public/src/app/app.js | 27 ++-- public/src/app/assets/styles/bootstrap.less | 4 +- public/src/app/assets/styles/footer.less | 14 +- public/src/app/assets/styles/main.less | 2 +- public/src/app/components/chat/controls.jsx | 39 +++--- public/src/app/components/chat/index.jsx | 47 +++---- public/src/app/components/chat/message.jsx | 22 +-- public/src/app/components/chat/messages.jsx | 59 ++++----- .../src/app/components/chat/participant.jsx | 16 +-- .../src/app/components/chat/participants.jsx | 53 ++++---- public/src/app/components/footer.jsx | 16 +-- public/src/app/components/header.jsx | 18 +-- public/src/app/components/hero/body.jsx | 76 ++++++----- .../app/components/hero/body/image-slot.jsx | 23 ++-- .../app/components/hero/body/thing-slot.jsx | 41 +++--- public/src/app/components/hero/info.jsx | 44 +++--- .../app/components/hero/info/abilities.jsx | 32 +++-- .../hero/info/damage-protection.jsx | 21 ++- .../app/components/hero/info/information.jsx | 20 ++- .../app/components/hero/info/modifiers.jsx | 20 ++- .../app/components/hero/info/parameters.jsx | 36 +++-- .../src/app/components/hero/info/skills.jsx | 61 ++++----- public/src/app/components/hero/inventory.jsx | 47 ++++--- .../app/components/hero/inventory/actions.jsx | 125 +++++++++--------- .../app/components/hero/inventory/item.jsx | 64 +++++---- .../app/components/hero/inventory/items.jsx | 39 +++--- public/src/app/components/hero/new-form.jsx | 68 +++++----- .../hero/preferences/general-form.jsx | 49 +++---- .../hero/preferences/images-form.jsx | 87 ++++++------ .../app/components/hero/preferences/menu.jsx | 40 +++--- .../hero/preferences/security-form.jsx | 65 ++++----- public/src/app/components/info.jsx | 52 ++++---- public/src/app/components/island.jsx | 122 +++++++++-------- public/src/app/components/menu.jsx | 33 ++--- public/src/app/components/messages.jsx | 57 ++++---- .../src/app/components/session/new-form.jsx | 46 +++---- public/src/app/config/application.js | 2 +- public/src/app/config/environment.js | 2 +- public/src/app/config/io.js | 12 +- public/src/app/constants/action-types.js | 4 +- public/src/app/constants/hero-constants.js | 4 +- .../src/app/constants/hero-image-constants.js | 4 +- public/src/app/constants/island-constants.js | 4 +- public/src/app/constants/skill-constants.js | 4 +- public/src/app/helpers/session-helper.js | 6 +- public/src/app/lib/debug.js | 3 + public/src/app/lib/dom.js | 8 +- public/src/app/lib/fetch.js | 16 ++- public/src/app/lib/utils.js | 8 +- public/src/app/mediator.js | 8 +- public/src/app/pages/hero/inventory.jsx | 22 +-- public/src/app/pages/hero/new.jsx | 15 +-- .../app/pages/hero/preferences/general.jsx | 16 +-- .../src/app/pages/hero/preferences/images.jsx | 22 ++- .../src/app/pages/hero/preferences/master.jsx | 28 ++-- .../app/pages/hero/preferences/security.jsx | 16 +-- public/src/app/pages/hero/show.jsx | 28 ++-- public/src/app/pages/home.jsx | 16 +-- public/src/app/pages/island.jsx | 24 ++-- public/src/app/pages/master.jsx | 51 ++++--- public/src/app/routes.jsx | 30 ++--- public/src/app/services/hero-image-service.js | 10 +- public/src/app/services/hero-service.js | 124 ++++++++--------- public/src/app/services/island-service.js | 12 +- public/src/app/services/session-service.js | 32 +++-- public/src/app/services/skill-service.js | 12 +- public/src/app/stores/hero-image-store.js | 32 ++--- public/src/app/stores/hero-store.js | 34 ++--- public/src/app/stores/island-store.js | 30 +++-- public/src/app/stores/skill-store.js | 30 +++-- public/src/app/utils/hero-api.js | 40 +++--- public/src/app/utils/hero-image-api.js | 10 +- public/src/app/utils/island-api.js | 10 +- public/src/app/utils/skill-api.js | 10 +- 85 files changed, 1231 insertions(+), 1263 deletions(-) create mode 100644 data/bundles/buildings.json create mode 100644 public/src/app/lib/debug.js diff --git a/data/bundles/buildings.json b/data/bundles/buildings.json new file mode 100644 index 0000000..937363b --- /dev/null +++ b/data/bundles/buildings.json @@ -0,0 +1,5 @@ +[{ + "name": "Winter Fall", + "island": "55236b782af3f5a575c6cff9", + +}] diff --git a/gulpfile.js b/gulpfile.js index c2d6615..7de64fc 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -9,7 +9,7 @@ gulp.task('start', function() { verbose: true, ignore: ['public/*', 'node_modules/*'], execMap: { - js: "DEBUG='game:*' node --harmony --debug" + js: "DEBUG='game:*' babel-node --harmony --debug" }, watch: ['*.js', '*.png'], events: { diff --git a/package.json b/package.json index 7c2a35c..4d5909b 100644 --- a/package.json +++ b/package.json @@ -27,24 +27,24 @@ }, "dependencies": { "array-contains": "0.0.1", - "co": "^4.5.1", + "co": "^4.5.4", "co-bcrypt": "^1.0.0", - "debug": "^2.1.3", - "koa": "~0.18.1", - "koa-bodyparser": "^1.4.1", + "debug": "^2.2.0", + "koa": "~0.21.0", + "koa-bodyparser": "^2.0.0", "koa-compose": "^2.3.0", "koa-compress": "^1.0.8", - "koa-cors": "0.0.14", + "koa-cors": "0.0.16", "koa-error": "^1.1.3", "koa-logger": "^1.2.2", - "koa-passport": "^1.1.4", + "koa-passport": "^1.1.6", "koa-response-time": "^1.0.2", "koa-router": "^4.2.0", - "koa-session": "^2.0.0", + "koa-session": "^3.2.0", "koa-static": "^1.4.9", - "lodash": "^3.5.0", - "mongoose": "3.9.7", - "mongoose-deep-populate": "^1.0.1", + "lodash": "^3.9.3", + "mongoose": "4.0.5", + "mongoose-deep-populate": "^1.1.0", "mongoose-unique-validator": "^0.4.1", "oauth2orize": "^1.0.1", "passport-http": "^0.2.2", @@ -54,10 +54,10 @@ "uid": "0.0.2" }, "devDependencies": { - "commander": "^2.7.1", - "gulp": "^3.8.11", - "gulp-eslint": "^0.9.0", - "gulp-load-plugins": "^0.9.0", - "gulp-nodemon": "^2.0.2" + "commander": "^2.8.1", + "gulp": "^3.9.0", + "gulp-eslint": "^0.14.0", + "gulp-load-plugins": "^1.0.0-rc", + "gulp-nodemon": "^2.0.3" } } diff --git a/public/gulpfile.js b/public/gulpfile.js index 3cbeeee..56f1313 100644 --- a/public/gulpfile.js +++ b/public/gulpfile.js @@ -1,11 +1,13 @@ var gulp = require('gulp'); var $ = require('gulp-load-plugins')(); var browserSync = require('browser-sync'); +var connect = require('gulp-connect'); var del = require('del'); var browserify = require('browserify'); var watchify = require('watchify'); var source = require('vinyl-source-stream'); +var babelify = require('babelify'); var prettyHrtime = require('pretty-hrtime'); @@ -51,8 +53,7 @@ config = { }, browserify: { debug: true, - extensions: ['.jsx'], - transform: ['reactify', { es6: true }] + extensions: ['.jsx'] }, images: { src: paths.assets + '/images/**/*.{png,jpg,gif,ico}', @@ -62,6 +63,11 @@ config = { src: paths.src + '/*.html', dest: paths.dist }, + connect: { + root: [paths.dist, paths.src], + livereload: true, + port: 9008 + }, browserSync: { open: false, notify: false, @@ -134,7 +140,9 @@ gulp.task('browserify-watch', function() { args.extensions = config.browserify.extensions; bundler = watchify(browserify(config.scripts.src, args)); - bundler.transform(config.browserify.transform); + bundler.transform(babelify.configure({ + stage: 0 + })); rebundle = function() { bundleLogger.start(config.scripts.outputName); @@ -145,7 +153,7 @@ gulp.task('browserify-watch', function() { .pipe(source(config.scripts.outputName)) .pipe(gulp.dest(config.scripts.dest)) .pipe($.notify('Bundled in')) - .pipe(browserSync.reload({ stream: true })); + .pipe(connect.reload()); }; bundler.on('update', rebundle); @@ -177,11 +185,11 @@ gulp.task('markup', function() { .pipe(gulp.dest(config.markup.dest)); }); -gulp.task('watch', ['browserSync'], function() { - gulp.watch(config.styles.watch, ['styles', browserSync.reload]); - gulp.watch(config.images.src, ['images', browserSync.reload]); - gulp.watch(config.markup.src, ['markup', browserSync.reload]); - gulp.watch(config.fonts.src, ['fonts', browserSync.reload]); +gulp.task('watch', ['connect'], function() { + gulp.watch(config.styles.watch, ['styles', connect.reload]); + gulp.watch(config.images.src, ['images', connect.reload]); + gulp.watch(config.markup.src, ['markup', connect.reload]); + gulp.watch(config.fonts.src, ['fonts', connect.reload]); gulp.start('browserify-watch'); }); @@ -190,6 +198,10 @@ gulp.task('browserSync', ['watch:build'], function() { browserSync(config.browserSync); }); +gulp.task('connect', function() { + connect.server(config.connect); +}); + gulp.task('watch:build', ['clean'], function() { gulp.start(['styles', 'images', 'fonts', 'markup']); }); diff --git a/public/package.json b/public/package.json index 89fca63..28d1973 100644 --- a/public/package.json +++ b/public/package.json @@ -6,44 +6,45 @@ "build": "gulp build" }, "devDependencies": { - "browser-sync": "^2.4.0", - "browserify": "^9.0.3", - "del": "^1.1.1", - "eslint": "^0.19.0", - "eslint-plugin-react": "^2.1.1", - "gulp": "^3.8.11", + "babelify": "^6.1.2", + "browser-sync": "^2.7.12", + "browserify": "^10.2.4", + "del": "^1.2.0", + "eslint": "^0.23.0", + "eslint-plugin-react": "^2.5.2", + "gulp": "^3.9.0", "gulp-connect": "^2.2.0", "gulp-debug": "^2.0.1", - "gulp-eslint": "^0.9.0", + "gulp-eslint": "^0.14.0", "gulp-imagemin": "^2.2.1", - "gulp-less": "^3.0.2", - "gulp-load-plugins": "^0.9.0", + "gulp-less": "^3.0.3", + "gulp-load-plugins": "^1.0.0-rc", "gulp-notify": "^2.2.0", - "gulp-sourcemaps": "^1.5.1", - "gulp-util": "^3.0.4", - "gulp-watch": "^4.2.0", + "gulp-sourcemaps": "^1.5.2", + "gulp-util": "^3.0.5", + "gulp-watch": "^4.2.4", "pretty-hrtime": "^1.0.0", - "reactify": "^1.1.0", "vinyl-source-stream": "^1.1.0", - "watchify": "^2.6.2" + "watchify": "^3.2.2" }, "dependencies": { "array-contains": "0.0.1", - "debug": "^2.1.3", - "flux": "^2.0.1", + "debug": "^2.2.0", + "flux": "^2.0.3", "is-object-empty": "^1.0.0", "keymirror": "^0.1.1", - "lodash": "^3.6.0", + "lodash": "^3.9.3", "make-url": "0.0.1", "material-design-fonticons": "^1.0.0", - "moment": "^2.9.0", - "object-assign": "^2.0.0", - "promise": "^6.1.0", - "react": "^0.12.2", - "react-router": "^0.12.0", - "react-tap-event-plugin": "^0.1.6", + "moment": "^2.10.3", + "node-libs-browser": "^0.5.2", + "object-assign": "^3.0.0", + "react": "^0.13.3", + "react-router": "^0.13.3", + "react-tap-event-plugin": "^0.1.7", "socket.io-client": "^1.3.5", - "store": "^1.3.17" + "store": "^1.3.17", + "webpack": "^1.9.11" }, "browser": { "material-ui": "./material-ui/src/index.js" diff --git a/public/src/app/actions/app-actions.js b/public/src/app/actions/app-actions.js index f053ebf..b1c6ea4 100644 --- a/public/src/app/actions/app-actions.js +++ b/public/src/app/actions/app-actions.js @@ -1 +1 @@ -module.exports = {}; +export default {} diff --git a/public/src/app/actions/hero-actions.js b/public/src/app/actions/hero-actions.js index 4976d0b..8bd1146 100644 --- a/public/src/app/actions/hero-actions.js +++ b/public/src/app/actions/hero-actions.js @@ -1,38 +1,38 @@ -var AppDispatcher = require('../app-dispatcher'); -var HeroConstants = require('../constants/hero-constants'); +import AppDispatcher from '../app-dispatcher'; +import HeroConstants from '../constants/hero-constants'; -module.exports = { - receive: function(data) { +export default { + receive(data) { AppDispatcher.handleAction({ actionType: HeroConstants.HERO_RECEIVE, data: data }); }, - updated: function(data) { + updated(data) { AppDispatcher.handleAction({ actionType: HeroConstants.HERO_UPDATED, data: data }); }, - thingRemoved: function(id) { + thingRemoved(id) { AppDispatcher.handleAction({ actionType: HeroConstants.HERO_THING_REMOVED, id: id }); }, - complectCreated: function(data) { + complectCreated(data) { AppDispatcher.handleAction({ actionType: HeroConstants.HERO_COMPLECT_CREATED, data: data }); }, - complectDeleted: function(id) { + complectDeleted(id) { AppDispatcher.handleAction({ actionType: HeroConstants.HERO_COMPLECT_DELETED, id: id }); }, - movedOnIsland: function(x, y) { + movedOnIsland(x, y) { AppDispatcher.handleAction({ actionType: HeroConstants.HERO_MOVED_ON_ISLAND, x: x, diff --git a/public/src/app/actions/hero-image-actions.js b/public/src/app/actions/hero-image-actions.js index a6c373b..0142fed 100644 --- a/public/src/app/actions/hero-image-actions.js +++ b/public/src/app/actions/hero-image-actions.js @@ -1,8 +1,8 @@ -var AppDispatcher = require('../app-dispatcher'); -var HeroImageConstants = require('../constants/hero-image-constants'); +import AppDispatcher from '../app-dispatcher'; +import HeroImageConstants from '../constants/hero-image-constants'; -module.exports = { - receive: function(data) { +export default { + receive(data) { AppDispatcher.handleAction({ actionType: HeroImageConstants.HERO_IMAGES_RECEIVE, data: data diff --git a/public/src/app/actions/island-actions.js b/public/src/app/actions/island-actions.js index 2191a2d..a27fca9 100644 --- a/public/src/app/actions/island-actions.js +++ b/public/src/app/actions/island-actions.js @@ -1,8 +1,8 @@ -var AppDispatcher = require('../app-dispatcher'); -var IslandConstants = require('../constants/island-constants'); +import AppDispatcher from '../app-dispatcher'; +import IslandConstants from '../constants/island-constants'; -module.exports = { - receive: function(data) { +export default { + receive(data) { AppDispatcher.handleAction({ actionType: IslandConstants.ISLAND_RECEIVE, data: data diff --git a/public/src/app/actions/skill-actions.js b/public/src/app/actions/skill-actions.js index 600797e..d9085eb 100644 --- a/public/src/app/actions/skill-actions.js +++ b/public/src/app/actions/skill-actions.js @@ -1,8 +1,8 @@ -var AppDispatcher = require('../app-dispatcher'); -var SkillConstants = require('../constants/skill-constants'); +import AppDispatcher from '../app-dispatcher'; +import SkillConstants from '../constants/skill-constants'; -module.exports = { - receive: function(data) { +export default { + receive(data) { AppDispatcher.handleAction({ actionType: SkillConstants.SKILLS_RECEIVE, data: data diff --git a/public/src/app/app-dispatcher.js b/public/src/app/app-dispatcher.js index b2f8717..a0786b2 100644 --- a/public/src/app/app-dispatcher.js +++ b/public/src/app/app-dispatcher.js @@ -1,9 +1,9 @@ -var assign = require('object-assign'); -var Dispatcher = require('flux').Dispatcher; +import assign from 'object-assign'; +import { Dispatcher } from 'flux'; -var AppDispatcher = assign(new Dispatcher(), { +export default assign(new Dispatcher(), { - handleAction: function(action) { + handleAction(action) { this.dispatch({ source: 'VIEW_ACTION', action: action @@ -11,5 +11,3 @@ var AppDispatcher = assign(new Dispatcher(), { } }); - -module.exports = AppDispatcher; diff --git a/public/src/app/app.js b/public/src/app/app.js index 53dd072..ee0f96c 100644 --- a/public/src/app/app.js +++ b/public/src/app/app.js @@ -1,22 +1,25 @@ -var React = require('react'); -var Router = require('react-router'); -var socket = require('socket.io-client'); +import React from 'react'; +import Router from 'react-router'; +import socket from 'socket.io-client'; -var config = require('./config/application'); -var environmentConfig = require('./config/environment'); -var mediator = require('./mediator'); +import config from './config/application'; +import environmentConfig from './config/environment'; +import mediator from './mediator'; -var routes = require('./routes'); +import routes from './routes' -var debug = require('debug')('game:application'); +import debugLib from './lib/debug'; -var injectTapEventPlugin = require('react-tap-event-plugin'); +const debug = debugLib('application'); -var io = socket.connect(environmentConfig[config.environment].api.root, { +import injectTapEventPlugin from 'react-tap-event-plugin'; + +const io = socket.connect(environmentConfig[config.environment].api.root, { query: 'token=' + mediator.accessToken }); -require('./config/io')(io); +import configIo from './config/io'; +configIo(io); // Needed for React Developer Tools window.React = React; @@ -27,7 +30,7 @@ window.React = React; // https://github.com/zilverline/react-tap-event-plugin injectTapEventPlugin(); -Router.run(routes, function(Handler) { +Router.run(routes, (Handler) => { React.render(React.createElement(Handler), document.body); debug('game app rendered'); diff --git a/public/src/app/assets/styles/bootstrap.less b/public/src/app/assets/styles/bootstrap.less index ced1eae..e195046 100644 --- a/public/src/app/assets/styles/bootstrap.less +++ b/public/src/app/assets/styles/bootstrap.less @@ -1,5 +1,5 @@ -@import "../../../../material-ui/src/less/scaffolding"; -@import "../../../../material-ui/src/less/components"; +// @import "../../../../material-ui/src/less/scaffolding"; +// @import "../../../../material-ui/src/less/components"; @import (less)"../../../../node_modules/material-design-fonticons/styles/mdfi.css"; diff --git a/public/src/app/assets/styles/footer.less b/public/src/app/assets/styles/footer.less index 04b700c..4c1fb47 100644 --- a/public/src/app/assets/styles/footer.less +++ b/public/src/app/assets/styles/footer.less @@ -4,15 +4,15 @@ bottom: 0px; height: 48px; width: 100%; - background-color: @grey-900; + // background-color: @grey-900; text-align: center; - a { - .mui-text-dark-white; - } + // a { + // .mui-text-dark-white; + // } - .mui-icon-button { - color: @dark-white; - } + //.mui-icon-button { + // color: @dark-white; + //} } diff --git a/public/src/app/assets/styles/main.less b/public/src/app/assets/styles/main.less index 1a15c97..f790f1c 100644 --- a/public/src/app/assets/styles/main.less +++ b/public/src/app/assets/styles/main.less @@ -2,7 +2,7 @@ @import "mixins"; body { - background-color: @grey-100; + // background-color: @grey-100; height: auto !important; min-width: 960px; } diff --git a/public/src/app/components/chat/controls.jsx b/public/src/app/components/chat/controls.jsx index 19771aa..c036981 100644 --- a/public/src/app/components/chat/controls.jsx +++ b/public/src/app/components/chat/controls.jsx @@ -1,17 +1,16 @@ -var React = require('react'); -var mui = require('material-ui'); -var _ = require('lodash'); +import React from 'react'; +import { TextField, RaisedButton } from 'material-ui'; +import _ from 'lodash'; -var mediator = require('../../mediator'); -var actionTypes = require('../../constants/action-types'); +import mediator from '../../mediator'; +import actionTypes from '../../constants/action-types'; -var debug = require('debug')('game:components:chat:controls'); +import debugLib from '../../lib/debug'; -var TextField = mui.TextField; -var RaisedButton = mui.RaisedButton; +const debug = debugLib('components:chat:controls'); -var ChatControls = React.createClass({ - render: function() { +export default class ChatControls extends React.Component { + render() { debug('render'); return ( @@ -26,11 +25,11 @@ var ChatControls = React.createClass({ label="Send" /> ); - }, - _parseValue: function(value) { - var command; - var message; - var tail; + } + _parseValue(value) { + let command; + let message; + let tail; if (value[0] !== '[') { return { @@ -47,9 +46,9 @@ var ChatControls = React.createClass({ message: message }; } - }, - _onSend: function() { - var message = this._parseValue(this.refs.message.getValue()); + } + _onSend() { + let message = this._parseValue(this.refs.message.getValue()); message.datetime = new Date().getTime(); message.from = _.pick(mediator.currentUser, '_id', 'login'); @@ -59,6 +58,4 @@ var ChatControls = React.createClass({ this.refs.message.clearValue(); } -}); - -module.exports = ChatControls; +} diff --git a/public/src/app/components/chat/index.jsx b/public/src/app/components/chat/index.jsx index cbb8136..aec8284 100644 --- a/public/src/app/components/chat/index.jsx +++ b/public/src/app/components/chat/index.jsx @@ -1,41 +1,40 @@ -var React = require('react'); -var mui = require('material-ui'); +import React from 'react'; +import { Paper } from 'material-ui'; -var dom = require('../../lib/dom'); +import dom from '../../lib/dom'; -var Messages = require('./messages'); -var Participants = require('./participants'); -var Controls = require('./controls'); +import Messages from './messages'; +import Participants from './participants'; +import Controls from './controls'; -var debug = require('debug')('game:components:chat'); +import debugLib from '../../lib/debug'; -var Paper = mui.Paper; +const debug = debugLib('components:chat'); -var Chat = React.createClass({ - componentDidMount: function () { +export default class Chat extends React.Component { + componentDidMount() { this._resizeHandle(); - }, - _resizeHandle: function() { - var resizer = this.refs.resizer.getDOMNode(); - var wrapper = this.refs.wrapper.getDOMNode(); - var start; - var wrapperHeight; - + } + _resizeHandle() { + const resizer = this.refs.resizer.getDOMNode(); + const wrapper = this.refs.wrapper.getDOMNode(); + let start; + let wrapperHeight; - dom.on(resizer, 'dragstart', function(e) { + dom.on(resizer, 'dragstart', (e) => { start = e.clientY; wrapperHeight = parseInt(wrapper.style.height, 10); }); - dom.on(resizer, 'drag', function(e) { + dom.on(resizer, 'drag', (e) => { if (e.clientY === 0) return; wrapper.style.height = wrapperHeight + (start - e.clientY); }); - }, - render: function() { + } + render() { debug('render'); - var style = { + const style = { height: 200, minHeight: 150, maxHeight: 350 @@ -94,6 +93,4 @@ var Chat = React.createClass({ ); } -}); - -module.exports = Chat; +} diff --git a/public/src/app/components/chat/message.jsx b/public/src/app/components/chat/message.jsx index de381a8..e603212 100644 --- a/public/src/app/components/chat/message.jsx +++ b/public/src/app/components/chat/message.jsx @@ -1,16 +1,18 @@ -var React = require('react'); -var moment = require('moment'); +import React from 'react'; +import moment from 'moment'; -var debug = require('debug')('game:components:chat:message'); +import debugLib from '../../lib/debug'; -var mediator = require('../../mediator'); +import mediator from '../../mediator'; -var ChatMessage = React.createClass({ - render: function() { +const debug = debugLib('components:chat:message'); + +export default class ChatMessage extends React.Component { + render() { debug('render'); - var props = this.props; - var style = {}; + const props = this.props; + let style = {}; if (props.command) { props.message = `[${props.from.login}] to [${props.tail}] ${props.message}`; @@ -37,6 +39,4 @@ var ChatMessage = React.createClass({ ); } -}); - -module.exports = ChatMessage; +} diff --git a/public/src/app/components/chat/messages.jsx b/public/src/app/components/chat/messages.jsx index df4374d..3853f4f 100644 --- a/public/src/app/components/chat/messages.jsx +++ b/public/src/app/components/chat/messages.jsx @@ -1,47 +1,46 @@ -var React = require('react'); -var mui = require('material-ui'); +import React from 'react'; +import { Paper} from 'material-ui'; -var mediator = require('../../mediator'); -var actionTypes = require('../../constants/action-types'); +import mediator from '../../mediator'; +import actionTypes from '../../constants/action-types'; -var Message = require('./message.jsx'); +import Message from './message.jsx'; -var debug = require('debug')('game:components:chat:messages'); +import debugLib from '../../lib/debug'; -var Paper = mui.Paper; +const debug = debugLib('components:chat:messages'); -var ChatMessages = React.createClass({ - getInitialState: function() { - return { - messages: [] - }; - }, - componentDidMount: function() { +export default class ChatMessages extends React.Component { + state = { + messages: [] + }; + + componentDidMount() { mediator.socket.on('chat/message', this._onMessage); mediator.socket.on('chat/join', this._onJoin); mediator.socket.on('chat/leave', this._onLeave); mediator.on(actionTypes.CHAT_MESSAGE, this._onMessage); - }, - componentWillUnmount: function() { + } + componentWillUnmount() { mediator.socket.removeListener('chat/message', this._onMessage); mediator.socket.removeListener('chat/join', this._onJoin); mediator.socket.removeListener('chat/leave', this._onLeave); mediator.removeListener(actionTypes.CHAT_MESSAGE, this._onMessage); - }, - _onJoin: function(participant) { + } + _onJoin(participant) { this._addMessage({ message: `${participant.login} joined` }); - }, - _onLeave: function(participant) { + } + _onLeave(participant) { this._addMessage({ message: `${participant.login} left` }); - }, - _onMessage: function(message) { + } + _onMessage(message) { this._addMessage(message); - }, - _addMessage: function(message) { + } + _addMessage(message) { if (!message.datetime) { message.datetime = new Date().getTime(); } @@ -49,17 +48,17 @@ var ChatMessages = React.createClass({ this.setState({ messages: this.state.messages.concat([message]) }); - }, - render: function() { + } + render() { debug('render'); - var innerStyle = { + const innerStyle = { height: '100%', overflow: 'auto', padding: 5 }; - var messages = this.state.messages.map((message, index) => { + const messages = this.state.messages.map((message, index) => { return ( ); } -}); - -module.exports = ChatMessages; +} diff --git a/public/src/app/components/chat/participant.jsx b/public/src/app/components/chat/participant.jsx index 5ac51f8..4db3267 100644 --- a/public/src/app/components/chat/participant.jsx +++ b/public/src/app/components/chat/participant.jsx @@ -1,12 +1,12 @@ -var React = require('react'); -var mui = require('material-ui'); +import React from 'react'; +import { FontIcon } from 'material-ui'; -var debug = require('debug')('game:components:chat:participant'); +import debugLib from '../../lib/debug'; -var FontIcon = mui.FontIcon; +const debug = debugLib('components:chat:participant'); -var ChatParticipant = React.createClass({ - render: function() { +export default class ChatParticipant extends React.Component { + render() { debug('render'); return ( @@ -19,6 +19,4 @@ var ChatParticipant = React.createClass({ ); } -}); - -module.exports = ChatParticipant; +} diff --git a/public/src/app/components/chat/participants.jsx b/public/src/app/components/chat/participants.jsx index d562edd..6cd4598 100644 --- a/public/src/app/components/chat/participants.jsx +++ b/public/src/app/components/chat/participants.jsx @@ -1,56 +1,55 @@ -var React = require('react'); -var mui = require('material-ui'); +import React from 'react'; +import { Paper } from 'material-ui'; -var mediator = require('../../mediator'); +import mediator from '../../mediator'; -var Participant = require('./participant.jsx'); +import Participant from './participant.jsx'; -var debug = require('debug')('game:components:chat:participants'); +import debugLib from '../../lib/debug'; -var Paper = mui.Paper; +const debug = debugLib('components:chat:participants'); -var ChatParticipants = React.createClass({ - getInitialState: function() { - return { - participants: [] - }; - }, - componentDidMount: function() { +export default class ChatParticipants extends React.Component { + state = { + participants: [] + }; + + componentDidMount() { mediator.socket.on('chat/join', this._onJoin); mediator.socket.on('chat/leave', this._onLeave); mediator.socket.on('chat/participants', this._onParticipants); - }, - componentWillUnmount: function() { + } + componentWillUnmount() { mediator.socket.removeListener('chat/join', this._onJoin); mediator.socket.removeListener('chat/leave', this._onLeave); mediator.socket.removeListener('chat/participants', this._onParticipants); - }, - _onParticipants: function(participants) { + } + _onParticipants(participants) { this.setState({ participants: participants }); - }, - _onJoin: function(participant) { + } + _onJoin(participant) { this.setState({ participants: this.state.participants.concat([participant]) }); - }, - _onLeave: function(participant) { + } + _onLeave(participant) { this.setState({ participants: this.state.participants .filter((item) => item._id !== participant._id) }); - }, - render: function() { + } + render() { debug('render'); - var style = { + const style = { height: '100%', overflow: 'auto', padding: 5 }; - var participants = this.state.participants.map((participant, index) => { + const participants = this.state.participants.map((participant, index) => { return ( ); } -}); - -module.exports = ChatParticipants; +} diff --git a/public/src/app/components/footer.jsx b/public/src/app/components/footer.jsx index 29e841e..758f5ed 100644 --- a/public/src/app/components/footer.jsx +++ b/public/src/app/components/footer.jsx @@ -1,12 +1,12 @@ -var React = require('react'); -var mui = require('material-ui'); +import React from 'react'; +import { IconButton } from 'material-ui'; -var IconButton = mui.IconButton; +import debugLib from '../lib/debug'; -var debug = require('debug')('game:components:footer'); +const debug = debugLib('components:footer'); -var Footer = React.createClass({ - render: function() { +export default class Footer extends React.Component { + render() { debug('render'); return ( @@ -18,6 +18,4 @@ var Footer = React.createClass({ ); } -}); - -module.exports = Footer; +} diff --git a/public/src/app/components/header.jsx b/public/src/app/components/header.jsx index 647adb1..1584b94 100644 --- a/public/src/app/components/header.jsx +++ b/public/src/app/components/header.jsx @@ -1,12 +1,14 @@ -var React = require('react'); +import React from 'react'; -var Menu = require('./menu'); -var Info = require('./info'); +import Menu from './menu'; +import Info from './info'; -var debug = require('debug')('game:components:header'); +import debugLib from '../lib/debug'; -var Header = React.createClass({ - render: function() { +const debug = debugLib('components:header'); + +export default class Header extends React.Component { + render() { debug('render'); return ( @@ -16,6 +18,4 @@ var Header = React.createClass({ ); } -}); - -module.exports = Header; +} diff --git a/public/src/app/components/hero/body.jsx b/public/src/app/components/hero/body.jsx index 78f2d3c..e43973c 100644 --- a/public/src/app/components/hero/body.jsx +++ b/public/src/app/components/hero/body.jsx @@ -1,42 +1,42 @@ -var React = require('react'); -var mui = require('material-ui'); -var _ = require('lodash'); +import React from 'react'; +import { Paper } from 'material-ui'; +import _ from 'lodash'; -var debug = require('debug')('game:components:hero:body'); +import debugLib from '../../lib/debug'; -var HeroListenerMixin = require('./mixins/hero-listener'); +import HeroListenerMixin from './mixins/hero-listener'; -var ThingSlot = require('./body/thing-slot'); -var ImageSlot = require('./body/image-slot'); +import ThingSlot from './body/thing-slot'; +import ImageSlot from './body/image-slot'; -var HeroApi = require('../../utils/hero-api'); +import HeroApi from '../../utils/hero-api'; -var Paper = mui.Paper; +const debug = debugLib('components:hero:body'); -var HeroBody = React.createClass({ - propTypes: { +export default class HeroBody extends React.Component { + static propTypes = { actions: React.PropTypes.bool - }, - mixins: [HeroListenerMixin], - render: function() { - var hero = this.state.hero; + }; + // mixins: [HeroListenerMixin], + render() { + const hero = this.state.hero; if (_.isEmpty(hero)) return null; - var style; - var position = {}; - var width = 70; - var height = 75; - var offset = 6; - var pullRigth = (3 * width) + (4 * offset); - var fullHeight; - var elixir; - var ring; + let style; + let position = {}; + let width = 70; + let height = 75; + let offset = 6; + let pullRigth = (3 * width) + (4 * offset); + let fullHeight; + let elixir; + let ring; - var things = hero.things.filter(thing => thing.dressed); + let things = hero.things.filter(thing => thing.dressed); - var getThing = function(type) { - return _.find(things, function(thing) { + function getThing(type) { + return _.find(things, (thing) => { return thing.thing.type === type; }); }; @@ -140,7 +140,7 @@ var HeroBody = React.createClass({ top: position.belt.top + position.belt.height + offset }; - _.forEach(position, function(pos) { + _.forEach(position, (pos) => { pos.position = 'absolute'; }); @@ -152,15 +152,15 @@ var HeroBody = React.createClass({ debug('render'); - var thingsSlots = [ + const thingsSlots = [ 'gloves', 'helmet', 'amulet', 'treetops', 'arms', 'armor', 'shield', 'pants', 'belt', 'boots', 'ring', 'ring1', 'ring2', 'ring3', 'elixir', 'elixir1', 'elixir2', 'elixir3' - ].map(function(type, index) { - var orgType = type.replace(/\d+/g, ''); - var thing = getThing(orgType); - var undressHandler; + ].map((type, index) => { + const orgType = type.replace(/\d+/g, ''); + const thing = getThing(orgType); + let undressHandler; if (thing && this.props.actions) { undressHandler = this._onUndress.bind(null, thing._id); @@ -176,7 +176,7 @@ var HeroBody = React.createClass({ type={orgType} /> ); - }.bind(this)); + }); return (
@@ -192,10 +192,8 @@ var HeroBody = React.createClass({
); - }, - _onUndress: function(id) { + } + _onUndress(id) { HeroApi.undressThing(id); } -}); - -module.exports = HeroBody; +} diff --git a/public/src/app/components/hero/body/image-slot.jsx b/public/src/app/components/hero/body/image-slot.jsx index e8f2176..14f65ed 100644 --- a/public/src/app/components/hero/body/image-slot.jsx +++ b/public/src/app/components/hero/body/image-slot.jsx @@ -1,16 +1,19 @@ -var React = require('react'); +import React from 'react'; -var debug = require('debug')('game:components:hero:body-image-slot'); +import debugLib from '../../../lib/debug'; -var HeroBodyImageSlot = React.createClass({ - propTypes: { +const debug = debugLib('components:hero:body-image-slot'); + +export default class HeroBodyImageSlot extends React.Component { + static propTypes = { image: React.PropTypes.object - }, - render: function() { - var image = (this.props.image) ? this.props.image.image : + }; + + render() { + const image = (this.props.image) ? this.props.image.image : 'images/hero-body/no-hero.png'; - var style = { + const style = { position: 'absolute', width: this.props.width, height: this.props.height, @@ -28,6 +31,4 @@ var HeroBodyImageSlot = React.createClass({ ); } -}); - -module.exports = HeroBodyImageSlot; +} diff --git a/public/src/app/components/hero/body/thing-slot.jsx b/public/src/app/components/hero/body/thing-slot.jsx index 2173b50..c3a108d 100644 --- a/public/src/app/components/hero/body/thing-slot.jsx +++ b/public/src/app/components/hero/body/thing-slot.jsx @@ -1,24 +1,25 @@ -var React = require('react'); -var mui = require('material-ui'); -var _ = require('lodash'); +import React from 'react'; +import { Paper } from 'material-ui'; +import _ from 'lodash'; -var debug = require('debug')('game:components:hero:body-thing-slot'); +import debugLib from '../../../lib/debug'; -var Paper = mui.Paper; +const debug = debugLib('components:hero:body-thing-slot'); -var HeroBodyThingSlot = React.createClass({ - propTypes: { +export default class HeroBodyThingSlot extends React.Component { + static propTypes = { type: React.PropTypes.string, thing: React.PropTypes.object - }, - render: function() { - var props = this.props; - var type = props.type; - var thingWrap = props.thing; - var thing = thingWrap ? thingWrap.thing : null; - var width = 70; - var height; - var info = []; + }; + + render() { + const props = this.props; + const type = props.type; + const thingWrap = props.thing; + const thing = thingWrap ? thingWrap.thing : null; + let width = 70; + let height; + let info = []; switch(type) { case 'gloves': @@ -55,7 +56,7 @@ var HeroBodyThingSlot = React.createClass({ break; } - var style = { + const style = { width: width, height: height }; @@ -84,7 +85,7 @@ var HeroBodyThingSlot = React.createClass({ 'timeDuration' ].forEach((item) => { if (_.isUndefined(thing[item])) return; - var label = _.capitalize(item.replace('Give', '')); + const label = _.capitalize(item.replace('Give', '')); info.push(label + ': ' + thing[item]); }); } @@ -103,6 +104,4 @@ var HeroBodyThingSlot = React.createClass({ ); } -}); - -module.exports = HeroBodyThingSlot; +} diff --git a/public/src/app/components/hero/info.jsx b/public/src/app/components/hero/info.jsx index 6b347ce..2d95cd5 100644 --- a/public/src/app/components/hero/info.jsx +++ b/public/src/app/components/hero/info.jsx @@ -1,23 +1,25 @@ -var React = require('react'); -var _ = require('lodash'); +import React from 'react'; +import _ from 'lodash'; -var debug = require('debug')('game:components:hero:info'); +import debugLib from '../../lib/debug'; -var HeroService = require('../../services/hero-service'); -var HeroApi = require('../../utils/hero-api'); -var HeroListenerMixin = require('./mixins/hero-listener'); +import HeroService from '../../services/hero-service'; +import HeroApi from '../../utils/hero-api'; +import HeroListenerMixin from './mixins/hero-listener'; -var Parameters = require('./info/parameters'); -var Information = require('./info/information'); -var Modifiers = require('./info/modifiers'); -var DamageProtection = require('./info/damage-protection'); -var Skills = require('./info/skills'); -var Abilities = require('./info/abilities'); +import Parameters from './info/parameters'; +import Information from './info/information'; +import Modifiers from './info/modifiers'; +import DamageProtection from './info/damage-protection'; +import Skills from './info/skills'; +import Abilities from './info/abilities'; -var HeroInfo = React.createClass({ - mixins: [HeroListenerMixin], - render: function() { - var hero = this.state.hero; +const debug = debugLib('components:hero:info'); + +export default class HeroInfo extends React.Component { + // mixins: [HeroListenerMixin], + render() { + const hero = this.state.hero; if (_.isEmpty(hero)) return null; @@ -77,13 +79,11 @@ var HeroInfo = React.createClass({ ); - }, - _onIncrease: function(area) { - var idOrName = arguments[1]; + } + _onIncrease(area) { + const idOrName = arguments[1]; HeroService.increase(area, idOrName) .then(HeroApi.fetch); } -}); - -module.exports = HeroInfo; +} diff --git a/public/src/app/components/hero/info/abilities.jsx b/public/src/app/components/hero/info/abilities.jsx index 7c5ad29..d768702 100644 --- a/public/src/app/components/hero/info/abilities.jsx +++ b/public/src/app/components/hero/info/abilities.jsx @@ -1,22 +1,22 @@ -var React = require('react'); -var mui = require('material-ui'); -var _ = require('lodash'); +import React from 'react'; +import { Paper, FontIcon } from 'material-ui'; +import _ from 'lodash'; -var debug = require('debug')('game:components:hero:info:abilities'); +import debugLib from '../../../lib/debug'; -var Paper = mui.Paper; -var FontIcon = mui.FontIcon; +const debug = debugLib('components:hero:info:abilities'); -var HeroInfoAbilities = React.createClass({ - propTypes: { +export default class HeroInfoAbilities extends React.Component { + static propTypes = { numberOfAbilities: React.PropTypes.number, increaseHandler: React.PropTypes.func - }, - render: function() { - var props = this.props; - var abilities = ['swords', 'axes', 'knives', 'clubs', 'shields']; - var items; - var style = { + }; + + render() { + const props = this.props; + const abilities = ['swords', 'axes', 'knives', 'clubs', 'shields']; + let items; + let style = { width: 204, height: 50 + 20 * abilities.length }; @@ -60,6 +60,4 @@ var HeroInfoAbilities = React.createClass({ ); } -}); - -module.exports = HeroInfoAbilities; +} diff --git a/public/src/app/components/hero/info/damage-protection.jsx b/public/src/app/components/hero/info/damage-protection.jsx index ef626bd..828108c 100644 --- a/public/src/app/components/hero/info/damage-protection.jsx +++ b/public/src/app/components/hero/info/damage-protection.jsx @@ -1,15 +1,14 @@ -var React = require('react'); -var mui = require('material-ui'); +import React from 'react'; +import { Paper } from 'material-ui'; -var debug = require('debug') - ('game:components:hero:info:damage-protection'); +import debugLib from '../../../lib/debug'; -var Paper = mui.Paper; +const debug = debugLib('components:hero:info:damage-protection'); -var HeroInfoDamageProtection = React.createClass({ - render: function() { - var props = this.props; - var style = { +export default class HeroInfoDamageProtection extends React.Component { + render() { + const props = this.props; + const style = { width: 205, height: 179 }; @@ -40,6 +39,4 @@ var HeroInfoDamageProtection = React.createClass({ ); } -}); - -module.exports = HeroInfoDamageProtection; +} diff --git a/public/src/app/components/hero/info/information.jsx b/public/src/app/components/hero/info/information.jsx index b7ad043..6e08f9f 100644 --- a/public/src/app/components/hero/info/information.jsx +++ b/public/src/app/components/hero/info/information.jsx @@ -1,14 +1,14 @@ -var React = require('react'); -var mui = require('material-ui'); +import React from 'react'; +import { Paper } from 'material-ui'; -var debug = require('debug')('game:components:hero:info:information'); +import debugLib from '../../../lib/debug'; -var Paper = mui.Paper; +const debug = debugLib('components:hero:info:information'); -var HeroInfoInformation = React.createClass({ - render: function() { - var props = this.props; - var style = { +export default class HeroInfoInformation extends React.Component { + render() { + const props = this.props; + const style = { width: 205, height: 140 }; @@ -35,6 +35,4 @@ var HeroInfoInformation = React.createClass({ ); } -}); - -module.exports = HeroInfoInformation; +} diff --git a/public/src/app/components/hero/info/modifiers.jsx b/public/src/app/components/hero/info/modifiers.jsx index 273ce12..ad41b57 100644 --- a/public/src/app/components/hero/info/modifiers.jsx +++ b/public/src/app/components/hero/info/modifiers.jsx @@ -1,14 +1,14 @@ -var React = require('react'); -var mui = require('material-ui'); +import React from 'react'; +import { Paper } from 'material-ui'; -var debug = require('debug')('game:components:hero:info:modifiers'); +import debugLib from '../../../lib/debug'; -var Paper = mui.Paper; +const debug = debugLib('components:hero:info:modifiers'); -var HeroInfoModifiers = React.createClass({ - render: function() { - var props = this.props; - var style = { +export default class HeroInfoModifiers extends React.Component { + render() { + const props = this.props; + const style = { width: 205, height: 179 }; @@ -39,6 +39,4 @@ var HeroInfoModifiers = React.createClass({ ); } -}); - -module.exports = HeroInfoModifiers; +} diff --git a/public/src/app/components/hero/info/parameters.jsx b/public/src/app/components/hero/info/parameters.jsx index 3d9ffd1..0fb5f71 100644 --- a/public/src/app/components/hero/info/parameters.jsx +++ b/public/src/app/components/hero/info/parameters.jsx @@ -1,22 +1,22 @@ -var React = require('react'); -var mui = require('material-ui'); -var _ = require('lodash'); +import React from 'react'; +import { Paper, FontIcon } from 'material-ui'; +import _ from 'lodash'; -var debug = require('debug')('game:components:hero:info:parameters'); +import debugLib from '../../../lib/debug'; -var Paper = mui.Paper; -var FontIcon = mui.FontIcon; +const debug = debugLib('components:hero:info:parameters'); -var HeroInfoParameters = React.createClass({ - propTypes: { +export default class HeroInfoParameters extends React.Component { + static propTypes = { numberOfAbilities: React.PropTypes.number, increaseHandler: React.PropTypes.func - }, - render: function() { - var props = this.props; - var parameters = ['strength', 'dexterity', 'intuition', 'health']; - var items; - var style = { + }; + + render() { + const props = this.props; + const parameters = ['strength', 'dexterity', 'intuition', 'health']; + let items; + let style = { width: 205, height: 50 + 20 * parameters.length, backgroundColor: 'white' @@ -27,7 +27,7 @@ var HeroInfoParameters = React.createClass({ } function renderFeature(orig, feature) { - var output = ''; + let output = ''; if (orig - feature === 0) { return output; } @@ -46,7 +46,7 @@ var HeroInfoParameters = React.createClass({ items = parameters .map((parameter, key) => { - var parameterCap = _.capitalize(parameter); + const parameterCap = _.capitalize(parameter); return (
{parameterCap}
@@ -75,6 +75,4 @@ var HeroInfoParameters = React.createClass({ ); } -}); - -module.exports = HeroInfoParameters; +} diff --git a/public/src/app/components/hero/info/skills.jsx b/public/src/app/components/hero/info/skills.jsx index b550a2a..1a8bac2 100644 --- a/public/src/app/components/hero/info/skills.jsx +++ b/public/src/app/components/hero/info/skills.jsx @@ -1,13 +1,12 @@ -var React = require('react'); -var mui = require('material-ui'); -var _ = require('lodash'); +import React from 'react'; +import { Paper, FontIcon } from 'material-ui'; +import _ from 'lodash'; -var SkillStore = require('../../../stores/skill-store'); +import SkillStore from '../../../stores/skill-store'; -var debug = require('debug')('game:components:hero:info:skills'); +import debugLib from '../../../lib/debug'; -var Paper = mui.Paper; -var FontIcon = mui.FontIcon; +const debug = debugLib('components:hero:info:skills'); function getInfoSkillsState() { return { @@ -16,35 +15,35 @@ function getInfoSkillsState() { }; } -var HeroInfoSkills = React.createClass({ - propTypes: { +export default class HeroInfoSkills extends React.Component { + static propTypes = { skill: React.PropTypes.array, numberOfSkills: React.PropTypes.number, increaseHandler: React.PropTypes.func - }, - getInitialState: function() { - return getInfoSkillsState(); - }, - componentDidMount: function() { + }; + + state = getInfoSkillsState(); + + componentDidMount() { SkillStore.addChangeListener(this._onChange); - }, - componentWillUnmount: function() { + } + componentWillUnmount() { SkillStore.removeChangeListener(this._onChange); - }, - _onChange: function() { + } + _onChange() { this.setState(getInfoSkillsState()); - }, - render: function() { - var props = this.props; - var perPage = 5; - var skills = this.state.skills + } + render() { + const props = this.props; + const perPage = 5; + const skills = this.state.skills .slice(this.state.page * perPage, this.state.page * perPage + perPage); - var style = { + let style = { width: 204, height: 50 + 20 * skills.length }; - var items = skills + const items = skills .map((skill, index) => { var item = _(props.skills).find((heroSkill) => { return heroSkill.skill === skill._id; @@ -94,17 +93,15 @@ var HeroInfoSkills = React.createClass({
); - }, - _onNextPage: function() { + } + _onNextPage() { this.setState({ page: this.state.page + 1 }); - }, - _onPrevPage: function() { + } + _onPrevPage() { this.setState({ page: this.state.page - 1 }); } -}); - -module.exports = HeroInfoSkills; +} diff --git a/public/src/app/components/hero/inventory.jsx b/public/src/app/components/hero/inventory.jsx index de6f63e..679d1ee 100644 --- a/public/src/app/components/hero/inventory.jsx +++ b/public/src/app/components/hero/inventory.jsx @@ -1,30 +1,31 @@ -var React = require('react'); -var _ = require('lodash'); -var assign = require('object-assign'); +import React from 'react'; +import _ from 'lodash'; +import assign from 'object-assign'; -var debug = require('debug')('game:components:hero:inventory'); +import debugLib from '../../lib/debug'; -var HeroListenerMixin = require('./mixins/hero-listener'); +import HeroListenerMixin from './mixins/hero-listener'; -var Actions = require('./inventory/actions'); -var Items = require('./inventory/items'); +import Actions from './inventory/actions'; +import Items from './inventory/items'; -var HeroInventory = React.createClass({ - mixins: [HeroListenerMixin], - getInitialState: function() { - return assign({ - filter: null - }, HeroListenerMixin.getInitialState); - }, - render: function() { - var hero = this.state.hero; +const debug = debugLib('components:hero:inventory'); + +export default class HeroInventory extends React.Component { + // mixins: [HeroListenerMixin], + state = assign({ + filter: null + }, HeroListenerMixin.getInitialState); + + render() { + const hero = this.state.hero; if (_.isEmpty(hero)) return null; - var things = hero.things.filter(function(thing) { - var filter = this.state.filter; + const things = hero.things.filter((thing) => { + const filter = this.state.filter; return !thing.dressed && (!filter || thing.thing.type === filter); - }.bind(this)); + }); debug('render'); @@ -38,12 +39,10 @@ var HeroInventory = React.createClass({ things={things} /> ); - }, - _filterHandler: function(type) { + } + _filterHandler(type) { this.setState({ filter: type }); } -}); - -module.exports = HeroInventory; +} diff --git a/public/src/app/components/hero/inventory/actions.jsx b/public/src/app/components/hero/inventory/actions.jsx index 5e0b1af..0060990 100644 --- a/public/src/app/components/hero/inventory/actions.jsx +++ b/public/src/app/components/hero/inventory/actions.jsx @@ -1,40 +1,40 @@ -var React = require('react'); -var mui = require('material-ui'); -var _ = require('lodash'); - -var debug = require('debug')('game:components:hero:inventory:actions'); - -var HeroApi = require('../../../utils/hero-api'); -var mediator = require('../../../mediator'); -var actionTypes = require('../../../constants/action-types'); - -var Toolbar = mui.Toolbar; -var ToolbarGroup = mui.ToolbarGroup; -var RaisedButton = mui.RaisedButton; -var FlatButton = mui.FlatButton; -var DropDownMenu = mui.DropDownMenu; -var FontIcon = mui.FontIcon; -var IconButton = mui.IconButton; -var Dialog = mui.Dialog; -var TextField = mui.TextField; - -var HeroInventoryActions = React.createClass({ - propTypes: { +import React from 'react'; +import { + Toolbar, + ToolbarGroup, + RaisedButton, + FlatButton, + DropDownMenu, + FontIcon, + IconButton, + Dialog, + TextField +} from 'material-ui'; +import _ from 'lodash'; + +import debugLib from '../../../lib/debug'; + +import HeroApi from '../../../utils/hero-api'; +import mediator from '../../../mediator'; +import actionTypes from '../../../constants/action-types'; + +const debug = debugLib('components:hero:inventory:actions'); + +export default class HeroInventoryActions extends React.Component { + static propTypes = { hero: React.PropTypes.object, filterHandler: React.PropTypes.func - }, - getInitialState: function() { - return { - selectedComplect: null - }; - }, - render: function() { - var hero = this.props.hero; - var anyThingDressed = hero.things.some(thing => thing.dressed); - var disabledComplectActions = !this.state.selectedComplect; - var selectedComplectIndex; - - var filterOptions = [ + }; + + state = { selectedComplect: null }; + + render() { + const hero = this.props.hero; + const anyThingDressed = hero.things.some(thing => thing.dressed); + const disabledComplectActions = !this.state.selectedComplect; + let selectedComplectIndex; + + const filterOptions = [ { payload: null, text: 'All' }, { payload: 'sword', text: 'Sword' }, { payload: 'axe', text: 'Axe' }, @@ -55,20 +55,20 @@ var HeroInventoryActions = React.createClass({ { payload: 'elixir', text: 'Elixir' } ]; - var complectOptions = hero.complects.map((complect) => { + let complectOptions = hero.complects.map((complect) => { return { payload: complect._id, text: complect.name }; }); - // TODO wrong handling empty dropdown (pr) + // TODO: wrong handling empty dropdown (pr) complectOptions.unshift({ payload: null, text: 'Empty' }); selectedComplectIndex = _.findIndex(complectOptions, (option) => option.payload === this.state.selectedComplect); - var newComplectActions = [ + const newComplectActions = [ + hintText="Complect name" + required /> ); - }, - _onUndress: function() { + } + _onUndress() { HeroApi.undressThings(); - }, - _onFilter: function(e, selectedIndex, menuItem) { + } + _onFilter(e, selectedIndex, menuItem) { this.props.filterHandler(menuItem.payload); - }, - _onComplect: function(e, selectedIndex, menuItem) { + } + _onComplect(e, selectedIndex, menuItem) { this.setState({ selectedComplect: menuItem.payload }); - }, - _onNewComplectDialog: function() { + } + _onNewComplectDialog() { this.refs.newComplectDialog.show(); - }, - _onNewComplectDialogCancel: function() { + } + _onNewComplectDialogCancel() { this.refs.newComplectDialog.dismiss(); - }, - _onNewComplectSubmit: function(e) { + } + _onNewComplectSubmit(e) { e.preventDefault(); - var ids = this.props.hero.things + const ids = this.props.hero.things .filter(thing => thing.dressed) .map(thing => thing._id); HeroApi.newComplect({ name: this.refs.complectName.getValue(), ids: ids - }).then(function() { + }).then(() => { this.refs.newComplectDialog.dismiss(); this.refs.complectName.setValue(''); mediator.emit(actionTypes.MESSAGE, 'Complect created'); - }.bind(this)); - }, - _onApplyComplect: function() { + }); + } + _onApplyComplect() { HeroApi.applyComplect(this.state.selectedComplect); - }, - _onDeleteComplect: function() { + } + _onDeleteComplect() { HeroApi.deleteComplect(this.state.selectedComplect) - .then(function() { + .then(() => { this.state.selectedComplect = null; mediator.emit(actionTypes.MESSAGE, 'Complect deleted'); - }.bind(this)); + }); } -}); - -module.exports = HeroInventoryActions; +} diff --git a/public/src/app/components/hero/inventory/item.jsx b/public/src/app/components/hero/inventory/item.jsx index b9fc94b..7ebcbdd 100644 --- a/public/src/app/components/hero/inventory/item.jsx +++ b/public/src/app/components/hero/inventory/item.jsx @@ -1,30 +1,29 @@ -var React = require('react'); -var mui = require('material-ui'); -var _ = require('lodash'); +import React from 'react'; +import { Paper, FontIcon, RaisedButton } from 'material-ui'; +import _ from 'lodash'; -var HeroApi = require('../../../utils/hero-api'); -var mediator = require('../../../mediator'); -var actionTypes = require('../../../constants/action-types'); +import HeroApi from '../../../utils/hero-api'; +import mediator from '../../../mediator'; +import actionTypes from '../../../constants/action-types'; -var ThingSlot = require('../body/thing-slot'); +import ThingSlot from '../body/thing-slot'; -var debug = require('debug')('game:components:hero:inventory:item'); +import debugLib from '../../../lib/debug'; -var Paper = mui.Paper; -var FontIcon = mui.FontIcon; -var RaisedButton = mui.RaisedButton; +const debug = debugLib('components:hero:inventory:item'); -var HeroInventoryItem = React.createClass({ - propTypes: { +export default class HeroInventoryItem extends React.Component { + static propTypes = { thing: React.PropTypes.object - }, - render: function() { - var thingWrap = this.props.thing; - var thing = thingWrap.thing; - var hero = this.props.hero; - var canBeDressed = true; + }; - var renderItem = function(key, value, safe) { + render() { + const thingWrap = this.props.thing; + const thing = thingWrap.thing; + const hero = this.props.hero; + let canBeDressed = true; + + function renderItem(key, value, safe) { if (_.isUndefined(value)) return; return ( @@ -36,14 +35,13 @@ var HeroInventoryItem = React.createClass({ ); }; - var needItems = [ + const needItems = [ 'levelNeed', 'strengthNeed', 'dexterityNeed', 'intuitionNeed', 'healthNeed', 'swordsNeed', 'axesNeed', 'knivesNeed', 'clubsNeed', 'shieldsNeed' ].map((item) => { - var key = item.replace('Need', ''); - - var label = _.capitalize(key); + const key = item.replace('Need', ''); + const label = _.capitalize(key); if (hero[key] < thing[item]) { canBeDressed = false; @@ -52,7 +50,7 @@ var HeroInventoryItem = React.createClass({ return renderItem(label, thing[item], hero[key] >= thing[item]); }); - var giveItems = [ + const giveItems = [ 'strengthGive', 'dexterityGive', 'intuitionGive', 'healthGive', 'swordsGive', 'axesGive', 'knivesGive', 'clubsGive', 'shieldsGive', 'damageMin', 'damageMax', @@ -65,7 +63,7 @@ var HeroInventoryItem = React.createClass({ 'isTwoHands', 'timeDuration' ].map((item) => { - var label = _.capitalize(item.replace('Give', '')); + const label = _.capitalize(item.replace('Give', '')); return renderItem(label, thing[item]); }); @@ -132,16 +130,14 @@ var HeroInventoryItem = React.createClass({ ); - }, - _onDress: function() { + } + _onDress() { HeroApi.dressThing(this.props.thing._id); - }, - _onRemove: function() { + } + _onRemove() { HeroApi.removeThing(this.props.thing._id) - .then(function() { + .then(() => { mediator.emit(actionTypes.MESSAGE, 'Thing removed'); }); } -}); - -module.exports = HeroInventoryItem; +} diff --git a/public/src/app/components/hero/inventory/items.jsx b/public/src/app/components/hero/inventory/items.jsx index 10b4b74..5cc10e3 100644 --- a/public/src/app/components/hero/inventory/items.jsx +++ b/public/src/app/components/hero/inventory/items.jsx @@ -1,30 +1,29 @@ -var React = require('react'); -var debug = require('debug')('game:components:hero:inventory:items'); +import React from 'react'; +import debugLib from '../../../lib/debug'; -var Item = require('./item'); +import Item from './item'; -var HeroInventoryItems = React.createClass({ - propTypes: { +const debug = debugLib('components:hero:inventory:items'); + +export default class HeroInventoryItems extends React.Component { + static propTypes = { things: React.PropTypes.array - }, - render: function() { - debug('render'); + }; - var items = this.props.things.map(function(thing, index) { - return ( - - ); - }.bind(this)); + render() { + debug('render'); return (
- {items} + {this.props.things.map((thing, index) => { + return ( + + ); + })}
); } -}); - -module.exports = HeroInventoryItems; +} diff --git a/public/src/app/components/hero/new-form.jsx b/public/src/app/components/hero/new-form.jsx index 0a19e9d..a9b69ba 100644 --- a/public/src/app/components/hero/new-form.jsx +++ b/public/src/app/components/hero/new-form.jsx @@ -1,30 +1,28 @@ -var React = require('react'); -var mui = require('material-ui'); -var Router = require('react-router'); -var debug = require('debug')('game:components:hero:new-form'); +import React from 'react'; +import { + RadioButtonGroup, + TextField, + RaisedButton, + RadioButton +} from 'material-ui'; +import Router from 'react-router'; +import debugLib from '../../lib/debug'; -var utils = require('../../lib/utils'); -var mediator = require('../../mediator'); -var actionTypes = require('../../constants/action-types'); +import utils from '../../lib/utils'; +import mediator from '../../mediator'; +import actionTypes from '../../constants/action-types'; -var HeroService = require('../../services/hero-service'); +import HeroService from '../../services/hero-service'; -var RadioButtonGroup = mui.RadioButtonGroup; -var TextField = mui.TextField; -var RaisedButton = mui.RaisedButton; -var RadioButton = mui.RadioButton; +const debug = debugLib('components:hero:new-form'); -var Navigation = Router.Navigation; +export default class HeroNewForm extends React.Component { + state = { + errors: {} + }; -var HeroNewForm = React.createClass({ - mixins: [Navigation], - getInitialState: function() { - return { - errors: {} - }; - }, - render: function() { - var errors = this.state.errors; + render() { + const errors = this.state.errors; debug('render'); @@ -33,7 +31,7 @@ var HeroNewForm = React.createClass({
@@ -41,14 +39,14 @@ var HeroNewForm = React.createClass({ ref="password" type="password" name="password" - required + import errorText={errors.password} hintText="Password" />

@@ -70,10 +68,10 @@ var HeroNewForm = React.createClass({ ); - }, - _onSubmit: function(e) { - var refs = this.refs; - var data; + } + _onSubmit(e) { + const refs = this.refs; + let data; e.preventDefault(); @@ -87,17 +85,15 @@ var HeroNewForm = React.createClass({ debug('submit %o', data); HeroService.new(data) - .then(function() { + .then(() => { mediator.emit(actionTypes.MESSAGE, 'Hero created'); this.transitionTo('/'); - }.bind(this), function(res) { + }, (res) => { if (res.status === 422) { this.setState({ errors: utils.validationMapper(res.body) }); } - }.bind(this)); - }, -}); - -module.exports = HeroNewForm; + }); + } +} diff --git a/public/src/app/components/hero/preferences/general-form.jsx b/public/src/app/components/hero/preferences/general-form.jsx index 2d86118..344951b 100644 --- a/public/src/app/components/hero/preferences/general-form.jsx +++ b/public/src/app/components/hero/preferences/general-form.jsx @@ -1,27 +1,26 @@ -var React = require('react'); -var mui = require('material-ui'); -var moment = require('moment'); -var _ = require('lodash'); +import React from 'react'; +import { TextField, RaisedButton } from 'material-ui'; +import moment from 'moment'; +import _ from 'lodash'; -var debug = require('debug')('game:components:hero:preferences:general-form'); +import debugLib from '../../../lib/debug'; -var HeroApi = require('../../../utils/hero-api'); -var mediator = require('../../../mediator'); -var actionTypes = require('../../../constants/action-types'); +import HeroApi from '../../../utils/hero-api'; +import mediator from '../../../mediator'; +import actionTypes from '../../../constants/action-types'; -var HeroListenerMixin = require('../mixins/hero-listener'); +import HeroListenerMixin from '../mixins/hero-listener'; -var TextField = mui.TextField; -var RaisedButton = mui.RaisedButton; +const debug = debugLib('components:hero:preferences:general-form'); -var HeroPreferencesGeneralForm = React.createClass({ - mixins: [HeroListenerMixin], - render: function() { - var hero = this.state.hero; +export default class HeroPreferencesGeneralForm extends React.Component { + // mixins: [HeroListenerMixin], + render() { + const hero = this.state.hero; if (_.isEmpty(hero)) return null; - var dateOfBirthday; + let dateOfBirthday; debug('render'); @@ -67,14 +66,12 @@ var HeroPreferencesGeneralForm = React.createClass({ ); - }, - _onSubmit: function(e) { - var refs = this.refs; - var data; - + } + _onSubmit(e) { + const refs = this.refs; e.preventDefault(); - data = { + const data = { name: refs.name.getValue(), dateOfBirthday: refs.dateOfBirthday.getValue(), country: refs.country.getValue(), @@ -84,10 +81,8 @@ var HeroPreferencesGeneralForm = React.createClass({ // TODO data do extend not correctly so may be do just throw service HeroApi.updateGeneral(data) - .then(function() { + .then(() => { mediator.emit(actionTypes.MESSAGE, 'Hero updated'); - }.bind(this)); + }); } -}); - -module.exports = HeroPreferencesGeneralForm; +} diff --git a/public/src/app/components/hero/preferences/images-form.jsx b/public/src/app/components/hero/preferences/images-form.jsx index 8e318b1..4a5d860 100644 --- a/public/src/app/components/hero/preferences/images-form.jsx +++ b/public/src/app/components/hero/preferences/images-form.jsx @@ -1,21 +1,23 @@ -var React = require('react'); -var mui = require('material-ui'); -var assign = require('object-assign'); -var _ = require('lodash'); +import React from 'react'; +import { + RadioButtonGroup, + RadioButton, + RaisedButton, + Paper +} from 'material-ui'; +import assign from 'object-assign'; +import _ from 'lodash'; -var mediator = require('../../../mediator'); -var HeroApi = require('../../../utils/hero-api'); -var actionTypes = require('../../../constants/action-types'); +import mediator from '../../../mediator'; +import HeroApi from '../../../utils/hero-api'; +import actionTypes from '../../../constants/action-types'; -var HeroImageStore = require('../../../stores/hero-image-store'); -var HeroStore = require('../../../stores/hero-store'); +import HeroImageStore from '../../../stores/hero-image-store'; +import HeroStore from '../../../stores/hero-store'; -var debug = require('debug')('game:components:hero:preferences:images-form'); +import debugLib from '../../../lib/debug'; -var RadioButtonGroup = mui.RadioButtonGroup; -var RadioButton = mui.RadioButton; -var RaisedButton = mui.RaisedButton; -var Paper = mui.Paper; +const debug = debugLib('components:hero:preferences:images-form'); function getHeroState() { return { @@ -23,42 +25,41 @@ function getHeroState() { }; } -var getHeroImagesState = function() { +function getHeroImagesState() { return { heroImages: HeroImageStore.get() }; }; -var HeroPreferencesGeneralForm = React.createClass({ - getInitialState: function() { - return assign({}, - getHeroState(), - getHeroImagesState() - ); - }, - componentDidMount: function() { +export default class HeroPreferencesGeneralForm extends React.Component { + state = assign({}, + getHeroState(), + getHeroImagesState() + ); + + componentDidMount() { HeroImageStore.addChangeListener(this._onChangeHeroImages); HeroStore.addChangeListener(this._onChangeHero); - }, - componentWillUnmount: function() { + } + componentWillUnmount() { HeroImageStore.removeChangeListener(this._onChangeHeroImages); HeroStore.removeChangeListener(this._onChangeHero); - }, - _onChangeHeroImages: function() { + } + _onChangeHeroImages() { this.setState(getHeroImagesState()); - }, - _onChangeHero: function() { + } + _onChangeHero() { this.setState(getHeroState()); - }, - render: function() { - var hero = this.state.hero; - var heroImages = this.state.heroImages; + } + render() { + const hero = this.state.hero; + const heroImages = this.state.heroImages; if (_.isEmpty(hero) || !heroImages.length) return null; - var items; - var heroImage = (hero.image) ? hero.image._id : -1; - var itemStyle = { + let items; + const heroImage = (hero.image) ? hero.image._id : -1; + const itemStyle = { width: 146, height: 259, textAlign: 'center' @@ -107,20 +108,18 @@ var HeroPreferencesGeneralForm = React.createClass({ ); - }, - _onSubmit: function(e) { + } + _onSubmit(e) { e.preventDefault(); - var data = { + const data = { image: this.refs.heroImage.getSelectedValue() }; // TODO data do extend not correctly so may be do just throw service HeroApi.updateGeneral(data) - .then(function() { + .then(() => { mediator.emit(actionTypes.MESSAGE, 'Hero image updated'); - }.bind(this)); + }); } -}); - -module.exports = HeroPreferencesGeneralForm; +} diff --git a/public/src/app/components/hero/preferences/menu.jsx b/public/src/app/components/hero/preferences/menu.jsx index 16790b9..e991cb8 100644 --- a/public/src/app/components/hero/preferences/menu.jsx +++ b/public/src/app/components/hero/preferences/menu.jsx @@ -1,17 +1,19 @@ -var React = require('react'); -var mui = require('material-ui'); -var Router = require('react-router'); -var _ = require('lodash'); +import React from 'react'; +import { Menu } from 'material-ui'; +import Router from 'react-router'; +import _ from 'lodash'; -var debug = require('debug')('game:components:preferences:menu'); +import debugLib from '../../../lib/debug'; -var Menu = mui.Menu; -var State = Router.State; +const debug = debugLib('components:preferences:menu'); -var PreferencesMenu = React.createClass({ - mixins: [State], - render: function() { - var menuItems = [{ +export default class PreferencesMenu extends React.Component { + static contextTypes = { + router: React.PropTypes.func + }; + + render() { + const menuItems = [{ payload: '1', text: 'General', href: '#/hero/preferences/general', @@ -27,15 +29,15 @@ var PreferencesMenu = React.createClass({ href: '#/hero/preferences/images', selected: this.isActive('/hero/preferences/images') }]; - var selectedIndex = _.findIndex(menuItems, 'selected'); + const selectedIndex = _.findIndex(menuItems, 'selected'); - var style = { + const style = { height: 160 }; debug('render'); - // TODO fix menu height (pr) + // TODO: fix menu height (pr) return (
); - }, - _onItemClick: function(event, index, item) { - // TODO this is hack untill menuitem will support href + } + _onItemClick(e, index, item) { + // TODO: this is hack untill menuitem will support href document.location = item.href; } -}); - -module.exports = PreferencesMenu; +} diff --git a/public/src/app/components/hero/preferences/security-form.jsx b/public/src/app/components/hero/preferences/security-form.jsx index b1842c0..d9dc83c 100644 --- a/public/src/app/components/hero/preferences/security-form.jsx +++ b/public/src/app/components/hero/preferences/security-form.jsx @@ -1,24 +1,20 @@ -var React = require('react'); -var mui = require('material-ui'); -var _ = require('lodash'); +import React from 'react'; +import { TextField, RaisedButton } from 'material-ui'; +import _ from 'lodash'; -var debug = require('debug')('game:components:hero:preferences:security-form'); +import debugLib from '../../../lib/debug'; -var HeroService = require('../../../services/hero-service'); -var mediator = require('../../../mediator'); -var actionTypes = require('../../../constants/action-types'); +import HeroService from '../../../services/hero-service'; +import mediator from '../../../mediator'; +import actionTypes from '../../../constants/action-types'; -var TextField = mui.TextField; -var RaisedButton = mui.RaisedButton; +const debug = debugLib('components:hero:preferences:security-form'); -var HeroPreferencesGeneralForm = React.createClass({ - getInitialState: function() { - return { - errors: {} - }; - }, - render: function() { - var errors = this.state.errors; +export default class HeroPreferencesGeneralForm extends React.Component { + state = { errors: {} }; + + render() { + const errors = this.state.errors; debug('render'); return ( @@ -50,25 +46,24 @@ var HeroPreferencesGeneralForm = React.createClass({ ); - }, - _validate: function() { - var refs = this.refs; - var newPassword = refs.newPassword.getValue(); - var repeateNewPassword = refs.repeateNewPassword.getValue(); - var errors = {}; + } + _validate() { + const refs = this.refs; + const newPassword = refs.newPassword.getValue(); + const repeateNewPassword = refs.repeateNewPassword.getValue(); + const errors = {}; if (newPassword !== repeateNewPassword) { errors.repeateNewPassword = 'Repeate password doesn\'t match'; } return errors; - }, - _onSubmit: function(e) { + } + _onSubmit(e) { e.preventDefault(); - var refs = this.refs; - var data; - var errors = this._validate(); + const refs = this.refs; + const errors = this._validate(); if (!_.isEmpty(errors)) { this.setState({ @@ -77,18 +72,18 @@ var HeroPreferencesGeneralForm = React.createClass({ return; } - data = { + const data = { password: refs.password.getValue(), newPassword: refs.newPassword.getValue() }; HeroService.changePassword(data) - .then(function() { + .then(() => { mediator.emit(actionTypes.MESSAGE, 'Password changed'); this.setState({ errors: {} }); - }.bind(this), function(res) { + }, (res) => { if (res.status === 422) { this.setState({ errors: { @@ -96,8 +91,6 @@ var HeroPreferencesGeneralForm = React.createClass({ } }); } - }.bind(this)); - }, -}); - -module.exports = HeroPreferencesGeneralForm; + }); + } +} diff --git a/public/src/app/components/info.jsx b/public/src/app/components/info.jsx index 9653ae0..3d8d862 100644 --- a/public/src/app/components/info.jsx +++ b/public/src/app/components/info.jsx @@ -1,12 +1,12 @@ -var React = require('react'); -var mui = require('material-ui'); -var _ = require('lodash'); +import React from 'react'; +import { FontIcon } from 'material-ui'; +import _ from 'lodash'; -var debug = require('debug')('game:components:info'); +import debugLib from '../lib/debug'; -var HeroStore = require('../stores/hero-store'); +import HeroStore from '../stores/hero-store'; -var FontIcon = mui.FontIcon; +const debug = debugLib('components:info'); function getInfoState() { return { @@ -15,29 +15,29 @@ function getInfoState() { }; } -var Info = React.createClass({ - getInitialState: function() { - return getInfoState(); - }, - componentDidMount: function() { +export default class Info extends React.Component { + state = getInfoState(); + componentDidMount() { HeroStore.addChangeListener(this._onChange); - }, - componentWillUnmount: function() { + } + + componentWillUnmount() { HeroStore.removeChangeListener(this._onChange); window.clearInterval(this._setHpInterval); - }, - _onChange: function() { + } + + _onChange() { this.setState(getInfoState()); window.clearInterval(this._setHpInterval); this._setHpInterval = window.setInterval(this._setHp, 1000); this._setHp(); - }, - _setHp: function() { - var hp = this.state.hero.feature.hp; + } - var time = new Date().getTime(); - var delay = 1000; + _setHp() { + const hp = this.state.hero.feature.hp; + const time = new Date().getTime(); + const delay = 1000; hp.current = Number(hp.current); hp.time = new Date(hp.time).getTime(); @@ -59,14 +59,14 @@ var Info = React.createClass({ this.setState({ currentHp: hp.current }); - }, - render: function() { - var hero = this.state.hero; + } + render() { + const hero = this.state.hero; // TODO change lodash to modules if (_.isEmpty(hero)) return null; - var hp = hero.feature.hp; + const hp = hero.feature.hp; debug('render'); @@ -90,6 +90,4 @@ var Info = React.createClass({ ); } -}); - -module.exports = Info; +} diff --git a/public/src/app/components/island.jsx b/public/src/app/components/island.jsx index 66f8a34..0ac5b09 100644 --- a/public/src/app/components/island.jsx +++ b/public/src/app/components/island.jsx @@ -1,20 +1,19 @@ -var React = require('react'); -var mui = require('material-ui'); -var isEmpty = require('is-object-empty'); -var assign = require('object-assign'); -var arrayContains = require('array-contains'); +import React from 'react'; +import { Paper, FontIcon } from 'material-ui'; +import isEmpty from 'is-object-empty'; +import assign from 'object-assign'; +import arrayContains from 'array-contains'; -var IslandStore = require('../stores/island-store'); -var HeroStore = require('../stores/hero-store'); -var HeroApi = require('../utils/hero-api'); -var mediator = require('../mediator'); -var actionTypes = require('../constants/action-types'); -var applicationConfig = require('../config/application'); +import IslandStore from '../stores/island-store'; +import HeroStore from '../stores/hero-store'; +import HeroApi from '../utils/hero-api'; +import mediator from '../mediator'; +import actionTypes from '../constants/action-types'; +import applicationConfig from '../config/application'; -var debug = require('debug')('game:components:island'); +import debugLib from '../lib/debug'; -var Paper = mui.Paper; -var FontIcon = mui.FontIcon; +const debug = debugLib('components:island'); function getIslandState() { return { @@ -28,52 +27,51 @@ function getHeroState() { }; } -var Island = React.createClass({ - getInitialState: function() { - return assign({ moveTime: 0 }, - getIslandState(), - getHeroState() - ); - }, - componentDidMount: function() { +export default class Island extends React.Component { + state = assign({ moveTime: 0 }, + getIslandState(), + getHeroState() + ); + + componentDidMount() { IslandStore.addChangeListener(this._onChangeIsland); HeroStore.addChangeListener(this._onChangeHero); - }, - componentWillUnmount: function() { + } + componentWillUnmount() { IslandStore.removeChangeListener(this._onChangeIsland); HeroStore.removeChangeListener(this._onChangeHero); window.clearInterval(this._moveInterval); - }, - _onChangeIsland: function() { + } + _onChangeIsland() { this.setState(getIslandState()); - }, - _onChangeHero: function() { + } + _onChangeHero() { this.setState(getHeroState()); - }, - render: function() { - var state = this.state; + } + render() { + const state = this.state; if (isEmpty(state.island) || isEmpty(state.hero)) return null; - var island = state.island; - var hero = state.hero; - var location = hero.location; + const island = state.island; + const hero = state.hero; + const location = hero.location; // TODO Think about where to get image dimensions on client or backend - var islandDimensions = { + const islandDimensions = { width: 1980, height: 1280 }; - var mapDimensions = { + const mapDimensions = { width: 960, height: 480 }; - var heroPosition = { + const heroPosition = { left: location.coordinateX * 20, top: location.coordinateY * 20 }; - var mapMargin = { + const mapMargin = { left: heroPosition.left - mapDimensions.width / 2, top: heroPosition.top - mapDimensions.height / 2 }; @@ -92,28 +90,28 @@ var Island = React.createClass({ mapDimensions.height - (islandDimensions.height - mapMargin.top); } - var style = { + const style = { overflow: 'hidden', height: mapDimensions.height, width: mapDimensions.width }; - var mapStyle = { + const mapStyle = { marginTop: -mapMargin.top, marginLeft: -mapMargin.left }; - var mapOffset = { + const mapOffset = { top: mapMargin.top / 20, left: mapMargin.left / 20 }; - var handlerStyle = { + const handlerStyle = { position: 'absolute', top: heroPosition.top - mapMargin.top - 10, left: heroPosition.left - mapMargin.left - 2 }; - var infoStyle = { + const infoStyle = { position: 'absolute', width: 150, height: 80, @@ -124,15 +122,15 @@ var Island = React.createClass({ textAlign: 'center' }; - var squares = []; - for(var i = 0; i < mapDimensions.width / 20; i++) { - for(var j = 0; j < mapDimensions.height / 20; j++) { - var x = (i + mapOffset.left); - var y = (j + mapOffset.top); - var coordX = location.coordinateX; - var coordY = location.coordinateY; + let squares = []; + for(let i = 0; i < mapDimensions.width / 20; i++) { + for(let j = 0; j < mapDimensions.height / 20; j++) { + const x = (i + mapOffset.left); + const y = (j + mapOffset.top); + const coordX = location.coordinateX; + const coordY = location.coordinateY; - var handled = ( + const handled = ( coordX - x === -1 && coordY - y === -1 || coordX - x === 0 && coordY - y === -1 || coordX - x === 1 && coordY - y === -1 || @@ -158,8 +156,8 @@ var Island = React.createClass({ width: 20, height: 20 }} - onClick={(handled) ? this._onMove.bind(null, x, y) : function(e) { - var style = e.target.style; + onClick={(handled) ? this._onMove.bind(null, x, y) : (e) => { + const style = e.target.style; style.background = (style.background === 'red') ? '' : 'red'; }} title={'x: ' + x + ' y: ' + y} /> @@ -204,20 +202,20 @@ var Island = React.createClass({ ); - }, - _onMove: function(x, y) { + } + _onMove(x, y) { if (arrayContains(this.state.island.disabledCoordinates, [x, y])) { mediator.emit(actionTypes.MESSAGE, 'You can\'t move there'); return; } - var counter = applicationConfig.islandMoveTime; + let counter = applicationConfig.islandMoveTime; this.setState({ moveTime: counter }); - this._moveInterval = window.setInterval(function() { + this._moveInterval = window.setInterval(() => { counter--; this.setState({ @@ -228,9 +226,9 @@ var Island = React.createClass({ window.clearInterval(this._moveInterval); HeroApi.moveOnIsland(x, y); } - }.bind(this) , 1000); - }, - _onCancelMove: function(e) { + } , 1000); + } + _onCancelMove(e) { e.preventDefault(); window.clearInterval(this._moveInterval); @@ -238,6 +236,4 @@ var Island = React.createClass({ moveTime: 0 }); } -}); - -module.exports = Island; +} diff --git a/public/src/app/components/menu.jsx b/public/src/app/components/menu.jsx index 040c1ae..8a12a8c 100644 --- a/public/src/app/components/menu.jsx +++ b/public/src/app/components/menu.jsx @@ -1,20 +1,23 @@ -var React = require('react'); -var mui = require('material-ui'); -var Router = require('react-router'); +import React from 'react'; +import { + Toolbar, + ToolbarGroup, + RaisedButton, + FontIcon, + IconButton +} from 'material-ui'; +import Router from 'react-router'; -var debug = require('debug')('game:components:menu'); +import debugLib from '../lib/debug'; -var Toolbar = mui.Toolbar; -var ToolbarGroup = mui.ToolbarGroup; +const debug = debugLib('components:menu'); -var RaisedButton = mui.RaisedButton; -var FontIcon = mui.FontIcon; -var State = Router.State; -var IconButton = mui.IconButton; +export default class Menu extends React.Component { + static contextTypes = { + router: React.PropTypes.func + }; -var HeroShowPage = React.createClass({ - mixins: [State], - render: function() { + render() { debug('render'); return ( @@ -61,6 +64,4 @@ var HeroShowPage = React.createClass({ ); } -}); - -module.exports = HeroShowPage; +} diff --git a/public/src/app/components/messages.jsx b/public/src/app/components/messages.jsx index 916e817..e455a82 100644 --- a/public/src/app/components/messages.jsx +++ b/public/src/app/components/messages.jsx @@ -1,40 +1,37 @@ -var React = require('react'); -var mui = require('material-ui'); -var _ = require('lodash'); -var debug = require('debug')('game:components:messages'); - -var mediator = require('../mediator'); -var actionTypes = require('../constants/action-types'); - -var Snackbar = mui.Snackbar; - -var Messages = React.createClass({ - getInitialState: function() { - return { - message: null - }; - }, - componentDidMount: function() { +import React from 'react'; +import { Snackbar } from 'material-ui'; +import _ from 'lodash'; +import debugLib from '../lib/debug'; + +import mediator from '../mediator'; +import actionTypes from '../constants/action-types'; + +const debug = debugLib('components:messages'); + +export default class Messages extends React.Component { + state = { message: null }; + + componentDidMount() { mediator.on(actionTypes.MESSAGE, this._setMessage); - }, - componentWillUnmount: function() { + } + componentWillUnmount() { mediator.removeListener(actionTypes.MESSAGE, this._setMessage); - }, - _setMessage: function(message) { + } + _setMessage(message) { debug('new message %s', message); // TODO hack because transition do another render // mediator render should be last - _.delay(function() { + _.delay(() => { this.setState({ message: message }); this.refs.message.dismiss(); this.refs.message.show(); - }.bind(this), 20); - }, - render: function() { - var message = this.state.message; + }, 20); + } + render() { + const message = this.state.message; if (!message) return null; @@ -49,10 +46,8 @@ var Messages = React.createClass({ action="Close" onActionTouchTap={this._onClose} /> ); - }, - _onClose: function() { + } + _onClose() { this.refs.message.dismiss(); } -}); - -module.exports = Messages; +} diff --git a/public/src/app/components/session/new-form.jsx b/public/src/app/components/session/new-form.jsx index 0df1c19..0fe3a9c 100644 --- a/public/src/app/components/session/new-form.jsx +++ b/public/src/app/components/session/new-form.jsx @@ -1,24 +1,19 @@ -var React = require('react'); -var Router = require('react-router'); -var mui = require('material-ui'); -var debug = require('debug')('game:components:session:new-form'); +import React from 'react'; +import { TextField, RaisedButton } from 'material-ui'; +import debugLib from '../../lib/debug'; -var SessionService = require('../../services/session-service'); +import SessionService from '../../services/session-service'; -var Navigation = Router.Navigation; +const debug = debugLib('components:session:new-form'); -var TextField = mui.TextField; -var RaisedButton = mui.RaisedButton; +export default class SessionNewForm extends React.Component { + // mixins: [Navigation], + state = { + error: null + }; -var SessionNewForm = React.createClass({ - mixins: [Navigation], - getInitialState: function() { - return { - error: null - }; - }, - render: function() { - var error = this.state.error; + render() { + const error = this.state.error; debug('render'); @@ -28,14 +23,14 @@ var SessionNewForm = React.createClass({ ref="login" errorText={error} name="login" - required + import hintText="Login" />

@@ -47,8 +42,8 @@ var SessionNewForm = React.createClass({ linkButton={true} /> ); - }, - _onSubmit: function(e) { + } + _onSubmit(e) { var refs = this.refs; var data; @@ -62,8 +57,7 @@ var SessionNewForm = React.createClass({ debug('submit %o', data); SessionService.new(data) - .then(function(res) { - /* jshint camelcase: false */ + .then((res) => { if (res.error) { this.setState({ error: res.error_description @@ -71,8 +65,6 @@ var SessionNewForm = React.createClass({ } this.transitionTo('hero'); - }.bind(this)); + }); } -}); - -module.exports = SessionNewForm; +} diff --git a/public/src/app/config/application.js b/public/src/app/config/application.js index 67ddaa1..a88a56f 100644 --- a/public/src/app/config/application.js +++ b/public/src/app/config/application.js @@ -1,4 +1,4 @@ -module.exports = { +export default { environment: 'development', islandMoveTime: 5 diff --git a/public/src/app/config/environment.js b/public/src/app/config/environment.js index 62415c6..c3bf4c6 100644 --- a/public/src/app/config/environment.js +++ b/public/src/app/config/environment.js @@ -1,4 +1,4 @@ -module.exports = { +export default { development: { api: { root: 'http://localhost:3001' diff --git a/public/src/app/config/io.js b/public/src/app/config/io.js index 8f81a92..b62ee0c 100644 --- a/public/src/app/config/io.js +++ b/public/src/app/config/io.js @@ -1,15 +1,17 @@ -var mediator = require('../mediator'); +import mediator from '../mediator'; -var debug = require('debug')('game:config:socket'); +import debugLib from '../lib/debug'; -module.exports = function(io) { +const debug = debugLib('config:socket'); + +export default (io) => { mediator.socket = io; - io.on('connect', function() { + io.on('connect', () => { debug('connected'); }); - io.on('disconnect', function() { + io.on('disconnect', () => { debug('disconnected'); }); }; diff --git a/public/src/app/constants/action-types.js b/public/src/app/constants/action-types.js index 8ae7953..92b7fb1 100644 --- a/public/src/app/constants/action-types.js +++ b/public/src/app/constants/action-types.js @@ -1,6 +1,6 @@ -var keyMirror = require('keymirror'); +import keyMirror from 'keymirror'; -module.exports = keyMirror({ +export default keyMirror({ MESSAGE: null, UNAUTHORIZED: null, CHAT_MESSAGE: null diff --git a/public/src/app/constants/hero-constants.js b/public/src/app/constants/hero-constants.js index b3bd69e..d0344a4 100644 --- a/public/src/app/constants/hero-constants.js +++ b/public/src/app/constants/hero-constants.js @@ -1,6 +1,6 @@ -var keyMirror = require('keymirror'); +import keyMirror from 'keymirror'; -module.exports = keyMirror({ +export default keyMirror({ HERO_RECEIVE: null, HERO_UPDATED: null, HERO_THING_REMOVED: null, diff --git a/public/src/app/constants/hero-image-constants.js b/public/src/app/constants/hero-image-constants.js index a5a7266..f7f47e3 100644 --- a/public/src/app/constants/hero-image-constants.js +++ b/public/src/app/constants/hero-image-constants.js @@ -1,5 +1,5 @@ -var keyMirror = require('keymirror'); +import keyMirror from 'keymirror'; -module.exports = keyMirror({ +export default keyMirror({ HERO_IMAGES_RECEIVE: null }); diff --git a/public/src/app/constants/island-constants.js b/public/src/app/constants/island-constants.js index 7b0e767..83fc317 100644 --- a/public/src/app/constants/island-constants.js +++ b/public/src/app/constants/island-constants.js @@ -1,5 +1,5 @@ -var keyMirror = require('keymirror'); +import keyMirror from 'keymirror'; -module.exports = keyMirror({ +export default keyMirror({ ISLAND_RECEIVE: null }); diff --git a/public/src/app/constants/skill-constants.js b/public/src/app/constants/skill-constants.js index 9e000f1..e8081c8 100644 --- a/public/src/app/constants/skill-constants.js +++ b/public/src/app/constants/skill-constants.js @@ -1,5 +1,5 @@ -var keyMirror = require('keymirror'); +import keyMirror from 'keymirror'; -module.exports = keyMirror({ +export default keyMirror({ SKILLS_RECEIVE: null }); diff --git a/public/src/app/helpers/session-helper.js b/public/src/app/helpers/session-helper.js index 128e326..4ffdf54 100644 --- a/public/src/app/helpers/session-helper.js +++ b/public/src/app/helpers/session-helper.js @@ -1,7 +1,7 @@ -var mediator = require('../mediator'); +import mediator from '../mediator'; -module.exports = { - isSignin: function() { +export default { + isSignin() { return mediator.accessToken !== null; } }; diff --git a/public/src/app/lib/debug.js b/public/src/app/lib/debug.js new file mode 100644 index 0000000..136b3d1 --- /dev/null +++ b/public/src/app/lib/debug.js @@ -0,0 +1,3 @@ +import debug from 'debug'; + +export default (namespace) => debug(`game:${namespace}`); diff --git a/public/src/app/lib/dom.js b/public/src/app/lib/dom.js index 9a02e2e..280ed41 100644 --- a/public/src/app/lib/dom.js +++ b/public/src/app/lib/dom.js @@ -1,7 +1,5 @@ -'use strict'; - -module.exports = { - on: function(el, type, callback) { +export default { + on(el, type, callback) { if (el.length) { for(let i = 0; i < el.length; i++) { this.on(el[i], type, callback); @@ -12,7 +10,7 @@ module.exports = { el.attachEvent('on' + type, callback.bind(el)); } }, - off: function(el, type, callback) { + off(el, type, callback) { if (el.removeEventListener) { el.removeEventListener(type, callback); } else { diff --git a/public/src/app/lib/fetch.js b/public/src/app/lib/fetch.js index 6bf1619..f0f1489 100644 --- a/public/src/app/lib/fetch.js +++ b/public/src/app/lib/fetch.js @@ -1,13 +1,15 @@ -var debug = require('debug')('game:lib:superagent'); +import debugLib from '../lib/debug'; -var config = require('../config/application'); -var environmentConfig = require('../config/environment'); +import config from '../config/application'; +import environmentConfig from '../config/environment'; -var mediator = require('../mediator'); -var actionTypes = require('../constants/action-types'); +import mediator from '../mediator'; +import actionTypes from '../constants/action-types'; -module.exports = function(url, options) { - var accessToken = mediator.accessToken; +const debug = debugLib('lib:superagent'); + +export default (url, options) => { + const accessToken = mediator.accessToken; options = options || {}; options.headers = options.headers || {}; diff --git a/public/src/app/lib/utils.js b/public/src/app/lib/utils.js index bc2cca8..3a83fcf 100644 --- a/public/src/app/lib/utils.js +++ b/public/src/app/lib/utils.js @@ -1,8 +1,6 @@ -'use strict'; - -module.exports = { - validationMapper: function(body) { - var errors = {}; +export default { + validationMapper(body) { + let errors = {}; for(let key in body.errors) { let error = body.errors[key]; diff --git a/public/src/app/mediator.js b/public/src/app/mediator.js index a3ff91c..6480aaf 100644 --- a/public/src/app/mediator.js +++ b/public/src/app/mediator.js @@ -1,10 +1,8 @@ -var EventEmitter = require('events').EventEmitter; -var assign = require('object-assign'); +import { EventEmitter } from 'events'; +import assign from 'object-assign'; -var mediator = assign(new EventEmitter(), { +export default assign(new EventEmitter(), { accessToken: window.localStorage.getItem('accessToken'), currentUser: null, socket: null }); - -module.exports = mediator; diff --git a/public/src/app/pages/hero/inventory.jsx b/public/src/app/pages/hero/inventory.jsx index 70a3cdd..c9a4eac 100644 --- a/public/src/app/pages/hero/inventory.jsx +++ b/public/src/app/pages/hero/inventory.jsx @@ -1,15 +1,17 @@ -var React = require('react'); +import React from 'react'; -var debug = require('debug')('game:pages:hero:inventory'); +import debugLib from '../../lib/debug'; -var AuthMixin = require('../mixins/auth'); +import AuthMixin from '../mixins/auth'; -var HeroBody = require('../../components/hero/body'); -var HeroInventory = require('../../components/hero/inventory'); +import HeroBody from '../../components/hero/body'; +import HeroInventory from '../../components/hero/inventory'; -var HeroInventoryPage = React.createClass({ - mixins: [AuthMixin], - render: function() { +const debug = debugLib('pages:hero:inventory'); + +export default class HeroInventoryPage extends React.Component { + // mixins: [AuthMixin], + render() { debug('render'); return ( @@ -34,6 +36,4 @@ var HeroInventoryPage = React.createClass({ ); } -}); - -module.exports = HeroInventoryPage; +} diff --git a/public/src/app/pages/hero/new.jsx b/public/src/app/pages/hero/new.jsx index 19e91e7..1ff5f86 100644 --- a/public/src/app/pages/hero/new.jsx +++ b/public/src/app/pages/hero/new.jsx @@ -1,10 +1,11 @@ -var React = require('react'); -var debug = require('debug')('game:pages:hero:new'); +import React from 'react'; +import Form from '../../components/hero/new-form'; +import debugLib from '../../lib/debug'; -var Form = require('../../components/hero/new-form'); +const debug = debugLib('pages:hero:new'); -var HeroNewPage = React.createClass({ - render: function() { +export default class HeroNewPage extends React.Component { + render() { debug('render'); return ( @@ -15,6 +16,4 @@ var HeroNewPage = React.createClass({ ); } -}); - -module.exports = HeroNewPage; +} diff --git a/public/src/app/pages/hero/preferences/general.jsx b/public/src/app/pages/hero/preferences/general.jsx index 94f31fe..fdb4a92 100644 --- a/public/src/app/pages/hero/preferences/general.jsx +++ b/public/src/app/pages/hero/preferences/general.jsx @@ -1,11 +1,11 @@ -var React = require('react'); +import React from 'react'; +import debugLib from '../../../lib/debug'; +import Form from '../../../components/hero/preferences/general-form'; -var debug = require('debug')('game:pages:hero:preferences:general'); +const debug = debugLib('pages:hero:preferences:general'); -var Form = require('../../../components/hero/preferences/general-form'); - -var HeroPreferencesGeneralPage = React.createClass({ - render: function() { +export default class HeroPreferencesGeneralPage extends React.Component { + render() { debug('render'); return ( @@ -15,6 +15,4 @@ var HeroPreferencesGeneralPage = React.createClass({ ); } -}); - -module.exports = HeroPreferencesGeneralPage; +} diff --git a/public/src/app/pages/hero/preferences/images.jsx b/public/src/app/pages/hero/preferences/images.jsx index 935233a..b3c67d6 100644 --- a/public/src/app/pages/hero/preferences/images.jsx +++ b/public/src/app/pages/hero/preferences/images.jsx @@ -1,16 +1,16 @@ -var React = require('react'); +import React from 'react'; -var debug = require('debug')('game:pages:hero:preferences:images'); +import debugLib from '../../../lib/debug'; +import HeroImageApi from '../../../utils/hero-image-api'; +import Form from '../../../components/hero/preferences/images-form'; -var HeroImageApi = require('../../../utils/hero-image-api'); +const debug = debugLib('pages:hero:preferences:images'); -var Form = require('../../../components/hero/preferences/images-form'); - -var HeroPreferencesImagesPage = React.createClass({ - componentDidMount: function() { +export default class HeroPreferencesImagesPage extends React.Component { + componentDidMount() { HeroImageApi.fetch(); - }, - render: function() { + } + render() { debug('render'); return ( @@ -20,6 +20,4 @@ var HeroPreferencesImagesPage = React.createClass({ ); } -}); - -module.exports = HeroPreferencesImagesPage; +} diff --git a/public/src/app/pages/hero/preferences/master.jsx b/public/src/app/pages/hero/preferences/master.jsx index bed0f66..e1b0eed 100644 --- a/public/src/app/pages/hero/preferences/master.jsx +++ b/public/src/app/pages/hero/preferences/master.jsx @@ -1,19 +1,21 @@ -var React = require('react'); -var Router = require('react-router'); +import React from 'react'; +import { RouteHandler } from 'react-router'; -var debug = require('debug')('game:pages:hero:preferences:master'); +import debugLib from '../../../lib/debug'; -var Menu = require('../../../components/hero/preferences/menu'); -var AuthMixin = require('../../mixins/auth'); +import Menu from '../../../components/hero/preferences/menu'; +import AuthMixin from '../../mixins/auth'; -var RouteHandler = Router.RouteHandler; -var State = Router.State; +const debug = debugLib('pages:hero:preferences:master'); -var Master = React.createClass({ - mixins: [AuthMixin, State], - render: function() { +export default class HeroPreferencesMaster extends React.Component { + // mixins: [AuthMixin, State], + static contextTypes = { + router: React.PropTypes.func + }; + render() { - debug('master render %s', this.getPath()); + debug('master render %s', this.getCurrentPath()); return (
); } -}); - -module.exports = Master; +} diff --git a/public/src/app/pages/hero/preferences/security.jsx b/public/src/app/pages/hero/preferences/security.jsx index 15cfb6a..7c33d96 100644 --- a/public/src/app/pages/hero/preferences/security.jsx +++ b/public/src/app/pages/hero/preferences/security.jsx @@ -1,11 +1,11 @@ -var React = require('react'); +import React from 'react'; +import debugLib from '../../../lib/debug'; +import Form from '../../../components/hero/preferences/security-form'; -var debug = require('debug')('game:pages:hero:preferences:security'); +const debug = debugLib('pages:hero:preferences:security'); -var Form = require('../../../components/hero/preferences/security-form'); - -var HeroPreferencesSecurityPage = React.createClass({ - render: function() { +export default class HeroPreferencesSecurityPage extends React.Component { + render() { debug('render'); @@ -16,6 +16,4 @@ var HeroPreferencesSecurityPage = React.createClass({
); } -}); - -module.exports = HeroPreferencesSecurityPage; +} diff --git a/public/src/app/pages/hero/show.jsx b/public/src/app/pages/hero/show.jsx index 5bb2453..d69aa98 100644 --- a/public/src/app/pages/hero/show.jsx +++ b/public/src/app/pages/hero/show.jsx @@ -1,18 +1,20 @@ -var React = require('react'); -var debug = require('debug')('game:pages:hero:show'); +import React from 'react'; +import debugLib from '../../lib/debug'; -var SkillApi = require('../../utils/skill-api'); -var AuthMixin = require('../mixins/auth'); +import SkillApi from '../../utils/skill-api'; +import AuthMixin from '../mixins/auth'; -var HeroBody = require('../../components/hero/body'); -var HeroInfo = require('../../components/hero/info'); +import HeroBody from '../../components/hero/body'; +import HeroInfo from '../../components/hero/info'; -var HeroShowPage = React.createClass({ - mixins: [AuthMixin], - componentDidMount: function() { +const debug = debugLib('pages:hero:show'); + +export default class HeroShowPage extends React.Component { + // mixins: [AuthMixin], + componentDidMount() { SkillApi.fetch(); - }, - render: function() { + } + render() { debug('render'); return ( @@ -37,6 +39,4 @@ var HeroShowPage = React.createClass({ ); } -}); - -module.exports = HeroShowPage; +} diff --git a/public/src/app/pages/home.jsx b/public/src/app/pages/home.jsx index 30ffdb5..c703507 100644 --- a/public/src/app/pages/home.jsx +++ b/public/src/app/pages/home.jsx @@ -1,10 +1,12 @@ -var React = require('react'); -var debug = require('debug')('game:pages:home'); +import React from 'react'; +import debugLib from '../lib/debug'; -var SessionNewForm = require('../components/session/new-form'); +import SessionNewForm from '../components/session/new-form'; -var HomePage = React.createClass({ - render: function() { +const debug = debugLib('pages:home'); + +export default class HomePage extends React.Component { + render() { debug('render'); return ( @@ -14,6 +16,4 @@ var HomePage = React.createClass({ ); } -}); - -module.exports = HomePage; +} diff --git a/public/src/app/pages/island.jsx b/public/src/app/pages/island.jsx index 95cba1f..e2acfd2 100644 --- a/public/src/app/pages/island.jsx +++ b/public/src/app/pages/island.jsx @@ -1,18 +1,18 @@ -var React = require('react'); +import React from 'react'; -var IslandApi = require('../utils/island-api'); -var Island = require('../components/island'); +import IslandApi from '../utils/island-api'; +import Island from '../components/island'; -var debug = require('debug')('game:pages:island'); +import debugLib from '../lib/debug'; -var AuthMixin = require('./mixins/auth'); +const debug = debugLib('pages:island'); -var IslandPage = React.createClass({ - mixins: [AuthMixin], - componentDidMount: function() { +export default class IslandPage extends React.Component { + // TODO: mixins: [AuthMixin], + componentDidMount() { IslandApi.fetch(); - }, - render: function() { + } + render() { debug('render'); return ( @@ -21,6 +21,4 @@ var IslandPage = React.createClass({ ); } -}); - -module.exports = IslandPage; +} diff --git a/public/src/app/pages/master.jsx b/public/src/app/pages/master.jsx index 6b2251c..2d2657e 100644 --- a/public/src/app/pages/master.jsx +++ b/public/src/app/pages/master.jsx @@ -1,24 +1,39 @@ -var React = require('react'); -var Router = require('react-router'); +import React from 'react'; +import { RouteHandler } from 'react-router'; +import mui from 'material-ui'; -var Header = require('../components/header'); -var Footer = require('../components/footer'); -var Messages = require('../components/messages'); -var Chat = require('../components/chat/index'); +import Header from '../components/header'; +import Footer from '../components/footer'; +import Messages from '../components/messages'; +import Chat from '../components/chat/index'; -var debug = require('debug')('game:pages:master'); +import debugLib from '../lib/debug' -var RouteHandler = Router.RouteHandler; -var State = Router.State; -var Navigation = Router.Navigation; +const debug = debugLib('pages:master'); -var Master = React.createClass({ - mixins: [State, Navigation], - render: function() { - var container; - var inside = !this.isActive('/heroes/new') && !this.isActive('/'); +const ThemeManager = new mui.Styles.ThemeManager(); - debug('master render %s', this.getPath()); +export default class Master extends React.Component { + static contextTypes = { + router: React.PropTypes.func + }; + + static childContextTypes = { + muiTheme: React.PropTypes.object + }; + + getChildContext() { + return { + muiTheme: ThemeManager.getCurrentTheme() + }; + } + + render() { + let container; + const router = this.context.router; + const inside = !router.isActive('/heroes/new') && !router.isActive('/'); + + debug('master render %s', router.getCurrentPath()); if (inside) { container = ( @@ -50,6 +65,4 @@ var Master = React.createClass({ ); } -}); - -module.exports = Master; +} diff --git a/public/src/app/routes.jsx b/public/src/app/routes.jsx index dbc0aa2..1421f2f 100644 --- a/public/src/app/routes.jsx +++ b/public/src/app/routes.jsx @@ -1,22 +1,22 @@ -var React = require('react'); -var Router = require('react-router'); +import React from 'react'; +import Router from 'react-router'; -var Master = require('./pages/master'); -var Home = require('./pages/home'); -var HeroNewPage = require('./pages/hero/new'); -var HeroShowPage = require('./pages/hero/show'); -var HeroInventoryPage = require('./pages/hero/inventory'); +import Master from './pages/master'; +import Home from './pages/home'; +import HeroNewPage from './pages/hero/new'; +import HeroShowPage from './pages/hero/show'; +import HeroInventoryPage from './pages/hero/inventory'; -var HeroPreferencesMaster = require('./pages/hero/preferences/master'); -var HeroPreferencesGeneralPage = require('./pages/hero/preferences/general'); -var HeroPreferencesSecurityPage = require('./pages/hero/preferences/security'); -var HeroPreferencesImagesPage = require('./pages/hero/preferences/images'); +import HeroPreferencesMaster from './pages/hero/preferences/master'; +import HeroPreferencesGeneralPage from './pages/hero/preferences/general'; +import HeroPreferencesSecurityPage from './pages/hero/preferences/security'; +import HeroPreferencesImagesPage from './pages/hero/preferences/images'; -var IslandPage = require('./pages/island'); +import IslandPage from './pages/island'; -var Route = Router.Route; +const Route = Router.Route; -var routes = ( +export default ( @@ -30,5 +30,3 @@ var routes = ( ); - -module.exports = routes; diff --git a/public/src/app/services/hero-image-service.js b/public/src/app/services/hero-image-service.js index dbefd91..13ab800 100644 --- a/public/src/app/services/hero-image-service.js +++ b/public/src/app/services/hero-image-service.js @@ -1,12 +1,14 @@ -var fetch = require('../lib/fetch'); -var debug = require('debug')('game:services:hero-image'); +import fetch from '../lib/fetch'; +import debugLib from '../lib/debug'; + +const debug = debugLib('services:hero-image'); module.exports = { - fetch: function() { + fetch() { debug('fetching request'); return fetch('/hero-images') - .then(function(response) { + .then((response) => { debug('fetched'); return response; }); diff --git a/public/src/app/services/hero-service.js b/public/src/app/services/hero-service.js index 3505b35..961ac1c 100644 --- a/public/src/app/services/hero-service.js +++ b/public/src/app/services/hero-service.js @@ -1,35 +1,37 @@ -var fetch = require('../lib/fetch'); -var debug = require('debug')('game:services:hero'); -var mediator = require('../mediator'); -var makeUrl = require('make-url'); -var assign = require('object-assign'); - -module.exports = { - new: function(data) { +import fetch from '../lib/fetch'; +import debugLib from '../lib/debug'; +import mediator from '../mediator'; +import makeUrl from 'make-url'; +import assign from 'object-assign'; + +const debug = debugLib('services:hero'); + +export default { + new(data) { debug('new request %o', data); return fetch('/heroes', { method: 'POST', body: data - }).then(function(response) { - debug('created'); - return response; - }); + }).then((response) => { + debug('created'); + return response; + }); }, - fetch: function() { + fetch() { debug('fetching request'); return fetch('/heroes/me') - .then(function(response) { + .then((response) => { debug('fetched'); mediator.currentUser = response; return response; }); }, - increase: function(area) { - var idOrName = arguments[1]; + increase(area) { + const idOrName = arguments[1]; debug('increasing request %s %s', area, idOrName); @@ -38,114 +40,114 @@ module.exports = { idOrName: idOrName }), { method: 'PUT' - }).then(function() { - debug('increased'); - }); + }).then(() => { + debug('increased'); + }); }, - update: function(data) { + update(data) { debug('update hero %o', data); return fetch('/heroes/me', { method: 'PATCH', body: data - }).then(function() { - mediator.currentUser = assign(mediator.currentUser, data); - debug('updated'); - }); + }).then(() => { + mediator.currentUser = assign(mediator.currentUser, data); + debug('updated'); + }); }, - changePassword: function(data) { + changePassword(data) { debug('update hero password %o', data); return fetch('/heroes/me/change-password', { method: 'PUT', body: data - }).then(function() { - debug('updated password'); - }); + }).then(() => { + debug('updated password'); + }); }, - removeThing: function(id) { + removeThing(id) { debug('removing thing %s', id); return fetch(makeUrl('/heroes/me/things/:id', id), { method: 'DELETE' - }).then(function() { - debug('thing removed %s', id); - }); + }).then(() => { + debug('thing removed %s', id); + }); }, - dressThing: function(id) { + dressThing(id) { debug('dress thing %s', id); return fetch(makeUrl('/heroes/me/things/:id/dress', id), { method: 'PUT' - }).then(function() { - debug('thing dressed %s', id); - }); + }).then(() => { + debug('thing dressed %s', id); + }); }, - undressThing: function(id) { + undressThing(id) { debug('undress thing %s', id); return fetch(makeUrl('/heroes/me/things/:id/undress', id), { method: 'PUT' - }).then(function() { - debug('thing undressed %s', id); - }); + }).then(() => { + debug('thing undressed %s', id); + }); }, - undressThings: function() { + undressThings() { debug('undress things'); return fetch('/heroes/me/things/undress', { method: 'PUT' - }).then(function() { - debug('things undressed'); - }); + }).then(() => { + debug('things undressed'); + }); }, - newComplect: function(data) { + newComplect(data) { debug('new complect %o', data); return fetch('/heroes/me/complects', { method: 'POST', body: data - }).then(function(response) { - debug('created'); + }).then((response) => { + debug('created'); - return response; - }); + return response; + }); }, - deleteComplect: function(id) { + deleteComplect(id) { debug('delete complect %s', id); return fetch(makeUrl('/heroes/me/complects/:id', id), { method: 'DELETE' - }).then(function() { - debug('complect deleted %s', id); - }); + }).then(() => { + debug('complect deleted %s', id); + }); }, - applyComplect: function(id) { + applyComplect(id) { debug('appling complect %s', id); return fetch(makeUrl('/heroes/me/complects/:id/apply', id), { method: 'PUT' - }).then(function() { - debug('complect applied %s', id); - }); + }).then(() => { + debug('complect applied %s', id); + }); }, - moveOnIsland: function(x, y) { + moveOnIsland(x, y) { debug('move on island to %s:%s', x, y); return fetch(makeUrl('/heroes/me/island/move/:x/:y', x, y), { method: 'PUT' - }).then(function() { - debug('moved on island to %s:%s', x, y); - }); + }).then(() => { + debug('moved on island to %s:%s', x, y); + }); } }; diff --git a/public/src/app/services/island-service.js b/public/src/app/services/island-service.js index 36c8547..fe4a831 100644 --- a/public/src/app/services/island-service.js +++ b/public/src/app/services/island-service.js @@ -1,12 +1,14 @@ -var fetch = require('../lib/fetch'); -var debug = require('debug')('game:services:island'); +import fetch from '../lib/fetch'; +import debugLib from '../lib/debug' -module.exports = { - fetch: function() { +const debug = debugLib('services:island'); + +export default { + fetch() { debug('fetching request'); return fetch('/island') - .then(function(response) { + .then((response) => { debug('fetched'); return response; diff --git a/public/src/app/services/session-service.js b/public/src/app/services/session-service.js index dbc7efe..f026f76 100644 --- a/public/src/app/services/session-service.js +++ b/public/src/app/services/session-service.js @@ -1,10 +1,13 @@ -var fetch = require('../lib/fetch'); -var store = require('store'); -var debug = require('debug')('game:services:session'); -var mediator = require('../mediator'); +import fetch from '../lib/fetch'; +import store from 'store'; +import mediator from '../mediator'; -module.exports = { - new: function(data) { +import debugLib from '../lib/debug'; + +const debug = debugLib('services:session'); + +export default { + new(data) { data = { 'grant_type': 'password', 'client_id': 'test', @@ -14,18 +17,19 @@ module.exports = { }; debug('new request %o', data); + return fetch('/oauth/token', { method: 'POST', body: data - }).then(function(response) { - var accessToken = response.access_token; + }).then((response) => { + const accessToken = response.access_token; - if (accessToken) { - store.set('accessToken', accessToken); - debug('get access token %s', accessToken); + if (accessToken) { + store.set('accessToken', accessToken); + debug('get access token %s', accessToken); - mediator.accessToken = accessToken; - } - }); + mediator.accessToken = accessToken; + } + }); } }; diff --git a/public/src/app/services/skill-service.js b/public/src/app/services/skill-service.js index e3ad63f..ae9da82 100644 --- a/public/src/app/services/skill-service.js +++ b/public/src/app/services/skill-service.js @@ -1,12 +1,14 @@ -var fetch = require('../lib/fetch'); -var debug = require('debug')('game:services:skill'); +import fetch from '../lib/fetch'; +import debugLib from '../lib/debug' -module.exports = { - fetch: function() { +const debug = debugLib('services:skill'); + +export default { + fetch() { debug('fetching request'); return fetch('/skills') - .then(function(response) { + .then((response) => { debug('fetched'); return response; diff --git a/public/src/app/stores/hero-image-store.js b/public/src/app/stores/hero-image-store.js index 110a8a8..84efce7 100644 --- a/public/src/app/stores/hero-image-store.js +++ b/public/src/app/stores/hero-image-store.js @@ -1,41 +1,43 @@ -var AppDispatcher = require('../app-dispatcher'); -var EventEmitter = require('events').EventEmitter; -var assign = require('object-assign'); +import AppDispatcher from '../app-dispatcher'; +import { EventEmitter } from 'events'; +import assign from 'object-assign'; -var HeroImageConstants = require('../constants/hero-image-constants'); +import HeroImageConstants from '../constants/hero-image-constants'; -var debug = require('debug')('game:stores:hero-images'); +import debugLib from '../lib/debug'; -var CHANGE_EVENT = 'change'; +const debug = debugLib('stores:hero-images'); -var _heroImages = []; +const CHANGE_EVENT = 'change'; + +let _heroImages = []; function loadData(data) { _heroImages = data; debug('data loaded'); } -var HeroImageStore = assign({}, EventEmitter.prototype, { - get: function() { +const HeroImageStore = assign({}, EventEmitter.prototype, { + get() { return _heroImages; }, - emitChange: function() { + emitChange() { debug('changed'); this.emit(CHANGE_EVENT); }, - addChangeListener: function(callback) { + addChangeListener(callback) { this.on(CHANGE_EVENT, callback); }, - removeChangeListener: function(callback) { + removeChangeListener(callback) { this.removeListener(CHANGE_EVENT, callback); } }); -AppDispatcher.register(function(payload) { - var action = payload.action; +AppDispatcher.register((payload) => { + const action = payload.action; switch(action.actionType) { case HeroImageConstants.HERO_IMAGES_RECEIVE: @@ -51,4 +53,4 @@ AppDispatcher.register(function(payload) { return true; }); -module.exports = HeroImageStore; +export default HeroImageStore; diff --git a/public/src/app/stores/hero-store.js b/public/src/app/stores/hero-store.js index 916fd0f..30c9b3b 100644 --- a/public/src/app/stores/hero-store.js +++ b/public/src/app/stores/hero-store.js @@ -1,15 +1,17 @@ -var AppDispatcher = require('../app-dispatcher'); -var EventEmitter = require('events').EventEmitter; -var assign = require('object-assign'); -var _ = require('lodash'); +import AppDispatcher from '../app-dispatcher'; +import { EventEmitter } from 'events'; +import assign from 'object-assign'; +import _ from 'lodash'; -var debug = require('debug')('game:stores:hero'); +import debugLib from '../lib/debug'; -var HeroConstants = require('../constants/hero-constants'); +import HeroConstants from '../constants/hero-constants'; -var CHANGE_EVENT = 'change'; +const debug = debugLib('stores:hero'); -var _hero = {}; +const CHANGE_EVENT = 'change'; + +let _hero = {}; function loadData(data) { _hero = data; @@ -50,27 +52,27 @@ function movedOnIsland(x, y) { _hero.location.coordinateY = y; } -var HeroStore = assign({}, EventEmitter.prototype, { - get: function() { +const HeroStore = assign({}, EventEmitter.prototype, { + get() { return _hero; }, - emitChange: function() { + emitChange() { debug('changed'); this.emit(CHANGE_EVENT); }, - addChangeListener: function(callback) { + addChangeListener(callback) { this.on(CHANGE_EVENT, callback); }, - removeChangeListener: function(callback) { + removeChangeListener(callback) { this.removeListener(CHANGE_EVENT, callback); } }); -AppDispatcher.register(function(payload) { - var action = payload.action; +AppDispatcher.register((payload) => { + const action = payload.action; switch(action.actionType) { case HeroConstants.HERO_RECEIVE: @@ -101,4 +103,4 @@ AppDispatcher.register(function(payload) { return true; }); -module.exports = HeroStore; +export default HeroStore; diff --git a/public/src/app/stores/island-store.js b/public/src/app/stores/island-store.js index 9830296..2368d09 100644 --- a/public/src/app/stores/island-store.js +++ b/public/src/app/stores/island-store.js @@ -1,14 +1,16 @@ -var AppDispatcher = require('../app-dispatcher'); -var EventEmitter = require('events').EventEmitter; -var assign = require('object-assign'); +import AppDispatcher from '../app-dispatcher'; +import { EventEmitter } from 'events'; +import assign from 'object-assign'; -var debug = require('debug')('game:stores:island'); +import debugLib from '../lib/debug'; -var IslandConstants = require('../constants/island-constants'); +import IslandConstants from '../constants/island-constants'; -var CHANGE_EVENT = 'change'; +const debug = debugLib('stores:island'); -var _island = {}; +const CHANGE_EVENT = 'change'; + +let _island = {}; function loadData(data) { _island = data; @@ -16,26 +18,26 @@ function loadData(data) { } var IslandStore = assign({}, EventEmitter.prototype, { - get: function() { + get() { return _island; }, - emitChange: function() { + emitChange() { debug('changed'); this.emit(CHANGE_EVENT); }, - addChangeListener: function(callback) { + addChangeListener(callback) { this.on(CHANGE_EVENT, callback); }, - removeChangeListener: function(callback) { + removeChangeListener(callback) { this.removeListener(CHANGE_EVENT, callback); } }); -AppDispatcher.register(function(payload) { - var action = payload.action; +AppDispatcher.register((payload) => { + const action = payload.action; switch(action.actionType) { case IslandConstants.ISLAND_RECEIVE: @@ -51,4 +53,4 @@ AppDispatcher.register(function(payload) { return true; }); -module.exports = IslandStore; +export default IslandStore; diff --git a/public/src/app/stores/skill-store.js b/public/src/app/stores/skill-store.js index f02738b..62688a5 100644 --- a/public/src/app/stores/skill-store.js +++ b/public/src/app/stores/skill-store.js @@ -1,14 +1,16 @@ -var AppDispatcher = require('../app-dispatcher'); -var EventEmitter = require('events').EventEmitter; -var assign = require('object-assign'); +import AppDispatcher from '../app-dispatcher'; +import { EventEmitter } from 'events'; +import assign from 'object-assign'; -var SkillConstants = require('../constants/skill-constants'); +import SkillConstants from '../constants/skill-constants'; -var debug = require('debug')('game:stores:skill'); +import debugLib from '../lib/debug'; -var CHANGE_EVENT = 'change'; +const debug = debugLib('stores:skill'); -var _skills = []; +const CHANGE_EVENT = 'change'; + +let _skills = []; function loadData(data) { _skills = data; @@ -16,26 +18,26 @@ function loadData(data) { } var SkillStore = assign({}, EventEmitter.prototype, { - get: function() { + get() { return _skills; }, - emitChange: function() { + emitChange() { debug('changed'); this.emit(CHANGE_EVENT); }, - addChangeListener: function(callback) { + addChangeListener(callback) { this.on(CHANGE_EVENT, callback); }, - removeChangeListener: function(callback) { + removeChangeListener(callback) { this.removeListener(CHANGE_EVENT, callback); } }); -AppDispatcher.register(function(payload) { - var action = payload.action; +AppDispatcher.register((payload) => { + const action = payload.action; switch(action.actionType) { case SkillConstants.SKILLS_RECEIVE: @@ -51,4 +53,4 @@ AppDispatcher.register(function(payload) { return true; }); -module.exports = SkillStore; +export default SkillStore; diff --git a/public/src/app/utils/hero-api.js b/public/src/app/utils/hero-api.js index 40f4937..539b5ca 100644 --- a/public/src/app/utils/hero-api.js +++ b/public/src/app/utils/hero-api.js @@ -1,69 +1,69 @@ -var assign = require('object-assign'); +import assign from 'object-assign'; -var HeroActions = require('../actions/hero-actions'); -var HeroService = require('../services/hero-service'); +import HeroActions from '../actions/hero-actions'; +import HeroService from '../services/hero-service'; -module.exports = { +export default { - fetch: function() { + fetch() { HeroService.fetch() - .then(function(response) { + .then((response) => { HeroActions.receive(response); }); }, - updateGeneral: function(data) { + updateGeneral(data) { return HeroService.update(data) - .then(function() { + .then(() => { HeroActions.updated(data); }); }, - removeThing: function(id) { + removeThing(id) { return HeroService.removeThing(id) - .then(function() { + .then(() => { HeroActions.thingRemoved(id); }); }, - dressThing: function(id) { + dressThing(id) { return HeroService.dressThing(id) .then(this.fetch); }, - undressThing: function(id) { + undressThing(id) { return HeroService.undressThing(id) .then(this.fetch); }, - undressThings: function() { + undressThings() { return HeroService.undressThings() .then(this.fetch); }, - newComplect: function(data) { + newComplect(data) { return HeroService.newComplect(data) - .then(function(response) { + .then((response) => { assign(data, response); HeroActions.complectCreated(data); }); }, - deleteComplect: function(id) { + deleteComplect(id) { return HeroService.deleteComplect(id) - .then(function() { + .then(() => { HeroActions.complectDeleted(id); }); }, - applyComplect: function(id) { + applyComplect(id) { return HeroService.applyComplect(id) .then(this.fetch); }, - moveOnIsland: function(x, y) { + moveOnIsland(x, y) { return HeroService.moveOnIsland(x, y) - .then(function() { + .then(() => { HeroActions.movedOnIsland(x, y); }); } diff --git a/public/src/app/utils/hero-image-api.js b/public/src/app/utils/hero-image-api.js index a4c9e83..656a5f5 100644 --- a/public/src/app/utils/hero-image-api.js +++ b/public/src/app/utils/hero-image-api.js @@ -1,11 +1,11 @@ -var HeroImageActions = require('../actions/hero-image-actions'); -var HeroImageService = require('../services/hero-image-service'); +import HeroImageActions from '../actions/hero-image-actions'; +import HeroImageService from '../services/hero-image-service'; -module.exports = { +export default { - fetch: function() { + fetch() { HeroImageService.fetch() - .then(function(response) { + .then((response) => { HeroImageActions.receive(response); }); } diff --git a/public/src/app/utils/island-api.js b/public/src/app/utils/island-api.js index be0b73d..f468de6 100644 --- a/public/src/app/utils/island-api.js +++ b/public/src/app/utils/island-api.js @@ -1,11 +1,11 @@ -var IslandActions = require('../actions/island-actions'); -var IslandService = require('../services/island-service'); +import IslandActions from '../actions/island-actions'; +import IslandService from '../services/island-service'; -module.exports = { +export default { - fetch: function() { + fetch() { IslandService.fetch() - .then(function(response) { + .then((response) => { IslandActions.receive(response); }); } diff --git a/public/src/app/utils/skill-api.js b/public/src/app/utils/skill-api.js index b606f5f..7e9ba0d 100644 --- a/public/src/app/utils/skill-api.js +++ b/public/src/app/utils/skill-api.js @@ -1,11 +1,11 @@ -var SkillActions = require('../actions/skill-actions'); -var SkillService = require('../services/skill-service'); +import SkillActions from '../actions/skill-actions'; +import SkillService from '../services/skill-service'; -module.exports = { +export default { - fetch: function() { + fetch() { SkillService.fetch() - .then(function(response) { + .then((response) => { SkillActions.receive(response); }); }