Update bower.json for Polymer elements and add PRESUBMIT.py

third_party/polymer/v1_0/components/paper-drawer-panel/paper-drawer-panel.html

 <!--
 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
 This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
 The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
 Code distributed by Google as part of the polymer project is also
 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
 -->
 
 <link rel="import" href="../polymer/polymer.html">
@@ skipping 56 matching lines @@
       </paper-header-panel>
     </paper-drawer-panel>
 
 To position the drawer to the right, add `right-drawer` attribute.
 
     <paper-drawer-panel right-drawer>
       <div drawer> Drawer panel... </div>
       <div main> Main panel... </div>
     </paper-drawer-panel>
 
-Styling paper-drawer-panel:
+Styling `paper-drawer-panel`
 
 To change the main container:
-  paper-drawer-panel {
-    --paper-drawer-panel-main-container: {
-      background-color: gray;
-    };
-  }
+
+    paper-drawer-panel {
+      --paper-drawer-panel-main-container: {
+        background-color: gray;
+      };
+    }
 
 To change the drawer container when it's in the left side:
-  paper-drawer-panel {
-    --paper-drawer-panel-left-drawer-container: {
-      background-color: white;
-    };
-  }
+
+    paper-drawer-panel {
+      --paper-drawer-panel-left-drawer-container: {
+        background-color: white;
+      };
+    }
 
 To change the drawer container when it's in the right side:
 
-  paper-drawer-panel {
-    --paper-drawer-panel-right-drawer-container: {
-      background-color: white;
-    };
-  }
+    paper-drawer-panel {
+      --paper-drawer-panel-right-drawer-container: {
+        background-color: white;
+      };
+    }
 
 @group Paper elements
 @element paper-drawer-panel
 @demo demo/index.html
 @hero hero.svg
 -->
 
 <dom-module id="paper-drawer-panel">
   <link rel="import" type="css" href="paper-drawer-panel.css">
 
   <template>
     <iron-media-query
         id="mq"
         on-query-matches-changed="_onQueryMatchesChanged"
         query="[[_computeMediaQuery(forceNarrow, responsiveWidth)]]">
     </iron-media-query>
 
     <iron-selector
         attr-for-selected="id"
-        class$="[[_computeIronSelectorClass(narrow, transition, dragging, rightDrawer)]]"
+        class$="[[_computeIronSelectorClass(narrow, transition, dragging, rightDrawer, peeking)]]"
         activate-event=""
         selected="[[selected]]">
 
       <div id="main" style$="[[_computeMainStyle(narrow, rightDrawer, drawerWidth)]]">
         <content select="[main]"></content>
         <div id="scrim" on-tap="closeDrawer"></div>
       </div>
 
       <div id="drawer" style$="[[_computeDrawerStyle(drawerWidth)]]">
         <content select="[drawer]"></content>
@@ skipping 30 matching lines @@
       is: 'paper-drawer-panel',
 
       /**
        * Fired when the narrow layout changes.
        *
        * @event paper-responsive-change {{narrow: boolean}} detail -
        *     narrow: true if the panel is in narrow layout.
        */
 
       /**
-       * Fired when the selected panel changes.
+       * Fired when the a panel is selected.
        *
        * Listening for this event is an alternative to observing changes in the `selected` attribute.
-       * This event is fired both when a panel is selected and deselected.
-       * The `isSelected` detail property contains the selection state.
+       * This event is fired both when a panel is selected.
        *
-       * @event paper-select {{isSelected: boolean, item: Object}} detail -
-       *     isSelected: True for selection and false for deselection.
+       * @event iron-select {{item: Object}} detail -
        *     item: The panel that the event refers to.
        */
 
+      /**
+       * Fired when a panel is deselected.
+       *
+       * Listening for this event is an alternative to observing changes in the `selected` attribute.
+       * This event is fired both when a panel is deselected.
+       *
+       * @event iron-deselect {{item: Object}} detail -
+       *     item: The panel that the event refers to.
+       */
       properties: {
 
         /**
          * The panel to be selected when `paper-drawer-panel` changes to narrow
          * layout.
          */
         defaultSelected: {
           type: String,
           value: 'main'
         },
@@ skipping 178 matching lines @@
       closeDrawer: function() {
         this.selected = 'main';
       },
 
       ready: function() {
         // Avoid transition at the beginning e.g. page loads and enable
         // transitions only after the element is rendered and ready.
         this.transition = true;
       },
 
-      _computeIronSelectorClass: function(narrow, transition, dragging, rightDrawer) {
+      _computeIronSelectorClass: function(narrow, transition, dragging, rightDrawer, peeking) {
         return classNames({
           dragging: dragging,
           'narrow-layout': narrow,
           'right-drawer': rightDrawer,
           'left-drawer': !rightDrawer,
-          transition: transition
+          transition: transition,
+          peeking: peeking
         });
       },
 
       _computeDrawerStyle: function(drawerWidth) {
         return 'width:' + drawerWidth + ';';
       },
 
       _computeMainStyle: function(narrow, rightDrawer, drawerWidth) {
         var style = '';
 
         style += 'left:' + ((narrow || rightDrawer) ? '0' : drawerWidth) + ';';
 
         if (rightDrawer) {
           style += 'right:' + (narrow ? '' : drawerWidth) + ';';
-        } else {
-          style += 'right:;';
         }
 
         return style;
       },
 
       _computeMediaQuery: function(forceNarrow, responsiveWidth) {
         return forceNarrow ? '' : '(max-width: ' + responsiveWidth + ')';
       },
 
       _computeSwipeOverlayHidden: function(narrow, disableEdgeSwipe) {
         return !narrow || disableEdgeSwipe;
       },
 
-      _onTrack: function(e) {
+      _onTrack: function(event) {
         if (sharedPanel && this !== sharedPanel) {
           return;
         }
-        switch (e.detail.state) {
+        switch (event.detail.state) {
           case 'start':
-            this._trackStart(e);
+            this._trackStart(event);
             break;
           case 'track':
-            this._trackX(e);
+            this._trackX(event);
             break;
           case 'end':
-            this._trackEnd(e);
+            this._trackEnd(event);
             break;
         }
 
       },
 
       _responsiveChange: function(narrow) {
         this._setNarrow(narrow);
 
         if (this.narrow) {
           this.selected = this.defaultSelected;
         }
 
         this.setScrollDirection(this._swipeAllowed() ? 'y' : 'all');
         this.fire('paper-responsive-change', {narrow: this.narrow});
       },
 
-      _onQueryMatchesChanged: function(e) {
-        this._responsiveChange(e.detail.value);
+      _onQueryMatchesChanged: function(event) {
+        this._responsiveChange(event.detail.value);
       },
 
       _forceNarrowChanged: function() {
         // set the narrow mode only if we reached the `responsiveWidth`
         this._responsiveChange(this.forceNarrow || this.$.mq.queryMatches);
       },
 
       _swipeAllowed: function() {
         return this.narrow && !this.disableSwipe;
       },
 
       _isMainSelected: function() {
         return this.selected === 'main';
       },
 
       _startEdgePeek: function() {
         this.width = this.$.drawer.offsetWidth;
         this._moveDrawer(this._translateXForDeltaX(this.rightDrawer ?
             -this.edgeSwipeSensitivity : this.edgeSwipeSensitivity));
         this._setPeeking(true);
       },
 
       _stopEdgePeek: function() {
         if (this.peeking) {
           this._setPeeking(false);
           this._moveDrawer(null);
         }
       },
 
-      _downHandler: function(e) {
-        if (!this.dragging && this._isMainSelected() && this._isEdgeTouch(e) && !sharedPanel) {
+      _downHandler: function(event) {
+        if (!this.dragging && this._isMainSelected() && this._isEdgeTouch(event) && !sharedPanel) {
           this._startEdgePeek();
+          // cancel selection
+          event.preventDefault();
           // grab this panel
           sharedPanel = this;
         }
       },
 
       _upHandler: function() {
         this._stopEdgePeek();
         // release the panel
         sharedPanel = null;
       },
 
-      _onTap: function(e) {
-        var targetElement = Polymer.dom(e).localTarget;
+      _onTap: function(event) {
+        var targetElement = Polymer.dom(event).localTarget;
         var isTargetToggleElement = targetElement &&
           this.drawerToggleAttribute &&
           targetElement.hasAttribute(this.drawerToggleAttribute);
 
         if (isTargetToggleElement) {
           this.togglePanel();
         }
       },
 
-      _isEdgeTouch: function(e) {
-        var x = e.detail.x;
+      _isEdgeTouch: function(event) {
+        var x = event.detail.x;
 
         return !this.disableEdgeSwipe && this._swipeAllowed() &&
           (this.rightDrawer ?
             x >= this.offsetWidth - this.edgeSwipeSensitivity :
             x <= this.edgeSwipeSensitivity);
       },
 
       _trackStart: function(event) {
         if (this._swipeAllowed()) {
           sharedPanel = this;
@@ skipping 13 matching lines @@
       _translateXForDeltaX: function(deltaX) {
         var isMain = this._isMainSelected();
 
         if (this.rightDrawer) {
           return Math.max(0, isMain ? this.width + deltaX : deltaX);
         } else {
           return Math.min(0, isMain ? deltaX - this.width : deltaX);
         }
       },
 
-      _trackX: function(e) {
+      _trackX: function(event) {
         if (this.dragging) {
-          var dx = e.detail.dx;
+          var dx = event.detail.dx;
 
           if (this.peeking) {
             if (Math.abs(dx) <= this.edgeSwipeSensitivity) {
               // Ignore trackx until we move past the edge peek.
               return;
             }
             this._setPeeking(false);
           }
 
           this._moveDrawer(this._translateXForDeltaX(dx));
         }
       },
 
-      _trackEnd: function(e) {
+      _trackEnd: function(event) {
         if (this.dragging) {
-          var xDirection = e.detail.dx > 0;
+          var xDirection = event.detail.dx > 0;
 
           this._setDragging(false);
           this.transition = true;
           sharedPanel = null;
           this._moveDrawer(null);
 
           if (this.rightDrawer) {
             this[xDirection ? 'closeDrawer' : 'openDrawer']();
           } else {
             this[xDirection ? 'openDrawer' : 'closeDrawer']();
           }
         }
       },
 
       _transformForTranslateX: function(translateX) {
         if (translateX === null) {
           return '';
         }
 
         return this.hasWillChange ? 'translateX(' + translateX + 'px)' :
             'translate3d(' + translateX + 'px, 0, 0)';
       },
 
       _moveDrawer: function(translateX) {
-        var s = this.$.drawer.style;
-
-        if (this.hasTransform) {
-          s.transform = this._transformForTranslateX(translateX);
-        } else {
-          s.webkitTransform = this._transformForTranslateX(translateX);
-        }
+        this.transform(this._transformForTranslateX(translateX), this.$.drawer);
       }
 
     });
 
   }());
 
 </script>