[html5] r3547 - [] (0) Add dataTransfer.files for drag-and-drop. Not sure how to expose it durin [...]

whatwg at whatwg.org whatwg at whatwg.org
Thu Aug 6 02:24:32 PDT 2009


Author: ianh
Date: 2009-08-06 02:24:31 -0700 (Thu, 06 Aug 2009)
New Revision: 3547

Modified:
   index
   source
Log:
[] (0) Add dataTransfer.files for drag-and-drop. Not sure how to expose it during the drags yet, though.

Modified: index
===================================================================
--- index	2009-08-06 09:04:48 UTC (rev 3546)
+++ index	2009-08-06 09:24:31 UTC (rev 3547)
@@ -55936,10 +55936,13 @@
   <pre class=idl>interface <dfn id=datatransfer>DataTransfer</dfn> {
            attribute DOMString <a href=#dom-datatransfer-dropeffect title=dom-DataTransfer-dropEffect>dropEffect</a>;
            attribute DOMString <a href=#dom-datatransfer-effectallowed title=dom-DataTransfer-effectAllowed>effectAllowed</a>;
+
   readonly attribute DOMStringList <a href=#dom-datatransfer-types title=dom-DataTransfer-types>types</a>;
   void <a href=#dom-datatransfer-cleardata title=dom-DataTransfer-clearData>clearData</a>([Optional] in DOMString format);
   void <a href=#dom-datatransfer-setdata title=dom-DataTransfer-setData>setData</a>(in DOMString format, in DOMString data);
   DOMString <a href=#dom-datatransfer-getdata title=dom-DataTransfer-getData>getData</a>(in DOMString format);
+  readonly attribute <span>FileList</span> <a href=#dom-datatransfer-files title=dom-DataTransfer-files>files</a>;
+
   void <a href=#dom-datatransfer-setdragimage title=dom-DataTransfer-setDragImage>setDragImage</a>(in Element image, in long x, in long y);
   void <a href=#dom-datatransfer-addelement title=dom-DataTransfer-addElement>addElement</a>(in Element element);
 };</pre>
@@ -56011,6 +56014,14 @@
 
    </dd>
 
+   <dt><var title="">dataTransfer</var> . <code title=dom-DataTransfer-files><a href=#dom-datatransfer-files>files</a></code></dt>
+
+   <dd>
+
+    <p>Returns a <code>FileList</code> of the files being dragged, if any.</p>
+
+   </dd>
+
    <dt><var title="">dataTransfer</var> . <code title=dom-DataTransfer-setDragImage><a href=#dom-datatransfer-setdragimage>setDragImage</a></code>(<var title="">element</var>, <var title="">x</var>, <var title="">y</var>)</dt>
 
    <dd>
@@ -56093,6 +56104,12 @@
   is but it has no URLs, then the method must return the empty
   string. <a href=#refsRFC2483>[RFC2483]</a></p>
 
+  <p>The <dfn id=dom-datatransfer-files title=dom-DataTransfer-files><code>files</code></dfn>
+  attribute must return the <code>FileList</code> object that contains
+  the files that are stored in the <code><a href=#datatransfer>DataTransfer</a></code>
+  object. There is one such object per <code><a href=#datatransfer>DataTransfer</a></code>
+  object.</p>
+
   <p>The <dfn id=dom-datatransfer-setdragimage title=dom-DataTransfer-setDragImage><code>setDragImage(<var title="">element</var>, <var title="">x</var>, <var title="">y</var>)</code></dfn> method sets which element to use <a href=#base-dnd-feedback>to generate the drag feedback</a>. The
   <var title="">element</var> argument can be any
   <code>Element</code>; if it is an <code><a href=#the-img-element>img</a></code> element, then the
@@ -56133,7 +56150,7 @@
      <th> Target </th>
      <th> Bubbles? </th>
      <th> Cancelable? </th>
-     <th> <code title=dom-DataTransfer-addElement><a href=#dom-datatransfer-addelement>dataTransfer</a></code> </th>
+     <th> <code title=dom-DataTransfer-dataTransfer>dataTransfer</code> </th>
      <th> <code title=dom-DataTransfer-effectAllowed><a href=#dom-datatransfer-effectallowed>effectAllowed</a></code> </th>
      <th> <code title=dom-DataTransfer-dropEffect><a href=#dom-datatransfer-dropeffect>dropEffect</a></code> </th>
      <th> Default Action </th>
@@ -56181,7 +56198,7 @@
      <td><a href=#current-target-element>Current target element</a></td>
      <td>✓ Bubbles</td>
      <td>✓ Cancelable</td>
-     <td><code>getData()</code> returns data set in <code title=dom-dragstart>dragstart</code> event</td>
+     <td><code title=dom-datatransfer-getdata><a href=#dom-datatransfer-getdata>getData()</a></code> returns data set in <code title=dom-dragstart>dragstart</code> event; <code title=dom-datatransfer-files><a href=#dom-datatransfer-files>files</a></code> returns any files included in the drag operation</td>
      <td><a href=#effectAllowed-initialization>Same as last event</a></td>
      <td><a href=#current-drag-operation>Current drag operation</a></td>
      <td>Varies</td>
@@ -56282,11 +56299,12 @@
   <a href=#list-of-dragged-nodes>list of dragged nodes</a> contains only the <a href=#source-node>source
   node</a>.</p>
 
-  <hr><p>If it is a selection that is being dragged, the <code title=dom-DragEvent-dataTransfer><a href=#dom-dragevent-datatransfer>dataTransfer</a></code> member of the event
-  must be created with no nodes. Otherwise, it must be created
+  <hr><p>If it is a selection that is being dragged, the <code title=dom-DragEvent-dataTransfer><a href=#dom-dragevent-datatransfer>dataTransfer</a></code> member of the
+  event must be created with no nodes. Otherwise, it must be created
   containing just the <a href=#source-node>source node</a>. Script can use the
   <code title=dom-DataTransfer-addElement><a href=#dom-datatransfer-addelement>addElement()</a></code> method
-  to add further elements to the list of what is being dragged.</p>
+  to add further elements to the list of what is being dragged. (This
+  list is only used for rendering the drag feedback.)</p>
 
   <p>The <code title=dom-DragEvent-dataTransfer><a href=#dom-dragevent-datatransfer>dataTransfer</a></code>
   member of the event also has data added to it, as follows:</p>
@@ -56301,6 +56319,18 @@
 
    <li>
 
+    <p>If files are being dragged, then the user agent must add the
+    files to the <code title=dom-DragEvent-dataTransfer><a href=#dom-dragevent-datatransfer>dataTransfer</a></code> member's
+    <code title=dom-datatransfer-files><a href=#dom-datatransfer-files>files</a></code> attribute's
+    <code>FileList</code> object. (Dragging files can only happen from
+    outside a <a href=#browsing-context>browsing context</a>, for example from a file
+    system manager application, and thus the <code title=event-dragstart><a href=#event-dragstart>dragstart</a></code> event is actually implied
+    in this case.)</p>
+
+   </li>
+
+   <li>
+
     <p>The user agent must take the <a href=#list-of-dragged-nodes>list of dragged nodes</a>
     and <a href=#extracting-json title="extracting JSON">extract the microdata from those
     nodes into a JSON form</a>, and then must add the resulting
@@ -56616,7 +56646,9 @@
       must be given the value representing the <a href=#current-drag-operation>current drag
       operation</a> (<code title="">copy</code>, <code title="">link</code>, or <code title="">move</code>), and the
       object must be set up so that the <code title=dom-DataTransfer-getData><a href=#dom-datatransfer-getdata>getData()</a></code> method will
-      return the data that was added during the <code title=event-dragstart><a href=#event-dragstart>dragstart</a></code> event.</p>
+      return the data that was added during the <code title=event-dragstart><a href=#event-dragstart>dragstart</a></code> event, and the <code title=dom-datatransfer-files><a href=#dom-datatransfer-files>files</a></code> attribute will
+      return a <code>FileList</code> object with any files that were
+      dragged.</p>
 
       <p>If the event is canceled, the <a href=#current-drag-operation>current drag
       operation</a> must be set to the value of the <code title=dom-DataTransfer-dropEffect><a href=#dom-datatransfer-dropeffect>dropEffect</a></code> attribute

Modified: source
===================================================================
--- source	2009-08-06 09:04:48 UTC (rev 3546)
+++ source	2009-08-06 09:24:31 UTC (rev 3547)
@@ -65461,10 +65461,13 @@
   <pre class="idl">interface <dfn>DataTransfer</dfn> {
            attribute DOMString <span title="dom-DataTransfer-dropEffect">dropEffect</span>;
            attribute DOMString <span title="dom-DataTransfer-effectAllowed">effectAllowed</span>;
+
   readonly attribute DOMStringList <span title="dom-DataTransfer-types">types</span>;
   void <span title="dom-DataTransfer-clearData">clearData</span>([Optional] in DOMString format);
   void <span title="dom-DataTransfer-setData">setData</span>(in DOMString format, in DOMString data);
   DOMString <span title="dom-DataTransfer-getData">getData</span>(in DOMString format);
+  readonly attribute <span>FileList</span> <span title="dom-DataTransfer-files">files</span>;
+
   void <span title="dom-DataTransfer-setDragImage">setDragImage</span>(in Element image, in long x, in long y);
   void <span title="dom-DataTransfer-addElement">addElement</span>(in Element element);
 };</pre>
@@ -65544,6 +65547,14 @@
 
    </dd>
 
+   <dt><var title="">dataTransfer</var> . <code title="dom-DataTransfer-files">files</code></dt>
+
+   <dd>
+
+    <p>Returns a <code>FileList</code> of the files being dragged, if any.</p>
+
+   </dd>
+
    <dt><var title="">dataTransfer</var> . <code title="dom-DataTransfer-setDragImage">setDragImage</code>(<var title="">element</var>, <var title="">x</var>, <var title="">y</var>)</dt>
 
    <dd>
@@ -65654,6 +65665,12 @@
   is but it has no URLs, then the method must return the empty
   string. <a href="#refsRFC2483">[RFC2483]</a></p>
 
+  <p>The <dfn title="dom-DataTransfer-files"><code>files</code></dfn>
+  attribute must return the <code>FileList</code> object that contains
+  the files that are stored in the <code>DataTransfer</code>
+  object. There is one such object per <code>DataTransfer</code>
+  object.</p>
+
   <p>The <dfn
   title="dom-DataTransfer-setDragImage"><code>setDragImage(<var
   title="">element</var>, <var title="">x</var>, <var
@@ -65708,7 +65725,7 @@
      <th> Target </th>
      <th> Bubbles? </th>
      <th> Cancelable? </th>
-     <th> <code title="dom-DataTransfer-addElement">dataTransfer</code> </th>
+     <th> <code title="dom-DataTransfer-dataTransfer">dataTransfer</code> </th>
      <th> <code title="dom-DataTransfer-effectAllowed">effectAllowed</code> </th>
      <th> <code title="dom-DataTransfer-dropEffect">dropEffect</code> </th>
      <th> Default Action </th>
@@ -65777,7 +65794,7 @@
      <td><span>Current target element</span></td>
      <td>&#x2713; Bubbles</td>
      <td>&#x2713; Cancelable</td>
-     <td><code>getData()</code> returns data set in <code title="dom-dragstart">dragstart</code> event</td>
+     <td><code title="dom-datatransfer-getdata">getData()</code> returns data set in <code title="dom-dragstart">dragstart</code> event; <code title="dom-datatransfer-files">files</code> returns any files included in the drag operation</td>
      <td><a href="#effectAllowed-initialization">Same as last event</a></td>
      <td><span>Current drag operation</span></td>
      <td>Varies</td>
@@ -65926,11 +65943,12 @@
   <hr>
 
   <p>If it is a selection that is being dragged, the <code
-  title="dom-DragEvent-dataTransfer">dataTransfer</code> member of the event
-  must be created with no nodes. Otherwise, it must be created
+  title="dom-DragEvent-dataTransfer">dataTransfer</code> member of the
+  event must be created with no nodes. Otherwise, it must be created
   containing just the <span>source node</span>. Script can use the
   <code title="dom-DataTransfer-addElement">addElement()</code> method
-  to add further elements to the list of what is being dragged.</p>
+  to add further elements to the list of what is being dragged. (This
+  list is only used for rendering the drag feedback.)</p>
 
   <p>The <code title="dom-DragEvent-dataTransfer">dataTransfer</code>
   member of the event also has data added to it, as follows:</p>
@@ -65948,6 +65966,20 @@
 
    <li>
 
+    <p>If files are being dragged, then the user agent must add the
+    files to the <code
+    title="dom-DragEvent-dataTransfer">dataTransfer</code> member's
+    <code title="dom-datatransfer-files">files</code> attribute's
+    <code>FileList</code> object. (Dragging files can only happen from
+    outside a <span>browsing context</span>, for example from a file
+    system manager application, and thus the <code
+    title="event-dragstart">dragstart</code> event is actually implied
+    in this case.)</p>
+
+   </li>
+
+   <li>
+
     <p>The user agent must take the <span>list of dragged nodes</span>
     and <span title="extracting JSON">extract the microdata from those
     nodes into a JSON form</span>, and then must add the resulting
@@ -66352,7 +66384,10 @@
       object must be set up so that the <code
       title="dom-DataTransfer-getData">getData()</code> method will
       return the data that was added during the <code
-      title="event-dragstart">dragstart</code> event.</p>
+      title="event-dragstart">dragstart</code> event, and the <code
+      title="dom-datatransfer-files">files</code> attribute will
+      return a <code>FileList</code> object with any files that were
+      dragged.</p>
 
       <p>If the event is canceled, the <span>current drag
       operation</span> must be set to the value of the <code




More information about the Commit-Watchers mailing list