Skip to content

Commit

Permalink
[giow] (1) Update the dropzone='' syntax to use string: and file: rat…
Browse files Browse the repository at this point in the history 
…her than s: and f:. No point being terse here.

Affected topics: HTML

git-svn-id: http://svn.whatwg.org/webapps@6873 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information
@Hixie
Hixie committed Dec 14, 2011
1 parent 514097f commit a709c6d
Show file tree
Hide file tree
Showing 3 changed files with 100 additions and 122 deletions.
72 changes: 32 additions & 40 deletions complete.html
View file
Expand Up @@ -71571,10 +71571,10 @@ <h4 id=introduction-8><span class=secno>8.6.1 </span>Introduction</h4>
<code title=drop-event>drop</code> event.</p>

<p>The value of the <code title=attr-dropzone><a href=#the-dropzone-attribute>dropzone</a></code>
attribute specifies what kind of data to accept (e.g. "<code title="">s:text/plain</code>" to accept any text strings, or
"<code>f: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).</p>
attribute specifies what kind of data to accept (e.g. "<code title="">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).</p>

<p class=note>Instead of using the <code title=attr-dropzone><a href=#the-dropzone-attribute>dropzone</a></code> attribute, a drop target can
handle the <code title=event-dragenter><a href=#event-dragenter>dragenter</a></code> event (to
Expand All @@ -71591,7 +71591,7 @@ <h4 id=introduction-8><span class=secno>8.6.1 </span>Introduction</h4>
<p>For example:</p>

<pre>&lt;p&gt;Drop your favorite fruits below:&lt;/p&gt;
&lt;ol dropzone="move s:text/x-example" ondrop="dropHandler(event)"&gt;
&lt;ol dropzone="move string:text/x-example" ondrop="dropHandler(event)"&gt;
&lt;-- don't forget to change the "text/x-example" type to something
specific to your site --&gt;
&lt;/ol&gt;
Expand Down Expand Up @@ -73529,22 +73529,18 @@ <h4 id=the-dropzone-attribute><span class=secno>8.6.8 </span>The <dfn title=attr
result in a link to the original data.</p>


<dt>Any keyword with three characters or more, beginning with the
two characters U+0073 LATIN SMALL LETTER S and U+003A COLON or
U+0053 LATIN CAPITAL LETTER S and U+003A COLON (i.e. an <a href=#ascii-case-insensitive>ASCII
case-insensitive</a> match for the string "<code title="">s:</code>")<dt>
<dt>Any keyword with eight characters or more, beginning with the
an <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">string:</code>"<dt>

</dt><dd><p>Indicates that items with <a href=#the-drag-data-item-kind>the drag data item
kind</a> <i>Plain Unicode string</i> and <a href=#the-drag-data-item-type-string>the drag data
item type string</a> set to a value that matches the remainder
of the keyword are accepted.</dd>

<!--DND-v3:
<dt>Any keyword with three characters or more, beginning with the
two characters U+0062 LATIN SMALL LETTER B and U+003A COLON or
U+0042 LATIN CAPITAL LETTER B and U+003A COLON (i.e. an <span>ASCII
case-insensitive</span> match for the string "<code
title="">b:</code>")<dt>
<dt>Any keyword with six characters or more, beginning with an
<span>ASCII case-insensitive</span> match for the string "<code
title="">blob:</code>"<dt>

<dd><p>Indicates that items with <span>the drag data item
kind</span> <i>Blob</i>, <i>File</i>, or <i>Plain Unicode
Expand All @@ -73553,22 +73549,18 @@ <h4 id=the-dropzone-attribute><span class=secno>8.6.8 </span>The <dfn title=attr
accepted.</p></dd>
-->

<dt>Any keyword with three characters or more, beginning with the
two characters U+0066 LATIN SMALL LETTER F and U+003A COLON or
U+0046 LATIN CAPITAL LETTER F and U+003A COLON (i.e. an <a href=#ascii-case-insensitive>ASCII
case-insensitive</a> match for the string "<code title="">f:</code>")<dt>
<dt>Any keyword with six characters or more, beginning with an
<a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">file:</code>"<dt>

</dt><dd><p>Indicates that items with <a href=#the-drag-data-item-kind>the drag data item
kind</a> <i><a href=#file>File</a></i> and <a href=#the-drag-data-item-type-string>the drag data item type
string</a> set to a value that matches the remainder of the
keyword are accepted.</dd>

<!--DND-v4:
<dt>Any keyword with three characters or more, beginning with the
two characters U+006F LATIN SMALL LETTER O and U+003A COLON or
U+004F LATIN CAPITAL LETTER O and U+003A COLON (i.e. an <span>ASCII
case-insensitive</span> match for the string "<code
title="">o:</code>")<dt>
<dt>Any keyword with eight characters or more, beginning with an
<span>ASCII case-insensitive</span> match for the string "<code
title="">object:</code>"<dt>

<dd><p>Indicates that items with <span>the drag data item type
string</span> set to a value that matches the remainder of the
Expand Down Expand Up @@ -73627,24 +73619,23 @@ <h4 id=the-dropzone-attribute><span class=secno>8.6.8 </span>The <dfn title=attr

</ol></li>

<li><p>If <var title="">keyword</var> is shorter than three
characters in length, then skip to the step labeled <i>end of
<li><p>If <var title="">keyword</var> does not contain a U+003A
COLON character (:), or if the first such character in <var title="">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.</li>

<li><p>If the second character in <var title="">keyword</var> is
not a U+003A COLON character (:), then skip to the step labeled
<i>end of keyword</i> below.</li>

<li><p>Let <var title="">kind code</var> be the first character
in <var title="">keyword</var>, <a href=#converted-to-ascii-lowercase>converted to ASCII
lowercase</a>.</li>
<li><p>Let <var title="">kind code</var> be the substring
of <var title="">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, <a href=#converted-to-ascii-lowercase>converted
to ASCII lowercase</a>.</p>

<li>

<p>Jump to the appropriate step from the list below, based on
the value of <var title="">kind code</var>:</p>

<dl class=switch><dt>If <var title="">kind code</var> is a U+0073 LATIN SMALL LETTER S character</dt>
<dl class=switch><dt>If <var title="">kind code</var> is the string "<code title="">string</code>"</dt>
<dd>

<p>Let <var title="">kind<!--DND-v3:/DND-v4: s--></var> be
Expand All @@ -73653,7 +73644,7 @@ <h4 id=the-dropzone-attribute><span class=secno>8.6.8 </span>The <dfn title=attr
</dd>

<!--DND-v3:
<dt>If <var title="">kind code</var> is a U+0062 LATIN SMALL LETTER B character</dt>
<dt>If <var title="">kind code</var> is the string "<code title="">blob</code>"</dt>
<dd>

<p>Let <var title="">kinds</var> be <i>Plain Unicode
Expand All @@ -73662,7 +73653,7 @@ <h4 id=the-dropzone-attribute><span class=secno>8.6.8 </span>The <dfn title=attr
</dd>
-->

<dt>If <var title="">kind code</var> is a U+0066 LATIN SMALL LETTER F character</dt>
<dt>If <var title="">kind code</var> is the string "<code title="">file</code>"</dt>
<dd>

<p>Let <var title="">kind<!--DND-v3:/DND-v4: s--></var> be
Expand All @@ -73671,7 +73662,7 @@ <h4 id=the-dropzone-attribute><span class=secno>8.6.8 </span>The <dfn title=attr
</dd>

<!--DND-v4:
<dt>If <var title="">kind code</var> is a U+006F LATIN SMALL LETTER O character</dt>
<dt>If <var title="">kind code</var> is the string "<code title="">object</code>"</dt>
<dd>

<p>Let <var title="">kinds</var> be <i>Plain Unicode
Expand All @@ -73689,9 +73680,10 @@ <h4 id=the-dropzone-attribute><span class=secno>8.6.8 </span>The <dfn title=attr

</dl></li>

<li><p>Let <var title="">type</var> be the string consisting of
all but the first two characters of <var title="">keyword</var>,
<a href=#converted-to-ascii-lowercase>converted to ASCII lowercase</a>.</li>
<li><p>Let <var title="">type</var> be the substring of <var title="">keyword</var> from the first character after the first
U+003A COLON character (:) in the string, to the last character
in the string, <a href=#converted-to-ascii-lowercase>converted to ASCII
lowercase</a>.</li>

<li><p>If there exist any items in the <a href=#drag-data-store-item-list>drag data store item
list</a> whose <a href=#the-drag-data-item-kind title="the drag data item kind">drag data
Expand Down Expand Up @@ -73728,7 +73720,7 @@ <h4 id=the-dropzone-attribute><span class=secno>8.6.8 </span>The <dfn title=attr
target for image files using the <code title=attr-dropzone><a href=#the-dropzone-attribute>dropzone</a></code> attribute. Images dropped
into the target are then displayed.</p>

<pre>&lt;div dropzone="copy f:image/png f:image/gif f:image/jpeg" ondrop="receive(event, this)"&gt;
<pre>&lt;div dropzone="copy file:image/png file:image/gif file:image/jpeg" ondrop="receive(event, this)"&gt;
&lt;p&gt;Drop an image here to have it displayed.&lt;/p&gt;
&lt;/div&gt;
&lt;script&gt;
Expand Down
72 changes: 32 additions & 40 deletions index
View file
Expand Up @@ -71571,10 +71571,10 @@ addShortcutKeyLabel(document.getElementById('c'));</pre>
<code title=drop-event>drop</code> event.</p>

<p>The value of the <code title=attr-dropzone><a href=#the-dropzone-attribute>dropzone</a></code>
attribute specifies what kind of data to accept (e.g. "<code title="">s:text/plain</code>" to accept any text strings, or
"<code>f: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).</p>
attribute specifies what kind of data to accept (e.g. "<code title="">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).</p>

<p class=note>Instead of using the <code title=attr-dropzone><a href=#the-dropzone-attribute>dropzone</a></code> attribute, a drop target can
handle the <code title=event-dragenter><a href=#event-dragenter>dragenter</a></code> event (to
Expand All @@ -71591,7 +71591,7 @@ addShortcutKeyLabel(document.getElementById('c'));</pre>
<p>For example:</p>

<pre>&lt;p&gt;Drop your favorite fruits below:&lt;/p&gt;
&lt;ol dropzone="move s:text/x-example" ondrop="dropHandler(event)"&gt;
&lt;ol dropzone="move string:text/x-example" ondrop="dropHandler(event)"&gt;
&lt;-- don't forget to change the "text/x-example" type to something
specific to your site --&gt;
&lt;/ol&gt;
Expand Down Expand Up @@ -73529,22 +73529,18 @@ dictionary <dfn id=drageventinit>DragEventInit</dfn> : <a href=#mouseeventinit>M
result in a link to the original data.</p>


<dt>Any keyword with three characters or more, beginning with the
two characters U+0073 LATIN SMALL LETTER S and U+003A COLON or
U+0053 LATIN CAPITAL LETTER S and U+003A COLON (i.e. an <a href=#ascii-case-insensitive>ASCII
case-insensitive</a> match for the string "<code title="">s:</code>")<dt>
<dt>Any keyword with eight characters or more, beginning with the
an <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">string:</code>"<dt>

</dt><dd><p>Indicates that items with <a href=#the-drag-data-item-kind>the drag data item
kind</a> <i>Plain Unicode string</i> and <a href=#the-drag-data-item-type-string>the drag data
item type string</a> set to a value that matches the remainder
of the keyword are accepted.</dd>

<!--DND-v3:
<dt>Any keyword with three characters or more, beginning with the
two characters U+0062 LATIN SMALL LETTER B and U+003A COLON or
U+0042 LATIN CAPITAL LETTER B and U+003A COLON (i.e. an <span>ASCII
case-insensitive</span> match for the string "<code
title="">b:</code>")<dt>
<dt>Any keyword with six characters or more, beginning with an
<span>ASCII case-insensitive</span> match for the string "<code
title="">blob:</code>"<dt>

<dd><p>Indicates that items with <span>the drag data item
kind</span> <i>Blob</i>, <i>File</i>, or <i>Plain Unicode
Expand All @@ -73553,22 +73549,18 @@ dictionary <dfn id=drageventinit>DragEventInit</dfn> : <a href=#mouseeventinit>M
accepted.</p></dd>
-->

<dt>Any keyword with three characters or more, beginning with the
two characters U+0066 LATIN SMALL LETTER F and U+003A COLON or
U+0046 LATIN CAPITAL LETTER F and U+003A COLON (i.e. an <a href=#ascii-case-insensitive>ASCII
case-insensitive</a> match for the string "<code title="">f:</code>")<dt>
<dt>Any keyword with six characters or more, beginning with an
<a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">file:</code>"<dt>

</dt><dd><p>Indicates that items with <a href=#the-drag-data-item-kind>the drag data item
kind</a> <i><a href=#file>File</a></i> and <a href=#the-drag-data-item-type-string>the drag data item type
string</a> set to a value that matches the remainder of the
keyword are accepted.</dd>

<!--DND-v4:
<dt>Any keyword with three characters or more, beginning with the
two characters U+006F LATIN SMALL LETTER O and U+003A COLON or
U+004F LATIN CAPITAL LETTER O and U+003A COLON (i.e. an <span>ASCII
case-insensitive</span> match for the string "<code
title="">o:</code>")<dt>
<dt>Any keyword with eight characters or more, beginning with an
<span>ASCII case-insensitive</span> match for the string "<code
title="">object:</code>"<dt>

<dd><p>Indicates that items with <span>the drag data item type
string</span> set to a value that matches the remainder of the
Expand Down Expand Up @@ -73627,24 +73619,23 @@ dictionary <dfn id=drageventinit>DragEventInit</dfn> : <a href=#mouseeventinit>M

</ol></li>

<li><p>If <var title="">keyword</var> is shorter than three
characters in length, then skip to the step labeled <i>end of
<li><p>If <var title="">keyword</var> does not contain a U+003A
COLON character (:), or if the first such character in <var title="">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.</li>

<li><p>If the second character in <var title="">keyword</var> is
not a U+003A COLON character (:), then skip to the step labeled
<i>end of keyword</i> below.</li>

<li><p>Let <var title="">kind code</var> be the first character
in <var title="">keyword</var>, <a href=#converted-to-ascii-lowercase>converted to ASCII
lowercase</a>.</li>
<li><p>Let <var title="">kind code</var> be the substring
of <var title="">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, <a href=#converted-to-ascii-lowercase>converted
to ASCII lowercase</a>.</p>

<li>

<p>Jump to the appropriate step from the list below, based on
the value of <var title="">kind code</var>:</p>

<dl class=switch><dt>If <var title="">kind code</var> is a U+0073 LATIN SMALL LETTER S character</dt>
<dl class=switch><dt>If <var title="">kind code</var> is the string "<code title="">string</code>"</dt>
<dd>

<p>Let <var title="">kind<!--DND-v3:/DND-v4: s--></var> be
Expand All @@ -73653,7 +73644,7 @@ dictionary <dfn id=drageventinit>DragEventInit</dfn> : <a href=#mouseeventinit>M
</dd>

<!--DND-v3:
<dt>If <var title="">kind code</var> is a U+0062 LATIN SMALL LETTER B character</dt>
<dt>If <var title="">kind code</var> is the string "<code title="">blob</code>"</dt>
<dd>

<p>Let <var title="">kinds</var> be <i>Plain Unicode
Expand All @@ -73662,7 +73653,7 @@ dictionary <dfn id=drageventinit>DragEventInit</dfn> : <a href=#mouseeventinit>M
</dd>
-->

<dt>If <var title="">kind code</var> is a U+0066 LATIN SMALL LETTER F character</dt>
<dt>If <var title="">kind code</var> is the string "<code title="">file</code>"</dt>
<dd>

<p>Let <var title="">kind<!--DND-v3:/DND-v4: s--></var> be
Expand All @@ -73671,7 +73662,7 @@ dictionary <dfn id=drageventinit>DragEventInit</dfn> : <a href=#mouseeventinit>M
</dd>

<!--DND-v4:
<dt>If <var title="">kind code</var> is a U+006F LATIN SMALL LETTER O character</dt>
<dt>If <var title="">kind code</var> is the string "<code title="">object</code>"</dt>
<dd>

<p>Let <var title="">kinds</var> be <i>Plain Unicode
Expand All @@ -73689,9 +73680,10 @@ dictionary <dfn id=drageventinit>DragEventInit</dfn> : <a href=#mouseeventinit>M

</dl></li>

<li><p>Let <var title="">type</var> be the string consisting of
all but the first two characters of <var title="">keyword</var>,
<a href=#converted-to-ascii-lowercase>converted to ASCII lowercase</a>.</li>
<li><p>Let <var title="">type</var> be the substring of <var title="">keyword</var> from the first character after the first
U+003A COLON character (:) in the string, to the last character
in the string, <a href=#converted-to-ascii-lowercase>converted to ASCII
lowercase</a>.</li>

<li><p>If there exist any items in the <a href=#drag-data-store-item-list>drag data store item
list</a> whose <a href=#the-drag-data-item-kind title="the drag data item kind">drag data
Expand Down Expand Up @@ -73728,7 +73720,7 @@ dictionary <dfn id=drageventinit>DragEventInit</dfn> : <a href=#mouseeventinit>M
target for image files using the <code title=attr-dropzone><a href=#the-dropzone-attribute>dropzone</a></code> attribute. Images dropped
into the target are then displayed.</p>

<pre>&lt;div dropzone="copy f:image/png f:image/gif f:image/jpeg" ondrop="receive(event, this)"&gt;
<pre>&lt;div dropzone="copy file:image/png file:image/gif file:image/jpeg" ondrop="receive(event, this)"&gt;
&lt;p&gt;Drop an image here to have it displayed.&lt;/p&gt;
&lt;/div&gt;
&lt;script&gt;
Expand Down

0 comments on commit a709c6d

Please sign in to comment.