You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@mesos.apache.org by ss...@apache.org on 2013/12/05 19:04:49 UTC

[2/3] git commit: Made pailer scrollable in Chrome and Safari.

Made pailer scrollable in Chrome and Safari.

After a change to fix the pailer in Firefox, Chrome and Safari broke.
By removing the inner <code> block and using just a <pre> element, the
calculations done by the pailer work again and in all 3 browsers.

The style changes simplified the CSS.

In JS, references to the DOM are kept in variables to prevent unneeded
trips to the DOM on window resizing.

Review: http://reviews.apache.org/r/16029


Project: http://git-wip-us.apache.org/repos/asf/mesos/repo
Commit: http://git-wip-us.apache.org/repos/asf/mesos/commit/3379e941
Tree: http://git-wip-us.apache.org/repos/asf/mesos/tree/3379e941
Diff: http://git-wip-us.apache.org/repos/asf/mesos/diff/3379e941

Branch: refs/heads/master
Commit: 3379e9410f246c79a9de9f519c5598ec3ae2c713
Parents: 0e1b440
Author: Ross Allen <ro...@gmail.com>
Authored: Wed Dec 4 17:50:59 2013 -0800
Committer: Ross Allen <ro...@gmail.com>
Committed: Wed Dec 4 17:53:56 2013 -0800

----------------------------------------------------------------------
 src/webui/master/static/pailer.html | 47 ++++++++++++++------------------
 1 file changed, 20 insertions(+), 27 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/mesos/blob/3379e941/src/webui/master/static/pailer.html
----------------------------------------------------------------------
diff --git a/src/webui/master/static/pailer.html b/src/webui/master/static/pailer.html
index ee2b1b8..19e0981 100644
--- a/src/webui/master/static/pailer.html
+++ b/src/webui/master/static/pailer.html
@@ -3,49 +3,42 @@
   <head>
     <meta charset="utf-8">
     <title></title>
-
-    <style type="text/css">
-      .log {
-        font-family: "Inconsolata", "Monaco", "Courier New", "Courier";
-        line-height:16px;
+    <style>
+      body {
+        line-height: 16px;
         font-size: 14px;
       }
 
-      .invert {
+      .indicator {
+        background: #000000;
         color: #FFFFFF;
+        left: 5px;
+        position: absolute;
         text-decoration: none;
-        background: #000000;
+        top: 5px;
       }
     </style>
   </head>
 
   <body style="overflow: hidden;">
-    <pre><code id="data" class="log"></code></pre>
-
-    <div style="position: absolute; left: 5px; top: 0px;">
-      <p id="indicator" class="log invert"></p>
-    </div>
+    <pre id="data"></pre>
+    <div class="indicator" id="indicator"></div>
 
     <script src="/static/js/jquery-1.7.1.min.js"></script>
     <script src="/static/js/underscore-1.4.3.min.js"></script>
     <script src="/static/js/jquery.pailer.js"></script>
 
     <script>
-      // TODO(benh): Give focus to $('#data') so we can initially page
-      // with the arrow keys.
-      $(window).keydown(function(event) {
-        if ($('#data').scrollTop() == 0) {
-          if (event.keyCode == 38) { // UP.
-          }
-        }
-      });
+      var $body = $('body');
+      var $data = $('#data');
 
       function resize() {
-        var margin_left = parseInt($('body').css('margin-left'));
-        var margin_top = parseInt($('body').css('margin-top'));
-        var margin_bottom = parseInt($('body').css('margin-bottom'));
-        $('#data').width($(window).width() - margin_left);
-        $('#data').height($(window).height() - margin_top - margin_bottom);
+        var margin_left = parseInt($body.css('margin-left'));
+        var margin_top = parseInt($body.css('margin-top'));
+        var margin_bottom = parseInt($body.css('margin-bottom'));
+        $data
+          .width($(window).width() - margin_left)
+          .height($(window).height() - margin_top - margin_bottom);
       }
 
       $(window).resize(resize);
@@ -53,8 +46,8 @@
       $(document).ready(function() {
         resize();
 
-        $('#data').pailer({
-          'read': function(options) {
+        $data.pailer({
+          read: function(options) {
             var settings = $.extend({
               'offset': -1,
               'length': -1