[Bio] / FigKernelPackages / display_related_genomes.pm Repository:
ViewVC logotype

Annotation of /FigKernelPackages/display_related_genomes.pm

Parent Directory Parent Directory | Revision Log Revision Log


Revision 1.3 - (view) (download) (as text)

1 : overbeek 1.1 package display_related_genomes;
2 :    
3 :     use strict;
4 :     use gjocolorlib;
5 :     eval { use Data::Dumper };
6 :    
7 :     # Use FIGjs.pm if available:
8 :    
9 : golsen 1.2 my $have_FIGjs;
10 :     eval { require FIGjs; $have_FIGjs = 1; };
11 : overbeek 1.1
12 :     my @clrkey = qw( 1 2 3 4 5 6 7 );
13 :     my $lastkey = 0;
14 :    
15 :     my @colors2 = qw( #cccccc #ddbb99 #ffaaaa #ffcc66 #ffff00 #aaffaa #bbddff #ddaaff );
16 :     my @colors1 = map { gjocolorlib::blend_html_colors( $_, 'white' ) } @colors2;
17 :    
18 :     my $breakcolor = '#dddddd';
19 :     my $breakwidth = 3;
20 :    
21 :     #===============================================================================
22 : golsen 1.3 # display_related_genomes::display()
23 :     #
24 :     # index id len | type index id | ...
25 :     #
26 :     # $html = display_related_genomes( $contig_entries, $headings, $options )
27 :     #
28 :     # contig_entries = [ contig_entry, ... ]
29 :     # contig_entry = [ peg_entry, ... ]
30 :     # peg_entry = [ contig, index, id, len, mouseover, related_entries ]
31 :     # related_engties = [ related_entry, ... ]
32 :     # related_entry = [ type, index, id, identity, mouseover ]
33 :     # type = <-> | -> | - (bbh, best hit, or no hit)
34 :     # mouseover = [ pop_up_title_html, pop_up_body_html, href_url ];
35 :     #
36 :     # headings = [ heading, ... ] = column heading information
37 :     # heading = [ pop_up_title_html, pop_up_body_html, href_url ]
38 :     #
39 :     # Options:
40 :     #
41 :     # breakcolor => $html_color # Color of genome separator (D = #dddddd)
42 :     # breakwidth => $points # Width of genome separator (D = 3)
43 :     # id_link => \&function # Function that coverts an id to an html link
44 :     # page => $boolean # 0 for invoking from CGI; 1 gives HTML page
45 :     #
46 :     #===============================================================================
47 :     sub display
48 :     {
49 :     my ( $contig_entries, $headings, $options ) = @_;
50 :     $contig_entries && ref ( $contig_entries ) eq 'ARRAY' && $headings && ref( $headings ) eq 'ARRAY'
51 :     or print STDERR "display_related_genomes requires contig_entries and headings\n"
52 :     and return '';
53 :     $options ||= {};
54 :    
55 :     $breakcolor = $options->{ breakcolor } if $options->{ breakcolor };
56 :     $breakwidth = $options->{ breakwidth } if $options->{ breakwidth };
57 :     my $color_by = $options->{ color_by } || 'identity';
58 :     my $page = $options->{ page } || 0;
59 :    
60 :     # Genome names
61 :    
62 :     my ( $genome1, @genomes ) = map { $_->[0] } @$headings;
63 :    
64 :     my $gen_sep = "<TH BgColor=$breakcolor Width=$breakwidth></TH>";
65 :     my @genome_header = ( " <TR>",
66 :     join( "\n $gen_sep\n", map { genome_column_head( $_ ) } @$headings ),
67 :     " </TR>"
68 :     );
69 :    
70 :     # Look at the data contig-by-contig:
71 :    
72 :     my @contigs;
73 :     my %n_genes;
74 :     foreach ( @$contig_entries )
75 :     {
76 :     my $contig = $_->[0]->[0];
77 :     push @contigs, $contig;
78 :     $n_genes{ $contig } = @$_;
79 :     }
80 :    
81 :     # Build the contig navigation menu:
82 :    
83 :     my $contig_menu = join( '<BR />',
84 :     "<B>Go to contig:</B>",
85 :     map { "<A Href=\"#$_\">$_</A> - $n_genes{$_} genes" }
86 :     @contigs
87 :     );
88 :    
89 :     my $contig_mouseover = mouseover( 'Contig navigation', 'Click for menu', $contig_menu, '', '' );
90 :    
91 :     # Start writing the html:
92 :    
93 :     my @html;
94 :     if ($page)
95 :     {
96 :     push @html, "<HTML>",
97 :     "<HEAD>",
98 :     "<TITLE>$headings->[0]->[0] Genome comparisons</TITLE>",
99 :     "</HEAD>",
100 :     "",
101 :     "<BODY>";
102 :     }
103 :     push @html, mouseover_JavaScript();
104 :    
105 :     my $tbl_cols = 4 * @$headings + 3;
106 :     push @html, "<TABLE Cols=$tbl_cols>\n";
107 :    
108 :     my $contig_entry;
109 :     foreach $contig_entry ( @$contig_entries )
110 :     {
111 :     my $contig = $contig_entry->[0]->[0];
112 :    
113 :     my ( $peg_entry, $genome_data );
114 :    
115 :     # Genome names
116 :    
117 :     push @html, @genome_header;
118 :    
119 :     # Column headers
120 :    
121 :     push @html, " <TR>",
122 :     " <TH><A Name=$contig $contig_mouseover>Index</A></TH>",
123 :     " <TH>Id</TH>",
124 :     " <TH>Length</TH>";
125 :    
126 :     my $genome2;
127 :     foreach $genome2 ( @genomes )
128 :     {
129 :     push @html, " <TH BgColor=$breakcolor></TH>",
130 :     " <TH>Match<BR />type</TH>",
131 :     " <TH>Index</TH>",
132 :     " <TH>Id</TH>";
133 :     }
134 :     push @html, " </TR>\n";
135 :    
136 :     # Contig data
137 :    
138 :     foreach $peg_entry ( @$contig_entry ) # per gene information
139 :     {
140 :     # Write the HTML for each gene in the contig:
141 :    
142 :     my ( $g1, $id1, $len1, $mouseover, $genome_data ) = @$peg_entry;
143 :    
144 :     push @html, " <TR Align=center>",
145 :     " <TD>$g1</TD>",
146 :     linked_datum( $id1, undef, $mouseover ),
147 :     " <TD>$len1</TD>";
148 :    
149 :     my @g2 = @genomes;
150 :     my $genome2;
151 :     foreach my $info2 ( @$genome_data )
152 :     {
153 :     my ( $t2, $g2, $id2, $f_id, $mouseover ) = @$info2;
154 :     $genome2 = shift @g2;
155 :    
156 :     if ( $g2 )
157 :     {
158 :     my $color;
159 :     # Hue goes red, green, blue, red over the inverval 0 - 1
160 :     # We want 0.003 -> 0.01 -> 0.03 -> 0.10 -> 0.3 -> 1
161 :     # log( $diff ) / log( 10 ) is log10( $diff ); it starts at
162 :     # -3 for identity to 0 at 100% different.
163 :     # -log( $diff ) / log( 10 ) starts at 3 and becomes 0 at 100% diff.
164 :     # 2/9 of that takes the hue from blue to red at diff goes from 0 to 1.
165 :    
166 :     my $diff = 1 - $f_id + 0.001;
167 :    
168 :     $color = gjocolorlib::rgb2html(
169 :     gjocolorlib::hsb2rgb( -2/9 * log( $diff ) / log( 10 ), # hue
170 :     $t2 eq '<->' ? 0.4 : 0.2, # saturation
171 :     1.0 # brightness
172 :     )
173 :     );
174 :    
175 :     push @html, $gen_sep,
176 :     " <TD BgColor=$color>$t2</TD>",
177 :     " <TD BgColor=$color>$g2</TD>",
178 :     linked_datum( $id2, $color, $mouseover );
179 :     }
180 :     else
181 :     {
182 :     push @html, $gen_sep,
183 :     " <TD>$t2</TD>",
184 :     " <TD>&nbsp;</TD>",
185 :     " <TD>&nbsp;</TD>";
186 :     }
187 :     }
188 :     push @html, " </TR>";
189 :     }
190 :     }
191 :    
192 :     push @html, "</TABLE>";
193 :     if ($page)
194 :     {
195 :     push @html,"</BODY>","</HTML>";
196 :     }
197 :     return join( "\n", @html );
198 :     }
199 :    
200 :    
201 :     #===============================================================================
202 : overbeek 1.1 # display_related_genomes
203 :     #
204 :     # $html = display_related_genomes( $contig_entries, $headings, $options )
205 :     #
206 :     # contig_entries = [ contig_entry, ... ]
207 :     # contig_entry = [ peg_entry, ... ]
208 :     # peg_entry = [ contig, gene, peg_len, mouseover, related_entries ]
209 :     # related_engties = [ related_entry, ... ]
210 :     # related_entry = [ type, contig, gene, indentity_frac, mouseover ]
211 : golsen 1.2 # type = <-> | -> | - (bbh, best hit, or no hit)
212 : overbeek 1.1 # mouseover = [ pop_up_title_html, pop_up_body_html, href_url ];
213 :     #
214 :     # headings = [ heading, ... ] = column heading information
215 :     # heading = [ pop_up_title_html, pop_up_body_html, href_url ]
216 :     #
217 :     # Options:
218 :     #
219 :     # color_by => keyword -- color matching entries by identity or contig
220 :     # breakcolor => html_color -- color of genome separator (D = #dddddd)
221 : golsen 1.2 # breakwidth => points -- width of genome separator (D = 3)
222 : overbeek 1.1 # page => boolean -- 0 for invoking from CGI; 1 gives HTML page
223 : golsen 1.2 #
224 : overbeek 1.1 #===============================================================================
225 :     sub display_related_genomes
226 :     {
227 :     my ( $contig_entries, $headings, $options ) = @_;
228 : golsen 1.2 $contig_entries && ref ( $contig_entries ) eq 'ARRAY' && $headings && ref( $headings ) eq 'ARRAY'
229 : overbeek 1.1 or print STDERR "display_related_genomes requires contig_entries and headings\n"
230 : golsen 1.2 and return '';
231 : overbeek 1.1 $options ||= {};
232 :    
233 :     my $color_by = $options->{ color_by } || 'identity';
234 : golsen 1.2 $breakcolor = $options->{ breakcolor } if $options->{ breakcolor };
235 :     $breakwidth = $options->{ breakwidth } if $options->{ breakwidth };
236 :     my $page = $options->{ page } || 0;
237 : overbeek 1.1
238 :     # Genome names
239 :    
240 :     my ( $genome1, @genomes ) = map { $_->[0] } @$headings;
241 :    
242 :     my $gen_sep = "<TH BgColor=$breakcolor Width=$breakwidth></TH>";
243 :     my @genome_header = ( " <TR>",
244 :     join( "\n $gen_sep\n", map { genome_column_head( $_ ) } @$headings ),
245 :     " </TR>"
246 :     );
247 :    
248 :     # Look at the data contig-by-contig:
249 :    
250 :     my @contigs;
251 :     my %n_genes;
252 :     foreach ( @$contig_entries )
253 :     {
254 :     my $contig = $_->[0]->[0];
255 :     push @contigs, $contig;
256 :     $n_genes{ $contig } = @$_;
257 :     }
258 :    
259 :     # Build the contig navigation menu:
260 :    
261 :     my $contig_menu = join( '<BR />',
262 :     "<B>Go to contig:</B>",
263 :     map { "<A Href=\"#$_\">$_</A> - $n_genes{$_} genes" }
264 :     @contigs
265 :     );
266 :    
267 :     my $contig_mouseover = mouseover( 'Contig navigation', 'Click for menu', $contig_menu, '', '' );
268 :    
269 :     # Start writing the html:
270 :    
271 :     my @html;
272 :     if ($page)
273 :     {
274 :     push @html, "<HTML>",
275 :     "<HEAD>",
276 :     "<TITLE>$headings->[0]->[0] Genome comparisons</TITLE>",
277 :     "</HEAD>",
278 :     "",
279 :     "<BODY>";
280 :     }
281 :     push @html, mouseover_JavaScript();
282 :    
283 :     my $tbl_cols = 4 * @$headings + 3;
284 :     push @html, "<TABLE Cols=$tbl_cols>\n";
285 :    
286 :     my $contig_entry;
287 :     foreach $contig_entry ( @$contig_entries )
288 :     {
289 :     my $contig = $contig_entry->[0]->[0];
290 :    
291 :     # Work out contig colors for each genome:
292 :    
293 :     my ( $peg_entry, $genome_data );
294 :     my %counts; # hash with counts per contig for each genome
295 :     my %colors; # hash mapping contig to color for each genome
296 :    
297 :     if ( $color_by =~ /contig/ )
298 :     {
299 :     my ( $genome2, $c2, @g2 );
300 :     foreach $peg_entry ( @$contig_entry ) # per gene information
301 :     {
302 :     @g2 = @genomes;
303 :     foreach $genome_data ( @{ $peg_entry->[4] } )
304 :     {
305 :     $genome2 = shift @g2;
306 :     $c2 = $genome_data->[1];
307 :     $counts{ $genome2 }->{ $c2 }++ if $c2;
308 :     }
309 :     }
310 :    
311 :     foreach $genome2 ( @genomes )
312 :     {
313 :     my @clr = @clrkey;
314 :     my %clr = map { $_->[0] => ( shift @clr ) || 0 } # contig->color
315 :     sort { $b->[1] <=> $a->[1] } # sort by counts
316 :     map { [ $_, $counts{ $genome2 }->{ $_ } ] } # contig-counts pair
317 :     keys %{ $counts{ $genome2 } }; # contigs
318 :    
319 :     $colors{ $genome2 } = \%clr;
320 :     }
321 :     }
322 :    
323 :     # Genome names
324 :    
325 :     push @html, @genome_header;
326 :    
327 :     # Column headers
328 :    
329 :     push @html, " <TR>",
330 :     " <TH><A Name=$contig $contig_mouseover>Contig</A></TH>",
331 :     " <TH>Gene</TH>",
332 :     " <TH>Length</TH>";
333 :    
334 :     my $genome2;
335 :     foreach $genome2 ( @genomes )
336 :     {
337 :     push @html, " <TH BgColor=$breakcolor></TH>",
338 :     " <TH>Match<BR />type</TH>",
339 :     " <TH>Contig</TH>",
340 :     " <TH>Gene</TH>";
341 :     }
342 :     push @html, " </TR>\n";
343 :    
344 :     # Contig data
345 :    
346 :     foreach $peg_entry ( @$contig_entry ) # per gene information
347 :     {
348 :     # Write the HTML for each gene in the contig:
349 :    
350 :     my ( $c1, $g1, $len1, $mouseover, $genome_data ) = @$peg_entry;
351 :    
352 :     push @html, " <TR Align=center>",
353 :     " <TD>$c1</TD>",
354 :     linked_datum( $g1, undef, $mouseover ),
355 :     " <TD>$len1</TD>";
356 :    
357 :     my @g2 = @genomes;
358 :     my $genome2;
359 :     foreach my $info2 ( @$genome_data )
360 :     {
361 :     my ( $t2, $c2, $g2, $f_id, $mouseover ) = @$info2;
362 :     $genome2 = shift @g2;
363 :    
364 :     if ( $g2 )
365 :     {
366 :     my $color;
367 :     if ( $color_by =~ /ident/ )
368 :     {
369 :     # Hue goes red, green, blue, red over the inverval 0 - 1
370 :     # We want 0.003 -> 0.01 -> 0.03 -> 0.10 -> 0.3 -> 1
371 :     # log( $diff ) / log( 10 ) is log10( $diff ); it starts at
372 :     # -3 for identity to 0 at 100% different.
373 :     # -log( $diff ) / log( 10 ) starts at 3 and becomes 0 at 100% diff.
374 :     # 2/9 of that takes the hue from blue to red at diff goes from 0 to 1.
375 :    
376 :     my $diff = 1 - $f_id + 0.001;
377 :    
378 :     $color = gjocolorlib::rgb2html(
379 :     gjocolorlib::hsb2rgb( -2/9 * log( $diff ) / log( 10 ), # hue
380 :     $t2 eq '<->' ? 0.4 : 0.2, # saturation
381 :     1.0 # brightness
382 :     )
383 :     );
384 :     }
385 :     else
386 :     {
387 :     my $clrkey = $colors{ $genome2 }->{ $c2 };
388 :     $color = $t2 eq '<->' ? $colors2[$clrkey] : $colors1[$clrkey];
389 :     }
390 :    
391 :     push @html, $gen_sep,
392 :     " <TD BgColor=$color>$t2</TD>",
393 :     " <TD BgColor=$color>$c2</TD>",
394 :     linked_datum( $g2, $color, $mouseover );
395 :     }
396 :     else
397 :     {
398 :     push @html, $gen_sep,
399 :     " <TD>$t2</TD>",
400 :     " <TD> </TD>",
401 :     " <TD> </TD>";
402 :     }
403 :     }
404 :     push @html, " </TR>";
405 :     }
406 :     }
407 :    
408 :     push @html, "</TABLE>";
409 :     if ($page)
410 :     {
411 :     push @html,"</BODY>","</HTML>";
412 :     }
413 :     return join( "\n", @html );
414 :     }
415 :    
416 :    
417 :     #-------------------------------------------------------------------------------
418 :     # Build the html string for the column header for a genome:
419 :     #
420 :     # $html = genome_column_head( $heading )
421 :     #
422 :     #-------------------------------------------------------------------------------
423 :     sub genome_column_head
424 :     {
425 :     my ( $abbrev, $text, $link ) = @{ $_[0] };
426 : golsen 1.3 $link = $link ? qq( HRef="$link" Target="$abbrev") : '';
427 :     my $mouse = $text ? mouseover( $abbrev, $text ) : '';
428 :     $abbrev = qq(<A$link>$abbrev</A>) if $link;
429 :     qq( <TH ColSpan=3$mouse>$abbrev</TH>);
430 : overbeek 1.1 }
431 :    
432 :    
433 :     #-------------------------------------------------------------------------------
434 :     # Build the html string for the column header for a genome:
435 :     #
436 :     # $html = linked_datum( $datum, $color, $mouseover )
437 :     #
438 :     #-------------------------------------------------------------------------------
439 :     sub linked_datum
440 :     {
441 :     my ( $datum, $color, $mouse ) = @_;
442 : golsen 1.2 my ( $id, $text, $link ) = ( $mouse && ref( $mouse ) eq 'ARRAY' ) ? @$mouse : ();
443 : overbeek 1.1 $mouse = $text ? mouseover( $id, $text || '&nbsp;' ) : '';
444 : golsen 1.3 $link = $link ? qq( HRef="$link" Target="$id") : '';
445 :     $color = $color ? qq( BgColor=$color) : '';
446 :     $datum = qq(<A$link>$datum</A>) if $link;
447 :     qq( <TD$color$mouse>$datum</TD>);
448 : overbeek 1.1 }
449 :    
450 :    
451 :     #-------------------------------------------------------------------------------
452 :     # Escape special characters in text for use in inline javascript string:
453 :     #
454 :     # $js_string = js_escape( $text )
455 :     #
456 :     #-------------------------------------------------------------------------------
457 :     sub js_escape { local $_ = $_[0] || ''; s/'/\\'/g; s/"/&quot;/g; $_ }
458 :    
459 :    
460 :     #-------------------------------------------------------------------------------
461 :     # Return a string for adding an onMouseover tooltip handler:
462 :     #
463 :     # mouseover( $title, $text, $menu, $parent, $titlecolor, $bodycolor )
464 :     #
465 :     # The code here is virtually identical to that in FIGjs.pm, but makes this
466 :     # SEED independent.
467 :     #-------------------------------------------------------------------------------
468 :     sub mouseover
469 :     {
470 :     if ( $have_FIGjs ) { return &FIGjs::mouseover( @_ ) }
471 :    
472 :     my ($title, $text, $menu, $parent, $titlecolor, $bodycolor) = @_;
473 :    
474 :     $title = js_escape( $title );
475 :     $text = js_escape( $text );
476 :     $menu = js_escape( $menu );
477 :    
478 :     qq( onMouseover="javascript:if( ! this.tooltip ) this.tooltip=new Popup_Tooltip( this, '$title', '$text', '$menu', '$parent', '$titlecolor', '$bodycolor' ); this.tooltip.addHandler(); return false;")
479 :     }
480 :    
481 :    
482 :     #-------------------------------------------------------------------------------
483 :     # Return a text string with the necessary JavaScript for the mouseover
484 :     # tooltips.
485 :     #
486 :     # $html = mouseover_JavaScript()
487 :     #
488 :     # The code here is virtually identical to that in FIGjs.pm, but makes this
489 :     # SEED independent.
490 :     #-------------------------------------------------------------------------------
491 :     sub mouseover_JavaScript
492 :     {
493 :     if ( $have_FIGjs ) { return &FIGjs::toolTipScript( ) }
494 :    
495 :     return <<'End_of_JavaScript';
496 :     <SCRIPT Language='JavaScript'>
497 :     //
498 :     // javascript class for tooltips and popup menus
499 :     //
500 :     // This class manages the information, creating area to draw tooltips and
501 :     // popup menus and provides the event handlers to handle them
502 :     //
503 :     var DIV_WIDTH=400;
504 :     var px; // position suffix with "px" in some cases
505 :     var initialized = false;
506 :     var ns4 = false;
507 :     var ie4 = false;
508 :     var ie5 = false;
509 :     var kon = false;
510 :     var iemac = false;
511 :     var tooltip_name='popup_tooltip_div';
512 :    
513 :     function Popup_Tooltip(object, tooltip_title, tooltip_text,
514 :     popup_menu, use_parent_pos, head_color,
515 :     body_color) {
516 :     // The first time an object of this class is instantiated,
517 :     // we have to setup some browser specific settings
518 :    
519 :     if (!initialized) {
520 :     ns4 = (document.layers) ? true : false;
521 :     ie4 = (document.all) ? true : false;
522 :     ie5 = ((ie4) && ((navigator.userAgent.indexOf('MSIE 5') > 0) ||
523 :     (navigator.userAgent.indexOf('MSIE 6') > 0))) ? true : false;
524 :     kon = (navigator.userAgent.indexOf('konqueror') > 0) ? true : false;
525 :     if(ns4||kon) {
526 :     //setTimeout("window.onresize = function () {window.location.reload();};", 2000);
527 :     }
528 :     ns4 ? px="" : px="px";
529 :     iemac = ((ie4 || ie5) && (navigator.userAgent.indexOf('Mac') > 0)) ? true : false;
530 :    
531 :     initialized=true;
532 :     }
533 :    
534 :     if (iemac) { return; } // Give up
535 :    
536 :     this.tooltip_title = tooltip_title;
537 :     this.tooltip_text = tooltip_text;
538 :    
539 :     if (head_color) { this.head_color = head_color; }
540 :     else { this.head_color = "#333399"; }
541 :    
542 :     if (body_color) { this.body_color = body_color; }
543 :     else { this.body_color = "#CCCCFF"; }
544 :    
545 :     this.popup_menu = popup_menu;
546 :     if (use_parent_pos) {
547 :     this.popup_menu_x = object.offsetLeft;
548 :     this.popup_menu_y = object.offsetTop + object.offsetHeight + 3;
549 :     }
550 :     else {
551 :     this.popup_menu_x = -1;
552 :     this.popup_menu_y = -1;
553 :     }
554 :    
555 :     // create the div if necessary
556 :     // the div may be shared between several instances
557 :     // of this class
558 :    
559 :     this.div = getDiv(tooltip_name);
560 :     if (! this.div) {
561 :     // create a hidden div to contain the information
562 :     this.div = document.createElement("div");
563 :     this.div.id=tooltip_name;
564 :     this.div.style.position="absolute";
565 :     this.div.style.zIndex=0;
566 :     this.div.style.top="0"+px;
567 :     this.div.style.left="0"+px;
568 :     this.div.style.visibility=ns4?"hide":"hidden";
569 :     this.div.tooltip_visible=0;
570 :     this.div.menu_visible=0
571 :     document.body.appendChild(this.div);
572 :     }
573 :    
574 :     // register methods
575 :    
576 :     this.showTip = showTip;
577 :     this.hideTip = hideTip;
578 :     this.fillTip = fillTip;
579 :     this.showMenu = showMenu;
580 :     this.hideMenu = hideMenu;
581 :     this.fillMenu = fillMenu;
582 :     this.addHandler = addHandler;
583 :     this.delHandler = delHandler;
584 :     this.mousemove = mousemove;
585 :     this.showDiv = showDiv;
586 :    
587 :     // object state
588 :    
589 :     this.attached = object;
590 :     object.tooltip = this;
591 :     }
592 :    
593 :     function getDiv() {
594 :     if (ie5 || ie4) { return document.all[tooltip_name]; }
595 :     else if (document.layers) { return document.layers[tooltip_name]; }
596 :     else if (document.all) { return document.all[tooltip_name]; }
597 :     return document.getElementById(tooltip_name);
598 :     }
599 :    
600 :     function hideTip() {
601 :     if (this.div.tooltip_visible) {
602 :     this.div.innerHTML="";
603 :     this.div.style.visibility=ns4?"hide":"hidden";
604 :     this.div.tooltip_visible=0;
605 :     }
606 :     }
607 :    
608 :     function hideMenu() {
609 :     if (this.div && this.div.menu_visible) {
610 :     this.div.innerHTML="";
611 :     this.div.style.visibility=ns4?"hide":"hidden";
612 :     this.div.menu_visible=0;
613 :     }
614 :     }
615 :    
616 :     function fillTip() {
617 :     this.hideTip();
618 :     this.hideMenu();
619 :     if (this.tooltip_title && this.tooltip_text) {
620 :     this.div.innerHTML='<table width='+DIV_WIDTH+' border=0 cellpadding=2 cellspacing=0 bgcolor="'+this.head_color+'"><tr><td class="tiptd"><table width="100%" border=0 cellpadding=0 cellspacing=0><tr><th><span class="ptt"><b><font color="#FFFFFF">'+this.tooltip_title+'</font></b></span></th></tr></table><table width="100%" border=0 cellpadding=2 cellspacing=0 bgcolor="'+this.body_color+'"><tr><td><span class="pst"><font color="#000000">'+this.tooltip_text+'</font></span></td></tr></table></td></tr></table>';
621 :     this.div.tooltip_visible=1;
622 :     }
623 :     }
624 :    
625 :     function fillMenu() {
626 :     this.hideTip();
627 :     this.hideMenu();
628 :     if (this.popup_menu) {
629 :     this.div.innerHTML='<table cellspacing="2" cellpadding="1" bgcolor="#000000"><tr bgcolor="#eeeeee"><td><div style="max-height:300px;min-width:100px;overflow:auto;">'+this.popup_menu+'</div></td></tr></table>';
630 :     this.div.menu_visible=1;
631 :     }
632 :     }
633 :    
634 :     function showDiv(x,y) {
635 :     winW=(window.innerWidth)? window.innerWidth+window.pageXOffset-16 :
636 :     document.body.offsetWidth-20;
637 :     winH=(window.innerHeight)?window.innerHeight+window.pageYOffset :
638 :     document.body.offsetHeight;
639 :     if (window.getComputedStyle) {
640 :     current_style = window.getComputedStyle(this.div,null);
641 :     div_width = parseInt(current_style.width);
642 :     div_height = parseInt(current_style.height);
643 :     }
644 :     else {
645 :     div_width = this.div.offsetWidth;
646 :     div_height = this.div.offsetHeight;
647 :     }
648 :     this.div.style.left=(((x + div_width) > winW) ? winW - div_width : x) + px;
649 :     this.div.style.top=(((y + div_height) > winH) ? winH - div_height: y) + px;
650 :     // this.div.style.color = "#eeeeee";
651 :     this.div.style.visibility=ns4?"show":"visible";
652 :     }
653 :    
654 :     function showTip(e,y) {
655 :     if (!this.div.menu_visible) {
656 :     if (!this.div.tooltip_visible) {
657 :     this.fillTip();
658 :     }
659 :     var x;
660 :     if (typeof(e) == 'number') {
661 :     x = e;
662 :     }
663 :     else {
664 :     x=e.pageX?e.pageX:e.clientX?e.clientX:0;
665 :     y=e.pageY?e.pageY:e.clientY?e.clientY:0;
666 :     }
667 :     x+=2; y+=2;
668 :     this.showDiv(x,y);
669 :     this.div.tooltip_visible=1;
670 :     }
671 :     }
672 :    
673 :     function showMenu(e) {
674 :     if (this.div) {
675 :     if (!this.div.menu_visible) {
676 :     this.fillMenu();
677 :     }
678 :     var x;
679 :     var y;
680 :    
681 :     // if the menu position was given as parameter
682 :     // to the constructor, then use that position
683 :     // or fall back to mouse position
684 :    
685 :     if (this.popup_menu_x != -1) {
686 :     x = this.popup_menu_x;
687 :     y = this.popup_menu_y;
688 :     }
689 :     else {
690 :     x = e.pageX ? e.pageX : e.clientX ? e.clientX : 0;
691 :     y = e.pageY ? e.pageY : e.clientY ? e.clientY : 0;
692 :     }
693 :     this.showDiv(x,y);
694 :     this.div.menu_visible=1;
695 :     }
696 :     }
697 :    
698 :     // Add the event handler to the parent object.
699 :     // The tooltip is managed by the mouseover and mouseout
700 :     // events. mousemove is captured, too
701 :    
702 :     function addHandler() {
703 :     if (iemac) { return; } // ignore Ie on mac
704 :    
705 :     if(this.tooltip_text) {
706 :     this.fillTip();
707 :     this.attached.onmouseover = function (e) {
708 :     this.tooltip.showTip(e);
709 :     return false;
710 :     };
711 :     this.attached.onmousemove = function (e) {
712 :     this.tooltip.mousemove(e);
713 :     return false;
714 :     };
715 :     }
716 :    
717 :     if (this.popup_menu) {
718 :     this.attached.onclick = function (e) {
719 :     this.tooltip.showMenu(e);
720 :    
721 :     // reset event handlers
722 :     if (this.tooltip_text) {
723 :     this.onmousemove=null;
724 :     this.onmouseover=null;
725 :     this.onclick=null;
726 :     }
727 :    
728 :     // there are two mouseout events,
729 :     // one when the mouse enters the inner region
730 :     // of our div, and one when the mouse leaves the
731 :     // div. we need to handle both of them
732 :     // since the div itself got no physical region on
733 :     // the screen, we need to catch event for its
734 :     // child elements
735 :     this.tooltip.div.moved_in=0;
736 :     this.tooltip.div.onmouseout=function (e) {
737 :     var div = getDiv(tooltip_name);
738 :     if (e.target.parentNode == div) {
739 :     if (div.moved_in) {
740 :     div.menu_visible = 0;
741 :     div.innerHTML="";
742 :     div.style.visibility=ns4?"hide":"hidden";
743 :     }
744 :     else {
745 :     div.moved_in=1;
746 :     }
747 :     return true;
748 :     };
749 :     return true;
750 :     };
751 :     this.tooltip.div.onclick=function() {
752 :     this.menu_visible = 0;
753 :     this.innerHTML="";
754 :     this.style.visibility=ns4?"hide":"hidden";
755 :     return true;
756 :     }
757 :     return false; // do not follow existing links if a menu was defined!
758 :    
759 :     };
760 :     }
761 :     this.attached.onmouseout = function () {
762 :     this.tooltip.delHandler();
763 :     return false;
764 :     };
765 :     }
766 :    
767 :     function delHandler() {
768 :     if (this.div.menu_visible) { return true; }
769 :    
770 :     // clean up
771 :    
772 :     if (this.popup_menu) { this.attached.onmousedown = null; }
773 :     this.hideMenu();
774 :     this.hideTip();
775 :     this.attached.onmousemove = null;
776 :     this.attached.onmouseout = null;
777 :    
778 :     // re-register the handler for mouse over
779 :    
780 :     this.attached.onmouseover = function (e) {
781 :     this.tooltip.addHandler(e);
782 :     return true;
783 :     };
784 :     return false;
785 :     }
786 :    
787 :     function mousemove(e) {
788 :     if (this.div.tooltip_visible) {
789 :     if (e) {
790 :     x=e.pageX?e.pageX:e.clientX?e.clientX:0;
791 :     y=e.pageY?e.pageY:e.clientY?e.clientY:0;
792 :     }
793 :     else if (event) {
794 :     x=event.clientX;
795 :     y=event.clientY;
796 :     }
797 :     else {
798 :     x=0; y=0;
799 :     }
800 :    
801 :     if(document.documentElement) // Workaround for scroll offset of IE
802 :     {
803 :     x+=document.documentElement.scrollLeft;
804 :     y+=document.documentElement.scrollTop;
805 :     }
806 :     this.showTip(x,y);
807 :     }
808 :     }
809 :    
810 :     function setValue(id , val) {
811 :     var element = document.getElementById(id);
812 :     element.value = val;
813 :     }
814 :     </SCRIPT>
815 :    
816 :     End_of_JavaScript
817 :     }
818 :    
819 :    
820 :     1;

MCS Webmaster
ViewVC Help
Powered by ViewVC 1.0.3