keep analysis options button visible after row click
[scpubgit/stemmaweb.git] / root / js / stexaminer.js
1 var colors = ['#ffeeaa','#afc6e9','#d5fff6','#ffccaa','#ffaaaa','#e5ff80','#e5d5ff','#ffd5e5'];
2 var row_triggered = false;
3
4 function handle_row_click( row ) {
5         var ridx = row.parent().parent().index()
6         var rs = readingstats[ridx];
7     var imghtml = $('<img>').attr( 'src', baseurl + "../images/ajax-loader.gif" ).attr( 'alt', "Loading SVG..." );
8     $('#stemma_graph').empty();
9     $('#stemma_graph').append( imghtml );
10         if( rs.layerwits ) {
11                 var stemma_form = { 'dot': graphdot, 'layerwits': rs.layerwits };
12                 $.post( baseurl + 'graphsvg', stemma_form, function( data ) {
13                         var oSerializer = new XMLSerializer();
14                         var xmlString = oSerializer.serializeToString( data.documentElement );
15                         loadSVG( xmlString, function () { 
16                                 color_row( row );
17                                 show_stats( rs );
18                         });
19                 });
20         } else {
21                 loadSVG( original_svg, function() {
22                         color_row( row );
23                         show_stats( rs );
24                 });
25         }
26 }
27
28 // Load the SVG we are given
29 function loadSVG(svgData, cb) {
30         var svgElement = $('#stemma_graph');
31
32         $(svgElement).svg('destroy');
33
34         $(svgElement).svg({
35                 loadURL: svgData,
36                 onLoad : function () {
37                         var theSVG = svgElement.find('svg');
38                         var svgoffset = theSVG.offset();
39                         // Firefox needs a different offset, stupidly enough
40                         var browseroffset = 1;
41                         if( navigator.userAgent.indexOf('Firefox') > -1 ) {
42                                 browseroffset = 3;
43                         }
44                         var topoffset = theSVG.position().top - svgElement.position().top - browseroffset;
45                         // If we are on Safari, we need to get rid of the 'pt' in the width/height
46                         // specifications
47                         theSVG.offset({ top: svgoffset.top - topoffset, left: svgoffset.left });
48                         if( cb ) {
49                                 cb.call();
50                         }
51                 }
52         });
53 }
54
55 function color_row( row ) {
56     row_triggered = true;
57     $('ellipse').attr( {stroke:'white', fill:'#fff'} );
58     $('.node').children('polygon').attr( {stroke:'#fff', fill:'#fff'} );
59     $('.node').children('text').attr( {stroke:'none', fill:'#000'} );
60     $('tr.active_variant_row').children('td').removeClass('cellb0 cellb1 cellb2 cellb3 cellb4 cellb5 cellb6 cellb7'); 
61     row.parent().nextAll('.clickable').children('span').click();
62     $('td.active_variant_cell').removeClass('active_variant_cell');
63     row_triggered = false;
64 }
65
66 function color_nodes( column_index, arr_node_ids, arr_greynode_ids ) {
67   if( !row_triggered ) {
68     $('tr.active_variant_row').children('td').removeClass('cellb0 cellb1 cellb2 cellb3 cellb4 cellb5 cellb6 cellb7'); 
69     $('td.active_variant_cell').removeClass('active_variant_cell');
70     $('ellipse').attr( {stroke:'white', fill:'#fff'} );
71     $('.node').children('polygon').attr( {stroke:'#fff', fill:'#fff'} );
72     $('.node').children('text').attr( {stroke:'none', fill:'#000'} );
73   }; 
74   $('tr.active_variant_row').removeClass('active_variant_row') 
75   jQuery.each( arr_greynode_ids, function(index,value) {
76     nodes = $('.node').children('title').filter( function(index) {
77       return $(this).text() == value;
78     })
79     nodes.siblings('ellipse, polygon, text').each( function( index ) {
80         $(this).attr( {stroke:'#ddd', fill:'#f8f8f8'} );
81       });
82   });
83   jQuery.each( arr_node_ids, function(index,value) {
84     $('.node').children('title').filter( function(index) {
85       return $(this).text() == value;
86     }).siblings('ellipse').each( function( index ) {
87         $(this).attr( {stroke:'black', fill:colors[column_index-1]} );
88       });
89   });
90 }
91
92 function show_stats( rs ) {
93         // Update the title
94         $('#stats_title').empty().text('Statistics for reading at ' + rs.id + ':' );
95         var rshtml = $('#stats_template').clone();
96         if( "unsolved" in rs ) {
97                 var nocalcmsg;
98                 if( rs.unsolved == 'IDP error' ) {
99                         nocalcmsg = $('<span>').attr('class', 'error').append(
100                                 "(Could not reach calculation server - are you offline?)" );
101                 } else {
102                         nocalcmsg = "(Not yet calculated for this location - please try later)";
103                 }
104                 rshtml.find('.solutionstatus').append( nocalcmsg );
105         } else {
106                 $.each( rs.readings, function( idx, rdghash ) {
107                         var rdgstats = $('#reading_template').clone();
108                         rdgstats.find('.readinglabel').append( rdghash.text );
109                         rdgstats.find('.reading_copied').append( rdghash.followed );
110                         rdgstats.find('.reading_changed').append( rdghash.not_followed );
111                         rdgstats.find('.reading_unclear').append( rdghash.follow_unknown );
112                         rdgstats.find('.readingroots').append( rdghash.independent_occurrence );
113                         if( rdghash.is_reverted ) {
114                                 rdgstats.find('.reversionroots').append( rdghash.reversions );
115                         } else {
116                                 rdgstats.find('.readingreversions').empty();
117                         }
118                         var rdgsourcehtml = fill_parent_template( rdghash, 'source' );
119                         var rdgreverthtml = fill_parent_template( rdghash, 'reversion' );
120                         rdgstats.find('.reading_statistics').append( rdgsourcehtml );
121                         rdgstats.find('.reading_statistics').append( rdgreverthtml );
122                         // If neither, append a small spacer
123                         if( !rdgsourcehtml && !rdgreverthtml ) {
124                                 rdgstats.find('.reading_statistics').append( '<br/>' );
125                         }
126                         rshtml.append( rdgstats.contents() );
127                 });
128         }
129         $('#stats_container').empty().append( rshtml.contents() );
130         
131 };
132
133 function fill_parent_template( rdghash, type ) {
134         var objname = type + '_parents';
135         var template_id = '#reading_' + type + '_template';
136         var list_class = '.reading_' + type + '_list';
137         if( ! $.isEmptyObject( rdghash[objname] ) ) {
138                 var parentstats = $( template_id ).clone();
139                 $.each( rdghash[objname], function( parentid, pdata ) {
140                         var parentdesc = pdata.label;
141                         if( pdata.relation ) {
142                                 parentdesc += ' - variant type ' + pdata.relation.type;
143                                 if( pdata.relation.annotation ) {
144                                         parentdesc += ' [ ' + pdata.relation.annotation + ' ]';
145                                 }
146                         } else {
147                                 parentdesc += ' - no syntactic relation';
148                         }
149                         var parentitem = $('<li>').append( parentdesc );
150                         parentstats.find( list_class ).append( parentitem );
151                 });
152                 return( parentstats.contents() );
153         }
154 }
155
156 // Save the original unextended SVG for when we need it.
157 $(document).ready(function () {
158         loadSVG( original_svg );
159         
160         $('#aboutlink').popupWindow({ 
161                 height:500, 
162                 width:800, 
163                 top:50, 
164                 left:50,
165                 scrollbars:1 
166         }); 
167         $('#options').dialog({
168                 autoOpen: false,
169                 // height: 'auto',
170                 width: 300,
171                 modal: true,
172                 buttons: {
173                         Cancel: function() {
174                                 $(this).dialog( "close" );
175                         },
176                         Reanalyze: function() {
177                                 $('#use_variants_form').submit();
178                         },
179                 }
180         });
181
182 });