OLD | NEW |
1 // Copyright (c) 2011 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2011 The Chromium Authors. All rights reserved. |
2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | 4 |
5 cr.define('ntp4', function() { | 5 cr.define('ntp4', function() { |
6 'use strict'; | 6 'use strict'; |
7 | 7 |
8 var localStrings = new LocalStrings; | 8 var localStrings = new LocalStrings; |
9 | 9 |
10 /** | 10 /** |
(...skipping 41 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
52 title.textContent = this.data.title; | 52 title.textContent = this.data.title; |
53 | 53 |
54 if (this.data.url) { | 54 if (this.data.url) { |
55 var button = this.querySelector('.button'); | 55 var button = this.querySelector('.button'); |
56 button.href = title.href = this.data.url; | 56 button.href = title.href = this.data.url; |
57 } | 57 } |
58 | 58 |
59 var faviconDiv = this.querySelector('.favicon'); | 59 var faviconDiv = this.querySelector('.favicon'); |
60 var faviconUrl; | 60 var faviconUrl; |
61 if (this.data.url) { | 61 if (this.data.url) { |
62 faviconUrl = 'chrome://favicon/size/16/' + this.data.url; | 62 faviconUrl = 'chrome://favicon/size/32/' + this.data.url; |
63 chrome.send('getFaviconDominantColor', | 63 chrome.send('getFaviconDominantColor', |
64 [faviconUrl, id, 'ntp4.setBookmarksFaviconDominantColor']); | 64 [faviconUrl, id, 'ntp4.setBookmarksFaviconDominantColor']); |
65 } else { | 65 } else { |
| 66 // TODO(csilv): We need a large (32px) icon for this URL. |
66 faviconUrl = 'chrome://theme/IDR_BOOKMARK_BAR_FOLDER'; | 67 faviconUrl = 'chrome://theme/IDR_BOOKMARK_BAR_FOLDER'; |
67 // TODO(csilv): Should we vary this color by platform? | 68 // TODO(csilv): Should we vary this color by platform? |
68 this.stripeColor = '#919191'; | 69 this.stripeColor = '#919191'; |
69 } | 70 } |
70 faviconDiv.style.backgroundImage = url(faviconUrl); | 71 faviconDiv.style.backgroundImage = url(faviconUrl); |
71 | 72 |
72 this.addEventListener('click', this.handleClick_.bind(this)); | 73 this.addEventListener('click', this.handleClick_.bind(this)); |
73 }, | 74 }, |
74 | 75 |
75 /** | 76 /** |
76 * Sets the color of the favicon dominant color bar. | 77 * Sets the color of the favicon dominant color bar. |
77 * @param {string} color The css-parsable value for the color. | 78 * @param {string} color The css-parsable value for the color. |
78 */ | 79 */ |
79 set stripeColor(color) { | 80 set stripeColor(color) { |
80 this.querySelector('.color-stripe').style.backgroundColor = color; | 81 this.querySelector('.color-stripe').style.backgroundColor = color; |
81 }, | 82 }, |
82 | 83 |
83 /** | 84 /** |
84 * Set the size and position of the bookmark tile. | 85 * Set the size and position of the bookmark tile. |
85 * @param {number} size The total size of |this|. | 86 * @param {number} size The total size of |this|. |
86 * @param {number} x The x-position. | 87 * @param {number} x The x-position. |
87 * @param {number} y The y-position. | 88 * @param {number} y The y-position. |
88 * animate. | 89 * animate. |
89 */ | 90 */ |
90 setBounds: function(size, x, y) { | 91 setBounds: function(size, x, y) { |
91 this.style.width = size + 'px'; | 92 this.style.width = this.style.height = size + 'px'; |
92 this.style.height = heightForWidth(size) + 'px'; | |
93 | |
94 this.style.left = x + 'px'; | 93 this.style.left = x + 'px'; |
95 this.style.right = x + 'px'; | |
96 this.style.top = y + 'px'; | 94 this.style.top = y + 'px'; |
97 }, | 95 }, |
98 | 96 |
99 /** | 97 /** |
100 * Invoked when a bookmark is clicked | 98 * Invoked when a bookmark is clicked |
101 * @param {Event} e The click event. | 99 * @param {Event} e The click event. |
102 * @private | 100 * @private |
103 */ | 101 */ |
104 handleClick_: function(e) { | 102 handleClick_: function(e) { |
105 if (e.target.classList.contains('close-button')) { | 103 if (e.target.classList.contains('close-button')) { |
(...skipping 62 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
168 maxColCount: 6, | 166 maxColCount: 6, |
169 | 167 |
170 // The smallest a tile can be. | 168 // The smallest a tile can be. |
171 minTileWidth: 150, | 169 minTileWidth: 150, |
172 // The biggest a tile can be. | 170 // The biggest a tile can be. |
173 maxTileWidth: 150, | 171 maxTileWidth: 150, |
174 }; | 172 }; |
175 TilePage.initGridValues(bookmarksPageGridValues); | 173 TilePage.initGridValues(bookmarksPageGridValues); |
176 | 174 |
177 /** | 175 /** |
178 * Calculates the height for a bookmarks tile for a given width. The size | |
179 * is based on a desired size of 96x72 ratio. | |
180 * @return {number} The height. | |
181 */ | |
182 function heightForWidth(width) { | |
183 // The 2s are for borders, the 31 is for the title. | |
184 return (width - 2) * 72 / 96 + 2 + 31; | |
185 } | |
186 | |
187 /** | |
188 * Creates a new BookmarksPage object. | 176 * Creates a new BookmarksPage object. |
189 * @constructor | 177 * @constructor |
190 * @extends {TilePage} | 178 * @extends {TilePage} |
191 */ | 179 */ |
192 function BookmarksPage() { | 180 function BookmarksPage() { |
193 var el = new TilePage(bookmarksPageGridValues); | 181 var el = new TilePage(bookmarksPageGridValues); |
194 el.__proto__ = BookmarksPage.prototype; | 182 el.__proto__ = BookmarksPage.prototype; |
195 el.initialize(); | 183 el.initialize(); |
196 | 184 |
197 return el; | 185 return el; |
(...skipping 82 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
280 } | 268 } |
281 } | 269 } |
282 return false; | 270 return false; |
283 }, | 271 }, |
284 | 272 |
285 /** @inheritDoc */ | 273 /** @inheritDoc */ |
286 shouldAcceptDrag: function(dataTransfer) { | 274 shouldAcceptDrag: function(dataTransfer) { |
287 return false; | 275 return false; |
288 }, | 276 }, |
289 | 277 |
290 /** @inheritDoc */ | |
291 heightForWidth: heightForWidth, | |
292 | |
293 /** | 278 /** |
294 * Invoked before a batch import begins. We will ignore added/changed | 279 * Invoked before a batch import begins. We will ignore added/changed |
295 * notifications while the operation is in progress. | 280 * notifications while the operation is in progress. |
296 */ | 281 */ |
297 bookmarkImportBegan: function() { | 282 bookmarkImportBegan: function() { |
298 this.importing = true; | 283 this.importing = true; |
299 }, | 284 }, |
300 | 285 |
301 /** | 286 /** |
302 * Invoked after a batch import finishes. We will reload the bookmarks | 287 * Invoked after a batch import finishes. We will reload the bookmarks |
(...skipping 154 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
457 }; | 442 }; |
458 | 443 |
459 return { | 444 return { |
460 BookmarksPage: BookmarksPage, | 445 BookmarksPage: BookmarksPage, |
461 initBookmarkChevron: initBookmarkChevron, | 446 initBookmarkChevron: initBookmarkChevron, |
462 setBookmarksFaviconDominantColor: setBookmarksFaviconDominantColor | 447 setBookmarksFaviconDominantColor: setBookmarksFaviconDominantColor |
463 }; | 448 }; |
464 }); | 449 }); |
465 | 450 |
466 window.addEventListener('load', ntp4.initBookmarkChevron); | 451 window.addEventListener('load', ntp4.initBookmarkChevron); |
OLD | NEW |