Priority work [_] 86% Preview II [X] 100% sorted images in ribbons [X] 100% stage I: position the promoted/demoted image correctly | and correct positioning on promote/demote | | input: | [01][02][03][04][05][06][07][08][09][10][11] ... [19][20] | | single ribbon, nothing special here. | | | general sort: | [05] [10][11][12] [15] [19][20] | [01] [04] [06][07][08] [13][14] [18] | [02][03] [09] [16][17] | | each strip is positioned above or below the place it was | shifted from. | if there is not enough space use weights to balance the | thing. | | | selected [08]: | [05] [10][11][12] [15] [19][20] | [01] [04] [06][07][[08]] [13][14] [18] | [02][03] [09] [16][17] | | above and below images are centered around the current | image as axis, the rule is that the strips left are coming | from the left of the axis and likewise for the right side. | [X] 100% stage II: scroll ribbons correctly | this is simple: | - center the right edge of image returned | by getImageBefore in all ribbons other than current... | - center current-image in current ribbon | - vertically center the current ribbon (negative margin?) [X] prototype and basic API [X] 100% migrate main code to the new system [X] basic navigation [X] basic actions [X] zooming [X] position other ribbons... | only prev/next for now... [X] 100% correct zooming and modes [X] zooming in ribbon view [X] 100% zoom presets for ribbon view | other possible presets: | - five | - all | - group | - day/month | - shoot | - tag | ... [X] three [X] one (with zooming) [X] single image mode with zooming | ribbons are hidden [_] 85% UI [X] fix single image mode | need to center the image correctly... [X] 100% add screen buttons for all actions... [X] navigation [X] actions [X] zooming [X] 100% zoom presets [X] single [X] three [X] wide | toggle... [X] 100% control single-image mode animations [X] scroll [X] switch (no transition) [X] 100% layout [X] 100% tablet [X] stretch to full screen | NOTE: viewer 0% sizes may break things... [X] make buttons semi-transparent and same color as bg in all modes | just like single image mode... [X] make bg color switching in all modes | black, white, gray [X] 100% PC [X] stretch to full screen [X] make view correctly resizable | appears to work correctly but need to click an image onResize... | | XXX find a way around always clicking things... [X] hide buttons for keyboard actions [X] web | is this is the same as the above two? (with auto-select) [X] add screen-width images next/prev navigation... [_] 0% settings/help screen [_] keyboard config/help [X] 100% debug mode [X] toggle cross-hair [X] 100% fix layout and animations [X] zooming [X] navigation [X] 100% actions [X] bug: shifting up to new ribbon pushes the current row down... | before starting on a fix, need to cleanup the code from old hacks and workarounds... [_] 49% native client [_] 33% Windows (CEF / CEFPython) [X] basic test [_] basic wrapper | hook-in os-specific API [_] package a portable exe [_] 66% Android (PhoneGap) [X] basic test [X] disable transitions... [_] basic wrapper | hook-in os-specific API [_] 25% Preview II (optional features) [_] slideshow... [_] 50% serialization/deserialization [X] JSON loader/unloader [_] file reader/writer [_] actual file loading (Target-specific) [_] flip ribbons relative to current -- reverse order [_] fade transition in single image mode... [_] display promoted/demoted images | show images that were either promoted or demoted from the | current ribbon... | | show these images either crossed out or semi-transparent [_] 80% drag/move action... [X] basic infrastructure [X] action: center current image [X] while zoomed more than the screen [X] while zoomed out (ribbon view) [_] 0% cleanup... [_] disable click events while dragging [_] differentiate with gestures | might be nice to add a Ps-like "space-dragging" | feature to differentiate nav gestures and | dragging... | ...this may not work for tablets | | for tablets might be good to add a small timeout to | both gestures and dragging, small enough for things | to feel natural... | | another way is to start dragging anyway but if the | eventual action resembles a gesture then exec that. | ...this will need careful setup of timeouts and | dynamic disabling/enabling of both drag and gestures | e.g. of large zooms dragging takes priority. [_] 50% return to current image / home (after drag) [_] button [X] keyboard [_] double tap/click to zoom (a-la iPad) | fit <-> actual pixels (max) [_] pinch to zoom [_] 66% add sort/re-sort capability... [X] abstract out image id [_] replace id (use something else like filename) [X] in-place sort ribbons [_] 50% option to disable processor intensive features [X] global transitions [_] global opacity -- do a layout without opacity [_] make scrolling of other ribbons proportional to the gap... [_] 66% refactoring (low priority) [X] cleanup legacy workarounds [X] ui.js, gallery-prototype.js either merge or revise split logic [_] do a redraw function | this should position all the elements correctly within the | current ui state... | | currently all operations that alter the layout call $('.current.image').click() [_] 0% Preview III [_] collection management [_] actual file loading [_] revise controls... [_] dynamic image/preview swap for zooming | important to make 1:1 previews for all main views and zoom levels... | also need to make this as device-neutral as possible... [_] dynamic image loading/unloading to very large ribbons | it is important to make this far enough from the curent view for the user not to notice anything... [_] 0% view modes [_] grid mode [_] calendar mode [_] 0% native client [_] android [_] restrict layout to horizontal | leave doing a different vertical layout for later versions... [_] windows [_] MacOS (low priority) [_] iOS (low priority) [_] 0% bugs: [_] adding a new ribbon above the current is still jumpy... [_] 0% Pre-Alpha [_] 0% finalize UI logic [_] unsorted images [_] 0% Alpha [_] 0% Beta [_] 0% 1.0 [_] 33% Main workflow [_] 33% image viewing [X] viewer [_] select source [_] slideshow [X] 100% image sorting [X] ribbon navigation [X] shift image between ribbons [X] 100% basic large scale operations [X] sort all images [X] reverse all images [X] reverse ribbons [_] 0% metadata [_] tag filtering [_] tag editing [_] EXIF/IPTC [_] 0% image/export export [_] JSON [_] XMP metadata [_] fav dirs [_] file list [_] image set Goals: main ribbon always consistent fast sorting via several simple passes binary | items are split into two ribbons. | | this can be done either by mandatorily shifting either up or | down or by restricting shifting to just one direction. | | this is a bit too restrictive. | | essentially this is a combination in the ternary approach | below as we can still shift images between levels. ternary | current ribbon and items are either sifted up, shifted down | relative to it or left on, unshifted. | | main ribbon consistency is not always obvious, especially on | partially sorted sets. e.g. while sorting part of the set where | should the unsorted part be? | | sorted section | +-------------------+ | | oooooooooooooooooooooooooooooooo | - oooooooooooooooooooooooooooo | > oooooooooooooooooooooxxxxxxxxxxxxxxxxxxxxxxxxxxx... < | + oooooooooooooooo | oooo | | +----------------------------+ | which level should this go to? | | in the illustration, the ribbon marked by ">" and "<" is where | the sorting started. | | there is also a question of how do we define the border between | sorted and unsorted zones and when? | ...after the sort is done, and when is that? | | possible ways to go around this: | before sorting select the working batch | - adds an extra step | - restricts later sorting | restrict promotion over the main ribbon | + sorting can be refined later in the same mode | - prevents the user to select the better images on first pass | split the sorted and unsorted batches and never mix them | - restricts later sorting | main ribbon always shows all the better images (from better levels) | o needs a way to move whole topologies up/down relative | to the main ribbon... | one way to do this is select and shift multiple images | will shift the whole pyramid (with all the "worse" images in between) | - introduces modes: sorting / viewing | - adds a separate stage -- move the topology to a correct | main ribbon position | | Q: is this system applicable to sorting search results? | A: likely yes, but the farther one gets from the main ribbon | the more the difference can get between adjacent images. images are always sortable all levels always browsable make all the steps except the actual sorting implicit | i.e. no jumping through hoops for the human... use the same mechanism as used for sorting, for image selection | this can be used for tagging, exhibitions, ...etc. context | a context consists of two things: | - image selection (might be a product of another context, search or selection) | - a way the levels are interpreted within this context | | default contexts: | - full view rating context | this incorporates ALL the archive and the levels are interpreted as ratings. | - selection rating context | same as full view but only part of the archive is rated | XXX this will need to be merged correctly back into the archive... | - selection context | this simply takes one set of images as input and shows a subset as output. | | contexts are persistent, much like a catalogue. | | a context can be cloned and re-used. | | contexts can be used to mark: | - shoots | - subjects | - exhibitions/shows | - portfolios | - ... [[controls.otl]] [_] 38% features [_] 55% views [_] 60% ribbon-based view [_] show all (very zoomed out view) | might be good to not show any images here at all, just replace them with their average color [X] show map [X] fit to ribbon [X] fit to image (square) [_] ribbon with promoted/demoted images | show semi-transparent images that were demoted/promoted from current ribbon [_] 50% single image view [_] image fit to screen [X] image fit to square | show parts of upper and lower ribbons [X] image zooming | fast zooming to stages: | fit | 100% | 200% | ... [_] basic editing and manipulation | image unchanged, data saved to json... [_] crop [_] rotate [_] 38% General ToDo [_] 80% image sorting [_] will affect: [X] promote [X] demote [X] shift up [X] shift down [_] ribbon merging [_] add promote/demote events (to attach structure editors)... | enable extension and use as a generic widget... [X] add real images... [_] make all the code relative to the current selection (multiple instances on a page support) [X] add ribbon relative scrolling... | each ribbon is positioned relative to the current selected image | below-left: closest image to the left of the current | bolow-right: same as above but right... | | this will demote/promote the image directly up or down... [_] make this into a jquery plugin... [_] add dynamic loading and unloading for very large sets... [X] gesture support... [_] add basic actions: [_] rotate left [_] rotate right [_] crop ... [_] add info: [_] number of images in ribbon [_] position in ribbon [_] % ISSUES and BUGS: [_] jumping on focus up/down... [_] demoting a first element (a ribbon is created) positions the field incorrectly (see demoteImage() for details)... . | vim:set spell :