ntp4: Fix a couple small visual glitches with tile dragging.

fix these two problems:
1. dragging out of the window makes the tab drag representation jump to (0,0)
2. dragging onto a second NTP window results in the tab drag representation appearing in the source window

BUG=none
TEST=manual

Review URL: http://codereview.chromium.org/6992009

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@86366 0039d316-1c4b-4281-b951-d872f2087c98

chrome/browser/resources/ntp4/new_tab.css

@@ -24,6 +24,10 @@ body {
   -webkit-user-select: none;
 }
 
+.hidden {
+  display: none !important;
+}
+
 #card-slider-frame {
   /* Must match #footer height. */
   bottom: 50px;

chrome/browser/resources/ntp4/tile_page.js

@@ -99,6 +99,13 @@ cr.define('ntp4', function() {
      * @private
      */
     onDragMove_: function(e) {
+      if (e.view != window || (e.pageX == 0 && e.pageY == 0)) {
+        // attribute hidden seems to be overridden by display.
+        this.dragClone.classList.add('hidden');
+        return;
+      }
+
+      this.dragClone.classList.remove('hidden');
       this.dragClone.style.left = (e.pageX - this.dragOffsetX) + 'px';
       this.dragClone.style.top = (e.pageY - this.dragOffsetY) + 'px';
     },
@@ -175,12 +182,14 @@ cr.define('ntp4', function() {
      * @param {Event} e The transition end event.
      */
     onDragCloneTransitionEnd_: function(e) {
-      var clone = this.dragClone;
-      this.dragClone = null;
+      if (e.propertyName == 'left') {
+        var clone = this.dragClone;
+        this.dragClone = null;
 
-      clone.parentNode.removeChild(clone);
-      this.eventTracker.remove(clone, 'webkitTransitionEnd');
-      this.classList.remove('dragging');
+        clone.parentNode.removeChild(clone);
+        this.eventTracker.remove(clone, 'webkitTransitionEnd');
+        this.classList.remove('dragging');
+      }
     }
   };