VisualEditor/Design/Table editor

This is an important development and should be put high in the priority list.

Table editing is difficult to do well. We want to do well.

Design Workflow

Goals

• Allow users to add a new table and start adding content as quickly as possible.
• Allow users to edit the table in context, without having to go into lots of menus.

• 
  1. Selecting table from toolbar
• 
  2. User is given a 4x4 table with top row as header by default, and cursor in the 1st cell. Control in top left will allow a user to drag the table, or set table-level options
• 
  3. Hovering or clicking in a cell reveals controls for that row and column
• 
  4. When a user clicks one of those controls, more controls are revealed. They can add a row above or below, delete the row, or click the cog icon for more options
• 
  5. Hovering over a add row icon shows a darker blue line indication where the row will be
• 
  6. A user has added a new row
• 
  7. A user is editing a column and has clicked on the cog icon to see more options. The user can make it a header or make it sortable
• 
  8. A variation of column/row controls, in which all actions are in one dropdown menu

Version 2

• 
  1. Selecting table from toolbar
• 
  2. User is given a 4x4 table with top row as header by default, and cursor in the 1st cell. The small bars on the top and left allow users to access table editing options.
• 
  3. Hovering on a row bar.
• 
  4. Clicking on a row bar. This shows an arrow indication.
• 
  5. Clicking on the arrow or any part of this bar opens the menu.
• 
  6. A user can click and drag to select multiple columns or rows. They can access a menu to edit those multiple columns
• 
  7. Clicking on just one column

Other table editors

Service	Author	CSV/TSV Import	MediaWiki Import	MediaWiki Export	Add rows/columns	Remarks
Table Editor 2	Peder Skeidsvoll
Wiki Table Editor	golopot
TablesGenerator.com
CK Editor						webpage extension
Wikia Table Editor						uses CK Editor, appears to be disabled
TinyMCE						webpage extension
Google Docs					n/a	spreadsheet program
Aloha Editor						webpage extension, no live demo

DesiredPossible Functionality

• Create table
• Delete table
• Resize table column widths
• Rows
  • Toggle table cells/table headings
  • Add row before
  • Add row after
  • Duplicate row
  • Reorder rows (drag sort)
  • Delete row
• Columns
  • Toggle table cells/table headings
  • Add column before
  • Add column after
  • Duplicate column
  • Reorder columns (drag sort)
  • Delete column
• Cells
  • Toggle table cell/table heading
  • Merge right
  • Merge left
  • Merge up
  • Merge down
  • Split into rows
  • Split into columns
  • Change background color (highlight) (eg. w:World Series Most Valuable Player Award)
  • Right-, left-, and center-aligned content
• Any element
  • edit style and attributes of the element