Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 19.04.2011, 00:56
Профессор
Отправить личное сообщение для FRIE Посмотреть профиль Найти все сообщения от FRIE
 
Регистрация: 25.02.2010
Сообщений: 218

Ресайз картинки на лету
После того как пользователь выбрал у себя картинку на компе, в отдельном блоке с id=’image2’ должна появиться эта картинка с измененным размером. Изменение размера картинки по тому же принципу что и в коде php. Тоесть сама маленькая картинка на сервер не полетит, а она необходима для того чтобы пользователь представлял как в итоге будет выглядеть изборажение.
Тоесть что бы в браузере был сделан ресайз точно так же как сделается на сервере.

Вот код php который получает картинку и кладет ее на сервер + делает миниатюру и дает ей название.
Вот как он делает миниатюру, точно так же нужно сделать в браузере, и просто вывести ее в div id=’image2’.

<?php
session_start();
//функция ресайза
function image_resize($src, $dest, $width, $height, $rgb=0x000000, $quality=100) {
 if (!file_exists($src)) return false;
 $size = getimagesize($src);
 if ($size === false) return false;
 if ($width=='0' &&  $height=='0') return false;
 $format = strtolower(substr($size['mime'], strpos($size['mime'], '/')+1));
 $icfunc = 'imagecreatefrom'.$format;
 $icfunc2 = 'image'.$format;
 if (!function_exists($icfunc)) return false;
 if (!function_exists($icfunc2)) return false;
 $isrc = $icfunc($src);
 if ($height=='0') {
 $height = floor( $width * ( $size[1] / $size[0] ) );
 $idest = imagecreatetruecolor($width, $height);
 imagecopyresampled($idest, $isrc, 0, 0, 0, 0, $width, $height, $size[0], $size[1]);
 if ($format=='jpeg') $icfunc2($idest, $dest, $quality);
 else $icfunc2($idest, $dest);
 }
 elseif ($width=='0') {
 $width = floor( $height * ( $size[0] / $size[1] ) );
 $idest = imagecreatetruecolor($width, $height);
 imagecopyresampled($idest, $isrc, 0, 0, 0, 0, $width, $height, $size[0], $size[1]);
 if ($format=='jpeg') $icfunc2($idest, $dest, $quality);
 else $icfunc2($idest, $dest);
 }
 else {
 $idest = imagecreatetruecolor($width, $height);
 imagefill($idest, 0, 0, $rgb);
 if ($size[0]<$width && $size[1]<$height) {
 $new_left = floor(($width - $size[0]) / 2);
 $new_top  = floor(($height - $size[1]) / 2);
 imagecopy($idest, $isrc, $new_left, $new_top, 0, 0, $width, $height);
 if ($format=='jpeg') $icfunc2($idest, $dest, $quality);
 else $icfunc2($idest, $dest);
 }
 elseif ($size[0]<$width && $size[1]>$height) {
 $new_left = floor(($width - $size[0]) / 2);
 $new_top  = floor(($size[1] - $height) / 2);
 imagecopy($idest, $isrc, $new_left, 0, 0, $new_top, $width, $height);
 if ($format=='jpeg') $icfunc2($idest, $dest, $quality);
 else $icfunc2($idest, $dest);
 }
 elseif ($size[0]>$width && $size[1]<$height) {
 $new_left = floor(($size[0] - $width) / 2);
 $new_top  = floor(($height - $size[1]) / 2);
 imagecopy($idest, $isrc, 0, $new_top, $new_left, 0, $width, $height);
 if ($format=='jpeg') $icfunc2($idest, $dest, $quality);
 else $icfunc2($idest, $dest);
 }
 else {
 $new_width = $width;
 $new_height = floor( $size[1] * ( $new_width / $size[0] ) );
 $new_left = '0';
 $new_top  = floor(($new_height - $height) / 2);
 if ($new_height<$height) {
 $new_height=$height;
 $new_width = floor($size[0] * ($new_height / $size[1]) );
 $new_left = floor(($new_width - $width) / 2);
 $new_top = '0';
 }
 $idest2 = imagecreatetruecolor($new_width, $new_height);
 imagecopyresampled($idest2, $isrc, 0, 0, 0, 0, $new_width, $new_height, $size[0], $size[1]);
 imagecopy($idest, $idest2, 0, 0, $new_left, $new_top, $width, $height);
 if ($format=='jpeg') $icfunc2($idest, $dest, $quality);
 else $icfunc2($idest, $dest);
 imagedestroy($idest2);
 }
 imagedestroy($isrc);
 imagedestroy($idest);
 }
 return true;
}
//тут работаем с картинкой и применяем к ней функцию
if (isset($_FILES['file'])) {
	
 $url_name_gal = '../tov-img/'; //имя папки, в которую будем сохранять файлы
 $imgs_width_gal = '800'; //максимальная ширина картинки
 $thumb_width_gal = '336'; //ширина для миниатюры
 $thumb_height_gal = '138'; //высота для миниатюры
 ini_set('memory_limit', '2M'); //увеличиваем размер оперативки для  работы с изображениями, а то крупных картинок не загрузишь
 $file = $_FILES['file']['tmp_name'];
 $filename = $_FILES['file']['name'];
 $size = getimagesize($_FILES['file']['tmp_name']); //получаем массив значений размеров картинкии  её расширения
 $mime = strtolower(substr($size['mime'], strpos($size['mime'], '/')+1)); //узнаём mime-тип изображений
 if ($mime=='jpeg') $format = 'jpg'; else $format = $mime; //если mime jpeg, то он будет записан как файл .jpg
 $new_filename = 'image'.time().'.'.$format; //генерируем новое имя файла
 copy($file, $url_name_gal.'/'.$new_filename); //копируем файл 
 //если ширина картинки превышает максимальную, то уменьшаем картинку до допустимого максимума и сохраняем. 
 if ($size['0']>$imgs_width_gal) { 
 if (image_resize($url_name_gal.'/'.$new_filename, $url_name_gal.'/'.$new_filename, $imgs_width_gal, '0'))
 echo 'Изображение было уменьшено до указанной ширины в '.$imgs_width_gal.'px. <br>';
 }
 //создаём миниатюру для загруженной картинки
 if (image_resize($url_name_gal.'/'.$new_filename,  $url_name_gal.'small'.$new_filename, $thumb_width_gal,  $thumb_height_gal)) echo 'Создание миниатюры произведено успешно';
 else echo 'Миниатюра создана не была.';
}


Сделать можно либо стандартным кроссбраузерным яваскриптом либо с использованием jquery.

из кода php ничего не выкидывал, выложил как он есть на серваке

кто за это сколько возьмет пишите обсудим
Ответить с цитированием
  #2 (permalink)  
Старый 19.04.2011, 03:09
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 04.04.2008
Сообщений: 6,246

сколько платите?
Ответить с цитированием
  #3 (permalink)  
Старый 20.04.2011, 10:30
Профессор
Отправить личное сообщение для FRIE Посмотреть профиль Найти все сообщения от FRIE
 
Регистрация: 25.02.2010
Сообщений: 218

хороший вопрос, я сам не знаю на сколько это сложно будет сделать, ну допустим 200 рублей
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как проиндексировать картинки HTML код которых генерируется на JS greatilya Оффтопик 9 22.09.2010 07:42
скрол мышкой картинки внутри слоя snk Элементы интерфейса 7 07.09.2010 18:22
Динамическое изменение размеров фоновой картинки ячейки shaitan Элементы интерфейса 4 15.04.2010 13:30
Получение координат от картинки EmDmAl Events/DOM/Window 4 08.11.2009 14:34
Как изменить размер картинки? Mihail Общие вопросы Javascript 1 25.10.2009 13:42