Fossil

Check-in [504dc92c]
Login

Many hyperlinks are disabled.
Use anonymous login to enable hyperlinks.

Overview
Comment:If the graph height is greater than 32767, omit the <canvas> object. Also, do not appendChild() the graphics <div> objects until after they have been set to "abolute" positioning, to work around a FF performance issue. Ticket [13536c292b60]
Downloads: Tarball | ZIP archive | SQL archive
Timelines: family | ancestors | descendants | both | trunk
Files: files | file ages | folders
SHA1: 504dc92ceb3976871b97e9d1a9a22ac0e7691238
User & Date: drh 2010-03-22 14:17:46
Original Comment: If the graph height is greater than 32767, omit the <canvas> object. Also, do not appendChild() the graphics <div> objects until after they have been set to "abolute" positioning, to work around a FF performance issue.
Context
2010-03-24
07:10
update custom ticket wiki page check-in: 0c305be6 user: ron tags: trunk
2010-03-22
14:17
If the graph height is greater than 32767, omit the <canvas> object. Also, do not appendChild() the graphics <div> objects until after they have been set to "abolute" positioning, to work around a FF performance issue. Ticket [13536c292b60] check-in: 504dc92c user: drh tags: trunk
13:41
Do not use <canvas> when the height of the graph is greater than 32767. Ticket [13536c292b60]. check-in: 81751fa5 user: drh tags: trunk
Changes
Hide Diffs Unified Diffs Ignore Whitespace Patch

Changes to src/timeline.c.

405
406
407
408
409
410
411
412
413
414
415
416
417
418
419

420
421
422
423
424
425
426
...
510
511
512
513
514
515
516

517
518
519
520



521
522
523
524
525
526
527
528
529
    @ var realCanvas = null;
    @ function drawBox(color,x0,y0,x1,y1){
    @   var n = document.createElement("div");
    @   if( x0>x1 ){ var t=x0; x0=x1; x1=t; }
    @   if( y0>y1 ){ var t=y0; y0=y1; y1=t; }
    @   var w = x1-x0+1;
    @   var h = y1-y0+1;
    @   canvasDiv.appendChild(n);
    @   n.style.position = "absolute";
    @   n.style.overflow = "hidden";
    @   n.style.left = x0+"px";
    @   n.style.top = y0+"px";
    @   n.style.width = w+"px";
    @   n.style.height = h+"px";
    @   n.style.backgroundColor = color;

    @ }
    @ function absoluteY(id){
    @   var obj = document.getElementById(id);
    @   if( !obj ) return;
    @   var top = 0;
    @   if( obj.offsetParent ){
    @     do{
................................................................................
    @   var left = absoluteX(rowinfo[0].id) - absoluteX("canvas") + 15;
    @   var width = nrail*20;
    @   for(var i in rowinfo){
    @     rowinfo[i].y = absoluteY(rowinfo[i].id) + 10 - canvasY;
    @     rowinfo[i].x = left + rowinfo[i].r*20;
    @   }
    @   var btm = rowinfo[rowinfo.length-1].y + 20;

    @   canvasDiv.innerHTML = '<canvas id="timeline-canvas" '+
    @      'style="position:absolute;left:'+(left-5)+'px;"' +
    @      ' width="'+width+'" height="'+btm+'"></canvas>';
    @   realCanvas = document.getElementById('timeline-canvas');



    @   var context;
    @   if( realCanvas && realCanvas.getContext && btm<32768
    @        && (context = realCanvas.getContext('2d'))) {
    @     drawBox = function(color,x0,y0,x1,y1) {
    @       if( y0>32767 || y1>32767 ) return;
    @       var colors = {
    @          'white':'rgba(255,255,255,1)',
    @          'black':'rgba(0,0,0,1)'
    @       };







<







>







 







>
|
|
|
|
>
>
>

|







405
406
407
408
409
410
411

412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
...
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
    @ var realCanvas = null;
    @ function drawBox(color,x0,y0,x1,y1){
    @   var n = document.createElement("div");
    @   if( x0>x1 ){ var t=x0; x0=x1; x1=t; }
    @   if( y0>y1 ){ var t=y0; y0=y1; y1=t; }
    @   var w = x1-x0+1;
    @   var h = y1-y0+1;

    @   n.style.position = "absolute";
    @   n.style.overflow = "hidden";
    @   n.style.left = x0+"px";
    @   n.style.top = y0+"px";
    @   n.style.width = w+"px";
    @   n.style.height = h+"px";
    @   n.style.backgroundColor = color;
    @   canvasDiv.appendChild(n);
    @ }
    @ function absoluteY(id){
    @   var obj = document.getElementById(id);
    @   if( !obj ) return;
    @   var top = 0;
    @   if( obj.offsetParent ){
    @     do{
................................................................................
    @   var left = absoluteX(rowinfo[0].id) - absoluteX("canvas") + 15;
    @   var width = nrail*20;
    @   for(var i in rowinfo){
    @     rowinfo[i].y = absoluteY(rowinfo[i].id) + 10 - canvasY;
    @     rowinfo[i].x = left + rowinfo[i].r*20;
    @   }
    @   var btm = rowinfo[rowinfo.length-1].y + 20;
    @   if( btm<32768 ){
    @     canvasDiv.innerHTML = '<canvas id="timeline-canvas" '+
    @        'style="position:absolute;left:'+(left-5)+'px;"' +
    @        ' width="'+width+'" height="'+btm+'"></canvas>';
    @     realCanvas = document.getElementById('timeline-canvas');
    @   }else{
    @     realCanvas = 0;
    @   }
    @   var context;
    @   if( realCanvas && realCanvas.getContext
    @        && (context = realCanvas.getContext('2d'))) {
    @     drawBox = function(color,x0,y0,x1,y1) {
    @       if( y0>32767 || y1>32767 ) return;
    @       var colors = {
    @          'white':'rgba(255,255,255,1)',
    @          'black':'rgba(0,0,0,1)'
    @       };