Permalink
Browse files

Remove dropzone attribute (#921)

fix #64
  • Loading branch information...
travisleithead authored and chaals committed May 22, 2017
1 parent 911cee3 commit 0c51b16600193e3cc35cab042af56345cfefb044
Showing with 9 additions and 177 deletions.
  1. +0 −6 sections/attributes.include
  2. +0 −2 sections/dom.include
  3. +9 −169 sections/editing.include
@@ -258,12 +258,6 @@
<td>Whether the element is draggable</td>
<td>"<code>true</code>"; "<code>false</code>"</td>
</tr>
<tr>
<th><{global/dropzone}></th>
<td><a>HTML elements</a></td>
<td>Accepted item types for drag-and-drop</td>
<td><a>Unordered set of unique space-separated tokens</a>, <a>ASCII case-insensitive</a>, consisting of accepted types and drag feedback*</td>
</tr>
<tr>
<th><{form/enctype}></th>
<td><{form}></td>
View
@@ -625,7 +625,6 @@
void blur();
[CEReactions] attribute DOMString accessKey;
[CEReactions] attribute boolean draggable;
[CEReactions, SameObject, PutForwards=value] readonly attribute DOMTokenList dropzone;
[CEReactions] attribute HTMLMenuElement? contextMenu;
[CEReactions] attribute boolean spellcheck;
void forceSpellCheck();
@@ -1439,7 +1438,6 @@
* <{global/contextmenu}>
* <{global/dir}>
* <{global/draggable}>
* <{global/dropzone}>
* <{global/hidden}>
* <{global/lang}>
* <{global/spellcheck}>
View
@@ -1638,7 +1638,7 @@
The exact shortcut is determined by the user agent, potentially using information about the user's
preferences, what keyboard shortcuts already exist on the platform, and what other shortcuts have
been specified on the page, as well as the value of the <{global/accesskey}> attribute.
<p class="warning">User agents may not assign any shortcut, or assigned shortcuts may be overridden
by other browser- or system-level shortcuts.</p>
@@ -1667,20 +1667,20 @@
If specified, the value must be a single printable character:
typically a string one Unicode code point in length.
<div class="warning">
Decomposed characters in
<a href="https://www.w3.org/International/questions/qa-html-css-normalization">Normalization Form D</a>,
such as <code>accesskey="&amp;#x006E;&amp;#x0303;"</code>
to assign <samp>ñ</samp> as a shortcut, are not valid values,
and in many browsers no shortcut will be assigned. Characters in
<a href="https://www.w3.org/International/questions/qa-html-css-normalization">Normalization Form C</a>
are valid values. Printable characters that may represent more than one Unicode code point, such as
are valid values. Printable characters that may represent more than one Unicode code point, such as
<code>accesskey="श्र"</code>, are valid values.
Authors should not use <a>space characters</a> such as <samp>" "</samp>,
nor characters that cannot be generated by a single keystroke with no modifier keys,
as a value of <{global/accesskey}>.
as a value of <{global/accesskey}>.
Authors should not use an <{global/accesskey}> attribute with the same value, nor with a value
that differs only by case, especially for ASCII characters, to two or more elements in the same document,
@@ -2159,16 +2159,10 @@
<hr />
To accept a drop, the drop target has to have a <{global/dropzone}>
attribute and listen to the <code>drop</code> event.
The value of the <{global/dropzone}> attribute specifies what kind of
data to accept (e.g., "<code>string:text/plain</code>" to accept any text strings, or
"<code>file:image/png</code>" to accept a PNG image file) and what kind of feedback to
give (e.g., "<code>move</code>" to indicate that the data will be moved).
To accept a drop, the drop target has to listen to the <code>drop</code> event.
<p class="note">
Instead of using the <{global/dropzone}> attribute, a drop
A drop
target can handle the <code>dragenter</code> event (to report whether or
not the drop target is to accept the drop) and the <code>dragover</code>
event (to specify what feedback is to be shown to the user).
@@ -2182,7 +2176,7 @@
<pre highlight="html">
&lt;p>Drop your favorite fruits below:&lt;/p>
&lt;ol dropzone="move string:text/x-example" ondrop="dropHandler(event)">
&lt;ol ondrop="dropHandler(event)">
&lt;!-- don't forget to change the "text/x-example" type to something
specific to your site -->
&lt;/ol>
@@ -2272,13 +2266,6 @@
special-cased for legacy reasons. The API does not enforce the use of <a>MIME types</a>; other values can be used as well. In all cases, however, the values
are all converted to <a>ASCII lowercase</a> by the API.
<p class="note">
Strings that contain [=space characters=]
cannot be used with the <{global/dropzone}> attribute, so authors are
encouraged to use only <a>MIME types</a> or custom strings (without
spaces).
</p>
There is a limit of one <i>Plain Unicode string</i> item per <a>item type string</a>.
</dd>
@@ -3458,28 +3445,6 @@
<dd>Set the <a>current target element</a> to the <a>immediate user
selection</a> anyway.</dd>
<dt>If the <a>immediate user selection</a> is an element with a <{global/dropzone}> attribute that <a>matches</a> the <a>drag data store</a></dt>
<dd>Set the <a>current target element</a> to the <a>immediate user
selection</a> anyway.</dd>
<dt>If the <a>immediate user selection</a> is an element that itself has an ancestor
element with a <{global/dropzone}> attribute that <a>matches</a> the <a>drag data store</a></dt>
<dd>
Let <var>new target</var> be the nearest (deepest) such ancestor element.
If the <a>immediate user selection</a> is <var>new target</var>, then leave the
<a>current target element</a> unchanged.
Otherwise, <a>fire a DND event</a> named <code>dragenter</code> at <var>new target</var>, with the current
<a>current target element</a> as the specific <var>related target</var>. Then, set
the <a>current target element</a> to <var>new target</var>, regardless of whether
that event was canceled or not.
</dd>
<dt>If the <a>immediate user selection</a> is <a href="#the-body-element">the <code>body</code> element</a></dt>
<dd>Leave the <a>current target element</a> unchanged.</dd>
@@ -3533,16 +3498,6 @@
<dd>Set the <a>current drag operation</a> to either "<code>copy</code>" or "<code>move</code>", as appropriate given the platform
conventions.</dd>
<dt>If the <a>current target element</a> is an element with a <{global/dropzone}> attribute that <a>matches</a> the <a>drag data store</a> and <a>specifies an operation</a></dt>
<dd>Set the <a>current drag operation</a> to the operation <a>specified</a> by the <{global/dropzone}> attribute of the <a>current target
element</a>.
<dt>If the <a>current target element</a> is an element with a <{global/dropzone}> attribute that <a>matches</a> the <a>drag data store</a> and does not
<a>specify an operation</a></dt>
<dd>Set the <a>current drag operation</a> to "<code>copy</code>".
<dt>Otherwise</dt>
<dd>Reset the <a>current drag operation</a> to "<code>none</code>".</dd>
@@ -3915,122 +3870,7 @@
If the {{HTMLElement/draggable}} IDL attribute is set to the value true, the <{global/draggable}>
content attribute must be set to the literal value "<code>true</code>".
<h4 id="the-dropzone-attribute">The <code>dropzone</code> attribute</h4>
All <a>HTML elements</a> may have the <dfn element-attr for="global"><code>dropzone</code></dfn> content attribute set. When specified,
its value must be an <a>unordered set of unique space-separated tokens</a> that are
<a>ASCII case-insensitive</a>. The allowed values are the following:
: <dfn><code>copy</code></dfn>
:: Indicates that dropping an accepted item on the element will result in a copy of the dragged
data.
: <dfn><code>move</code></dfn>
:: Indicates that dropping an accepted item on the element will result in the dragged data being
moved to the new location.
: <dfn><code>link</code></dfn>
:: Indicates that dropping an accepted item on the element will result in a link to the original
data.
: Any keyword with eight characters or more, beginning with an <a>ASCII case-insensitive</a>
match for the string "<code>string:</code>"
:: Indicates that items with <a>the drag data item kind</a> <i>Plain Unicode string</i> and
<a>the drag data item type string</a> set to a value that matches the remainder of the keyword
are accepted.
: Any keyword with six characters or more, beginning with an <a>ASCII case-insensitive</a> match
for the string "<code>file:</code>"
:: Indicates that items with <a>the drag data item kind</a> <i>File</i> and <a>the drag data item
type string</a> set to a value that matches the remainder of the keyword are accepted.
The <{global/dropzone}> content attribute's values must not have more than one of the three
feedback values (<code>copy</code>, <code>move</code>, and <code>link</code>) specified. If none
are specified, the <code>copy</code> value is implied.
An element with a <{global/dropzone}> attribute should also have a <{global/title}> attribute
that names the element for the purpose of non-visual interactions.
A <{global/dropzone}> attribute <dfn>matches a drag data store</dfn> if the
<a><code>dropzone</code> processing steps</a> result in a match.
A <{global/dropzone}> attribute <dfn lt="specified|specifies an operation|specify an operation">specifies an operation</dfn> if the
<a><code>dropzone</code> processing steps</a> result in a specified operation. The specified
operation is as given by those steps.
The <dfn><{global/dropzone}> processing steps</dfn> are as follows. They either result in a
match or not, and separate from this result either in a specified operation or not, as defined
below.
1. Let <var>value</var> be the value of the <{global/dropzone}> attribute.
2. Let <var>keywords</var> be the result of <a lt="split a string on spaces">splitting <var>value</var> on spaces</a>.
3. Let <var>matched</var> be false.
4. Let <var>operation</var> be unspecified.
5. For each value in <var>keywords</var>, if any, in the order that they were found in
<var>value</var>, run the following steps.
1. Let <var>keyword</var> be the keyword.
2. If <var>keyword</var> is one of "<code>copy</code>", "<code>move</code>", or
"<code>link</code>", then: run the following substeps:
1. If <var>operation</var> is still unspecified, then let <var>operation</var> be the
string given by <var>keyword</var>.
2. Skip to the step labeled <i>end of keyword</i> below.
3. If <var>keyword</var> does not contain a U+003A COLON character (:), or if the first such
character in <var>keyword</var> is either the first character or the last character in
the string, then skip to the step labeled <i>end of keyword</i> below.
4. Let <var>kind code</var> be the substring of <var>keyword</var> from the first character
in the string to the last character in the string that is before the first U+003A COLON
character (:) in the string, in <a>ASCII lowercase</a>.
5. Jump to the appropriate step from the list below, based on the value of
<var>kind code</var>:
<dl class="switch">
<dt>If <var>kind code</var> is the string "<code>string</code>"</dt>
<dd>Let <var>kind</var> be <i>Plain Unicode string</i>.</dd>
<dt>If <var>kind code</var> is the string "<code>file</code>"</dt>
<dd>Let <var>kind</var> be <i>File</i>.</dd>
<dt>Otherwise</dt>
<dd>Skip to the step labeled <i>end of keyword</i> below.</dd>
</dl>
6. Let <var>type</var> be the substring of <var>keyword</var> from the first character after
the first U+003A COLON character (:) in the string, to the last character in the string,
in <a>ASCII lowercase</a>.
7. If there exist any items in the <a>drag data store item list</a> whose
<a>drag data item kind</a> is the kind given in <var>kind</var> and whose
<a>drag data item type string</a> is <var>type</var>, then let <var>matched</var> be
true.
8. <i>End of keyword</i>: Go on to the next keyword, if any, or the next step in the overall
algorithm, if there are no more.
6. The algorithm results in a match if <var>matched</var> is true, and does not otherwise.
The algorithm results in a specified operation if <var>operation</var> is not unspecified.
The specified operation, if one is specified, is the one given by <var>operation</var>.
The <dfn attribute for="HTMLElement"><code>dropzone</code></dfn> IDL attribute must <a>reflect</a> the content attribute of
the same name.
The <a>supported tokens</a> for
{{HTMLElement/dropzone}} are the allowed values defined for the
<{global/dropzone}> attribute that are supported by the user agent.
<div class="example">
In this example, a <{div}> element is made into a drop target for image files using the
<{global/dropzone}> attribute. Images dropped into the target are then displayed.
<pre highlight="html">
&lt;div dropzone="copy file:image/png file:image/gif file:image/jpeg" ondrop="receive(event, this)">
&lt;p>Drop an image here to have it displayed.&lt;/p>
&lt;/div>
&lt;script>
function receive(event, element) {
var data = event.dataTransfer.items;
for (var i = 0; i &lt; data.length; i += 1) {
if ((data[i].kind == 'file') && (data[i].type.match('^image/'))) {
var img = new Image();
img.src = window.createObjectURL(data[i].getAsFile());
element.appendChild(img);
}
}
}
&lt;/script>
</pre>
</div>
<h4 id="security-risks-in-the-drag-and-drop-model">Security risks in the drag-and-drop model</h4>
<h4 id="security-risks-in-the-drag-and-drop-model">Security risks in the drag-and-drop model</h4>
User agents must not make the data added to the {{DataTransfer}} object during the
<code>dragstart</code> event available to scripts until the <code>drop</code> event, because

0 comments on commit 0c51b16

Please sign in to comment.