Фотоавтомат на PHP, jQuery и CSS3

В данном уроке мы построим фотокиоск с использованием jQuery и PHP. Такое приложение позволит посетителям вашего веб сайта делать снимки веб камерой и загружать их, используя приятный интерфейс на CSS3.

Как известно, нельзя получить доступ к веб камере или другому периферийному устройству непосредственно из JavaScript. Однако есть решение для такой задачи – можно использовать FLASH. FLASH имеет отличную поддержку веб камер, и он установлен практически на каждом подключенном к интернету компьютере.

В качестве решения мы будем использовать приложение webcam.js. Это обертка из JavaScript вокруг API FLASH, который обеспечивает управление пользовательской веб камерой.

demosourse

 

HTML

Первым шагом надо построить наш фотокиоск в качестве структуры HTML основной страницы. Мы будем использовать jQuery для получения списка всех последних фотографий, поэтому нет необходимости встраивать какую-либо логику PHP здесь. Значит, мы можем оставить нашу страницу простым файлом HTML.

index.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Фотокиоск на PHP, jQuery и CSS3 | Демонстрация для сайта RUSELLER.COM</title>

<link rel="stylesheet" type="text/css" href="assets/css/styles.css" />
<link rel="stylesheet" type="text/css" href="assets/fancybox/jquery.fancybox-1.3.4.css" />

</head>
<body>

<div id="topBar">
    <h1>Фотокиоск jQuery и CSS3</h1>
</div>

<div id="photos"></div>

<div id="camera">
	<span class="tooltip"></span>
	<span class="camTop"></span>
    
    <div id="screen"></div>
    <div id="buttons">
    	<div class="buttonPane">
        	<a id="shootButton" href="" class="blueButton">Снимаю!</a>
        </div>
        <div class="buttonPane hidden">
        	<a id="cancelButton" href="" class="blueButton">Отменить</a> <a id="uploadButton" href="" class="greenButton">Загрузить!</a>
        </div>
    </div>
    
    <span class="settings"></span>
</div>


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script src="assets/fancybox/jquery.easing-1.3.pack.js"></script>
<script src="assets/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<script src="assets/webcam/webcam.js"></script>
<script src="assets/js/script.js"></script>

</body>
</html>

На странице имеется три основных элемента div:

  • #topBar - выводит заголовки;
  • #photos - здесь вставляются изображения, после того, как они будут получены методом jQuery $.getJSON;
  • #camera содержит webcam.swf (который используется для связи с веб камерой). Также данный элемент содержит управляющие кнопки для запуска фотографирования и загрузки изображения.

Управляющие кнопки разделены на два элемента div .buttonPane. В части уроки, посвященной jQuery мы сделаем простую функцию для переключения между панелями.

Внизу документа мы включаем набор JavaScript файлов. Начиная с библиотеки jQuery, затем добавляем плагин  fancybox для вывода фотографий, плагин easing (чтобы сделать fancybox более приятным), плагин webcam.js (для взаимодействия с веб камерой через FLASH) и наш файл script.js, который связывает все в единую систему.

Если вы планируете, что на ваш сайт будет подвергаться высоким нагрузкам, может быть имеет смысл скомбинировать все файлы JavaScript в один. Это сделает загрузку страницы немного быстрее, так как JavaScript блокирует страницу пока не загрузится.

Фотокиоск

 

PHP

Хотя основная страница является простым HTML кодом, нам потребуется PHP, чтобы построить наше приложение. Если быть более точным, то PHP потребуется для обеспечения двух функций – получения изображения из FLASH (в сочетании с загрузкой картинки на сервер), и для формирования списка загруженных файлов.

upload.php

<?php

/*
	Данный скрипт получает снимок JPEG
	из webcam.swf как запрос POST.
*/

// Нам нужно обрабатывать только запрос POST:
if(strtolower($_SERVER['REQUEST_METHOD']) != 'post'){
	exit;
}

$folder = 'uploads/';
$filename = md5($_SERVER['REMOTE_ADDR'].rand()).'.jpg';

$original = $folder.$filename;

// Снимок JPEG отправляется в необработанном виде:
$input = file_get_contents('php://input');

if(md5($input) == '7d4df9cc423720b7f1f3d672b89362be'){
	// Черное изображение. Нам оно без надобности.
	exit;
}

$result = file_put_contents($original, $input);
if (!$result) {
	echo '{
		"error"		: 1,
		"message"	: "Ошибка сохранения изображения. Убедитесь, что папка uploads и ее вложенные каталоги имеет chmod 777."
	}';
	exit;
}

$info = getimagesize($original);
if($info['mime'] != 'image/jpeg'){
	unlink($original);
	exit;
}

// Перемещаем временный файл в оригинальную папку:
rename($original,'uploads/original/'.$filename);
$original = 'uploads/original/'.$filename;

// Используем библиотеку GD для изменения размера
// для миниатюры:

$origImage	= imagecreatefromjpeg($original);
$newImage	= imagecreatetruecolor(154,110);
imagecopyresampled($newImage,$origImage,0,0,0,0,154,110,520,370); 

imagejpeg($newImage,'uploads/thumbs/'.$filename);

echo '{"status":1,"message":"Success!","filename":"'.$filename.'"}';
?>

Как уже упоминалось выше, мы не можем напрямую связываться с веб камерой из JavaScript. Поэтому нам нужен FLASH, который имеет отличную поддержку веб камеры, чтобы быть промежуточным слоем. Таким образом, у нас есть выбор из двух альтернатив:

  • мы можем экспортировать снимок из FLASH и сделать его доступным для JavaScript (медленно и неэффективно);
  • заставить FLASH загружать фотографию прямо в скрипт PHP.

Плагин webcam использует второй подход. Также у него есть приятная особенность - загрузка снимка в виде корректного JPEG изображения. Нам остается только сохранить его в файл без возни с конвертацией.

В файле upload.php мы проверяем, что полученные данные являются изображением JPEG, сохраняем их в файл в папке uploads/original/, и генерируем миниатюру  154х110 px. Размер миниатюры выбран из соображений удобства, так как сохраняется соотношение сторон оригинальной картинки (520х370 px), что делает изменение размера более простым.

Загрузка изображения

 

browse.php

<?php

/*
	Данный код сканирует папку с изображениями и возвращает объект JSON 
	с именами файлов. Он используется в jQuery для вывода изображений 
	на главной странице:
*/

// Стандартный заголовок данных JSON:
header('Content-type: application/json');

$perPage = 24;

// Сканируем папку миниатюр:
$g = glob('uploads/thumbs/*.jpg');

if(!$g){
	$g = array();
}

$names = array();
$modified = array();

// Цикл по всем именам файлов, возвращенных функцией glob.
// Второй файл заполняется временем снимка.

for($i=0,$z=count($g);$i<$z;$i++){
	$path = explode('/',$g[$i]);
	$names[$i] = array_pop($path);
	
	$modified[$i] = filemtime($g[$i]);
}

// Сортировка массива с именами
// в соответствии с временем снимка, сохраненным в $modified:

array_multisort($modified,SORT_DESC,$names);

$start = 0;

// browse.php также генерирует страницы результатов с опциональным параметром
// GET с указанием имени файла, с которого начинается список страницы:

if(isset($_GET['start']) && strlen($_GET['start'])>1){
	$start = array_search($_GET['start'],$names);
	
	if($start === false){
		// Такого изображения нет
		$start = 0;
	}
}

// nextStart возвращает имя следующего файла.
// Таким образом, скрипт может передать их как параметр $_GET['start'],
// если нажата кнопка "Загрузить еще"

$nextStart = '';

if (count($names)>$start+$perPage){

	if($names[$start+$perPage]){
		$nextStart = $names[$start+$perPage];
	}

	$names = array_slice($names,$start,$perPage);
}

// Форматируем и возвращаем объект JSON:

echo json_encode(array(
	'files' => $names,
	'nextStart'	=> $nextStart
));

?>

Файл browse.php формирует список файлов изображений, содержащихся в папках, в виде объекта JSON. Задача решается с помощью функции PHP glob, которая сканирует папку и возвращает массив имен файлов. Затем мы сортируем массив в соответствии с датой загрузки фотографии с помощью функции array_multisort, и обрезаем массив до 24 фотографий с помощью функции array_slice (организуем постраничный вывод галереи).

 

jQuery

Как уже упоминалось ранее, мы используем плагин webcam.js для управления веб камерой. Данный плагин имеет простой API, доступный через объект с именем  webcam. Он дает нам методы для получения и загрузки фотографий и для генерации необходимого кода для встраивания swf файла.

В скрипте script.js мы используем данный API и строим наш код вокруг него. Сначала определяем несколько переменных и кэшируем селекторы jQuery для улучшения производительности:

assets/js/script.js – Часть 1

$(document).ready(function(){
	
	var camera = $('#camera'),
	    photos = $('#photos'),
	    screen =  $('#screen');

	var template = '<a href="uploads/original/{src}" rel="cam" '
		+'style="background-image:url(uploads/thumbs/{src})"></a>';

	/*----------------------------------
		Установки веб камеры
	----------------------------------*/


	webcam.set_swf_url('assets/webcam/webcam.swf');
	webcam.set_api_url('upload.php');		// Скрипт загрузки
	webcam.set_quality(80);				// Качество фотографий JPEG
	webcam.set_shutter_sound(true, 'assets/webcam/shutter.mp3');

	// Генерируем код HTML для камеры и добавляем его на страницу:	
	screen.html(
		webcam.get_html(screen.width(), screen.height())
	);

Переменная template содержит разметку, которая генерируется для каждой фотографии. Это ссылка, которая имеет миниатюру в качестве фона и указывает на полноразмерное изображение. Атрибут {src} заменяется действительным именем фотографии (имена файлов генерируются автоматически в скрипте upload.php).

Далее нужно привязать обработчики событий для управляющих кнопок. Обратите внимание на использование методов webcam.freeze() и webcam.upload(). Таким образом реализуется возможность сделать снимок и определить, нужно ли его загружать. А метод webcam.reset() подготавливает веб камеру для следующего снимка.

assets/js/script.js – Часть 2

	/*------------------------------
		Обработчики событий
	-------------------------------*/


	var shootEnabled = false;
		
	$('#shootButton').click(function(){
		
		if(!shootEnabled){
			return false;
		}
		
		webcam.freeze();
		togglePane();
		return false;
	});
	
	$('#cancelButton').click(function(){
		webcam.reset();
		togglePane();
		return false;
	});
	
	$('#uploadButton').click(function(){
		webcam.upload();
		webcam.reset();
		togglePane();
		return false;
	});

	camera.find('.settings').click(function(){
		if(!shootEnabled){
			return false;
		}
		
		webcam.configure('camera');
	});

	// Показываем и скрываем панель камеры:
	
	var shown = false;
	$('.camTop').click(function(){
		
		$('.tooltip').fadeOut('fast');
		
		if(shown){
			camera.animate({
				bottom:-466
			});
		}
		else {
			camera.animate({
				bottom:-5
			},{easing:'easeOutExpo',duration:'slow'});
		}
		
		shown = !shown;
	});

	$('.tooltip').mouseenter(function(){
		$(this).fadeOut('fast');
	});

Теперь надо реализовать несколько возвратных функций для плагина webcam:

assets/js/script.js – Часть 3

	/*---------------------- 
		Возвратные вызовы
	----------------------*/
	
	
	webcam.set_hook('onLoad',function(){
		// Когда FLASH загружен, разрешаем доступ 
		// к кнопкам "Снимаю" и "Установка"
		shootEnabled = true;
	});
	
	webcam.set_hook('onComplete', function(msg){
		
		// Данный ответ возвращается upload.php
		// и содержит имя изображения в формате объекта JSON
		
		
		msg = $.parseJSON(msg);
		
		if(msg.error){
			alert(msg.message);
		}
		else {
			// Добавляем его на страницу
			photos.prepend(templateReplace(template,{src:msg.filename}));
			initFancyBox();
		}
	});
	
	webcam.set_hook('onError',function(e){
		screen.html(e);
	});

Это завершает интеграцию веб-камеры в наше приложение. Однако нам нужно вывести список последних изображений (и дать пользователю возможность просматривать старые изображения). Для этого будет использоваться функция loadPics(), которая связывается с browse.php:

assets/js/script.js – Часть 4

	/*-------------------------------------
		Наполняем страницу изображениями
	-------------------------------------*/
	
	var start = '';
	
	function loadPics(){
		
		
		// This имеет значение true, когда loadPics вызывается
		// для события, сгенерированного кнопкой "Загрузить еще":
		
		if(this != window){
			if($(this).html() == 'Загрузка..'){
				// Дублирующие нажатия кнопки не обрабатываем
				return false;
			}
			$(this).html('Загрузка..');
		}
				
		// Запускаем запрос AJAX. Параметр start либо пустой
		// либо содержит имя первого изображения, которое
		// надо выводить. Используется для постраничного вывода:
		
		$.getJSON('browse.php',{'start':start},function(r){
				
			photos.find('a').show();
			var loadMore = $('#loadMore').detach();
			
			if(!loadMore.length){
				loadMore = $('<span>',{
					id			: 'loadMore',
					html		: 'Загрузить еще',
					click		: loadPics
				});
			}
			
			$.each(r.files,function(i,filename){
				photos.append(templateReplace(template,{src:filename}));
			});
			
				
			// Если это следующая страница с изображениями:			
			if(r.nextStart){
				
				// r.nextStart содержит имя изображения,
				// которое следует за последним выведенным.
				
				start = r.nextStart;
				photos.find('a:last').hide();
				photos.append(loadMore.html('Загрузить еще'));
			}
			
			// Нужно повторно инициализировать fancybox каждый раз,
			// когда добавляется новое изображение на страницу:
			
			initFancyBox();
		});
		
		return false;
	}

	// Автоматически вызываем loadPics для
	// наполнения страницы при загрузке:
	
	loadPics();

Так как функция loadPics() привязывается в качестве обработчика события click для панели Загрузить ещё..., то она может быть вызвана двумя способами: обычным и как возвратная функция. Разница заключается в том, что объект this указывает либо на window, либо на элемент DOM. мы можем проверить данный факт и предпринять соответствующие действия, то есть предотвратить дублированное нажатие, чтобы избежать повторения запросов к browse.php.

В последней части определяются вспомогательные функции, которые используются во всем коде.

assets/js/script.js – Часть 5

	/*----------------------------
		Вспомогательные функции
	------------------------------*/

	
	// Данная функция инициализирует скрипт 
	// fancybox.
	
	function initFancyBox(filename){
		photos.find('a:visible').fancybox({
			'transitionIn'	: 'elastic',
			'transitionOut'	: 'elastic',
			'overlayColor'	: '#111'
		});
	}


	// Данная функция разрешает доступ к двум 
	// элементам div .buttonPane:
	
	function togglePane(){
		var visible = $('#camera .buttonPane:visible:first');
		var hidden = $('#camera .buttonPane:hidden:first');
		
		visible.fadeOut('fast',function(){
			hidden.show();
		});
	}
	
	
	// Данная функция замещает "{ключевое_слово}"
	// соответствующим значением объекта:
	
	function templateReplace(template,data){
		return template.replace(/{([^}]+)}/g,function(match,group){
			return data[group.toLowerCase()];
		});
	}
});

 

CSS

В связи с недавним появлением Firefox 4 трансформации CSS3 могут окончательно занять достойное место в инструментарии разработчика.

assets/css/styles.css

/*------------------------
	Область фотогалереи
-------------------------*/


#photos{
	margin: 60px auto 100px;
	overflow: hidden;
	width: 880px;
}

#photos:hover a{
	opacity:0.5;
}

#photos a,
#loadMore{
	background-position: center center;
	background-color: rgba(14, 14, 14, 0.3);
	float: left;
	height: 110px;
	margin: 1px 1px 0 0;
	overflow: hidden;
	width: 145px;
	
	-moz-transition:0.25s;
	-webkit-transition:0.25s;
	-o-transition:0.25s;
	transition:0.25s;
}

#photos a:hover{
	opacity:1;
}

#loadMore{
	cursor: pointer;
	line-height: 110px;
	text-align: center;
	text-transform: uppercase;
	font-size:10px;
}

#loadMore:hover{
	color:#fff;
	text-shadow:0 0 4px #fff;
}

В выше приведенном фрагменте определяется трансформация 0.25s для ссылок на изображения. Так анимируется каждое изменение стиля данных элементов, включая определения :hover. Также все фотографии становятся прозрачными на 50% при наведении курсора мыши на элемент div #photos, за исключением того изображения, над которым находится курсор мыши.

Также определение трансформации влияет на элемент span #loadMore. Он имеет тень для текста, определенную для состояния hover, которая за счет анимации дает эффект нежного свечения.

Галерея изображений

Готово!

Такой функционал добавит привлекательности форуму единомышленников или какому-нибудь сайту социальной сети. Также можно добавить поле для комментариев к фотографии или навесить дополнительные функции (например, передачу сообщения).

Данный урок подготовлен для вас командой сайта ruseller.com
Источник урока: tutorialzine.com/2011/04/jquery-webcam-photobooth/
Перевел: Сергей Фастунов
Урок создан: 16 Мая 2011
Просмотров: 51545
Правила перепечатки


5 последних уроков рубрики "jQuery"

или авторизуйтесь, чтобы добавлять комментарии, оценивать уроки и сохранять их в личном кабинете
  • 16 Мая 2011 21:48
    notbot
    Спасибо, крутой урок!
  • 16 Мая 2011 23:16
    Дзирт_До_Урден
    И вопрос по уроку : как осуществить фильтрацию снимков пользователей ??? ведь некоторые полоумные могут и "непристойности" фотографировать !!! фильтрация типа - "ваш снимок появится после просмотра админа" или в этом роде, а не мгновенное вывешивание на сайте....
    • 16 Мая 2011 23:19
      BenLaden
      Не завидую я админу.)
    • 17 Мая 2011 14:54
      rubyx
      а пускай фоткают всё что угодно, надо ещё парится над этим как на "однокласниках фото на паспорт" :))
  • 16 Мая 2011 23:59
    da_lamber
    Офигительнейший урок. Класс. Просто слов нет
  • 17 Мая 2011 11:00
    sadchenko
    Спасибо за урок!
  • 17 Мая 2011 12:38
    krlmisha
    хороший урок =) Респект и уважуха автору, ну и конечно переводчику.
  • 17 Мая 2011 14:42
    kesha_php
    Аффтору 6+))
  • 17 Мая 2011 14:50
    rubyx
    Вотэтадааа не ожидал такого урока:) Без комментариев! Спасибо:)
  • 17 Мая 2011 17:24
    Andreev0310
    Просто супер!:)
  • 17 Мая 2011 21:43
    rubyx
    Уроки для начинающих
    http://html.manual.ru/
    изучайте базовые знания по css, html... Надеюсь такая находка будет кому-то полезна:) Сам я в поисках как заставить html страничку открываться в заданном размере окна отдельно из адресной строки браузера ??? Не предлогайте мне только
    <a href="#1" onClick="window.open('ссылка на страницу', 'newWin', 'Toolbar=0, Location=0, Directories=0, Status=0, Menubar=0,
    Scrollbars=0, Resizable=0, Copyhistory=1, Width=500, Height=270')">название
    ссылки</a>
    это не то совсем:))
  • 18 Мая 2011 01:58
    prologos
    здорово.. еще бы видеочат научили делать! )
  • 18 Мая 2011 18:21
    Ygreec
    Круто! Это как раз продолжение урока, который был раньше, но круче и более применим. Можно сразу применить, если поможете решить один вопрос: как сделать, чтобы пользователь мог убрать фоту, если она ему не понравилась (хотя бы как у вас - в течение пары минут, как в случае с коментами)? Надо дать выбор пользователю - это его право, мало ли криво снялось или передумал показывать себя... А критикам - одно скажу: не ругайте за то, что переводят с других сайтов - для тех кто плохо (не на должном уровне) знает английский - это единственный способ суметь разобраться с интересными скриптами и механизмами... я например не смог бы разобраться на сайте разработчика!... если критиковать - то только полезность урока, а на личности переходить незачем... я правда не знаю, кого и за что там модеры банят, но в-основном все полезно, потому что у нас есть выбор, мне шаблоны флэш-сайтов не нужны, но кому-то они нужны и так далее... иконки скачиваю для нужд... единственный минус - не отвечают на вопросы, и я вот не надеюсь дождаться ответа на поставленный выше вопрос, а это так важно выяснить...
  • 18 Мая 2011 20:35
    genixxx
    Мощный урок, вот это реально нужная штука, способная оживить любой сайт :)
  • 18 Мая 2011 22:51
    mosgraf
    Ребят, а что, на локальном сервере скрипт не должен работать, или это только у меня не хочет фотки в папки складывать и выводить их на страницу..? Блин, все перепроверил и веб камеры менял, и что только не делал, а толку ни какого: то ли не "фотографирует", то ли не кидает фотки в папку..?! Точно, проверил, - закинул на тестовый на хостинг, все пашет отлично..!! А на локалке не желает! Спасибо автору урока, молодцом! Классная вещь!
  • 19 Мая 2011 15:44
    sulico
    А как добавить комментарии к фото или скрипт контакта " мне нравиться" ??
  • 20 Мая 2011 09:32
    Quber
    +100500 автору низкий поклон, хороший урок. Даёшь больше таких уроков!
  • 21 Мая 2011 13:58
    sha9
    После обновление страницы пропадает загруженое фото ...
  • 21 Мая 2011 17:22
    sha9
    После обновление странички пропадают все загруженные фото ...помогите
  • 21 Мая 2011 21:23
    ghbrjkbcn
    ммм... Передача сообщения это например кому или вы имеете введу что бы наводить на фотку чела который сфоткался и прекриплялось к ID того кто сфотакался так?
    • 25 Мая 2011 03:53
      sulico
      Да , именно так ))) Или просто под каждой фото была кнопка мне нравиться , чтоб можно было сделать рейтинг фото , по голосованию)
  • 23 Мая 2011 16:40
    sulico
    Как добавить комментарии к фото или кнопочку мне нравиться ?
  • 25 Мая 2011 14:23
    zxczxc33
    Вот сделал: http://koloks.ru/webcam/index.html
    • 18 Августа 2011 14:19
      prologos
      че у тя за вирусяк на сайте? ..
  • 31 Мая 2011 07:47
    Юрий Кожушный
    У кого нибудь заработало так как должно работать? Почему фотографии сохраняются просто в папке аплойд, и не обновляется галерея?
  • 15 Июня 2011 23:56
    TJbla2e
    я скачал демо, но на компе процесс дошел только до момента когда камера начинает вещать, но кнопка "Снимаю" не работает, что доделать нужно?
  • 18 Августа 2011 14:32
    prologos
    Че то на бесплатном хостинге не пашет ! Кнопки "Загрузить"/"Отменить" не появляются, а сразу сворачивается. На ишаке, вообще импасибл. В скрипте еще толком не разбирался? Но спросить хочу , у всех такие проблемы?
  • 20 Августа 2011 09:42
    prologos
    Плагин в оригинале называется Photobooth. Скачал оригинал англ. версию. Она тоже работает нестабильно. Несколько снимков и все. И окошко просто не дает делать больше снимков. После нажатия на кнопку снять (shoot) просто прячется камера вниз ( и даже по моему страница перегружается). Достаточно в папке webcam перезаписать файлы / Подозреваю что происходит это из-за того что пропадает звуковой файл на домене.
  • 22 Сентября 2011 00:24
    jackmx
    Спасибо, класный урок, вот только попросил бы убрать из демо некоторые фотографии 16+, туда ведь и дети заходят)
  • 10 Января 2012 20:50
    uCoz
    Круто :) ээххх.... как я сфотографировался :D довеенько так не фотографировался :D
  • 24 Января 2012 21:11
    Андрей Некрасов
    Помогите пожалуйста, я устанавливаю на локальный компьютер, и все делаю по инструкции, но все равно ничего не работает!
  • 1 Июня 2012 10:57
    marat.dimaev
    Шикардос просто =) спасибо!!
  • 3 Февраля 2013 19:46
    ateck
    Спасибо за урок, можете подсказать, все таки а как же видеочат сделать ??? как этот код преобразовать, чтобы видеочат сделать ???
  • 15 Мая 2013 12:07
    igor3310
    Отличное расширение - только как сделать чтоб картинку не на сайт выводило а давало на скачивание?
  • 6 Декабря 2013 12:20
    Витюганище
    Такой простецкая галерейка, а подключаеются такие титаны как jquery, php,css3)))
  • 13 Декабря 2013 17:28
    rompo
    А можете помочь с добавлением описания к сделанным фото? Как можно обработать текст из textarea, прежде чем сохранить фотографию?
  • 18 Ноября 2014 09:41
    shadkatar88
    Фото киоск вещь хорошая кто знает как реализовать связь с мобильной камерой, так как фото киоск работает только через web камеру или камеру с ноутбука, а через телефон не получается, кто в курсе как через телефон это реализовать???
  • 11 Февраля 2015 19:30
    roman.solovyov6
    как удалить фотографию на этом сайте пожалуйста удалите это фотографию спасибо за ранее.
  • Комментарий удален
    • 16 Мая 2011 21:22
      pitshifer
      да и хер с ними. как говорится - "заставь дурака молиться - он себе голову разобьет"
    • 16 Мая 2011 21:58
      djvergon
      ошибаешься они их ещё и переводят
      • 16 Мая 2011 23:11
        BenLaden
        Их google.com переводит.
        • 17 Мая 2011 11:36
          unframed
          Ню-ню. Там ссылка есть на оригинал. Засунь ее в Гугл.ком. Хорошо, если будет просто смешно. А то ведь и смысл может потеряться.
          • 17 Мая 2011 14:58
            rubyx
            что за диалог про переводчиков? Не плохо было бы подобный урок как создать для своего сайта переводчик.
    • 16 Мая 2011 23:10
      Дзирт_До_Урден
      какая разница откуда урок. Ведь некоторые обучаются именно с этого ресурса. И мне в том числе по барабану, где взят урок, а главное его функционал и качественный перевод. Если урок работает, то респект за труды и старание !!!
      • 17 Мая 2011 11:41
        ppaull
        Обучиться чему-либо на этом ресурсе невозможно ... так, иногда интересные примеры попадаются на jquery ...
        • 17 Мая 2011 13:29
          Pascalius
          А в чем проблема с jquery че так трудно его выучить?
          • 21 Мая 2011 17:23
            sha9
            После обновление странички , пропадают загруженные фото помогите пожалуйста
^ Наверх ^