OLD | NEW |
1 // Copyright (c) 2013 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2013 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 /** | 5 /** |
6 * @fileoverview The section of the history page that shows tabs from sessions | 6 * @fileoverview The section of the history page that shows tabs from sessions |
7 on other devices. | 7 on other devices. |
8 */ | 8 */ |
9 | 9 |
10 /////////////////////////////////////////////////////////////////////////////// | 10 /////////////////////////////////////////////////////////////////////////////// |
(...skipping 409 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
420 DevicesView.prototype.increaseRowHeight = function(row, height) { | 420 DevicesView.prototype.increaseRowHeight = function(row, height) { |
421 for (var i = this.rowHeights_.length; i <= row; i++) | 421 for (var i = this.rowHeights_.length; i <= row; i++) |
422 this.rowHeights_.push(NB_ENTRIES_OTHER_ROWS_COLUMN); | 422 this.rowHeights_.push(NB_ENTRIES_OTHER_ROWS_COLUMN); |
423 this.rowHeights_[row] += height; | 423 this.rowHeights_[row] += height; |
424 this.displayResults_(); | 424 this.displayResults_(); |
425 }; | 425 }; |
426 | 426 |
427 // DevicesView, Private ------------------------------------------------------- | 427 // DevicesView, Private ------------------------------------------------------- |
428 | 428 |
429 /** | 429 /** |
| 430 * Provides an implementation for a single column grid. |
| 431 * @param {Node} boundary Focus events are ignored outside of this node. |
| 432 * @param {Element} rowElement The element representing this row. |
| 433 * @extends {cr.ui.FocusRow} |
| 434 */ |
| 435 DevicesView.SingleColumnFocusRow = function(boundary, rowElement) { |
| 436 cr.ui.FocusRow.apply(this, arguments); |
| 437 this.setFocusableElement(rowElement); |
| 438 }; |
| 439 |
| 440 DevicesView.SingleColumnFocusRow.prototype = { |
| 441 __proto__: cr.ui.FocusRow.prototype, |
| 442 |
| 443 /** @override */ |
| 444 getEquivalentElement: function(element) { |
| 445 return this.rowElement_; |
| 446 }, |
| 447 }; |
| 448 |
| 449 /** |
430 * Update the page with results. | 450 * Update the page with results. |
431 * @private | 451 * @private |
432 */ | 452 */ |
433 DevicesView.prototype.displayResults_ = function() { | 453 DevicesView.prototype.displayResults_ = function() { |
434 this.clearDOM(); | 454 this.clearDOM(); |
435 var resultsFragment = document.createDocumentFragment(); | 455 var resultsFragment = document.createDocumentFragment(); |
436 if (this.devices_.length == 0) | 456 if (this.devices_.length == 0) |
437 return; | 457 return; |
438 | 458 |
439 // We'll increase to 0 as we create the first row. | 459 // We'll increase to 0 as we create the first row. |
(...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
472 if (tabs[i].scrollWidth <= tabs[i].clientWidth) | 492 if (tabs[i].scrollWidth <= tabs[i].clientWidth) |
473 tabs[i].title = ''; | 493 tabs[i].title = ''; |
474 } | 494 } |
475 | 495 |
476 this.resultDiv_.appendChild( | 496 this.resultDiv_.appendChild( |
477 createElementWithClassName('div', 'other-devices-bottom')); | 497 createElementWithClassName('div', 'other-devices-bottom')); |
478 | 498 |
479 this.focusGrids_.forEach(function(grid) { grid.destroy(); }); | 499 this.focusGrids_.forEach(function(grid) { grid.destroy(); }); |
480 this.focusGrids_.length = 0; | 500 this.focusGrids_.length = 0; |
481 | 501 |
482 var singleColumn = function(e) { return [e]; }; | |
483 | |
484 var devices = this.resultDiv_.querySelectorAll('.device-contents'); | 502 var devices = this.resultDiv_.querySelectorAll('.device-contents'); |
485 for (var i = 0; i < devices.length; ++i) { | 503 for (var i = 0; i < devices.length; ++i) { |
486 var rows = devices[i].querySelectorAll('.device-tab-entry, button'); | 504 var rows = devices[i].querySelectorAll('.device-tab-entry, button'); |
487 if (!rows.length) | 505 if (!rows.length) |
488 continue; | 506 continue; |
489 | 507 |
490 var grid = new cr.ui.FocusGrid(devices[i]); | 508 var grid = new cr.ui.FocusGrid(); |
491 grid.setGrid(Array.prototype.map.call(rows, singleColumn)); | 509 for (var i = 0; i < rows.length; ++i) |
| 510 grid.addRow(new DevicesView.SingleColumnFocusRow(devices[i], rows[i])); |
492 this.focusGrids_.push(grid); | 511 this.focusGrids_.push(grid); |
493 } | 512 } |
494 }; | 513 }; |
495 | 514 |
496 /** | 515 /** |
497 * Sets the menu model data. An empty list means that either there are no | 516 * Sets the menu model data. An empty list means that either there are no |
498 * foreign sessions, or tab sync is disabled for this profile. | 517 * foreign sessions, or tab sync is disabled for this profile. |
499 * |isTabSyncEnabled| makes it possible to distinguish between the cases. | 518 * |isTabSyncEnabled| makes it possible to distinguish between the cases. |
500 * | 519 * |
501 * @param {Array} sessionList Array of objects describing the sessions | 520 * @param {Array} sessionList Array of objects describing the sessions |
(...skipping 48 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
550 | 569 |
551 var doSearch = function(e) { | 570 var doSearch = function(e) { |
552 devicesView.setSearchText($('search-field').value); | 571 devicesView.setSearchText($('search-field').value); |
553 }; | 572 }; |
554 $('search-field').addEventListener('search', doSearch); | 573 $('search-field').addEventListener('search', doSearch); |
555 $('search-button').addEventListener('click', doSearch); | 574 $('search-button').addEventListener('click', doSearch); |
556 } | 575 } |
557 | 576 |
558 // Add handlers to HTML elements. | 577 // Add handlers to HTML elements. |
559 document.addEventListener('DOMContentLoaded', load); | 578 document.addEventListener('DOMContentLoaded', load); |
OLD | NEW |