details: http://www.bx.psu.edu/hg/galaxy/rev/734722f10df8 changeset: 2923:734722f10df8 user: James Taylor <james@jamestaylor.org> date: Tue Oct 27 13:28:25 2009 -0400 description: Fix display of stranded features without blocks in trackster. Hacky. 4 file(s) affected in this change: lib/galaxy/visualization/tracks/data/interval_index.py static/images/visualization/strand_left_inv.png static/images/visualization/strand_right_inv.png static/scripts/trackster.js diffs (114 lines): diff -r d8ce43b63ebb -r 734722f10df8 lib/galaxy/visualization/tracks/data/interval_index.py --- a/lib/galaxy/visualization/tracks/data/interval_index.py Tue Oct 27 11:36:57 2009 -0400 +++ b/lib/galaxy/visualization/tracks/data/interval_index.py Tue Oct 27 13:28:25 2009 -0400 @@ -21,7 +21,11 @@ for start, end, offset in index.find(chrom, start, end): source.seek(offset) feature = source.readline().split() - payload = { 'start': start, 'end': end, 'name': feature[3], 'strand': feature[5] } + payload = { 'start': start, 'end': end, 'name': feature[3] } + try: + payload['strand'] = feature[5] + except IndexError: + pass try: block_sizes = [ int(n) for n in feature[10].split(',') if n != ''] block_starts = [ int(n) for n in feature[11].split(',') if n != '' ] diff -r d8ce43b63ebb -r 734722f10df8 static/images/visualization/strand_left_inv.png Binary file static/images/visualization/strand_left_inv.png has changed diff -r d8ce43b63ebb -r 734722f10df8 static/images/visualization/strand_right_inv.png Binary file static/images/visualization/strand_right_inv.png has changed diff -r d8ce43b63ebb -r 734722f10df8 static/scripts/trackster.js --- a/static/scripts/trackster.js Tue Oct 27 11:36:57 2009 -0400 +++ b/static/scripts/trackster.js Tue Oct 27 13:28:25 2009 -0400 @@ -19,6 +19,17 @@ left_img.src = "../images/visualization/strand_left.png"; left_img.onload = function() { LEFT_STRAND = CONTEXT.createPattern(left_img, "repeat"); +} + +var right_img_inv = new Image(); +right_img_inv.src = "../images/visualization/strand_right_inv.png"; +right_img_inv.onload = function() { + RIGHT_STRAND_INV = CONTEXT.createPattern(right_img_inv, "repeat"); +} +var left_img_inv = new Image(); +left_img_inv.src = "../images/visualization/strand_left_inv.png"; +left_img_inv.onload = function() { + LEFT_STRAND_INV = CONTEXT.createPattern(left_img_inv, "repeat"); } function commatize( number ) { @@ -402,7 +413,7 @@ y_center = this.slots[feature.name] * this.vertical_gap; if (feature.strand && this.showing_labels) { - if (feature.strand == "+") { + if (feature.strand == "+") { ctx.fillStyle = RIGHT_STRAND; } else if (feature.strand == "-") { ctx.fillStyle = LEFT_STRAND; @@ -415,26 +426,53 @@ } if (this.showing_labels && ctx.fillText) { - ctx.fillText(feature.name, f_start, y_center + 8); + ctx.fillText(feature.name, f_start - 1, y_center + 8); } + // If there is no thickStart/thickEnd, draw the whole thing + // as thick. var exon_start, exon_end; if (feature.exon_start && feature.exon_end) { exon_start = Math.floor( Math.max(0, (feature.exon_start - tile_low) * w_scale) ); exon_end = Math.ceil( Math.min(width, (feature.exon_end - tile_low) * w_scale) ); - } + } else { + exon_start = Math.floor( Math.max(0, (feature.start - tile_low) * w_scale) ); + exon_end = Math.ceil( Math.min(width, (feature.end - tile_low) * w_scale) ); + } - if (feature.blocks && this.showing_labels) { - for (var k = 0, k_len = feature.blocks.length; k < k_len; k++) { - var block = feature.blocks[k], + if (this.showing_labels) { + // If there are no blocks, we treat the feature as one + // big exon + var blocks = feature.blocks; + var arrows_in_blocks = false; + if ( ! blocks ) { + blocks = [[feature.start,feature.end]]; + arrows_in_blocks = true + } + for (var k = 0, k_len = blocks.length; k < k_len; k++) { + var block = blocks[k], block_start = Math.floor( Math.max(0, (block[0] - tile_low) * w_scale) ), block_end = Math.ceil( Math.min(width, (block[1] - tile_low) * w_scale) ); - var thickness = 5, y_start = 3; + var thickness, y_start; if (exon_start && block_start >= exon_start && block_end <= exon_end) { - thickness = 7; - y_start = 2; - } - ctx.fillRect(block_start, y_center + y_start, block_end - block_start, thickness); + thickness = 9; + y_start = 1; + ctx.fillRect(block_start, y_center + y_start, block_end - block_start, thickness); + if ( feature.strand && arrows_in_blocks ) { + if (feature.strand == "+") { + ctx.fillStyle = RIGHT_STRAND_INV; + } else if (feature.strand == "-") { + ctx.fillStyle = LEFT_STRAND_INV; + } + ctx.fillRect(block_start, y_center, block_end - block_start, 10); + ctx.fillStyle = "#000"; + } + } else { + thickness = 5; + y_start = 3; + ctx.fillRect(block_start, y_center + y_start, block_end - block_start, thickness); + } + // console.log(block_start, block_end); } }