Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update to a spec draft document #251

Closed
wants to merge 23 commits into from
Closed

Update to a spec draft document #251

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
23 commits
Select commit Hold shift + click to select a range
4657165
update scope of spec
BoCupp-Microsoft Mar 13, 2020
df921b8
mark spot for example
BoCupp-Microsoft Mar 13, 2020
709f8de
Change title of spec
BoCupp-Microsoft Mar 13, 2020
9c805ec
rename spec
BoCupp-Microsoft Mar 13, 2020
6650990
Record a bunch of issues and share WIP document
BoCupp-Microsoft May 4, 2020
31838e6
first change
May 5, 2020
287485f
more changes to the spec
May 5, 2020
5577038
partial change
May 7, 2020
b607b9c
Merge pull request #1 from BoCupp-Microsoft/grishaChange
May 7, 2020
936bb59
updating with examples and fixing some grammatical issues
BoCupp-Microsoft May 7, 2020
c752195
small changes
May 7, 2020
2b5014b
removing setting
May 7, 2020
aa88953
reverting what i though to be a correct grammar fix. Also, linked iss…
May 7, 2020
ba03b4e
Merge pull request #2 from BoCupp-Microsoft/minorFixes
May 7, 2020
20458af
first round of PR feedback
May 8, 2020
c2ffdb8
Merge pull request #3 from BoCupp-Microsoft/minorFixes
May 20, 2020
8ee7cf4
addressing some of the PR feedback
May 20, 2020
6c46ff8
Merge pull request #4 from BoCupp-Microsoft/minorFixes
May 20, 2020
ac5ba6a
undoing title change
May 20, 2020
23bd69c
Merge pull request #5 from BoCupp-Microsoft/minorFixes
May 20, 2020
c1ddf21
Update Active Documents/contentEditableDisabled.html
Aug 11, 2020
cbd89f8
Update Active Documents/contentEditableDisabled.html
Aug 11, 2020
a53b2b4
Update Active Documents/contentEditableDisabled.html
Aug 11, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
201 changes: 142 additions & 59 deletions Active Documents/contentEditableDisabled.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,84 +7,167 @@
<script class='remove'>
var respecConfig = {
specStatus: "ED",
editors: [{
name: "Johannes Wilm",
mailto: "johannes@fiduswriter.org",
company: "Invited Expert"
}, ],
github: "https://github.com/w3c/editing/contentEditableDisabled.html",
shortName: "contenteditable-interface",
editors: [
{
name: "Johannes Wilm",
mailto: "johannes@fiduswriter.org",
company: "Invited Expert"
},
{
name: "Bo Cupp",
mailto: "pcupp@microsoft.com",
company: "Microsoft"
},
{
name: "Grisha Lyukshin",
mailto: "glyuk@microsoft.com",
company: "Microsoft"
}
],
github: "https://github.com/w3c/editing",
shortName: "contenteditabledisabled",
wg: "Web Applications Working Group",
wgURI: "https://www.w3.org/2019/webapps/",
wgPatentURI: "https://www.w3.org/2004/01/pp-impl/114929/status",
license: "w3c-software-doc"
license: "w3c-software-doc",
xref: "web-platform" // we will be citing html, infra, and friends.
};
</script>
<script src='https://www.w3.org/Tools/respec/respec-w3c-common' class='remove'></script>
<script src='https://www.w3.org/Tools/respec/respec-w3c' class='remove'></script>
</head>

<body>
<section id='abstract'>
<p>
<code>contentEditableDisabled</code> allows the disabling of certain editing actions on contenteditable editing hosts.
This specification defines an API that indicates to user agents which editing-related commands are applicable to contenteditable regions of a document. User agents can take this information into account when presenting any editing-related UI to ensure it is applicable to a given contenteditable region.
</p>
<p>
This specification purposefully does not prescribe the means by which a user agent will indicate to the user the applicability of any editing command. The user agent could, for example, omit editing UI, disable it, or choose some other appropriate UI treatment.
</p>
</section>
<section id='sotd'>
<p>
</p>
<p>This is a work in progress and subject to change without warning.</p>
</section>
<section data-dfn-for="DOMCommandTokenList">
<h2>The <dfn>DOMCommandTokenList</dfn></h2>
<pre class="idl">
interface DOMCommandTokenList : DOMTokenList {
[SameObject] readonly attribute DOMString supported;
};
</section>
<section id="introduction">
<h2>Introduction</h2>
<p>
In contenteditable regions of documents, some user agents provide contextual user interface (UI) elements to help accelerate common editing operations. The UI is meant to enhance the editing experience, but when authors create customized editors that aren't compatible with user agent UI, it leads to confused users.
</p>
<p>
To address the issue, a new `contenteditabledisabled` attribute can be applied as shown in the example below.
</p>
<pre class="example html">
&lt;div contenteditable="true" contenteditabledisabled="
formatbackcolor
formatdent
formatfont
formatjustify
formatscript
formatstrikethrough
formatunderline
inserthorizontalrule">
This is a contenteditable region of a document that supports:
&lt;ul>
&lt;li>bold text&lt;/li>
&lt;li>italic text&lt;/li>
&lt;li>links&lt;/li>
&lt;li>lists&lt;/li>
&lt;li>and possibly other formatting outside the scope of this specification.&lt;/li>
&lt;/ul>

This contenteditable region explicitly does not support:
&lt;ul>
&lt;li>background colors&lt;/li>
&lt;li>indentation&lt;/li>
&lt;li>font name, size or color customization&lt;/li>
&lt;li>justification&lt;/li>
&lt;li>superscript or subscript text&lt;/li>
&lt;li>strikethrough&lt;/li>
&lt;li>underlines&lt;/li>
&lt;li>horizontal rules&lt;/li>
&lt;/ul>
&lt;/div>
</pre>
<p>The <dfn><code>supported</code></dfn> attribute returns the supported tokens as a string.</p>
</section>
<section data-dfn-for="ElementContentEditable">
<h2>Extensions to the <dfn>ElementContentEditable</dfn> mixin</h2>
<section id="contenteditabledisabled">
<h2>
<code>contenteditabledisabled</code> DOM Content Attribute.
</h2>
<p>
The <code><dfn data-dfn-type="element-attr">contenteditabledisabled</dfn></code> attribute indicates which user agent-supplied editing UI SHOULD be disabled. When specified, the attribute can contain an [=unordered set of unique space-separated tokens=] that are treated as [=ASCII case-insensitive=].
</p>
<p>
The allowed set of tokens are listed below. Each token matches the name of an <a data-cite="input-events-1#events-inputevents">Input Type</a>, or is a shortcut that is equivalent to specifying a set tokens.
</p>
<p>
When a token is specified, any user agent-supplied editing UI, that when invoked, would result in a beforeinput event having and inputType that matches one of the tokens in the attribute's value, or matches a token that is represented by a shortcut that is included in the attribute's value, SHOULD be disabled, omitted, or otherwise indicated by the user agent to be not applicable. The exact mechanism for that indication is beyond the scope of this specification.
</p>
<h3>
<code>contenteditabledisabled</code> Allowed Tokens.
</h3>
<p>
<ul>
<li><code>formatjustifycenter</code></li>
<li><code>formatjustifyfull</code></li>
<li><code>formatjustifyleft</code></li>
<li><code>formatjustifyright</code></li>
<li><code>formatbackcolor</code></li>
<li><code>formatbold</code></li>
<li><code>insertlink</code></li>
<li><code>formatfontname</code></li>
<li><code>formatfontsize</code></li>
<li><code>formatfontcolor</code></li>
<li><code>formatindent</code></li>
<li><code>inserthorizontalrule</code></li>
<li><code>insertorderedlist</code></li>
<li><code>insertunorderedlist</code></li>
<li><code>formatitalic</code></li>
<li><code>formatoutdent</code></li>
<li><code>formatremove</code></li>
<li><code>formatstrikethrough</code></li>
<li><code>formatsubscript</code></li>
<li><code>formatsuperscript</code></li>
<li><code>formatunderline</code></li>
</ul>
</p>
<p class="issue" title="missing fontSize and insertImage">
fontSize / insertImage is missing from beforeInput. Why? It seems that it should be listed to create a more complete set.
<a href="https://github.com/w3c/editing/issues/249">Issue 249</a>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should reflect the discussion result. Maybe just a note that those are missing.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We discussed this at the meeting and agreed to remove them from both specs for now.

</p>
<h3>
<code>contenteditabledisabled</code> Allowed Token Shortcuts.
</h3>
<p>
The following tokens are also supported by the <code>contenteditabledisabled</code> attribute and serve as shorthands for specifying a set of tokens from contenteditabledisabled Allowed Tokens:
</p>
<p>
<ul>
<li><code>formatjustify</code>: combines <code>formatjustifycenter</code>, <code>formatjustifyfull</code>, <code>formatjustifyleft</code>, and <code>formatjustifyright</code>.</li>
<li><code>formatfont</code>: combines <code>formatfontname</code>, <code>formatfontsize</code>, and <code>formatfontcolor</code></li>
<li><code>formatdent</code>: combines <code>formatindent</code> and <code>formatoutdent</code></li>
<li><code>insertlist</code>: combines <code>insertorderedlist</code> and <code>insertunorderedlist</code></li>
<li><code>formatscript</code>: combines <code>formatsubscript</code> and <code>formatsuperscript</code></li>
</ul>
</p>
<p class="note">
Note that this specification does not have a shortcut to disable all editing UI. Authors should consider using a <code>textarea</code> or <code>contenteditable="plaintext-only"</code> for this purpose.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think plaintext-only shouldn't be recommended as it's currently removed from the spec.

</p>
</section>
<section id="element-contenteditable-mixin">
<h2>Extensions to the {{ElementContentEditable}} mixin</h2>
<pre class="idl">
partial interface ElementContentEditable {
[SameObject, PutForwards=value] readonly attribute DOMCommandTokenList contentEditableDisabled;
};
partial interface mixin ElementContentEditable {
[SameObject, PutForwards=value] readonly attribute DOMTokenList contentEditableDisabled;
};
</pre>
<p>The <dfn><code>contentEditableDisabled</code></dfn> attribute, when specified on an element that is a contenteditable host,
restricts the types of editing operations available by means of user agent native user interfaces and keyboard shortcuts handlers. Its value
must be an <a href=https://html.spec.whatwg.org/multipage/common-microsyntaxes.html#unordered-set-of-unique-space-separated-tokens>unordered
set of unique space-separated tokens</a> [[HTML]] that
are <a href=https://infra.spec.whatwg.org/#ascii-case-insensitive>ASCII case-insensitive</a> [[INFRA]]. The allowed values are:
</p>
<ul>
<li><code>history</code>: makes the element not be part of any browser-provided undo stack.</li>
<li><code>inserHorizontalRule</code></li>
<li><code>unorderedList</code></li>
<li><code>orderedList</code></li>
<li><code>insertLink</code></li>
<li><code>insertLineBreak</code></li>
<li><code>insertParagraph</code></li>
<li><code>formatBold</code></li>
<li><code>formatItalic</code></li>
<li><code>formatUnderline</code></li>
<li><code>formatStrikeThrough</code></li>
<li><code>formatSuperscript</code></li>
<li><code>formatSubscript</code></li>
<li><code>formatJustifyFull</code></li>
<li><code>formatJustifyCenter</code></li>
<li><code>formatJustifyRight</code></li>
<li><code>formatJustifyLeft</code></li>
<li><code>formatJustify</code>: combines <code>formatJustifyFull</code>, <code>formatJustifyCenter</code>, <code>formatJustifyRight</code> and <code>formatJustifyLeft</code></li>
<li><code>formatIndent</code></li>
<li><code>formatOutdent</code></li>
<li><code>formatDent</code>: combines <code>formatIndent</code> and <code>formatOutdent</code></li>
<li><code>formatSetBlockTextDirection</code></li>
<li><code>formatSetInlineTextDirection</code></li>
<li><code>formatFontColor</code></li>
<li><code>formatBackColor</code></li>
<li><code>formatFontName</code></li>
</ul>
<p>Unless specified, each specified token input controls that would otherwise trigger input events with <a href=https://www.w3.org/TR/input-events-1/#events-inputevents>Input Types</a> [[input-events-1]] of the same value.</p>
<p>
The <code>contentEditableDisabled</code> WebIDL property reflects the contenteditabledisabled DOM content attribute.
<p>
</section>
<section id="issue-summary">
</section>
<section id='conformance'></section>
</body>

</html>
Binary file added Active Documents/images/ios-editing-buttons.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Active Documents/images/mac-touchbar.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.