<th1>
  if {! $is_index && ! $is_home} {
    html "</div>"
  }
</th1>
</div>
<div id="push"></div>
</div>
<footer id="footer">
  <p>&#169; Copyright $<project_name>. All right reserved. Fossil $release_version &#183; <a href="$home/timeline.rss">RSS</a></p>
</footer>
<script nonce="$<nonce>">
window.addEventListener( 'load', function() {
var i;
var tables = document.querySelectorAll('table');
for(i = 0; i < tables.length; i++) {
  if (tables[i].id !== "timelineTable"){
    tables[i].classList.add('table');
  }
};
var submenus = document.querySelectorAll('.submenu');
var labels, j;
for (i = 0; i < submenus.length; i++) {
  submenus[i].classList.add('btn-group');
  labels = submenus[i].querySelectorAll('.label');
  for (j = 0; j < labels.length; j++) {
    labels[j].classList.remove('label');
    labels[j].classList.add('btn');
    labels[j].classList.add('btn-default');
    labels[j].classList.add('btn-sm');
  }
};
//Handle the collapsible navbar
var collapse = document.querySelector('[data-toggle="collapse"]');
collapse.onclick = function(){
  var target = document.querySelector(
    collapse.getAttribute('data-target')
  );
  target.classList.toggle('collapse');
  target.classList.toggle('collapsed');
};
});</script>

  int show_colors = PB("colors");
  login_check_credentials();
  if( !g.perm.Read ){ login_needed(g.anon.Read); return; }
  style_set_current_feature("branch");
  style_header("Branches");
  style_adunit_config(ADUNIT_RIGHT_OK);
  style_submenu_checkbox("colors", "Use Branch Colors", 0, 0);
  style_submenu_element("Timeline", "%R/timeline");
  login_anonymous_available();

  brlist_create_temp_table();
  db_prepare(&q, "SELECT * FROM tmp_brlist ORDER BY mtime DESC");
  rNow = db_double(0.0, "SELECT julianday('now')");
  @ <div class="brlist">
  @ <table class='sortable' data-column-types='tkNtt' data-init-sort='2'>

      }
    }
    if( zBgClr && zBgClr[0] && show_colors ){
      @ <tr style="background-color:%s(zBgClr)">
    }else{
      @ <tr>
    }
    @ <td>%z(href("%R/timeline?r=%T",zBranch))%h(zBranch)</a><input 
    @  type="checkbox" disabled="disabled"/></td>
    @ <td data-sortkey="%016llx(iMtime)">%s(zAge)</td>
    @ <td>%d(nCkin)</td>
    fossil_free(zAge);
    @ <td>%s(isClosed?"closed":"")</td>
    if( zMergeTo ){
      @ <td>merged into
      @ %z(href("%R/timeline?f=%!S",zLastCkin))%h(zMergeTo)</a></td>
    }else{
      @ <td></td>
    }
    @ </tr>
  }
  @ </tbody></table></div>
  db_finalize(&q);
  builtin_request_js("fossil.page.brlist.js");
  style_table_sorter();
  style_finish_page();
}

/*
** WEBPAGE: brlist
** Show a list of branches.  With no query parameters, a sortable table

  max-width: 45%;
  max-height: 45%;
}

input[type="checkbox"].diff-toggle {
  float: right;
}

body.branch .brlist > table > tbody > tr:hover > td:first-child,
body.branch .brlist > table > tbody > tr.selected {
  font-weight: bold;
}
body.branch .brlist > table > tbody td:first-child > input {
  cursor: pointer;
}
body.branch .brlist > table > tbody > tr > td:nth-child(1) {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
body.branch .submenu > a.timeline-link {
  display: none;
}
body.branch .submenu > a.timeline-link.selected {
  display: inline;
}

/* Objects in the "desktoponly" class are invisible on mobile */
@media screen and (max-width: 600px) {
  .desktoponly {
    display: none;
  }
}
/* Objects in the "wideonly" class are invisible only on wide-screen desktops */

/*
 * This script adds multiselect facility for the list of branches.
 *
 * Some info on 'const':
 *   https://caniuse.com/const
 *   https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const#browser_compatibility
 *
 * According to MDN 'const' requires Android's WebView 37,
 * which may not be available.
 * For the time being, continueing without 'const' and 'indexOf'
 * (but that may be reconsidered later).
*/
window.addEventListener( 'load', function() {

var anchor = document.querySelector("div.submenu > a:first-of-type" );
if( !anchor || anchor.innerText != "Timeline" ) return;
var prefix   = anchor.href.toString() + "?ms=regexp&rel&t=";
anchor.classList.add('timeline-link');

var amendAnchor = function( selected ){
  if( selected.length == 0 ){
    anchor.classList.remove('selected');
    anchor.href = prefix;
    return;
  }
  re = selected.join("|");
  try{re = encodeURIComponent(re);}
  catch{console.log("encodeURIComponent() failed for ",re);}
  anchor.href = prefix + re;
  anchor.innerHTML = "View " + selected.length +
                     ( selected.length > 1 ? " branches" : " branch" );
  anchor.classList.add('selected');
  // console.log("Link:",anchor.href);
}

var onChange = function( event ){
  var cbx = event.target;
  var tr  = cbx.parentElement.parentElement;
  var tag = cbx.parentElement.children[0].innerText;
  var re  = anchor.href.substr(prefix.length);
  try{re  = decodeURIComponent(re);}
  catch{console.log("decodeURIComponent() failed for ",re);}
  var selected = ( re != "" ? re.split("|") : [] );
  if( cbx.checked ){
    selected.push(tag);
    tr.classList.add('selected');
  }
  else {
    tr.classList.remove('selected');
    for( var i = selected.length; --i >= 0 ;)
      if( selected[i] == tag )
        selected.splice(i,1);
  }
  amendAnchor( selected );
}

var stags = []; /* initially selected tags, not used above */
document.querySelectorAll("div.brlist > table td:first-child > input")
  .forEach( function( cbx ){
    cbx.onchange = onChange;
    cbx.disabled = false;
    if( cbx.checked ){
      stags.push(cbx.parentElement.children[0].innerText);
      cbx.parentElement.parentElement.classList.add('selected');
    }
  });
amendAnchor( stags );

}); // window.addEventListener( 'load' ...

  $(SRCDIR)/fossil.bootstrap.js \
  $(SRCDIR)/fossil.confirmer.js \
  $(SRCDIR)/fossil.copybutton.js \
  $(SRCDIR)/fossil.dom.js \
  $(SRCDIR)/fossil.fetch.js \
  $(SRCDIR)/fossil.info-diff.js \
  $(SRCDIR)/fossil.numbered-lines.js \
  $(SRCDIR)/fossil.page.brlist.js \
  $(SRCDIR)/fossil.page.fileedit.js \
  $(SRCDIR)/fossil.page.forumpost.js \
  $(SRCDIR)/fossil.page.pikchrshow.js \
  $(SRCDIR)/fossil.page.whistory.js \
  $(SRCDIR)/fossil.page.wikiedit.js \
  $(SRCDIR)/fossil.pikchr.js \
  $(SRCDIR)/fossil.popupwidget.js \

<title>Change Log</title>

<a name='v2_16'></a>
<h2>Changes for Version 2.16 (pending)</h2>
  *  [/brlist|List of branches] gained
     [/timeline?r=brlist-timeline|the facility] to select several
     branches and [./javascript.md#brlist|point a user] to the
     <tt>/timeline</tt> view that shows just these selected branches
     and the related check-ins.

<a name='v2_15'></a>
<h2>Changes for Version 2.15 (2021-03-26) and Patch 2.15.1 on (2021-04-07)</h2>
  *  <b>Patch 2.15.1:</b> Fix a data exfiltration bug in the server.  <b>Upgrading to
     the patch is recommended.</b><p>
  *  The [./defcsp.md|default CSP] has been relaxed slightly to allow
     images to be loaded from any URL.  All other resources are still
     locked down by default.

       SELECT xfrom, xmsg FROM chat WHERE msgid > 1234;

…would pull the messages submitted since the last poll. Making the
gateway bidirectional should be possible as well, as long as it properly
uses SQLite transactions.

### <a id="brlist"></a>List of branches

Since Fossil 2.16 [`/brlist`](/brlist) page uses JavaScript to enable
selection of several branches for further study via `/timeline`.
Client-side script interactively responds to checkboxes' events
and constructs a special hyperlink in the submenu.
Clicking this hyperlink loads a `/timeline` page that shows
only these selected branches (and the related check-ins).

_Potential Workaround:_ A user can manually construct an appropriate
regular expession and put it into the "Tag Filter" entry of the
`/timeline` page (in its advanced mode).

----

## <a id="future"></a>Future Plans for JavaScript in Fossil

As of mid-2020, the informal provisional plan is to increase Fossil
UI's use of JavaScript considerably compared to its historically minimal
uses. To that end, a framework of Fossil-centric APIs is being developed