Käynnissä

Simple Image Manipulation HTML 5 tool

I need a tool in HTML 5 (which will work in a web browser) that does the following.

Here is a rough sketch what it'll have: [url removed, login to view]

1) Area where you drag the image

You drag a picture from your computer or directly from a browser (it should work with IE, Firefox and Chrome) into that area.

The picture shows up in it centered horizontally and vertically (but it's still not uploaded anywhere, it just shows up in the area 100% the original size it is).

The area is restricted in size of 568px x 416px. If the dragged image is bigger - the area shows upto it's size - the rest is not visible.

The user should be able to move around the image in the area by dragging it with the mouse or with the arrow keys on the keyboard (so they can pick another part of the image to be visible).

The user should also be able to scale up and down the image by holding the shift button and click-dragging the mouse over the picture.

2) 50% Preview area- basically this area mirrors 1:1 the first area, but is scaled down 50%

3) buttons. All of them do something on the image in area 1, where we drag/dropped it:

- Best fit - scales the image so it fills up both width and height of the area (but keeps it in the same aspect ratio)

- Fit Width - scales the image so it'll fill the area horizontally

- Fit Height - scales the image so it'll fill the area vertcically

- Center Horizontal - centers the image horizontally (but doesn't shift it up or down vertically)

- Center Vertical - centers the image vertically (but doesn't shift it left or right horizontally)

- button upload - saves (uploads) the visible image in Area1 through POST

I don't need it pretty. If it looks like the sketch I showed - it's fine.

Taidot: AJAX, HTML, HTML5

Näytä lisää: pick part, html browser, html header image width, html resize image width, upload image tool html

About the Employer:
( 1 review ) Sofia, Bulgaria

Projektin tunnus: #8660560

5 freelanceria on tarjonnut keskimäärin 48 $ tähän työhön

websoftseo

Hello Dear!, I am really interested to work on this project, i am sure do quality work. I can start the work now , and can provide the best services from my end. Please come on chat to discuss more about the project Lisää

60 $ USD 1 päivässä
(26 arvostelua)
4.8
gcStudioOrg

Hello, i have done a few familiar tools like this some time ago, reference URLs: http://www.giftofspeed.com/sprite-generator/ & http://www.giftofspeed.com/png-compressor/ for the uploading & re-sizing process, you Lisää

55 $ USD 2 päivässä
(16 arvostelua)
4.5
pmishra1991

I am confident that I can bring the same level of high standards to your company. Aside from my technical competencies, I am a solid team player who can not only work to tight deadlines, but also has plenty of initiati Lisää

45 $ USD 1 päivässä
(4 arvostelua)
2.1
hariharasudann

I am a software developer working in a corporate company. I have good experience in this field and will deliver the application within time. Please consider my proposal and give me a chance to prove it Thanks

45 $ USD 1 päivässä
(0 arvostelua)
0.0
saremiftikhar

A proposal has not yet been provided

40 $ USD 2 päivässä
(0 arvostelua)
0.0
haitechnologiess

Hi, I can do this for you. Please tell me when would you like to start...! I have proven track record of more than 12+ years of Web Applications Development, with sound knowledge of working on a diverse range of Lisää

55 $ USD 3 päivässä
(0 arvostelua)
0.0