MD Downloads: revulcanize in a polymer.html world

chrome/browser/resources/md_downloads/crisper.js

 // Copyright 2016 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.
 
 /**
  * @fileoverview PromiseResolver is a helper class that allows creating a
  * Promise that will be fulfilled (resolved or rejected) some time later.
  *
  * Example:
  *  var resolver = new PromiseResolver();
@@ skipping 1413 matching lines @@
   var elm = document.createElement(type);
   elm.className = className;
   return elm;
 }
 
 /**
  * webkitTransitionEnd does not always fire (e.g. when animation is aborted
  * or when no paint happens during the animation). This function sets up
  * a timer and emulate the event if it is not fired when the timer expires.
  * @param {!HTMLElement} el The element to watch for webkitTransitionEnd.
- * @param {number} timeOut The maximum wait time in milliseconds for the
- *     webkitTransitionEnd to happen.
+ * @param {number=} opt_timeOut The maximum wait time in milliseconds for the
+ *     webkitTransitionEnd to happen. If not specified, it is fetched from |el|
+ *     using the transitionDuration style value.
  */
-function ensureTransitionEndEvent(el, timeOut) {
+function ensureTransitionEndEvent(el, opt_timeOut) {
+  if (opt_timeOut === undefined) {
+    var style = getComputedStyle(el);
+    opt_timeOut = parseFloat(style.transitionDuration) * 1000;
+
+    // Give an additional 50ms buffer for the animation to complete.
+    opt_timeOut += 50;
+  }
+
   var fired = false;
   el.addEventListener('webkitTransitionEnd', function f(e) {
     el.removeEventListener('webkitTransitionEnd', f);
     fired = true;
   });
   window.setTimeout(function() {
     if (!fired)
       cr.dispatchSimpleEvent(el, 'webkitTransitionEnd', true);
-  }, timeOut);
+  }, opt_timeOut);
 }
 
 /**
  * Alias for document.scrollTop getter.
  * @param {!HTMLDocument} doc The document node where information will be
  *     queried from.
  * @return {number} The Y document scroll offset.
  */
 function scrollTopForDocument(doc) {
   return doc.documentElement.scrollTop || doc.body.scrollTop;
@@ skipping 58 matching lines @@
 }
 
 /**
  * Quote a string so it can be used in a regular expression.
  * @param {string} str The source string.
  * @return {string} The escaped string.
  */
 function quoteString(str) {
   return str.replace(/([\\\.\+\*\?\[\^\]\$\(\)\{\}\=\!\<\>\|\:])/g, '\\$1');
 };
-// Copyright (c) 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.
-
-/**
- * @fileoverview Assertion support.
- */
-
-/**
- * Verify |condition| is truthy and return |condition| if so.
- * @template T
- * @param {T} condition A condition to check for truthiness.  Note that this
- *     may be used to test whether a value is defined or not, and we don't want
- *     to force a cast to Boolean.
- * @param {string=} opt_message A message to show on failure.
- * @return {T} A non-null |condition|.
- */
-function assert(condition, opt_message) {
-  if (!condition) {
-    var message = 'Assertion failed';
-    if (opt_message)
-      message = message + ': ' + opt_message;
-    var error = new Error(message);
-    var global = function() { return this; }();
-    if (global.traceAssertionsForTesting)
-      console.warn(error.stack);
-    throw error;
-  }
-  return condition;
-}
-
-/**
- * Call this from places in the code that should never be reached.
- *
- * For example, handling all the values of enum with a switch() like this:
- *
- *   function getValueFromEnum(enum) {
- *     switch (enum) {
- *       case ENUM_FIRST_OF_TWO:
- *         return first
- *       case ENUM_LAST_OF_TWO:
- *         return last;
- *     }
- *     assertNotReached();
- *     return document;
- *   }
- *
- * This code should only be hit in the case of serious programmer error or
- * unexpected input.
- *
- * @param {string=} opt_message A message to show when this is hit.
- */
-function assertNotReached(opt_message) {
-  assert(false, opt_message || 'Unreachable code hit');
-}
-
-/**
- * @param {*} value The value to check.
- * @param {function(new: T, ...)} type A user-defined constructor.
- * @param {string=} opt_message A message to show when this is hit.
- * @return {T}
- * @template T
- */
-function assertInstanceof(value, type, opt_message) {
-  // We don't use assert immediately here so that we avoid constructing an error
-  // message if we don't have to.
-  if (!(value instanceof type)) {
-    assertNotReached(opt_message || 'Value ' + value +
-                     ' is not a[n] ' + (type.name || typeof type));
-  }
-  return value;
-};
-// Copyright 2015 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.
-
-cr.define('downloads', function() {
-  /**
-   * @param {string} chromeSendName
-   * @return {function(string):void} A chrome.send() callback with curried name.
-   */
-  function chromeSendWithId(chromeSendName) {
-    return function(id) { chrome.send(chromeSendName, [id]); };
-  }
-
-  /** @constructor */
-  function ActionService() {
-    /** @private {Array<string>} */
-    this.searchTerms_ = [];
-  }
-
-  /**
-   * @param {string} s
-   * @return {string} |s| without whitespace at the beginning or end.
-   */
-  function trim(s) { return s.trim(); }
-
-  /**
-   * @param {string|undefined} value
-   * @return {boolean} Whether |value| is truthy.
-   */
-  function truthy(value) { return !!value; }
-
-  /**
-   * @param {string} searchText Input typed by the user into a search box.
-   * @return {Array<string>} A list of terms extracted from |searchText|.
-   */
-  ActionService.splitTerms = function(searchText) {
-    // Split quoted terms (e.g., 'The "lazy" dog' => ['The', 'lazy', 'dog']).
-    return searchText.split(/"([^"]*)"/).map(trim).filter(truthy);
-  };
-
-  ActionService.prototype = {
-    /** @param {string} id ID of the download to cancel. */
-    cancel: chromeSendWithId('cancel'),
-
-    /** Instructs the browser to clear all finished downloads. */
-    clearAll: function() {
-      if (loadTimeData.getBoolean('allowDeletingHistory')) {
-        chrome.send('clearAll');
-        this.search('');
-      }
-    },
-
-    /** @param {string} id ID of the dangerous download to discard. */
-    discardDangerous: chromeSendWithId('discardDangerous'),
-
-    /** @param {string} url URL of a file to download. */
-    download: function(url) {
-      var a = document.createElement('a');
-      a.href = url;
-      a.setAttribute('download', '');
-      a.click();
-    },
-
-    /** @param {string} id ID of the download that the user started dragging. */
-    drag: chromeSendWithId('drag'),
-
-    /** Loads more downloads with the current search terms. */
-    loadMore: function() {
-      chrome.send('getDownloads', this.searchTerms_);
-    },
-
-    /**
-     * @return {boolean} Whether the user is currently searching for downloads
-     *     (i.e. has a non-empty search term).
-     */
-    isSearching: function() {
-      return this.searchTerms_.length > 0;
-    },
-
-    /** Opens the current local destination for downloads. */
-    openDownloadsFolder: chrome.send.bind(chrome, 'openDownloadsFolder'),
-
-    /**
-     * @param {string} id ID of the download to run locally on the user's box.
-     */
-    openFile: chromeSendWithId('openFile'),
-
-    /** @param {string} id ID the of the progressing download to pause. */
-    pause: chromeSendWithId('pause'),
-
-    /** @param {string} id ID of the finished download to remove. */
-    remove: chromeSendWithId('remove'),
-
-    /** @param {string} id ID of the paused download to resume. */
-    resume: chromeSendWithId('resume'),
-
-    /**
-     * @param {string} id ID of the dangerous download to save despite
-     *     warnings.
-     */
-    saveDangerous: chromeSendWithId('saveDangerous'),
-
-    /** @param {string} searchText What to search for. */
-    search: function(searchText) {
-      var searchTerms = ActionService.splitTerms(searchText);
-      var sameTerms = searchTerms.length == this.searchTerms_.length;
-
-      for (var i = 0; sameTerms && i < searchTerms.length; ++i) {
-        if (searchTerms[i] != this.searchTerms_[i])
-          sameTerms = false;
-      }
-
-      if (sameTerms)
-        return;
-
-      this.searchTerms_ = searchTerms;
-      this.loadMore();
-    },
-
-    /**
-     * Shows the local folder a finished download resides in.
-     * @param {string} id ID of the download to show.
-     */
-    show: chromeSendWithId('show'),
-
-    /** Undo download removal. */
-    undo: chrome.send.bind(chrome, 'undo'),
-  };
-
-  cr.addSingletonGetter(ActionService);
-
-  return {ActionService: ActionService};
-});
-// Copyright 2015 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.
-
-cr.define('downloads', function() {
-  /**
-   * Explains why a download is in DANGEROUS state.
-   * @enum {string}
-   */
-  var DangerType = {
-    NOT_DANGEROUS: 'NOT_DANGEROUS',
-    DANGEROUS_FILE: 'DANGEROUS_FILE',
-    DANGEROUS_URL: 'DANGEROUS_URL',
-    DANGEROUS_CONTENT: 'DANGEROUS_CONTENT',
-    UNCOMMON_CONTENT: 'UNCOMMON_CONTENT',
-    DANGEROUS_HOST: 'DANGEROUS_HOST',
-    POTENTIALLY_UNWANTED: 'POTENTIALLY_UNWANTED',
-  };
-
-  /**
-   * The states a download can be in. These correspond to states defined in
-   * DownloadsDOMHandler::CreateDownloadItemValue
-   * @enum {string}
-   */
-  var States = {
-    IN_PROGRESS: 'IN_PROGRESS',
-    CANCELLED: 'CANCELLED',
-    COMPLETE: 'COMPLETE',
-    PAUSED: 'PAUSED',
-    DANGEROUS: 'DANGEROUS',
-    INTERRUPTED: 'INTERRUPTED',
-  };
-
-  return {
-    DangerType: DangerType,
-    States: States,
-  };
-});
-// Copyright 2014 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.
-
-// Action links are elements that are used to perform an in-page navigation or
-// action (e.g. showing a dialog).
-//
-// They look like normal anchor (<a>) tags as their text color is blue. However,
-// they're subtly different as they're not initially underlined (giving users a
-// clue that underlined links navigate while action links don't).
-//
-// Action links look very similar to normal links when hovered (hand cursor,
-// underlined). This gives the user an idea that clicking this link will do
-// something similar to navigation but in the same page.
-//
-// They can be created in JavaScript like this:
-//
-//   var link = document.createElement('a', 'action-link');  // Note second arg.
-//
-// or with a constructor like this:
-//
-//   var link = new ActionLink();
-//
-// They can be used easily from HTML as well, like so:
-//
-//   <a is="action-link">Click me!</a>
-//
-// NOTE: <action-link> and document.createElement('action-link') don't work.
-
-/**
- * @constructor
- * @extends {HTMLAnchorElement}
- */
-var ActionLink = document.registerElement('action-link', {
-  prototype: {
-    __proto__: HTMLAnchorElement.prototype,
-
-    /** @this {ActionLink} */
-    createdCallback: function() {
-      // Action links can start disabled (e.g. <a is="action-link" disabled>).
-      this.tabIndex = this.disabled ? -1 : 0;
-
-      if (!this.hasAttribute('role'))
-        this.setAttribute('role', 'link');
-
-      this.addEventListener('keydown', function(e) {
-        if (!this.disabled && e.keyIdentifier == 'Enter' && !this.href) {
-          // Schedule a click asynchronously because other 'keydown' handlers
-          // may still run later (e.g. document.addEventListener('keydown')).
-          // Specifically options dialogs break when this timeout isn't here.
-          // NOTE: this affects the "trusted" state of the ensuing click. I
-          // haven't found anything that breaks because of this (yet).
-          window.setTimeout(this.click.bind(this), 0);
-        }
-      });
-
-      function preventDefault(e) {
-        e.preventDefault();
-      }
-
-      function removePreventDefault() {
-        document.removeEventListener('selectstart', preventDefault);
-        document.removeEventListener('mouseup', removePreventDefault);
-      }
-
-      this.addEventListener('mousedown', function() {
-        // This handlers strives to match the behavior of <a href="...">.
-
-        // While the mouse is down, prevent text selection from dragging.
-        document.addEventListener('selectstart', preventDefault);
-        document.addEventListener('mouseup', removePreventDefault);
-
-        // If focus started via mouse press, don't show an outline.
-        if (document.activeElement != this)
-          this.classList.add('no-outline');
-      });
-
-      this.addEventListener('blur', function() {
-        this.classList.remove('no-outline');
-      });
-    },
-
-    /** @type {boolean} */
-    set disabled(disabled) {
-      if (disabled)
-        HTMLAnchorElement.prototype.setAttribute.call(this, 'disabled', '');
-      else
-        HTMLAnchorElement.prototype.removeAttribute.call(this, 'disabled');
-      this.tabIndex = disabled ? -1 : 0;
-    },
-    get disabled() {
-      return this.hasAttribute('disabled');
-    },
-
-    /** @override */
-    setAttribute: function(attr, val) {
-      if (attr.toLowerCase() == 'disabled')
-        this.disabled = true;
-      else
-        HTMLAnchorElement.prototype.setAttribute.apply(this, arguments);
-    },
-
-    /** @override */
-    removeAttribute: function(attr) {
-      if (attr.toLowerCase() == 'disabled')
-        this.disabled = false;
-      else
-        HTMLAnchorElement.prototype.removeAttribute.apply(this, arguments);
-    },
-  },
-
-  extends: 'a',
-});
-// 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.
-
-// <include src="../../../../ui/webui/resources/js/i18n_template_no_process.js">
-
-i18nTemplate.process(document, loadTimeData);
 /**
    * `IronResizableBehavior` is a behavior that can be used in Polymer elements to
    * coordinate the flow of resize events between "resizers" (elements that control the
    * size or hidden state of their children) and "resizables" (elements that need to be
    * notified when they are resized or un-hidden by their parents in order to take
    * action on their new measurements).
-   * 
    * Elements that perform measurement should add the `IronResizableBehavior` behavior to
    * their element definition and listen for the `iron-resize` event on themselves.
    * This event will be fired when they become showing after having been hidden,
    * when they are resized explicitly by another resizable, or when the window has been
    * resized.
-   * 
    * Note, the `iron-resize` event is non-bubbling.
    *
    * @polymerBehavior Polymer.IronResizableBehavior
    * @demo demo/index.html
    **/
   Polymer.IronResizableBehavior = {
     properties: {
       /**
        * The closest ancestor element that implements `IronResizableBehavior`.
        */
@@ skipping 643 matching lines @@
           window.removeEventListener('scroll', this._boundScrollHandler);
         } else if (this._oldScrollTarget.removeEventListener) {
           this._oldScrollTarget.removeEventListener('scroll', this._boundScrollHandler);
         }
         this._oldScrollTarget = null;
       }
       if (isAttached) {
         // Support element id references
         if (typeof scrollTarget === 'string') {
 
-          var host = this.domHost;
-          this.scrollTarget = host && host.$ ? host.$[scrollTarget] : 
-              Polymer.dom(this.ownerDocument).querySelector('#' + scrollTarget);
+          var ownerRoot = Polymer.dom(this).getOwnerRoot();
+          this.scrollTarget = (ownerRoot && ownerRoot.$) ?
+              ownerRoot.$[scrollTarget] : Polymer.dom(this.ownerDocument).querySelector('#' + scrollTarget);
 
         } else if (this._scrollHandler) {
 
           this._boundScrollHandler = this._boundScrollHandler || this._scrollHandler.bind(this);
           // Add a new listener
           if (scrollTarget === this._doc) {
             window.addEventListener('scroll', this._boundScrollHandler);
             if (this._scrollTop !== 0 || this._scrollLeft !== 0) {
               this._scrollHandler();
             }
@@ skipping 78 matching lines @@
         window.scrollTo(left, window.pageYOffset);
       } else if (this._isValidScrollTarget()) {
         this.scrollTarget.scrollLeft = left;
       }
     },
 
     /**
      * Scrolls the content to a particular place.
      *
      * @method scroll
+     * @param {number} top The top position
      * @param {number} left The left position
-     * @param {number} top The top position
      */
-    scroll: function(left, top) {
+    scroll: function(top, left) {
        if (this.scrollTarget === this._doc) {
-        window.scrollTo(left, top);
+        window.scrollTo(top, left);
       } else if (this._isValidScrollTarget()) {
+        this.scrollTarget.scrollTop = top;
         this.scrollTarget.scrollLeft = left;
-        this.scrollTarget.scrollTop = top;
       }
     },
 
     /**
      * Gets the width of the scroll target.
      *
      * @type {number}
      */
     get _scrollTargetWidth() {
       if (this._isValidScrollTarget()) {
@@ skipping 136 matching lines @@
       'enter': '_didEnter'
     },
 
     /**
      * The ratio of hidden tiles that should remain in the scroll direction.
      * Recommended value ~0.5, so it will distribute tiles evely in both directions.
      */
     _ratio: 0.5,
 
     /**
-     * The padding-top value for the list.
+     * The padding-top value of the `scroller` element
      */
     _scrollerPaddingTop: 0,
 
     /**
      * This value is the same as `scrollTop`.
      */
     _scrollPosition: 0,
 
     /**
+     * The number of tiles in the DOM.
+     */
+    _physicalCount: 0,
+
+    /**
+     * The k-th tile that is at the top of the scrolling list.
+     */
+    _physicalStart: 0,
+
+    /**
+     * The k-th tile that is at the bottom of the scrolling list.
+     */
+    _physicalEnd: 0,
+
+    /**
      * The sum of the heights of all the tiles in the DOM.
      */
     _physicalSize: 0,
 
     /**
      * The average `F` of the tiles observed till now.
      */
     _physicalAverage: 0,
 
     /**
      * The number of tiles which `offsetHeight` > 0 observed until now.
      */
     _physicalAverageCount: 0,
 
     /**
      * The Y position of the item rendered in the `_physicalStart`
      * tile relative to the scrolling list.
      */
     _physicalTop: 0,
 
     /**
      * The number of items in the list.
      */
     _virtualCount: 0,
 
     /**
+     * The n-th item rendered in the `_physicalStart` tile.
+     */
+    _virtualStartVal: 0,
+
+    /**
      * A map between an item key and its physical item index
      */
     _physicalIndexForKey: null,
 
     /**
      * The estimated scroll height based on `_physicalAverage`
      */
     _estScrollHeight: 0,
 
     /**
@@ skipping 25 matching lines @@
      */
     _firstVisibleIndexVal: null,
 
     /**
      * A cached value for the last visible index.
      * See `lastVisibleIndex`
      * @type {?number}
      */
     _lastVisibleIndexVal: null,
 
+
     /**
      * A Polymer collection for the items.
      * @type {?Polymer.Collection}
      */
     _collection: null,
 
     /**
      * True if the current item list was rendered for the first time
      * after attached.
      */
     _itemsRendered: false,
 
     /**
      * The page that is currently rendered.
      */
     _lastPage: null,
 
     /**
      * The max number of pages to render. One page is equivalent to the height of the list.
      */
     _maxPages: 3,
 
     /**
-     * The currently focused physical item.
+     * The currently focused item index.
      */
-    _focusedItem: null,
-
-    /**
-     * The index of the `_focusedItem`.
-     */
-    _focusedIndex: -1,
+    _focusedIndex: 0,
 
     /**
      * The the item that is focused if it is moved offscreen.
      * @private {?TemplatizerNode}
      */
     _offscreenFocusedItem: null,
 
     /**
      * The item that backfills the `_offscreenFocusedItem` in the physical items
      * list when that item is moved offscreen.
@@ skipping 15 matching lines @@
     },
 
     /**
      * The n-th item rendered in the last physical item.
      */
     get _virtualEnd() {
       return this._virtualStart + this._physicalCount - 1;
     },
 
     /**
-     * The height of the physical content that isn't on the screen.
-     */
-    get _hiddenContentSize() {
-      return this._physicalSize - this._viewportSize;
-    },
-
-    /**
-     * The maximum scroll top value.
-     */
-    get _maxScrollTop() {
-      return this._estScrollHeight - this._viewportSize + this._scrollerPaddingTop;
-    },
-
-    /**
      * The lowest n-th value for an item such that it can be rendered in `_physicalStart`.
      */
     _minVirtualStart: 0,
 
     /**
      * The largest n-th value for an item such that it can be rendered in `_physicalStart`.
      */
     get _maxVirtualStart() {
       return Math.max(0, this._virtualCount - this._physicalCount);
     },
 
     /**
-     * The n-th item rendered in the `_physicalStart` tile.
+     * The height of the physical content that isn't on the screen.
      */
-    _virtualStartVal: 0,
-
-    set _virtualStart(val) {
-      this._virtualStartVal = Math.min(this._maxVirtualStart, Math.max(this._minVirtualStart, val));
-    },
-
-    get _virtualStart() {
-      return this._virtualStartVal || 0;
+    get _hiddenContentSize() {
+      return this._physicalSize - this._viewportSize;
     },
 
     /**
-     * The k-th tile that is at the top of the scrolling list.
+     * The maximum scroll top value.
      */
-    _physicalStartVal: 0,
-
-    set _physicalStart(val) {
-      this._physicalStartVal = val % this._physicalCount;
-      if (this._physicalStartVal < 0) {
-        this._physicalStartVal = this._physicalCount + this._physicalStartVal;
-      }
-      this._physicalEnd = (this._physicalStart + this._physicalCount - 1) % this._physicalCount;
-    },
-
-    get _physicalStart() {
-      return this._physicalStartVal || 0;
+    get _maxScrollTop() {
+      return this._estScrollHeight - this._viewportSize;
     },
 
     /**
-     * The number of tiles in the DOM.
+     * Sets the n-th item rendered in `_physicalStart`
      */
-    _physicalCountVal: 0,
-
-    set _physicalCount(val) {
-      this._physicalCountVal = val;
-      this._physicalEnd = (this._physicalStart + this._physicalCount - 1) % this._physicalCount;
-    },
-
-    get _physicalCount() {
-      return this._physicalCountVal;
+    set _virtualStart(val) {
+      // clamp the value so that _minVirtualStart <= val <= _maxVirtualStart
+      this._virtualStartVal = Math.min(this._maxVirtualStart, Math.max(this._minVirtualStart, val));
+      if (this._physicalCount === 0)  {
+        this._physicalStart = 0;
+        this._physicalEnd = 0;
+      } else {
+        this._physicalStart = this._virtualStartVal % this._physicalCount;
+        this._physicalEnd = (this._physicalStart + this._physicalCount - 1) % this._physicalCount;
+      }
     },
 
     /**
-     * The k-th tile that is at the bottom of the scrolling list.
+     * Gets the n-th item rendered in `_physicalStart`
      */
-    _physicalEnd: 0,
+    get _virtualStart() {
+      return this._virtualStartVal;
+    },
 
     /**
      * An optimal physical size such that we will have enough physical items
      * to fill up the viewport and recycle when the user scrolls.
      *
      * This default value assumes that we will at least have the equivalent
      * to a viewport of physical items above and below the user's viewport.
      */
     get _optPhysicalSize() {
       return this._viewportSize * this._maxPages;
     },
 
    /**
     * True if the current list is visible.
     */
     get _isVisible() {
       return this.scrollTarget && Boolean(this.scrollTarget.offsetWidth || this.scrollTarget.offsetHeight);
     },
 
     /**
      * Gets the index of the first visible item in the viewport.
      *
      * @type {number}
      */
     get firstVisibleIndex() {
       if (this._firstVisibleIndexVal === null) {
-        var physicalOffset = this._physicalTop + this._scrollerPaddingTop;
+        var physicalOffset = this._physicalTop;
 
         this._firstVisibleIndexVal = this._iterateItems(
           function(pidx, vidx) {
             physicalOffset += this._physicalSizes[pidx];
+
             if (physicalOffset > this._scrollPosition) {
               return vidx;
             }
           }) || 0;
       }
       return this._firstVisibleIndexVal;
     },
 
     /**
      * Gets the index of the last visible item in the viewport.
      *
      * @type {number}
      */
     get lastVisibleIndex() {
       if (this._lastVisibleIndexVal === null) {
         var physicalOffset = this._physicalTop;
 
         this._iterateItems(function(pidx, vidx) {
           physicalOffset += this._physicalSizes[pidx];
 
-          if (physicalOffset <= this._scrollBottom) {
-            this._lastVisibleIndexVal = vidx;
+          if(physicalOffset <= this._scrollBottom) {
+              this._lastVisibleIndexVal = vidx;
           }
         });
       }
       return this._lastVisibleIndexVal;
     },
 
-    get _defaultScrollTarget() {
-      return this;
-    },
-
     ready: function() {
       this.addEventListener('focus', this._didFocus.bind(this), true);
     },
 
     attached: function() {
       this.updateViewportBoundaries();
       this._render();
     },
 
     detached: function() {
       this._itemsRendered = false;
     },
 
+    get _defaultScrollTarget() {
+      return this;
+    },
+
     /**
      * Set the overflow property if this element has its own scrolling region
      */
     _setOverflow: function(scrollTarget) {
       this.style.webkitOverflowScrolling = scrollTarget === this ? 'touch' : '';
       this.style.overflow = scrollTarget === this ? 'auto' : '';
     },
 
     /**
      * Invoke this method if you dynamically update the viewport's
      * size or CSS padding.
      *
      * @method updateViewportBoundaries
      */
     updateViewportBoundaries: function() {
-      this._scrollerPaddingTop = this.scrollTarget === this ? 0 :
-          parseInt(window.getComputedStyle(this)['padding-top'], 10);
-
+      var scrollerStyle = window.getComputedStyle(this.scrollTarget);
+      this._scrollerPaddingTop = parseInt(scrollerStyle['padding-top'], 10);
       this._viewportSize = this._scrollTargetHeight;
     },
 
     /**
      * Update the models, the position of the
      * items in the viewport and recycle tiles as needed.
      */
     _scrollHandler: function() {
       // clamp the `scrollTop` value
+      // IE 10|11 scrollTop may go above `_maxScrollTop`
+      // iOS `scrollTop` may go below 0 and above `_maxScrollTop`
       var scrollTop = Math.max(0, Math.min(this._maxScrollTop, this._scrollTop));
-      var delta = scrollTop - this._scrollPosition;
       var tileHeight, tileTop, kth, recycledTileSet, scrollBottom, physicalBottom;
       var ratio = this._ratio;
+      var delta = scrollTop - this._scrollPosition;
       var recycledTiles = 0;
       var hiddenContentSize = this._hiddenContentSize;
       var currentRatio = ratio;
       var movingUp = [];
 
       // track the last `scrollTop`
       this._scrollPosition = scrollTop;
 
-      // clear cached visible indexes
+      // clear cached visible index
       this._firstVisibleIndexVal = null;
       this._lastVisibleIndexVal = null;
 
       scrollBottom = this._scrollBottom;
       physicalBottom = this._physicalBottom;
 
       // random access
       if (Math.abs(delta) > this._physicalSize) {
         this._physicalTop += delta;
         recycledTiles =  Math.round(delta / this._physicalAverage);
@@ skipping 66 matching lines @@
 
       if (recycledTiles === 0) {
         // If the list ever reach this case, the physical average is not significant enough
         // to create all the items needed to cover the entire viewport.
         // e.g. A few items have a height that differs from the average by serveral order of magnitude.
         if (physicalBottom < scrollBottom || this._physicalTop > scrollTop) {
           this.async(this._increasePool.bind(this, 1));
         }
       } else {
         this._virtualStart = this._virtualStart + recycledTiles;
-        this._physicalStart = this._physicalStart + recycledTiles;
         this._update(recycledTileSet, movingUp);
       }
     },
 
     /**
      * Update the list of items, starting from the `_virtualStart` item.
      * @param {!Array<number>=} itemSet
      * @param {!Array<number>=} movingUp
      */
     _update: function(itemSet, movingUp) {
       // manage focus
-      this._manageFocus();
+      if (this._isIndexRendered(this._focusedIndex)) {
+        this._restoreFocusedItem();
+      } else {
+        this._createFocusBackfillItem();
+      }
       // update models
       this._assignModels(itemSet);
       // measure heights
       this._updateMetrics(itemSet);
       // adjust offset after measuring
       if (movingUp) {
         while (movingUp.length) {
           this._physicalTop -= this._physicalSizes[movingUp.pop()];
         }
       }
@@ skipping 46 matching lines @@
         this._debounceTemplate(this._increasePool.bind(this, 1));
       }
       this._lastPage = currentPage;
       return true;
     },
 
     /**
      * Increases the pool size.
      */
     _increasePool: function(missingItems) {
+      // limit the size
       var nextPhysicalCount = Math.min(
           this._physicalCount + missingItems,
           this._virtualCount - this._virtualStart,
           MAX_PHYSICAL_COUNT
         );
       var prevPhysicalCount = this._physicalCount;
       var delta = nextPhysicalCount - prevPhysicalCount;
 
-      if (delta <= 0) {
-        return;
+      if (delta > 0) {
+        [].push.apply(this._physicalItems, this._createPool(delta));
+        [].push.apply(this._physicalSizes, new Array(delta));
+
+        this._physicalCount = prevPhysicalCount + delta;
+        // tail call
+        return this._update();
       }
-
-      [].push.apply(this._physicalItems, this._createPool(delta));
-      [].push.apply(this._physicalSizes, new Array(delta));
-
-      this._physicalCount = prevPhysicalCount + delta;
-
-      // update the physical start if we need to preserve the model of the focused item.
-      // In this situation, the focused item is currently rendered and its model would
-      // have changed after increasing the pool if the physical start remained unchanged.
-      if (this._physicalStart > this._physicalEnd &&
-          this._isIndexRendered(this._focusedIndex) &&
-          this._getPhysicalIndex(this._focusedIndex) < this._physicalEnd) {
-        this._physicalStart = this._physicalStart + delta;
-      }
-      this._update();
     },
 
     /**
      * Render a new list of items. This method does exactly the same as `update`,
      * but it also ensures that only one `update` cycle is created.
      */
     _render: function() {
       var requiresUpdate = this._virtualCount > 0 || this._physicalCount > 0;
 
       if (this.isAttached && !this._itemsRendered && this._isVisible && requiresUpdate) {
@@ skipping 68 matching lines @@
     _forwardParentPath: function(path, value) {
       if (this._physicalItems) {
         this._physicalItems.forEach(function(item) {
           item._templateInstance.notifyPath(path, value, true);
         }, this);
       }
     },
 
     /**
      * Called as a side effect of a host items.<key>.<path> path change,
-     * responsible for notifying item.<path> changes.
+     * responsible for notifying item.<path> changes to row for key.
      */
     _forwardItemPath: function(path, value) {
-      if (!this._physicalIndexForKey) {
-        return;
-      }
-      var inst;
-      var dot = path.indexOf('.');
-      var key = path.substring(0, dot < 0 ? path.length : dot);
-      var idx = this._physicalIndexForKey[key];
-      var el = this._physicalItems[idx];
+      if (this._physicalIndexForKey) {
+        var dot = path.indexOf('.');
+        var key = path.substring(0, dot < 0 ? path.length : dot);
+        var idx = this._physicalIndexForKey[key];
+        var row = this._physicalItems[idx];
 
-
-      if (idx === this._focusedIndex && this._offscreenFocusedItem) {
-        el = this._offscreenFocusedItem;
-      }
-      if (!el) {
-        return;
-      }
-        
-      inst = el._templateInstance;
-
-      if (inst.__key__ !== key) {
-        return;
-      }
-      if (dot >= 0) {
-        path = this.as + '.' + path.substring(dot+1);
-        inst.notifyPath(path, value, true);
-      } else {
-        inst[this.as] = value;
+        if (idx === this._focusedIndex && this._offscreenFocusedItem) {
+          row = this._offscreenFocusedItem;
+        }
+        if (row) {
+          var inst = row._templateInstance;
+          if (dot >= 0) {
+            path = this.as + '.' + path.substring(dot+1);
+            inst.notifyPath(path, value, true);
+          } else {
+            inst[this.as] = value;
+          }
+        }
       }
     },
 
     /**
      * Called when the items have changed. That is, ressignments
      * to `items`, splices or updates to a single item.
      */
     _itemsChanged: function(change) {
       if (change.path === 'items') {
-        // reset items
+
+        this._restoreFocusedItem();
+        // render the new set
+        this._itemsRendered = false;
+        // update the whole set
         this._virtualStart = 0;
         this._physicalTop = 0;
         this._virtualCount = this.items ? this.items.length : 0;
+        this._focusedIndex = 0;
         this._collection = this.items ? Polymer.Collection.get(this.items) : null;
         this._physicalIndexForKey = {};
 
         this._resetScrollPosition(0);
-        this._removeFocusedItem();
 
         // create the initial physical items
         if (!this._physicalItems) {
           this._physicalCount = Math.max(1, Math.min(DEFAULT_PHYSICAL_COUNT, this._virtualCount));
           this._physicalItems = this._createPool(this._physicalCount);
           this._physicalSizes = new Array(this._physicalCount);
         }
-
-        this._physicalStart = 0;
+        this._debounceTemplate(this._render);
 
       } else if (change.path === 'items.splices') {
+        // render the new set
+        this._itemsRendered = false;
         this._adjustVirtualIndex(change.value.indexSplices);
         this._virtualCount = this.items ? this.items.length : 0;
 
+        this._debounceTemplate(this._render);
+
+        if (this._focusedIndex < 0 || this._focusedIndex >= this._virtualCount) {
+          this._focusedIndex = 0;
+        }
+        this._debounceTemplate(this._render);
+
       } else {
         // update a single item
         this._forwardItemPath(change.path.split('.').slice(1).join('.'), change.value);
-        return;
       }
-
-      this._itemsRendered = false;
-      this._debounceTemplate(this._render);
     },
 
     /**
      * @param {!Array<!PolymerSplice>} splices
      */
     _adjustVirtualIndex: function(splices) {
-      splices.forEach(function(splice) {
+      var i, splice, idx;
+
+      for (i = 0; i < splices.length; i++) {
+        splice = splices[i];
+
         // deselect removed items
-        splice.removed.forEach(this._removeItem, this);
+        splice.removed.forEach(this.$.selector.deselect, this.$.selector);
+
+        idx = splice.index;
         // We only need to care about changes happening above the current position
-        if (splice.index < this._virtualStart) {
-          var delta = Math.max(
-              splice.addedCount - splice.removed.length,
-              splice.index - this._virtualStart);
+        if (idx >= this._virtualStart) {
+          break;
+        }
 
-          this._virtualStart = this._virtualStart + delta;
-
-          if (this._focusedIndex >= 0) {
-            this._focusedIndex = this._focusedIndex + delta;
-          }
-        }
-      }, this);
-    },
-
-    _removeItem: function(item) {
-      this.$.selector.deselect(item);
-      // remove the current focused item
-      if (this._focusedItem && this._focusedItem._templateInstance[this.as] === item) {
-        this._removeFocusedItem();
+        this._virtualStart = this._virtualStart +
+            Math.max(splice.addedCount - splice.removed.length, idx - this._virtualStart);
       }
     },
 
     /**
      * Executes a provided function per every physical index in `itemSet`
      * `itemSet` default value is equivalent to the entire set of physical indexes.
      *
      * @param {!function(number, number)} fn
      * @param {!Array<number>=} itemSet
      */
@@ skipping 32 matching lines @@
     /**
      * Assigns the data models to a given set of items.
      * @param {!Array<number>=} itemSet
      */
     _assignModels: function(itemSet) {
       this._iterateItems(function(pidx, vidx) {
         var el = this._physicalItems[pidx];
         var inst = el._templateInstance;
         var item = this.items && this.items[vidx];
 
-        if (item != null) {
+        if (item !== undefined && item !== null) {
           inst[this.as] = item;
           inst.__key__ = this._collection.getKey(item);
           inst[this.selectedAs] = /** @type {!ArraySelectorElement} */ (this.$.selector).isSelected(item);
           inst[this.indexAs] = vidx;
-          inst.tabIndex = this._focusedIndex === vidx ? 0 : -1;
+          inst.tabIndex = vidx === this._focusedIndex ? 0 : -1;
+          el.removeAttribute('hidden');
           this._physicalIndexForKey[inst.__key__] = pidx;
-          el.removeAttribute('hidden');
         } else {
           inst.__key__ = null;
           el.setAttribute('hidden', '');
         }
+
       }, itemSet);
     },
 
     /**
      * Updates the height for a given set of items.
      *
      * @param {!Array<number>=} itemSet
      */
      _updateMetrics: function(itemSet) {
       // Make sure we distributed all the physical items
@@ skipping 27 matching lines @@
 
     /**
      * Updates the position of the physical items.
      */
     _positionItems: function() {
       this._adjustScrollPosition();
 
       var y = this._physicalTop;
 
       this._iterateItems(function(pidx) {
+
         this.translate3d(0, y + 'px', 0, this._physicalItems[pidx]);
         y += this._physicalSizes[pidx];
+
       });
     },
 
     /**
      * Adjusts the scroll position when it was overestimated.
      */
     _adjustScrollPosition: function() {
       var deltaHeight = this._virtualStart === 0 ? this._physicalTop :
           Math.min(this._scrollPosition + this._physicalTop, 0);
 
@@ skipping 27 matching lines @@
 
       forceUpdate = forceUpdate || this._scrollHeight === 0;
       forceUpdate = forceUpdate || this._scrollPosition >= this._estScrollHeight - this._physicalSize;
 
       // amortize height adjustment, so it won't trigger repaints very often
       if (forceUpdate || Math.abs(this._estScrollHeight - this._scrollHeight) >= this._optPhysicalSize) {
         this.$.items.style.height = this._estScrollHeight + 'px';
         this._scrollHeight = this._estScrollHeight;
       }
     },
+
     /**
      * Scroll to a specific item in the virtual list regardless
      * of the physical items in the DOM tree.
      *
      * @method scrollToIndex
      * @param {number} idx The index of the item
      */
     scrollToIndex: function(idx) {
       if (typeof idx !== 'number') {
         return;
       }
 
       Polymer.dom.flush();
 
+      var firstVisible = this.firstVisibleIndex;
       idx = Math.min(Math.max(idx, 0), this._virtualCount-1);
-      // update the virtual start only when needed
-      if (!this._isIndexRendered(idx) || idx >= this._maxVirtualStart) {
-        this._virtualStart = idx - 1;
-      }
-      // manage focus
-      this._manageFocus();
+
+      // start at the previous virtual item
+      // so we have a item above the first visible item
+      this._virtualStart = idx - 1;
       // assign new models
       this._assignModels();
       // measure the new sizes
       this._updateMetrics();
       // estimate new physical offset
       this._physicalTop = this._virtualStart * this._physicalAverage;
 
       var currentTopItem = this._physicalStart;
       var currentVirtualItem = this._virtualStart;
       var targetOffsetTop = 0;
@@ skipping 42 matching lines @@
           this.updateViewportBoundaries();
           this.scrollToIndex(this.firstVisibleIndex);
         }
       });
     },
 
     _getModelFromItem: function(item) {
       var key = this._collection.getKey(item);
       var pidx = this._physicalIndexForKey[key];
 
-      if (pidx != null) {
+      if (pidx !== undefined) {
         return this._physicalItems[pidx]._templateInstance;
       }
       return null;
     },
 
     /**
      * Gets a valid item instance from its index or the object value.
      *
      * @param {(Object|number)} item The item object or its index
      */
@@ skipping 117 matching lines @@
      * Updates the size of an item.
      *
      * @method updateSizeForItem
      * @param {(Object|number)} item The item object or its index
      */
     updateSizeForItem: function(item) {
       item = this._getNormalizedItem(item);
       var key = this._collection.getKey(item);
       var pidx = this._physicalIndexForKey[key];
 
-      if (pidx != null) {
+      if (pidx !== undefined) {
         this._updateMetrics([pidx]);
         this._positionItems();
       }
     },
 
-    /**
-     * Creates a temporary backfill item in the rendered pool of physical items
-     * to replace the main focused item. The focused item has tabIndex = 0
-     * and might be currently focused by the user.
-     *
-     * This dynamic replacement helps to preserve the focus state.
-     */
-    _manageFocus: function() {
-      var fidx = this._focusedIndex;
-
-      if (fidx >= 0 && fidx < this._virtualCount) {
-        // if it's a valid index, check if that index is rendered
-        // in a physical item.
-        if (this._isIndexRendered(fidx)) {
-          this._restoreFocusedItem();
-        } else {
-          this._createFocusBackfillItem();
-        }
-      } else if (this._virtualCount > 0 && this._physicalCount > 0) {
-        // otherwise, assign the initial focused index.
-        this._focusedIndex = this._virtualStart;
-        this._focusedItem = this._physicalItems[this._physicalStart];
-      }
-    },
-
     _isIndexRendered: function(idx) {
       return idx >= this._virtualStart && idx <= this._virtualEnd;
     },
 
-    _isIndexVisible: function(idx) {
-      return idx >= this.firstVisibleIndex && idx <= this.lastVisibleIndex;
-    },
-
-    _getPhysicalIndex: function(idx) {
-      return this._physicalIndexForKey[this._collection.getKey(this._getNormalizedItem(idx))];
+    _getPhysicalItemForIndex: function(idx, force) {
+      if (!this._collection) {
+        return null;
+      }
+      if (!this._isIndexRendered(idx)) {
+        if (force) {
+          this.scrollToIndex(idx);
+          return this._getPhysicalItemForIndex(idx, false);
+        }
+        return null;
+      }
+      var item = this._getNormalizedItem(idx);
+      var physicalItem = this._physicalItems[this._physicalIndexForKey[this._collection.getKey(item)]];
+
+      return physicalItem || null;
     },
 
     _focusPhysicalItem: function(idx) {
-      if (idx < 0 || idx >= this._virtualCount) {
+      this._restoreFocusedItem();
+
+      var physicalItem = this._getPhysicalItemForIndex(idx, true);
+      if (!physicalItem) {
         return;
       }
-      this._restoreFocusedItem();
-      // scroll to index to make sure it's rendered
-      if (!this._isIndexRendered(idx)) {
-        this.scrollToIndex(idx);
-      }
-
-      var physicalItem = this._physicalItems[this._getPhysicalIndex(idx)];
       var SECRET = ~(Math.random() * 100);
       var model = physicalItem._templateInstance;
       var focusable;
 
-      // set a secret tab index
       model.tabIndex = SECRET;
-      // check if focusable element is the physical item
+      // the focusable element could be the entire physical item
       if (physicalItem.tabIndex === SECRET) {
        focusable = physicalItem;
       }
-      // search for the element which tabindex is bound to the secret tab index
+      // the focusable element could be somewhere within the physical item
       if (!focusable) {
         focusable = Polymer.dom(physicalItem).querySelector('[tabindex="' + SECRET + '"]');
       }
       // restore the tab index
       model.tabIndex = 0;
-      // focus the focusable element
-      this._focusedIndex = idx;
       focusable && focusable.focus();
     },
 
+    _restoreFocusedItem: function() {
+      if (!this._offscreenFocusedItem) {
+        return;
+      }
+      var item = this._getNormalizedItem(this._focusedIndex);
+      var pidx = this._physicalIndexForKey[this._collection.getKey(item)];
+
+      if (pidx !== undefined) {
+        this.translate3d(0, HIDDEN_Y, 0, this._physicalItems[pidx]);
+        this._physicalItems[pidx] = this._offscreenFocusedItem;
+      }
+      this._offscreenFocusedItem = null;
+    },
+
     _removeFocusedItem: function() {
-      if (this._offscreenFocusedItem) {
-        Polymer.dom(this).removeChild(this._offscreenFocusedItem);
-      }
+      if (!this._offscreenFocusedItem) {
+        return;
+      }
+      Polymer.dom(this).removeChild(this._offscreenFocusedItem);
       this._offscreenFocusedItem = null;
       this._focusBackfillItem = null;
-      this._focusedItem = null;
-      this._focusedIndex = -1;
     },
 
     _createFocusBackfillItem: function() {
-      var pidx, fidx = this._focusedIndex;
-      if (this._offscreenFocusedItem || fidx < 0) {
+      if (this._offscreenFocusedItem) {
         return;
       }
+      var item = this._getNormalizedItem(this._focusedIndex);
+      var pidx = this._physicalIndexForKey[this._collection.getKey(item)];
+
+      this._offscreenFocusedItem = this._physicalItems[pidx];
+      this.translate3d(0, HIDDEN_Y, 0, this._offscreenFocusedItem);
+
       if (!this._focusBackfillItem) {
-        // create a physical item, so that it backfills the focused item.
         var stampedTemplate = this.stamp(null);
         this._focusBackfillItem = stampedTemplate.root.querySelector('*');
         Polymer.dom(this).appendChild(stampedTemplate.root);
       }
-      // get the physical index for the focused index
-      pidx = this._getPhysicalIndex(fidx);
-
-      if (pidx != null) {
-        // set the offcreen focused physical item
-        this._offscreenFocusedItem = this._physicalItems[pidx];
-        // backfill the focused physical item
-        this._physicalItems[pidx] = this._focusBackfillItem;
-        // hide the focused physical
-        this.translate3d(0, HIDDEN_Y, 0, this._offscreenFocusedItem);
-      }
-    },
-
-    _restoreFocusedItem: function() {
-      var pidx, fidx = this._focusedIndex;
-
-      if (!this._offscreenFocusedItem || this._focusedIndex < 0) {
-        return;
-      }
-      // assign models to the focused index
-      this._assignModels();
-      // get the new physical index for the focused index
-      pidx = this._getPhysicalIndex(fidx);
-
-      if (pidx != null) {
-        // flip the focus backfill
-        this._focusBackfillItem = this._physicalItems[pidx];
-        // restore the focused physical item
-        this._physicalItems[pidx] = this._offscreenFocusedItem;
-        // reset the offscreen focused item
-        this._offscreenFocusedItem = null;
-        // hide the physical item that backfills
-        this.translate3d(0, HIDDEN_Y, 0, this._focusBackfillItem);
-      }
+      this._physicalItems[pidx] = this._focusBackfillItem;
     },
 
     _didFocus: function(e) {
       var targetModel = this.modelForElement(e.target);
-      var focusedModel = this._focusedItem ? this._focusedItem._templateInstance : null;
-      var hasOffscreenFocusedItem = this._offscreenFocusedItem !== null;
       var fidx = this._focusedIndex;
 
-      if (!targetModel || !focusedModel) {
+      if (!targetModel) {
         return;
       }
-      if (focusedModel === targetModel) {
-        // if the user focused the same item, then bring it into view if it's not visible
-        if (!this._isIndexVisible(fidx)) {
-          this.scrollToIndex(fidx);
-        }
+      this._restoreFocusedItem();
+
+      if (this.modelForElement(this._offscreenFocusedItem) === targetModel) {
+        this.scrollToIndex(fidx);
       } else {
-        this._restoreFocusedItem();
         // restore tabIndex for the currently focused item
-        focusedModel.tabIndex = -1;
+        this._getModelFromItem(this._getNormalizedItem(fidx)).tabIndex = -1;
         // set the tabIndex for the next focused item
         targetModel.tabIndex = 0;
-        fidx = targetModel[this.indexAs];
+        fidx = /** @type {{index: number}} */(targetModel).index;
         this._focusedIndex = fidx;
-        this._focusedItem = this._physicalItems[this._getPhysicalIndex(fidx)];
-
-        if (hasOffscreenFocusedItem && !this._offscreenFocusedItem) {
+        // bring the item into view
+        if (fidx < this.firstVisibleIndex || fidx > this.lastVisibleIndex) {
+          this.scrollToIndex(fidx);
+        } else {
           this._update();
         }
       }
     },
 
     _didMoveUp: function() {
-      this._focusPhysicalItem(this._focusedIndex - 1);
+      this._focusPhysicalItem(Math.max(0, this._focusedIndex - 1));
     },
 
     _didMoveDown: function() {
-      this._focusPhysicalItem(this._focusedIndex + 1);
+      this._focusPhysicalItem(Math.min(this._virtualCount, this._focusedIndex + 1));
     },
 
     _didEnter: function(e) {
+      // focus the currently focused physical item
       this._focusPhysicalItem(this._focusedIndex);
-      this._selectionHandler(e.detail.keyboardEvent);
+      // toggle selection
+      this._selectionHandler(/** @type {{keyboardEvent: Event}} */(e.detail).keyboardEvent);
     }
   });
 
 })();
+// Copyright (c) 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.
+
+/**
+ * @fileoverview Assertion support.
+ */
+
+/**
+ * Verify |condition| is truthy and return |condition| if so.
+ * @template T
+ * @param {T} condition A condition to check for truthiness.  Note that this
+ *     may be used to test whether a value is defined or not, and we don't want
+ *     to force a cast to Boolean.
+ * @param {string=} opt_message A message to show on failure.
+ * @return {T} A non-null |condition|.
+ */
+function assert(condition, opt_message) {
+  if (!condition) {
+    var message = 'Assertion failed';
+    if (opt_message)
+      message = message + ': ' + opt_message;
+    var error = new Error(message);
+    var global = function() { return this; }();
+    if (global.traceAssertionsForTesting)
+      console.warn(error.stack);
+    throw error;
+  }
+  return condition;
+}
+
+/**
+ * Call this from places in the code that should never be reached.
+ *
+ * For example, handling all the values of enum with a switch() like this:
+ *
+ *   function getValueFromEnum(enum) {
+ *     switch (enum) {
+ *       case ENUM_FIRST_OF_TWO:
+ *         return first
+ *       case ENUM_LAST_OF_TWO:
+ *         return last;
+ *     }
+ *     assertNotReached();
+ *     return document;
+ *   }
+ *
+ * This code should only be hit in the case of serious programmer error or
+ * unexpected input.
+ *
+ * @param {string=} opt_message A message to show when this is hit.
+ */
+function assertNotReached(opt_message) {
+  assert(false, opt_message || 'Unreachable code hit');
+}
+
+/**
+ * @param {*} value The value to check.
+ * @param {function(new: T, ...)} type A user-defined constructor.
+ * @param {string=} opt_message A message to show when this is hit.
+ * @return {T}
+ * @template T
+ */
+function assertInstanceof(value, type, opt_message) {
+  // We don't use assert immediately here so that we avoid constructing an error
+  // message if we don't have to.
+  if (!(value instanceof type)) {
+    assertNotReached(opt_message || 'Value ' + value +
+                     ' is not a[n] ' + (type.name || typeof type));
+  }
+  return value;
+};
+// Copyright 2015 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.
+
+cr.define('downloads', function() {
+  /**
+   * @param {string} chromeSendName
+   * @return {function(string):void} A chrome.send() callback with curried name.
+   */
+  function chromeSendWithId(chromeSendName) {
+    return function(id) { chrome.send(chromeSendName, [id]); };
+  }
+
+  /** @constructor */
+  function ActionService() {
+    /** @private {Array<string>} */
+    this.searchTerms_ = [];
+  }
+
+  /**
+   * @param {string} s
+   * @return {string} |s| without whitespace at the beginning or end.
+   */
+  function trim(s) { return s.trim(); }
+
+  /**
+   * @param {string|undefined} value
+   * @return {boolean} Whether |value| is truthy.
+   */
+  function truthy(value) { return !!value; }
+
+  /**
+   * @param {string} searchText Input typed by the user into a search box.
+   * @return {Array<string>} A list of terms extracted from |searchText|.
+   */
+  ActionService.splitTerms = function(searchText) {
+    // Split quoted terms (e.g., 'The "lazy" dog' => ['The', 'lazy', 'dog']).
+    return searchText.split(/"([^"]*)"/).map(trim).filter(truthy);
+  };
+
+  ActionService.prototype = {
+    /** @param {string} id ID of the download to cancel. */
+    cancel: chromeSendWithId('cancel'),
+
+    /** Instructs the browser to clear all finished downloads. */
+    clearAll: function() {
+      if (loadTimeData.getBoolean('allowDeletingHistory')) {
+        chrome.send('clearAll');
+        this.search('');
+      }
+    },
+
+    /** @param {string} id ID of the dangerous download to discard. */
+    discardDangerous: chromeSendWithId('discardDangerous'),
+
+    /** @param {string} url URL of a file to download. */
+    download: function(url) {
+      var a = document.createElement('a');
+      a.href = url;
+      a.setAttribute('download', '');
+      a.click();
+    },
+
+    /** @param {string} id ID of the download that the user started dragging. */
+    drag: chromeSendWithId('drag'),
+
+    /** Loads more downloads with the current search terms. */
+    loadMore: function() {
+      chrome.send('getDownloads', this.searchTerms_);
+    },
+
+    /**
+     * @return {boolean} Whether the user is currently searching for downloads
+     *     (i.e. has a non-empty search term).
+     */
+    isSearching: function() {
+      return this.searchTerms_.length > 0;
+    },
+
+    /** Opens the current local destination for downloads. */
+    openDownloadsFolder: chrome.send.bind(chrome, 'openDownloadsFolder'),
+
+    /**
+     * @param {string} id ID of the download to run locally on the user's box.
+     */
+    openFile: chromeSendWithId('openFile'),
+
+    /** @param {string} id ID the of the progressing download to pause. */
+    pause: chromeSendWithId('pause'),
+
+    /** @param {string} id ID of the finished download to remove. */
+    remove: chromeSendWithId('remove'),
+
+    /** @param {string} id ID of the paused download to resume. */
+    resume: chromeSendWithId('resume'),
+
+    /**
+     * @param {string} id ID of the dangerous download to save despite
+     *     warnings.
+     */
+    saveDangerous: chromeSendWithId('saveDangerous'),
+
+    /** @param {string} searchText What to search for. */
+    search: function(searchText) {
+      var searchTerms = ActionService.splitTerms(searchText);
+      var sameTerms = searchTerms.length == this.searchTerms_.length;
+
+      for (var i = 0; sameTerms && i < searchTerms.length; ++i) {
+        if (searchTerms[i] != this.searchTerms_[i])
+          sameTerms = false;
+      }
+
+      if (sameTerms)
+        return;
+
+      this.searchTerms_ = searchTerms;
+      this.loadMore();
+    },
+
+    /**
+     * Shows the local folder a finished download resides in.
+     * @param {string} id ID of the download to show.
+     */
+    show: chromeSendWithId('show'),
+
+    /** Undo download removal. */
+    undo: chrome.send.bind(chrome, 'undo'),
+  };
+
+  cr.addSingletonGetter(ActionService);
+
+  return {ActionService: ActionService};
+});
+// Copyright 2015 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.
+
+cr.define('downloads', function() {
+  /**
+   * Explains why a download is in DANGEROUS state.
+   * @enum {string}
+   */
+  var DangerType = {
+    NOT_DANGEROUS: 'NOT_DANGEROUS',
+    DANGEROUS_FILE: 'DANGEROUS_FILE',
+    DANGEROUS_URL: 'DANGEROUS_URL',
+    DANGEROUS_CONTENT: 'DANGEROUS_CONTENT',
+    UNCOMMON_CONTENT: 'UNCOMMON_CONTENT',
+    DANGEROUS_HOST: 'DANGEROUS_HOST',
+    POTENTIALLY_UNWANTED: 'POTENTIALLY_UNWANTED',
+  };
+
+  /**
+   * The states a download can be in. These correspond to states defined in
+   * DownloadsDOMHandler::CreateDownloadItemValue
+   * @enum {string}
+   */
+  var States = {
+    IN_PROGRESS: 'IN_PROGRESS',
+    CANCELLED: 'CANCELLED',
+    COMPLETE: 'COMPLETE',
+    PAUSED: 'PAUSED',
+    DANGEROUS: 'DANGEROUS',
+    INTERRUPTED: 'INTERRUPTED',
+  };
+
+  return {
+    DangerType: DangerType,
+    States: States,
+  };
+});
+// Copyright 2014 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.
+
+// Action links are elements that are used to perform an in-page navigation or
+// action (e.g. showing a dialog).
+//
+// They look like normal anchor (<a>) tags as their text color is blue. However,
+// they're subtly different as they're not initially underlined (giving users a
+// clue that underlined links navigate while action links don't).
+//
+// Action links look very similar to normal links when hovered (hand cursor,
+// underlined). This gives the user an idea that clicking this link will do
+// something similar to navigation but in the same page.
+//
+// They can be created in JavaScript like this:
+//
+//   var link = document.createElement('a', 'action-link');  // Note second arg.
+//
+// or with a constructor like this:
+//
+//   var link = new ActionLink();
+//
+// They can be used easily from HTML as well, like so:
+//
+//   <a is="action-link">Click me!</a>
+//
+// NOTE: <action-link> and document.createElement('action-link') don't work.
+
+/**
+ * @constructor
+ * @extends {HTMLAnchorElement}
+ */
+var ActionLink = document.registerElement('action-link', {
+  prototype: {
+    __proto__: HTMLAnchorElement.prototype,
+
+    /** @this {ActionLink} */
+    createdCallback: function() {
+      // Action links can start disabled (e.g. <a is="action-link" disabled>).
+      this.tabIndex = this.disabled ? -1 : 0;
+
+      if (!this.hasAttribute('role'))
+        this.setAttribute('role', 'link');
+
+      this.addEventListener('keydown', function(e) {
+        if (!this.disabled && e.keyIdentifier == 'Enter' && !this.href) {
+          // Schedule a click asynchronously because other 'keydown' handlers
+          // may still run later (e.g. document.addEventListener('keydown')).
+          // Specifically options dialogs break when this timeout isn't here.
+          // NOTE: this affects the "trusted" state of the ensuing click. I
+          // haven't found anything that breaks because of this (yet).
+          window.setTimeout(this.click.bind(this), 0);
+        }
+      });
+
+      function preventDefault(e) {
+        e.preventDefault();
+      }
+
+      function removePreventDefault() {
+        document.removeEventListener('selectstart', preventDefault);
+        document.removeEventListener('mouseup', removePreventDefault);
+      }
+
+      this.addEventListener('mousedown', function() {
+        // This handlers strives to match the behavior of <a href="...">.
+
+        // While the mouse is down, prevent text selection from dragging.
+        document.addEventListener('selectstart', preventDefault);
+        document.addEventListener('mouseup', removePreventDefault);
+
+        // If focus started via mouse press, don't show an outline.
+        if (document.activeElement != this)
+          this.classList.add('no-outline');
+      });
+
+      this.addEventListener('blur', function() {
+        this.classList.remove('no-outline');
+      });
+    },
+
+    /** @type {boolean} */
+    set disabled(disabled) {
+      if (disabled)
+        HTMLAnchorElement.prototype.setAttribute.call(this, 'disabled', '');
+      else
+        HTMLAnchorElement.prototype.removeAttribute.call(this, 'disabled');
+      this.tabIndex = disabled ? -1 : 0;
+    },
+    get disabled() {
+      return this.hasAttribute('disabled');
+    },
+
+    /** @override */
+    setAttribute: function(attr, val) {
+      if (attr.toLowerCase() == 'disabled')
+        this.disabled = true;
+      else
+        HTMLAnchorElement.prototype.setAttribute.apply(this, arguments);
+    },
+
+    /** @override */
+    removeAttribute: function(attr) {
+      if (attr.toLowerCase() == 'disabled')
+        this.disabled = false;
+      else
+        HTMLAnchorElement.prototype.removeAttribute.apply(this, arguments);
+    },
+  },
+
+  extends: 'a',
+});
 (function() {
 
     // monostate data
     var metaDatas = {};
     var metaArrays = {};
     var singleton = null;
 
     Polymer.IronMeta = Polymer({
 
       is: 'iron-meta',
@@ skipping 295 matching lines @@
          */
         src: {
           type: String,
           observer: '_srcChanged'
         },
 
         /**
          * @type {!Polymer.IronMeta}
          */
         _meta: {
-          value: Polymer.Base.create('iron-meta', {type: 'iconset'}),
-          observer: '_updateIcon'
+          value: Polymer.Base.create('iron-meta', {type: 'iconset'})
         }
 
       },
 
       _DEFAULT_ICONSET: 'icons',
 
       _iconChanged: function(icon) {
         var parts = (icon || '').split(':');
         this._iconName = parts.pop();
         this._iconsetName = parts.pop() || this._DEFAULT_ICONSET;
         this._updateIcon();
       },
 
       _srcChanged: function(src) {
         this._updateIcon();
       },
 
       _usesIconset: function() {
         return this.icon || !this.src;
       },
 
       /** @suppress {visibility} */
       _updateIcon: function() {
         if (this._usesIconset()) {
-          if (this._img && this._img.parentNode) {
-            Polymer.dom(this.root).removeChild(this._img);
-          }
-          if (this._iconName === "") {
-            if (this._iconset) {
-              this._iconset.removeIcon(this);
-            }
-          } else if (this._iconsetName && this._meta) {
+          if (this._iconsetName) {
             this._iconset = /** @type {?Polymer.Iconset} */ (
               this._meta.byKey(this._iconsetName));
             if (this._iconset) {
               this._iconset.applyIcon(this, this._iconName, this.theme);
               this.unlisten(window, 'iron-iconset-added', '_updateIcon');
             } else {
               this.listen(window, 'iron-iconset-added', '_updateIcon');
             }
           }
         } else {
-          if (this._iconset) {
-            this._iconset.removeIcon(this);
-          }
           if (!this._img) {
             this._img = document.createElement('img');
             this._img.style.width = '100%';
             this._img.style.height = '100%';
             this._img.draggable = false;
           }
           this._img.src = this.src;
           Polymer.dom(this.root).appendChild(this._img);
         }
       }
@@ skipping 248 matching lines @@
       }
     },
 
     _disabledChanged: function(disabled, old) {
       this.setAttribute('aria-disabled', disabled ? 'true' : 'false');
       this.style.pointerEvents = disabled ? 'none' : '';
       if (disabled) {
         this._oldTabIndex = this.tabIndex;
         this.focused = false;
         this.tabIndex = -1;
-        this.blur();
       } else if (this._oldTabIndex !== undefined) {
         this.tabIndex = this._oldTabIndex;
       }
     },
 
     _changedControlState: function() {
       // _controlStateChanged is abstract, follow-on behaviors may implement it
       if (this._controlStateChanged) {
         this._controlStateChanged();
       }
@@ skipping 1710 matching lines @@
 
     /**
      * Sets the selection state for a given item to either selected or deselected.
      *
      * @method setItemSelected
      * @param {*} item The item to select.
      * @param {boolean} isSelected True for selected, false for deselected.
      */
     setItemSelected: function(item, isSelected) {
       if (item != null) {
-        if (isSelected !== this.isSelected(item)) {
-          // proceed to update selection only if requested state differs from current
-          if (isSelected) {
-            this.selection.push(item);
-          } else {
-            var i = this.selection.indexOf(item);
-            if (i >= 0) {
-              this.selection.splice(i, 1);
-            }
+        if (isSelected) {
+          this.selection.push(item);
+        } else {
+          var i = this.selection.indexOf(item);
+          if (i >= 0) {
+            this.selection.splice(i, 1);
           }
-          if (this.selectCallback) {
-            this.selectCallback(item, isSelected);
-          }
+        }
+        if (this.selectCallback) {
+          this.selectCallback(item, isSelected);
         }
       }
     },
 
     /**
      * Sets the selection state for a given item. If the `multi` property
      * is true, then the selected state of `item` will be toggled; otherwise
      * the `item` will be selected.
      *
      * @method select
@@ skipping 136 matching lines @@
         type: Object,
         value: function() {
           return {
             'template': 1
           };
         }
       }
     },
 
     observers: [
-      '_updateAttrForSelected(attrForSelected)',
-      '_updateSelected(selected)'
+      '_updateSelected(attrForSelected, selected)'
     ],
 
     created: function() {
       this._bindFilterItem = this._filterItem.bind(this);
       this._selection = new Polymer.IronSelection(this._applySelection.bind(this));
     },
 
     attached: function() {
       this._observer = this._observeItems(this);
       this._updateItems();
       if (!this._shouldUpdateSelection) {
-        this._updateSelected();
+        this._updateSelected(this.attrForSelected,this.selected)
       }
       this._addListener(this.activateEvent);
     },
 
     detached: function() {
       if (this._observer) {
         Polymer.dom(this).unobserveNodes(this._observer);
       }
       this._removeListener(this.activateEvent);
     },
@@ skipping 72 matching lines @@
       this._removeListener(old);
       this._addListener(eventName);
     },
 
     _updateItems: function() {
       var nodes = Polymer.dom(this).queryDistributedElements(this.selectable || '*');
       nodes = Array.prototype.filter.call(nodes, this._bindFilterItem);
       this._setItems(nodes);
     },
 
-    _updateAttrForSelected: function() {
-      if (this._shouldUpdateSelection) {
-        this.selected = this._indexToValue(this.indexOf(this.selectedItem));        
-      }
-    },
-
     _updateSelected: function() {
       this._selectSelected(this.selected);
     },
 
     _selectSelected: function(selected) {
       this._selection.select(this._valueToItem(this.selected));
     },
 
     _filterItem: function(node) {
       return !this._excludedLocalNames[node.localName];
@@ skipping 49 matching lines @@
     // observe items change under the given node.
     _observeItems: function(node) {
       return Polymer.dom(node).observeNodes(function(mutations) {
         this._updateItems();
 
         if (this._shouldUpdateSelection) {
           this._updateSelected();
         }
 
         // Let other interested parties know about the change so that
-        // we don't have to recreate mutation observers everywhere.
+        // we don't have to recreate mutation observers everywher.
         this.fire('iron-items-changed', mutations, {
           bubbles: false,
           cancelable: false
         });
       });
     },
 
     _activateHandler: function(e) {
       var t = e.target;
       var items = this.items;
@@ skipping 43 matching lines @@
        */
       selectedItems: {
         type: Array,
         readOnly: true,
         notify: true
       },
 
     },
 
     observers: [
-      '_updateSelected(selectedValues)'
+      '_updateSelected(attrForSelected, selectedValues)'
     ],
 
     /**
      * Selects the given value. If the `multi` property is true, then the selected state of the
      * `value` will be toggled; otherwise the `value` will be selected.
      *
      * @method select
      * @param {string|number} value the value to select.
      */
     select: function(value) {
@@ skipping 10 matching lines @@
 
     multiChanged: function(multi) {
       this._selection.multi = multi;
     },
 
     get _shouldUpdateSelection() {
       return this.selected != null ||
         (this.selectedValues != null && this.selectedValues.length);
     },
 
-    _updateAttrForSelected: function() {
-      if (!this.multi) {
-        Polymer.IronSelectableBehavior._updateAttrForSelected.apply(this);
-      } else if (this._shouldUpdateSelection) {
-        this.selectedValues = this.selectedItems.map(function(selectedItem) {
-          return this._indexToValue(this.indexOf(selectedItem));        
-        }, this).filter(function(unfilteredValue) {
-          return unfilteredValue != null;
-        }, this);
-      }
-    },
-
     _updateSelected: function() {
       if (this.multi) {
         this._selectMulti(this.selectedValues);
       } else {
         this._selectSelected(this.selected);
       }
     },
 
     _selectMulti: function(values) {
+      this._selection.clear();
       if (values) {
-        var selectedItems = this._valuesToItems(values);
-        // clear all but the current selected items
-        this._selection.clear(selectedItems);
-        // select only those not selected yet
-        for (var i = 0; i < selectedItems.length; i++) {
-          this._selection.setItemSelected(selectedItems[i], true);
+        for (var i = 0; i < values.length; i++) {
+          this._selection.setItemSelected(this._valueToItem(values[i]), true);
         }
-      } else {
-        this._selection.clear();
       }
     },
 
     _selectionChange: function() {
       var s = this._selection.get();
       if (this.multi) {
         this._setSelectedItems(s);
       } else {
         this._setSelectedItems([s]);
         this._setSelectedItem(s);
       }
     },
 
     _toggleSelected: function(value) {
       var i = this.selectedValues.indexOf(value);
       var unselected = i < 0;
       if (unselected) {
         this.push('selectedValues',value);
       } else {
         this.splice('selectedValues',i,1);
       }
       this._selection.setItemSelected(this._valueToItem(value), unselected);
-    },
-
-    _valuesToItems: function(values) {
-      return (values == null) ? null : values.map(function(value) {
-        return this._valueToItem(value);
-      }, this);
     }
   };
 
   /** @polymerBehavior */
   Polymer.IronMultiSelectableBehavior = [
     Polymer.IronSelectableBehavior,
     Polymer.IronMultiSelectableBehaviorImpl
   ];
 /**
    * `Polymer.IronMenuBehavior` implements accessible menu behavior.
@@ skipping 213 matching lines @@
      * Handler that is called when the menu receives focus.
      *
      * @param {FocusEvent} event A focus event.
      */
     _onFocus: function(event) {
       if (Polymer.IronMenuBehaviorImpl._shiftTabPressed) {
         // do not focus the menu itself
         return;
       }
 
-      // Do not focus the selected tab if the deepest target is part of the
-      // menu element's local DOM and is focusable.
-      var rootTarget = /** @type {?HTMLElement} */(
-          Polymer.dom(event).rootTarget);
-      if (rootTarget !== this && typeof rootTarget.tabIndex !== "undefined" && !this.isLightDescendant(rootTarget)) {
-        return;
-      }
-
       this.blur();
 
       // clear the cached focus item
       this._defaultFocusAsync = this.async(function() {
         // focus the selected item when the menu receives focus, or the first item
         // if no item is selected
         var selectedItem = this.multi ? (this.selectedItems && this.selectedItems[0]) : this.selectedItem;
 
         this._setFocusedItem(null);
 
         if (selectedItem) {
           this._setFocusedItem(selectedItem);
         } else {
           this._setFocusedItem(this.items[0]);
         }
       // async 1ms to wait for `select` to get called from `_itemActivate`
       }, 1);
     },
 
     /**
      * Handler that is called when the up key is pressed.
      *
      * @param {CustomEvent} event A key combination event.
      */
     _onUpKey: function(event) {
       // up and down arrows moves the focus
       this._focusPrevious();
-      event.detail.keyboardEvent.preventDefault();
     },
 
     /**
      * Handler that is called when the down key is pressed.
      *
      * @param {CustomEvent} event A key combination event.
      */
     _onDownKey: function(event) {
       this._focusNext();
-      event.detail.keyboardEvent.preventDefault();
     },
 
     /**
      * Handler that is called when the esc key is pressed.
      *
      * @param {CustomEvent} event A key combination event.
      */
     _onEscKey: function(event) {
       // esc blurs the control
       this.focusedItem.blur();
@@ skipping 188 matching lines @@
           left: parseInt(target.marginLeft, 10) || 0
         }
       };
     },
 
     /**
      * Resets the target element's position and size constraints, and clear
      * the memoized data.
      */
     resetFit: function() {
+      if (!this._fitInfo || !this._fitInfo.sizedBy.height) {
+        this.sizingTarget.style.maxHeight = '';
+        this.style.top = this._fitInfo ? this._fitInfo.inlineStyle.top : '';
+      }
       if (!this._fitInfo || !this._fitInfo.sizedBy.width) {
         this.sizingTarget.style.maxWidth = '';
+        this.style.left = this._fitInfo ? this._fitInfo.inlineStyle.left : '';
       }
-      if (!this._fitInfo || !this._fitInfo.sizedBy.height) {
-        this.sizingTarget.style.maxHeight = '';
-      }
-      this.style.top = this._fitInfo ? this._fitInfo.inlineStyle.top : '';
-      this.style.left = this._fitInfo ? this._fitInfo.inlineStyle.left : '';
       if (this._fitInfo) {
         this.style.position = this._fitInfo.positionedBy.css;
       }
       this._fitInfo = null;
     },
 
     /**
      * Equivalent to calling `resetFit()` and `fit()`. Useful to call this after the element,
      * the window, or the `fitInfo` element has been resized.
      */
@@ skipping 40 matching lines @@
       var offsetExtent = 'offset' + extent;
       var sizingOffset = this[offsetExtent] - this.sizingTarget[offsetExtent];
       this.sizingTarget.style['max' + extent] = (max - margin - offset - sizingOffset) + 'px';
     },
 
     /**
      * Centers horizontally and vertically if not already positioned. This also sets
      * `position:fixed`.
      */
     center: function() {
-      var positionedBy = this._fitInfo.positionedBy;
-      if (positionedBy.vertically && positionedBy.horizontally) {
-        // Already positioned.
-        return;
+      if (!this._fitInfo.positionedBy.vertically || !this._fitInfo.positionedBy.horizontally) {
+        // need position:fixed to center
+        this.style.position = 'fixed';
       }
-      // Need position:fixed to center
-      this.style.position = 'fixed';
-      // Take into account the offset caused by parents that create stacking
-      // contexts (e.g. with transform: translate3d). Translate to 0,0 and
-      // measure the bounding rect.
-      if (!positionedBy.vertically) {
-        this.style.top = '0px';
-      }
-      if (!positionedBy.horizontally) {
-        this.style.left = '0px';
-      }
-      // It will take in consideration margins and transforms
-      var rect = this.getBoundingClientRect();
-      if (!positionedBy.vertically) {
-        var top = this._fitTop - rect.top + (this._fitHeight - rect.height) / 2;
+      if (!this._fitInfo.positionedBy.vertically) {
+        var top = (this._fitHeight - this.offsetHeight) / 2 + this._fitTop;
+        top -= this._fitInfo.margin.top;
         this.style.top = top + 'px';
       }
-      if (!positionedBy.horizontally) {
-        var left = this._fitLeft - rect.left + (this._fitWidth - rect.width) / 2;
+      if (!this._fitInfo.positionedBy.horizontally) {
+        var left = (this._fitWidth - this.offsetWidth) / 2 + this._fitLeft;
+        left -= this._fitInfo.margin.left;
         this.style.left = left + 'px';
       }
     }
 
   };
 /**
    * @struct
    * @constructor
    */
   Polymer.IronOverlayManagerClass = function() {
     this._overlays = [];
-    // Used to keep track of the last focused node before an overlay gets opened.
-    this._lastFocusedNodes = [];
-
     /**
      * iframes have a default z-index of 100, so this default should be at least
      * that.
      * @private {number}
      */
     this._minimumZ = 101;
 
     this._backdrops = [];
-
-    this._backdropElement = null;
-    Object.defineProperty(this, 'backdropElement', {
-      get: function() {
-        if (!this._backdropElement) {
-          this._backdropElement = document.createElement('iron-overlay-backdrop');
-        }
-        return this._backdropElement;
-      }.bind(this)
-    });
-
-    /**
-     * The deepest active element.
-     * returns {?Node} element the active element
-     */
-    this.deepActiveElement = null;
-    Object.defineProperty(this, 'deepActiveElement', {
-      get: function() {
-        var active = document.activeElement;
-        // document.activeElement can be null
-        // https://developer.mozilla.org/en-US/docs/Web/API/Document/activeElement
-        while (active && active.root && Polymer.dom(active.root).activeElement) {
-          active = Polymer.dom(active.root).activeElement;
-        }
-        return active;
-      }.bind(this)
-    });
-  };
-
-  /**
-   * If a node is contained in an overlay.
-   * @private
-   * @param {Node} node
-   * @returns {Boolean}
-   */
-  Polymer.IronOverlayManagerClass.prototype._isChildOfOverlay = function(node) {
-    while (node && node !== document.body) {
-      // Use logical parentNode, or native ShadowRoot host.
-      node = Polymer.dom(node).parentNode || node.host;
-      // Check if it is an overlay.
-      if (node && node.behaviors && node.behaviors.indexOf(Polymer.IronOverlayBehaviorImpl) !== -1) {
-        return true;
-      }
-    }
-    return false;
-  };
+  }
 
   Polymer.IronOverlayManagerClass.prototype._applyOverlayZ = function(overlay, aboveZ) {
     this._setZ(overlay, aboveZ + 2);
   };
 
   Polymer.IronOverlayManagerClass.prototype._setZ = function(element, z) {
     element.style.zIndex = z;
   };
 
   /**
    * track overlays for z-index and focus managemant
    */
   Polymer.IronOverlayManagerClass.prototype.addOverlay = function(overlay) {
     var minimumZ = Math.max(this.currentOverlayZ(), this._minimumZ);
     this._overlays.push(overlay);
     var newZ = this.currentOverlayZ();
     if (newZ <= minimumZ) {
       this._applyOverlayZ(overlay, minimumZ);
     }
-    var element = this.deepActiveElement;
-    // If already in other overlay, don't reset focus there.
-    if (this._isChildOfOverlay(element)) {
-      element = null;
-    }
-    this._lastFocusedNodes.push(element);
   };
 
   Polymer.IronOverlayManagerClass.prototype.removeOverlay = function(overlay) {
     var i = this._overlays.indexOf(overlay);
     if (i >= 0) {
       this._overlays.splice(i, 1);
       this._setZ(overlay, '');
-
-      var node = this._lastFocusedNodes[i];
-      // Focus only if still contained in document.body
-      if (overlay.restoreFocusOnClose && node && Polymer.dom(document.body).deepContains(node)) {
-        node.focus();
-      }
-      this._lastFocusedNodes.splice(i, 1);
     }
   };
 
   Polymer.IronOverlayManagerClass.prototype.currentOverlay = function() {
     var i = this._overlays.length - 1;
     while (this._overlays[i] && !this._overlays[i].opened) {
       --i;
     }
     return this._overlays[i];
   };
@@ skipping 34 matching lines @@
     if (element.opened && element.withBackdrop) {
       // no duplicates
       if (index === -1) {
         this._backdrops.push(element);
       }
     } else if (index >= 0) {
       this._backdrops.splice(index, 1);
     }
   };
 
+  Object.defineProperty(Polymer.IronOverlayManagerClass.prototype, "backdropElement", {
+    get: function() {
+      if (!this._backdropElement) {
+        this._backdropElement = document.createElement('iron-overlay-backdrop');
+      }
+      return this._backdropElement;
+    }
+  });
+
   Polymer.IronOverlayManagerClass.prototype.getBackdrops = function() {
     return this._backdrops;
   };
 
   /**
    * Returns the z-index for the backdrop.
    */
   Polymer.IronOverlayManagerClass.prototype.backdropZ = function() {
     return this._getOverlayZ(this._overlayWithBackdrop()) - 1;
   };
@@ skipping 209 matching lines @@
 
       /**
        * Returns the reason this dialog was last closed.
        */
       closingReason: {
         // was a getter before, but needs to be a property so other
         // behaviors can override this.
         type: Object
       },
 
-      /**
-       * The HTMLElement that will be firing relevant KeyboardEvents.
-       * Used for capturing esc and tab. Overridden from `IronA11yKeysBehavior`.
-       */
-      keyEventTarget: {
-        type: Object,
-        value: document
-      },
-
-      /**
-       * Set to true to enable restoring of focus when overlay is closed.
-       */
-      restoreFocusOnClose: {
-        type: Boolean,
-        value: false
-      },
-
       _manager: {
         type: Object,
         value: Polymer.IronOverlayManager
       },
 
       _boundOnCaptureClick: {
         type: Function,
         value: function() {
           return this._onCaptureClick.bind(this);
         }
       },
 
+      _boundOnCaptureKeydown: {
+        type: Function,
+        value: function() {
+          return this._onCaptureKeydown.bind(this);
+        }
+      },
+
       _boundOnCaptureFocus: {
         type: Function,
         value: function() {
           return this._onCaptureFocus.bind(this);
         }
       },
 
-      /**
-       * The node being focused.
-       * @type {?Node}
-       */
+      /** @type {?Node} */
       _focusedChild: {
         type: Object
       }
 
     },
 
-    keyBindings: {
-      'esc': '__onEsc',
-      'tab': '__onTab'
-    },
-
     listeners: {
       'iron-resize': '_onIronResize'
     },
 
     /**
      * The backdrop element.
-     * @type {Node}
+     * @type Node
      */
     get backdropElement() {
       return this._manager.backdropElement;
     },
 
-    /**
-     * Returns the node to give focus to.
-     * @type {Node}
-     */
     get _focusNode() {
       return this._focusedChild || Polymer.dom(this).querySelector('[autofocus]') || this;
     },
 
-    /**
-     * Array of nodes that can receive focus (overlay included), ordered by `tabindex`.
-     * This is used to retrieve which is the first and last focusable nodes in order
-     * to wrap the focus for overlays `with-backdrop`.
-     *
-     * If you know what is your content (specifically the first and last focusable children),
-     * you can override this method to return only `[firstFocusable, lastFocusable];`
-     * @type {[Node]}
-     * @protected
-     */
-    get _focusableNodes() {
-      // Elements that can be focused even if they have [disabled] attribute.
-      var FOCUSABLE_WITH_DISABLED = [
-        'a[href]',
-        'area[href]',
-        'iframe',
-        '[tabindex]',
-        '[contentEditable=true]'
-      ];
-
-      // Elements that cannot be focused if they have [disabled] attribute.
-      var FOCUSABLE_WITHOUT_DISABLED = [
-        'input',
-        'select',
-        'textarea',
-        'button'
-      ];
-
-      // Discard elements with tabindex=-1 (makes them not focusable).
-      var selector = FOCUSABLE_WITH_DISABLED.join(':not([tabindex="-1"]),') +
-        ':not([tabindex="-1"]),' +
-        FOCUSABLE_WITHOUT_DISABLED.join(':not([disabled]):not([tabindex="-1"]),') +
-        ':not([disabled]):not([tabindex="-1"])';
-
-      var focusables = Polymer.dom(this).querySelectorAll(selector);
-      if (this.tabIndex >= 0) {
-        // Insert at the beginning because we might have all elements with tabIndex = 0,
-        // and the overlay should be the first of the list.
-        focusables.splice(0, 0, this);
-      }
-      // Sort by tabindex.
-      return focusables.sort(function (a, b) {
-        if (a.tabIndex === b.tabIndex) {
-          return 0;
-        }
-        if (a.tabIndex === 0 || a.tabIndex > b.tabIndex) {
-          return 1;
-        }
-        return -1;
-      });
-    },
-
     ready: function() {
-      // with-backdrop needs tabindex to be set in order to trap the focus.
+      // with-backdrop need tabindex to be set in order to trap the focus.
       // If it is not set, IronOverlayBehavior will set it, and remove it if with-backdrop = false.
       this.__shouldRemoveTabIndex = false;
-      // Used for wrapping the focus on TAB / Shift+TAB.
-      this.__firstFocusableNode = this.__lastFocusableNode = null;
       this._ensureSetup();
     },
 
     attached: function() {
       // Call _openedChanged here so that position can be computed correctly.
-      if (this.opened) {
+      if (this._callOpenedWhenReady) {
         this._openedChanged();
       }
-      this._observer = Polymer.dom(this).observeNodes(this._onNodesChange);
     },
 
     detached: function() {
-      Polymer.dom(this).unobserveNodes(this._observer);
-      this._observer = null;
       this.opened = false;
       this._manager.trackBackdrop(this);
       this._manager.removeOverlay(this);
     },
 
     /**
      * Toggle the opened state of the overlay.
      */
     toggle: function() {
       this._setCanceled(false);
@@ skipping 11 matching lines @@
     /**
      * Close the overlay.
      */
     close: function() {
       this._setCanceled(false);
       this.opened = false;
     },
 
     /**
      * Cancels the overlay.
-     * @param {?Event} event The original event
      */
-    cancel: function(event) {
-      var cancelEvent = this.fire('iron-overlay-canceled', event, {cancelable: true});
+    cancel: function() {
+      var cancelEvent = this.fire('iron-overlay-canceled', undefined, {cancelable: true});
       if (cancelEvent.defaultPrevented) {
         return;
       }
 
       this._setCanceled(true);
       this.opened = false;
     },
 
     _ensureSetup: function() {
       if (this._overlaySetup) {
         return;
       }
       this._overlaySetup = true;
       this.style.outline = 'none';
       this.style.display = 'none';
     },
 
     _openedChanged: function() {
       if (this.opened) {
         this.removeAttribute('aria-hidden');
       } else {
         this.setAttribute('aria-hidden', 'true');
+        Polymer.dom(this).unobserveNodes(this._observer);
       }
 
       // wait to call after ready only if we're initially open
       if (!this._overlaySetup) {
+        this._callOpenedWhenReady = this.opened;
         return;
       }
 
       this._manager.trackBackdrop(this);
 
       if (this.opened) {
         this._prepareRenderOpened();
       }
 
       if (this._openChangedAsync) {
@@ skipping 54 matching lines @@
         node.addEventListener(event, boundListener, capture);
       } else {
         // disable document-wide tap recognizer
         if (event === 'tap') {
           Polymer.Gestures.remove(document, 'tap', null);
         }
         node.removeEventListener(event, boundListener, capture);
       }
     },
 
-    _toggleListeners: function() {
+    _toggleListeners: function () {
       this._toggleListener(this.opened, document, 'tap', this._boundOnCaptureClick, true);
+      this._toggleListener(this.opened, document, 'keydown', this._boundOnCaptureKeydown, true);
       this._toggleListener(this.opened, document, 'focus', this._boundOnCaptureFocus, true);
     },
 
     // tasks which must occur before opening; e.g. making the element visible
     _prepareRenderOpened: function() {
-
       this._manager.addOverlay(this);
 
-      // Needed to calculate the size of the overlay so that transitions on its size
-      // will have the correct starting points.
       this._preparePositioning();
       this.fit();
       this._finishPositioning();
 
       if (this.withBackdrop) {
         this.backdropElement.prepare();
       }
-
-      // Safari will apply the focus to the autofocus element when displayed for the first time,
-      // so we blur it. Later, _applyFocus will set the focus if necessary.
-      if (this.noAutoFocus && document.activeElement === this._focusNode) {
-        this._focusNode.blur();
-      }
     },
 
     // tasks which cause the overlay to actually open; typically play an
     // animation
     _renderOpened: function() {
       if (this.withBackdrop) {
         this.backdropElement.open();
       }
       this._finishRenderOpened();
     },
 
     _renderClosed: function() {
       if (this.withBackdrop) {
         this.backdropElement.close();
       }
       this._finishRenderClosed();
     },
 
     _finishRenderOpened: function() {
-      // This ensures the overlay is visible before we set the focus
-      // (by calling _onIronResize -> refit).
-      this.notifyResize();
-      // Focus the child node with [autofocus]
+      // focus the child node with [autofocus]
       this._applyFocus();
 
+      this._observer = Polymer.dom(this).observeNodes(this.notifyResize);
       this.fire('iron-overlay-opened');
     },
 
     _finishRenderClosed: function() {
-      // Hide the overlay and remove the backdrop.
+      // hide the overlay and remove the backdrop
       this.resetFit();
       this.style.display = 'none';
       this._manager.removeOverlay(this);
 
+      this._focusedChild = null;
       this._applyFocus();
+
       this.notifyResize();
-
       this.fire('iron-overlay-closed', this.closingReason);
     },
 
     _preparePositioning: function() {
       this.style.transition = this.style.webkitTransition = 'none';
       this.style.transform = this.style.webkitTransform = 'none';
       this.style.display = '';
     },
 
     _finishPositioning: function() {
       this.style.display = 'none';
       this.style.transform = this.style.webkitTransform = '';
-      // Force layout layout to avoid application of transform.
-      // Set offsetWidth to itself so that compilers won't remove it.
-      this.offsetWidth = this.offsetWidth;
+      // force layout to avoid application of transform
+      /** @suppress {suspiciousCode} */ this.offsetWidth;
       this.style.transition = this.style.webkitTransition = '';
     },
 
     _applyFocus: function() {
       if (this.opened) {
         if (!this.noAutoFocus) {
           this._focusNode.focus();
         }
       } else {
         this._focusNode.blur();
-        this._focusedChild = null;
         this._manager.focusOverlay();
       }
     },
 
     _onCaptureClick: function(event) {
       if (this._manager.currentOverlay() === this &&
           Polymer.dom(event).path.indexOf(this) === -1) {
         if (this.noCancelOnOutsideClick) {
           this._applyFocus();
         } else {
-          this.cancel(event);
+          this.cancel();
         }
       }
     },
 
+    _onCaptureKeydown: function(event) {
+      var ESC = 27;
+      if (this._manager.currentOverlay() === this &&
+          !this.noCancelOnEscKey &&
+          event.keyCode === ESC) {
+        this.cancel();
+      }
+    },
+
     _onCaptureFocus: function (event) {
-      if (this._manager.currentOverlay() === this && this.withBackdrop) {
+      if (this._manager.currentOverlay() === this &&
+          this.withBackdrop) {
         var path = Polymer.dom(event).path;
         if (path.indexOf(this) === -1) {
           event.stopPropagation();
           this._applyFocus();
         } else {
           this._focusedChild = path[0];
         }
       }
     },
 
     _onIronResize: function() {
       if (this.opened) {
         this.refit();
       }
-    },
+    }
 
-    /**
-     * @protected
-     * Will call notifyResize if overlay is opened.
-     * Can be overridden in order to avoid multiple observers on the same node.
-     */
-    _onNodesChange: function() {
-      if (this.opened) {
-        this.notifyResize();
-      }
-      // Store it so we don't query too much.
-      var focusableNodes = this._focusableNodes;
-      this.__firstFocusableNode = focusableNodes[0];
-      this.__lastFocusableNode = focusableNodes[focusableNodes.length - 1];
-    },
+/**
+ * Fired after the `iron-overlay` opens.
+ * @event iron-overlay-opened
+ */
 
-    __onEsc: function(event) {
-      // Not opened or not on top, so return.
-      if (this._manager.currentOverlay() !== this) {
-        return;
-      }
-      if (!this.noCancelOnEscKey) {
-        this.cancel(event);
-      }
-    },
+/**
+ * Fired when the `iron-overlay` is canceled, but before it is closed.
+ * Cancel the event to prevent the `iron-overlay` from closing.
+ * @event iron-overlay-canceled
+ */
 
-    __onTab: function(event) {
-      // Not opened or not on top, so return.
-      if (this._manager.currentOverlay() !== this) {
-        return;
-      }
-      // TAB wraps from last to first focusable.
-      // Shift + TAB wraps from first to last focusable.
-      var shift = event.detail.keyboardEvent.shiftKey;
-      var nodeToCheck = shift ? this.__firstFocusableNode : this.__lastFocusableNode;
-      var nodeToSet = shift ? this.__lastFocusableNode : this.__firstFocusableNode;
-      if (this.withBackdrop && this._focusedChild === nodeToCheck) {
-        // We set here the _focusedChild so that _onCaptureFocus will handle the
-        // wrapping of the focus (the next event after tab is focus).
-        this._focusedChild = nodeToSet;
-      }
-    }
+/**
+ * Fired after the `iron-overlay` closes.
+ * @event iron-overlay-closed
+ * @param {{canceled: (boolean|undefined)}} set to the `closingReason` attribute
+ */
   };
 
   /** @polymerBehavior */
-  Polymer.IronOverlayBehavior = [Polymer.IronA11yKeysBehavior, Polymer.IronFitBehavior, Polymer.IronResizableBehavior, Polymer.IronOverlayBehaviorImpl];
-
-  /**
-  * Fired after the `iron-overlay` opens.
-  * @event iron-overlay-opened
-  */
-
-  /**
-  * Fired when the `iron-overlay` is canceled, but before it is closed.
-  * Cancel the event to prevent the `iron-overlay` from closing.
-  * @event iron-overlay-canceled
-  * @param {Event} event The closing of the `iron-overlay` can be prevented
-  * by calling `event.preventDefault()`. The `event.detail` is the original event that originated
-  * the canceling (e.g. ESC keyboard event or click event outside the `iron-overlay`).
-  */
-
-  /**
-  * Fired after the `iron-overlay` closes.
-  * @event iron-overlay-closed
-  * @param {{canceled: (boolean|undefined)}} closingReason Contains `canceled` (whether the overlay was canceled).
-  */
+  Polymer.IronOverlayBehavior = [Polymer.IronFitBehavior, Polymer.IronResizableBehavior, Polymer.IronOverlayBehaviorImpl];
 /**
    * Use `Polymer.NeonAnimationBehavior` to implement an animation.
    * @polymerBehavior
    */
   Polymer.NeonAnimationBehavior = {
 
     properties: {
 
       /**
        * Defines the animation timing.
@@ skipping 1530 matching lines @@
 You can use custom validators that implement `Polymer.IronValidatorBehavior` with `<iron-input>`.
 
     <input is="iron-input" validator="my-custom-validator">
 
 ### Stopping invalid input
 
 It may be desirable to only allow users to enter certain characters. You can use the
 `prevent-invalid-input` and `allowed-pattern` attributes together to accomplish this. This feature
 is separate from validation, and `allowed-pattern` does not affect how the input is validated.
 
-    <!-- only allow characters that match [0-9] -->
+    \x3c!-- only allow characters that match [0-9] --\x3e
     <input is="iron-input" prevent-invalid-input allowed-pattern="[0-9]">
 
 @hero hero.svg
 @demo demo/index.html
 */
 
   Polymer({
 
     is: 'iron-input',
 
@@ skipping 509 matching lines @@
 
   /**
    * Returns the value of the search field.
    * @return {string}
    */
   getValue: function() {
     var searchInput = this.getSearchInput_();
     return searchInput ? searchInput.value : '';
   },
 
+  /**
+   * Sets the value of the search field, if it exists.
+   * @param {string} value
+   */
+  setValue: function(value) {
+    var searchInput = this.getSearchInput_();
+    if (searchInput)
+      searchInput.value = value;
+  },
+
   /** @param {SearchFieldDelegate} delegate */
   setDelegate: function(delegate) {
     this.delegate_ = delegate;
   },
 
+  /** @return {Promise<boolean>} */
   showAndFocus: function() {
     this.showingSearch_ = true;
-    this.focus_();
-  },
-
-  /** @private */
-  focus_: function() {
-    this.async(function() {
-      if (!this.showingSearch_)
-        return;
-
-      var searchInput = this.getSearchInput_();
-      if (searchInput)
-        searchInput.focus();
-    });
+    return this.focus_();
   },
 
   /**
+   * @return {Promise<boolean>}
+   * @private
+   */
+  focus_: function() {
+    return new Promise(function(resolve) {
+      this.async(function() {
+        if (this.showingSearch_) {
+          var searchInput = this.getSearchInput_();
+          if (searchInput)
+            searchInput.focus();
+        }
+        resolve(this.showingSearch_);
+      });
+    }.bind(this));
+  },
+
+  /**
    * @return {?Element}
    * @private
    */
   getSearchInput_: function() {
     return this.$$('#search-input');
   },
 
   /** @private */
   onSearchTermSearch_: function() {
     if (this.delegate_)
@@ skipping 303 matching lines @@
   Manager.removeItem = function(index) {
     Manager.get().removeItem_(index);
   };
 
   Manager.updateItem = function(index, data) {
     Manager.get().updateItem_(index, data);
   };
 
   return {Manager: Manager};
 });
+// 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.
+
+// <include src="../../../../ui/webui/resources/js/i18n_template_no_process.js">
+
+i18nTemplate.process(document, loadTimeData);
 // Copyright 2015 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.
 
 window.addEventListener('load', downloads.Manager.onLoad);