var CheckpointsView = {
    autoCheckpoints: [],
    manualCheckpoints: [],
    autoMode: true,
    unitSystem: 0, //default

    renderHTML: function(checkpoints, manual) {
        var html = '<table class="gmap-box">';
        if (manual) {
            CheckpointsView.manualCheckpoints = checkpoints;
            html += '<caption>Manual checkpoints</caption>';
        } else {
            CheckpointsView.autoCheckpoints = checkpoints;
            html += '<caption>Automatic checkpoints</caption>';
        }
        var prevPoint;
        html += '<tr> <th>#</th><th>Length</th> <th>Time</th> <th>' + Convertor.SPEED[CheckpointsView.unitSystem] + '</th></tr>';
        //html += '<tr> <th>&nbsp</th><th>(' + Convertor.DISTANCE[CheckpointsView.unitSystem] + ')</th> <th>(mm:ss)</th> <th>(' + Convertor.SPEED[CheckpointsView.unitSystem] + '  )</th></tr>';
        for (var i = 0; i < checkpoints.length; i++) {
            if (i > 0) {
                html += '<tr>';
                html += '<td style="text-align:center">' + i + '</td>';
                var dist = checkpoints[i].distance - prevPoint.distance;
                var time = checkpoints[i].timefromstart - prevPoint.timefromstart;
                var avgSpeed = (dist / (time / 1000));
                html += '<td style="text-align:right">' + Convertor.toDistanceString(dist, CheckpointsView.unitSystem) + '</td>';
                html += '<td style="text-align:right">' + Util.formatTime(time) + '</td>';
                html += '<td style="text-align:right">' + Convertor.toSpeed(avgSpeed, CheckpointsView.unitSystem) + '</td>';
                html += '</tr>';
            }
            prevPoint = checkpoints[i];
        }
        if (manual) {
            html += '<tr><td colspan="4">&nbsp;</td></tr>';
            html += '<tr><td colspan="4">Click on the track line to add checkpoints</td></tr>';
        }
        html += '</table>';
        if (manual) {
            $('#checkpoints').html(html);
        } else {
            $('#auto').html(html);
        }
    },

    onIntervalClick: function() {
        $("#cpIntervalDialog").dialog('open');
    },
    onChangeClick: function() {
        if (CheckpointsView.autoMode) {
            WorkoutMap.loadManualcheckpoints();
            CheckpointsView.autoMode = false;
            $('#btnChange').val('Auto');
        } else {
            WorkoutMap.loadAutocheckpoints();
            CheckpointsView.autoMode = true;
            $('#btnChange').val('Manual');
        }
        $('#checkpoints').toggle('slow');
        $('#auto').toggle('slow');
        $("#btnInterval").toggle('slow');
        $('#saveCheckpoints').toggle('slow');
    },

    checkpointsSaved: function() {
        $('#dialog').dialog('open');
    },
    saveCheckpoints: function() {
        var cp_list = new Array();
        var i = 0;
        var workoutId = UserWorkouts.getCurrentWorkoutId();
        for (var ts in WorkoutMap.manualCheckpoints) {
            cp_list[i] = WorkoutMap.manualCheckpoints[ts].timestamp;
            i++;
        }
        $.post("../SaveCheckpoints", { workoutId: workoutId, timestamps: cp_list }, CheckpointsView.checkpointsSaved);
    }
}