Fossil SCM

Remove approx. 150 lines of JS related to diff layout and syncronous scrolling.

stephan 2024-07-31 11:06 sbs-diff-css
Commit 61fd1e841fda0b869ceb271fe149d2a7ef3e448c39af0879da23afb995499235
--- src/fossil.diff.js
+++ src/fossil.diff.js
@@ -623,157 +623,5 @@
623623
});
624624
return F;
625625
};
626626
Diff.setupDiffContextLoad();
627627
});
628
-
629
-/* Refinements to the display of unified and side-by-side diffs.
630
-**
631
-** In all cases, the table columns tagged with "difftxt" are expanded,
632
-** where possible, to fill the width of the screen.
633
-**
634
-** For a side-by-side diff, if either column is two wide to fit on the
635
-** display, scrollbars are added. The scrollbars are linked, so that
636
-** both sides scroll together. Left and right arrows also scroll.
637
-*/
638
-window.fossil.onPageLoad(function(){
639
- const SCROLL_LEN = 25;
640
- const F = window.fossil, D = F.dom, Diff = F.diff;
641
- var lastWidth;
642
- Diff.checkTableWidth = function f(force){
643
- if(1){
644
- return this;
645
- /**
646
- What follows is largely obsolete but we will want parts of it
647
- if we decide to retain the synchronous-scroll feature of
648
- SBS diffs (which we otherwise lose in the CSS-based reimplementation).
649
- */
650
- }
651
- if(undefined === f.contentNode){
652
- f.contentNode = document.querySelector('div.content');
653
- }
654
- force = true;
655
- const parentCS = window.getComputedStyle(f.contentNode);
656
- const parentWidth = (
657
- //document.body.clientWidth;
658
- //parentCS.width;
659
- f.contentNode.clientWidth
660
- - parseFloat(parentCS.marginLeft) - parseFloat(parentCS.marginRight)
661
- );
662
- if( !force && parentWidth===lastWidth ) return this;
663
- lastWidth = parentWidth;
664
- let w = lastWidth*0.5 - 100;
665
- //console.debug( "w = ",w,", lastWidth =",lastWidth," body = ",document.body.clientWidth);
666
- if(force || !f.colsL){
667
- f.colsL = document.querySelectorAll('td.difftxtl pre');
668
- }
669
- f.colsL.forEach(function(e){
670
- e.style.width = w + "px";
671
- e.style.maxWidth = w + "px";
672
- });
673
- if(force || !f.colsR){
674
- f.colsR = document.querySelectorAll('td.difftxtr pre');
675
- }
676
- f.colsR.forEach(function(e){
677
- e.style.width = w + "px";
678
- e.style.maxWidth = w + "px";
679
- });
680
- if(force || !f.colsU){
681
- f.colsU = document.querySelectorAll('td.difftxtu pre');
682
- }
683
- f.colsU.forEach(function(e){
684
- w = lastWidth - 3; // Outer border
685
- var k = e.parentElement/*TD*/;
686
- while(k = k.previousElementSibling/*TD*/) w -= k.scrollWidth;
687
- e.style.width = w + "px";
688
- e.style.maxWidth = w + "px";
689
- });
690
- if(0){ // seems to be unnecessary
691
- if(!f.allDiffs){
692
- f.allDiffs = document.querySelectorAll('table.diff');
693
- }
694
- w = lastWidth;
695
- f.allDiffs.forEach(function f(e){
696
- if(0 && !f.$){
697
- f.$ = e.getClientRects()[0];
698
- console.debug("diff table w =",w," f.$x",f.$);
699
- w - 2*f.$.x /* left margin (assume right==left, for simplicity) */;
700
- }
701
- e.style.maxWidth = w + "px";
702
- });
703
- //console.debug("checkTableWidth(",force,") lastWidth =",lastWidth);
704
- }
705
- return this;
706
- };
707
-
708
- const scrollLeft = function(event){
709
- //console.debug("scrollLeft",this,event);
710
- const table = this.parentElement/*TD*/.parentElement/*TR*/.
711
- parentElement/*TBODY*/.parentElement/*TABLE*/;
712
- table.$txtPres.forEach((e)=>(e===this) ? 1 : (e.scrollLeft = this.scrollLeft));
713
- return false;
714
- };
715
- Diff.initTableDiff = function f(diff, unifiedDiffs){
716
- if(!diff){
717
- let i, diffs;
718
- diffs = document.querySelectorAll('table.splitdiff');
719
- for(i=0; i<diffs.length; ++i){
720
- f.call(this, diffs[i], false);
721
- }
722
- diffs = document.querySelectorAll('table.udiff');
723
- for(i=0; i<diffs.length; ++i){
724
- f.call(this, diffs[i], true);
725
- }
726
- return this;
727
- }
728
- diff.$txtCols = diff.querySelectorAll('td.difftxt');
729
- diff.$txtPres = diff.querySelectorAll('td.difftxt pre');
730
- var width = 0;
731
- diff.$txtPres.forEach(function(e){
732
- if(width < e.scrollWidth) width = e.scrollWidth;
733
- });
734
- //console.debug("diff.$txtPres =",diff.$txtPres);
735
- diff.$txtCols.forEach((e)=>e.style.width = width + 'px');
736
- diff.$txtPres.forEach(function(e){
737
- e.style.maxWidth = width + 'px';
738
- e.style.width = width + 'px';
739
- if(!unifiedDiffs && !e.classList.contains('scroller')){
740
- D.addClass(e, 'scroller');
741
- e.addEventListener('scroll', scrollLeft, false);
742
- }
743
- });
744
- if(!unifiedDiffs){
745
- diff.tabIndex = 0;
746
- if(!diff.classList.contains('scroller')){
747
- D.addClass(diff, 'scroller');
748
- diff.addEventListener('keydown', function(e){
749
- e = e || event;
750
- const len = {37: -SCROLL_LEN, 39: SCROLL_LEN}[e.keyCode];
751
- if( !len ) return;
752
- this.$txtPres[0].scrollLeft += len;
753
- /* ^^^ bug: if there is a 2nd column and it has a scrollbar
754
- but txtPres[0] does not, no scrolling happens here. We need
755
- to find the widest of txtPres and scroll that one. Example:
756
- Checkin a7fbefee38a1c522 file diff.c */
757
- return false;
758
- }, false);
759
- }
760
- }
761
- return this;
762
- }
763
- if(0){
764
- window.fossil.page.tweakSbsDiffs = function(){
765
- document.querySelectorAll('table.splitdiff').forEach((e)=>Diff.initTableDiff(e));
766
- Diff.checkTableWidth();
767
- };
768
- Diff.initTableDiff().checkTableWidth();
769
- window.addEventListener('resize', F.debounce(()=>Diff.checkTableWidth()));
770
- }else{
771
- /* tweakSbsDiffs() is called by /fileedit and /wikieedit when it
772
- runs an SBS diff. We _might_ want to retain this function to
773
- re-enable synchronized sbs diff scrolling. If we decided to not
774
- retain that feature with the CSS-based SBS diff, we can remove
775
- this block and the corresponding calls to this function in
776
- fossil.page.{wikiedit,fileedit}.js. */
777
- window.fossil.page.tweakSbsDiffs = function(){};
778
- }
779
-}, false);
780628
--- src/fossil.diff.js
+++ src/fossil.diff.js
@@ -623,157 +623,5 @@
623 });
624 return F;
625 };
626 Diff.setupDiffContextLoad();
627 });
628
629 /* Refinements to the display of unified and side-by-side diffs.
630 **
631 ** In all cases, the table columns tagged with "difftxt" are expanded,
632 ** where possible, to fill the width of the screen.
633 **
634 ** For a side-by-side diff, if either column is two wide to fit on the
635 ** display, scrollbars are added. The scrollbars are linked, so that
636 ** both sides scroll together. Left and right arrows also scroll.
637 */
638 window.fossil.onPageLoad(function(){
639 const SCROLL_LEN = 25;
640 const F = window.fossil, D = F.dom, Diff = F.diff;
641 var lastWidth;
642 Diff.checkTableWidth = function f(force){
643 if(1){
644 return this;
645 /**
646 What follows is largely obsolete but we will want parts of it
647 if we decide to retain the synchronous-scroll feature of
648 SBS diffs (which we otherwise lose in the CSS-based reimplementation).
649 */
650 }
651 if(undefined === f.contentNode){
652 f.contentNode = document.querySelector('div.content');
653 }
654 force = true;
655 const parentCS = window.getComputedStyle(f.contentNode);
656 const parentWidth = (
657 //document.body.clientWidth;
658 //parentCS.width;
659 f.contentNode.clientWidth
660 - parseFloat(parentCS.marginLeft) - parseFloat(parentCS.marginRight)
661 );
662 if( !force && parentWidth===lastWidth ) return this;
663 lastWidth = parentWidth;
664 let w = lastWidth*0.5 - 100;
665 //console.debug( "w = ",w,", lastWidth =",lastWidth," body = ",document.body.clientWidth);
666 if(force || !f.colsL){
667 f.colsL = document.querySelectorAll('td.difftxtl pre');
668 }
669 f.colsL.forEach(function(e){
670 e.style.width = w + "px";
671 e.style.maxWidth = w + "px";
672 });
673 if(force || !f.colsR){
674 f.colsR = document.querySelectorAll('td.difftxtr pre');
675 }
676 f.colsR.forEach(function(e){
677 e.style.width = w + "px";
678 e.style.maxWidth = w + "px";
679 });
680 if(force || !f.colsU){
681 f.colsU = document.querySelectorAll('td.difftxtu pre');
682 }
683 f.colsU.forEach(function(e){
684 w = lastWidth - 3; // Outer border
685 var k = e.parentElement/*TD*/;
686 while(k = k.previousElementSibling/*TD*/) w -= k.scrollWidth;
687 e.style.width = w + "px";
688 e.style.maxWidth = w + "px";
689 });
690 if(0){ // seems to be unnecessary
691 if(!f.allDiffs){
692 f.allDiffs = document.querySelectorAll('table.diff');
693 }
694 w = lastWidth;
695 f.allDiffs.forEach(function f(e){
696 if(0 && !f.$){
697 f.$ = e.getClientRects()[0];
698 console.debug("diff table w =",w," f.$x",f.$);
699 w - 2*f.$.x /* left margin (assume right==left, for simplicity) */;
700 }
701 e.style.maxWidth = w + "px";
702 });
703 //console.debug("checkTableWidth(",force,") lastWidth =",lastWidth);
704 }
705 return this;
706 };
707
708 const scrollLeft = function(event){
709 //console.debug("scrollLeft",this,event);
710 const table = this.parentElement/*TD*/.parentElement/*TR*/.
711 parentElement/*TBODY*/.parentElement/*TABLE*/;
712 table.$txtPres.forEach((e)=>(e===this) ? 1 : (e.scrollLeft = this.scrollLeft));
713 return false;
714 };
715 Diff.initTableDiff = function f(diff, unifiedDiffs){
716 if(!diff){
717 let i, diffs;
718 diffs = document.querySelectorAll('table.splitdiff');
719 for(i=0; i<diffs.length; ++i){
720 f.call(this, diffs[i], false);
721 }
722 diffs = document.querySelectorAll('table.udiff');
723 for(i=0; i<diffs.length; ++i){
724 f.call(this, diffs[i], true);
725 }
726 return this;
727 }
728 diff.$txtCols = diff.querySelectorAll('td.difftxt');
729 diff.$txtPres = diff.querySelectorAll('td.difftxt pre');
730 var width = 0;
731 diff.$txtPres.forEach(function(e){
732 if(width < e.scrollWidth) width = e.scrollWidth;
733 });
734 //console.debug("diff.$txtPres =",diff.$txtPres);
735 diff.$txtCols.forEach((e)=>e.style.width = width + 'px');
736 diff.$txtPres.forEach(function(e){
737 e.style.maxWidth = width + 'px';
738 e.style.width = width + 'px';
739 if(!unifiedDiffs && !e.classList.contains('scroller')){
740 D.addClass(e, 'scroller');
741 e.addEventListener('scroll', scrollLeft, false);
742 }
743 });
744 if(!unifiedDiffs){
745 diff.tabIndex = 0;
746 if(!diff.classList.contains('scroller')){
747 D.addClass(diff, 'scroller');
748 diff.addEventListener('keydown', function(e){
749 e = e || event;
750 const len = {37: -SCROLL_LEN, 39: SCROLL_LEN}[e.keyCode];
751 if( !len ) return;
752 this.$txtPres[0].scrollLeft += len;
753 /* ^^^ bug: if there is a 2nd column and it has a scrollbar
754 but txtPres[0] does not, no scrolling happens here. We need
755 to find the widest of txtPres and scroll that one. Example:
756 Checkin a7fbefee38a1c522 file diff.c */
757 return false;
758 }, false);
759 }
760 }
761 return this;
762 }
763 if(0){
764 window.fossil.page.tweakSbsDiffs = function(){
765 document.querySelectorAll('table.splitdiff').forEach((e)=>Diff.initTableDiff(e));
766 Diff.checkTableWidth();
767 };
768 Diff.initTableDiff().checkTableWidth();
769 window.addEventListener('resize', F.debounce(()=>Diff.checkTableWidth()));
770 }else{
771 /* tweakSbsDiffs() is called by /fileedit and /wikieedit when it
772 runs an SBS diff. We _might_ want to retain this function to
773 re-enable synchronized sbs diff scrolling. If we decided to not
774 retain that feature with the CSS-based SBS diff, we can remove
775 this block and the corresponding calls to this function in
776 fossil.page.{wikiedit,fileedit}.js. */
777 window.fossil.page.tweakSbsDiffs = function(){};
778 }
779 }, false);
780
--- src/fossil.diff.js
+++ src/fossil.diff.js
@@ -623,157 +623,5 @@
623 });
624 return F;
625 };
626 Diff.setupDiffContextLoad();
627 });
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
628
--- src/fossil.page.fileedit.js
+++ src/fossil.page.fileedit.js
@@ -1245,11 +1245,10 @@
12451245
self.finfo.checkin,
12461246
"]</code> &rarr; Local Edits</div>",
12471247
c||'No changes.'
12481248
].join(''));
12491249
F.diff.setupDiffContextLoad();
1250
- if(sbs) P.tweakSbsDiffs();
12511250
F.message('Updated diff.');
12521251
self.tabs.switchToTab(self.e.tabs.diff);
12531252
}
12541253
});
12551254
return this;
12561255
--- src/fossil.page.fileedit.js
+++ src/fossil.page.fileedit.js
@@ -1245,11 +1245,10 @@
1245 self.finfo.checkin,
1246 "]</code> &rarr; Local Edits</div>",
1247 c||'No changes.'
1248 ].join(''));
1249 F.diff.setupDiffContextLoad();
1250 if(sbs) P.tweakSbsDiffs();
1251 F.message('Updated diff.');
1252 self.tabs.switchToTab(self.e.tabs.diff);
1253 }
1254 });
1255 return this;
1256
--- src/fossil.page.fileedit.js
+++ src/fossil.page.fileedit.js
@@ -1245,11 +1245,10 @@
1245 self.finfo.checkin,
1246 "]</code> &rarr; Local Edits</div>",
1247 c||'No changes.'
1248 ].join(''));
1249 F.diff.setupDiffContextLoad();
 
1250 F.message('Updated diff.');
1251 self.tabs.switchToTab(self.e.tabs.diff);
1252 }
1253 });
1254 return this;
1255
--- src/fossil.page.wikiedit.js
+++ src/fossil.page.wikiedit.js
@@ -1545,11 +1545,10 @@
15451545
self.winfo.name,
15461546
"]</code> &rarr; Local Edits</div>",
15471547
c||'No changes.'
15481548
].join(''));
15491549
F.diff.setupDiffContextLoad();
1550
- if(sbs) P.tweakSbsDiffs();
15511550
F.message('Updated diff.');
15521551
self.tabs.switchToTab(self.e.tabs.diff);
15531552
}
15541553
});
15551554
return this;
@@ -1654,7 +1653,6 @@
16541653
filename/checkin values), return it, else return undefined.
16551654
*/
16561655
P.getStashedWinfo = function(winfo){
16571656
return $stash.getWinfo(winfo);
16581657
};
1659
-
16601658
})(window.fossil);
16611659
--- src/fossil.page.wikiedit.js
+++ src/fossil.page.wikiedit.js
@@ -1545,11 +1545,10 @@
1545 self.winfo.name,
1546 "]</code> &rarr; Local Edits</div>",
1547 c||'No changes.'
1548 ].join(''));
1549 F.diff.setupDiffContextLoad();
1550 if(sbs) P.tweakSbsDiffs();
1551 F.message('Updated diff.');
1552 self.tabs.switchToTab(self.e.tabs.diff);
1553 }
1554 });
1555 return this;
@@ -1654,7 +1653,6 @@
1654 filename/checkin values), return it, else return undefined.
1655 */
1656 P.getStashedWinfo = function(winfo){
1657 return $stash.getWinfo(winfo);
1658 };
1659
1660 })(window.fossil);
1661
--- src/fossil.page.wikiedit.js
+++ src/fossil.page.wikiedit.js
@@ -1545,11 +1545,10 @@
1545 self.winfo.name,
1546 "]</code> &rarr; Local Edits</div>",
1547 c||'No changes.'
1548 ].join(''));
1549 F.diff.setupDiffContextLoad();
 
1550 F.message('Updated diff.');
1551 self.tabs.switchToTab(self.e.tabs.diff);
1552 }
1553 });
1554 return this;
@@ -1654,7 +1653,6 @@
1653 filename/checkin values), return it, else return undefined.
1654 */
1655 P.getStashedWinfo = function(winfo){
1656 return $stash.getWinfo(winfo);
1657 };
 
1658 })(window.fossil);
1659

Keyboard Shortcuts

Open search /
Next entry (timeline) j
Previous entry (timeline) k
Open focused entry Enter
Show this help ?
Toggle theme Top nav button