Title: [96906] trunk
Revision
96906
Author
aba...@webkit.org
Date
2011-10-06 22:42:57 -0700 (Thu, 06 Oct 2011)

Log Message

Port PixelZoomer to work in garden-o-matic
https://bugs.webkit.org/show_bug.cgi?id=69577

Reviewed by David Levin.

Tools:

This implementation of PixelZoomer is basically a fork of the
implementation used by results.html.  These two apps have different
requirements on where this code lives.  results.html wants to be
self-contained whereas garden-o-matic wants to live in the public_html
folder of the buildbot.  We could do something fancy here to share the
code, but that's not likely to be of much benefit.

I had to change a few things about pixelzoomer to accounter for the
differences in DOM between results.html and garden-o-matic, but
surprisingly little.  I also moved all the code into an anonymous
function, which is the style we're suing for module separation in
garden-o-matic.  Finally, some jQuery-ims snuck in because I didn't
want to drag along too many extra functions from results.html.

* BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/garden-o-matic.html:
* BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/garden-o-matic.js:
* BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/pixelzoomer.js: Added.
* BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui/results.js:
* BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/styles/pixelzoomer.css: Added.
(.pixel-zoom-container):
(.pixel-zoom-container > *):
(.pixel-zoom-container .scaled-image-container):
(.scaled-image-container > img):

LayoutTests:

Change the timeout constant to so that it matches garden-o-matic.  In
garden-o-matic, 200 MS was too fast because you mouse around the UI a
lot more.

* fast/harness/results.html:

Modified Paths

Added Paths

Diff

Modified: trunk/LayoutTests/ChangeLog (96905 => 96906)


--- trunk/LayoutTests/ChangeLog	2011-10-07 05:22:58 UTC (rev 96905)
+++ trunk/LayoutTests/ChangeLog	2011-10-07 05:42:57 UTC (rev 96906)
@@ -1,3 +1,16 @@
+2011-10-06  Adam Barth  <aba...@webkit.org>
+
+        Port PixelZoomer to work in garden-o-matic
+        https://bugs.webkit.org/show_bug.cgi?id=69577
+
+        Reviewed by David Levin.
+
+        Change the timeout constant to so that it matches garden-o-matic.  In
+        garden-o-matic, 200 MS was too fast because you mouse around the UI a
+        lot more.
+
+        * fast/harness/results.html:
+
 2011-10-06  James Simonsen  <simon...@chromium.org>
 
         [Chromium] Fix test expectations. Broken test from r96870. Bug filed.

Modified: trunk/LayoutTests/fast/harness/results.html (96905 => 96906)


--- trunk/LayoutTests/fast/harness/results.html	2011-10-07 05:22:58 UTC (rev 96905)
+++ trunk/LayoutTests/fast/harness/results.html	2011-10-07 05:42:57 UTC (rev 96906)
@@ -848,7 +848,7 @@
         if (PixelZoomer.showOnDelay) {
             PixelZoomer._mouseMoveTimeout = setTimeout(function() {
                 PixelZoomer._createContainer(e);
-            }, 200);
+            }, 400);
             return;
         }
 

Modified: trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/garden-o-matic.html (96905 => 96906)


--- trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/garden-o-matic.html	2011-10-07 05:22:58 UTC (rev 96905)
+++ trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/garden-o-matic.html	2011-10-07 05:42:57 UTC (rev 96906)
@@ -36,6 +36,7 @@
 <link rel="stylesheet" href=""
 <link rel="stylesheet" href=""
 <link rel="stylesheet" href=""
+<link rel="stylesheet" href=""
 </head>
 <body>
 <script src=""
@@ -55,6 +56,7 @@
 <script src=""
 <script src=""
 <script src=""
+<script src=""
 <script src=""
 </body>
 </html>

Modified: trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/garden-o-matic.js (96905 => 96906)


--- trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/garden-o-matic.js	2011-10-07 05:22:58 UTC (rev 96905)
+++ trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/garden-o-matic.js	2011-10-07 05:42:57 UTC (rev 96906)
@@ -60,6 +60,8 @@
 $(document).ready(function() {
     g_updateTimerId = window.setInterval(update, config.kUpdateFrequency);
 
+    pixelzoomer.installEventListeners();
+
     _onebar_ = new ui.onebar();
     onebar.attach();
 

Added: trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/pixelzoomer.js (0 => 96906)


--- trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/pixelzoomer.js	                        (rev 0)
+++ trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/pixelzoomer.js	2011-10-07 05:42:57 UTC (rev 96906)
@@ -0,0 +1,170 @@
+/*
+ * Copyright (C) 2011 Google Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ *    notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ *    notice, this list of conditions and the following disclaimer in the
+ *    documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+// pixelzoomer is shared with LayoutTests/fast/harness/results.html
+// Unfortuantely, there's no good way to share code between these two uses.
+
+var pixelzoomer = pixelzoomer || {};
+
+(function() {
+
+var kZoomFactor = 6;
+var kDelayTimeoutMS = 400;
+
+function matchesSelector(node, selector)
+{
+    if (node.webkitMatchesSelector)
+        return node.webkitMatchesSelector(selector);
+
+    if (node.mozMatchesSelector)
+        return node.mozMatchesSelector(selector);
+}
+
+function parentOfType(node, selector)
+{
+    while (node = node.parentNode) {
+        if (matchesSelector(node, selector))
+            return node;
+    }
+    return null;
+}
+
+function zoomImageContainer(url)
+{
+    var container = document.createElement('div');
+    container.className = 'zoom-image-container';
+
+    var title = url.match(/\-([^\-]*)\.png/)[1];
+    
+    var label = document.createElement('div');
+    label.className = 'label';
+    label.appendChild(document.createTextNode(title));
+    container.appendChild(label);
+
+    var imageContainer = document.createElement('div');
+    imageContainer.className = 'scaled-image-container';
+
+    var image = new Image();
+    image.src = ""
+    imageContainer.appendChild(image);
+    container.appendChild(imageContainer);
+
+    return container;
+}
+
+function createContainer(e)
+{
+    var tbody = parentOfType(e.target, 'tbody');
+    var row = tbody.querySelector('tr');
+    var images = row.querySelectorAll('img[src$=".png"]');
+
+    var container = document.createElement('div');
+    container.className = 'pixel-zoom-container';
+
+    for (var i = 0; i < images.length; i++)
+        container.appendChild(zoomImageContainer(images[i].src));
+
+    document.body.appendChild(container);
+    drawAll();
+}
+
+function draw(imageContainer)
+{
+    var containerWidth = imageContainer.offsetWidth;
+    var containerHeight = imageContainer.offsetHeight;
+
+    var scaledMiddleX = pixelzoomer._currentX * kZoomFactor;
+    var scaledMiddleY = pixelzoomer._currentY * kZoomFactor;
+
+    var left = scaledMiddleX - containerWidth / 2;
+    var top = scaledMiddleY - containerHeight / 2;
+
+    var image = imageContainer.querySelector('img');
+    image.style.width = (800 * kZoomFactor) + 'px';
+    image.style.height = (600 * kZoomFactor) + 'px';
+
+    image.style.top = -top + 'px';
+    image.style.left = -left + 'px';
+}
+
+function drawAll()
+{
+    Array.prototype.forEach.call(document.querySelectorAll('.pixel-zoom-container .scaled-image-container'), draw);
+}
+
+function handleMouseOut(e)
+{
+    if (e.relatedTarget && e.relatedTarget.tagName != 'IFRAME')
+        return;
+
+    // If e.relatedTarget is null, we've moused out of the document.
+    $('pixel-zoom-container').detach();
+}
+
+function handleMouseMove(e)
+{
+    if (pixelzoomer._mouseMoveTimeout)
+        clearTimeout(pixelzoomer._mouseMoveTimeout);
+
+    if (parentOfType(e.target, '.pixel-zoom-container'))
+        return;
+
+    var container = document.querySelector('.pixel-zoom-container');
+    
+    var resultContainer = (e.target.className == 'result-container') ?
+        e.target : parentOfType(e.target, '.result-container');
+    if (!resultContainer || !resultContainer.querySelector('img')) {
+        $(container).detach();
+        return;
+    }
+
+    var targetLocation = e.target.getBoundingClientRect();
+    pixelzoomer._currentX = e.clientX - targetLocation.left;
+    pixelzoomer._currentY = e.clientY - targetLocation.top;
+
+    if (!container) {
+        if (pixelzoomer.showOnDelay) {
+            pixelzoomer._mouseMoveTimeout = setTimeout(function() {
+                createContainer(e);
+            }, kDelayTimeoutMS);
+            return;
+        }
+
+        createContainer(e);
+        return;
+    }
+
+    drawAll();
+}
+
+pixelzoomer.showOnDelay = true;
+
+pixelzoomer.installEventListeners = function()
+{
+    document.addEventListener('mousemove', handleMouseMove, false);
+    document.addEventListener('mouseout', handleMouseOut, false);
+};
+
+})();

Modified: trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui/results.js (96905 => 96906)


--- trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui/results.js	2011-10-07 05:22:58 UTC (rev 96905)
+++ trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui/results.js	2011-10-07 05:42:57 UTC (rev 96906)
@@ -36,7 +36,7 @@
     {
         this.className = 'comparison';
         this.innerHTML = '<thead><tr><th>Expected</th><th>Actual</th><th>Diff</th></tr></thead>' +
-                         '<tbody><tr><td class="expected"></td><td class="actual"></td><td class="diff"></td></tr></tbody>';
+                         '<tbody><tr><td class="expected result-container"></td><td class="actual result-container"></td><td class="diff result-container"></td></tr></tbody>';
     },
     _selectorForKind: function(kind)
     {

Modified: trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui_unittests.js (96905 => 96906)


--- trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui_unittests.js	2011-10-07 05:22:58 UTC (rev 96905)
+++ trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui_unittests.js	2011-10-07 05:42:57 UTC (rev 96906)
@@ -65,9 +65,9 @@
             '</thead>' +
             '<tbody>' +
                 '<tr>' +
-                    '<td class="expected"><img class="image-result" src="" +
-                    '<td class="actual"><img class="image-result" src="" +
-                    '<td class="diff"><img class="image-result" src="" +
+                    '<td class="expected result-container"><img class="image-result" src="" +
+                    '<td class="actual result-container"><img class="image-result" src="" +
+                    '<td class="diff result-container"><img class="image-result" src="" +
                 '</tr>' +
             '</tbody>' +
         '</table>' +
@@ -81,9 +81,9 @@
             '</thead>' +
             '<tbody>' +
                 '<tr>' +
-                    '<td class="expected"></td>' +
-                    '<td class="actual"></td>' +
-                    '<td class="diff"><iframe class="text-result" src="" +
+                    '<td class="expected result-container"></td>' +
+                    '<td class="actual result-container"></td>' +
+                    '<td class="diff result-container"><iframe class="text-result" src="" +
                 '</tr>' +
             '</tbody>' +
         '</table>');

Added: trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/styles/pixelzoomer.css (0 => 96906)


--- trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/styles/pixelzoomer.css	                        (rev 0)
+++ trunk/Tools/BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/styles/pixelzoomer.css	2011-10-07 05:42:57 UTC (rev 96906)
@@ -0,0 +1,63 @@
+/*
+ * Copyright (C) 2011 Google Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ *    notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ *    notice, this list of conditions and the following disclaimer in the
+ *    documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+.pixel-zoom-container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 96%;
+    margin: 10px;
+    padding: 10px;
+    display: -webkit-box;
+    display: -moz-box;
+    pointer-events: none;
+    background-color: silver;
+    border-radius: 20px;
+    border: 1px solid gray;
+    box-shadow: 0 0 5px rgba(0, 0, 0, 0.75);
+}
+
+.pixel-zoom-container > * {
+    -webkit-box-flex: 1;
+    -moz-box-flex: 1;
+    border: 1px solid black;
+    margin: 4px;
+    overflow: hidden;
+    background-color: white;
+}
+
+.pixel-zoom-container .scaled-image-container {
+    position: relative;
+    overflow: hidden;
+    width: 100%;
+    height: 400px;
+}
+
+.scaled-image-container > img {
+    position: absolute;
+    top: 0;
+    left: 0;
+    image-rendering: -webkit-optimize-contrast;
+}

Modified: trunk/Tools/ChangeLog (96905 => 96906)


--- trunk/Tools/ChangeLog	2011-10-07 05:22:58 UTC (rev 96905)
+++ trunk/Tools/ChangeLog	2011-10-07 05:42:57 UTC (rev 96906)
@@ -1,3 +1,34 @@
+2011-10-06  Adam Barth  <aba...@webkit.org>
+
+        Port PixelZoomer to work in garden-o-matic
+        https://bugs.webkit.org/show_bug.cgi?id=69577
+
+        Reviewed by David Levin.
+
+        This implementation of PixelZoomer is basically a fork of the
+        implementation used by results.html.  These two apps have different
+        requirements on where this code lives.  results.html wants to be
+        self-contained whereas garden-o-matic wants to live in the public_html
+        folder of the buildbot.  We could do something fancy here to share the
+        code, but that's not likely to be of much benefit.
+
+        I had to change a few things about pixelzoomer to accounter for the
+        differences in DOM between results.html and garden-o-matic, but
+        surprisingly little.  I also moved all the code into an anonymous
+        function, which is the style we're suing for module separation in
+        garden-o-matic.  Finally, some jQuery-ims snuck in because I didn't
+        want to drag along too many extra functions from results.html.
+
+        * BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/garden-o-matic.html:
+        * BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/garden-o-matic.js:
+        * BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/pixelzoomer.js: Added.
+        * BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/scripts/ui/results.js:
+        * BuildSlaveSupport/build.webkit.org-config/public_html/TestFailures/styles/pixelzoomer.css: Added.
+        (.pixel-zoom-container):
+        (.pixel-zoom-container > *):
+        (.pixel-zoom-container .scaled-image-container):
+        (.scaled-image-container > img):
+
 2011-10-06  Gyuyoung Kim  <gyuyoung....@samsung.com>
 
         [EFL] Change data type of parameter in ewk_view_viewport_attributes_get().
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
http://lists.webkit.org/mailman/listinfo.cgi/webkit-changes

Reply via email to