raeez / monet Goto Github PK

Figure out a way to get all images hosted on Amazon's S3 without exposing public links

- consider storing thumbnails locally
- set up a haskell snap server for thumbnails

The server needs to duplicate and compress incoming images.
Need a routine to grab the thumb_url for images
All image API returns include:
"thumb_url" and "image_url".

Even on shitty systems.
This is possible.
It works with the stock jQuery File Upload demo. Need to diagnose where the front-end bottlnecks are on our system.

I picked arbitrary, but realistic expectactions, for photo uploads. We HAVE to let people drag in an bunch of modern digital camera photos since that will be the most common photo type for the web version.

Should we possibly be doing an autoredirect after creating a new memory?

Or perhaps we should do a countdown timer, after 10secs it takes you to the new memory?

Once a photo is clicked, we figure out which photos are immediately viewable on the page. We load those into a "zoom div" and then transform zoom that div.

As we navigate around the zoomed grid, we add and pop photos accordingly so we will not run out of photos to display.

If a user clicks outside of the "zoom div", or pushes the "close button", or pushes escape on their keyboard, we leave the zoom state, and unload the "zoom div"

It's important to have as few elements in the zoom div as possible for speed issues.

The iOS devices need to be detected
Hovers have to be removed (to prevent an extra click)
Animations have to stop (since they don't have the processing power in the browser likely).
Other changes required to work properly on iOS devices

Currently destroys the browser; handle correctly:
upload size limits
gracefully handling many large-ish files
progress bars

http://sjl.bitbucket.org/flask-csrf/

And/or we need to detect better orientations so we can rotate images automatically.

The photo grid renders differently according to different contexts; a refresh always reduces the context to a known state (whereas a single call to the render function should always reduce the photogrid to a known state)

make grid rendering stateless.

Extend the UI near the share area to include a Download All button.

corner-cases:
wide image touching the border (should not extend beyond grid boundary)
image shorter than 175 pixels (should be centered)

additionally: some cases where small movements are uselss but distracting; instead, fix tolerances for neighboring images (i.e. beyond some threshold we should display the entire image, and instead crop more of the neighboring image: perhaps beyond 90% or similar?)

even more important then the Android app.

For some stupid reason, the iPad and iPhone don't understand fixed position and let me block the scroll.

We first pull up to 100 images for the memory. We initially only pull the dimension data and add them to the page.

Based upon where the viewport is placed, we pull the "thumb_url"s for the immediately visible and adjacent photos and add in the tags for those photos.

If more than 100 photos, we add a "Load more memories" button at the scroll bottom that repeats the procedure for another 100 or so photos.

Implement pretty urls (i.e. stop exposing DB ID)

http://celeryq.org/docs/

On hover, horizontally expand the view area for each photo so users can see the whole thing.

Since we are currently relying on natural floats to position the elements, constantly changing the size of the containing box is becoming impractical.

The PhotoHFit function has to build all of the photos into individual "row divs" that we can more reliably control the expansion and contraction of, even when it expands beyond the current margins.

When zoomed in, we have to progressively load the high-res version of the images and properly overlay them.

Ensure constant width (if given enough photos), otherwise the grid always - looks bizarre when multiple rows, and top rows are not aligned.

Possible features:
Users can select photos on the canvas to sync with a Facebook album
Users can only show starred
in large streams, truncate non-starred/low-votes etc.

Anything above this line is an extreme emergency & must be fixed NOW.

Wide images will currently break the zoom.
Non 955px wide widths will also cause occasional hiccups in the zoom

Server needs to pull out the image dimensions and store them.
Need to add:
"height"
"width"
"size" (in bytes)

The add more photos dialogue is currently inconsistent:
- mouseover on the whole box highlights the box, which suggests clicking the box is an action
- clicking the box is not an action (but should be? make this clearer)
- only clicking the top shaded part is an action

resolve this conflict

create user state object.

Attend to
- layout
- visual halfspace balance
- noise reduction
- better graphics (buttons / icons etc.)
- colourscheme

1st order, once we detect new photos we have a message at the scroll top that says something like " new memories. Click to view"

2nd order we automatically load and add new memories if the scroll top is visible, otherwise we generate the "new memories" message.

3rd order we detect the incoming stream velocity and only automatically load near the top if it is at a reasonable speed. In all other cases we use the "new memories" message.

Anyone can create memories right now; restrict to Olin + MIT.

Solve the idiomatic 'share this memory' problem.

This will help users know they can click the images and that action will zoom them in
It will also help let them know they can pan.

Fix the login form, and make it generic.

Hidden state is currently inconsistent / unintuitive
hiding new photos with 'show hidden' enabled causes photos to disappear (inconsistent representation of state?)
hiding new photos should be greyed out (give the user a chance to revert change)
there should never be a state where (some) hidden are shown and (some) hidden are not shown.

OMG IE

Need to implement the jQuery File Upload cancel options and build buttons for it.

So important it's an issue for the web app.