From 81bfc3566bf255f8a4356172136e4927509c2ebf Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Mon, 27 Jul 2015 12:35:27 -0700 Subject: [PATCH 01/25] Update package.json --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index af49cab..26d7174 100644 --- a/package.json +++ b/package.json @@ -1,4 +1,5 @@ { + "name": "react-famous", "private": true, "dependencies": { "babel": "^4.7.3", From 875e904e373c8ce21ba9811fd8d6411e20a6bac0 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Mon, 27 Jul 2015 12:42:51 -0700 Subject: [PATCH 02/25] Added version --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index 26d7174..55afdf6 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,6 @@ { "name": "react-famous", + "version": "0.1.7", "private": true, "dependencies": { "babel": "^4.7.3", From 70040414c3a0aaada815eeddcd17371aefee0918 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 29 Jul 2015 15:27:40 -0700 Subject: [PATCH 03/25] Removed examples. They can be placed in a new repository. --- examples/README.md | 5 - examples/components/App.jsx | 52 --------- examples/components/Home.jsx | 54 ---------- examples/components/Menu.jsx | 45 -------- .../components/modifiers/Draggable/App.jsx | 55 ---------- .../components/surfaces/CanvasSurface/App.jsx | 33 ------ .../surfaces/ContainerSurface/App.jsx | 56 ---------- .../components/surfaces/ImageSurface/App.jsx | 22 ---- .../components/surfaces/VideoSurface/App.jsx | 22 ---- examples/components/test/Animations/App.jsx | 31 ------ .../components/test/Animations/BouncyBox.jsx | 76 ------------- .../components/test/Animations/CrazyBox.jsx | 45 -------- .../test/Animations/DraggableBox.jsx | 59 ----------- .../test/Animations/DroppingBox.jsx | 42 -------- .../test/Animations/RotatingBox.jsx | 32 ------ examples/components/test/Animations/index.js | 6 -- examples/components/test/CommentBox/App.jsx | 14 --- .../components/test/CommentBox/Comment.jsx | 31 ------ .../components/test/CommentBox/CommentBox.jsx | 37 ------- .../test/CommentBox/CommentForm.jsx | 30 ------ .../test/CommentBox/CommentList.jsx | 68 ------------ examples/components/test/HelloWorld/App.jsx | 28 ----- .../components/test/HelloWorldDynamic/App.jsx | 55 ---------- examples/components/test/Layout/App.jsx | 53 ---------- examples/components/test/ReactNode/App.jsx | 55 ---------- examples/components/test/Seed/App.jsx | 100 ------------------ examples/components/views/Deck/App.jsx | 68 ------------ examples/components/views/EdgeSwapper/App.jsx | 81 -------------- .../components/views/FlexibleLayout/App.jsx | 78 -------------- examples/components/views/Flipper/App.jsx | 74 ------------- examples/components/views/GridLayout/App.jsx | 51 --------- .../views/HeaderFooterLayout/App.jsx | 50 --------- examples/components/views/Lightbox/App.jsx | 59 ----------- .../components/views/RenderController/App.jsx | 83 --------------- .../components/views/ScrollContainer/App.jsx | 52 --------- examples/components/views/Scrollview/App.jsx | 46 -------- .../components/views/SequentialLayout/App.jsx | 56 ---------- .../components/views/SizeAwareView/App.jsx | 28 ----- examples/index.html | 11 -- examples/index.js | 13 --- examples/lib/createContent.jsx | 25 ----- examples/lib/overscroll.js | 72 ------------- examples/routes.jsx | 44 -------- examples/routes/Pass.jsx | 8 -- examples/styles/index.less | 98 ----------------- examples/webpack.config.js | 40 ------- examples/webpack.config.prod.js | 50 --------- 47 files changed, 2193 deletions(-) delete mode 100644 examples/README.md delete mode 100644 examples/components/App.jsx delete mode 100644 examples/components/Home.jsx delete mode 100644 examples/components/Menu.jsx delete mode 100644 examples/components/modifiers/Draggable/App.jsx delete mode 100644 examples/components/surfaces/CanvasSurface/App.jsx delete mode 100644 examples/components/surfaces/ContainerSurface/App.jsx delete mode 100644 examples/components/surfaces/ImageSurface/App.jsx delete mode 100644 examples/components/surfaces/VideoSurface/App.jsx delete mode 100644 examples/components/test/Animations/App.jsx delete mode 100644 examples/components/test/Animations/BouncyBox.jsx delete mode 100644 examples/components/test/Animations/CrazyBox.jsx delete mode 100644 examples/components/test/Animations/DraggableBox.jsx delete mode 100644 examples/components/test/Animations/DroppingBox.jsx delete mode 100644 examples/components/test/Animations/RotatingBox.jsx delete mode 100644 examples/components/test/Animations/index.js delete mode 100644 examples/components/test/CommentBox/App.jsx delete mode 100644 examples/components/test/CommentBox/Comment.jsx delete mode 100644 examples/components/test/CommentBox/CommentBox.jsx delete mode 100644 examples/components/test/CommentBox/CommentForm.jsx delete mode 100644 examples/components/test/CommentBox/CommentList.jsx delete mode 100644 examples/components/test/HelloWorld/App.jsx delete mode 100644 examples/components/test/HelloWorldDynamic/App.jsx delete mode 100644 examples/components/test/Layout/App.jsx delete mode 100644 examples/components/test/ReactNode/App.jsx delete mode 100644 examples/components/test/Seed/App.jsx delete mode 100644 examples/components/views/Deck/App.jsx delete mode 100644 examples/components/views/EdgeSwapper/App.jsx delete mode 100644 examples/components/views/FlexibleLayout/App.jsx delete mode 100644 examples/components/views/Flipper/App.jsx delete mode 100644 examples/components/views/GridLayout/App.jsx delete mode 100644 examples/components/views/HeaderFooterLayout/App.jsx delete mode 100644 examples/components/views/Lightbox/App.jsx delete mode 100644 examples/components/views/RenderController/App.jsx delete mode 100644 examples/components/views/ScrollContainer/App.jsx delete mode 100644 examples/components/views/Scrollview/App.jsx delete mode 100644 examples/components/views/SequentialLayout/App.jsx delete mode 100644 examples/components/views/SizeAwareView/App.jsx delete mode 100644 examples/index.html delete mode 100644 examples/index.js delete mode 100644 examples/lib/createContent.jsx delete mode 100644 examples/lib/overscroll.js delete mode 100644 examples/routes.jsx delete mode 100644 examples/routes/Pass.jsx delete mode 100644 examples/styles/index.less delete mode 100644 examples/webpack.config.js delete mode 100644 examples/webpack.config.prod.js diff --git a/examples/README.md b/examples/README.md deleted file mode 100644 index 03c5a42..0000000 --- a/examples/README.md +++ /dev/null @@ -1,5 +0,0 @@ -# Examples - - gulp examples --port 8080 - -* [http://localhost:8080](http://localhost:8080) diff --git a/examples/components/App.jsx b/examples/components/App.jsx deleted file mode 100644 index 0281583..0000000 --- a/examples/components/App.jsx +++ /dev/null @@ -1,52 +0,0 @@ -import React from 'react'; -import { RouteHandler } from 'react-router'; - -import Menu from './Menu'; - -const EXAMPLES = { - modifiers: [ - 'Draggable' - ], - surfaces: [ - 'CanvasSurface', - 'ContainerSurface', - 'ImageSurface', - 'VideoSurface' - ], - views: [ - 'Deck', - 'EdgeSwapper', - 'FlexibleLayout', - 'Flipper', - 'GridLayout', - 'HeaderFooterLayout', - 'Lightbox', - 'RenderController', - 'ScrollContainer', - 'Scrollview', - 'SequentialLayout', - 'SizeAwareView' - ], - test: [ - 'Animations', - 'CommentBox', - 'HelloWorld', - 'HelloWorldDynamic', - 'Layout', - 'ReactNode', - 'Seed' - ] -}; - -export default class extends React.Component { - render() { - return ( -
- -
- -
-
- ); - } -}; diff --git a/examples/components/Home.jsx b/examples/components/Home.jsx deleted file mode 100644 index c66b212..0000000 --- a/examples/components/Home.jsx +++ /dev/null @@ -1,54 +0,0 @@ -import Transform from 'famous/core/Transform'; -import Easing from 'famous/transitions/Easing'; -import Timer from 'famous/utilities/Timer'; -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import FamousScheduler from 'react-famous/lib/FamousScheduler'; -import StateModifier from 'react-famous/modifiers/StateModifier'; - -class Home extends React.Component { - componentDidMount() { - let stateModifier = this.refs.stateModifier.getFamous(); - - FamousScheduler.schedule(() => { - function animate() { - stateModifier.halt(); - stateModifier.setTransform(Transform.translate(-50, 0), { - duration: 250 - }, () => { - stateModifier.setTransform(Transform.translate(0, 0), { - duration: 500 - }, () => { - Timer.setTimeout(animate, 1250); - }); - }); - } - - animate(); - }); - } - - render() { - return ( -
- - - - react-famous - examples - - - - - ←   Please select an example. - - - -
- ); - } -} - -export default Home; diff --git a/examples/components/Menu.jsx b/examples/components/Menu.jsx deleted file mode 100644 index 4ece001..0000000 --- a/examples/components/Menu.jsx +++ /dev/null @@ -1,45 +0,0 @@ -import isEqual from 'lodash/lang/isEqual'; -import React from 'react'; -import { Link } from 'react-router'; - -class Menu extends React.Component { - shouldComponentUpdate(nextProps, nextState) { - return !isEqual(this.props, nextProps) || !isEqual(this.state, nextState); - } - - render() { - let examples = Object.keys(this.props.examples).reduce((result, group, idx) => { - let listItems = this.props.examples[group].map((member, idx) => { - return ( -
  • - {member} -
    • - ); - }); - result.push( -
    -
    {group}
    -
      - {listItems} -
    -
    - ); - return result; - }, []); - - return ( -
    - - {examples} -
    - ); - } -} - -Menu.propTypes = { - examples: React.PropTypes.object.isRequired -}; - -export default Menu; diff --git a/examples/components/modifiers/Draggable/App.jsx b/examples/components/modifiers/Draggable/App.jsx deleted file mode 100644 index c0d41f2..0000000 --- a/examples/components/modifiers/Draggable/App.jsx +++ /dev/null @@ -1,55 +0,0 @@ -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import Draggable from 'react-famous/modifiers/Draggable'; - -export default class extends React.Component { - componentDidMount() { - let draggable = this.refs.draggable.getFamous(); - let surface = this.refs.surface.getFamous(); - - draggable.subscribe(surface); - } - - render() { - let draggableOptions = { - snapX: 40, - snapY: 40, - xRange: [-220, 220], - yRange: [-220, 220] - }; - - let gridOptions = { - size: [481, 481], - properties: { - backgroundColor: 'black', - backgroundImage: 'linear-gradient(rgba(255, 255, 255, 0.25) 1px, transparent 1px), linear-gradient(white 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.25) 1px, transparent 1px), linear-gradient(90deg, white 1px, transparent 1px), linear-gradient(transparent 3px, black 3px, black 238px, transparent 238px), linear-gradient(90deg, white 3px, transparent 3px, transparent 238px, white 238px)', - backgroundSize: '40px 40px, 240px 240px, 40px 40px, 240px 240px, 240px 240px, 240px 240px' - } - }; - - let surfaceOptions = { - size: [40, 40], - content: 'drag', - properties: { - backgroundColor: 'red', - color: 'white', - cursor: 'pointer', - lineHeight: '40px', - textAlign: 'center' - } - }; - - return ( - - - - - - - - - ); - } -}; diff --git a/examples/components/surfaces/CanvasSurface/App.jsx b/examples/components/surfaces/CanvasSurface/App.jsx deleted file mode 100644 index 26ba74c..0000000 --- a/examples/components/surfaces/CanvasSurface/App.jsx +++ /dev/null @@ -1,33 +0,0 @@ -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import CanvasSurface from 'react-famous/surfaces/CanvasSurface'; - -let CANVAS_SIZE = [400, 400]; - -export default class extends React.Component { - componentDidMount() { - let canvas = this.refs.canvas.getFamous(); - let ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'rgb(200, 0, 0)'; - ctx.fillRect(50, 50, 200, 200); - - ctx.fillStyle = 'rgba(0, 0, 200, 0.5)'; - ctx.fillRect(150, 150, 200, 200); - } - - render() { - return ( - - - Shapes are drawn on a canvas surface. - - - - - - ); - } -}; diff --git a/examples/components/surfaces/ContainerSurface/App.jsx b/examples/components/surfaces/ContainerSurface/App.jsx deleted file mode 100644 index d5e35b6..0000000 --- a/examples/components/surfaces/ContainerSurface/App.jsx +++ /dev/null @@ -1,56 +0,0 @@ -import startsWith from 'lodash/string/startsWith'; -import range from 'lodash/utility/range'; -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import ContainerSurface from 'react-famous/surfaces/ContainerSurface'; -import Scrollview from 'react-famous/views/Scrollview'; - -const NUM_SURFACES = 100; -const SURFACE_REF_PREFIX = 'surface_'; - -export default class extends React.Component { - componentDidMount() { - let scrollview = this.refs.scrollview.getFamous(); - - Object.keys(this.refs) - .filter((key) => startsWith(key, SURFACE_REF_PREFIX)) - .map((key) => this.refs[key].getFamous()) - .forEach((surface) => surface.pipe(scrollview)); - } - - render() { - let surfaces = range(NUM_SURFACES).map((idx) => { - let options = { - properties: { - backgroundColor: 'rgba(255, 0, 0, 0.5)', - color: 'white', - lineHeight: '50px', - textAlign: 'center' - }, - size: [undefined, 50] - }; - return ( - - I am surface: {idx + 1} - - ); - }); - - return ( - - - Scrollview is created inside a container surface. - - - - - {surfaces} - - - - - ); - } -}; diff --git a/examples/components/surfaces/ImageSurface/App.jsx b/examples/components/surfaces/ImageSurface/App.jsx deleted file mode 100644 index f66ed78..0000000 --- a/examples/components/surfaces/ImageSurface/App.jsx +++ /dev/null @@ -1,22 +0,0 @@ -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import ImageSurface from 'react-famous/surfaces/ImageSurface'; - -const IMAGE_URL = 'http://code.famo.us/assets/famous.jpg'; - -export default class extends React.Component { - render() { - return ( - - - The image is created with ImageSurface. - - - - - - ); - } -}; diff --git a/examples/components/surfaces/VideoSurface/App.jsx b/examples/components/surfaces/VideoSurface/App.jsx deleted file mode 100644 index 22414d5..0000000 --- a/examples/components/surfaces/VideoSurface/App.jsx +++ /dev/null @@ -1,22 +0,0 @@ -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import VideoSurface from 'react-famous/surfaces/VideoSurface'; - -const VIDEO_URL = 'http://video.webmfiles.org/big-buck-bunny_trailer.webm'; - -export default class extends React.Component { - render() { - return ( - - - The video is created with VideoSurface. - - - - - - ); - } -}; diff --git a/examples/components/test/Animations/App.jsx b/examples/components/test/Animations/App.jsx deleted file mode 100644 index 7099441..0000000 --- a/examples/components/test/Animations/App.jsx +++ /dev/null @@ -1,31 +0,0 @@ -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; - -import BouncyBox from './BouncyBox'; -import CrazyBox from './CrazyBox'; -import DraggableBox from './DraggableBox'; -import DroppingBox from './DroppingBox'; -import RotatingBox from './RotatingBox'; - -export default class extends React.Component { - render() { - return ( - - - - - - - - - - - - - - - - ); - } -}; diff --git a/examples/components/test/Animations/BouncyBox.jsx b/examples/components/test/Animations/BouncyBox.jsx deleted file mode 100644 index 0b22a31..0000000 --- a/examples/components/test/Animations/BouncyBox.jsx +++ /dev/null @@ -1,76 +0,0 @@ -import Transform from 'famous/core/Transform'; -import GenericSync from 'famous/inputs/GenericSync'; -import MouseSync from 'famous/inputs/MouseSync'; -import TouchSync from 'famous/inputs/TouchSync'; -import SnapTransition from 'famous/transitions/SnapTransition'; -import Transitionable from 'famous/transitions/Transitionable'; -import React from 'react'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; - -GenericSync.register({ - mouse: MouseSync, - touch: TouchSync -}); - -Transitionable.registerMethod('spring', SnapTransition); - -export default class extends React.Component { - componentWillMount() { - this._position = new Transitionable([0, 0]); - } - - componentDidMount() { - let position = this._position; - let clickSurface = this.refs.clickSurface.getFamous(); - let sync = new GenericSync({ - mouse: {}, - touch: {} - }); - - sync.on('update', (data) => { - let currentPosition = position.get(); - position.set([ - currentPosition[0] + data.delta[0], - currentPosition[1] + data.delta[1] - ]); - }); - - sync.on('end', (data) => { - let velocity = data.velocity; - position.set([0, 0], { - method: 'spring', - period: 150, - velocity: data.velocity - }); - }); - - clickSurface.pipe(sync); - } - - render() { - let position = this._position; - - let modifierOptions = { - proportions: [0.2, 0.2], - transform: () => { - let currentPosition = position.get(); - return Transform.translate(currentPosition[0], currentPosition[1]); - } - }; - - return ( - - - - - Bouncy - - - - - - - ); - } -}; diff --git a/examples/components/test/Animations/CrazyBox.jsx b/examples/components/test/Animations/CrazyBox.jsx deleted file mode 100644 index 0c0047a..0000000 --- a/examples/components/test/Animations/CrazyBox.jsx +++ /dev/null @@ -1,45 +0,0 @@ -import random from 'lodash/number/random'; -import Transform from 'famous/core/Transform'; -import Easing from 'famous/transitions/Easing'; -import TweenTransition from 'famous/transitions/TweenTransition'; -import React from 'react'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import FamousScheduler from 'react-famous/lib/FamousScheduler'; -import StateModifier from 'react-famous/modifiers/StateModifier'; - -const EASING_NAMES = Object.keys(Easing); - -EASING_NAMES.forEach((name) => TweenTransition.registerCurve(name, Easing[name])); - -export default class extends React.Component { - componentDidMount() { - let stateModifier = this.refs.stateModifier.getFamous(); - - function rotate() { - stateModifier.setTransform(Transform.rotate(Math.random(), Math.random(), Math.random()), { - curve: EASING_NAMES[random(EASING_NAMES.length)], - duration: 300 - }, () => { - stateModifier.setTransform(Transform.rotate(0, 0, 0), { - duration: 50 - }, rotate); - }); - } - - FamousScheduler.schedule(rotate); - } - - render() { - return ( - - - - - Crazy - - - - ); - } -}; diff --git a/examples/components/test/Animations/DraggableBox.jsx b/examples/components/test/Animations/DraggableBox.jsx deleted file mode 100644 index b00f884..0000000 --- a/examples/components/test/Animations/DraggableBox.jsx +++ /dev/null @@ -1,59 +0,0 @@ -import Transform from 'famous/core/Transform'; -import GenericSync from 'famous/inputs/GenericSync'; -import MouseSync from 'famous/inputs/MouseSync'; -import TouchSync from 'famous/inputs/TouchSync'; -import React from 'react'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; - -GenericSync.register({ - mouse: MouseSync, - touch: TouchSync -}); - -export default class extends React.Component { - componentWillMount() { - this._position = [0, 0]; - } - - componentDidMount() { - let position = this._position; - let clickSurface = this.refs.clickSurface.getFamous(); - let sync = new GenericSync({ - mouse: {}, - touch: {} - }); - - sync.on('update', (data) => { - position[0] += data.delta[0]; - position[1] += data.delta[1]; - }); - - clickSurface.pipe(sync); - } - - render() { - let position = this._position; - - let modifierOptions = { - proportions: [0.2, 0.2], - transform: () => { - return Transform.translate(position[0], position[1]); - } - }; - - return ( - - - - - Draggable - - - - - - - ); - } -}; diff --git a/examples/components/test/Animations/DroppingBox.jsx b/examples/components/test/Animations/DroppingBox.jsx deleted file mode 100644 index 40a90e2..0000000 --- a/examples/components/test/Animations/DroppingBox.jsx +++ /dev/null @@ -1,42 +0,0 @@ -import Transitionable from 'famous/transitions/Transitionable'; -import React from 'react'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import FamousScheduler from 'react-famous/lib/FamousScheduler'; - -export default class extends React.Component { - componentWillMount() { - this._transitionable = new Transitionable([0, 0]); - } - - componentDidMount() { - FamousScheduler.schedule(() => { - this._transitionable.set([0, 1], { - duration: 1000, - curve: 'easeInOut' - }); - }); - } - - render() { - let transitionable = this._transitionable; - - let modifierOptions = { - align: () => transitionable.get(), - opacity: 0.7, - origin: () => transitionable.get(), - proportions: [1, 0.1] - }; - - return ( - - - - - Dropping - - - - ); - } -}; diff --git a/examples/components/test/Animations/RotatingBox.jsx b/examples/components/test/Animations/RotatingBox.jsx deleted file mode 100644 index f4e0244..0000000 --- a/examples/components/test/Animations/RotatingBox.jsx +++ /dev/null @@ -1,32 +0,0 @@ -import Transform from 'famous/core/Transform'; -import React from 'react'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import FamousScheduler from 'react-famous/lib/FamousScheduler'; - -export default class extends React.Component { - componentDidMount() { - let modifier = this.refs.modifier.getFamous(); - let angle = 0; - - FamousScheduler.schedule(() => { - modifier.transformFrom(() => { - angle += 0.03; - return Transform.rotateZ(angle); - }); - }); - } - - render() { - return ( - - - - - Rotating - - - - ); - } -}; diff --git a/examples/components/test/Animations/index.js b/examples/components/test/Animations/index.js deleted file mode 100644 index 79342de..0000000 --- a/examples/components/test/Animations/index.js +++ /dev/null @@ -1,6 +0,0 @@ -import 'famous/core/famous.css'; -import React from 'react'; - -import App from './components/App'; - -React.render(React.createElement(App), document.body); diff --git a/examples/components/test/CommentBox/App.jsx b/examples/components/test/CommentBox/App.jsx deleted file mode 100644 index 95a71fb..0000000 --- a/examples/components/test/CommentBox/App.jsx +++ /dev/null @@ -1,14 +0,0 @@ -import React from 'react'; -import Context from 'react-famous/core/Context'; - -import CommentBox from './CommentBox'; - -export default class extends React.Component { - render() { - return ( - - - - ); - } -}; diff --git a/examples/components/test/CommentBox/Comment.jsx b/examples/components/test/CommentBox/Comment.jsx deleted file mode 100644 index 891e48a..0000000 --- a/examples/components/test/CommentBox/Comment.jsx +++ /dev/null @@ -1,31 +0,0 @@ -import React from 'react'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import FlexibleLayout from 'react-famous/views/FlexibleLayout'; - -class Component extends React.Component { - render() { - return ( - - - - {this.props.author} - - - - - - {this.props.text} - - - - ); - } -} - -Component.propTypes = { - author: React.PropTypes.string, - text: React.PropTypes.string -}; - -export default Component; diff --git a/examples/components/test/CommentBox/CommentBox.jsx b/examples/components/test/CommentBox/CommentBox.jsx deleted file mode 100644 index e127fa4..0000000 --- a/examples/components/test/CommentBox/CommentBox.jsx +++ /dev/null @@ -1,37 +0,0 @@ -import range from 'lodash/utility/range'; -import React from 'react'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import FlexibleLayout from 'react-famous/views/FlexibleLayout'; - -import CommentForm from './CommentForm'; -import CommentList from './CommentList'; - -export default class extends React.Component { - constructor(...args) { - super(...args); - - this.state = { - data: range(5).map(() => { - return { - author: '@pilwon', - text: 'Hello react-famous!' - }; - }) - }; - } - - render() { - return ( - - - - Comments - - - - - - ); - } -}; diff --git a/examples/components/test/CommentBox/CommentForm.jsx b/examples/components/test/CommentBox/CommentForm.jsx deleted file mode 100644 index 089d1e0..0000000 --- a/examples/components/test/CommentBox/CommentForm.jsx +++ /dev/null @@ -1,30 +0,0 @@ -import Utility from 'famous/utilities/Utility'; -import React from 'react'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import FormContainerSurface from 'react-famous/surfaces/FormContainerSurface'; -import InputSurface from 'react-famous/surfaces/InputSurface'; -import SubmitInputSurface from 'react-famous/surfaces/SubmitInputSurface'; -import SequentialLayout from 'react-famous/views/SequentialLayout'; - -export default class extends React.Component { - render() { - return ( - - - - - - - - - - - - - - - - ); - } -}; diff --git a/examples/components/test/CommentBox/CommentList.jsx b/examples/components/test/CommentBox/CommentList.jsx deleted file mode 100644 index 7c7cb0c..0000000 --- a/examples/components/test/CommentBox/CommentList.jsx +++ /dev/null @@ -1,68 +0,0 @@ -import Transform from 'famous/core/Transform'; -import Transitionable from 'famous/transitions/Transitionable'; -import React from 'react'; -import Modifier from 'react-famous/core/Modifier'; -import FamousScheduler from 'react-famous/lib/FamousScheduler'; -import Scrollview from 'react-famous/views/Scrollview'; - -import Comment from './Comment'; - -class Component extends React.Component { - componentWillMount() { - this._transitionables = this.props.data.map(() => new Transitionable(0)); - } - - componentDidMount() { - let transitionables = this._transitionables; - - FamousScheduler.schedule(() => { - this.props.data.forEach((comment, idx) => { - let modifier = this.refs[`modifier_${idx}`].getFamous(); - let transitionable = transitionables[idx]; - transitionable.set(1, { - curve: 'easeInOut', - duration: (idx + 1) * (1500 / this.props.data.length) - }); - }); - }); - } - - render() { - let transitionables = this._transitionables; - - let commentNodes = this.props.data.map((comment, idx) => { - let transitionable = transitionables[idx]; - let modifierOptions = { - opacity: () => { - return transitionable.get(); - }, - size: [undefined, 50], - transform: () => { - return Transform.translate(300 * (1 - transitionable.get()), 0); - } - }; - - return ( - - - - ); - }); - - return ( - - - - {commentNodes} - - - - ); - } -} - -Component.propTypes = { - data: React.PropTypes.array -}; - -export default Component; diff --git a/examples/components/test/HelloWorld/App.jsx b/examples/components/test/HelloWorld/App.jsx deleted file mode 100644 index 59d12f7..0000000 --- a/examples/components/test/HelloWorld/App.jsx +++ /dev/null @@ -1,28 +0,0 @@ -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; - -export default class extends React.Component { - render() { - let options = { - size: [150, 100], - properties: { - backgroundColor: '#000099', - color: '#fff', - textAlign: 'center', - lineHeight: '100px' - } - }; - - return ( - - - - Hello World - - - - ); - } -}; diff --git a/examples/components/test/HelloWorldDynamic/App.jsx b/examples/components/test/HelloWorldDynamic/App.jsx deleted file mode 100644 index 0a4a22a..0000000 --- a/examples/components/test/HelloWorldDynamic/App.jsx +++ /dev/null @@ -1,55 +0,0 @@ -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import FamousScheduler from 'react-famous/lib/FamousScheduler'; - -export default class extends React.Component { - constructor(...args) { - super(...args); - - this.state = { - count: 0 - }; - } - - componentWillUnmount() { - clearInterval(this._intervalId); - } - - componentDidMount() { - FamousScheduler.schedule(() => { - this._intervalId = setInterval(() => { - this.setState((state) => ({ - count: state.count + 1 - })); - }, 100); - }); - } - - _textCharUpper(text, position) { - let str = text.toLowerCase(); - let idx = position % str.length; - return str.substr(0, idx) + str[idx].toUpperCase() + str.substr(idx + 1); - } - - render() { - let properties = { - backgroundColor: this.state.count % 2 ? '#990000' : '#ff0000', - color: '#fff', - textAlign: 'center', - lineHeight: '100px' - }; - let text = this._textCharUpper('Hello World', this.state.count); - - return ( - - - - {text} - - - - ); - } -}; diff --git a/examples/components/test/Layout/App.jsx b/examples/components/test/Layout/App.jsx deleted file mode 100644 index d517203..0000000 --- a/examples/components/test/Layout/App.jsx +++ /dev/null @@ -1,53 +0,0 @@ -import range from 'lodash/utility/range'; -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import GridLayout from 'react-famous/views/GridLayout'; -import HeaderFooterLayout from 'react-famous/views/HeaderFooterLayout'; - -export default class extends React.Component { - render() { - let views = range(2).map((i) => { - let options = { - size: [100, 100], - properties: { - backgroundColor: '#fa5c4f', - color: 'white', - lineHeight: '100px', - textAlign: 'center' - } - }; - - return ( - - - content {i + 1} - - - ); - }); - - return ( - - - - - Header - - - - - {views} - - - - - Footer - - - - - ); - } -}; diff --git a/examples/components/test/ReactNode/App.jsx b/examples/components/test/ReactNode/App.jsx deleted file mode 100644 index 18c0219..0000000 --- a/examples/components/test/ReactNode/App.jsx +++ /dev/null @@ -1,55 +0,0 @@ -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import RenderNode from 'react-famous/core/RenderNode'; -import Surface from 'react-famous/core/Surface'; -import ReactNode from 'react-famous/lib/ReactNode'; -import GridLayout from 'react-famous/views/GridLayout'; - -import EdgeSwapperApp from '../../views/EdgeSwapper/App'; -import FlexibleLayoutApp from '../../views/FlexibleLayout/App'; -import FlipperApp from '../../views/Flipper/App'; -import GridLayoutApp from '../../views/GridLayout/App'; -import HeaderFooterLayoutApp from '../../views/HeaderFooterLayout/App'; -import ScrollviewApp from '../../views/Scrollview/App'; -import AnimationsApp from '../Animations/App'; -import CommentBoxApp from '../CommentBox/App'; -import HelloWorldDynamicApp from '../HelloWorldDynamic/App'; - -export default class extends React.Component { - render() { - return ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - ); - } -}; diff --git a/examples/components/test/Seed/App.jsx b/examples/components/test/Seed/App.jsx deleted file mode 100644 index a9372b2..0000000 --- a/examples/components/test/Seed/App.jsx +++ /dev/null @@ -1,100 +0,0 @@ -import Transform from 'famous/core/Transform'; -import Easing from 'famous/transitions/Easing'; -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import FamousScheduler from 'react-famous/lib/FamousScheduler'; -import StateModifier from 'react-famous/modifiers/StateModifier'; - -const GROUND_RATIO = 0.35; -const INITIAL_MODIFIER_OPTIONS = {align: [0.5, 0], origin: [0.5, 1]}; -const URL = 'https://github.com/pilwon/react-famous'; - -export default class extends React.Component { - componentDidMount() { - let beanModifier = this.refs.beanModifier.getFamous(); - - function drop() { - return new Promise((resolve) => { - beanModifier.setAlign([0.5, 1 - GROUND_RATIO], { - curve: Easing.outBounce, - duration: 2500 - }, resolve); - }); - } - - function moveLeft() { - return new Promise((resolve) => { - return Promise.all([ - new Promise((resolve) => { - beanModifier.setAlign([0.05, 1 - GROUND_RATIO], { - curve: Easing.outElastic, - duration: 1000 - }, resolve); - }), - new Promise((resolve) => { - beanModifier.setOrigin([0, 1], { - curve: Easing.outElastic, - duration: 1000 - }, resolve); - }) - ]).then(() => setTimeout(resolve, 300)); - }); - } - - function disappear() { - return new Promise((resolve) => { - beanModifier.setAlign([1, 1 - GROUND_RATIO], { - curve: Easing.inExpo, - duration: 500 - }, () => setTimeout(resolve, 1000)); - }); - } - - function reset() { - beanModifier.setAlign(INITIAL_MODIFIER_OPTIONS.align); - beanModifier.setOrigin(INITIAL_MODIFIER_OPTIONS.origin); - return Promise.resolve(); - } - - FamousScheduler.schedule(function loop() { - drop().then(moveLeft).then(disappear).then(reset).then(loop); - }); - } - - render() { - let beanOptions = { - properties: { - backgroundColor: '#F2EEB3', - borderRadius: '50px', - fontSize: '2em', - fontWeight: 'bold', - padding: '30px 50px' - }, - size: [true, true] - }; - - let groundOptions = { - properties: { - backgroundColor: '#8C6954', - borderBottom: '25px solid #260126', - borderRadius: '200px 200px 0 0', - borderTop: '30px solid #59323C' - } - }; - - return ( - - - - Hello react-famous! - - - - - - - ); - } -}; diff --git a/examples/components/views/Deck/App.jsx b/examples/components/views/Deck/App.jsx deleted file mode 100644 index 159c221..0000000 --- a/examples/components/views/Deck/App.jsx +++ /dev/null @@ -1,68 +0,0 @@ -import range from 'lodash/utility/range'; -import SpringTransition from 'famous/transitions/SpringTransition'; -import Transitionable from 'famous/transitions/Transitionable'; -import Timer from 'famous/utilities/Timer'; -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import Deck from 'react-famous/views/Deck'; - -Transitionable.registerMethod('spring', SpringTransition); - -export default class extends React.Component { - constructor(...args) { - super(...args); - - this._onSurfaceClick = this._onSurfaceClick.bind(this); - } - - _onSurfaceClick(eventKey) { - let deck = this.refs.deck.getFamous(); - - console.log('Clicked surface #' + eventKey); - deck.toggle(); - } - - render() { - let surfaces = range(5).map((i) => { - let options = { - properties: { - backgroundColor: 'hsla(' + ((i * 5 + i) * 15 % 360) + ', 60%, 50%, 0.8)', - color: 'white', - lineHeight: '200px', - textAlign: 'center' - }, - size: [100, 200] - }; - return ( - - {i} - - ); - }); - - let deckOptions = { - itemSpacing: 10, - transition: { - method: 'spring', - period: 300, - dampingRatio: 0.5 - }, - stackRotation: 0.02 - }; - - return ( - - - Open the developer console, then click the deck. - - - - {surfaces} - - - - ); - } -}; diff --git a/examples/components/views/EdgeSwapper/App.jsx b/examples/components/views/EdgeSwapper/App.jsx deleted file mode 100644 index 55e8d04..0000000 --- a/examples/components/views/EdgeSwapper/App.jsx +++ /dev/null @@ -1,81 +0,0 @@ -import Transform from 'famous/core/Transform'; -import GenericSync from 'famous/inputs/GenericSync'; -import MouseSync from 'famous/inputs/MouseSync'; -import TouchSync from 'famous/inputs/TouchSync'; -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import RenderNode from 'react-famous/core/RenderNode'; -import Surface from 'react-famous/core/Surface'; -import FamousScheduler from 'react-famous/lib/FamousScheduler'; -import EdgeSwapper from 'react-famous/views/EdgeSwapper'; - -GenericSync.register({ - mouse: MouseSync, - touch: TouchSync -}); - -export default class extends React.Component { - componentDidMount() { - let clickSurface = this.refs.clickSurface.getFamous(); - let edgeSwapper = this.refs.edgeSwapper.getFamous(); - let primary = this.refs.primary.getFamous(); - let secondary = this.refs.secondary.getFamous(); - let showing = true; - let sync = new GenericSync({ - mouse: {}, - touch: {} - }); - - sync.on('end', (data) => { - if (showing) { - edgeSwapper.show(secondary); - } else { - edgeSwapper.show(primary); - } - showing = !showing; - }); - - clickSurface.pipe(sync); - - FamousScheduler.schedule(() => { - edgeSwapper.show(primary); - }); - } - - render() { - let surfaceOptions = { - size: [true, true], - properties: { - color: 'white', - fontSize: '2em' - } - }; - - return ( - - - - - - - Primary - - - - - - - - Secondary - - - - - - - - - ); - } -}; diff --git a/examples/components/views/FlexibleLayout/App.jsx b/examples/components/views/FlexibleLayout/App.jsx deleted file mode 100644 index 233ffa8..0000000 --- a/examples/components/views/FlexibleLayout/App.jsx +++ /dev/null @@ -1,78 +0,0 @@ -import Transform from 'famous/core/Transform'; -import GenericSync from 'famous/inputs/GenericSync'; -import MouseSync from 'famous/inputs/MouseSync'; -import TouchSync from 'famous/inputs/TouchSync'; -import range from 'lodash/utility/range'; -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import FlexibleLayout from 'react-famous/views/FlexibleLayout'; - -const COLORS = [ - 'rgba(255, 0, 0, .7)', - 'rgba(0, 255, 0, .7)', - 'rgba(0, 0, 255, .7)', - 'rgba(255, 0, 0, .7)', - 'rgba(0, 255, 0, .7)', - 'rgba(0, 0, 255, .7)', - 'rgba(255, 0, 0, .7)', - 'rgba(0, 255, 0, .7)' -]; -const INITIAL_RATIOS = [1, true, 1, true, 1, true, 1, true]; -const FINAL_RATIOS = [4, true, 1, true, 0, true, 7, true]; - -GenericSync.register({ - mouse: MouseSync, - touch: TouchSync -}); - -export default class extends React.Component { - componentDidMount() { - let clickSurface = this.refs.clickSurface.getFamous(); - let flexibleLayout = this.refs.flexibleLayout.getFamous(); - let sync = new GenericSync({ - mouse: {}, - touch: {} - }); - let toggle = false; - - sync.on('end', (data) => { - let ratios = toggle ? INITIAL_RATIOS : FINAL_RATIOS; - flexibleLayout.setRatios(ratios, { - curve: 'easeOut', - duration: 500 - }); - toggle = !toggle; - }); - - clickSurface.pipe(sync); - } - - render() { - let surfaces = range(COLORS.length).map((idx) => { - let options = { - properties: { - backgroundColor: COLORS[idx] - }, - size: (idx % 2 === 0) ? [undefined, undefined] : [10, undefined] - }; - return ( - - ); - }); - - return ( - - - - {surfaces} - - - - - - - ); - } -}; diff --git a/examples/components/views/Flipper/App.jsx b/examples/components/views/Flipper/App.jsx deleted file mode 100644 index 48d6a99..0000000 --- a/examples/components/views/Flipper/App.jsx +++ /dev/null @@ -1,74 +0,0 @@ -import Transform from 'famous/core/Transform'; -import GenericSync from 'famous/inputs/GenericSync'; -import MouseSync from 'famous/inputs/MouseSync'; -import TouchSync from 'famous/inputs/TouchSync'; -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import Flipper from 'react-famous/views/Flipper'; - -GenericSync.register({ - mouse: MouseSync, - touch: TouchSync -}); - -export default class extends React.Component { - componentDidMount() { - let clickSurface = this.refs.clickSurface.getFamous(); - let flipper = this.refs.flipper.getFamous(); - let sync = new GenericSync({ - mouse: {}, - touch: {} - }); - let toggle = false; - - sync.on('end', (data) => { - let angle = toggle ? 0 : Math.PI; - flipper.setAngle(angle, { - curve: 'easeOutBounce', - duration: 500 - }); - toggle = !toggle; - }); - - clickSurface.pipe(sync); - } - - render() { - return ( - - - Click anywhere on the screen. - - - - - - - - - Front - - - - - - - - - - Back - - - - - - - - - - - ); - } -}; diff --git a/examples/components/views/GridLayout/App.jsx b/examples/components/views/GridLayout/App.jsx deleted file mode 100644 index a8dbd97..0000000 --- a/examples/components/views/GridLayout/App.jsx +++ /dev/null @@ -1,51 +0,0 @@ -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import RenderNode from 'react-famous/core/RenderNode'; -import Surface from 'react-famous/core/Surface'; -import GridLayout from 'react-famous/views/GridLayout'; - -export default class extends React.Component { - render() { - return ( - - - - - - -

    Red

    -     -     -     - - Green - - - Blue - - - Pink - - - Purple - - - - Navy - - - Brown - - - Khaki - - - Maroon - - -     -     - ); - } -}; diff --git a/examples/components/views/HeaderFooterLayout/App.jsx b/examples/components/views/HeaderFooterLayout/App.jsx deleted file mode 100644 index afabf95..0000000 --- a/examples/components/views/HeaderFooterLayout/App.jsx +++ /dev/null @@ -1,50 +0,0 @@ -import Transform from 'famous/core/Transform'; -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import HeaderFooterLayout from 'react-famous/views/HeaderFooterLayout'; - -export default class extends React.Component { - render() { - let modifierOptions = { - align: [.5, .5], - origin: [.5, .5], - proportions: [0.5, 0.7], - transform: Transform.rotateZ(.2) - }; - - return ( - - - - - - - - Header - - - - - - - - Content - - - - - - - - Footer - - - - - - - ); - } -}; diff --git a/examples/components/views/Lightbox/App.jsx b/examples/components/views/Lightbox/App.jsx deleted file mode 100644 index 2fd653d..0000000 --- a/examples/components/views/Lightbox/App.jsx +++ /dev/null @@ -1,59 +0,0 @@ -import Transform from 'famous/core/Transform'; -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import FamousScheduler from 'react-famous/lib/FamousScheduler'; -import Lightbox from 'react-famous/views/Lightbox'; - -export default class extends React.Component { - componentDidMount() { - let lightbox = this.refs.lightbox.getFamous(); - let red = this.refs.red.getFamous(); - let green = this.refs.green.getFamous(); - let blue = this.refs.blue.getFamous(); - - function showRed() { - lightbox.show(red, {duration: 1500}, showGreen); - } - - function showGreen() { - lightbox.show(green, {duration: 1500}, showBlue); - } - - function showBlue() { - lightbox.show(blue, {duration: 1500}, showRed); - } - - FamousScheduler.schedule(showRed); - } - - render() { - let lightboxOptions = { - inAlign: [0, 0.5], - inOpacity: 0.5, - inOrigin: [0, 0.5], - inTransform: Transform.scale(0.5, 0.5, 0.5), - outAlign: [1, 0.5], - outOpacity: 0, - outOrigin: [1, 0.5], - outTransform: Transform.scale(0.001, 0.001, 0.001), - overlap: true - }; - - return ( - - - Lightbox showing and hiding renderables. - - - - - - - - - - ); - } -}; diff --git a/examples/components/views/RenderController/App.jsx b/examples/components/views/RenderController/App.jsx deleted file mode 100644 index 65fdb85..0000000 --- a/examples/components/views/RenderController/App.jsx +++ /dev/null @@ -1,83 +0,0 @@ -import Transform from 'famous/core/Transform'; -import GenericSync from 'famous/inputs/GenericSync'; -import MouseSync from 'famous/inputs/MouseSync'; -import TouchSync from 'famous/inputs/TouchSync'; -import startsWith from 'lodash/string/startsWith'; -import range from 'lodash/utility/range'; -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import FamousScheduler from 'react-famous/lib/FamousScheduler'; -import RenderController from 'react-famous/views/RenderController'; - -const NUM_SURFACES = 10; -const SURFACE_REF_PREFIX = 'surface_'; - -GenericSync.register({ - mouse: MouseSync, - touch: TouchSync -}); - -export default class extends React.Component { - componentDidMount() { - let clickSurface = this.refs.clickSurface.getFamous(); - let renderController = this.refs.renderController.getFamous(); - let surfaces = Object.keys(this.refs) - .filter((key) => startsWith(key, SURFACE_REF_PREFIX)) - .map((key) => this.refs[key].getFamous()); - let sync = new GenericSync({ - mouse: {}, - touch: {} - }); - let counter = 0; - - sync.on('end', (data) => { - let next = (counter + 1) % surfaces.length; - renderController.show(surfaces[next]); - counter += 1; - }); - - clickSurface.pipe(sync); - - FamousScheduler.schedule(() => { - if (surfaces[0]) { - renderController.show(surfaces[0]); - } - }); - } - - render() { - let surfaces = range(NUM_SURFACES).map((i) => { - let options = { - size: [200, 200], - properties: { - backgroundColor: 'hsl(' + (i * 360 / NUM_SURFACES) + ', 100%, 50%)', - lineHeight: '200px', - textAlign: 'center' - } - }; - return ( - - Surface: {i + 1} - - ); - }); - - return ( - - - Click anywhere on the screen. - - - - {surfaces} - - - - - - - ); - } -}; diff --git a/examples/components/views/ScrollContainer/App.jsx b/examples/components/views/ScrollContainer/App.jsx deleted file mode 100644 index 33b56da..0000000 --- a/examples/components/views/ScrollContainer/App.jsx +++ /dev/null @@ -1,52 +0,0 @@ -import startsWith from 'lodash/string/startsWith'; -import range from 'lodash/utility/range'; -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import ScrollContainer from 'react-famous/views/ScrollContainer'; - -const NUM_SURFACES = 40; -const SURFACE_REF_PREFIX = 'surface_'; - -export default class extends React.Component { - componentDidMount() { - let scrollContainer = this.refs.scrollContainer.getFamous(); - - Object.keys(this.refs) - .filter((key) => startsWith(key, SURFACE_REF_PREFIX)) - .map((key) => this.refs[key].getFamous()) - .forEach((surface) => surface.pipe(scrollContainer.scrollview)); - } - - render() { - let surfaces = range(NUM_SURFACES).map((idx) => { - let surfaceOptions = { - size: [undefined, 50], - properties: { - backgroundColor: 'hsl(' + (idx * 360 / NUM_SURFACES) + ', 100%, 50%)', - lineHeight: '50px', - textAlign: 'center' - } - }; - return ( - - Surface {idx + 1} - - ); - }); - - return ( - - - Surfaces are clipped by ScrollContainer. - - - - {surfaces} - - - - ); - } -}; diff --git a/examples/components/views/Scrollview/App.jsx b/examples/components/views/Scrollview/App.jsx deleted file mode 100644 index 4c2ee71..0000000 --- a/examples/components/views/Scrollview/App.jsx +++ /dev/null @@ -1,46 +0,0 @@ -import startsWith from 'lodash/string/startsWith'; -import range from 'lodash/utility/range'; -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Surface from 'react-famous/core/Surface'; -import Scrollview from 'react-famous/views/Scrollview'; - -const NUM_SURFACES = 40; -const SURFACE_REF_PREFIX = 'surface_'; - -export default class extends React.Component { - componentDidMount() { - let scrollview = this.refs.scrollview.getFamous(); - - Object.keys(this.refs) - .filter((key) => startsWith(key, SURFACE_REF_PREFIX)) - .map((key) => this.refs[key].getFamous()) - .forEach((surface) => surface.pipe(scrollview)); - } - - render() { - let surfaces = range(NUM_SURFACES).map((idx) => { - let options = { - properties: { - backgroundColor: 'hsl(' + (idx * 360 / NUM_SURFACES) + ', 100%, 50%)', - lineHeight: '100px', - textAlign: 'center' - }, - size: [undefined, 100] - }; - return ( - - Surface {idx + 1} - - ); - }); - - return ( - - - {surfaces} - - - ); - } -}; diff --git a/examples/components/views/SequentialLayout/App.jsx b/examples/components/views/SequentialLayout/App.jsx deleted file mode 100644 index 2727843..0000000 --- a/examples/components/views/SequentialLayout/App.jsx +++ /dev/null @@ -1,56 +0,0 @@ -import Utility from 'famous/utilities/Utility'; -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import RenderNode from 'react-famous/core/RenderNode'; -import Surface from 'react-famous/core/Surface'; -import SequentialLayout from 'react-famous/views/SequentialLayout'; - -export default class extends React.Component { - render() { - return ( - - - - - - - -

    Red

    -     -     -     -     - - Green - - - - Blue - - - - - - Navy - - - Brown - - - - Khaki - - - - - Maroon - - - - -     -     - ); - } -}; diff --git a/examples/components/views/SizeAwareView/App.jsx b/examples/components/views/SizeAwareView/App.jsx deleted file mode 100644 index b029591..0000000 --- a/examples/components/views/SizeAwareView/App.jsx +++ /dev/null @@ -1,28 +0,0 @@ -import React from 'react'; -import Context from 'react-famous/core/Context'; -import Modifier from 'react-famous/core/Modifier'; -import Surface from 'react-famous/core/Surface'; -import SizeAwareView from 'react-famous/views/SizeAwareView'; - -export default class extends React.Component { - componentDidMount() { - let sizeAwareView = this.refs.sizeAwareView.getFamous(); - let surface = this.refs.surface.getFamous(); - - sizeAwareView._eventInput.on('parentResize', ([width, height]) => { - surface.setContent(`Parent Size: ${width}px x ${height}px`); - }); - } - - render() { - return ( - - - - - - - - ); - } -}; diff --git a/examples/index.html b/examples/index.html deleted file mode 100644 index 02c466f..0000000 --- a/examples/index.html +++ /dev/null @@ -1,11 +0,0 @@ - - - - - - react-famous: React bridge to Famo.us - - - - - diff --git a/examples/index.js b/examples/index.js deleted file mode 100644 index 7dc2a63..0000000 --- a/examples/index.js +++ /dev/null @@ -1,13 +0,0 @@ -import './styles/index.less'; - -import 'famous/inputs/FastClick'; -import './lib/overscroll'; - -import React from 'react'; -import Router from 'react-router'; - -import routes from './routes'; - -Router.run(routes, function (Handler) { - React.render(React.createElement(Handler), document.body); -}); diff --git a/examples/lib/createContent.jsx b/examples/lib/createContent.jsx deleted file mode 100644 index 7b6947a..0000000 --- a/examples/lib/createContent.jsx +++ /dev/null @@ -1,25 +0,0 @@ -import isEqual from 'lodash/lang/isEqual'; -import React from 'react'; - -export default (group, member) => { - return class extends React.Component { - shouldComponentUpdate(nextProps, nextState) { - return !isEqual(this.props, nextProps) || !isEqual(this.state, nextState); - } - - render() { - let Component = require(`react-proxy!../components/${group}/${member}/App`); - - return ( -
    - - -
    - ); - } - } -}; diff --git a/examples/lib/overscroll.js b/examples/lib/overscroll.js deleted file mode 100644 index 5a12c76..0000000 --- a/examples/lib/overscroll.js +++ /dev/null @@ -1,72 +0,0 @@ -// -// A workarround to prevent iOS overscroll but allows overscroll on children elements. -// https://github.com/pinadesign/overscroll -// - -// JavaScript Document -(function(){ - // Declare variables - var touch_x, touch_y, obj_x, obj_y, speed_x=0, speed_y=0, scrollanim; - - document.addEventListener('touchstart', function(e) { - clearInterval(scrollanim); - // Get Touch target - obj_x = e.target - obj_y = e.target - // Get the target parent that is scrollable - while ((window.getComputedStyle(obj_x)['overflow-x'] != "auto" && window.getComputedStyle(obj_x)['overflow-x'] != "scroll") || obj_x.parentNode == null) { - obj_x = obj_x.parentNode - } - while ((window.getComputedStyle(obj_y)['overflow-y'] != "auto" && window.getComputedStyle(obj_y)['overflow-y'] != "auto") || obj_y.parentNode == null) { - obj_y = obj_y.parentNode - } - // Get if no scrollable parents are present set null - if (obj_x.parentNode == null) obj_x = null; - if (obj_y.parentNode == null) obj_y = null; - - // Get the touch starting point - var touch = e.touches[0]; - touch_x = touch.pageX; - touch_y = touch.pageY; - }, false); - - document.addEventListener('touchmove', function(e) { - // Clear animation - clearInterval(scrollanim); - - // Prevent window scrolling - e.preventDefault(); - - // Scroll according to movement - var touch = e.touches[0]; - obj_x.scrollLeft = obj_x.scrollLeft - (touch.pageX - touch_x) - obj_y.scrollTop = obj_y.scrollTop - (touch.pageY - touch_y) - - // Set speed speed - speed_x = (touch.pageX - touch_x) - speed_y = (touch.pageY - touch_y) - - // Set new positon - touch_x = touch.pageX; - touch_y = touch.pageY; - }, false); - - // Add a final animation as in iOS - document.addEventListener('touchend', function(e) { - // Clear previous animations - clearInterval(scrollanim); - - // Animate - scrollanim = setInterval(function() { - obj_x.scrollLeft = obj_x.scrollLeft - speed_x - obj_y.scrollTop = obj_y.scrollTop - speed_y - // Decelerate - speed_x = speed_x * 0.9; - speed_y = speed_y * 0.9; - - // Stop animation at the end - if (speed_x < 1 && speed_x > -1 && speed_y < 1 && speed_y > -1) clearInterval(scrollanim) - },15) - - }, false); -})(); \ No newline at end of file diff --git a/examples/routes.jsx b/examples/routes.jsx deleted file mode 100644 index 23c85a9..0000000 --- a/examples/routes.jsx +++ /dev/null @@ -1,44 +0,0 @@ -import { Route, DefaultRoute } from 'react-router'; - -import App from './components/App'; -import Home from './components/Home'; -import createContent from './lib/createContent'; -import Pass from './routes/Pass'; - -export default ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -); diff --git a/examples/routes/Pass.jsx b/examples/routes/Pass.jsx deleted file mode 100644 index 5baf63a..0000000 --- a/examples/routes/Pass.jsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react'; -import { RouteHandler } from 'react-router'; - -export default class extends React.Component { - render() { - return ; - } -}; diff --git a/examples/styles/index.less b/examples/styles/index.less deleted file mode 100644 index 06e4767..0000000 --- a/examples/styles/index.less +++ /dev/null @@ -1,98 +0,0 @@ -@import '~famous/core/famous.css'; - -html, body { - height: 100%; - margin: 0; - padding: 0; - width: 100%; -} - -body { - font-family: Tahoma, Geneva, sans-serif; - font-size: 14px; - overflow: hidden; - opacity: .999999; /* ios8 hotfix */ - -webkit-transform-style: preserve-3d; - transform-style: preserve-3d; -} - -a { - color: #111; - text-decoration: none; - - &:hover { - text-decoration: underline; - } -} - -.app { - > .menu { - background-color: #eee; - border-right: 1px solid #c8c8c8; - bottom: 0; - height: 100%; - left: 0; - overflow-y: auto; - position: absolute; - top: 0; - width: 170px; - z-index: 1000; - - > nav { - font-size: 1.5em; - font-weight: bold; - padding: 17px 0; - text-align: center; - } - - section.group { - margin-bottom: 10px; - - > header { - background-color: #c8c8c8; - font-size: 1.2em; - text-align: center; - padding: 5px; - } - - > ul { - list-style-type: none; - padding: 0; - - > li { - padding: 3px 15px; - } - } - } - } - - > .content { - height: 100%; - left: 170px; - position: absolute; - right: 0; - - .home { - a { - background-color: #eee; - padding: 7px 15px; - } - } - - .example { - .source-code { - background-color: rgba(0, 0, 0, 0.5); - padding: 10px 15px; - position: absolute; - right: 0; - text-align: center; - top: 0; - z-index: 999; - - a { - color: #eee; - } - } - } - } -} diff --git a/examples/webpack.config.js b/examples/webpack.config.js deleted file mode 100644 index d1e02c8..0000000 --- a/examples/webpack.config.js +++ /dev/null @@ -1,40 +0,0 @@ -var path = require('path'); - -var webpack = require('webpack'); - -module.exports = { - debug: true, - devtool: 'source-map', - entry: { - main: path.join(__dirname, 'index.js') - }, - module: { - loaders: [ - {test: /\.js$/, loader: 'babel?blacklist[]=react', exclude: /node_modules/}, - {test: /\.jsx$/, loaders: ['imports?React=react', 'react-hot', 'babel']}, - {test: /\.css$/, loader: 'style!css'}, - {test: /\.less$/, loader: 'style!css!less'} - ] - }, - output: { - filename: '[name].js', - path: path.join(__dirname, '../dist/examples'), - publicPath: '/_assets/' - }, - plugins: [ - new webpack.DefinePlugin({ - __DEV__: true - }) - ], - resolve: { - alias: { - 'react-famous': path.join(__dirname, '../src') - }, - extensions: [ - '', - '.js', - '.jsx' - ], - root: __dirname - } -}; diff --git a/examples/webpack.config.prod.js b/examples/webpack.config.prod.js deleted file mode 100644 index f4dc168..0000000 --- a/examples/webpack.config.prod.js +++ /dev/null @@ -1,50 +0,0 @@ -var path = require('path'); - -var ExtractTextPlugin = require('extract-text-webpack-plugin'); -var webpack = require('webpack'); - -module.exports = { - entry: { - main: path.join(__dirname, 'index.js') - }, - module: { - loaders: [ - {test: /\.js$/, loader: 'babel?blacklist[]=react', exclude: /node_modules/}, - {test: /\.jsx$/, loaders: ['imports?React=react', 'react-hot', 'babel']}, - {test: /\.css$/, loader: ExtractTextPlugin.extract('style', 'css')}, - {test: /\.less$/, loader: ExtractTextPlugin.extract('style', 'css!less')} - ] - }, - output: { - chunkFilename: 'js/[name].js?[chunkhash]', - filename: 'js/[name].js?[chunkhash]', - path: path.join(__dirname, '../dist/examples') - }, - plugins: [ - new webpack.DefinePlugin({ - '__DEV__': false, - 'process.env': { - NODE_ENV: JSON.stringify('production') - } - }), - new webpack.optimize.UglifyJsPlugin({ - output: { - comments: false - } - }), - new webpack.optimize.DedupePlugin(), - new webpack.NoErrorsPlugin(), - new ExtractTextPlugin('css/[name].css?[contenthash]') - ], - resolve: { - alias: { - 'react-famous': path.join(__dirname, '../src') - }, - extensions: [ - '', - '.js', - '.jsx' - ], - root: __dirname - } -}; From a039adc9920661364d676a9407d4a72dd92cda2d Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 29 Jul 2015 15:28:02 -0700 Subject: [PATCH 04/25] Removed tools dir, which will be replaced by a prepublish scripts and other scripts for various target formats. --- tools/publish/amd/README.md | 0 tools/publish/amd/package.json | 2 -- tools/publish/cjs/README.md | 11 ----------- tools/publish/cjs/package.json | 25 ------------------------- tools/publish/examples/index.html | 12 ------------ 5 files changed, 50 deletions(-) delete mode 100644 tools/publish/amd/README.md delete mode 100644 tools/publish/amd/package.json delete mode 100644 tools/publish/cjs/README.md delete mode 100644 tools/publish/cjs/package.json delete mode 100644 tools/publish/examples/index.html diff --git a/tools/publish/amd/README.md b/tools/publish/amd/README.md deleted file mode 100644 index e69de29..0000000 diff --git a/tools/publish/amd/package.json b/tools/publish/amd/package.json deleted file mode 100644 index 2c63c08..0000000 --- a/tools/publish/amd/package.json +++ /dev/null @@ -1,2 +0,0 @@ -{ -} diff --git a/tools/publish/cjs/README.md b/tools/publish/cjs/README.md deleted file mode 100644 index d084067..0000000 --- a/tools/publish/cjs/README.md +++ /dev/null @@ -1,11 +0,0 @@ -# react-famous - -Add [Famo.us](http://famo.us) interactions and animations to any [React](http://facebook.github.io/react/) application and build **Famo.us** applications with **React**. - -Using `react-famous`, you can: - -* Create **Famo.us** apps using familiar **React** component specs and lifecycle. -* Bring rich **Famo.us** animations to new or existing **React** apps. -* Easily integrate **Famo.us** and **React** apps. - -Please visit [the project page](https://github.com/pilwon/react-famous) for more information. diff --git a/tools/publish/cjs/package.json b/tools/publish/cjs/package.json deleted file mode 100644 index 7850910..0000000 --- a/tools/publish/cjs/package.json +++ /dev/null @@ -1,25 +0,0 @@ -{ - "name": "react-famous", - "description": "React bridge to Famo.us", - "version": "0.1.7", - "homepage": "https://github.com/pilwon/react-famous", - "keywords": [ - "react", - "react-component", - "famo.us", - "famous" - ], - "author": "Pilwon Huh ", - "license": "MIT", - "repository": { - "type": "git", - "url": "pilwon/react-famous" - }, - "bugs": { - "url": "https://github.com/pilwon/react-famous/issues" - }, - "peerDependencies": { - "famous": ">=0.3.5", - "react": ">=0.13.1" - } -} diff --git a/tools/publish/examples/index.html b/tools/publish/examples/index.html deleted file mode 100644 index 72a4d13..0000000 --- a/tools/publish/examples/index.html +++ /dev/null @@ -1,12 +0,0 @@ - - - - - react-famous: React bridge to Famo.us - - - - - - - From c6c1fa109a7dc3a5a292c629c78a8454b81e6878 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 29 Jul 2015 15:28:45 -0700 Subject: [PATCH 05/25] Updated root package.json based on the one that was in tools/. --- package.json | 30 ++++++++++++++++++++++++++---- 1 file changed, 26 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index 55afdf6..5285425 100644 --- a/package.json +++ b/package.json @@ -1,15 +1,32 @@ { "name": "react-famous", + "description": "React bridge to Famo.us", "version": "0.1.7", - "private": true, + "homepage": "https://github.com/pilwon/react-famous", + "author": "Pilwon Huh ", + "license": "MIT", + "main": "src/index.js", + "repository": { + "type": "git", + "url": "pilwon/react-famous" + }, + "bugs": { + "url": "https://github.com/pilwon/react-famous/issues" + }, + "scripts": { + "prepublish": "echo 'prepublish'" + }, "dependencies": { + "famous": "git+https://github.com/trusktr/engine.git#joe", + "react": "^0.13.1" + }, + "devDependencies": { "babel": "^4.7.3", "babel-core": "^4.7.3", "babel-loader": "^4.1.0", "css-loader": "^0.9.1", "del": "^1.1.1", "extract-text-webpack-plugin": "^0.3.8", - "famous": "^0.3.5", "gulp": "^3.8.11", "gulp-babel": "^4.0.0", "gulp-help": "^1.3.3", @@ -23,12 +40,17 @@ "lodash": "^3.4.0", "merge-stream": "^0.1.7", "minimist": "^1.1.0", - "react": "^0.13.1", "react-hot-loader": "^1.1.7", "react-proxy-loader": "^0.3.3", "react-router": "^0.13.2", "style-loader": "^0.8.3", "webpack": "^1.7.2", "webpack-dev-server": "^1.7.0" - } + }, + "keywords": [ + "react", + "react-component", + "famo.us", + "famous" + ] } From 370231bde0c42b3aa0d612b6fdaed863a8575fa9 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 29 Jul 2015 15:36:58 -0700 Subject: [PATCH 06/25] Use real import instead of relying on a global. --- src/Node.jsx | 1 + src/Scene.jsx | 1 + src/components/Align.jsx | 1 + src/components/Camera.jsx | 1 + src/components/MountPoint.jsx | 1 + src/components/Opacity.jsx | 1 + src/components/Origin.jsx | 1 + src/components/Position.jsx | 1 + src/components/Rotation.jsx | 1 + src/components/Scale.jsx | 1 + src/components/Size.jsx | 1 + src/components/Transform.jsx | 1 + src/dom-renderables/DOMElement.jsx | 1 + src/lib/FamousComponent.jsx | 1 + src/lib/FamousContextWrapper.jsx | 1 + src/webgl-renderables/Mesh.jsx | 1 + src/webgl-renderables/lights/AmbientLight.jsx | 1 + src/webgl-renderables/lights/PointLight.jsx | 1 + 18 files changed, 18 insertions(+) diff --git a/src/Node.jsx b/src/Node.jsx index c26d09c..8005c76 100644 --- a/src/Node.jsx +++ b/src/Node.jsx @@ -1,4 +1,5 @@ import isEqual from 'lodash/lang/isEqual'; +import React from 'react'; import FamousUtil from './lib/FamousUtil'; diff --git a/src/Scene.jsx b/src/Scene.jsx index ef0a957..422c266 100644 --- a/src/Scene.jsx +++ b/src/Scene.jsx @@ -2,6 +2,7 @@ import FamousEngine from 'famous/core/FamousEngine'; import isEqual from 'lodash/lang/isEqual'; import merge from 'lodash/object/merge'; import uniqueId from 'lodash/utility/uniqueId'; +import React from 'react'; import FamousUtil from './lib/FamousUtil'; diff --git a/src/components/Align.jsx b/src/components/Align.jsx index 88abe1d..97a523c 100644 --- a/src/components/Align.jsx +++ b/src/components/Align.jsx @@ -1,4 +1,5 @@ import FamousAlign from 'famous/components/Align'; +import React from 'react'; import FamousComponent from '../lib/FamousComponent'; diff --git a/src/components/Camera.jsx b/src/components/Camera.jsx index 423fdb1..337bc9c 100644 --- a/src/components/Camera.jsx +++ b/src/components/Camera.jsx @@ -1,4 +1,5 @@ import FamousCamera from 'famous/components/Camera'; +import React from 'react'; import FamousComponent from '../lib/FamousComponent'; diff --git a/src/components/MountPoint.jsx b/src/components/MountPoint.jsx index a0b3c49..fa06450 100644 --- a/src/components/MountPoint.jsx +++ b/src/components/MountPoint.jsx @@ -1,4 +1,5 @@ import FamousMountPoint from 'famous/components/MountPoint'; +import React from 'react'; import FamousComponent from '../lib/FamousComponent'; diff --git a/src/components/Opacity.jsx b/src/components/Opacity.jsx index 5e362db..f2af510 100644 --- a/src/components/Opacity.jsx +++ b/src/components/Opacity.jsx @@ -1,4 +1,5 @@ import FamousOpacity from 'famous/components/Opacity'; +import React from 'react'; import FamousComponent from '../lib/FamousComponent'; diff --git a/src/components/Origin.jsx b/src/components/Origin.jsx index 353d8df..07b9a42 100644 --- a/src/components/Origin.jsx +++ b/src/components/Origin.jsx @@ -1,4 +1,5 @@ import FamousOrigin from 'famous/components/Origin'; +import React from 'react'; import FamousComponent from '../lib/FamousComponent'; diff --git a/src/components/Position.jsx b/src/components/Position.jsx index 5c8a5bf..44e1ecf 100644 --- a/src/components/Position.jsx +++ b/src/components/Position.jsx @@ -1,4 +1,5 @@ import FamousPosition from 'famous/components/Position'; +import React from 'react'; import FamousComponent from '../lib/FamousComponent'; diff --git a/src/components/Rotation.jsx b/src/components/Rotation.jsx index d084989..2969fb4 100644 --- a/src/components/Rotation.jsx +++ b/src/components/Rotation.jsx @@ -1,4 +1,5 @@ import FamousRotation from 'famous/components/Rotation'; +import React from 'react'; import FamousComponent from '../lib/FamousComponent'; diff --git a/src/components/Scale.jsx b/src/components/Scale.jsx index 7ea1fd2..a711950 100644 --- a/src/components/Scale.jsx +++ b/src/components/Scale.jsx @@ -1,4 +1,5 @@ import FamousScale from 'famous/components/Scale'; +import React from 'react'; import FamousComponent from '../lib/FamousComponent'; diff --git a/src/components/Size.jsx b/src/components/Size.jsx index fd8a0aa..60e91da 100644 --- a/src/components/Size.jsx +++ b/src/components/Size.jsx @@ -1,4 +1,5 @@ import FamousSize from 'famous/components/Size'; +import React from 'react'; import FamousComponent from '../lib/FamousComponent'; diff --git a/src/components/Transform.jsx b/src/components/Transform.jsx index 7530748..0f1afa8 100644 --- a/src/components/Transform.jsx +++ b/src/components/Transform.jsx @@ -1,4 +1,5 @@ import FamousTransform from 'famous/components/Transform'; +import React from 'react'; import FamousComponent from '../lib/FamousComponent'; diff --git a/src/dom-renderables/DOMElement.jsx b/src/dom-renderables/DOMElement.jsx index e6463b0..b2379d9 100644 --- a/src/dom-renderables/DOMElement.jsx +++ b/src/dom-renderables/DOMElement.jsx @@ -2,6 +2,7 @@ import FamousEngine from 'famous/core/FamousEngine'; import FamousDOMElement from 'famous/dom-renderables/DOMElement'; import isEqual from 'lodash/lang/isEqual'; import isUndefined from 'lodash/lang/isUndefined'; +import React from 'react'; import FamousComponent from '../lib/FamousComponent'; import FamousContextWrapper from '../lib/FamousContextWrapper'; diff --git a/src/lib/FamousComponent.jsx b/src/lib/FamousComponent.jsx index 56ef6d7..a1fbc83 100644 --- a/src/lib/FamousComponent.jsx +++ b/src/lib/FamousComponent.jsx @@ -1,4 +1,5 @@ import isEqual from 'lodash/lang/isEqual'; +import React from 'react'; import FamousUtil from '../lib/FamousUtil'; import Scene from '../Scene'; diff --git a/src/lib/FamousContextWrapper.jsx b/src/lib/FamousContextWrapper.jsx index 9a9c9c5..7cea786 100644 --- a/src/lib/FamousContextWrapper.jsx +++ b/src/lib/FamousContextWrapper.jsx @@ -1,4 +1,5 @@ import FamousUtil from './FamousUtil'; +import React from 'react'; class FamousContextWrapper extends React.Component { getChildContext() { diff --git a/src/webgl-renderables/Mesh.jsx b/src/webgl-renderables/Mesh.jsx index 4044b09..0196190 100644 --- a/src/webgl-renderables/Mesh.jsx +++ b/src/webgl-renderables/Mesh.jsx @@ -1,6 +1,7 @@ import FamousColor from 'famous/utilities/Color'; import FamousGeometry from 'famous/webgl-geometries/Geometry'; import FamousMesh from 'famous/webgl-renderables/Mesh'; +import React from 'react'; import FamousComponent from '../lib/FamousComponent'; diff --git a/src/webgl-renderables/lights/AmbientLight.jsx b/src/webgl-renderables/lights/AmbientLight.jsx index a8051ba..e0406b7 100644 --- a/src/webgl-renderables/lights/AmbientLight.jsx +++ b/src/webgl-renderables/lights/AmbientLight.jsx @@ -1,5 +1,6 @@ import FamousColor from 'famous/utilities/Color'; import FamousAmbientLight from 'famous/webgl-renderables/lights/AmbientLight'; +import React from 'react'; import FamousComponent from '../../lib/FamousComponent'; diff --git a/src/webgl-renderables/lights/PointLight.jsx b/src/webgl-renderables/lights/PointLight.jsx index 16e5f22..100bb6d 100644 --- a/src/webgl-renderables/lights/PointLight.jsx +++ b/src/webgl-renderables/lights/PointLight.jsx @@ -1,5 +1,6 @@ import FamousColor from 'famous/utilities/Color'; import FamousPointLight from 'famous/webgl-renderables/lights/PointLight'; +import React from 'react'; import FamousComponent from '../../lib/FamousComponent'; From dbda11549c0890930ad8c0e73bdb372a977bfb38 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 29 Jul 2015 18:37:20 -0700 Subject: [PATCH 07/25] Removed gulpfile. --- gulpfile.js | 127 ---------------------------------------------------- 1 file changed, 127 deletions(-) delete mode 100644 gulpfile.js diff --git a/gulpfile.js b/gulpfile.js deleted file mode 100644 index 2cf76c6..0000000 --- a/gulpfile.js +++ /dev/null @@ -1,127 +0,0 @@ -var path = require('path'); -var util = require('util'); - -var gulp = require('gulp-help')(require('gulp')); -var gulpBabel = require('gulp-babel'); -var gulpRename = require('gulp-rename'); -var gulpShell = require('gulp-shell'); -var gulpUtil = require('gulp-util'); -var mergeStream = require('merge-stream'); -var merge = require('lodash/object/merge'); -var minimist = require('minimist'); - -gulp.task('clean', 'Clean built files.', function (cb) { - var del = require('del'); - del('dist', cb); -}); - -gulp.task('build', 'Build for all targets.', [ - 'build-amd', - 'build-cjs', - 'build-examples' -]); - -gulp.task('build-amd', 'Build for AMD.', function () { - var gulpWrapAMD = require('gulp-wrap-amd'); - - var copy = gulp - .src('tools/copy/amd/**') - .pipe(gulp.dest('dist/amd')); - - var src = gulp - .src('src/**/*.{js,jsx}') - .pipe(gulpBabel()) - .pipe(gulpWrapAMD()) - .pipe(gulpRename({extname: '.js'})) - .pipe(gulp.dest('dist/amd')); - - return mergeStream(copy, src); -}); - -gulp.task('build-cjs', 'Build for CommonJS.', function () { - var copy = gulp - .src('tools/publish/cjs/**') - .pipe(gulp.dest('dist/cjs')); - - var src = gulp - .src('src/**/*.{js,jsx}') - .pipe(gulpBabel()) - .pipe(gulpRename({extname: '.js'})) - .pipe(gulp.dest('dist/cjs')); - - return mergeStream(copy, src); -}); - -gulp.task('build-examples', 'Build examples.', function () { - var build = gulp.src('') - .pipe(gulpShell([ - 'node_modules/.bin/webpack', - '--colors', - '--config examples/webpack.config.prod.js', - '--profile', - '--progress' - ].join(' '), {cwd: __dirname})); - - var copy = gulp - .src('tools/publish/examples/**') - .pipe(gulp.dest('dist/examples')); - - return mergeStream(build, copy); -}); - -gulp.task('examples', 'Run examples.', function () { - var options = minimist(process.argv.slice(2), { - alias: { - p: 'port' - }, - default: { - port: 8080 - } - }); - - gulpUtil.log('[webpack-dev-server]', util.format('http://localhost:%d/', options.port)); - - return gulp.src('') - .pipe(gulpShell([ - 'node_modules/.bin/webpack-dev-server', - '--colors', - '--config examples/webpack.config.js', - '--content-base examples', - '--hot', - '--inline', - util.format('--port %d', options.port), - '--progress' - ].join(' '), {cwd: __dirname})); -}, { - options: { - 'port ': 'port (default: 8080)' - } -}); - -gulp.task('publish', 'Publish all targets.', [ - 'publish-amd', - 'publish-cjs' -]); - -gulp.task('publish-amd', 'Publish AMD.', function () { -}); - -gulp.task('publish-cjs', 'Publish CommonJS.', function () { - return gulp.src('') - .pipe(gulpShell([ - 'npm publish dist/cjs' - ], {cwd: __dirname})); -}); - -gulp.task('publish-examples', 'Publish Examples.', function () { - return gulp.src('') - .pipe(gulpShell([ - 'git init', - 'git add .', - 'git commit -m Publish', - 'git remote add origin git@github.com:react-famous/react-famous.github.io.git', - 'git push -fu origin master' - ].join('&&'), {cwd: path.join(__dirname, 'dist/examples')})); -}); - -gulp.task('default', false, ['help']); From 8d5ec31878d1cca82c892be4d85a853a54c98a8a Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 29 Jul 2015 18:43:41 -0700 Subject: [PATCH 08/25] Update .gitignore to ignore files built during prepublish. --- .gitignore | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/.gitignore b/.gitignore index 0382c0e..f4b11ca 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,7 @@ -/dist/ -/node_modules/ -/npm-debug.log +node_modules +npm-debug.log + +docs + +/*.js +/*.js.map From 32944dac235b11b6c36ded2f0b6bef12b1a34b02 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 29 Jul 2015 18:48:48 -0700 Subject: [PATCH 09/25] Ignore the folders built from the root of /src. --- .gitignore | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/.gitignore b/.gitignore index f4b11ca..56fd008 100644 --- a/.gitignore +++ b/.gitignore @@ -5,3 +5,7 @@ docs /*.js /*.js.map +/components +/dom-renderables +/lib +/webgl-renderables From efbe4c79ef2e440c21ae096d2c3ab67c5682f709 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 29 Jul 2015 19:18:33 -0700 Subject: [PATCH 10/25] Removed devDeps except for Babel. Added build scripts. --- package.json | 44 +++++++++++++++++--------------------------- 1 file changed, 17 insertions(+), 27 deletions(-) diff --git a/package.json b/package.json index 5285425..f53a181 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "react-famous", + "name": "reacfamo", "description": "React bridge to Famo.us", "version": "0.1.7", "homepage": "https://github.com/pilwon/react-famous", @@ -14,39 +14,29 @@ "url": "https://github.com/pilwon/react-famous/issues" }, "scripts": { - "prepublish": "echo 'prepublish'" + "test": "echo 'TODO: Test script' && exit 1", + "clean": "rm -rf ./*.js ./*.js.map components dom-renderables lib webgl-renderables", + "prepublish": "npm run build-cjs", + "postpublish": "npm run clean", + "build-umd": "babel src --source-maps --out-dir . --modules umd", + "build-cjs": "babel src --source-maps --out-dir . --modules common", + "build-amd": "babel src --source-maps --out-dir . --modules amd", + "build-global": "echo 'TODO: Global build' && exit 1" }, "dependencies": { "famous": "git+https://github.com/trusktr/engine.git#joe", "react": "^0.13.1" }, "devDependencies": { - "babel": "^4.7.3", - "babel-core": "^4.7.3", - "babel-loader": "^4.1.0", - "css-loader": "^0.9.1", - "del": "^1.1.1", - "extract-text-webpack-plugin": "^0.3.8", - "gulp": "^3.8.11", - "gulp-babel": "^4.0.0", - "gulp-help": "^1.3.3", - "gulp-rename": "^1.2.0", - "gulp-shell": "^0.3.0", - "gulp-util": "^3.0.4", - "gulp-wrap-amd": "^0.4.1", - "imports-loader": "^0.6.3", - "less": "^2.4.0", - "less-loader": "^2.1.0", - "lodash": "^3.4.0", - "merge-stream": "^0.1.7", - "minimist": "^1.1.0", - "react-hot-loader": "^1.1.7", - "react-proxy-loader": "^0.3.3", - "react-router": "^0.13.2", - "style-loader": "^0.8.3", - "webpack": "^1.7.2", - "webpack-dev-server": "^1.7.0" + "babel": "^5.6.6" }, + "jspm": { + "registry": "jspm", + "directories": { + "lib": "src" + } + }, + "browserify": {}, "keywords": [ "react", "react-component", From 5d34ffd8621573244325d0200fa1455efaab104e Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 29 Jul 2015 21:14:24 -0700 Subject: [PATCH 11/25] v0.1.8 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index f53a181..9a9580c 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "reacfamo", "description": "React bridge to Famo.us", - "version": "0.1.7", + "version": "0.1.8", "homepage": "https://github.com/pilwon/react-famous", "author": "Pilwon Huh ", "license": "MIT", From a3c142c2779264781b851ac028f1a2ce4e4a2b93 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 29 Jul 2015 21:15:35 -0700 Subject: [PATCH 12/25] Added empty .npmignore so npm doesn't ignore the built files that .gitignore ignores. --- .npmignore | 0 1 file changed, 0 insertions(+), 0 deletions(-) create mode 100644 .npmignore diff --git a/.npmignore b/.npmignore new file mode 100644 index 0000000..e69de29 From 1dedd818e0164df8f887ef088ef95e00030ef2d1 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 29 Jul 2015 21:16:04 -0700 Subject: [PATCH 13/25] v0.1.9 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 9a9580c..b4a6bef 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "reacfamo", "description": "React bridge to Famo.us", - "version": "0.1.8", + "version": "0.1.9", "homepage": "https://github.com/pilwon/react-famous", "author": "Pilwon Huh ", "license": "MIT", From a71b16e92c1c4ee6b802b0725ed434a4b1e47752 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Tue, 18 Aug 2015 18:55:37 -0700 Subject: [PATCH 14/25] Correct main file. --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index b4a6bef..a0e0a42 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,7 @@ "homepage": "https://github.com/pilwon/react-famous", "author": "Pilwon Huh ", "license": "MIT", - "main": "src/index.js", + "main": "index.js", "repository": { "type": "git", "url": "pilwon/react-famous" From 2d4635b1c9d8f25efa205a3b817111f4e23cce63 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Thu, 20 Aug 2015 22:23:51 -0700 Subject: [PATCH 15/25] depend on infamous/engine#webpack for now. --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index a0e0a42..d317045 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,7 @@ "build-global": "echo 'TODO: Global build' && exit 1" }, "dependencies": { - "famous": "git+https://github.com/trusktr/engine.git#joe", + "famous": "git+https://github.com/infamous/engine.git#webpack", "react": "^0.13.1" }, "devDependencies": { From 8fc76f9696b9c917c29d2401c707c489a52bcd88 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Thu, 20 Aug 2015 22:30:30 -0700 Subject: [PATCH 16/25] v0.1.7-0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index d317045..b6f37b1 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "reacfamo", "description": "React bridge to Famo.us", - "version": "0.1.9", + "version": "0.1.7-0", "homepage": "https://github.com/pilwon/react-famous", "author": "Pilwon Huh ", "license": "MIT", From 90ae59772ffa3b013b10dc7ab4ba432e83bb62a4 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Tue, 25 Aug 2015 17:04:10 -0700 Subject: [PATCH 17/25] Depend on infamous-engine ^0.1.7-webpack.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index b6f37b1..3e42231 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,7 @@ "build-global": "echo 'TODO: Global build' && exit 1" }, "dependencies": { - "famous": "git+https://github.com/infamous/engine.git#webpack", + "infamous-engine": "^0.7.1-webpack.0", "react": "^0.13.1" }, "devDependencies": { From 4ae9b84e7482573f4130865eb7b91805b872f774 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Tue, 25 Aug 2015 17:07:09 -0700 Subject: [PATCH 18/25] v0.1.7-1 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 3e42231..d31808e 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "reacfamo", "description": "React bridge to Famo.us", - "version": "0.1.7-0", + "version": "0.1.7-1", "homepage": "https://github.com/pilwon/react-famous", "author": "Pilwon Huh ", "license": "MIT", From 7089c5657366fab2665d60868753ce2b42cac7aa Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Tue, 15 Sep 2015 09:40:22 -0700 Subject: [PATCH 19/25] Added Webpack and co, and src/global.js for global builds. --- package.json | 10 ++++++++-- src/global.js | 19 +++++++++++++++++++ 2 files changed, 27 insertions(+), 2 deletions(-) create mode 100644 src/global.js diff --git a/package.json b/package.json index d31808e..34959f1 100644 --- a/package.json +++ b/package.json @@ -21,14 +21,20 @@ "build-umd": "babel src --source-maps --out-dir . --modules umd", "build-cjs": "babel src --source-maps --out-dir . --modules common", "build-amd": "babel src --source-maps --out-dir . --modules amd", - "build-global": "echo 'TODO: Global build' && exit 1" + "build-global": "webpack --progress --colors src/global.js react-famous.js" }, "dependencies": { "infamous-engine": "^0.7.1-webpack.0", "react": "^0.13.1" }, "devDependencies": { - "babel": "^5.6.6" + "babel": "^5.6.6", + "babel-loader": "^5.3.2", + "babelify": "^6.3.0", + "browserify": "^11.1.0", + "glslify-loader": "^1.0.2", + "raw-loader": "^0.5.1", + "webpack": "^1.12.1" }, "jspm": { "registry": "jspm", diff --git a/src/global.js b/src/global.js new file mode 100644 index 0000000..5ff1e21 --- /dev/null +++ b/src/global.js @@ -0,0 +1,19 @@ +import components from './components'; +import domRenderables from './dom-renderables'; +import webglRenderables from './webgl-renderables'; + +import Node from './Node'; +import Scene from './Scene'; + +let globalRef = this // whatever `this` is if there's no browser or node.js +if (window) globalRef = window // browser +else if (global) globalRef = global // node.js + +globalRef.reactFamous = { + components, + domRenderables, + webglRenderables, + + Node, + Scene, +} From 55f6b6b83a7fbf1a37e789de885d5cf4c9412b4b Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Tue, 15 Sep 2015 20:09:58 -0700 Subject: [PATCH 20/25] Added index files for lib. --- src/global.js | 4 ++++ src/index.js | 4 ++++ src/lib/index.js | 10 ++++++++++ 3 files changed, 18 insertions(+) create mode 100644 src/lib/index.js diff --git a/src/global.js b/src/global.js index 5ff1e21..45873af 100644 --- a/src/global.js +++ b/src/global.js @@ -2,6 +2,8 @@ import components from './components'; import domRenderables from './dom-renderables'; import webglRenderables from './webgl-renderables'; +import lib from './lib'; + import Node from './Node'; import Scene from './Scene'; @@ -14,6 +16,8 @@ globalRef.reactFamous = { domRenderables, webglRenderables, + lib, + Node, Scene, } diff --git a/src/index.js b/src/index.js index 406d419..0dff647 100644 --- a/src/index.js +++ b/src/index.js @@ -2,6 +2,8 @@ import components from './components'; import domRenderables from './dom-renderables'; import webglRenderables from './webgl-renderables'; +import lib from './lib'; + import Node from './Node'; import Scene from './Scene'; @@ -10,6 +12,8 @@ export default { domRenderables, webglRenderables, + lib, + Node, Scene, }; diff --git a/src/lib/index.js b/src/lib/index.js new file mode 100644 index 0000000..00cdd6f --- /dev/null +++ b/src/lib/index.js @@ -0,0 +1,10 @@ + +import FamousComponent from './FamousComponent' +import FamousContextWrapper from './FamousContextWrapper' +import FamousUtil from './FamousUtil' + +export default { + FamousComponent, + FamousContextWrapper, + FamousUtil, +} From db733e90524771166eb515917956443fb33c51ff Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Tue, 15 Sep 2015 22:48:48 -0700 Subject: [PATCH 21/25] Provide a famous global for people who use the react-famous global, otherwise if they use classes from a different famous global, then they will have duplicate Singletons of some classes (like the FamousEngine for example) and that will cause unexpected error that are hard to debug. This would need to be well documented. What do you think @pilwon? --- src/global.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/global.js b/src/global.js index 45873af..aaf03d0 100644 --- a/src/global.js +++ b/src/global.js @@ -7,6 +7,8 @@ import lib from './lib'; import Node from './Node'; import Scene from './Scene'; +import famous from 'famous' + let globalRef = this // whatever `this` is if there's no browser or node.js if (window) globalRef = window // browser else if (global) globalRef = global // node.js @@ -21,3 +23,5 @@ globalRef.reactFamous = { Node, Scene, } + +globalRef.famous = famous From feb20ff47b21ded1c3e14433d0edefa1456ad96b Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 16 Sep 2015 08:22:02 -0700 Subject: [PATCH 22/25] Attach React to the window as well. This would need to be documented for global users. @pilwon, maybe we can instead make a script that strips out the React and Famous imports, then we tell the user to make sure to include both React and Famous in their project. TODO: The check for window or global can be better, so if window or global aren't defined then it won't fail. --- src/global.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/global.js b/src/global.js index aaf03d0..dfe18f6 100644 --- a/src/global.js +++ b/src/global.js @@ -8,6 +8,7 @@ import Node from './Node'; import Scene from './Scene'; import famous from 'famous' +import React from 'react' let globalRef = this // whatever `this` is if there's no browser or node.js if (window) globalRef = window // browser @@ -25,3 +26,4 @@ globalRef.reactFamous = { } globalRef.famous = famous +globalRef.React = React From de3ed669b286a11e7efcb739cc620a0eb332a2d4 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 16 Sep 2015 19:12:27 -0700 Subject: [PATCH 23/25] Save the webpack.config.js file during clean. --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 34959f1..14885c0 100644 --- a/package.json +++ b/package.json @@ -15,7 +15,7 @@ }, "scripts": { "test": "echo 'TODO: Test script' && exit 1", - "clean": "rm -rf ./*.js ./*.js.map components dom-renderables lib webgl-renderables", + "clean": "mv webpack.config.js webpack.config.save && rm -rf ./*.js ./*.js.map components dom-renderables lib webgl-renderables && mv webpack.config.save webpack.config.js", "prepublish": "npm run build-cjs", "postpublish": "npm run clean", "build-umd": "babel src --source-maps --out-dir . --modules umd", From 363884859764d966abdd0683d9b453db9cebec36 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 16 Sep 2015 19:48:34 -0700 Subject: [PATCH 24/25] Better clean script. Use the index.js file for the global, and just build to UMD format with webpack. --- package.json | 4 ++-- src/global.js | 29 ----------------------------- 2 files changed, 2 insertions(+), 31 deletions(-) delete mode 100644 src/global.js diff --git a/package.json b/package.json index 14885c0..4e13791 100644 --- a/package.json +++ b/package.json @@ -15,13 +15,13 @@ }, "scripts": { "test": "echo 'TODO: Test script' && exit 1", - "clean": "mv webpack.config.js webpack.config.save && rm -rf ./*.js ./*.js.map components dom-renderables lib webgl-renderables && mv webpack.config.save webpack.config.js", + "clean": "mkdir save && mv webpack.config.js save && rm -rf ./*.js ./*.js.map components dom-renderables lib webgl-renderables && mv save/* . && rmdir save", "prepublish": "npm run build-cjs", "postpublish": "npm run clean", "build-umd": "babel src --source-maps --out-dir . --modules umd", "build-cjs": "babel src --source-maps --out-dir . --modules common", "build-amd": "babel src --source-maps --out-dir . --modules amd", - "build-global": "webpack --progress --colors src/global.js react-famous.js" + "build-global": "webpack --progress --colors --output-library-target umd --output-library reactFamous src/index.js react-famous.js" }, "dependencies": { "infamous-engine": "^0.7.1-webpack.0", diff --git a/src/global.js b/src/global.js deleted file mode 100644 index dfe18f6..0000000 --- a/src/global.js +++ /dev/null @@ -1,29 +0,0 @@ -import components from './components'; -import domRenderables from './dom-renderables'; -import webglRenderables from './webgl-renderables'; - -import lib from './lib'; - -import Node from './Node'; -import Scene from './Scene'; - -import famous from 'famous' -import React from 'react' - -let globalRef = this // whatever `this` is if there's no browser or node.js -if (window) globalRef = window // browser -else if (global) globalRef = global // node.js - -globalRef.reactFamous = { - components, - domRenderables, - webglRenderables, - - lib, - - Node, - Scene, -} - -globalRef.famous = famous -globalRef.React = React From 9b3c3052a7bc2b3235f1f80874671af8e3cfd965 Mon Sep 17 00:00:00 2001 From: Joseph Orbegoso Pea Date: Wed, 16 Sep 2015 22:36:45 -0700 Subject: [PATCH 25/25] Use the Babel runtime to prevent from having duplicate helpers in every file. --- package.json | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/package.json b/package.json index 4e13791..af0d239 100644 --- a/package.json +++ b/package.json @@ -18,9 +18,9 @@ "clean": "mkdir save && mv webpack.config.js save && rm -rf ./*.js ./*.js.map components dom-renderables lib webgl-renderables && mv save/* . && rmdir save", "prepublish": "npm run build-cjs", "postpublish": "npm run clean", - "build-umd": "babel src --source-maps --out-dir . --modules umd", - "build-cjs": "babel src --source-maps --out-dir . --modules common", - "build-amd": "babel src --source-maps --out-dir . --modules amd", + "build-umd": "babel src --source-maps --optional runtime --out-dir . --modules umd", + "build-cjs": "babel src --source-maps --optional runtime --out-dir . --modules common", + "build-amd": "babel src --source-maps --optional runtime --out-dir . --modules amd", "build-global": "webpack --progress --colors --output-library-target umd --output-library reactFamous src/index.js react-famous.js" }, "dependencies": { @@ -30,6 +30,7 @@ "devDependencies": { "babel": "^5.6.6", "babel-loader": "^5.3.2", + "babel-runtime": "^5.8.24", "babelify": "^6.3.0", "browserify": "^11.1.0", "glslify-loader": "^1.0.2",