<commit_before>'use strict';

var React = require('react'),
    Router = require('react-router'),
    Immutable = require('immutable'),
    AppConstants = require('../AppConstants'),
    ActionCreators = require('../ActionCreators'),
    TrainStore = require('../stores/TrainStore'),
    LineStore = require('../stores/LineStore'),
    LineResources = require('../stores/LineResources'),
    Line;

function getState() {
    // Maybe only grab the colour?
    return {
        lines: LineStore.getLines(),
        trains: TrainStore.getTrainLines(),
        trainsAtStations: TrainStore.getTrainsAtStations()
    };
}

var LineSVG = React.createClass({
        render: function() {
            return (<svg {...this.props}>{this.props.children}</svg>);
        }
});


var Station = React.createClass({
    render: function() {
        return (
                <svg>
                    <text x={this.props.x + 25} y={this.props.y}>{this.props.name}</text>
                    <circle cx={this.props.x} cy={this.props.y} r="25"> station </circle>
                </svg>
                );
    }
});

var TrainLine = React.createClass({
    render: function() {
        return( <line {...this.props} strokeWidth="20" stroke={this.props.colour} />)
    }
});

var Train = React.createClass({
    render: function() {
        var x = this.props.x;
        var y = this.props.y;
        return ( <rect height="50" width="50" x={this.props.x} y={this.props.y - 25}>{this.props.children}</rect>)
    }
});


var StationTree = React.createClass({
    render: function() {
        var { station, ...other } = this.props;
        var trainsAtStations = this.props.trainsAtStations;
        var centerPoint = this.props.width / 2;
        var xscale = this.props.xscale;
        var yscale = this.props.yscale;
        var name = this.props.station.get('name');

        var children = this.props.station.get('next_stations');
        var x = centerPoint + (xscale * parseInt(station.get('x')));
        var y = yscale * parseInt(station.get('y'));

        var nextStations = children.map(nextStation => <StationTree station={nextStation} {...other} />);

        var trainLines = children.map(nextStation => <TrainLine x1={x} y1={y}
                                                        x2={centerPoint + (this.props.xscale * parseInt(nextStation.get('x')))}
                                                        y2={parseInt(nextStation.get('y')) * this.props.yscale}
                                                        colour={this.props.colour} />);

        var trains = Immutable.Map();
        var station = trainsAtStations.get(name);
        if (station) {
            trains = station.map(function(train, offset) {
                offset = offset + 1;
                var station = this.props.station;
                var xscale = this.props.xscale;
                var yscale = this.props.yscale;
                var x = centerPoint + (xscale * parseInt(station.get('x'))) - (offset * 80);
                var y = yscale * parseInt(station.get('y'));

                if (train.get('direction') == 'Westbound' || train.get('direction') == 'Northbound') {
                    // TODO: MAKE THE TRAINS DIFFERENT
                    return (<Train x={x} y={y} />);
                } else {
                    return (<Train x={x} y={y} />);
                }
            }, this);
        }

        return (
                <svg>
                    {trainLines.toJS()}
                    {nextStations.toJS()}
                    {trains.toJS()}
                    <Station x={x} y={y} name={name}/>
                </svg>);
    }
});


var LineInfo = React.createClass({
    render: function() {
        var directions = this.props.line.get('directions');
        var cols = 12;
        var directionColumns = null;
        if (directions && directions.size > 0) {
            cols = Math.floor(12 / directions.size);
            directionColumns = directions.map(function(deets, direction) {
                return (
                    <div key={direction} className={"col-sm-" + cols}>
                        <h3>{direction}</h3>
                        <p>
                            {deets.get('fuckedness')}
                            <br/>
                            Avg wait {deets.get('wait')}
                            <br/>
                            {deets.get('trains')} active trains
                        </p>
                    </div>
                );<commit_msg>basic directions (needs mobile scaling)<commit_after>'use strict';

var React = require('react'),
    Router = require('react-router'),
    Immutable = require('immutable'),
    AppConstants = require('../AppConstants'),
    ActionCreators = require('../ActionCreators'),
    TrainStore = require('../stores/TrainStore'),
    LineStore = require('../stores/LineStore'),
    LineResources = require('../stores/LineResources'),
    Line;

function getState() {
    // Maybe only grab the colour?
    return {
        lines: LineStore.getLines(),
        trains: TrainStore.getTrainLines(),
        trainsAtStations: TrainStore.getTrainsAtStations()
    };
}

var LineSVG = React.createClass({
        render: function() {
            return (<svg {...this.props}>{this.props.children}</svg>);
        }
});


var Station = React.createClass({
    render: function() {
        return (
                <g>
                    <text x={this.props.x + 25} y={this.props.y}>{this.props.name}</text>
                    <circle cx={this.props.x} cy={this.props.y} r="25"> station </circle>
                </g>
                );
    }
});

var TrainLine = React.createClass({
    render: function() {
        return( <line {...this.props} strokeWidth="20" stroke={this.props.colour} />)
    }
});

var Train = React.createClass({

    northbound: function(x,y) {
        return x+","+y+" "+(x-30)+","+(y+40)+" "+(x+30)+","+(y+40);
    },

    southbound: function(x,y) {
        return x+","+y+" "+(x-30)+","+(y-40)+" "+(x+30)+","+(y-40);
    },

    render: function() {
        var x = parseInt(this.props.x);
        var y = parseInt(this.props.y);
        var direction = this.props.dir;
        if (direction == 'Westbound' || direction == 'Northbound') {
            var points = this.northbound(x,y);
        } else {
            var points = this.southbound(x,y);
        }
        return(<polygon points={points}></polygon>)
    }
});


var StationTree = React.createClass({
    render: function() {
        var { station, ...other } = this.props;
        var trainsAtStations = this.props.trainsAtStations;
        var centerPoint = this.props.width / 2;
        var xscale = this.props.xscale;
        var yscale = this.props.yscale;
        var name = this.props.station.get('name');

        var children = this.props.station.get('next_stations');
        var x = centerPoint + (xscale * parseInt(station.get('x')));
        var y = yscale * parseInt(station.get('y'));

        var nextStations = children.map(nextStation => <StationTree station={nextStation} {...other} />);

        var trainLines = children.map(nextStation => <TrainLine x1={x} y1={y}
                                                        x2={centerPoint + (this.props.xscale * parseInt(nextStation.get('x')))}
                                                        y2={parseInt(nextStation.get('y')) * this.props.yscale}
                                                        colour={this.props.colour} />);

        var trains = Immutable.Map();
        var station = trainsAtStations.get(name);
        if (station) {
            trains = station.map(function(train, offset) {
                offset = offset + 1;
                var station = this.props.station;
                var xscale = this.props.xscale;
                var yscale = this.props.yscale;
                var x = centerPoint + (xscale * parseInt(station.get('x'))) - (offset * 80);
                var y = yscale * parseInt(station.get('y'));
                return (<Train x={x} y={y} dir={train.get('direction')}/>);
            }, this);
        }

        return (<g>
                    {trainLines.toJS()}
                    {nextStations.toJS()}
                    {trains.toJS()}
                    <Station x={x} y={y} name={name}/>
                </g>);
    }
});


var LineInfo = React.createClass({
    render: function() {
        var directions = this.props.line.get('directions');
        var cols = 12;
        var directionColumns = null;
        if (directions && directions.size > 0) {
            cols = Math.floor(12 / directions.size);
            directionColumns = directions.map(function(deets, direction) {
                return (
                    <div key={direction} className={"col-sm-" + cols}>
                        <h3>{direction}</h3>
                        <p>
                            {deets.get('fuckedness')}
                            <br/>
                            Avg wait {deets.get('wait')}
                            <br/>
                            {deets.get('trains')} active trains
                        </p>
                    </div>
                );
{'fraction_non_alphanumeric': 0.15321790264619406, 'fraction_numerical': 0.006969399978220625, 'mean_word_length': 1.6187624750499001, 'pattern_counts': {'":': 0, '<': 54, '<?xml version=': 0, '>': 60, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 12, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5794171', 'n_tokens_mistral': 2653, 'n_tokens_neox': 2536, 'n_words': 510}