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

Side by Side Diff: third_party/polymer/v1_0/components-chromium/iron-image/iron-image-extracted.js

Issue 1187823002: Update Polymer components and re-run reproduce.sh (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Rebase Created 5 years, 6 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 2
3 Polymer({ 3 Polymer({
4 4
5 is: 'iron-image', 5 is: 'iron-image',
6 6
7 properties: { 7 properties: {
8 /** 8 /**
9 * The URL of an image. 9 * The URL of an image.
10 *
11 * @attribute src
12 * @type string
13 * @default ''
14 */ 10 */
15 src: { 11 src: {
16 observer: '_srcChanged', 12 observer: '_srcChanged',
17 type: String, 13 type: String,
18 value: '' 14 value: ''
19 }, 15 },
20 16
21 /** 17 /**
22 * When true, the image is prevented from loading and any placeholder is 18 * When true, the image is prevented from loading and any placeholder is
23 * shown. This may be useful when a binding to the src property is known to 19 * shown. This may be useful when a binding to the src property is known to
24 * be invalid, to prevent 404 requests. 20 * be invalid, to prevent 404 requests.
25 *
26 * @attribute preventLoad
27 * @type boolean
28 * @default false
29 */ 21 */
30 preventLoad: { 22 preventLoad: {
31 type: Boolean, 23 type: Boolean,
32 value: false 24 value: false
33 }, 25 },
34 26
35 /** 27 /**
36 * Sets a sizing option for the image. Valid values are `contain` (full 28 * Sets a sizing option for the image. Valid values are `contain` (full
37 * aspect ratio of the image is contained within the element and 29 * aspect ratio of the image is contained within the element and
38 * letterboxed) or `cover` (image is cropped in order to fully cover the 30 * letterboxed) or `cover` (image is cropped in order to fully cover the
39 * bounds of the element), or `null` (default: image takes natural size). 31 * bounds of the element), or `null` (default: image takes natural size).
40 *
41 * @attribute sizing
42 * @type string
43 * @default null
44 */ 32 */
45 sizing: { 33 sizing: {
46 type: String, 34 type: String,
47 value: null 35 value: null
48 }, 36 },
49 37
50 /** 38 /**
51 * When a sizing option is uzed (`cover` or `contain`), this determines 39 * When a sizing option is uzed (`cover` or `contain`), this determines
52 * how the image is aligned within the element bounds. 40 * how the image is aligned within the element bounds.
53 *
54 * @attribute position
55 * @type string
56 * @default 'center'
57 */ 41 */
58 position: { 42 position: {
59 type: String, 43 type: String,
60 value: 'center' 44 value: 'center'
61 }, 45 },
62 46
63 /** 47 /**
64 * When `true`, any change to the `src` property will cause the `placehold er` 48 * When `true`, any change to the `src` property will cause the `placehold er`
65 * image to be shown until the 49 * image to be shown until the
66 *
67 * @attribute preload
68 * @type boolean
69 * @default false
70 */ 50 */
71 preload: { 51 preload: {
72 type: Boolean, 52 type: Boolean,
73 value: false 53 value: false
74 }, 54 },
75 55
76 /** 56 /**
77 * This image will be used as a background/placeholder until the src image has 57 * This image will be used as a background/placeholder until the src image has
78 * loaded. Use of a data-URI for placeholder is encouraged for instant re ndering. 58 * loaded. Use of a data-URI for placeholder is encouraged for instant re ndering.
79 *
80 * @attribute placeholder
81 * @type string
82 * @default null
83 */ 59 */
84 placeholder: { 60 placeholder: {
85 type: String, 61 type: String,
86 value: null 62 value: null
87 }, 63 },
88 64
89 /** 65 /**
90 * When `preload` is true, setting `fade` to true will cause the image to 66 * When `preload` is true, setting `fade` to true will cause the image to
91 * fade into place. 67 * fade into place.
92 *
93 * @attribute fade
94 * @type boolean
95 * @default false
96 */ 68 */
97 fade: { 69 fade: {
98 type: Boolean, 70 type: Boolean,
99 value: false 71 value: false
100 }, 72 },
101 73
102 /** 74 /**
103 * Read-only value that is true when the image is loaded. 75 * Read-only value that is true when the image is loaded.
104 *
105 * @attribute preloaded
106 * @type boolean
107 * @default false
108 */ 76 */
109 loaded: { 77 loaded: {
110 notify: true, 78 notify: true,
111 type: Boolean, 79 type: Boolean,
112 value: false 80 value: false
113 }, 81 },
114 82
115 /** 83 /**
116 * Read-only value that tracks the loading state of the image when the `pr eload` 84 * Read-only value that tracks the loading state of the image when the `pr eload`
117 * option is used. 85 * option is used.
118 *
119 * @attribute loading
120 * @type boolean
121 * @default false
122 */ 86 */
123 loading: { 87 loading: {
124 notify: true, 88 notify: true,
125 type: Boolean, 89 type: Boolean,
126 value: false 90 value: false
127 }, 91 },
128 92
129 /** 93 /**
130 * Can be used to set the width of image (e.g. via binding); size may also be 94 * Can be used to set the width of image (e.g. via binding); size may also be
131 * set via CSS. 95 * set via CSS.
132 *
133 * @attribute width
134 * @type number
135 * @default null
136 */ 96 */
137 width: { 97 width: {
138 observer: '_widthChanged', 98 observer: '_widthChanged',
139 type: Number, 99 type: Number,
140 value: null 100 value: null
141 }, 101 },
142 102
143 /** 103 /**
144 * Can be used to set the height of image (e.g. via binding); size may als o be 104 * Can be used to set the height of image (e.g. via binding); size may als o be
145 * set via CSS. 105 * set via CSS.
(...skipping 94 matching lines...) Expand 10 before | Expand all | Expand 10 after
240 }, 200 },
241 201
242 _transformChanged: function() { 202 _transformChanged: function() {
243 var placeholderStyle = this.$.placeholder.style; 203 var placeholderStyle = this.$.placeholder.style;
244 204
245 this.style.backgroundSize = 205 this.style.backgroundSize =
246 placeholderStyle.backgroundSize = this.sizing; 206 placeholderStyle.backgroundSize = this.sizing;
247 207
248 this.style.backgroundPosition = 208 this.style.backgroundPosition =
249 placeholderStyle.backgroundPosition = 209 placeholderStyle.backgroundPosition =
250 this.sizing ? this.position : null; 210 this.sizing ? this.position : '';
251 211
252 this.style.backgroundRepeat = 212 this.style.backgroundRepeat =
253 placeholderStyle.backgroundRepeat = 213 placeholderStyle.backgroundRepeat =
254 this.sizing ? 'no-repeat' : null; 214 this.sizing ? 'no-repeat' : '';
255 }, 215 },
256 216
257 _loadBehaviorChanged: function() { 217 _loadBehaviorChanged: function() {
258 var img; 218 var img;
259 219
260 if (!this.canLoad) { 220 if (!this.canLoad) {
261 return; 221 return;
262 } 222 }
263 223
264 if (this.requiresPreload) { 224 if (this.requiresPreload) {
(...skipping 17 matching lines...) Expand all
282 } 242 }
283 243
284 if (this.sizing) { 244 if (this.sizing) {
285 this.style.backgroundImage = this.src ? 'url(' + this.src + ')': ''; 245 this.style.backgroundImage = this.src ? 'url(' + this.src + ')': '';
286 } else { 246 } else {
287 this.$.img.src = this.src || ''; 247 this.$.img.src = this.src || '';
288 } 248 }
289 } 249 }
290 }); 250 });
291 251
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698