Fossil SCM

Cosmetic tweaks: align the new checkboxes consistently and toggle a class on the Timeline link when any checkboxes are selected, to give the user some indication that the checkboxes are doing something.

stephan 2021-04-18 21:08 brlist-timeline
Commit 73ebf81b9331ee89690a8fff72ac48b1892b09d12a0e5d68048106e7fa3864ee
Parent 6f5a5643ae3b5d1…
3 files changed +2 -2 +10 +19 -6
~ src/branch.c ~ src/default.css ~ src/fossil.page.brlist.js
M src/branch.c
+2 -2
--- src/branch.c
+++ src/branch.c
@@ -505,12 +505,12 @@
505505
 if( zBgClr && zBgClr[0] && show_colors ){
506506
 @ <tr style="background-color:%s(zBgClr)">
507507
 }else{
508508
 @ <tr>
509509
 }
510
- @ <td>%z(href("%R/timeline?r=%T",zBranch))%h(zBranch)</a>
511
- @ <input type="checkbox" disabled="disabled"/></td>
510
+ @ <td>%z(href("%R/timeline?r=%T",zBranch))%h(zBranch)</a><input
511
+ @ type="checkbox" disabled="disabled"/></td>
512512
 @ <td data-sortkey="%016llx(iMtime)">%s(zAge)</td>
513513
 @ <td>%d(nCkin)</td>
514514
 fossil_free(zAge);
515515
 @ <td>%s(isClosed?"closed":"")</td>
516516
 if( zMergeTo ){
517517
--- src/branch.c
+++ src/branch.c
@@ -505,12 +505,12 @@
505 if( zBgClr && zBgClr[0] && show_colors ){
506 @ <tr style="background-color:%s(zBgClr)">
507 }else{
508 @ <tr>
509 }
510 @ <td>%z(href("%R/timeline?r=%T",zBranch))%h(zBranch)</a>
511 @ <input type="checkbox" disabled="disabled"/></td>
512 @ <td data-sortkey="%016llx(iMtime)">%s(zAge)</td>
513 @ <td>%d(nCkin)</td>
514 fossil_free(zAge);
515 @ <td>%s(isClosed?"closed":"")</td>
516 if( zMergeTo ){
517
--- src/branch.c
+++ src/branch.c
@@ -505,12 +505,12 @@
505 if( zBgClr && zBgClr[0] && show_colors ){
506 @ <tr style="background-color:%s(zBgClr)">
507 }else{
508 @ <tr>
509 }
510 @ <td>%z(href("%R/timeline?r=%T",zBranch))%h(zBranch)</a><input
511 @ type="checkbox" disabled="disabled"/></td>
512 @ <td data-sortkey="%016llx(iMtime)">%s(zAge)</td>
513 @ <td>%d(nCkin)</td>
514 fossil_free(zAge);
515 @ <td>%s(isClosed?"closed":"")</td>
516 if( zMergeTo ){
517
M src/default.css
+10
--- src/default.css
+++ src/default.css
@@ -1772,10 +1772,20 @@
17721772
 }
17731773
17741774
 input[type="checkbox"].diff-toggle {
17751775
 float: right;
17761776
 }
1777
+
1778
+body.branch .brlist > table > tbody > tr > td:nth-child(1) {
1779
+ display: flex;
1780
+ flex-direction: row;
1781
+ justify-content: space-between;
1782
+}
1783
+body.branch a.label.timeline-link.selected {
1784
+ font-weight: bold;
1785
+}
1786
+
17771787
 /* Objects in the "desktoponly" class are invisible on mobile */
17781788
 @media screen and (max-width: 600px) {
17791789
 .desktoponly {
17801790
 display: none;
17811791
 }
17821792
--- src/default.css
+++ src/default.css
@@ -1772,10 +1772,20 @@
1772 }
1773
1774 input[type="checkbox"].diff-toggle {
1775 float: right;
1776 }
 
 
 
 
 
 
 
 
 
 
1777 /* Objects in the "desktoponly" class are invisible on mobile */
1778 @media screen and (max-width: 600px) {
1779 .desktoponly {
1780 display: none;
1781 }
1782
--- src/default.css
+++ src/default.css
@@ -1772,10 +1772,20 @@
1772 }
1773
1774 input[type="checkbox"].diff-toggle {
1775 float: right;
1776 }
1777
1778 body.branch .brlist > table > tbody > tr > td:nth-child(1) {
1779 display: flex;
1780 flex-direction: row;
1781 justify-content: space-between;
1782 }
1783 body.branch a.label.timeline-link.selected {
1784 font-weight: bold;
1785 }
1786
1787 /* Objects in the "desktoponly" class are invisible on mobile */
1788 @media screen and (max-width: 600px) {
1789 .desktoponly {
1790 display: none;
1791 }
1792
M src/fossil.page.brlist.js
+19 -6
--- src/fossil.page.brlist.js
+++ src/fossil.page.brlist.js
@@ -4,30 +4,43 @@
44
 window.addEventListener( 'load', function() {
55
66
 var anchor = document.querySelector("div.submenu > a.label" );
77
 if( !anchor || anchor.innerText != "Timeline" ) return;
88
 var prefix = anchor.href.toString() + "?ms=regexp&rel&t=";
9
-
9
+anchor.classList.add('timeline-link');
10
+const selectedCheckboxes = []/*currently-selected checkboxes*/;
1011
 var onChange = function( event ){
11
- var cbx = event.target;
12
- var tag = cbx.parentElement.children[0].innerText;
12
+ const cbx = event.target;
13
+ const tag = cbx.parentElement.children[0].innerText;
1314
 var re = anchor.href.substr(prefix.length);
1415
 if( cbx.checked ){
1516
 if( re != "" ){
1617
 re += "|";
1718
 }
1819
 re += tag;
19
- }else if( re == tag ){
20
- re = ""
21
- }else {
20
+ selectedCheckboxes.push(cbx);
21
+ anchor.classList.add('selected');
22
+ }else{
23
+ const ndx = selectedCheckboxes.indexOf(cbx);
24
+ if(ndx>=0){
25
+ selectedCheckboxes.splice(ndx,1);
26
+ if(!selectedCheckboxes.length){
27
+ anchor.classList.remove('selected');
28
+ }
29
+ }
30
+ if( re == tag ){
31
+ re = "";
32
+ removeSelected(cbx);
33
+ }else {
2234
 var a = re.split("|");
2335
 var i = a.length;
2436
 while( --i >= 0 ){
2537
 if( a[i] == tag )
2638
 a.splice(i,1);
2739
 }
2840
 re = a.join("|");
41
+ }
2942
 }
3043
 anchor.href = prefix + re;
3144
 }
3245
3346
 var selected = [];
3447
--- src/fossil.page.brlist.js
+++ src/fossil.page.brlist.js
@@ -4,30 +4,43 @@
4 window.addEventListener( 'load', function() {
5
6 var anchor = document.querySelector("div.submenu > a.label" );
7 if( !anchor || anchor.innerText != "Timeline" ) return;
8 var prefix = anchor.href.toString() + "?ms=regexp&rel&t=";
9
 
10 var onChange = function( event ){
11 var cbx = event.target;
12 var tag = cbx.parentElement.children[0].innerText;
13 var re = anchor.href.substr(prefix.length);
14 if( cbx.checked ){
15 if( re != "" ){
16 re += "|";
17 }
18 re += tag;
19 }else if( re == tag ){
20 re = ""
21 }else {
 
 
 
 
 
 
 
 
 
 
 
22 var a = re.split("|");
23 var i = a.length;
24 while( --i >= 0 ){
25 if( a[i] == tag )
26 a.splice(i,1);
27 }
28 re = a.join("|");
 
29 }
30 anchor.href = prefix + re;
31 }
32
33 var selected = [];
34
--- src/fossil.page.brlist.js
+++ src/fossil.page.brlist.js
@@ -4,30 +4,43 @@
4 window.addEventListener( 'load', function() {
5
6 var anchor = document.querySelector("div.submenu > a.label" );
7 if( !anchor || anchor.innerText != "Timeline" ) return;
8 var prefix = anchor.href.toString() + "?ms=regexp&rel&t=";
9 anchor.classList.add('timeline-link');
10 const selectedCheckboxes = []/*currently-selected checkboxes*/;
11 var onChange = function( event ){
12 const cbx = event.target;
13 const tag = cbx.parentElement.children[0].innerText;
14 var re = anchor.href.substr(prefix.length);
15 if( cbx.checked ){
16 if( re != "" ){
17 re += "|";
18 }
19 re += tag;
20 selectedCheckboxes.push(cbx);
21 anchor.classList.add('selected');
22 }else{
23 const ndx = selectedCheckboxes.indexOf(cbx);
24 if(ndx>=0){
25 selectedCheckboxes.splice(ndx,1);
26 if(!selectedCheckboxes.length){
27 anchor.classList.remove('selected');
28 }
29 }
30 if( re == tag ){
31 re = "";
32 removeSelected(cbx);
33 }else {
34 var a = re.split("|");
35 var i = a.length;
36 while( --i >= 0 ){
37 if( a[i] == tag )
38 a.splice(i,1);
39 }
40 re = a.join("|");
41 }
42 }
43 anchor.href = prefix + re;
44 }
45
46 var selected = [];
47

Keyboard Shortcuts

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