Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Adding channels is currently performed by a popup-type menu. Users may browse channels by category or use a search menu. Once a channel is selected, the channel title and description is displayed below the choose area. Users may either click the "use it now" button, which opens the channel in focus mode in a new window, or add it permanently to their current page.

From focus mode, if the focused channel is not in the user's layout, s/he will not be presented with an "Add to layout" link. This link opens a popup-style menu that allows the user to choose which tab the channel should be added to.

Moving channels: Drag and drop. When channels are successfully dropped in a new location, an AJAX call is made to the preferences servlet to persist the new location.

Deleting channels: Performed by clicking the delete button in the channel's title bar. Instead of reloading the page, javascript code removes the channel element from the DOM and sends an AJAX request to the preferences servlet.

Tabs

...

Both tabs and columns have popup edit menus to allow users to add, delte, and move these elements.

...

Clicking an active tab transforms the tab into an editing box. Users may rename the tab, move it left or right, or delete the tab.

Columns

A popup-type editing menu allows users to change the number of columns on the page and their respective widths.

Column number editing is done via a radio button menu that offers 1, 2, or 3 columns. (Higher column numbers can be offered by simply adding another radio button to the theme transform.) If the user selects a fewer number of columns than the current setting, the channels in the rightmost extra column(s) will be appended to the bottom of the new rightmost column. Any new columns will be added to the rightmost side of the page and will initially be empty.

Column widths may be adjusted by dragging a slider between the representations of the columns in the edit menu.

Screenshots

Gallery

Technical details

...