NTP4: Add ability to drag links to the apps pages.

chrome/browser/resources/ntp4/apps_page.js

 // Copyright (c) 2011 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('ntp4', function() {
   'use strict';
 
   var TilePage = ntp4.TilePage;
 
   /**
@@ skipping 61 matching lines @@
     onClick_: function(e) {
       // Tell chrome to launch the app.
       var NTP_APPS_MAXIMIZED = 0;
       chrome.send('launchApp', [this.appData.id, NTP_APPS_MAXIMIZED]);
 
       // Don't allow the click to trigger a link or anything
       e.preventDefault();
     },
   };
 
+  /**
+   * Creates a new Link object. This is a stub implementation for now.
+   * @param {Object} data The url and title.
+   * @constructor
+   * @extends {HTMLAnchorElement}
+   */
+  function Link(data) {
+    var el = cr.doc.createElement('a');
+    el.__proto__ = Link.prototype;
+    el.data = data;
+    el.initialize();
+
+    return el;
+  };
+
+  Link.prototype = {
+    __proto__: HTMLAnchorElement.prototype,
+
+    initialize: function() {
+      this.className = 'link';
+      var thumbnailDiv = this.ownerDocument.createElement('div');
+      this.appendChild(thumbnailDiv);
+
+      var title = cr.doc.createElement('span');

[arv (Not doing code reviews), 2011/05/20 23:49:07]

Use this.ownerDocument here too

[Evan Stade, 2011/05/21 00:20:06]

Done.

+      title.textContent = this.data.title;
+      this.appendChild(title);
+    },
+
+    /**
+     * Set the size and position of the link tile.
+     * @param {number} size The total size of |this|.
+     * @param {number} x The x-position.
+     * @param {number} y The y-position.
+     *     animate.
+     */
+    setBounds: function(size, x, y) {
+      this.style.width = this.style.height = size + 'px';
+      this.style.left = x + 'px';
+      this.style.top = y + 'px';
+    },
+  };
+
   // The fraction of the app tile size that the icon uses.
   var APP_IMG_SIZE_FRACTION = 4 / 5;
 
   var appsPageGridValues = {
     // The fewest tiles we will show in a row.
     minColCount: 3,
     // The most tiles we will show in a row.
     maxColCount: 6,
 
     // The smallest a tile can be.
@@ skipping 25 matching lines @@
     },
 
     /**
      * Creates an app DOM element and places it at the last position on the
      * page.
      * @param {Object} appData The data object that describes the app.
      */
     appendApp: function(appData) {
       this.appendTile(new App(appData));
     },
+
+    /** @inheritDoc */
+    shouldAcceptDrag: function(tile, dataTransfer) {
+      return tile || (dataTransfer && dataTransfer.types.indexOf('url') != -1);
+    },
+
+    /** @inheritDoc */
+    addOutsideData: function(dataTransfer, index) {
+      var url = dataTransfer.getData('url');
+      assert(url);
+      if (!url)
+        return;
+
+      // If the dataTransfer has html data, use that html's text contents as the
+      // title of the new link.
+      var html = dataTransfer.getData('text/html');
+      var title;
+      if (html) {
+        // It's important that we don't attach this node to the document
+        // because it might contain scripts.
+        var node = this.ownerDocument.createElement('div');
+        node.innerHTML = html;
+        title = node.textContent;
+      }
+      if (!title)
+        title = url;
+
+      var data = {url: url, title: title};
+      this.addTileAt(new Link(data), index);
+    },
   };
 
   return {
     AppsPage: AppsPage,
   };
 });