Photowall is part 1 of a secret project I am working on (secret only since I am not sure part 2 will work, so I’d rather not declare yet what its about š ). This component on its own is an exercise in data-prefetch. The idea is to load data as the user scrolls to the end of the current set rather than ask the user to click on a “more photos” link. In this case, the component is feeding off Flickr data.
Type in a search word inside the text input and hit enter. Once the first set of data has loaded in, use the scrubber below the photos to scrub through the photos. Note: Data prefetch is triggered on mouse-up rather than mouse-move, I need to implement that in the final version.
Under the hood, I have a class called PagedDataService that computes which page of the remote data the user is on (Flickr apis support paged data, with each call out asking for a certain number of photos and a page offset, so page 1 has 0 to 1 x pagesize photos, page has 2 x pagesize, etc. Right now my pagesize is 60. ). The code also uses a PagePolicy class that the container looks at to see when the more data should be fetched. For example, in this case, I have asked the container to get more photos when the user is about 18 photos (6 columns) away from the last photo in the set.
There is no optimization of the code here yet, so I am not managing the photo renderers that aren’t visible to the user (which would free up memory). Another optimization would be to reuse renderers rather than create new ones like I do for every photo. Finally, a priority queue for the load requests would be great here.
So much for part 1, on to part 2. Stay tuned :).
Code Zen 