##// END OF EJS Templates
hgweb: re-implement followlines UI selection using buttons...
hgweb: re-implement followlines UI selection using buttons This changeset attempts to solve two issues with the "followlines" UI in hgweb. First the "followlines" action is currently not easily discoverable (one has to hover on a line for some time, wait for the invite message to appear and then perform some action). Second, it gets in the way of natural line selection, especially in filerevision view. This changeset introduces an additional markup element (a <button class="btn-followlines">) alongside each content line of the view. This button now holds events for line selection that were previously plugged onto content lines directly. Consequently, there's no more action on content lines, hence restoring the "natural line selection" behavior (solving the second problem). These buttons are hidden by default and get displayed upon hover of content lines; then upon hover of a button itself, a text inviting followlines section shows up. This solves the first problem (discoverability) as we now have a clear visual element indicating that "some action could be perform" (i.e. a button) and that is self-documented. In followlines.js, all event listeners are now attached to these <button> elements. The custom "floating tooltip" element is dropped as <button> elements are now self-documented through a "title" attribute that changes depending on preceding actions (selection started or not, in particular). The new <button> element is inserted in followlines.js script (thus only visible if JavaScript is activated); it contains a "+" and "-" with a "diff-semantics" style; upon hover, it scales up. To find the parent element under which to insert the <button> we either rely on the "data-selectabletag" attribute (which defines the HTML tag of children of class="sourcelines" element e.g. <span> for filerevision view and <tr> for annotate view) or use a child of the latter elements if we find an element with class="followlines-btn-parent" (useful for annotate view, for which we have to find the <td> in which to insert the <button>). On noticeable change in CSS concerns the "margin-left" of span:before pseudo-elements in filelog view that has been increased a bit in order to leave space for the new button to appear between line number column and line content one. Also note the "z-index" addition for "annotate-info" box so that the latter appears on top of new buttons (instead of getting hidden). In some respect, the UI similar to line commenting feature that is implemented in popular code hosting site like GitHub, BitBucket or Kallithea.
Denis Laxalde -
r33390:32331f54 default
Show More
Name Size Modified Last Commit Author
contrib
doc
hgdemandimport
hgext
hgext3rd
i18n
mercurial
tests
.editorconfig Loading ...
.hgignore Loading ...
.hgsigs Loading ...
.hgtags Loading ...
CONTRIBUTING Loading ...
CONTRIBUTORS Loading ...
COPYING Loading ...
Makefile Loading ...
README Loading ...
hg Loading ...
hgeditor Loading ...
hgweb.cgi Loading ...
setup.py Loading ...

Mercurial
=========

Mercurial is a fast, easy to use, distributed revision control tool
for software developers.

Basic install:

$ make # see install targets
$ make install # do a system-wide install
$ hg debuginstall # sanity-check setup
$ hg # see help

Running without installing:

$ make local # build for inplace usage
$ ./hg --version # should show the latest version

See https://mercurial-scm.org/ for detailed installation
instructions, platform-specific notes, and Mercurial user information.