Chciałbym, żebyście ocenili skrypt kadrowania zdjęć. Jego zasada działania jest troszkę inna niż większości, dlatego liczę na oceny i ewentualną krytykę. Kod może zawierać masę błędów - starałem się przetestować go jak najlepiej, ale zdaję sobie sprawę, że może się jakieś znajdą.

http://requtize.github.io/cropimg/

Niewygodny i nieintuicyjny.
Czemu nie zrobisz tego tak jak wszędzie (facebook,nk, gdziekolwiek widziałem w sieci)?
Znaczy pokazujesz całe zdjęcie i przeciągasz rogi zaznaczenia które zostanie. Reszta jest zaciemniona.

Właśnie dla tego, że wszedzie jest tak samo. Zauważ, że we wszystkich tych skryptach nie możesz wykadrować zdjęcia tak jak sobie chcesz - tzn. kadrujesz tylko kawałek, który bezwzględnie znajduje się na zdjęciu. Dzięki temu skruptowi, możesz wykadrować obrazek w praktycznie każdym wymiarze, jaki chcesz i praktycznie tak jak chces - nie ogranicza Cię tutaj KONIEC obrazka tak jak w innych skryptach tego typu.

No ok, a czym jest wypełniany pozostały obszar obrazka jeżeli go przesunę poza krawędź? Jako "przycisków" do przybliżenia czy oddalenia użyj linka albo butona, bezsensu jest to dawać w divie, bo klikając zaznacza nam się cały obszar obrazka. Tak samo nie wiem jaki cel miało obramowanie które sugeruje że mogę dostosować obszar wycięcia, czego uczynić nie mogę.

No, dobra, ale jak zapisać wykadrowany obrazek (albo wysłać na serwer)?

@by_ikar - Plugin nie definiuje czym jest wypełniany pozostały obszar - to czy to będzie przeźroczyste tło, czy wypełniony kolorek obszar o wykadrowaniu pozostawiam programiście już na poziomie kadrowania w PHP. Fakt, z tymi buttonami masz rację, zamienię elementy. Jeśli chodzi o obramowanie, to chciałem dać użytkownikowi informację, gdzie się kończy obszar kadrowania. Jedyne na co wpadłem to to obramowanie - może masz jakiś inny pomysł?

@PrinceOfPersia - Niestety na stronach GitHub nie można umieszczać skryptów PHP więc nie ma tam przycisku "Wykadruj". Plugin działa na takiej zasadzie, że oblicza pozycję zdjęcia względem kadrowanego obszaru i wrzuca do inputów o danych ID wartości pozycji X, Y, wysokości oraz szerokości kadrowanego obszaru. W tedy można te wartości wysłąć formularzem lub AJAX i z poziomu skryptu PHP wykadrować obrazek.

właściwie da się to zrobić już na poziomie przeglądarki w JS:
- tworzysz Canvas (może być niewidoczny)
- jak użytkownik kliknie "wykadruj" rysujesz na Canvasie wykadrowany obrazek
- potem pobierasz z Canvasa dane przez toDataURL, i wrzucasz do obiektu image: image.src = canvas.toDataURL()
- użytkownik potem klika "zapisz jako"

przy większych obrazkach z tego co pamiętam, mogą występować jakieś problemy (ograniczenia przeglądarek co do długości dataURLów), ale przy mniejszych jest okej.

http://www.html5canvastutorials.com/tutori...vas-image-crop/

EDIT: aha, tylko, że mogą sie pojawić problemy, jeśli obrazek będzie w innej domenie niż strona. Przy uploadzie na serwer, nie byłoby to problemem, ale URLe z internetu mogą być problemem (same domain policy).
Ale można zrobić ładowanie obrazka poprzez <input type="file"> + FileReader, czyli taki pseudo-upload (pseudo, bo upload do przeglądarki, a nie na serwer) : https://developer.mozilla.org/en-US/docs/Us...eb_applications
To powinno działać, bo kiedyś na podobnej zasadzie zrobiłem puzzle na canvasie (można było właśny obrazek "wgrać", z tym, że wszystko było bez użycia kodu serwerowego)

@PrinceOfPersia - Dziękuję za rady, na pewno coś pomyślę w tym kierunku. Na chwilę obecną chcę dopracować działanie tego skryptu.

Popracowałem trochę nad nim i zmieniłem wygląd oraz minimalnie działanie:

- przyciski podmieniłem (wygląd) i zmieniłem ich położenie.
- zmieniłem element DIV na A w buttonach (@by_ikar)
- dodałem Tooltipy do przycisków - po najechaniu pokazuje się info co sie pod nim znajduje (do wyłączenia w opcjach pluginu).
- dodałem możliwość przybliżania i oddalania za pomocą kółka myszki (pomoc to biblioteka mousewheel.jquery.js)
- zmieniłem troszkę wygląd kontenera - zamieniłem border dotted na solid, oraz dodałem tło pod obrazkiem tak, by było wiadomo, że pod nic nic się nie pojawi (planuję dodać w przyszłości możliwość wyboru, już bezpośrednio w pluginie, jakie ma być tło pod obraziem).

Prosze o ocenę, uwagi, co jest poprawione na lepiej a co na gorzej. Poprawiona tylko strona główna oraz skrypt, dokumentacja nadal stara.

http://requtize.github.io/cropimg/