Brush causing issues with multi-line, gridded chart

Question

My aim is to have a multi-line chart with a brush, and the vertical gridlines follow the changing ticks. I'm almost where I want to be but there's still a few thorns in my side. Please see my jsFiddle:

http://jsfiddle.net/U4CGz/3/

Right now I can get it so that either

• x-axis ticks change properly, lines disappear, gridlines don't behave, y-axis disappears

or

• x-axis ticks do not change, lines work properly, grid lines do not change

You can switch between these two behaviors at the bottom of my code:

function brushed() {
    x_main.domain(brush.empty() ? x_mini.domain() : brush.extent());

    // alternate between these two
    main.selectAll('path').attr('d', line);
    // main.selectAll('path').attr('d', function(d) { return line(d.values); });

    main.select('.x.axis').call(xAxis);
    update_vgrid(x_main);
}

Has anybody else dealt with these things before? Thank you