rm-plots.html

<link rel="import" href="bower_components/polymer/polymer.html">
<link rel="import" href="worker-builder.html">
<link rel="import" href="managed-canvas.html">
<link rel="import" href="utils.html">
<link rel="import" href="palettes.html">

<dom-module id="rm-plots">

<script is='worker-builder' id="worker" title="rm-plots" type='javascript/worker'>
"use strict";

var render_options = {
    cm_per_spa_bin: undefined,
    smoothing_spa_bins: undefined,
    max_rate_spa: undefined,
    deg_per_dir_bin: undefined,
    smoothing_dir_bins: undefined,
    max_speed: undefined,
    cps_per_speed_bin: 4 // currently not exposed as a user-configurable
};
var speed_plot_size = [20, 46]; // might want to upgraded this to render_options
var dir_plot_size = 78;

var pi = 3.14159265;

var show;
var spike_times;
var spikes_timebase;
var pos_timebase; // Note that changing the pos timebase will force clear all pos_xy, pos_dir, and pos_speed
var pos_xy;
var xy_max;
var pos_units_per_cm;
var pos_dir;
var pos_speed;
var pkey_to_array = new Map(); // Note that in the worker, key's are used only for arrays of spike-indices.
var pkey_to_rendered_options = new Map(); 
var pkeys_pending_render = [];
var timer;
var pkey_generation = 0;
var pending_path_plot = null;

// cached stuff.... see clear_cache for logic for cleaning the cache
var cached_spike_pos_ind;
var cached_xy_bins;
var cached_xy_dwell;
var cached_xy_no_dwell;
var cached_dir_bins;
var cached_dir_dwell;
var cached_speed_bins;
var cached_speed_dwell;
var cached_spike_xy_bins;
var cached_spike_dir_bins;
var cached_spike_speed_bins;
var cached_path;

var n_bins_xy_0, n_bins_xy_1; //these are cached as well, but they are managed as a "side effect" of xy_bins
var cached_spike_xy_raw; // and this is managed as a "side effect" of cached_spike_xy_bins

var palette = function(){
    var p_colors = 5;
    var buf8 = new Uint8Array(4*(p_colors+1));

    //set all alpha values to opaque
    for(var i=0;i<=p_colors;i++)
        buf8[i*4+3] = 255;

    //buf8[0*4+0]= 255; buf8[0*4+1]=255; buf8[0*4+2]=255; //white
    buf8[0*4+3]= 0; // invisible
    buf8[1*4+2]= 198;
    buf8[2*4+1]= 162; buf8[2*4+2]= 255; 
    buf8[3*4+0]= 56; buf8[3*4+1]= 235; buf8[3*4+2]= 32; 
    buf8[4*4+0]= 248; buf8[4*4+1]= 221; 
    buf8[5*4+0]= 255; buf8[5*4+1]= 32;

    return new Uint32Array(buf8.buffer); //this is how to_image_data function wants it
}();

var set_show = function(v){
    show = v;
    build_cache();
    make_all_pkeys_pending(); // this may be slightly overkill, but when it comes down to it we will only render stuff that needs it
    touch_timer();
}

var set_options = function(opts){
    let to_clear = [];
    for(let k in render_options){
        if(opts[k] !== undefined  && render_options[k] !== opts[k]){
            render_options[k] =  opts[k];
            to_clear.push(k);
        }
    }
    clear_cache(to_clear);
    build_cache();
    make_all_pkeys_pending();
    touch_timer();
}

var set_spike_times = function(timebase, arrays){
    clear_cache(['spikes_timebase', 'spike_times']);
    spikes_timebase = timebase;
    spike_times = arrays && arrays.data; 
    build_cache();
    make_all_pkeys_pending();
    touch_timer();
}

var set_pos_xy = function(timebase, units_per_cm, max_x, max_y, arrays){
    if(timebase && timebase != pos_timebase){
        pos_timebase = timebase;
        pos_xy = pos_dir = pos_speed = undefined;
        clear_cache(['pos_timebase', 'pos_xy', 'pos_dir', 'pos_speed']);
    } else {
        clear_cache(['pos_xy']);
    }
    pos_units_per_cm = units_per_cm; // note that dir and speed are already in their final units
    xy_max = [max_x, max_y];
    pos_xy = arrays && arrays.data;

    build_cache();
    make_all_pkeys_pending();
    touch_timer();

}

var set_pos_dir = function(timebase, arrays){
    if(timebase && timebase != pos_timebase){
        pos_timebase = timebase;
        pos_xy = pos_dir = pos_speed = undefined;
        clear_cache(['pos_timebase', 'pos_xy', 'pos_dir', 'pos_speed']);
    } else {
        clear_cache(['pos_dir']);
    }
    pos_dir = arrays && arrays.data;
    build_cache();
    make_all_pkeys_pending();
    touch_timer();
}

var set_pos_speed = function(timebase, arrays){
    if(timebase && timebase != pos_timebase){
        pos_timebase = timebase;
        pos_xy = pos_dir = pos_speed = undefined;
        clear_cache(['pos_timebase', 'pos_xy', 'pos_dir', 'pos_speed']);
    } else {
        clear_cache(['pos_speed']);
    }
    pos_speed = arrays && arrays.data;
    build_cache();
    make_all_pkeys_pending();
    touch_timer();
}

var make_all_pkeys_pending = function(){
    pkeys_pending_render = Array.from(pkey_to_array.keys());
}


var update_pkeys = function(changes, arrays){

    if(changes.generation_remove !== pkey_generation){
        changes.remove = [];
        pkey_to_array.clear();
        pkey_to_rendered_options.clear();
        pkeys_pending_render = [];
        console.log("rm-plots worker: key generation mismatch");
    }

    // note we don't both to remove keys from the pending list
    // unless we change key generation, in which case we drop 
    // everything that's pending. This is ensures that when we
    // attempt a render we can be sure that if we do find the
    // array for the given key we know it's for the relevant 
    // generation and that it's still wanted.

    var remove_pkeys = changes.remove || [];
    for(let pkey of remove_pkeys){
        pkey_to_array.delete(pkey);
        pkey_to_rendered_options.delete(pkey);
    }

    if(changes.generation_add !== changes.generation_remove){
        pkeys_pending_render = [];
        pkey_generation = changes.generation_add;
        pending_path_plot = null;
    }

    var add_pkeys = changes.add || [];
    for(let pkey of add_pkeys){
        pkey_to_array.set(pkey, arrays[pkey]);
        pkeys_pending_render.push(pkey);
    }

    touch_timer();        
}

var touch_timer = function(){

    // turns timer on if there's work to be done, otherwise stops it (if it was running)
    // note it's not actually a timer, because the interval is zero!
    // the point of using this is that it enables messages from main thread to interupt
    // between ticks, we can thus cancel work as an when needed.

    if((spike_times && pkeys_pending_render.length && 
            show && show !== 'nnn' &&
            (show[0] === 'n' || cached_xy_bins) && (show[1] === 'n' || cached_dir_bins) 
            && (show[2] === 'n' || cached_speed_bins)) || 
        (pending_path_plot && can_process_plot_path())){
        
        timer = timer || setImmediate(timer_tick);
    } else {
        clearImmediate(timer);
        timer = 0;
    }
}

var options_match = function(a, b, kind){
    // copy-pasted from main thread version at bottom of file
    if((!a && b) || (a && !b)){
        return false;
    }
    if(kind === "spa"){
        return a.smoothing_spa_bins === b.smoothing_spa_bins
            && a.cm_per_spa_bin === b.cm_per_spa_bin
            && a.max_rate_spa === b.max_rate_spa;
    }
    if(kind === "dir"){
        return a.smoothing_dir_bins === b.smoothing_dir_bins
            && a.deg_per_dir_bin === b.deg_per_dir_bin;
    }
    if(kind === "speed"){
        return a.max_speed === b.max_speed
            && a.cps_per_speed_bin === b.cps_per_speed_bin;
    }
    throw "what kind?";
}

var copy_options = function(dest, src, kind){
    // copy-pasted from main thread version at bottom of file
    if(kind === "spa"){
        dest.smoothing_spa_bins = src.smoothing_spa_bins;
        dest.cm_per_spa_bin = src.cm_per_spa_bin;
        dest.max_rate_spa = src.max_rate_spa;
    } else if (kind === "dir"){
        dest.smoothing_dir_bins = src.smoothing_dir_bins;
        dest.deg_per_dir_bin = src.deg_per_dir_bin;
    } else if(kind === "speed"){
        dest.max_speed = src.max_speed;
        dest.cps_per_speed_bin = src.cps_per_speed_bin;
    } else {
        throw "what?"
    }
}

var timer_tick = function(){
    timer = 0;

    if(pending_path_plot && can_process_plot_path()){
        process_plot_path();
    } 

    let batch_limit = 5; // a bit arbitrary
    let arrays={};
    let msgs = [];

    // find batch_limit things to render...
    // this is somewhat ugly, but whatever.
    while(pkeys_pending_render.length > 0 && msgs.length < batch_limit){
        let pkey = pkeys_pending_render.shift();
        let pkey_rendered_options = pkey_to_rendered_options.get(pkey)
        let inds =  pkey_to_array.get(pkey);
        if(!pkey_rendered_options){
            pkey_rendered_options = { /* TODO: initialize using all values */};
            pkey_to_rendered_options.set(pkey, pkey_rendered_options);
        }
        if(pkey && inds && !is_equal_simple(pkey_to_rendered_options.get(pkey), render_options)){
            let msg = {
                pkey: pkey,
                generation: pkey_generation,
                render_options: render_options // note we send all options regardless of show 'n'
            }
            msgs.push(msg);
            if(show[0] === 'y' && !options_match(pkey_rendered_options, render_options, "spa")){
                    let res = get_group_xy_rm(inds);
                    msg.spa_rm = pkey + ' spa_rm';
                    msg.spa_max = res.max;
                    msg.spa_rm_dims = [n_bins_xy_1, n_bins_xy_0];
                    arrays[msg.spa_rm] = res.im;
                    copy_options(pkey_rendered_options, render_options, "spa");
            }

            if(show[1] === 'y' && !options_match(pkey_rendered_options, render_options, "dir")){
                    let res = get_group_dir_rm(inds);
                    msg.dir_rm = pkey + ' dir_rm';
                    msg.dir_max = res.max;
                    msg.dir_rm_dims = [dir_plot_size, dir_plot_size];
                    arrays[msg.dir_rm] = res.im;
                    copy_options(pkey_rendered_options, render_options, "dir");
            }

            if(show[2] === 'y' && !options_match(pkey_rendered_options, render_options, "speed")){
                let im = get_group_speed_rm(inds);
                msg.speed_rm = pkey + ' speed_rm';
                msg.speed_rm_dims = speed_plot_size;
                arrays[msg.speed_rm] = im;
                copy_options(pkey_rendered_options, render_options, "speed");
            }

        }
    }

    if(msgs.length){
        exec_main_b('plot_things', msgs, arrays);        
    }

    touch_timer();
}


//  The meat of the computation follows...
// =========================================================


var clear_cache = function(names){
    // This is a bit fiddly, but at least it's all in one place, right?!

    names = new Set(names);

    if(names.has('spikes_timebase') || names.has('pos_timebase') || names.has('spike_times')){
        cached_spike_pos_ind = undefined;
        cached_spike_xy_bins = undefined;
        cached_spike_xy_raw = undefined;
        cached_spike_dir_bins = undefined;
        cached_spike_speed_bins = undefined;
        pkey_to_rendered_options.clear(); //whatever we had is now irrelevant
    }

    if(names.has('pos_xy')){
        cached_path = undefined;
        let null_opts = {};
        for(let opts of pkey_to_rendered_options.values()){
            copy_options(opts, null_opts, "spa");
        }
    }
    if(names.has('pos_xy') || names.has('cm_per_spa_bin')){
        cached_xy_bins = undefined;
        cached_xy_dwell = undefined;
        cached_xy_no_dwell = undefined;
        cached_spike_xy_bins = undefined;
        cached_spike_xy_raw = undefined;
    } else if(names.has('smoothing_spa_bins')){
        cached_xy_dwell = undefined;
    }
     
    if(names.has('pos_dir')){
        let null_opts = {};
        for(let opts of pkey_to_rendered_options.values()){
            copy_options(opts, null_opts, "dir");
        }
    }
    if(names.has('pos_dir') || names.has('deg_per_dir_bin')){
        cached_dir_bins = undefined;
        cached_dir_dwell = undefined;
        cached_spike_dir_bins = undefined;
    } else if(names.has('smoothing_dir_bins')){
        cached_dir_dwell = undefined;
    }

    if(names.has('pos_speed')){
        let null_opts = {};
        for(let opts of pkey_to_rendered_options.values()){
            copy_options(opts, null_opts, "speed");
        }
    }
    if(names.has('pos_speed') || names.has('max_speed') || names.has('cps_per_speed_bin')){
        cached_speed_bins = undefined;
        cached_speed_dwell = undefined;
        cached_spike_speed_bins = undefined;
    }   

    // TODO: we could deal with adding more stuff to pending here perhaps??

}

var make_cached_path = function(){
    cached_path = draw_lines(pos_xy, 256, 256, 256/Math.max(xy_max[0], xy_max[1]));
     exec_main_b('plot_path', {
        path: 'path',
        dims: [256, 256],
    }, {
        path: new Uint32Array(cached_path)
    });
}

var send_speed_dwell_hist = function(){
    let im = plot_histogram(speed_plot_size[0], speed_plot_size[1], cached_speed_dwell);
     exec_main_b('plot_speed_hist', {
        path: 'hist',
        dims: speed_plot_size
    }, {
        hist: im
    });
}

var build_cache = function(){
    // this is called when we change xy/dir/speed/times/options/show
    // clear_cached will have been called immediately before hand.

    // using just pos timebas and spike times, we can get the pos indices for each spike
    if(!cached_spike_pos_ind && pos_timebase && spikes_timebase && spike_times){
        make_cached_spike_pos_ind();
    }    

    // it doesn't require spikes to just draw the path
    if(show && show[0] === 'y' && !cached_path && pos_xy){
        make_cached_path(); 
    }

    // it also doesn't require spikes to compute and draw the speed dwell hist
    if(show && show[2] === 'y' && !cached_speed_dwell && pos_speed
        && render_options.cps_per_speed_bin 
        && render_options.max_speed){
        make_cached_speed_bins_and_dwell();
        send_speed_dwell_hist(); 
    }

    // the rest requires spikes+xy/dir/speed

    if(show && show[0] === 'y'
         && !(cached_xy_bins && cached_xy_no_dwell && cached_xy_dwell && cached_spike_xy_bins)
         && pos_xy && cached_spike_pos_ind && render_options.cm_per_spa_bin 
         && render_options.smoothing_spa_bins !== undefined ){
        make_cached_xy_bins_and_dwell();    
    }

    if(show && show[1] === 'y'
        && !(cached_dir_bins && cached_dir_dwell && cached_spike_dir_bins)
        && pos_dir && cached_spike_pos_ind
        && render_options.deg_per_dir_bin 
        && render_options.smoothing_dir_bins !== undefined){
        make_cached_dir_bins_and_dwell();
    }

    if(show && show[2] === 'y'
        && !cached_spike_speed_bins
        && pos_speed && cached_spike_pos_ind
        && render_options.cps_per_speed_bin 
        && render_options.max_speed){
        make_cached_speed_spike_bins();
    }
}


var make_cached_spike_pos_ind = function(){    
    // cached_spike_pos_ind gives the indices into pos_xy, pos_dir, pos_speed for each spike

    cached_spike_pos_ind = new Uint32Array(spike_times.length);
    
    var factor = pos_timebase / spikes_timebase;
    for(let i=0; i<cached_spike_pos_ind.length; i++)
        cached_spike_pos_ind[i] = spike_times[i]*factor; //integer result, so implicitly the floor 

    return true;
}


var make_cached_xy_bins_and_dwell = function(){

    var factor = 1/pos_units_per_cm/render_options.cm_per_spa_bin;
    cached_xy_bins = new Uint8ClampedArray(pos_xy.length);
    for(let i=0;i<pos_xy.length;i++){
        cached_xy_bins[i] = pos_xy[i] * factor;           
    }
    
    //same form as cached_xy_bins, but we store it as 2byte blocks for easy picking
    cached_spike_xy_bins = pick(new Uint16Array(cached_xy_bins.buffer), cached_spike_pos_ind); 
                
    cached_spike_xy_raw = pick(new Uint32Array(pos_xy.buffer), cached_spike_pos_ind); // the _raw version if for plotting spikes on the path

    n_bins_xy_1 = Math.ceil(xy_max[1]*factor) + 1; // +1 is because of zero indexing
    n_bins_xy_0 = Math.ceil(xy_max[0]*factor) + 1;   

    var dwell = hist_2(cached_xy_bins, n_bins_xy_1, n_bins_xy_0);
    // TODO: check whether the zero bin has supuriously high data from NaN's, and force it to zero if needed

    //before we do the smoothing we need to remmber which bins were unvisted
    cached_xy_no_dwell = is_zero(dwell);

    //ok now we do the smoothing
    cached_xy_dwell = get_smoothed(dwell, n_bins_xy_1, n_bins_xy_0, render_options.smoothing_spa_bins);

    return true;
}


var make_cached_dir_bins_and_dwell = function(){

    var factor = 180/pi/render_options.deg_per_dir_bin;
    cached_dir_bins = new Uint8ClampedArray(pos_dir.length);
    for(let i=0;i<pos_dir.length;i++){
        cached_dir_bins[i] = pos_dir[i] * factor;
    }
    
    cached_spike_dir_bins = pick(cached_dir_bins, cached_spike_pos_ind); 

    var n_bins_dir = 360/render_options.deg_per_dir_bin;

    var dwell = hist_1(cached_dir_bins, n_bins_dir+1); //the +1'th bin will be combined with the zero'th bin...
    dwell[0] += dwell[n_bins_dir];
    dwell = dwell.subarray(0, n_bins_dir);
                
    cached_dir_dwell = get_smoothed_1d_periodic(dwell, render_options.smoothing_dir_bins);

    return true;
}




var make_cached_speed_bins_and_dwell = function(){
    let factor = 1/render_options.cps_per_speed_bin;
    cached_speed_bins = new Uint8ClampedArray(pos_speed.length);
    let n_valid_speed_bins = render_options.max_speed/render_options.cps_per_speed_bin;
    // we use an extra bin for everything invalid
    for(let i=0;i<pos_speed.length;i++){
        cached_speed_bins[i] = pos_speed[i] > render_options.max_speed ? 
                                n_valid_speed_bins : (pos_speed[i] * factor) | 0; // use floor rather than default of round for assigning to clamped array
    }
    cached_speed_dwell = hist_1(cached_speed_bins, n_valid_speed_bins+1);
    cached_speed_dwell = cached_speed_dwell.subarray(0, n_valid_speed_bins);
}


var make_cached_speed_spike_bins = function(){
    cached_spike_speed_bins = pick(cached_speed_bins, cached_spike_pos_ind); 
    return true;
}



var get_group_xy_rm = function(group_inds){
    var group_xy_bins = pick(cached_spike_xy_bins, group_inds); //cached_spike_xy_bins was stored as 2byte blocks, which is what we want here
    var spike = hist_2(new Uint8Array(group_xy_bins.buffer), n_bins_xy_1, n_bins_xy_0); //now we treat it as 1 byte blocks
    // TODO: see note about zero-bin in make_cached_xy_bins_and_dwell

    var spike = get_smoothed(spike, n_bins_xy_1, n_bins_xy_0, render_options.smoothing_spa_bins);
    var ratemap = divide_float(spike, cached_xy_dwell);
    use_mask(ratemap, cached_xy_no_dwell);

    var max_map = max(ratemap);
    
    var im = to_image_data(ratemap, render_options.max_rate_spa <= 0 ? max_map : render_options.max_rate_spa/pos_timebase);

    return {
        im: im,
        max: max_map * pos_timebase
    }

}

var to_image_data = function(map, max_map){
    // we use palette which is a Uint32Array, though really the underlying data is 4 bytes of RGBA

    var im = new Uint32Array(map.length);

     //for binning, we want values on interval [1 P], so use eps (lazy solution):
    var eps = 0.0000001;
    if(max_map == 0){
        for(let i=0; i<map.length; i++)
            im[i] = cached_xy_no_dwell[i]? palette[0] : palette[1];
    }else{
        var factor = (palette.length-1)/(max_map*(1+eps));
        for(let i=0;i<map.length;i++)
            im[i] = cached_xy_no_dwell[i]? palette[0] : palette[Math.min(1+(0 | (map[i]*factor)), palette.length-1)];
    }
    return im;
}

var get_group_dir_rm = function(group_inds){
    var n_bins_dir = cached_dir_dwell.length;
    var group_dir_bins = pick(cached_spike_dir_bins,group_inds); 

    var spike = hist_1(group_dir_bins, n_bins_dir+1);
    spike[0] += spike[n_bins_dir];
    spike = spike.subarray(0, n_bins_dir);

    var spike = get_smoothed_1d_periodic(spike, render_options.smoothing_dir_bins); 
    var ratemap = divide_float(spike, cached_dir_dwell);
    
    var max_map = max(ratemap);
    var im = plot_dir(ratemap, dir_plot_size, max_map);

    return {
        im: im,
        max: max_map * pos_timebase
    }

}

var get_group_speed_rm = function(group_inds){
    var group_speed_bins = pick(cached_spike_speed_bins, group_inds); 
    var spike = hist_1(group_speed_bins, cached_speed_dwell.length + 1);
    spike = spike.subarray(0, spike.length-1);

    var ratemap = divide_float(spike, cached_speed_dwell);
    return plot_histogram(speed_plot_size[0], speed_plot_size[1], ratemap);
}       


cached_speed_dwell

var plot_dir = function(vals, s, max){
    // produces a square plot
    var im = new Uint32Array(s*s);

    // draw axes
    draw_lines([0, s/2, s, s/2], s, s, 1, im, 0x99999999);
    draw_lines([s/2, 0, s/2, s], s, s, 1, im, 0x99999999);

    // go from linear to polar
    var n = vals.length;
    var xy = new Int8Array(n*2+2)
    for(let ii=0; ii<n; ii++){
        let theta = 2*pi/n*ii;
        xy[ii*2+0] = s/2 - Math.cos(theta) * vals[ii]/max*s/2;
        xy[ii*2+1] = s/2 - Math.sin(theta) * vals[ii]/max*s/2;
    }
    // join up the start and end
    xy[2*n+0] = xy[0];
    xy[2*n+1] = xy[1];

    draw_lines(xy, s, s, 1, im);
    return im;
}

var plot_histogram = function(w, h, vals){
    var color_a = 0xff000000;
    var color_b = 0x88000000;
    var color_ax = 0xff0000ff;
    var im = new Uint32Array(w*h);

    var f = w/max(vals);
    for(let i=0, y=0;i<vals.length && y<h;i++,y++){
        let h = f*vals[i];
        for (let k=0;k<3;k++){
            for(let x=0;x<h;x++){
                im[y*w+w-1-x] = color_a;
            }
            im[y*w+w-1] = color_ax;
            y++;
        }
        for(let x=0;x<h;x++){
            im[y*w+w-1-x] = color_b;
        }
        im[y*w+w-1] = color_ax;
    }
    return im;
}


var can_process_plot_path = function(){
    return cached_path && 
           (!pending_path_plot.a || (cached_spike_xy_raw && pkey_to_array.has(pending_path_plot.a))) &&
           (!pending_path_plot.b || pkey_to_array.has(pending_path_plot.b));
}

var process_plot_path = function(){
    let im = new Uint32Array(cached_path);

    if(pending_path_plot.a){
      //cached_spike_xy_raw is 16bit values stored as 4byte blocks, which is what we want to pick here
      let group_xy = pick(cached_spike_xy_raw, pkey_to_array.get(pending_path_plot.a)); 
            
      draw_points(new Uint16Array(group_xy.buffer), 256, 256, 256/Math.max(xy_max[0], xy_max[1]),
                   im, pending_path_plot.color_a, 1);
    }

    if(pending_path_plot.b){
      //cached_spike_xy_raw is 16bit values stored as 4byte blocks, which is what we want to pick here
      let group_xy = pick(cached_spike_xy_raw, pkey_to_array.get(pending_path_plot.b)); 
            
      draw_points(new Uint16Array(group_xy.buffer), 256, 256, 256/Math.max(xy_max[0], xy_max[1]),
                  im, pending_path_plot.color_b, 1);
    }
   
    exec_main_b('plot_path', {
        path: 'path',
        dims: [256, 256],
        generation: pkey_generation,
        a: pending_path_plot.a,
        b: pending_path_plot.b,
        color_a: pending_path_plot.color_a,
        color_b: pending_path_plot.color_b
    }, {
        path: im
    });
   pending_path_plot = null;
}


var plot_path = function(pkey_a, pkey_b, color_a, color_b){
    pending_path_plot = {
        a: pkey_a,
        b: pkey_b,
        color_a: color_a,
        color_b: color_b
    };
    touch_timer();
}

// TODO: come with a better method than copy-pasting utility functions ....

var hist_1 = function(inds, n_bins){
    var result = new Uint32Array(n_bins); 
    var n = inds.length;
    
    for(let i=0;i<n;i++){
        result[inds[i]]++;
    }
    return result;
}

var hist_2 = function(inds_xy, n_1, n_0){
    var result = new Uint32Array(n_0*n_1); 
    var n = inds_xy.length/2;

    for(let i=0; i<n; i++){
        result[inds_xy[i*2+1]*n_1 + inds_xy[i*2+0]]++;
    }
    return result;
}

var is_zero = function(vector){
    var result = new Uint8ClampedArray(vector.length);
    for(let i=0;i<vector.length;i++)
        result[i] = (vector[i]===0);
    return result;
}

var get_smoothed_1d_periodic = function(x, w){
    // kernel is box-car of size 2w+1
    var n = x.length;
    var result = new Uint32Array(n);
    for(let i=0; i<n; i++){
        for(let k=-w;k<=w; k++){
            result[i] += x[(i+k) % n];
        }
    }
    return result;
}

var get_smoothed = function(matrix, n_1, n_0, w){
    var result = new Uint32Array(matrix.length);
    // kernel is box-car of size 2w+1

    for(let ky=-w; ky<=w; ky++)for(var kx=-w; kx<=w; kx++){//for each offset within the kernel square
        let start_0 = ky<0? 0 : ky;
        let start_1 = kx<0? 0 : kx;
        let end_0 = ky>0? n_0 : n_0+ky;
        let end_1 = kx>0? n_1 : n_1+kx;

        for(let y=start_0; y<end_0; y++)for(let x=start_1; x<end_1; x++){
            result[y*n_1 +x] += matrix[(y-ky)*n_1 +(x-kx)];
        }
    }   
    return result; 
}

var max = function(x){
    var m = x[0];
    for(let i = 1;i< x.length; i++){
        (m < x[i]) && (m = x[i]);
    }
    return m; 
}

var pick = function(from, indices){
    // Take elements specified by indicies from the 1d array "from".
    var result =  new from.constructor(indices.length); //make an array of the same type as the from array
    for(let i=0;i<indices.length;i++){
        result[i] = from[indices[i]];
    }
    return result;
}

var is_equal_simple = function(a, b){
    // very simple....
    if((a && !b) || (!a && b)){
        return false;
    }
    for(let aa in a) if(a.hasOwnProperty(aa)){
        if(b[aa] !== a[aa]){
            return false;
        }
    }
    for(let bb in b) if(b.hasOwnProperty(bb)){
        if(b[bb] !== a[bb]){
            return false;
        }
    }
    return true;
}

var draw_points = function(xy, w, h, scale, im, color, k){
    for(let ii=0; ii<xy.length; ii+=2){
        let start_0 = Math.max(0, xy[ii+0]*scale-k) | 0;
        let end_0 = Math.min(w, xy[ii+0]*scale+k+1) | 0;
        let start_1 = Math.max(0, xy[ii+1]*scale-k) | 0;
        let end_1 = Math.min(h, xy[ii+1]*scale+k+1) | 0;
        for(let p0=start_0; p0<end_0; p0++){
            for(let p1=start_1; p1<end_1; p1++){
                im[p1*w + p0] = color;
            }
        }
    }
}

var draw_lines = function(xy, w, h, scale, im, color){
    // Chrome currently de-optizes for "compound let assignment"
    // which means using += or -= on a variable declared with "let"
    // so we have to manually write x = x + something
    
    color = color || 0xff000000; //black
    im = im || new Uint32Array(w*h);

    let x0 = (xy[0] * scale) | 0;
    let y0 = (xy[1] * scale) | 0;
    for(let ii=2; ii<xy.length; ii=ii+2){
        let x1 = (xy[ii+0] * scale) | 0;
        let y1 = (xy[ii+1] * scale) | 0;

        // Bresenham algorithm adapted from http://stackoverflow.com/a/4672319/2399799
        let sx = ((x0 < x1) <<1) -1; // (x0 < x1) ? 1 : -1
        let sy = ((y0 < y1) <<1) -1; // (y0 < y1) ? 1 : -1
        let dx = sx*(x1-x0); // abs(x0-x1)
        let dy = sy*(y1-y0); // abs(y0-y1)
        let err = dx-dy;
        while(true){
            im[y0*w + x0] = color;

            if ((x0===x1) && (y0===y1)) break;
            let e2 = err << 1;
            if (e2 >-dy){ 
                err = err - dy;
                x0  = x0 + sx; 
            }
            if (e2 < dx){
                err = err + dx;
                y0  = y0 + sy;
            }
        }

        x0 = x1;
        y0 = y1;
    }
    return im;
}

var divide_float = function(numerator, denominator){
    let out = new Float32Array(numerator.length);
    for(let ii=0; ii<out.length; ii++){
        out[ii] = numerator[ii] / denominator[ii];
    }
    return out;
}

var use_mask = function(vector, mask, val){
    // sets vector elemnts to val where mask is true, if val is omitted it defaults to zero
    val = typeof(val) === "number" ? val : 0;
    for(let ii=0; ii<mask.length; ii++) if(mask[ii]){
        vector[ii] = val;  
    }
}

</script>

<template></template>


<script>
    "use strict";

    Polymer({
        is:'rm-plots',
        behaviors: [
            Polymer.ShortcutNotifyerBehavior
        ], properties: {
            pos_path: {
                type: Object, 
                value: null,
                notify: true,
                readOnly: true
            },
            pos_speed_hist: {
                type: Object, 
                value: null,
                notify: true,
                readOnly: true
            },
            pos_xy: {
                type: Object, // array akey "data" and timebase Number in same units as max_delta_t
                value: function(){ return {};},
                notify: true
            },
            pos_dir: {
                type: Object, // array akey "data" and timebase Number in same units as max_delta_t
                value: function(){ return {};},
                notify: true
            },
            pos_speed: {
                type: Object, // array akey "data" and timebase Number in same units as max_delta_t
                value: function(){ return {};},
                notify: true
            },
            spike_times: {
                type: Object, // array akey "data" and timebase Number in same units as max_delta_t
                value: function(){ return {};},
                notify: true
            },
            cm_per_spa_bin: {
                type: Number,
                value: 2,
                notify: true
            },
            smoothing_spa_bins: {
                type: Number,
                value: 2,
                notify: true
            },
            max_rate_spa: {
                type: Number,
                value: -1,
                notify: true
            },
            deg_per_dir_bin: {
                type: Number,
                value: 6,
                notify: true
            },
            smoothing_dir_bins: {
                type: Number,
                value: 2,
                notify: true
            },
            speed_rm_max: {
                type: Number,
                value: 45,
                notify: true
            },
            show: {
                type: String,
                value: 'yyy',
                notify: true
            },
            groups: {
                type: Array,
                value: function(){return [];},
                notify: true,
                observer: '_groups_set'
            },
            want_spike_times: {
                type: Array,
                notify: true,
                observer: '_want_spike_times_set'
            },
            active_group_a: {
                type: Object,
                notify: true
            },
            active_group_b: {
                type: Object,
                notify: true
            }
        }, observers: [
            '_groups_spliced(groups.splices)',
            '_options_modified(cm_per_spa_bin, smoothing_spa_bins, max_rate_spa, deg_per_dir_bin, smoothing_dir_bins, speed_rm_max)',
            '_show_changed(show)',
            '_pos_xy_modified(pos_xy)',
            '_pos_dir_modified(pos_dir)',
            '_pos_speed_modified(pos_speed)',
            '_times_modified(spike_times)',
            '_update_pos_path(active_group_a, active_group_b)'
        ], created: function(){
            // copy-paste defaults from worker code above (could implement
            // something  more complicated, but hey this works and is easy).
            this._options = {
                cm_per_spa_bin: undefined,
                smoothing_spa_bins: undefined,
                max_rate_spa: undefined,
                deg_per_dir_bin: undefined,
                smoothing_dir_bins: undefined,
                max_speed: undefined, // partially supported as user-configurable
                cps_per_speed_bin: 4 // currently not exposed as user-configurable
            };
            var worker_builder = Polymer.DomModule.import('rm-plots','#worker');
            this._worker = worker_builder.create_for(this);
            this._pkey_generation = 0;
            this._times_is_on_worker = false;
            this._pos_xy_is_on_worker = false;
            this._pos_dir_is_on_worker = false;
            this._pos_speed_is_on_worker = false;
        }, _want_spike_times_set: function(){
            this._show_changed(this.show);
        }, _update_okeys: function(okeys_to_remove, okeys_to_add, generation_remove, generation_add){
            var am = Utils.typed_array_manager;
            var added_arrays = {};
            var pkeys_to_add = []; 
            if (this.show.indexOf('y') > -1){
                // get clones of new arrays to send to worker
                for(let okey of okeys_to_add){
                    if(!okey) continue;
                    pkeys_to_add.push(okey._pkey);
                    added_arrays[okey._pkey] = am.get_array_clone(okey.akey);
                    okey._rm_is_on_worker = true;                    
                }
            }

            // free canvases
            var pkeys_to_remove = [];
            for(let okey of okeys_to_remove){
                if(!okey) continue;
                pkeys_to_remove.push(okey._pkey);
                okey.rm.spa = null;
                okey.rm.dir = null;
                okey.rm.speed = null;
                okey._rm_spa_other = null;
                okey._rm_dir_other = null;
                okey._rm_speed_other = null;
                okey._rm_other_options = {};
                okey._rm_is_on_worker = false;
            }

            // inform worker of the new/deleted arrays
            this._worker.exec_b('update_pkeys', {
                add: pkeys_to_add,
                remove: pkeys_to_remove,
                generation_remove: generation_remove,
                generation_add: generation_add
            }, added_arrays);

        }, _use_other_if_possible: function(okeys){
            // The okey._rm_x_other stores the last canvas from the worker,
            // with okey._rm_other_options containing the render settings used.
            // Here we check whether the rendered options match what we currently
            // want, and if so we set the visible okey.rm_x property from the
            // okey._rm_x_other value. We also deal with hiding canvases on show='n'.
            for(let okey of okeys) if(okey){
                let op; // 0 : no-op, +1 : use _other values, -1: set to null
                let same; // are the okey.rm_x and okey._rm_x_other the same?
                let rm = okey.rm = Object.assign({}, okey.rm); // assign a copy so we can notify once for multiple changes (notify at end of iteration)

                // spa
                same = rm.spa === okey._rm_spa_other;
                op = this.show[0] === 'n' ? 
                         ( rm.spa ? -1 : 0 )
                       : ( !same && this._options_match(okey._rm_other_options, this._options, "spa") ? 1  : 0 );
                if(op){
                    okey.rm.spa = op === 1 ? okey._rm_spa_other : null;
                    rm.spa_max = op === 1 ? okey._rm_spa_max_other : null;
                }

                // dir
                same = rm.dir === okey._rm_dir_other;
                op = this.show[1] === 'n' ? 
                         ( rm.dir ? -1 : 0 )
                       : ( !same && this._options_match(okey._rm_other_options, this._options, "dir") ? 1  : 0 );
                if(op){
                    rm.dir = op === 1 ? okey._rm_dir_other : null;
                    rm.dir_max = op === 1 ? okey._rm_dir_max_other : null;
                }

                // speed
                same = rm.speed === okey._rm_speed_other;
                op = this.show[2] === 'n' ? 
                         ( rm.speed ? -1 : 0 )
                       : ( !same && this._options_match(okey._rm_other_options, this._options, "speed") ? 1  : 0 );
                if(op){
                    rm.speed = op === 1 ? okey._rm_speed_other : null;
                }

                this.shortcutNotify('rm', rm, okey); // actual path: 'groups.' + okey._pkey + '.rm'
            }

        }, _options_modified: function(){
            this._options.cm_per_spa_bin = this.cm_per_spa_bin;
            this._options.smoothing_spa_bins = this.smoothing_spa_bins;
            this._options.max_rate_spa = this.max_rate_spa;
            this._options.deg_per_dir_bin = this.deg_per_dir_bin;
            this._options.smoothing_dir_bins = this.smoothing_dir_bins;
            this._options.max_speed = this.speed_rm_max;
            this._use_other_if_possible(this.groups || []);
            this._worker.exec('set_options', this._options);
        }, _groups_set: function(new_val, old_val){
            this._groups_collection = Array.isArray(new_val) && Polymer.Collection.get(new_val);
            this._update_okeys(old_val || [], new_val || [], this._pkey_generation, ++this._pkey_generation); // added keys are for a new generation
        }, _groups_spliced: function(splices){
            let parsed = Utils.parse_splices(splices);
            this._update_okeys(parsed.removed, parsed.added, this._pkey_generation, this._pkey_generation);
        }, _show_changed: function(show){
            if(!this.want_spike_times){
                return;
            }
            if (!this.show.match(/^[yn]{3}$/)){
                console.log("bad rm show value");
                return;
            }

            this._use_other_if_possible(this.groups || []);

            if(show === "nnn"){
                let idx = this.want_spike_times.indexOf("rm-plots");
                (idx > -1) && this.splice('want_spike_times', idx, 1);

            } else {  
                let idx = this.want_spike_times.indexOf("rm-plots");
                (idx === -1) && this.push('want_spike_times', "rm-plots");

                // if show was completely off we avoided sending times to worker...
                if(!this._times_is_on_worker){
                    this._times_modified();
                }

                // and we avoided sending group inds to worker...
                let added = [];
                for(let okey of (this.groups || [])) if(okey && !okey._rm_is_on_worker){
                    added.push(okey);
                }
                this._update_okeys([], added, this._pkey_generation, this._pkey_generation);

            }
         
            // and we avoided sending the individual pos data types to the worker...
            if(show[0] === 'y' && !this._pos_xy_is_on_worker){
                this._pos_xy_modified();
            }
            if(show[1] === 'y' && !this._pos_dir_is_on_worker){
                this._pos_dir_modified();
            }
            if(show[2] === 'y' && !this._pos_speed_is_on_worker){
                this._pos_speed_modified();
            }

            this._worker.exec('set_show', this.show); // worker needs to know even if it's all 'nnn', because then it won't bother doing anything.
        }, _pos_xy_modified: function(){
            this._blank_pos_path = null;
            this._setPos_path(null); // TODO: might want to dealy this somehwo to avoid flash of null when changing settings
            if(this.show && this.show[0] === 'y'){
                if(this.pos_xy){
                    let arr = Utils.typed_array_manager.get_array_clone(this.pos_xy.xy);
                    this._worker.exec_b('set_pos_xy', this.pos_xy.timebase, 
                        this.pos_xy.units_per_cm, this.pos_xy.max_x, this.pos_xy.max_y, {data: arr});
                } else {
                    if(!this._worker) return;
                    this._worker.exec('set_pos_xy', {});
                }
                this._pos_xy_is_on_worker = true;
            } else {
                if(!this.pos_xy && this._pos_xy_is_on_worker){
                    this._worker.exec('set_pos_xy', {});
                }
                this._pos_xy_is_on_worker = false;
            }
        }, _pos_dir_modified: function(){
            if(this.show && this.show[1] === 'y'){
                if(this.pos_dir){
                    let arr = Utils.typed_array_manager.get_array_clone(this.pos_dir.dir);
                    this._worker.exec_b('set_pos_dir', this.pos_dir.timebase, {data: arr});
                } else {
                    if(!this._worker) return;
                    this._worker.exec('set_pos_dir', {});
                }
                this._pos_dir_is_on_worker = true;
            } else {
                if(!this.pos_dir && this._pos_dir_is_on_worker){
                    this._worker.exec('set_pos_dir', {});
                }
                this._pos_dir_is_on_worker = false;
            }
        }, _pos_speed_modified: function(){
            this._setPos_speed_hist(null); 
            if(this.show && this.show[2] === 'y'){
                if(this.pos_speed){
                    let arr = Utils.typed_array_manager.get_array_clone(this.pos_speed.speed);
                    this._worker.exec_b('set_pos_speed', this.pos_speed.timebase, {data: arr});
                } else {
                    if(!this._worker) return;
                    this._worker.exec('set_pos_speed', {});
                }
                this._pos_speed_is_on_worker = true;
            } else {
                if(!this.pos_speed && this._pos_speed_is_on_worker){
                    this._worker.exec('set_pos_speed', {});
                }
                this._pos_speed_is_on_worker = false;
            }
        }, _times_modified: function(){
            if(this.show !== 'nnn'){
                if(this.spike_times){
                    let arr = Utils.typed_array_manager.get_array_clone(this.spike_times.times);
                    this._worker.exec_b('set_spike_times', this.spike_times.timebase, {data: arr});
                } else {
                    if(!this._worker) return;
                    this._worker.exec('set_spike_times', {});
                }
                this._times_is_on_worker = true;
            } else {
                if(!this.spike_times && this._times_is_on_worker){
                    this._worker.exec('set_spike_times', {});
                }
                this._times_is_on_worker = false;
            }
        }, _options_match: function(a, b, kind){
            if((!a && b) || (a && !b)){
                return false;
            }
            if(kind === "spa"){
                return a.smoothing_spa_bins === b.smoothing_spa_bins
                    && a.cm_per_spa_bin == b.cm_per_spa_bin
                    && a.max_rate_spa == b.max_rate_spa;
            } else if(kind === "dir"){
                return a.smoothing_dir_bins === b.smoothing_dir_bins
                    && a.deg_per_dir_bin == b.deg_per_dir_bin;
            } else if(kind === "speed"){
                return a.max_speed === b.max_speed
                    && a.cps_per_speed_bin === b.cps_per_speed_bin;
            }
        }, _copy_options: function(dest, src, kind){
            if(kind === "spa"){
                dest.smoothing_spa_bins = src.smoothing_spa_bins;
                dest.cm_per_spa_bin = src.cm_per_spa_bin;
                dest.max_rate_spa = src.max_rate_spa;
            } else if (kind === "dir"){
                dest.smoothing_dir_bins = src.smoothing_dir_bins;
                dest.deg_per_dir_bin = src.deg_per_dir_bin;
            } else if(kind === "speed"){
                dest.max_speed = src.max_speed;
                dest.cps_per_speed_bin = src.cps_per_speed_bin;
            }
        }, plot_things: function(msgs, arrays) {
            for (let msg of msgs){
                if(msg.generation !== this._pkey_generation){
                    continue; // pft! get with the times, dude.
                }
                let okey = this._groups_collection.getItem(msg.pkey);
                if(!okey){
                    continue;
                }
                if(msg.spa_rm){
                    okey._rm_spa_other = {buffer: arrays[msg.spa_rm].buffer, dims: msg.spa_rm_dims};
                    okey._rm_spa_max_other = msg.spa_max.toFixed(1);
                    this._copy_options(okey._rm_other_options, msg.render_options, "spa");
                }
                if(msg.dir_rm){
                    okey._rm_dir_other = {buffer: arrays[msg.dir_rm].buffer, dims: msg.dir_rm_dims};
                    okey._rm_dir_max_other = msg.dir_max.toFixed(1);
                    this._copy_options(okey._rm_other_options, msg.render_options, "dir");
                }
                if(msg.speed_rm){
                    okey._rm_speed_other = {buffer: arrays[msg.speed_rm].buffer, dims: msg.speed_rm_dims};
                    this._copy_options(okey._rm_other_options, msg.render_options, "speed");
                }
                this._use_other_if_possible([okey]);
            }

        }, plot_path: function(msg, arrays){
            if(msg.a && this._pkey_generation == msg.generation &&
                (this.active_group_a && this.active_group_a._pkey == msg.a) && 
                ((!this.active_group_b && !msg.b) || (this.active_group_b && this.active_group_b._pkey == msg.b))
                && this.show && this.show[0]==='y'){
                // plot is of current a (and b), and generation is current and we want spa plots
                this._setPos_path({buffer: arrays.path.buffer, dims: msg.dims})    
            } else if(!msg.a){
                // plot has null a and b, so store it as the blank path and set it now
                this._blank_pos_path = {buffer: arrays.path.buffer, dims: msg.dims};
                this._setPos_path(this._blank_pos_path);
            }
            
        }, plot_speed_hist: function(msg, arrays){
                this._setPos_speed_hist({buffer: arrays.hist.buffer, dims: msg.dims});

        }, _update_pos_path: function(){
            if(this.active_group_a && this.show && this.show[0]==='y'){
                // note we are slightly lazy in so far as we don't watch for changes of group_num
                // while current active groups are unchanged..this is difficult/impossible to
                // actually cause you use the console or something.
                this._worker.exec('plot_path', 
                                   this.active_group_a._pkey,
                                   this.active_group_b  && this.active_group_b._pkey,
                                   Palettes.flag32[this.active_group_a.group_num],
                                   this.active_group_b && Palettes.flag32[this.active_group_b.group_num]);
            } else {
                this._setPos_path(this._blank_pos_path);
            }
        }
    });
</script>

  
</dom-module>