Behavior of the text styling drop-down list

Only one of the classes is pre-selected in the Text Style selectlist and therefore shown in the collapsed selectlist. At all times, only classes allowed by the configuration settings are presented in the selectlist.

Legend:

highlighted (selected) string:This is the string inside the textarea the user has selected using the mouse or keyboard.

|= cursor position inside the textarea.

Case 1: No string is highlighted and the cursor is outside any inline element:

  1. the option shown in the collapsed selectlist is ‘No text style’;
  2. the selectlist is disabled.

Case 2: No string is highlighted and the cursor is inside an inline element:

Example:<code>wor|d</code>

a) the option shown in the collapsed selectlist is the current value of the element’s class attribute, or ‘No text style’ when the inline element bears no class attribute;

b) the selectlist is enabled and contains the classes allowed for the type of inline element;

c) if the author chooses a different class, the class attribute gets updated; the position of the cursor is unchanged;

d) if the author chooses ‘No text style’, the current class is removed; if the element has no more class, the class attribute gets removed; if the element is a span element and it has no more attribute, the span element is removed;the position of the cursor is unchanged.

Case 3: A string is highlighted and crosses multiple elements:

  1. the option shown in the collapsed selectlist is ‘No text style’;
  2. if the string crosses multiple block elements:
  • the selectlist is disabled;
  1. if the string crosses multiple inline elements:
  • the selectlist is enabled and contains the classes allowed for the ‘span’ element;
  • if the author chooses a class, the highlighted string is wrapped with a ‘span’ element with the chosen class as value of its class attribute;
  • the resulting marked up string is not highlighted;
  • the cursor is positioned at the end of the string.

Case 4: The highlighted string is not contained in any inline element:

  1. the option shown in the collapsed selectlist is ‘No text style’;

b) if the author chooses a class, the highlighted string is wrapped with a ‘span’ element with the chosen class as value of its class attribute;

  1. the resulting marked up string is not highlighted;
  2. the cursor is positioned at the end of the highlighted string.

Case 5: The highlighted string is contained in an inline element:

  1. the option shown in the collapsed selectlist is ‘No text style’;

b) if the author chooses a class, the highlighted string is wrapped with a ‘span’ element with the chosen class as value of its class attribute;

  1. the resulting marked up string is not highlighted;
  2. the cursor is positioned at the end of the highlighted string.

Case 6: The hightlighted string contains exactly the complete inline element:

Example of hightlighted string:<code>word</code>

a) the option shown in the collapsed selectlist is the current value of the element’s class attribute, or ‘No style’ when the inline element bears no class attribute;

b) the selectlist is enabled and contains the classes allowed for the type of inline element;

c) if the author chooses a different class, the class attribute gets updated; the cursor is moved at the end of the highlighted string which gets de-highlighted;

d)if the author chooses ‘No style’, the current class is removed; if the element has no more class, the class attribute gets removed;if the element is a span element and it has no more attribute, the span element is removed; the cursor is moved at the end of the highlighted string which gets de-highlighted.