gitweb: plug followlines UI in filerevision view
authorDenis Laxalde <denis.laxalde@logilab.fr>
Thu, 13 Apr 2017 09:49:48 +0200
changeset 31949 eaf3819631c2
parent 31948 7a3fc3f3e89a
child 31950 cc70c6dbac30
gitweb: plug followlines UI in filerevision view Mostly copy CSS rules from style-paper.css into style-gitweb.css. The only modification is addition of !important on "background-color" rule for "pre.sourcelines > span.followlines-selected" selector as the background color is otherwise overriden by "pre.sourcelines.stripes > :nth-child(4n+4)" rule.
mercurial/templates/gitweb/filerevision.tmpl
mercurial/templates/static/style-gitweb.css
tests/test-hgweb.t
--- a/mercurial/templates/gitweb/filerevision.tmpl	Thu Apr 13 10:04:09 2017 +0200
+++ b/mercurial/templates/gitweb/filerevision.tmpl	Thu Apr 13 09:49:48 2017 +0200
@@ -64,7 +64,9 @@
 </div>
 
 <div class="page_body">
-<pre class="sourcelines stripes">{text%fileline}</pre>
+<pre class="sourcelines stripes" data-logurl="{url|urlescape}log/{symrev}/{file|urlescape}">{text%fileline}</pre>
 </div>
 
+<script type="text/javascript" src="{staticurl|urlescape}followlines.js"></script>
+
 {footer}
--- a/mercurial/templates/static/style-gitweb.css	Thu Apr 13 10:04:09 2017 +0200
+++ b/mercurial/templates/static/style-gitweb.css	Thu Apr 13 09:49:48 2017 +0200
@@ -149,6 +149,62 @@
     font-family: monospace;
 }
 
+/* Followlines */
+div.page_body pre.sourcelines > span.followlines-select:hover {
+  cursor: cell;
+}
+
+pre.sourcelines > span.followlines-selected {
+  background-color: #99C7E9 !important;
+}
+
+div#followlines {
+  background-color: #B7B7B7;
+  border: 1px solid #CCC;
+  border-radius: 5px;
+  padding: 4px;
+  position: fixed;
+}
+
+div.followlines-cancel {
+  text-align: right;
+}
+
+div.followlines-cancel > button {
+  line-height: 80%;
+  padding: 0;
+  border: 0;
+  border-radius: 2px;
+  background-color: inherit;
+  font-weight: bold;
+}
+
+div.followlines-cancel > button:hover {
+  color: #FFFFFF;
+  background-color: #CF1F1F;
+}
+
+div.followlines-link {
+  margin: 2px;
+  margin-top: 4px;
+  font-family: sans-serif;
+}
+
+div#followlines-tooltip {
+  display: none;
+  position: fixed;
+  background-color: #ffc;
+  border: 1px solid #999;
+  padding: 2px;
+}
+
+.sourcelines:hover > div#followlines-tooltip {
+  display: inline;
+}
+
+.sourcelines:hover > div#followlines-tooltip.hidden {
+  display: none;
+}
 /* Graph */
 div#wrapper {
 	position: relative;
--- a/tests/test-hgweb.t	Thu Apr 13 10:04:09 2017 +0200
+++ b/tests/test-hgweb.t	Thu Apr 13 09:49:48 2017 +0200
@@ -337,7 +337,7 @@
 
   $ get-with-headers.py --twice localhost:$HGPORT 'static/style-gitweb.css' - date etag server
   200 Script output follows
-  content-length: 7032
+  content-length: 8012
   content-type: text/css
   
   body { font-family: sans-serif; font-size: 12px; border:solid #d9d8d1; border-width:1px; margin:10px; background: white; color: black; }
@@ -491,6 +491,62 @@
       font-family: monospace;
   }
   
+  /* Followlines */
+  div.page_body pre.sourcelines > span.followlines-select:hover {
+    cursor: cell;
+  }
+  
+  pre.sourcelines > span.followlines-selected {
+    background-color: #99C7E9 !important;
+  }
+  
+  div#followlines {
+    background-color: #B7B7B7;
+    border: 1px solid #CCC;
+    border-radius: 5px;
+    padding: 4px;
+    position: fixed;
+  }
+  
+  div.followlines-cancel {
+    text-align: right;
+  }
+  
+  div.followlines-cancel > button {
+    line-height: 80%;
+    padding: 0;
+    border: 0;
+    border-radius: 2px;
+    background-color: inherit;
+    font-weight: bold;
+  }
+  
+  div.followlines-cancel > button:hover {
+    color: #FFFFFF;
+    background-color: #CF1F1F;
+  }
+  
+  div.followlines-link {
+    margin: 2px;
+    margin-top: 4px;
+    font-family: sans-serif;
+  }
+  
+  div#followlines-tooltip {
+    display: none;
+    position: fixed;
+    background-color: #ffc;
+    border: 1px solid #999;
+    padding: 2px;
+  }
+  
+  .sourcelines:hover > div#followlines-tooltip {
+    display: inline;
+  }
+  
+  .sourcelines:hover > div#followlines-tooltip.hidden {
+    display: none;
+  }
   /* Graph */
   div#wrapper {
   	position: relative;