const _ = require('lodash');

require('./css/app.css');

const {Stage, TilingSprite, Text} = require('react-pixi');
const {Point, Texture} = PIXI;

const fullTexture = Texture.fromImage('assets/base.png');

/*
 <Text text="0" x={0} y={0} style={fontStyle} anchor={new Point(0,0)}/>
 <Text text="0" x={15} y={0} style={fontStyle} anchor={new Point(0,0)}/>
 */
var ExampleStage = React.createClass({
  displayName : 'ExampleStage',
  render : function () {
    //var fontStyle = { font : '12px Times' };
    return <Stage width={this.props.width} height={this.props.height} backgroundcolor={0xD0D0D0}>
      <TilingSprite x={50} y={0} image={'assets/base.png'} tilePosition={new Point(0,0)} tint={0x000000} width={768} height={768}/>
      <TilingSprite x={0} y={0} image={'assets/base.png'} tilePosition={new Point(0,48)} tint={0x000000} width={48} height={48}/>
    </Stage>;
  }
});

const App = React.createClass({
  render() {
    return (
      <div>
        <ExampleStage width={1200} height={1200}/>
      </div>
    );
  }
});

React.render(<App />, document.getElementById('content'));
