/**
 * Instructions contain a string with the name of a function in this object which is called to perform an action.
 */
Visualizer.prototype.actions = {
    /**
     *
     */
    initSection: function() {
        console.warn('INIT SECTION');
    },

    /**
     *
     */
    swap: function(indexA, indexB) {
        console.warn('SWAP');
    // Move up
    // NOTE Two way binding here between dataset and function parameter?
    // NOTE swapping will not reorder index and i parameter will be off
    // NOTE discuss chained transitions: http://bl.ocks.org/mbostock/1125997
        // this.groups
        //     .transition().duration(400)
        //         .attr('transform', function doTransform(d) {
        //             if (d.index === indexA) {
        //                 d.index = indexB;
        //             }
        //             else if (d.index === indexB) {
        //                 d.index = indexA;
        //             }

        //             return `translate(${d.index * (Visualizer.itemW + Visualizer.spacerW)}, ${Visualizer.itemY})`;
        //         })
    },

    /**
     * Highlights an index.
     */
    highlight: function(index) {
        console.warn('HIGHLIGHT');
    },

    /**
     * Un-highlights an index.
     */
    unhighlight: function(index) {
        console.warn('UNHIGHLIGHT');
    },

    // /**
    //  * Greys out an item.
    //  */
    // fade: function(startIndex, endIndex) {
    //     console.log(`fading from ${startIndex} to ${endIndex}`)

    //     this.svg.selectAll('rect')
    //         // NOTE this replaces the fill function reference for each rectangle - key point!
    //         .attr('fill', function fill(d) {
    //             if (d.index >= startIndex && d.index <= endIndex) {
    //                 console.log(`${d.index} to ${d.fade}`)
    //                 return d.fade;
    //             }
    //             return d.fill;
    //         });
    // };

    // /**
    //  * Restores all items to un-greyed state.
    //  */
    // unfade: function() {
    //     this.svg.selectAll('rect')
    //         .attr('fill', function fill(d) {
    //             console.log(`unfade ${d.index}`)
    //             return d.fill;
    //         })
    // };

    /**
     * Moves marker 1 to an index and sets its text label.
     */
    marker1: function(index, label) {
        console.warn('MARKER1')
    },

    /**
     * Moves marker 2 to an index and sets its text label.
     */
    marker2: function(index, label) {
        console.warn('MARKER2')
    },

    /**
     * Updates message in stats 1 div.
     */
    stats1: function(message) {
        console.warn('STATS1')
    },

    /**
     * Updates message in stats 2 div.
     */
    stats2: function(message) {
        console.warn('STATS2')
    },

    /**
     * Updates message in message 1 div.
     */
    message1: function(message) {
        console.warn('MESSAGE1')
    },

    /**
     * Updates message in message 2 div.
     */
    message2: function(message) {
        console.warn('MESSAGE2')
    },

    /**
     * Updates message in message 3 div.
     */
    message3: function(message) {
        console.warn('MESSAGE3')
    },
};