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

Unified Diff: chrome/browser/resources/file_manager/js/ui/search_box.js

Issue 39123003: [Files.app] Split the JavaScript files into subdirectories: common, background, and foreground (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: fixed test failure. Created 7 years, 2 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 side-by-side diff with in-line comments
Download patch
Index: chrome/browser/resources/file_manager/js/ui/search_box.js
diff --git a/chrome/browser/resources/file_manager/js/ui/search_box.js b/chrome/browser/resources/file_manager/js/ui/search_box.js
deleted file mode 100644
index edc638a5a688368626f25f20deed435f4f6c92e1..0000000000000000000000000000000000000000
--- a/chrome/browser/resources/file_manager/js/ui/search_box.js
+++ /dev/null
@@ -1,202 +0,0 @@
-// Copyright 2013 The Chromium Authors. All rights reserved.
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-
-'use strict';
-
-/**
- * Search box.
- *
- * @param {element} element Root element of the search box.
- * @constructor
- */
-function SearchBox(element) {
- /**
- * Autocomplete List.
- * @type {AutocompleteList}
- */
- this.autocompleteList = new SearchBox.AutocompleteList(element.ownerDocument);
-
- /**
- * Root element of the search box.
- * @type {HTMLElement}
- */
- this.element = element;
-
- /**
- * Text input of the search box.
- * @type {HTMLElement}
- */
- this.inputElement = element.querySelector('input');
-
- /**
- * Clear button of the search box.
- * @type {HTMLElement}
- */
- this.clearButton = element.querySelector('.clear');
-
- /**
- * Text measure.
- * @type {TextMeasure}
- * @private
- */
- this.textMeasure_ = new TextMeasure(this.inputElement);
-
- Object.freeze(this);
-
- // Register events.
- this.inputElement.addEventListener('input', this.updateStyles_.bind(this));
- this.inputElement.addEventListener('keydown', this.onKeyDown_.bind(this));
- this.inputElement.addEventListener('focus', this.onFocus_.bind(this));
- this.inputElement.addEventListener('blur', this.onBlur_.bind(this));
- element.querySelector('.icon').addEventListener(
- 'click', this.onIconClick_.bind(this));
- element.parentNode.appendChild(this.autocompleteList);
-}
-
-/**
- * Autocomplete list for search box.
- * @param {HTMLDocument} document Document.
- * @constructor
- */
-SearchBox.AutocompleteList = function(document) {
- var self = cr.ui.AutocompleteList.call(this);
- self.__proto__ = SearchBox.AutocompleteList.prototype;
- self.id = 'autocomplete-list';
- self.autoExpands = true;
- self.itemConstructor = SearchBox.AutocompleteListItem_.bind(null, document);
- self.addEventListener('mouseover', self.onMouseOver_.bind(self));
- return self;
-};
-
-SearchBox.AutocompleteList.prototype = {
- __proto__: cr.ui.AutocompleteList.prototype
-};
-
-/**
- * Do nothing when a suggestion is selected.
- * @override
- */
-SearchBox.AutocompleteList.prototype.handleSelectedSuggestion = function() {};
-
-/**
- * Change the selection by a mouse over instead of just changing the
- * color of moused over element with :hover in CSS. Here's why:
- *
- * 1) The user selects an item A with up/down keys (item A is highlighted)
- * 2) Then the user moves the cursor to another item B
- *
- * If we just change the color of moused over element (item B), both
- * the item A and B are highlighted. This is bad. We should change the
- * selection so only the item B is highlighted.
- *
- * @param {Event} event Event.
- * @private
- */
-SearchBox.AutocompleteList.prototype.onMouseOver_ = function(event) {
- if (event.target.itemInfo)
- this.selectedItem = event.target.itemInfo;
-};
-
-/**
- * ListItem element for autocomple.
- *
- * @param {HTMLDocument} document Document.
- * @param {Object} item An object representing a suggestion.
- * @constructor
- * @private
- */
-SearchBox.AutocompleteListItem_ = function(document, item) {
- var li = new cr.ui.ListItem();
- li.itemInfo = item;
-
- var icon = document.createElement('div');
- icon.className = 'detail-icon';
-
- var text = document.createElement('div');
- text.className = 'detail-text';
-
- if (item.isHeaderItem) {
- icon.setAttribute('search-icon');
- text.innerHTML =
- strf('SEARCH_DRIVE_HTML', util.htmlEscape(item.searchQuery));
- } else {
- var iconType = FileType.getIcon(item.entry);
- icon.setAttribute('file-type-icon', iconType);
- // highlightedBaseName is a piece of HTML with meta characters properly
- // escaped. See the comment at fileBrowserPrivate.searchDriveMetadata().
- text.innerHTML = item.highlightedBaseName;
- }
- li.appendChild(icon);
- li.appendChild(text);
- return li;
-};
-
-/**
- * Updates the size related style.
- */
-SearchBox.prototype.updateSizeRelatedStyle = function() {
- // Hide the search box if there is not enough space.
- this.element.classList.toggle(
- 'too-short',
- this.element.clientWidth < 100);
-};
-
-/**
- * Clears the search query.
- */
-SearchBox.prototype.clear = function() {
- this.inputElement.value = '';
- this.updateStyles_();
-};
-
-/**
- * Handles a focus event of the search box.
- * @private
- */
-SearchBox.prototype.onFocus_ = function() {
- this.element.classList.toggle('has-cursor', true);
- this.inputElement.tabIndex = '99'; // See: go/filesapp-tabindex.
- this.autocompleteList.attachToInput(this.inputElement);
-};
-
-/**
- * Handles a blur event of the search box.
- * @private
- */
-SearchBox.prototype.onBlur_ = function() {
- this.element.classList.toggle('has-cursor', false);
- this.inputElement.tabIndex = '-1';
- this.autocompleteList.detach();
-};
-
-/**
- * Handles a keydown event of the search box.
- * @private
- */
-SearchBox.prototype.onKeyDown_ = function() {
- // Handle only Esc key now.
- if (event.keyCode != 27 || this.inputElement.value)
- return;
- this.inputElement.blur();
-};
-
-/**
- * Handles a click event of the search icon.
- * @private
- */
-SearchBox.prototype.onIconClick_ = function() {
- this.inputElement.focus();
-};
-
-/**
- * Updates styles of the search box.
- * @private
- */
-SearchBox.prototype.updateStyles_ = function() {
- this.element.classList.toggle('has-text',
- !!this.inputElement.value);
- var width = this.textMeasure_.getWidth(this.inputElement.value) +
- 16 /* Extra space to allow leeway. */;
- this.inputElement.style.width = width + 'px';
-};

Powered by Google App Engine
This is Rietveld 408576698