// The code below is no longer being used due to not being able to get daily/weekly/monthly ranking.

/*

var Ranking = React.createClass({
    render: function() {
        var rankClass = ( this.props.rank > 3) ? "fa-stack fa-lg rank" : "fa-stack fa-lg rank" + this.props.rank;
        var categoryNodes = this.props.ranking.categories.map(function(category){
            return (
                <a href={category.search_url}>{category.name}</a>
            );
        });
        var areaNodes = this.props.ranking.areas.map(function(area){
            return (
                <a href={area.search_url}>{area.name}</a>
            );
        });
        var rankingTitle = this.props.ranking.title;
        if(navigator.userAgent.match(/(iPhone|iPod|Android)/)){
            if (rankingTitle.length > 22) {
                rankingTitle = rankingTitle.substring(0, 22) + "...";
            }
        }
        return (
            <li className="clearfix">
                <span className={rankClass}><i className="fa fa-circle fa-stack-2x" /><span className="fa-stack-1x">{this.props.rank}</span></span>
                <a href={this.props.ranking.permalink} className="head"><div className="imgSide"><img src={this.props.ranking.image.url} alt={this.props.ranking.image.alt} /></div></a>
                <div className="textSide">
                    <a href={this.props.ranking.permalink} className="head">{rankingTitle}</a>
                    <ul>
                        <li className="area">{categoryNodes}</li>
                        <li className="area">{areaNodes}</li>
                        <li className="date sp">{this.props.ranking.date}</li>
                    </ul>
                </div>
            </li>
        );
    }
});


var RankingList = React.createClass({
    getInitialState: function() {
        return {rankings: []};
    },
    componentDidMount: function() {
        $.ajax({
            url: "/api/search?posts_per_page=10&orderby=views&order=desc",
            dataType: 'json',
            cache: false,
            success: function(result) {
                var rankings = result.posts;
                this.setState({rankings: rankings});
                if(navigator.userAgent.match(/(iPhone|iPod|Android)/)){
                    $(document).ready(function(){
                        // heightLine
                        $(".articleList>li , #side .ranking .rankList > li").heightLine();
                    });
                }
            }.bind(this),
            error: function(xhr, status, err) {
                console.error(this.props.url, status, err.toString());
            }.bind(this)
        });
    },
    render: function() {
        var rankingNodes = this.state.rankings.map(function(ranking, index){
            var rank = ( parseInt(index) + 1 );
            return (
                <Ranking ranking={ranking} rank={rank} />
            );
        });
        return (
            <ul className="rankList">
                {rankingNodes}
            </ul>
        );
    }
});

ReactDOM.render(
    <RankingList />,
    document.getElementById('ranking-list')
);
*/