Jquery development (Image drag/drop + zoom + postback)

IN PROGRESS
Bids
7
Avg Bid (USD)
$146
Project Budget (USD)
$30 - $250

Project Description:
For my current project I need help with developing a Jquery javacsript that can do the following below.
First, some background.

I have a games product catalog that have boxshots (cover image) and optional 0-4 screenshots. From a different system we receive updated images. I am trying to develop a webpage that will allow the user to map/connect new images to existing products.


So we have two kinds of images,

1. Box Shots ,
2. 2 Screenshots

And they should not be mixed.

One product on the left can have (0 or 1) boxshot and (0-4) screenshots.

The system should allow the user to do the following:

1. Drag & Drop screenshots images from the right columns to any product on the left side.
Only dropping on the left side where the number of screenshots for a given product is
less than four..
2. Drag & Drop boxshot images from the right columns to any product on the left side.
(where there are not existing boxshot).

3. When clicking on any of the images on the left or right side, the image should expand
as shown in the attached ExampleImage2.jpg. When clicked again the image should reduce
back to normal size.

DragDrop Rules:

After a drag/drop the dropped image should be added to the left column , perhaps with a border around it showing that it is a change/newly dropped image.

When I press a “Save” button a list of “drag&dropped” images can be sent back to the server together with the product-numbers.

No deleting of image can be done in this app to keep it simple. Screenshot Images can also not be replaced, only “added”.

A sample page screenshot is attached with this project. A real HTML page with sample images will be provided to the winner.

Your task is the following:

1. Develop the jquery script necessary to handle the drag/drop + image zoom. (perhaps using some Jquery plugin.). When doing the drag/drop the image should not zoom.

2. Add a “Save” Button to the image and create a script that when I press the save button it should send a list of dragged/dropped images back to the server for processing.

The Server side part I will handle myself.

Skills required:
Javascript
Additional Files: ExampleImage.jpg ExampleImage2.jpg
Hire synchron
Project posted by:
synchron Sweden
Verified
Public Clarification Board
Bids are hidden by the project creator. Log in as the employer to view bids or to bid on this project.
You will not be able to bid on this project if you are not qualified in one of the job categories. To see your qualifications click here.


$ 95
in 3 days
Hire ajaxdevman
$ 250
in 5 days
Hire charlietfl
$ 175
in 3 days
Hire topOneLancer
$ 150
in 2 days
Hire mantislin
$ 150
in 3 days
Hire DesignSolutionSW
$ 100
in 3 days
Hire grem11n
$ 100
in 5 days