View Source


h1. Intro
Based on [Data Basket Spec - Old] from Dominic and Maria

HTML mockups:
- (commit/66, 8/11/2012, Tom Elsner)
- (8/15/2012, copied by Vlado)

- ver1: 20.07.2012: Hollie
- ver2: 07.08.2012: Hollie
- ver3: 17.08.2010: Vlado: put tooltips, some red notations, edited the descriptive text

h1. Mockups

h2. Databasket in Tab
Basket in a permanent tab allows maximum space
* Highlight the row under the mouse in yellow (rollover).
Click on the row does [#View Bookmark]
* Each item type has an icon, and the type name is shown in tooltip.
Some match the tools, others are new (Text Snippet, Web Link)
* Image Preview is only displayed for types of data where it is possible to do this
* The URL is shortened; the full URL is shown in tooltip.
URL is clickable to show the item in original location (tool)
* Filter is similar to Annotation filtering (available in Tab and in Popup)
* Sort is a dropdown and sorts immediately (available in Tab and in Popup)
* Action menu on each item: View (same as clicking the row), Edit, Delete
* (Not for now) Tags panel can be sorted by popularity (shown) or A---Z


h2. Data Basket as Popup
For use when inserting item into RTF editor (eg in a comment)
* An additional display method needed for the system
* Clicking on an item inserts it in the RTF
* No actions (cannot edi
* All the rest is the same as [#Databasket in Tab]


h2. Filter Dialog
This shows the filtering controls. It's made with SALT, a text-to-UI macro that has its limitations, so the look is not faithful.
The look should be similar to [image annotation Filter|UI Redesign (Sofia)#Filter], eg the two buttons should be on the right.
{/ <b>Filter | Sort }
Type | . | Added by
^--All--^ | . | " "
" "| to | " "
[Cancel] | . | [Filter]

h2. View Bookmark
Shows bookmark details
* We only have a single pop up (for detail and edit) rather than a double pop up for edit


h2. Edit Bookmark

h2. Add Text Snippet
Very similar to Edit

h2. Add Web Link
Advanced interactivity when URL is added:
- fetch page, get <title> tag and Web Preview (if we find such a server)


h2. Icons