annotate mercurial/templates/gitweb/map @ 34391:6797f1fbc642

hgweb: add HTML elements to control whitespace settings for annotate

Building on top of the new URL query string arguments to control
whitespace settings for annotate, this commit adds HTML checkboxes
reflecting the values of these arguments to the paper and gitweb
themes.

The actual diff settings are now exported to the templating layer.
The HTML templates add these as data-* attributes so they are
accessible to the DOM.

A new <form> with various <input> elements is added. The <form>
is initially hidden via CSS. A shared JavaScript function (which
runs after the <form> has been rendered but before the annotate
HTML (because annotate HTML could take a while to load and we want
the form to render quickly) takes care of setting the checked state
of each box from the data-* attributes. It also registers an event
handler to modify the URL and refresh the page whenever the checkbox
state is changed.

I'm using the URLSearchParams interface to perform URL manipulation.
https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams tells
me this may not be supported on older web browsers. Yes, apparently
the web API didn't have a standard API to parse and format query
strings until recently. Hence the check for the presence of this
feature in the JavaScript. If the browser doesn't support the
feature, the <form> will remain hidden and behavior will like it
currently is. We could polyfill this feature or implement our own
query string parsing. But I'm lazy and this could be done as a
follow-up if people miss it.

We could certainly expand this feature to support more diff options
(such as lines of context). That's why the potentially reusable code
is stored in a reusable place. It is also certainly possible to
add diff controls to other pages that display diffs. But since
Mozillians are making noise about controlling which revisions
annotate shows, I figured I'd start there.

.. feature::

   Control whitespace settings for annotation on hgweb

   /annotate URLs on hgweb now accept query string arguments to
   influence how whitespace changes impact results.

   The arguments "ignorews," "ignorewsamount," "ignorewseol," and
   "ignoreblanklines" now have the same meaning as their [annotate]
   config section counterparts. Any provided setting overrides the
   server default.

   HTML checkboxes have been added to the paper and gitweb themes
   to expose current whitespace settings and to easily modify the
   current view.

Differential Revision: https://phab.mercurial-scm.org/D850

default = 'summary'
mimetype = 'text/html; charset={encoding}'
header = header.tmpl
footer = footer.tmpl
search = search.tmpl
changelog = changelog.tmpl
summary = summary.tmpl
error = error.tmpl
notfound = notfound.tmpl

help = help.tmpl
helptopics = helptopics.tmpl

helpentry = '
  <tr><td>
    <a href="{url|urlescape}help/{topic|escape}{sessionvars%urlparameter}">
      {if(basename, '{basename|escape}', '{topic|escape}')}
    </a>
  </td><td>
    {summary|escape}
  </td></tr>'

naventry = '<a href="{url|urlescape}log/{node|short}{sessionvars%urlparameter}">{label|escape}</a> '
navshortentry = '<a href="{url|urlescape}shortlog/{node|short}{sessionvars%urlparameter}">{label|escape}</a> '
navgraphentry = '<a href="{url|urlescape}graph/{node|short}{sessionvars%urlparameter}">{label|escape}</a> '
filenaventry = '<a href="{url|urlescape}log/{node|short}/{file|urlescape}{sessionvars%urlparameter}">{label|escape}</a> '
filedifflink = '<a href="{url|urlescape}diff/{node|short}/{file|urlescape}{sessionvars%urlparameter}">{file|escape}</a> '
filenodelink = '
  <tr class="parity{parity}">
    <td><a class="list" href="{url|urlescape}diff/{node|short}/{file|urlescape}{sessionvars%urlparameter}">{file|escape}</a></td>
    <td></td>
    <td class="link">
      <a href="{url|urlescape}file/{node|short}/{file|urlescape}{sessionvars%urlparameter}">file</a> |
      <a href="{url|urlescape}annotate/{node|short}/{file|urlescape}{sessionvars%urlparameter}">annotate</a> |
      <a href="{url|urlescape}diff/{node|short}/{file|urlescape}{sessionvars%urlparameter}">diff</a> |
      <a href="{url|urlescape}comparison/{node|short}/{file|urlescape}{sessionvars%urlparameter}">comparison</a> |
      <a href="{url|urlescape}log/{node|short}/{file|urlescape}{sessionvars%urlparameter}">revisions</a>
    </td>
  </tr>'
filenolink = '
  <tr class="parity{parity}">
    <td><a class="list" href="{url|urlescape}diff/{node|short}/{file|urlescape}{sessionvars%urlparameter}">{file|escape}</a></td>
    <td></td>
    <td class="link">
      file |
      annotate |
      <a href="{url|urlescape}diff/{node|short}/{file|urlescape}{sessionvars%urlparameter}">diff</a> |
      <a href="{url|urlescape}comparison/{node|short}/{file|urlescape}{sessionvars%urlparameter}">comparison</a> |
      <a href="{url|urlescape}log/{node|short}/{file|urlescape}{sessionvars%urlparameter}">revisions</a>
    </td>
  </tr>'

nav = '{before%naventry} {after%naventry}'
navshort = '{before%navshortentry}{after%navshortentry}'
navgraph = '{before%navgraphentry}{after%navgraphentry}'
filenav = '{before%filenaventry}{after%filenaventry}'

fileellipses = '...'
changelogentry = changelogentry.tmpl
searchentry = changelogentry.tmpl
changeset = changeset.tmpl
manifest = manifest.tmpl
direntry = '
  <tr class="parity{parity}">
    <td style="font-family:monospace">drwxr-xr-x</td>
    <td style="font-family:monospace"></td>
    <td style="font-family:monospace"></td>
    <td>
      <a href="{url|urlescape}file/{symrev}{path|urlescape}{sessionvars%urlparameter}">{basename|escape}</a>
      <a href="{url|urlescape}file/{symrev}{path|urlescape}/{emptydirs|urlescape}{sessionvars%urlparameter}">{emptydirs|escape}</a>
    </td>
    <td class="link">
      <a href="{url|urlescape}file/{symrev}{path|urlescape}{sessionvars%urlparameter}">files</a>
    </td>
  </tr>'
fileentry = '
  <tr class="parity{parity}">
    <td style="font-family:monospace">{permissions|permissions}</td>
    <td style="font-family:monospace" align=right>{date|isodate}</td>
    <td style="font-family:monospace" align=right>{size}</td>
    <td class="list">
      <a class="list" href="{url|urlescape}file/{symrev}/{file|urlescape}{sessionvars%urlparameter}">{basename|escape}</a>
    </td>
    <td class="link">
      <a href="{url|urlescape}file/{symrev}/{file|urlescape}{sessionvars%urlparameter}">file</a> |
      <a href="{url|urlescape}log/{symrev}/{file|urlescape}{sessionvars%urlparameter}">revisions</a> |
      <a href="{url|urlescape}annotate/{symrev}/{file|urlescape}{sessionvars%urlparameter}">annotate</a>
    </td>
  </tr>'
filerevision = filerevision.tmpl
fileannotate = fileannotate.tmpl
filediff = filediff.tmpl
filecomparison = filecomparison.tmpl
filelog = filelog.tmpl
fileline = '
  <a href="#{lineid}"></a><span id="{lineid}">{strip(line|escape, '\r\n')}</span>'
annotateline = '
  <tr id="{lineid}" style="font-family:monospace" class="parity{parity}{ifeq(node, originalnode, ' thisrev')}">
    <td class="annotate linenr parity{blockparity}" style="text-align: right;">
      {if(blockhead,
          '<a href="{url|urlescape}annotate/{node|short}/{file|urlescape}{sessionvars%urlparameter}#l{targetline}">
             {rev}
           </a>')}
      <div class="annotate-info">
        <div>
          <a href="{url|urlescape}annotate/{node|short}/{file|urlescape}{sessionvars%urlparameter}#l{targetline}">
            {node|short}</a>
          {desc|escape|firstline}
        </div>
        <div><em>{author|obfuscate}</em></div>
        <div>parents: {parents%annotateparent}</div>
        <a href="{url|urlescape}diff/{node|short}/{file|urlescape}{sessionvars%urlparameter}">diff</a>
        <a href="{url|urlescape}rev/{node|short}{sessionvars%urlparameter}">changeset</a>
      </div>
    </td>
    <td class="followlines-btn-parent"><pre><a class="linenr" href="#{lineid}">{linenumber}</a></pre></td>
    <td><pre>{line|escape}</pre></td>
  </tr>'
annotateparent = '
  <a href="{url|urlescape}annotate/{node|short}/{file|urlescape}{sessionvars%urlparameter}">{rev}</a>'
difflineplus = '
  <a href="#{lineid}"></a><span id="{lineid}" class="difflineplus">{strip(line|escape, '\r\n')}</span>'
difflineminus = '
  <a href="#{lineid}"></a><span id="{lineid}" class="difflineminus">{strip(line|escape, '\r\n')}</span>'
difflineat = '
  <a href="#{lineid}"></a><span id="{lineid}" class="difflineat">{strip(line|escape, '\r\n')}</span>'
diffline = '
  <a href="#{lineid}"></a><span id="{lineid}">{strip(line|escape, '\r\n')}</span>'

comparisonblock ='
  <tbody class="block">
  {lines}
  </tbody>'
comparisonline = '
  <tr id="{lineid}" style="font-family:monospace">
    <td class="{type}"><pre><a class="linenr" href="#{lineid}">{leftlinenumber}</a> {leftline|escape}</pre></td>
    <td class="{type}"><pre><a class="linenr" href="#{lineid}">{rightlinenumber}</a> {rightline|escape}</pre></td>
  </tr>'

changesetlink = '<a class="list" href="{url|urlescape}rev/{node|short}{sessionvars%urlparameter}">{node|short}</a>'
changesetbranch = '<tr><td>branch</td><td>{name|escape}</td></tr>'
changesetparent = '
  <tr>
    <td>parent {rev}</td>
    <td style="font-family:monospace">
      {changesetlink}
    </td>
  </tr>'
changesetparentdiff = '
  <tr>
    <td>parent {rev}</td>
    <td style="font-family:monospace">
      {changesetlink} {ifeq(node, basenode, '(current diff)', '({difffrom})')}
    </td>
  </tr>'
difffrom = '<a href="{url|urlescape}rev/{node|short}:{originalnode|short}{sessionvars%urlparameter}">diff</a>'
filerevbranch = '<tr><td>branch</td><td>{name|escape}</td></tr>'
filerevparent = '
  <tr>
    <td>parent {rev}</td>
    <td style="font-family:monospace">
      <a class="list" href="{url|urlescape}file/{node|short}/{file|urlescape}{sessionvars%urlparameter}">
        {rename%filerename}{node|short}
      </a>
    </td>
  </tr>'
filerename = '{file|escape}@'
filelogrename = '| <a href="{url|urlescape}file/{node|short}/{file|urlescape}{sessionvars%urlparameter}">base</a>'
fileannotateparent = '
  <tr>
    <td>parent {rev}</td>
    <td style="font-family:monospace">
      <a class="list" href="{url|urlescape}annotate/{node|short}/{file|urlescape}{sessionvars%urlparameter}">
        {rename%filerename}{node|short}
      </a>
    </td>
  </tr>'
changesetchild = '
  <tr>
    <td>child {rev}</td>
    <td style="font-family:monospace">
      <a class="list" href="{url|urlescape}rev/{node|short}{sessionvars%urlparameter}">{node|short}</a>
    </td>
  </tr>'
filerevchild = '
  <tr>
    <td>child {rev}</td>
    <td style="font-family:monospace">
      <a class="list" href="{url|urlescape}file/{node|short}/{file|urlescape}{sessionvars%urlparameter}">{node|short}</a></td>
    </tr>'
fileannotatechild = '
  <tr>
    <td>child {rev}</td>
    <td style="font-family:monospace">
      <a class="list" href="{url|urlescape}annotate/{node|short}/{file|urlescape}{sessionvars%urlparameter}">{node|short}</a></td>
    </tr>'
tags = tags.tmpl
tagentry = '
  <tr class="parity{parity}">
    <td class="age"><i class="age">{date|rfc822date}</i></td>
    <td><a class="list" href="{url|urlescape}rev/{tag|revescape}{sessionvars%urlparameter}"><b>{tag|escape}</b></a></td>
    <td class="link">
      <a href="{url|urlescape}rev/{node|short}{sessionvars%urlparameter}">changeset</a> |
      <a href="{url|urlescape}log/{node|short}{sessionvars%urlparameter}">changelog</a> |
      <a href="{url|urlescape}file/{node|short}{sessionvars%urlparameter}">files</a>
    </td>
  </tr>'
bookmarks = bookmarks.tmpl
bookmarkentry = '
  <tr class="parity{parity}">
    <td class="age"><i class="age">{date|rfc822date}</i></td>
    <td><a class="list" href="{url|urlescape}rev/{bookmark|revescape}{sessionvars%urlparameter}"><b>{bookmark|escape}</b></a></td>
    <td class="link">
      <a href="{url|urlescape}rev/{node|short}{sessionvars%urlparameter}">changeset</a> |
      <a href="{url|urlescape}log/{node|short}{sessionvars%urlparameter}">changelog</a> |
      <a href="{url|urlescape}file/{node|short}{sessionvars%urlparameter}">files</a>
    </td>
  </tr>'
branches = branches.tmpl
branchentry = '
  <tr class="parity{parity}">
    <td class="age"><i class="age">{date|rfc822date}</i></td>
    <td class="{status}"><a class="list" href="{url|urlescape}shortlog/{branch|revescape}{sessionvars%urlparameter}"><b>{branch|escape}</b></a></td>
    <td class="link">
      <a href="{url|urlescape}changeset/{node|short}{sessionvars%urlparameter}">changeset</a> |
      <a href="{url|urlescape}log/{node|short}{sessionvars%urlparameter}">changelog</a> |
      <a href="{url|urlescape}file/{node|short}{sessionvars%urlparameter}">files</a>
    </td>
  </tr>'
diffblock = '<div class="diffblock"><pre class="sourcelines">{lines}</pre></div>'
filediffparent = '
  <tr>
    <td>parent {rev}</td>
    <td style="font-family:monospace">
      <a class="list" href="{url|urlescape}diff/{node|short}/{file|urlescape}{sessionvars%urlparameter}">
        {node|short}
      </a>
    </td>
  </tr>'
filecompparent = '
  <tr>
    <td>parent {rev}</td>
    <td style="font-family:monospace">
      <a class="list" href="{url|urlescape}comparison/{node|short}/{file|urlescape}{sessionvars%urlparameter}">
        {node|short}
      </a>
    </td>
  </tr>'
filediffchild = '
  <tr>
    <td>child {rev}</td>
    <td style="font-family:monospace">
      <a class="list" href="{url|urlescape}diff/{node|short}/{file|urlescape}{sessionvars%urlparameter}">{node|short}</a>
    </td>
  </tr>'
filecompchild = '
  <tr>
    <td>child {rev}</td>
    <td style="font-family:monospace">
      <a class="list" href="{url|urlescape}comparison/{node|short}/{file|urlescape}{sessionvars%urlparameter}">{node|short}</a>
    </td>
  </tr>'
shortlog = shortlog.tmpl
graph = graph.tmpl
tagtag = '<span class="tagtag" title="{name|escape}">{name|escape}</span> '
branchtag = '<span class="branchtag" title="{name|escape}">{name|escape}</span> '
inbranchtag = '<span class="inbranchtag" title="{name|escape}">{name|escape}</span> '
bookmarktag = '<span class="bookmarktag" title="{name|escape}">{name|escape}</span> '
shortlogentry = '
  <tr class="parity{parity}">
    <td class="age"><i class="age">{date|rfc822date}</i></td>
    <td><i>{author|person}</i></td>
    <td>
      <a class="list" href="{url|urlescape}rev/{node|short}{sessionvars%urlparameter}">
        <b>{desc|strip|firstline|escape|nonempty}</b>
        <span class="logtags">{inbranch%inbranchtag}{branches%branchtag}{tags%tagtag}{bookmarks%bookmarktag}</span>
      </a>
    </td>
    <td class="link" nowrap>
      <a href="{url|urlescape}rev/{node|short}{sessionvars%urlparameter}">changeset</a> |
      <a href="{url|urlescape}file/{node|short}{sessionvars%urlparameter}">files</a>
    </td>
  </tr>'
filelogentry = '
  <tr class="parity{if(patch, '1', '{parity}')}">
    <td class="age"><i class="age">{date|rfc822date}</i></td>
    <td><i>{author|person}</i></td>
    <td>
      <a class="list" href="{url|urlescape}rev/{node|short}{sessionvars%urlparameter}">
        <b>{desc|strip|firstline|escape|nonempty}</b>
        <span class="logtags">{inbranch%inbranchtag}{branches%branchtag}{tags%tagtag}{bookmarks%bookmarktag}</span>
      </a>
    </td>
    <td class="link">
      <a href="{url|urlescape}file/{node|short}/{file|urlescape}{sessionvars%urlparameter}">file</a> |
      <a href="{url|urlescape}diff/{node|short}/{file|urlescape}{sessionvars%urlparameter}">diff</a> |
      <a href="{url|urlescape}annotate/{node|short}/{file|urlescape}{sessionvars%urlparameter}">annotate</a>
      {rename%filelogrename}
    </td>
  </tr>
  {if(patch, '<tr><td colspan="4">{diff}</td></tr>')}'
archiveentry = ' | <a href="{url|urlescape}archive/{symrev}{extension}{ifeq(path,'/','',path|urlescape)}">{type|escape}</a> '
indexentry = '
  <tr class="parity{parity}">
    <td>
      <a class="list" href="{url|urlescape}{sessionvars%urlparameter}">
        <b>{name|escape}</b>
      </a>
    </td>
    <td>{description}</td>
    <td>{contact|obfuscate}</td>
    <td class="age">{lastchange|rfc822date}</td>
    <td class="indexlinks">{archives%indexarchiveentry}</td>
    <td>{if(isdirectory, '',
            '<div class="rss_logo">
                <a href="{url|urlescape}rss-log">RSS</a> <a href="{url|urlescape}atom-log">Atom</a>
            </div>'
            )}
    </td>
  </tr>\n'
indexarchiveentry = ' <a href="{url|urlescape}archive/{node|short}{extension}">{type|escape}</a> '
index = index.tmpl
urlparameter = '{separator}{name}={value|urlescape}'
hiddenformentry = '<input type="hidden" name="{name}" value="{value|escape}" />'
breadcrumb = '&gt; <a href="{url|urlescape}">{name|escape}</a> '

searchform = '
  <div class="search">
    <form id="searchform" action="{url|urlescape}log">
      {sessionvars%hiddenformentry}
      <input name="rev" type="text" value="{query|escape}" size="40" />
      <div id="hint">{searchhint}</div>
    </form>
  </div>'
searchhint = 'Find changesets by keywords (author, files, the commit message), revision
  number or hash, or <a href="{url|urlescape}help/revsets">revset expression</a>.'

diffoptsform = '
  <form id="diffopts-form"
    data-ignorews="{if(get(diffopts, 'ignorews'), '1', '0')}"
    data-ignorewsamount="{if(get(diffopts, 'ignorewsamount'), '1', '0')}"
    data-ignorewseol="{if(get(diffopts, 'ignorewseol'), '1', '0')}"
    data-ignoreblanklines="{if(get(diffopts, 'ignoreblanklines'), '1', '0')}">
    <span>Ignore whitespace changes - </span>
    <span>Everywhere:</span>
    <input id="ignorews-checkbox" type="checkbox" />
    <span>Within whitespace:</span>
    <input id="ignorewsamount-checkbox" type="checkbox" />
    <span>At end of lines:</span>
    <input id="ignorewseol-checkbox" type="checkbox" />
  </form>
  </div>'