/*
 * DAVIDS lets you find and view duplicates in your Spotify playlists.
 * Copyright (C) 2016  Gabriel Augendre <gabriel@augendre.info>
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */

'use strict';
var React = require('react');
var ReactBootstrap = require('react-bootstrap');
var $ = require('jquery');

var DuplicatesBox = require('./duplicates-box');
var PlaylistBox = require('./playlist-box');

var DuplicateFinderBox = React.createClass({
    getInitialState: function () {
        return {
            currentId: null,
            currentUId: null,
            dups: null,
            dupsLoading: false,
            clicked: false
        };
    },
    componentWillReceiveProps: function () {
        this.setState({
            clicked: false
        });
    },
    handlePlaylistClick: function (id, uid) {
        this.setState({
            currentId: id,
            currentUId: uid,
            dupsLoading: true,
            clicked: true
        });
        var self = this;

        $.ajax({
            url: "/pl/" + uid + "/" + id,
            data: {
                'access_token': self.props.auth.access_token
            },
            success: function (data) {
                var dups = data.data;
                self.setState({
                    dups: dups,
                    dupsLoading: false
                });
            },
            error: function (xhr, response, err) {
                console.error(response, err);
            }
        });
    },
    render: function () {
        var duplicates;
        var Col = ReactBootstrap.Col,
            Row = ReactBootstrap.Row;

        if (this.state.clicked) {
            duplicates = <p>Loading...</p>;
            if (!this.state.dupsLoading) {
                duplicates = <DuplicatesBox dups={this.state.dups}/>;
            }
            duplicates = (
                <Col md={9} sm={8}>
                    <h2>Duplicates</h2>
                    {duplicates}
                </Col>
            )
        }

        var playlistBox = <p>Loading...</p>;
        if (!this.props.playlistsLoading) {
            playlistBox = <PlaylistBox handleClick={this.handlePlaylistClick} playlists={this.props.playlists}/>;
        }

        return (
            <Row>
                <Col md={3} sm={4}>
                    <h2>Playlists</h2>
                    {playlistBox}
                </Col>
                {duplicates}
            </Row>
        );
    }
});

module.exports = DuplicateFinderBox;