Fossil SCM

Record a comment on the findings discovered during repair of the accordion panel JS script.

florian 2022-08-10 06:01 accordion-fix
Commit 2fc93df48f9ce81ca10a65a04abe9144043c971d34f02495334d5bab277adc0d
1 file changed +26 -4
+26 -4
--- src/accordion.js
+++ src/accordion.js
@@ -1,9 +1,31 @@
1
-/* Attach appropriate javascript to each ".accordion" button so that
2
-** it expands and contracts when clicked.
3
-** The uncompressed source code for the SVG icons can be found on the
4
-** wiki page "branch/accordion-experiments" in the Fossil repository.
1
+/*
2
+** Attach appropriate javascript to each ".accordion" button so that it expands
3
+** and contracts when clicked.
4
+**
5
+** The uncompressed source code for the SVG icons can be found on the wiki page
6
+** "branch/accordion-experiments" in the Fossil repository.
7
+**
8
+** Implementation notes:
9
+**
10
+** The `maxHeight' CSS property is quite restrictive for vertical resizing of
11
+** elements, especially for dynamic-content areas like the diff panels. That's
12
+** why `maxHeight' is set only during animation, to prevent truncated elements.
13
+** (The diff panels may get truncated right after page loading, and other
14
+** elements may get truncated when resizing the browser window to a smaller
15
+** width, causing vertical growth.)
16
+**
17
+** Another problem is that `scrollHeight' used to calculate the expanded height
18
+** while still in the contracted state may return values with small errors on
19
+** some browsers, especially for large elements, presumably due to omitting the
20
+** space required by the vertical scrollbar that may become necessary, causing
21
+** additional horizontal shrinking and consequently more vertical growth than
22
+** calculated. That's why setting `maxHeight' to `scrollHeight' is considered
23
+** "good enough" only during animation, but cleared afterwards.
24
+**
25
+** https://fossil-scm.org/forum/forumpost/66d7075f40
26
+** https://fossil-scm.org/home/timeline?r=accordion-fix
527
*/
628
var acc_svgdata = ["data:image/svg+xml,"+
729
"%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E"+
830
"%3Cpath style='fill:black;opacity:0' d='M16,16H0V0h16v16z'/%3E"+
931
"%3Cpath style='fill:rgb(240,240,240)' d='M14,14H2V2h12v12z'/%3E"+
1032
--- src/accordion.js
+++ src/accordion.js
@@ -1,9 +1,31 @@
1 /* Attach appropriate javascript to each ".accordion" button so that
2 ** it expands and contracts when clicked.
3 ** The uncompressed source code for the SVG icons can be found on the
4 ** wiki page "branch/accordion-experiments" in the Fossil repository.
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
5 */
6 var acc_svgdata = ["data:image/svg+xml,"+
7 "%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E"+
8 "%3Cpath style='fill:black;opacity:0' d='M16,16H0V0h16v16z'/%3E"+
9 "%3Cpath style='fill:rgb(240,240,240)' d='M14,14H2V2h12v12z'/%3E"+
10
--- src/accordion.js
+++ src/accordion.js
@@ -1,9 +1,31 @@
1 /*
2 ** Attach appropriate javascript to each ".accordion" button so that it expands
3 ** and contracts when clicked.
4 **
5 ** The uncompressed source code for the SVG icons can be found on the wiki page
6 ** "branch/accordion-experiments" in the Fossil repository.
7 **
8 ** Implementation notes:
9 **
10 ** The `maxHeight' CSS property is quite restrictive for vertical resizing of
11 ** elements, especially for dynamic-content areas like the diff panels. That's
12 ** why `maxHeight' is set only during animation, to prevent truncated elements.
13 ** (The diff panels may get truncated right after page loading, and other
14 ** elements may get truncated when resizing the browser window to a smaller
15 ** width, causing vertical growth.)
16 **
17 ** Another problem is that `scrollHeight' used to calculate the expanded height
18 ** while still in the contracted state may return values with small errors on
19 ** some browsers, especially for large elements, presumably due to omitting the
20 ** space required by the vertical scrollbar that may become necessary, causing
21 ** additional horizontal shrinking and consequently more vertical growth than
22 ** calculated. That's why setting `maxHeight' to `scrollHeight' is considered
23 ** "good enough" only during animation, but cleared afterwards.
24 **
25 ** https://fossil-scm.org/forum/forumpost/66d7075f40
26 ** https://fossil-scm.org/home/timeline?r=accordion-fix
27 */
28 var acc_svgdata = ["data:image/svg+xml,"+
29 "%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E"+
30 "%3Cpath style='fill:black;opacity:0' d='M16,16H0V0h16v16z'/%3E"+
31 "%3Cpath style='fill:rgb(240,240,240)' d='M14,14H2V2h12v12z'/%3E"+
32

Keyboard Shortcuts

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