58
edits
Editor with widgets: Difference between revisions
Jump to navigation
Jump to search
→SPAN contentEditable='false' are contained in editable area
| (5 intermediate revisions by 2 users not shown) | |||
| Line 1: | Line 1: | ||
= | = Problem= | ||
HTML5 introduced an ability to make entire HTML document or its part editable. However [http://www.w3.org/TR/html5/editing.html#contenteditable specification] didn't provide complete documentation defining behaviour of HTML elements inside of editable area. Especially it concerns to HTML forms where the spec has few lines only. It leads to many things can be treated in different ways in question. So it's necessary to provide well-defined rules because this will allow to achieve compatibility between user agents. For example HTML form elements behaves differently in different versions of IE and Mozilla editor doesn't work well enough with them at all. So currently form elements are outsiders of editable world of HTML documents. | |||
This article is designed to define behavior of editor used for editable HTML documents on user actions. | |||
==Application area== | ==Application area== | ||
| Line 14: | Line 16: | ||
* Simple WYSIWYG XForms editors | * Simple WYSIWYG XForms editors | ||
= Proposal= | |||
==Widgets in containers with contentEditable attribute== | ==Widgets in containers with contentEditable attribute== | ||
The common approach - the behavior of widgets is the same with the HTML specification. But in HTML widgets are in the static place and in the editor widgets is a part of editing text, it is possible to cut, copy and paste widgets by clipboard. | The common approach - the behavior of widgets is the same with the HTML specification. But in HTML widgets are in the static place and in the editor widgets is a part of editing text, it is possible to cut, copy and paste widgets by clipboard. | ||
===Common behavior for all type of widgets in editable area=== | ===Common behavior for all type of widgets in editable area=== | ||
| Line 28: | Line 30: | ||
# mouse click on widget's text field should move focus to it and open widget's menu | # mouse click on widget's text field should move focus to it and open widget's menu | ||
# double click should open and close widget's menu, i.e. action analogous to two single clicks is executed | # double click should open and close widget's menu, i.e. action analogous to two single clicks is executed | ||
===BUTTON=== | ===BUTTON=== | ||
| Line 61: | Line 62: | ||
# widgets in selection should be copied, cut, pasted as part of the selection | # widgets in selection should be copied, cut, pasted as part of the selection | ||
=== SPAN contentEditable='false' are contained in editable area=== | |||
=== SPAN | All content of element SPAN with contentEditable='false' attribute is treated as a word. All elements and contols inside element have normal behaviour. Element is selected with all content as one element. | ||
# span can be removed | # span can be removed by Backspace or Del keys. | ||
# span can't have focus but widgets in span can have focus | # span can't have focus but widgets in span can have focus | ||
# if span is | # if span is in selection and try to remove selection then content of the selection will be removed with span (see bullet 1) | ||
# span can | # operations Undo can be applied for removed span | ||
# span can is copied into clipboard | |||
# if caret is directly before/after the span then pressing right/left key should move caret directly after/before span. | # if caret is directly before/after the span then pressing right/left key should move caret directly after/before span. | ||
# when in multiline editable field Up/Down is pressed and in the next line under caret there is the span then caret should be moved to position directly before or after span (it depends on which place is closer). | # when in multiline editable field Up/Down is pressed and in the next line under caret there is the span then caret should be moved to position directly before or after span (it depends on which place is closer). | ||
==Bugs== | ==Bugs== | ||
Tested on FF 3.5, 3.7 a1, Windows XP, Intel Atom | |||
===SELECT=== | ===SELECT=== | ||
| Line 99: | Line 97: | ||
===TABLE=== | ===TABLE=== | ||
# if in the table's cell there is only one widget the there is no way to move caret into cell | # if in the table's cell there is only one widget the there is no way to move caret into cell | ||
===Common=== | ===Common=== | ||