Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(1455)

Side by Side Diff: appengine/sheriff_o_matic/ui/ct-results-comparison.html

Issue 1315693002: SoM: upgrade Polymer from 0.5 to 1.0 Base URL: https://chromium.googlesource.com/infra/infra.git@master
Patch Set: get bower_components from polymer_1.0.4 Created 5 years, 4 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <!-- 1 <!--
2 Copyright 2014 The Chromium Authors. All rights reserved. 2 Copyright 2014 The Chromium Authors. All rights reserved.
3 Use of this source code is governed by a BSD-style license that can be 3 Use of this source code is governed by a BSD-style license that can be
4 found in the LICENSE file. 4 found in the LICENSE file.
5 --> 5 --><html><head><link rel="import" href="ct-results-comparison-zoomer.html">
6
7 <link rel="import" href="ct-results-comparison-zoomer.html">
8 <link rel="import" href="ct-test-output.html"> 6 <link rel="import" href="ct-test-output.html">
9 7
10 <polymer-element name="ct-results-comparison" attributes="type expectedUrl actua lUrl diffUrl"> 8 <dom-module id="ct-results-comparison">
11 <template> 9 <style>
12 <style>
13 .main-content { 10 .main-content {
14 display: flex; 11 display: flex;
15 flex-wrap: wrap; 12 flex-wrap: wrap;
16 width: 100%; 13 width: 100%;
17 } 14 }
18 15
19 .main-content > * { 16 .main-content > * {
20 flex: 1; 17 flex: 1;
21 min-width: 300px; 18 min-width: 300px;
22 } 19 }
23 </style> 20 </style>
21 <template>
24 22
25 <div class="main-content"> 23 <div class="main-content">
26 <div> 24 <div>
27 <h2>Expected</h2> 25 <h2>Expected</h2>
28 <ct-test-output type="{{ type }}" url="{{ expectedUrl }}" 26 <ct-test-output type="{{ type }}" url="{{ expectedUrl }}" on-mouseout=" _handleMouseOut " on-mousemove=" _handleMouseMove "></ct-test-output>
29 on-mouseout="{{ _handleMouseOut }}" on-mousemove="{{ _handleMouseMo ve }}"></ct-test-output>
30 </div> 27 </div>
31 <div> 28 <div>
32 <h2>Actual</h2> 29 <h2>Actual</h2>
33 <ct-test-output type="{{ type }}" url="{{ actualUrl }}" 30 <ct-test-output type="{{ type }}" url="{{ actualUrl }}" on-mouseout=" _h andleMouseOut " on-mousemove=" _handleMouseMove "></ct-test-output>
34 on-mouseout="{{ _handleMouseOut }}" on-mousemove="{{ _handleMouseMo ve }}"></ct-test-output>
35 </div> 31 </div>
36 <div> 32 <div>
37 <h2>Diff</h2> 33 <h2>Diff</h2>
38 <ct-test-output type="{{ type }}" url="{{ diffUrl }}" 34 <ct-test-output type="{{ type }}" url="{{ diffUrl }}" on-mouseout=" _han dleMouseOut " on-mousemove=" _handleMouseMove "></ct-test-output>
39 on-mouseout="{{ _handleMouseOut }}" on-mousemove="{{ _handleMouseMo ve }}"></ct-test-output>
40 </div> 35 </div>
41 </div> 36 </div>
42 37
43 <template if="{{ _zoomPosition }}"> 38 <template is="dom-if" if="{{ _zoomPosition }}">
44 <ct-results-comparison-zoomer 39 <ct-results-comparison-zoomer expectedurl="{{ expectedUrl }}" actualurl="{ { actualUrl }}" diffurl="{{ diffUrl }}" position="{{ _zoomPosition }}"></ct-resu lts-comparison-zoomer>
45 expectedUrl="{{ expectedUrl }}"
46 actualUrl="{{ actualUrl }}"
47 diffUrl="{{ diffUrl }}"
48 position="{{ _zoomPosition }}"></ct-results-comparison-zoomer>
49 </template> 40 </template>
50 </template> 41 </template>
51 <script> 42 <script>
52 Polymer({ 43 Polymer({
53 type: '', 44 is: 'ct-results-comparison',
54 expectedUrl: '', 45 properties: {
55 actualUrl: '', 46 _zoomPosition: { value: null },
56 diffUrl: '', 47 actualUrl: {
57 _zoomPosition: null, 48 type: String,
58 49 value: '',
59 typeChanged: function() { 50 notify: true
51 },
52 diffUrl: {
53 type: String,
54 value: '',
55 notify: true
56 },
57 expectedUrl: {
58 type: String,
59 value: '',
60 notify: true
61 },
62 type: {
63 type: String,
64 value: '',
65 notify: true,
66 observer: 'typeChanged'
67 }
68 },
69 typeChanged: function () {
60 this._zoomPosition = null; 70 this._zoomPosition = null;
61 }, 71 },
62 72 _handleMouseOut: function (e) {
63 _handleMouseOut: function(e) {
64 this._zoomPosition = null; 73 this._zoomPosition = null;
65 }, 74 },
66 75 _handleMouseMove: function (e) {
67 _handleMouseMove: function(e) {
68 if (this.type != 'image') 76 if (this.type != 'image')
69 return; 77 return;
70
71 // FIXME: This assumes that the ct-test-output only contains an image. 78 // FIXME: This assumes that the ct-test-output only contains an image.
72 var targetLocation = e.target.getBoundingClientRect(); 79 var targetLocation = e.target.getBoundingClientRect();
73 // FIXME: Use a proper model class instead of a dumb object. 80 // FIXME: Use a proper model class instead of a dumb object.
74 this._zoomPosition = { 81 this._zoomPosition = {
75 x: (e.clientX - targetLocation.left) / targetLocation.width, 82 x: (e.clientX - targetLocation.left) / targetLocation.width,
76 y: (e.clientY - targetLocation.top) / targetLocation.height, 83 y: (e.clientY - targetLocation.top) / targetLocation.height
77 }; 84 };
78 }, 85 }
79 }); 86 });
80 </script> 87 </script>
81 </polymer-element> 88 </dom-module>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698