Downloads: First pass at a cleanup to match webdev style.

chrome/browser/resources/downloads/downloads.js

 // Copyright (c) 2012 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.
 
-///////////////////////////////////////////////////////////////////////////////
-// Helper functions
-function $(o) {return document.getElementById(o);}
+// TODO(jhawkins): Use hidden instead of showInline* and display:none.
 
 /**
  * Sets the display style of a node.
  */
 function showInline(node, isShow) {
   node.style.display = isShow ? 'inline' : 'none';
 }
 
 function showInlineBlock(node, isShow) {
   node.style.display = isShow ? 'inline-block' : 'none';
@@ skipping 34 matching lines @@
   button.type = 'button';
   button.value = value;
   button.onclick = onclick;
   return button;
 }
 
 ///////////////////////////////////////////////////////////////////////////////
 // Downloads
 /**
  * Class to hold all the information about the visible downloads.
+ * @constructor
  */
 function Downloads() {
   this.downloads_ = {};
   this.node_ = $('downloads-display');
   this.summary_ = $('downloads-summary-text');
   this.searchText_ = '';
 
   // Keep track of the dates of the newest and oldest downloads so that we
   // know where to insert them.
   this.newestTime_ = -1;
@@ skipping 18 matching lines @@
     // display order are new ones and so we can add them to the top of the
     // list.
     if (download.started > this.newestTime_) {
       this.node_.insertBefore(this.downloads_[id].node, this.node_.firstChild);
       this.newestTime_ = download.started;
     } else {
       this.node_.appendChild(this.downloads_[id].node);
     }
     this.updateDateDisplay_();
   }
-}
+};
 
 /**
  * Set our display search text.
  * @param {string} searchText The string we're searching for.
  */
 Downloads.prototype.setSearchText = function(searchText) {
   this.searchText_ = searchText;
-}
+};
 
 /**
  * Update the summary block above the results
  */
 Downloads.prototype.updateSummary = function() {
   if (this.searchText_) {
     this.summary_.textContent = localStrings.getStringF('searchresultsfor',
                                                         this.searchText_);
   } else {
     this.summary_.textContent = localStrings.getString('downloads');
   }
 
   var hasDownloads = false;
   for (var i in this.downloads_) {
     hasDownloads = true;
     break;
   }
 
   if (!hasDownloads) {
     this.node_.textContent = localStrings.getString('noresults');
   }
-}
+};
 
 /**
  * Update the date visibility in our nodes so that no date is
  * repeated.
+ * @private
  */
 Downloads.prototype.updateDateDisplay_ = function() {
   var dateContainers = document.getElementsByClassName('date-container');
   var displayed = {};
   for (var i = 0, container; container = dateContainers[i]; i++) {
     var dateString = container.getElementsByClassName('date')[0].innerHTML;
     if (!!displayed[dateString]) {
       container.style.display = 'none';
     } else {
       displayed[dateString] = true;
       container.style.display = 'block';
     }
   }
-}
+};
 
 /**
  * Remove a download.
  * @param {number} id The id of the download to remove.
  */
 Downloads.prototype.remove = function(id) {
   this.node_.removeChild(this.downloads_[id].node);
   delete this.downloads_[id];
   this.updateDateDisplay_();
-}
+};
 
 /**
  * Clear all downloads and reset us back to a null state.
  */
 Downloads.prototype.clear = function() {
   for (var id in this.downloads_) {
     this.downloads_[id].clear();
     this.remove(id);
   }
-}
+};
 
 /**
  * Schedule icon load.
  * @param {HTMLImageElement} elem Image element that should contain the icon.
  * @param {string} iconURL URL to the icon.
  */
 Downloads.prototype.scheduleIconLoad = function(elem, iconURL) {
   var self = this;
 
   // Sends request to the next icon in the queue and schedules
@@ skipping 12 matching lines @@
     self.isIconLoading_ = false;
   }
 
   // Create new request
   var loadRequest = {element: elem, url: iconURL};
   this.iconLoadQueue_.push(loadRequest);
 
   // Start loading if none scheduled yet
   if (!this.isIconLoading_)
     loadNext();
-}
+};
 
 ///////////////////////////////////////////////////////////////////////////////
 // Download
 /**
  * A download and the DOM representation for that download.
  * @param {Object} download A backend download object (see downloads_ui.cc)
+ * @constructor
  */
 function Download(download) {
   // Create DOM
-  this.node = createElementWithClassName('div','download' +
-                                         (download.otr ? ' otr' : ''));
+  this.node = createElementWithClassName(
+      'div', 'download' + (download.otr ? ' otr' : ''));
 
   // Dates
   this.dateContainer_ = createElementWithClassName('div', 'date-container');
   this.node.appendChild(this.dateContainer_);
 
   this.nodeSince_ = createElementWithClassName('div', 'since');
   this.nodeDate_ = createElementWithClassName('div', 'date');
   this.dateContainer_.appendChild(this.nodeSince_);
   this.dateContainer_.appendChild(this.nodeDate_);
 
   // Container for all 'safe download' UI.
   this.safe_ = createElementWithClassName('div', 'safe');
   this.safe_.ondragstart = this.drag_.bind(this);
   this.node.appendChild(this.safe_);
 
   if (download.state != Download.States.COMPLETE) {
     this.nodeProgressBackground_ =
         createElementWithClassName('div', 'progress background');
     this.safe_.appendChild(this.nodeProgressBackground_);
 
     this.canvasProgress_ =
         document.getCSSCanvasContext('2d', 'canvas_' + download.id,
             Download.Progress.width,
             Download.Progress.height);
 
     this.nodeProgressForeground_ =
         createElementWithClassName('div', 'progress foreground');
     this.nodeProgressForeground_.style.webkitMask =
-        '-webkit-canvas(canvas_'+download.id+')';
+        '-webkit-canvas(canvas_' + download.id + ')';
     this.safe_.appendChild(this.nodeProgressForeground_);
   }
 
   this.nodeImg_ = createElementWithClassName('img', 'icon');
   this.safe_.appendChild(this.nodeImg_);
 
   // FileLink is used for completed downloads, otherwise we show FileName.
   this.nodeTitleArea_ = createElementWithClassName('div', 'title-area');
   this.safe_.appendChild(this.nodeTitleArea_);
 
   this.nodeFileLink_ = createLink(this.openFile_.bind(this), '');
   this.nodeFileLink_.className = 'name';
   this.nodeFileLink_.style.display = 'none';
   this.nodeTitleArea_.appendChild(this.nodeFileLink_);
 
   this.nodeFileName_ = createElementWithClassName('span', 'name');
   this.nodeFileName_.style.display = 'none';
   this.nodeTitleArea_.appendChild(this.nodeFileName_);
 
   this.nodeStatus_ = createElementWithClassName('span', 'status');
   this.nodeTitleArea_.appendChild(this.nodeStatus_);
 
   var nodeURLDiv = createElementWithClassName('div', 'url-container');
   this.safe_.appendChild(nodeURLDiv);
 
   this.nodeURL_ = createElementWithClassName('a', 'src-url');
-  this.nodeURL_.target = "_blank";
+  this.nodeURL_.target = '_blank';
   nodeURLDiv.appendChild(this.nodeURL_);
 
   // Controls.
   this.nodeControls_ = createElementWithClassName('div', 'controls');
   this.safe_.appendChild(this.nodeControls_);
 
-  // We don't need "show in folder" in chromium os. See download_ui.cc and
+  // We don't need 'show in folder' in chromium os. See download_ui.cc and

[csilv, 2012/03/12 18:16:50]

lol... find & replace strikes again (non-actionable commentary)

[James Hawkins, 2012/03/12 19:51:54]

Na, I prefer single quotes when referencing noun-type things.  I only use double
quotes for actual quotations.

   // http://code.google.com/p/chromium-os/issues/detail?id=916.
   var showinfolder = localStrings.getString('control_showinfolder');
   if (showinfolder) {
     this.controlShow_ = createLink(this.show_.bind(this), showinfolder);
     this.nodeControls_.appendChild(this.controlShow_);
   } else {
     this.controlShow_ = null;
   }
 
   this.controlRetry_ = document.createElement('a');
@@ skipping 34 matching lines @@
 
   // Update member vars.
   this.update(download);
 }
 
 /**
  * The states a download can be in. These correspond to states defined in
  * DownloadsDOMHandler::CreateDownloadItemValue
  */
 Download.States = {
-  IN_PROGRESS : "IN_PROGRESS",
-  CANCELLED : "CANCELLED",
-  COMPLETE : "COMPLETE",
-  PAUSED : "PAUSED",
-  DANGEROUS : "DANGEROUS",
-  INTERRUPTED : "INTERRUPTED",
-}
+  IN_PROGRESS: 'IN_PROGRESS',
+  CANCELLED: 'CANCELLED',
+  COMPLETE: 'COMPLETE',
+  PAUSED: 'PAUSED',
+  DANGEROUS: 'DANGEROUS',
+  INTERRUPTED: 'INTERRUPTED',
+};
 
 /**
  * Explains why a download is in DANGEROUS state.
  */
 Download.DangerType = {
-  NOT_DANGEROUS: "NOT_DANGEROUS",
-  DANGEROUS_FILE: "DANGEROUS_FILE",
-  DANGEROUS_URL: "DANGEROUS_URL",
-  DANGEROUS_CONTENT: "DANGEROUS_CONTENT"
-}
+  NOT_DANGEROUS: 'NOT_DANGEROUS',
+  DANGEROUS_FILE: 'DANGEROUS_FILE',
+  DANGEROUS_URL: 'DANGEROUS_URL',
+  DANGEROUS_CONTENT: 'DANGEROUS_CONTENT'

[benjhayden, 2012/03/12 14:14:35]

FYI http://codereview.chromium.org/9621007/
That CL might not go in before this one, so I'll also let Asanka know about this
CL.

+};
 
 /**
  * Constants for the progress meter.
  */
 Download.Progress = {
-  width : 48,
-  height : 48,
-  radius : 24,
-  centerX : 24,
-  centerY : 24,
-  base : -0.5 * Math.PI,
-  dir : false,
-}
+  width: 48,
+  height: 48,
+  radius: 24,
+  centerX: 24,
+  centerY: 24,
+  base: -0.5 * Math.PI,
+  dir: false,
+};
 
 /**
  * Updates the download to reflect new data.
  * @param {Object} download A backend download object (see downloads_ui.cc)
  */
 Download.prototype.update = function(download) {
   this.id_ = download.id;
   this.filePath_ = download.file_path;
   this.fileUrl_ = download.file_url;
   this.fileName_ = download.file_name;
@@ skipping 97 matching lines @@
     // text selection the user has started (http://crbug.com/44982).
     if (this.nodeURL_.textContent != this.url_) {
       this.nodeURL_.textContent = this.url_;
       this.nodeURL_.href = this.url_;
     }
     this.nodeStatus_.textContent = this.getStatusText_();
 
     this.danger_.style.display = 'none';
     this.safe_.style.display = 'block';
   }
-}
+};
 
 /**
  * Removes applicable bits from the DOM in preparation for deletion.
  */
 Download.prototype.clear = function() {
   this.safe_.ondragstart = null;
   this.nodeFileLink_.onclick = null;
   if (this.controlShow_) {
     this.controlShow_.onclick = null;
   }
   this.controlCancel_.onclick = null;
   this.controlPause_.onclick = null;
   this.controlResume_.onclick = null;
   this.dangerDiscard_.onclick = null;
 
   this.node.innerHTML = '';
-}
+};
 
 /**
+ * @private
  * @return {string} User-visible status update text.
  */
 Download.prototype.getStatusText_ = function() {
   switch (this.state_) {
     case Download.States.IN_PROGRESS:
       return this.progressStatusText_;
     case Download.States.CANCELLED:
       return localStrings.getString('status_cancelled');
     case Download.States.PAUSED:
       return localStrings.getString('status_paused');
     case Download.States.DANGEROUS:
       // danger_url_desc is also used by DANGEROUS_CONTENT.
       var desc = this.dangerType_ == Download.DangerType.DANGEROUS_FILE ?
           'danger_file_desc' : 'danger_url_desc';
       return localStrings.getString(desc);
     case Download.States.INTERRUPTED:
       return localStrings.getString('status_interrupted');
     case Download.States.COMPLETE:
       return this.fileExternallyRemoved_ ?
           localStrings.getString('status_removed') : '';
   }
-}
+};
 
 /**
  * Tells the backend to initiate a drag, allowing users to drag
  * files from the download page and have them appear as native file
  * drags.
+ * @private
  */
 Download.prototype.drag_ = function() {
   chrome.send('drag', [this.id_.toString()]);
   return false;
-}
+};
 
 /**
  * Tells the backend to open this file.
+ * @private
  */
 Download.prototype.openFile_ = function() {
   chrome.send('openFile', [this.id_.toString()]);
   return false;
-}
+};
 
 /**
  * Tells the backend that the user chose to save a dangerous file.
+ * @private
  */
 Download.prototype.saveDangerous_ = function() {
   chrome.send('saveDangerous', [this.id_.toString()]);
   return false;
-}
+};
 
 /**
  * Tells the backend that the user chose to discard a dangerous file.
+ * @private
  */
 Download.prototype.discardDangerous_ = function() {
   chrome.send('discardDangerous', [this.id_.toString()]);
   downloads.remove(this.id_);
   return false;
-}
+};
 
 /**
  * Tells the backend to show the file in explorer.
+ * @private
  */
 Download.prototype.show_ = function() {
   chrome.send('show', [this.id_.toString()]);
   return false;
-}
+};
 
 /**
  * Tells the backend to pause this download.
+ * @private
  */
 Download.prototype.togglePause_ = function() {
   chrome.send('togglepause', [this.id_.toString()]);
   return false;
-}
+};
 
 /**
  * Tells the backend to remove this download from history and download shelf.
+ * @private
  */
  Download.prototype.remove_ = function() {
   chrome.send('remove', [this.id_.toString()]);
   return false;
-}
+};
 
 /**
  * Tells the backend to cancel this download.
+ * @private
  */
 Download.prototype.cancel_ = function() {
   chrome.send('cancel', [this.id_.toString()]);
   return false;
-}
+};
 
 ///////////////////////////////////////////////////////////////////////////////
 // Page:
 var downloads, localStrings, resultsTimeout;
 
 // TODO(benjhayden): Rename Downloads to DownloadManager, downloads to
 // downloadManager or theDownloadManager or DownloadManager.get() to prevent
 // confusing Downloads with Download.
 
 /**
  * The FIFO array that stores updates of download files to be appeared
  * on the download page. It is guaranteed that the updates in this array
  * are reflected to the download page in a FIFO order.
 */
 var fifo_results;
 
 function load() {
   chrome.send('onPageLoaded');
   fifo_results = new Array();
   localStrings = new LocalStrings();
   downloads = new Downloads();
   $('term').focus();
   $('term').setAttribute('aria-labelledby', 'search-submit');
   setSearch('');
+
+  var clearAllLink = $('clear-all');
+  clearAllLink.onclick = clearAll;
+  clearAllLink.oncontextmenu = function() { return false; };

[Dan Beam, 2012/03/12 08:38:48]

why not \n after {?

[James Hawkins, 2012/03/12 18:33:45]

I didn't write this file, but I'm inclined to leave it in because it fits on one
line.  This is allowable in c++ as well.

Also, this particular block of code will be gone in the next CL.

+
+  // TODO(jhawkins): Use a link-button here.
+  var openDownloadsFolderLink = $('open-downloads-folder');
+  openDownloadsFolderLink.onclick =
+      chrome.send.bind(chrome, 'openDownloadsFolder');
+  openDownloadsFolderLink.oncontextmenu = function() { return false; };

[Dan Beam, 2012/03/12 08:38:48]

and here

[James Hawkins, 2012/03/12 18:33:45]

Same as above.

+
+  $('search-link').onclick = function() {
+    setSearch('');
+    return false;

[Dan Beam, 2012/03/12 08:38:48]

why not preventDefault()?

[James Hawkins, 2012/03/12 18:33:45]

Done.

+  };
+
+  $('search-form').onsubmit = function() {
+    setSearch(this.term.value);
+    return false;

[Dan Beam, 2012/03/12 08:38:48]

and here

[James Hawkins, 2012/03/12 18:33:45]

Done.

+  };
 }
 
 function setSearch(searchText) {
   fifo_results.length = 0;
   downloads.clear();
   downloads.setSearchText(searchText);
   chrome.send('getDownloads', [searchText.toString()]);
 }
 
 function clearAll() {
   fifo_results.length = 0;
   downloads.clear();
   downloads.setSearchText('');
-  chrome.send('clearAll', []);
-  return false;
-}
-
-function openDownloadsFolder() {
-  chrome.send('openDownloadsFolder');
-  return false;
+  chrome.send('clearAll');
 }
 
 ///////////////////////////////////////////////////////////////////////////////
 // Chrome callbacks:
 /**
  * Our history system calls this function with results from searches or when
  * downloads are added or removed.
  */
 function downloadsList(results) {
   if (resultsTimeout)
@@ skipping 29 matching lines @@
     if (Date.now() - start > 50) {
       clearTimeout(resultsTimeout);
       resultsTimeout = setTimeout(tryDownloadUpdatedPeriodically, 5);
       break;
     }
   }
 }
 
 // Add handlers to HTML elements.
 window.addEventListener('DOMContentLoaded', load);
-
-var clearAllLink = $('clear-all');
-clearAllLink.onclick = function () { clearAll(''); };
-clearAllLink.oncontextmenu = function() { return false; };
-
-var openDownloadsFolderLink = $('open-downloads-folder');
-openDownloadsFolderLink.onclick = openDownloadsFolder;
-openDownloadsFolderLink.oncontextmenu = function() { return false; };
-
-$('search-link').onclick = function () {
-  setSearch('');
-  return false;
-};
-$('search-form').onsubmit = function () {
-  setSearch(this.term.value);
-  return false;
-};