'use strict';

var BuoyAnalysisUiBehaviors = {
    stationClick: function() {

    },

    stationMouseover: function() {

    },

    reticleDrag: function(d) {
        d.x += d3.event.dx
        d.y += d3.event.dy

        d3.select(this).attr('transform', 'translate(' + [ d.x, d.y ] + ')');
    },

    reticleDragEnd: function(d) {
        var dX, dY, squares, distance, station;
        var stations = [];

        for (var s in BuoyAnalysisData.stationJson) {
            station = BuoyAnalysisData.stationJson[s];

            dX = d.x - station.x;
            dY = d.y - station.y;

            squares = Math.pow(dX, 2) + Math.pow(dY, 2)
            distance = Math.pow(squares, 0.5);

            if (distance < 50) {
                stations.push(s);
            }
        };

        BuoyAnalysisData.calculateYearlyAverages(stations);
        BuoyAnalysisData.calculateMonthlyAverages(stations, 1982);
    },

    reticleResize: function() {

    },

    attachBehaviors: function() {
        // d3.selectAll('.detail')
            // .on('mouseover', startAnimateStation)
            // .on('mouseout', stopAnimateStation);

        d3.select('.reticle')
            .call(d3.behavior.drag()
                .on('drag', BuoyAnalysisUiBehaviors.reticleDrag)
                .on('dragend', BuoyAnalysisUiBehaviors.reticleDragEnd)
            );


    },
};



//     function startAnimateStation() {
//         var id = d3.event.target.id || d3.event.target.parentNode.id;
//         var selector = '#' + id.split('-')[1];

//         d3.select(selector)
//             .transition()
//             .attr('r', '10')
//             .duration(200)
//     };

//     function stopAnimateStation() {
//         var id = d3.event.target.id || d3.event.target.parentNode.id;
//         var selector = '#' + id.split('-')[1];

//         d3.select(selector)
//             .transition()
//             .attr('r', '3')
//             .duration(200)
//     };

//     /**
//      *
//      */
//     function startAnimateDetail() {
//         var id = d3.event.target.id;
//         d3.select('#detail-' + id)
//             .classed('active', true)
//     }

//     /**
//      *
//      */
//     function stopAnimateDetail() {
//         var id = d3.event.target.id;
//         d3.select('#detail-' + id)
//             .classed('active', false)
//     }