We need a implementation of a customer facing Web-Application for



1. uploading a JPEG image of several MB

2. fitting the image within a hardcoded shape/mask

3. allowing the user to interactively position the image within the shape allowing him to scale, move and rotate the image.

4. generating the resutling images (JPEG) and storing the transformations applied (text).

5. No focus on HTML/CSS, just a white label interface.



We want customers to be able to upload image an image and to position them on objects (Skateboards, Skate Wheels, T-Shirts). Unlike other printing companies we do full body printing. Therefor the upload tool needs to know the shape of the object (delivered as an image mask to the application) and has to allow the user to position the uploaded image within the mask. It also has to allow the user to rotate and zoom the uploaded image.



See http://s.hdimg.net/rapael_test/rapael.html for an example for possible placement technology.



Implementation environment:



* We need a prototype implementation only

* Server Side code must be done in Python, preferably Django 1.0.x

* Client Side code must be done in jQuery 1.3.x and/or http://raphaeljs.com/

* Code must be compatible with IE »= 6.0, Firefox »= 2.0, most recent Cromium, Opera and Safari.

* Python Code must follow http://blogs.23.nu/c0re/2007/06/antville-15208/ except that no unittests are required.



Deliverables:



* Django based application handling the backend processing

* Including a requiremets.txt file which can be used with the pip utitity to install all dependencies

* HTML pages contianing the needed Javascript code.

* Two alternate example image masks, e.G. circle and triangle. Alternatively you can use the image used in http://s.hdimg.net/rapael_test/rapael.html

* Ability to upload an image, position it in the mask using Mouse drag AND buttons, zoom/unzoom using buttons, rotate using buttons.

* Ability to save the applied transformation (e.g. "move 10,34; scale 0.78; rotate 90") and generate an composite image as displayed in the browser on the server side.