Chromium Code Reviews| OLD | NEW |
|---|---|
| (Empty) | |
| 1 // Copyright 2012 The Chromium Authors. All rights reserved. | |
| 2 // Use of this source code is governed by a BSD-style license that can be | |
| 3 // found in the LICENSE file. | |
| 4 | |
| 5 // ============================================================================= | |
| 6 // Util functions | |
| 7 // ============================================================================= | |
| 8 | |
| 9 // The maximum number of suggestions to show. | |
| 10 var MAX_SUGGESTIONS_TO_SHOW = 5; | |
| 11 | |
| 12 /** | |
| 13 * Displays a suggestion. | |
| 14 * @param {Object} suggestion The suggestion to render. | |
| 15 * @param {HTMLElement} box The html element to add the suggestion to. | |
| 16 * @param {integer} suggestionRank The rank of the suggestion (0 based). | |
| 17 */ | |
| 18 function addSuggestionToBox(suggestion, box, suggestionRank) { | |
| 19 var suggestionDiv = document.createElement('div'); | |
| 20 suggestionDiv.classList.add('suggestion'); | |
| 21 if (suggestionRank == 0) | |
| 22 suggestionDiv.classList.add('selected'); | |
| 23 | |
| 24 var clock = document.createElement('div'); | |
| 25 clock.className = 'clock'; | |
| 26 suggestionDiv.appendChild(clock); | |
| 27 | |
| 28 var contentsContainer = document.createElement('div'); | |
| 29 contentsContainer.className = 'contents'; | |
| 30 var contents = suggestion.combinedNode; | |
| 31 var restrictedId = suggestion.rid; | |
| 32 contentsContainer.appendChild(contents); | |
| 33 suggestionDiv.appendChild(contentsContainer); | |
| 34 suggestionDiv.onclick = function() { | |
| 35 handleSuggestionClick(restrictedId); | |
| 36 } | |
| 37 | |
| 38 // TODO(shishir): Support hover over suggestions. | |
| 39 var restrictedIdDiv = document.createElement('div'); | |
| 40 restrictedIdDiv.innerHTML = restrictedId; | |
| 41 restrictedIdDiv.className = 'restricted-id'; | |
| 42 suggestionDiv.appendChild(restrictedIdDiv); | |
| 43 | |
| 44 box.appendChild(suggestionDiv); | |
| 45 } | |
| 46 | |
| 47 /** | |
| 48 * Renders the input suggestions. | |
| 49 * @param {Array} nativeSuggestions An array of native suggestions to render. | |
| 50 */ | |
| 51 function renderSuggestions(nativeSuggestions) { | |
| 52 clearSuggestions(); | |
| 53 | |
| 54 var box = $('suggestionsBox'); | |
| 55 for (var i = 0; i < MAX_SUGGESTIONS_TO_SHOW && i < nativeSuggestions.length; | |
| 56 ++i) { | |
| 57 addSuggestionToBox(nativeSuggestions[i], box, i); | |
| 58 } | |
| 59 } | |
| 60 | |
| 61 /** | |
| 62 * Clears the suggestions being displayed. | |
| 63 */ | |
| 64 function clearSuggestions() { | |
| 65 $('suggestionsBox').innerHTML = ''; | |
| 66 } | |
| 67 | |
| 68 /** | |
| 69 * @return {integer} The height of the dropdown. | |
| 70 */ | |
| 71 function getDropdownHeight() { | |
| 72 return $('suggestionsBox').offsetHeight; | |
| 73 } | |
| 74 | |
| 75 /** | |
| 76 * @return {integer} the index of the suggestion currently selected. | |
| 77 */ | |
| 78 function getSelectedSuggestionIndex() { | |
| 79 var suggestions = $('suggestionsBox').childNodes; | |
| 80 for (var i = 0; i < suggestions.length; ++i) { | |
| 81 if (suggestions[i].classList.contains('selected')) | |
| 82 return i; | |
| 83 } | |
| 84 return -1; | |
| 85 } | |
| 86 | |
| 87 /** | |
| 88 * Changes the selected suggestion. | |
| 89 * @param {integer} index The index of the suggestion to select. | |
| 90 * @param {function} restrictedIdCallback Callback to call on old selection. | |
| 91 */ | |
| 92 function selectSuggestionAtIndex(index, restrictedIdCallback) { | |
| 93 var oldSelection = $('suggestionsBox').querySelector('.selected'); | |
| 94 oldSelection.classList.remove('selected'); | |
| 95 | |
| 96 var numSuggestions = $('suggestionsBox').childNodes.length; | |
| 97 var sanitizedIndex = Math.min(Math.max(0, index), numSuggestions - 1); | |
| 98 var selection = sanitizedIndex + 1; | |
| 99 var newSelection = $('suggestionsBox').querySelector( | |
| 100 '.suggestion:nth-of-type(' + selection + ')'); | |
| 101 newSelection.classList.add('selected'); | |
| 102 var restrictedId = getRestrictedId(newSelection); | |
| 103 restrictedIdCallback(restrictedId); | |
| 104 } | |
| 105 | |
| 106 /** | |
| 107 * Returns the restricted id for the input suggestion. | |
|
Evan Stade
2012/12/14 22:32:23
here would be a good place to explain what a restr
Shishir
2012/12/14 23:49:56
Done.
| |
| 108 * @param {HTMLElement} suggestion The node representing the suggestion. | |
| 109 * @return {integer} The restricted id of the suggestion. | |
| 110 */ | |
| 111 function getRestrictedId(suggestion) { | |
| 112 for (var i = 0; i < suggestion.childNodes.length; ++i) { | |
| 113 if (suggestion.childNodes[i].className == 'restricted-id') | |
|
Evan Stade
2012/12/14 22:32:23
classList.contains is more robust.
Shishir
2012/12/14 23:49:56
Done.
| |
| 114 return parseInt(suggestion.childNodes[i].innerHTML); | |
| 115 } | |
| 116 return -1; | |
| 117 } | |
| 118 | |
| 119 // ============================================================================= | |
| 120 // Handlers / API stuff | |
| 121 // ============================================================================= | |
| 122 | |
| 123 /** | |
| 124 * @return {Object} the handle to the searchBox API. | |
| 125 */ | |
| 126 function getApiObjectHandle() { | |
| 127 if (window.cideb) | |
| 128 return window.cideb; | |
| 129 if (window.navigator && window.navigator.searchBox) | |
| 130 return window.navigator.searchBox; | |
| 131 if (window.chrome && window.chrome.searchBox) | |
| 132 return window.chrome.searchBox; | |
| 133 return null; | |
| 134 } | |
| 135 | |
| 136 /** | |
| 137 * chrome.searchBox.onnativesuggestions implementation. | |
| 138 */ | |
| 139 function handleNativeSuggestions() { | |
| 140 var apiHandle = getApiObjectHandle(); | |
| 141 | |
| 142 var nativeSuggestions = apiHandle.nativeSuggestions; | |
| 143 if (nativeSuggestions) { | |
| 144 nativeSuggestions.sort(function(a, b) { | |
| 145 return b.rankingData.relevance - a.rankingData.relevance; | |
| 146 }); | |
| 147 renderSuggestions(nativeSuggestions); | |
| 148 } else { | |
| 149 clearSuggestions(); | |
| 150 } | |
| 151 | |
| 152 var height = getDropdownHeight(); | |
| 153 apiHandle.show(2, height); | |
| 154 | |
| 155 if (nativeSuggestions && nativeSuggestions.length > 0) { | |
| 156 apiHandle.setRestrictedAutocompleteText( | |
| 157 nativeSuggestions[getSelectedSuggestionIndex()].rid); | |
| 158 } | |
| 159 } | |
| 160 | |
| 161 /** | |
| 162 * Handles suggestion clicks. | |
| 163 * @param {integer} restrictedId The restricted id of the suggestion being | |
| 164 * clicked. | |
| 165 */ | |
| 166 function handleSuggestionClick(restrictedId) { | |
| 167 var apiHandle = getApiObjectHandle(); | |
| 168 clearSuggestions(); | |
| 169 apiHandle.navigateContentWindow(restrictedId); | |
| 170 } | |
| 171 | |
| 172 /** | |
| 173 * chrome.searchBox.onkeypress implementation. | |
| 174 * @param {Object} e The key being pressed. | |
| 175 */ | |
| 176 function handleKeyPress(e) { | |
| 177 var apiHandle = getApiObjectHandle(); | |
| 178 function callback(restrictedId) { | |
| 179 apiHandle.setRestrictedValue(restrictedId); | |
| 180 } | |
| 181 | |
| 182 switch (e.keyCode) { | |
| 183 case 38: // Up arrow | |
| 184 selectSuggestionAtIndex(getSelectedSuggestionIndex() - 1, callback); | |
| 185 break; | |
| 186 case 40: // Down arrow | |
| 187 selectSuggestionAtIndex(getSelectedSuggestionIndex() + 1, callback); | |
| 188 break; | |
| 189 } | |
| 190 } | |
| 191 | |
| 192 /** | |
| 193 * chrome.searchBox.onsubmit implementation. | |
| 194 * @param {Object} e details regarding the submit. | |
| 195 */ | |
| 196 function onSubmit(e) { | |
|
Evan Stade
2012/12/14 22:32:23
at least put a TODO inside here.
Shishir
2012/12/14 23:49:56
Nothing needs to be done here. But the function ne
| |
| 197 } | |
| 198 | |
| 199 /** | |
| 200 * Sets up the searchBox API. | |
| 201 */ | |
| 202 function setUpAPI() { | |
|
Evan Stade
2012/12/14 22:32:23
setUpApi
Shishir
2012/12/14 23:49:56
Done.
| |
| 203 var apiHandle = getApiObjectHandle(); | |
| 204 apiHandle.onnativesuggestions = handleNativeSuggestions; | |
| 205 apiHandle.onkeypress = handleKeyPress; | |
| 206 apiHandle.onsubmit = onSubmit; | |
| 207 } | |
| 208 | |
| 209 document.addEventListener('DOMContentLoaded', setUpAPI); | |
| OLD | NEW |