Fossil SCM

Enhance the sbsdiff.js script to do the diff-column width expansion and constraction as the browser width chagnes. Add the complete sbsdiff.js script text to the end of --webpage diff output, but only when the -y option is also used.

drh 2021-08-25 18:26 trunk
Commit 5380333f6382df4e4abb3242121ab427cebcd0153af79476f39accc1171a3f74
Parent 571dd613ac47cf7…
2 files changed +8 -24 +24 -2
~ src/diffcmd.c ~ src/sbsdiff.js
M src/diffcmd.c
+8 -24
--- src/diffcmd.c
+++ src/diffcmd.c
@@ -221,34 +221,10 @@
221221
 @ </style>
222222
 @ </head>
223223
 @ <body>
224224
 ;
225225
 const char zWebpageEnd[] =
226
-@ <script>
227
-@ (function(){
228
-@ var lastWidth = 0;
229
-@ function checkWidth(){
230
-@ if( document.body.clientWidth!=lastWidth ){
231
-@ lastWidth = document.body.clientWidth;
232
-@ var w = lastWidth*0.5 - 100;
233
-@ var allCols = document.getElementsByClassName('difftxtcol');
234
-@ for(let i=0; i<allCols.length; i++){
235
-@ allCols[i].style.width = w + "px";
236
-@ allCols[i].style.maxWidth = w + "px";
237
-@ }
238
-@ var allDiffs = document.getElementsByClassName('sbsdiffcols');
239
-@ w = lastWidth;
240
-@ for(let i=0; i<allDiffs.length; i++){
241
-@ allDiffs[i].style.width = w + "px";
242
-@ allDiffs[i].style.maxWidth = w + "px";
243
-@ }
244
-@ }
245
-@ setTimeout(checkWidth, 100)
246
-@ }
247
-@ checkWidth();
248
-@ }());
249
-@ </script>
250226
 @ </body>
251227
 @ </html>
252228
 ;
253229
254230
 /*
@@ -267,10 +243,18 @@
267243
 }
268244
 }
269245
 }
270246
 void diff_footer(u64 diffFlags, Blob *pOut){
271247
 if( (diffFlags & DIFF_WEBPAGE)!=0 ){
248
+ if( diffFlags & DIFF_SIDEBYSIDE ){
249
+ const unsigned char *zJs = builtin_file("sbsdiff.js", 0);
250
+ if( pOut ){
251
+ blob_appendf(pOut, "<script>\n%s</script>\n", zJs);
252
+ }else{
253
+ fossil_print("<script>\n%s</script>\n", zJs);
254
+ }
255
+ }
272256
 if( pOut ){
273257
 blob_append(pOut, zWebpageEnd, -1);
274258
 }else{
275259
 fossil_print("%s", zWebpageEnd);
276260
 }
277261
--- src/diffcmd.c
+++ src/diffcmd.c
@@ -221,34 +221,10 @@
221 @ </style>
222 @ </head>
223 @ <body>
224 ;
225 const char zWebpageEnd[] =
226 @ <script>
227 @ (function(){
228 @ var lastWidth = 0;
229 @ function checkWidth(){
230 @ if( document.body.clientWidth!=lastWidth ){
231 @ lastWidth = document.body.clientWidth;
232 @ var w = lastWidth*0.5 - 100;
233 @ var allCols = document.getElementsByClassName('difftxtcol');
234 @ for(let i=0; i<allCols.length; i++){
235 @ allCols[i].style.width = w + "px";
236 @ allCols[i].style.maxWidth = w + "px";
237 @ }
238 @ var allDiffs = document.getElementsByClassName('sbsdiffcols');
239 @ w = lastWidth;
240 @ for(let i=0; i<allDiffs.length; i++){
241 @ allDiffs[i].style.width = w + "px";
242 @ allDiffs[i].style.maxWidth = w + "px";
243 @ }
244 @ }
245 @ setTimeout(checkWidth, 100)
246 @ }
247 @ checkWidth();
248 @ }());
249 @ </script>
250 @ </body>
251 @ </html>
252 ;
253
254 /*
@@ -267,10 +243,18 @@
267 }
268 }
269 }
270 void diff_footer(u64 diffFlags, Blob *pOut){
271 if( (diffFlags & DIFF_WEBPAGE)!=0 ){
 
 
 
 
 
 
 
 
272 if( pOut ){
273 blob_append(pOut, zWebpageEnd, -1);
274 }else{
275 fossil_print("%s", zWebpageEnd);
276 }
277
--- src/diffcmd.c
+++ src/diffcmd.c
@@ -221,34 +221,10 @@
221 @ </style>
222 @ </head>
223 @ <body>
224 ;
225 const char zWebpageEnd[] =
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
226 @ </body>
227 @ </html>
228 ;
229
230 /*
@@ -267,10 +243,18 @@
243 }
244 }
245 }
246 void diff_footer(u64 diffFlags, Blob *pOut){
247 if( (diffFlags & DIFF_WEBPAGE)!=0 ){
248 if( diffFlags & DIFF_SIDEBYSIDE ){
249 const unsigned char *zJs = builtin_file("sbsdiff.js", 0);
250 if( pOut ){
251 blob_appendf(pOut, "<script>\n%s</script>\n", zJs);
252 }else{
253 fossil_print("<script>\n%s</script>\n", zJs);
254 }
255 }
256 if( pOut ){
257 blob_append(pOut, zWebpageEnd, -1);
258 }else{
259 fossil_print("%s", zWebpageEnd);
260 }
261
M src/sbsdiff.js
+24 -2
--- src/sbsdiff.js
+++ src/sbsdiff.js
@@ -1,8 +1,8 @@
11
 /* The javascript in this file was added by Joel Bruick on 2013-07-06,
2
-** originally as in-line javascript. It does some kind of setup for
3
-** side-by-side diff display, but I'm not really sure what.
2
+** originally as in-line javascript. It keeps the horizontal scrollbars
3
+** in sync on side-by-side diffs.
44
 */
55
 (function(){
66
 var SCROLL_LEN = 25;
77
 function initSbsDiff(diff){
88
 var txtCols = diff.querySelectorAll('.difftxtcol');
@@ -36,6 +36,28 @@
3636
 fossil.pages only work in HTML5-compliant browsers. */
3737
 fossil.page.tweakSbsDiffs = function(){
3838
 document.querySelectorAll('.sbsdiffcols').forEach(initSbsDiff);
3939
 };
4040
 }
41
+ /* This part added by DRH on 2021-08-25 to adjust the width of the
42
+ ** diff columns so that they fill the screen. */
43
+ var lastWidth = 0;
44
+ function checkWidth(){
45
+ if( document.body.clientWidth!=lastWidth ){
46
+ lastWidth = document.body.clientWidth;
47
+ var w = lastWidth*0.5 - 100;
48
+ var allCols = document.getElementsByClassName('difftxtcol');
49
+ for(let i=0; i<allCols.length; i++){
50
+ allCols[i].style.width = w + "px";
51
+ allCols[i].style.maxWidth = w + "px";
52
+ }
53
+ var allDiffs = document.getElementsByClassName('sbsdiffcols');
54
+ w = lastWidth;
55
+ for(let i=0; i<allDiffs.length; i++){
56
+ allDiffs[i].style.width = w + "px";
57
+ allDiffs[i].style.maxWidth = w + "px";
58
+ }
59
+ }
60
+ setTimeout(checkWidth, 100)
61
+ }
62
+ checkWidth();
4163
 })();
4264
--- src/sbsdiff.js
+++ src/sbsdiff.js
@@ -1,8 +1,8 @@
1 /* The javascript in this file was added by Joel Bruick on 2013-07-06,
2 ** originally as in-line javascript. It does some kind of setup for
3 ** side-by-side diff display, but I'm not really sure what.
4 */
5 (function(){
6 var SCROLL_LEN = 25;
7 function initSbsDiff(diff){
8 var txtCols = diff.querySelectorAll('.difftxtcol');
@@ -36,6 +36,28 @@
36 fossil.pages only work in HTML5-compliant browsers. */
37 fossil.page.tweakSbsDiffs = function(){
38 document.querySelectorAll('.sbsdiffcols').forEach(initSbsDiff);
39 };
40 }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
41 })();
42
--- src/sbsdiff.js
+++ src/sbsdiff.js
@@ -1,8 +1,8 @@
1 /* The javascript in this file was added by Joel Bruick on 2013-07-06,
2 ** originally as in-line javascript. It keeps the horizontal scrollbars
3 ** in sync on side-by-side diffs.
4 */
5 (function(){
6 var SCROLL_LEN = 25;
7 function initSbsDiff(diff){
8 var txtCols = diff.querySelectorAll('.difftxtcol');
@@ -36,6 +36,28 @@
36 fossil.pages only work in HTML5-compliant browsers. */
37 fossil.page.tweakSbsDiffs = function(){
38 document.querySelectorAll('.sbsdiffcols').forEach(initSbsDiff);
39 };
40 }
41 /* This part added by DRH on 2021-08-25 to adjust the width of the
42 ** diff columns so that they fill the screen. */
43 var lastWidth = 0;
44 function checkWidth(){
45 if( document.body.clientWidth!=lastWidth ){
46 lastWidth = document.body.clientWidth;
47 var w = lastWidth*0.5 - 100;
48 var allCols = document.getElementsByClassName('difftxtcol');
49 for(let i=0; i<allCols.length; i++){
50 allCols[i].style.width = w + "px";
51 allCols[i].style.maxWidth = w + "px";
52 }
53 var allDiffs = document.getElementsByClassName('sbsdiffcols');
54 w = lastWidth;
55 for(let i=0; i<allDiffs.length; i++){
56 allDiffs[i].style.width = w + "px";
57 allDiffs[i].style.maxWidth = w + "px";
58 }
59 }
60 setTimeout(checkWidth, 100)
61 }
62 checkWidth();
63 })();
64

Keyboard Shortcuts

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