Image editor widget

I need a dhtml image "editor" widget. Basically I want to be able to crop and resize an image. The actual croping and resizing will be handled in php on the server but the interface will be on the web browser. I have attached a mock up of the interface. I would like for the part of the image that is outside of the target box to have a "transparency" look about it. If you are going to use a javascript library it must be the dojo toolkit http://dojotoolkit.org. I will handle any server side operations.


*Launching Widget*

The target size (the red box) is set on startup of the widget. This is a variable size.

The image useage (article, slideshow, etc) is set on start up

An image url can be passed in to display on start up.



Makes a call to server using XMLHTTPTransport (preferably using the dojo toolkit) and recive back in an XML or JSON format a list of image id, thumbnails and names for the images available to edit. The call to the server should be [url removed, login to view];action=getList&usage=article or [url removed, login to view];action=getList&usage=slideshow with the file to be called being the return data type ([url removed, login to view] or [url removed, login to view]) and the useage being the usage type set on start up. No usage is also valid.

When the user selects an image from the list another call back to the server is made to get the location of the actual image to locate. The call is [url removed, login to view];action=getEditLocation&image_id=xxxxxxx


This makes a call to the server with the information about the image based on the users selections. The call is [url removed, login to view];action=storeImage&image_id=xxxxxx&starting_x=xx&starting_y =xxx&scaled_width=xxx&scaled_height=xxx&target_width=xxx&target_height=xxx

the starting_x and starting_y is the offset to the starting position of the *scaled* image. the scaled_width and scaled_height are the size the image is displaying on the screen and the target_width and target_height are the sizes set on startup. The url of the new image is passed back and should be loaded into the target box.


track the size and position of the image after each update and allow the user to go back, this information is kept, even after the image save. It is removed if a new image is loaded.


redo for the undo

*Zoom in**Zoom Out*

Change the scale of the image. This can be accomplished by simply changing the x and y size of the image from javascript


Allow the position of the picture to be moved. Change the cursor to the 4 way arrow for this. It is only active inside of the target box.

The code is going to be used in an open source project and I retain the rights to the code. You can use it for future projects as it will be released with a BSD or AFL license.

Evner: Javascript

Se mere: javascript image editor dojo, call image editor javascript, javascript widget editor image, widget image editor, image editor widgets, dojo image editor, startup toolkit, php code editor, need and editor, mock data, library part, javascript code library, i want an editor, inside track, i need a type editor, get location javascript, editor position, editor need, dojo widget list, dojo widget

Om arbejdsgiveren:
( 1 bedømmelse ) Asheville, United States

Projekt ID: #74884

Tildelt til:


My price for this project is 140$ ... Please see my PM...

$100 USD in 6 dage
(21 bedømmelser)

4 freelancere byder i gennemsnit $95 på dette job


Very small budget for that project

$100 USD in 10 dage
(5 bedømmelser)

please see pmb for more details thanks.

$80 USD på 1 dag
(1 bedømmelse)

We at Varshyl Tech - an ITES helps businesses in their software, database design, website development and other related vertical needs with primary focus on Website Design and Development, Application Development, Cust Flere

$100 USD in 6 dage
(0 bedømmelser)