Cancelado

Java Script Image crop with form submit

Need a java script crop function written which will be used with a web form, this must be written from scratch, no external libraries or code allowed. Javascript code must be fully documented in english and validated, no Javascript errors should show up in Firefox in strict mode. Must give demo of html page with java script include which prints selection cordinates on form submit.

Must work on Internet Explorer, Firefox(Windows / Mac OSX, Linux++), Safari, + other browsers.

Input option Aspect ratio:

* Free Aspect ratio, Any Width / Height selected (smaller than image size).

* Locked Aspect Ratio on width/height (Example Width must always be equal to height) with variable to for example 4x3 where width is 40px and height must be 30px can be scaled to .

Example image attached has Locked Aspect ratio.

Input option Selection X1,Y1, X2,Y2

What the selection cordinates should be when started.

Input option Scale:

If No, then the Selection can not be enlarged, example 100x100px will always stay this way. (disable vertical/horizontal bar and diagonal bar, click outside box to enlarge). Moving it is the only option.

Input option Minimum Size Xmin,Ymin

Selection can not be smaller than minimum size.

if zero, not in use.

Input Option Max Size Xmax,Ymax

selection can not be larger than XS,YS.

if zero not in use.

Few rules:

* unselected area must be transparently greyed out, if the browser doesnt support this, its not in use. (meaning just black border for selection)

* click on any of grey area selection area will move/expand/zoom to it if possible (must keep aspect ratio if restricted).

* Selection must not be larger than image.

* Diagonal bar will show when you're in the 5x5px corner of selection which enables scaling of the selction box which has to keep aspect ratio if aspect ratio is restricted.

* Black 1px border around selection.

* 3px from any border in center of selection a move cursor will show, where you can move the entire selection around. Must not be able to move outside image frame.

* no flickering while moving selection.

* Constantly update hidden cordinate variables

* External Reset button, move Selection back to what it was initially.

* make sure all function input options correctly interact with each others.

Hidden Form Variables in script:

Image[X1], Image[Y1] (Top left pixel cordinates for selection)

Image[X2], Image[Y2] (Bottom right pixel cordinates for selection)

Please give PM with links to any previous javascript code you have done. Any generic PM's will be ignored.

If anything is unclear please PM me before quoting.

Habilidades: Javascript, Design de Sites

Ver mais: form image crop, crop image diagonal javascript, x2 design, website design mac free, vertical web page design, top minimum, pm image, image free design web, free website submit, free design prints, code website design java, function diagonal code javascript, javascript image selection, update java firefox, javascript max, pixel web design, page border design, image design free, free web design image, free image design, design page border, ys, update java code, script linux, restricted

Acerca do Empregador:
( 0 comentários ) Beverly, United States

ID do Projeto: #137192