Fossil

Check-in [e1796f2df2]
Login

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

Overview
Comment:Shortcut "." (period) to set focus to the entry closest to the center of the viewport. (The keys need to be reassigned later, since non-letter keys don't produce the same characters with or without SHIFT pressed on all keyboard layouts.) Thanks @rouilj for the suggestion and the hint!
Downloads: Tarball | ZIP archive
Timelines: family | ancestors | descendants | both | timeline-keyboard-navigation
Files: files | file ages | folders
SHA3-256: e1796f2df2e55e1357d9b67a6028b1afa89fcba46d90cbcafbeea43601c61501
User & Date: florian 2022-08-11 05:57:00.000
Context
2022-08-11
06:12
Swap semantics of the "primary" and "secondary" highlighted entries to improve selection of the default focused entry. The "secondary" corresponds to the "To:" entry on /vdiff pages and hance is the last focused entry, so should also be the default when returning to /timeline both by keyboard shortcut or the browser "backwards" command. Thanks @rouilj for spotting this! ... (check-in: 63c1be8c31 user: florian tags: timeline-keyboard-navigation)
05:57
Shortcut "." (period) to set focus to the entry closest to the center of the viewport. (The keys need to be reassigned later, since non-letter keys don't produce the same characters with or without SHIFT pressed on all keyboard layouts.) Thanks @rouilj for the suggestion and the hint! ... (check-in: e1796f2df2 user: florian tags: timeline-keyboard-navigation)
05:48
Refactorings to cookie handling. ... (check-in: cf38f5abb8 user: florian tags: timeline-keyboard-navigation)
Changes
Unified Diff Ignore Whitespace Patch
Changes to src/graph.js.
877
878
879
880
881
882
883































884
885
886
887
888
889
890
    }
    function focusNextId(id,dx){
      if( dx<-1 ) return focusFirstId(id);
      if( dx>+1 ) return focusLastId(id);
      var m = /^m(\d+)$/.exec(id);
      return m!==null ? 'm' + (parseInt(m[1]) + dx) : null;
    }































    function timelineGetDataBlock(i){
      var tb = document.getElementById('timeline-data-' + i);
      return tb ? JSON.parse(tb.textContent || tb.innerText) : null;
    }
    function timelineGetRowInfo(id){
      var ti;
      for(var i=0; ti=timelineGetDataBlock(i); i++){







>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>







877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
    }
    function focusNextId(id,dx){
      if( dx<-1 ) return focusFirstId(id);
      if( dx>+1 ) return focusLastId(id);
      var m = /^m(\d+)$/.exec(id);
      return m!==null ? 'm' + (parseInt(m[1]) + dx) : null;
    }
    // NOTE: This code relies on `getElementsByClassName()' returning elements
    // in document order; however, attempts to use binary searching (using the
    // signed distance to the vertical center) or 2-pass searching (to get the
    // 1000-block first) didn't yield any significant speedups -- probably the
    // calls to `getBoundingClientRect()' are cached because `initGraph()' has
    // already done so, or because they depend on their previous siblings, and
    // so `e(N).getBoundingClientRect()' ≈ `e(0..N).getBoundingClientRect()'?
    function focusViewportCenterId(){
      var
        fe = null,
        fd = 0,
        wt = 0,
        wb = wt + window.innerHeight,
        wc = wt + window.innerHeight/2,
        el = document.getElementsByClassName('timelineGraph');
      for( var i=0; i<el.length; i++ ){
        var
          rc = el[i].getBoundingClientRect(),
          et = rc.top,
          eb = rc.bottom;
        if( (et>=wt && et<=wb) || (eb>=wt && eb<=wb) ){
          var ed = Math.min(Math.abs(et-wc),Math.abs(eb-wc));
          if( !fe || ed<fd ){
            fe = el[i];
            fd = ed;
          }
          else break;
        }
      }
      return fe ? fe.querySelector('.tl-nodemark').id : null;
    }
    function timelineGetDataBlock(i){
      var tb = document.getElementById('timeline-data-' + i);
      return tb ? JSON.parse(tb.textContent || tb.innerText) : null;
    }
    function timelineGetRowInfo(id){
      var ti;
      for(var i=0; ti=timelineGetDataBlock(i); i++){
957
958
959
960
961
962
963

964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981

982
983
984
985
986
987
988
989
990
991
992









993
994
995
996
997
998
999
1000
      var
        mSHIFT = 1<<13,
        kFRST = mSHIFT | 78 /* SHIFT+N */,
        kNEXT = 78 /* N */,
        kPREV = 77 /* M */,
        kLAST = mSHIFT | 77 /* SHIFT+M */,
        kCYCL = 72 /* H */,

        kSCRL = mSHIFT | 72 /* H */,
        kTICK = 188 /* , */,
        kUNTK = mSHIFT | 188 /* , */,
        kCPYH = 66 /* B */,
        kCPYB = mSHIFT | 66 /* SHIFT+B */,
        kTMLN = 74 /* J */,
        kTMLB = mSHIFT | 74 /* J */,
        kVIEW = 75 /* K */,
        kDONE = 27 /* ESC */,
        mod = evt.altKey<<15 | evt.ctrlKey<<14 | evt.shiftKey<<13,
        key = ( evt.which || evt.keyCode ) | mod;
      var dx = 0;
      switch( key ){
        case kFRST: dx = -2; break;
        case kNEXT: dx = -1; break;
        case kPREV: dx = +1; break;
        case kLAST: dx = +2; break;
        case kCYCL:

        case kSCRL:
        case kTICK:
        case kUNTK:
        case kCPYH:
        case kCPYB:
        case kTMLN:
        case kTMLB:
        case kVIEW:
        case kDONE: break;
        default: return;
      }









      if( key==kSCRL ){
        var td = document.querySelector('.timelineFocused');
        if( td ) fossilScrollIntoView(td);
        return;
      }
      else if( key==kUNTK ){
        var tid = focusTickedId();
        if( tid ){







>


















>











>
>
>
>
>
>
>
>
>
|







988
989
990
991
992
993
994
995
996
997
998
999
1000
1001
1002
1003
1004
1005
1006
1007
1008
1009
1010
1011
1012
1013
1014
1015
1016
1017
1018
1019
1020
1021
1022
1023
1024
1025
1026
1027
1028
1029
1030
1031
1032
1033
1034
1035
1036
1037
1038
1039
1040
1041
1042
      var
        mSHIFT = 1<<13,
        kFRST = mSHIFT | 78 /* SHIFT+N */,
        kNEXT = 78 /* N */,
        kPREV = 77 /* M */,
        kLAST = mSHIFT | 77 /* SHIFT+M */,
        kCYCL = 72 /* H */,
        kCNTR = 190 /* . */,
        kSCRL = mSHIFT | 72 /* H */,
        kTICK = 188 /* , */,
        kUNTK = mSHIFT | 188 /* , */,
        kCPYH = 66 /* B */,
        kCPYB = mSHIFT | 66 /* SHIFT+B */,
        kTMLN = 74 /* J */,
        kTMLB = mSHIFT | 74 /* J */,
        kVIEW = 75 /* K */,
        kDONE = 27 /* ESC */,
        mod = evt.altKey<<15 | evt.ctrlKey<<14 | evt.shiftKey<<13,
        key = ( evt.which || evt.keyCode ) | mod;
      var dx = 0;
      switch( key ){
        case kFRST: dx = -2; break;
        case kNEXT: dx = -1; break;
        case kPREV: dx = +1; break;
        case kLAST: dx = +2; break;
        case kCYCL:
        case kCNTR:
        case kSCRL:
        case kTICK:
        case kUNTK:
        case kCPYH:
        case kCPYB:
        case kTMLN:
        case kTMLB:
        case kVIEW:
        case kDONE: break;
        default: return;
      }
      if( key==kCNTR ){
        var cid = focusViewportCenterId();
        if( cid ){
          focusCacheSet(cid);
          focusVisualize(cid,false);
          focusCookieInit();
        }
        return;
      }
      else if( key==kSCRL ){
        var td = document.querySelector('.timelineFocused');
        if( td ) fossilScrollIntoView(td);
        return;
      }
      else if( key==kUNTK ){
        var tid = focusTickedId();
        if( tid ){
Changes to src/timeline.c.
1633
1634
1635
1636
1637
1638
1639

1640
1641
1642
1643
1644
1645
1646
** Keyboard navigation shortcuts:
**
**    N     Focus first (newest) entry.
**    n     Focus next (newer) entry, or open next page.
**    m     Focus previous (older) entry, or open previous page.
**    M     Focus last (oldest) entry.
**    h     Move focus between selected, current (check-out) and ticked entries.

**    H     Scroll to focused entry.
**    ,     Tick/untick the node of the focused entry.
**    ;     Untick the nodes of all entries.
**    b     Copy the commit hash of the focused entry to clipboard.
**    B     Copy the branch name of the focused entry to clipboard.
**    j     View timeline of focused entry.
**    J     View timeline of focused entry filtered by branch.







>







1633
1634
1635
1636
1637
1638
1639
1640
1641
1642
1643
1644
1645
1646
1647
** Keyboard navigation shortcuts:
**
**    N     Focus first (newest) entry.
**    n     Focus next (newer) entry, or open next page.
**    m     Focus previous (older) entry, or open previous page.
**    M     Focus last (oldest) entry.
**    h     Move focus between selected, current (check-out) and ticked entries.
**    .     Focus entry closest to center of viewport.
**    H     Scroll to focused entry.
**    ,     Tick/untick the node of the focused entry.
**    ;     Untick the nodes of all entries.
**    b     Copy the commit hash of the focused entry to clipboard.
**    B     Copy the branch name of the focused entry to clipboard.
**    j     View timeline of focused entry.
**    J     View timeline of focused entry filtered by branch.