| OLD | NEW |
| 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-popout-iframe.html"> |
| 6 | |
| 7 <link rel="import" href="ct-popout-iframe.html"> | |
| 8 <link rel="import" href="ct-user-prefs.html"> | 6 <link rel="import" href="ct-user-prefs.html"> |
| 9 <polymer-element name="ct-test-output" attributes="type url"> | 7 <!-- |
| 10 <template> | 8 TODO(polyup): unable to infer path to components |
| 11 <style> | 9 directory. This import path is probably incomplete. |
| 10 --> |
| 11 <link rel="import" href="iron-flex-layout/iron-flex-layout.html"> |
| 12 <dom-module id="ct-test-output"> |
| 13 <style> |
| 14 /* TODO(polyup): For speed, consider reworking these styles with .classes |
| 15 and #ids rather than [attributes]. |
| 16 */ |
| 17 [layout] { |
| 18 @apply(--layout); |
| 19 } |
| 20 [layout][vertical] { |
| 21 @apply(--layout-vertical); |
| 22 } |
| 23 [layout][flex] { |
| 24 @apply(--layout-flex); |
| 25 } |
| 26 </style> |
| 27 <style> |
| 12 .result { | 28 .result { |
| 13 border: 1px solid gray; | 29 border: 1px solid gray; |
| 14 line-height: 0; | 30 line-height: 0; |
| 15 } | 31 } |
| 16 img { | 32 img { |
| 17 width: 100%; | 33 width: 100%; |
| 18 } | 34 } |
| 19 ct-popout-iframe { | 35 ct-popout-iframe { |
| 20 height: 400px; | 36 height: 400px; |
| 21 } | 37 } |
| 22 </style> | 38 </style> |
| 39 <template> |
| 23 | 40 |
| 24 <ct-user-prefs id="userPrefs"></ct-user-prefs> | 41 <ct-user-prefs id="userPrefs"></ct-user-prefs> |
| 25 <div class="result" flex layout vertical> | 42 <div class="result" flex="" layout="" vertical=""> |
| 26 <template if="{{url}}"> | 43 <template is="dom-if" if="{{url}}"> |
| 27 <template if="{{type == _kImageType}}"> | 44 <template is="dom-if" if="{{computeIf(_kImageType, type)}}"> |
| 28 <img src="{{url}}"> | 45 <img src="{{url}}"> |
| 29 </template> | 46 </template> |
| 30 <template if="{{type == _kTextType}}"> | 47 <template is="dom-if" if="{{computeIf2(_kTextType, type)}}"> |
| 31 <ct-popout-iframe src="{{ {url: url, useUber: $.userPrefs.va
lues.useUberchromegw} | rewriteUrl }}" flex></ct-popout-iframe> | 48 <ct-popout-iframe src="{{computeSrc($, url)}}" flex=""></ct-
popout-iframe> |
| 32 </template> | 49 </template> |
| 33 <template if="{{type == _kAudioType}}"> | 50 <template is="dom-if" if="{{computeIf3(_kAudioType, type)}}"> |
| 34 <audio controls src="{{url}}"></audio> | 51 <audio controls="" src="{{url}}"></audio> |
| 35 </template> | 52 </template> |
| 36 </template> | 53 </template> |
| 37 </div> | 54 </div> |
| 38 </template> | 55 </template> |
| 39 <script> | 56 <script> |
| 40 Polymer({ | 57 Polymer({ |
| 41 type: '', | 58 is: 'ct-test-output', |
| 42 url: '', | 59 properties: { |
| 43 rewriteUrl: function(props) { | 60 type: { |
| 44 if (this.$ && this.$.userPrefs) { | 61 type: String, |
| 45 return this.$.userPrefs.rewriteUrl(props.url); | 62 value: '', |
| 46 } | 63 notify: true |
| 47 return props.url; | 64 }, |
| 48 }, | 65 url: { |
| 49 _kAudioType: results.kAudioType, | 66 type: String, |
| 50 _kImageType: results.kImageType, | 67 value: '', |
| 51 _kTextType: results.kTextType, | 68 notify: true |
| 69 } |
| 70 }, |
| 71 rewriteUrl: function (props) { |
| 72 if (this.$ && this.$.userPrefs) { |
| 73 return this.$.userPrefs.rewriteUrl(props.url); |
| 74 } |
| 75 return props.url; |
| 76 }, |
| 77 _kAudioType: results.kAudioType, |
| 78 _kImageType: results.kImageType, |
| 79 _kTextType: results.kTextType, |
| 80 computeIf: function (_kImageType, type) { |
| 81 return type == _kImageType; |
| 82 }, |
| 83 computeIf2: function (_kTextType, type) { |
| 84 return type == _kTextType; |
| 85 }, |
| 86 computeIf3: function (_kAudioType, type) { |
| 87 return type == _kAudioType; |
| 88 }, |
| 89 computeSrc: function ($, url) { |
| 90 return this.rewriteUrl({ |
| 91 url: url, |
| 92 useUber: $.userPrefs.values.useUberchromegw |
| 52 }); | 93 }); |
| 53 </script> | 94 } |
| 54 </polymer-element> | 95 }); |
| 96 </script> |
| 97 </dom-module> |
| OLD | NEW |