mirror of
https://github.com/flynx/ImageGrid.git
synced 2025-10-29 10:20:08 +00:00
261 lines
8.0 KiB
Plaintext
Executable File
261 lines
8.0 KiB
Plaintext
Executable File
Priority work
|
|
[_] 45% Preview II
|
|
[_] 55% 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.
|
|
|
|
|
[_] 0% 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
|
|
[_] position other ribbons...
|
|
[_] 60% correct zooming and modes
|
|
[X] zooming in ribbon view
|
|
[_] dragging wile zoomed to more than screen width/height...
|
|
[X] 100% zoom presets for ribbon view
|
|
| other possible presets:
|
|
| - five
|
|
| - all
|
|
| - group
|
|
| - day/month
|
|
| - shoot
|
|
| - tag
|
|
| ...
|
|
[X] three
|
|
[X] one (with zooming)
|
|
[_] single image mode with zooming
|
|
| ribbons are hidden
|
|
[_] 66% fix layout and animations
|
|
[X] zooming
|
|
[X] navigation
|
|
[_] 0% actions
|
|
[_] shifting up to new ribbon pushes the current row down...
|
|
[_] 0% cleanup UI
|
|
[_] stretch viewer to screen
|
|
[_] 0% layout
|
|
[_] tablet
|
|
| - buttons at sides
|
|
| - big, finger-friendly buttons
|
|
| - only horizontal (???)
|
|
|
|
|
| check if this works:
|
|
| @media handheld {}
|
|
[_] PC
|
|
| - no buttons (except for help and settings in corners)
|
|
| - keyboard
|
|
|
|
|
| @media screen {}
|
|
[_] web
|
|
[_] 0% setting screen
|
|
[_] basic screen
|
|
[_] keyboard config (low priority)
|
|
[_] view mode (low priority)
|
|
[_] 0% debug mode
|
|
[_] toggle cross-hair
|
|
[_] 0% misc
|
|
[_] add sort/re-sort capability...
|
|
[_] make scrolling of other ribbons proportional to the gap...
|
|
[_] 0% refactoring (low priority)
|
|
[_] cleanup legacy workarounds
|
|
[_] ui.js, gallery-prototype.js either merge or revise split logic
|
|
[_] 0% Preview III
|
|
[_] 0% view modes
|
|
[_] grid mode
|
|
[_] calendar mode
|
|
[_] 0% native client
|
|
[_] android
|
|
[_] windows
|
|
[_] MacOS (low priority)
|
|
[_] iOS (low priority)
|
|
[_] 0% Pre-Alpha
|
|
[_] 0% finalize UI logic
|
|
[_] unsorted images
|
|
|
|
|
|
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...
|
|
|
|
|
|
|
|
basic structure
|
|
[X] ribbons
|
|
[X] images
|
|
[_] indicators
|
|
| show where the images came from...
|
|
|
|
|
|
[_] % basic control elements
|
|
[_] 77% touch zones / buttons
|
|
[X] next DONE
|
|
[X] prev DONE
|
|
[X] shift up DONE
|
|
[X] shift down DONE
|
|
[X] promote DONE
|
|
[X] demote DONE
|
|
[_] zoom in ~ need real zooming...
|
|
[_] zoom out ~ need real zooming...
|
|
[X] toggle single image DONE
|
|
|
|
[_] 11% features
|
|
[_] 45% views
|
|
[_] 40% ribbon-based view
|
|
[_] show all
|
|
| 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
|
|
[_] 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
|
|
[_] image zooming
|
|
| fast zooming to stages:
|
|
| fit
|
|
| 100%
|
|
| 200%
|
|
| ...
|
|
[_] basic editing and manipulation
|
|
| image unchanged, data saved to json...
|
|
[_] crop
|
|
[_] rotate
|
|
|
|
[_] 20% General ToDo
|
|
[_] 0% image sorting
|
|
[_] will affect:
|
|
[_] promote
|
|
[_] demote
|
|
[_] shift up
|
|
[_] 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)
|
|
[_] 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
|
|
|
|
|
|
[X] 100% refactoring:
|
|
[X] merge almost identical functions...
|
|
|
|
|
|
[_] % 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 :
|