Собираем свою коллекцию сниппетов кода

Как известно в сети существует довольно много сайтов, на которых представлены различные сниппеты. Как правило они разделены по категориям. Если ознакомиться с такими сайтами подробнее, то можно найти много всего интересного: начиная от фрагментов HTML и CSS кода, заканчивая сниппетами для CMS Joomla и WordPress.

Начать собирать коллекцию полезных для вас сниппетов можно с сайтов на которых уже размещено внушительное количество примеров кода. К таким можно отнести, например, сайты: или http://phpsnips.com/. Оба сайта существуют уже довольно давно и за это время на них накопились тысячи различных сниппетов. Одни из них очень полезные, другие практически бесполезные. Но среди такого большого количества кода, любой разработчик сможет найти для себя что-нибудь интересное. Важным плюсом указанных сайтов, является то, что весь код находится в свободном доступе и вы можете воспользоваться им совершенно бесплатно.

Итак, приступаем: представляю вниманию читателей небольшой обзор полезных на мой взгляд сниппетов, которые я нашел, в том числе, на указанных выше сайтах. Я разделил найденные фрагменты кода по категориям. Сейчас постараюсь написать несколько строк о каждом из них.

Во всех примерах кода используются абстрактные данные (идентификаторы и классы элементов страницы, значения кодов цветов, значение передаваемых аргументов в функции и т.п.). При использовании сниппетов, не забудьте поменять значения на свои.

Joomla

• Как добавить JS-файл в раздел head шаблона

  PHP

  		$host = JURI::root();
  		$document =& JFactory::getDocument();
  		$document->addScript($host.'path/jquery-1.4.4.min.js');
  	

• Как установить заголовок страницы

  PHP

  		$document = JFactory::getDocument();
  		$document->setTitle($this->escape($title));
  	

• Как узнать находится ли посетитель на главной странице сайта?

  PHP

  		$uri = &JURI::getInstance();
  		$myabsoluteurl = $uri->toString(array('path'));    
  		if($myabsoluteurl==JURI::base(true).'/')
  		  $front_page = TRUE;
  	

• Как получить имя компонента Joomla в файле шаблона (index.php)?

  PHP

  		$comp_name  = JFactory::getApplication()->input->get('option');
  	

• Как получить ID статьи в файле index.php шаблона сайта Joomla?

  PHP

  		$article_id  = JFactory::getApplication()->input->get('id');
  	

Код из приведенных выше сниппетов будет работать и в свежей версии CMS Joomla (на момент написания статьи – 3.3).

jQuery

• Ссылка для возврата к началу страницы

  JavaScript

  		// Возврат к началу страницы
  		$(document).ready(function(){ 
  		  $('.top').click(function() {  
  			 $(document).scrollTo(0,500);  
  		  });
  		}); 
  
  		// Создаем ссылку с классом .top
  		<a href="#" class="top">К началу страницы</a>
  	

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

• Выравнивание блоков (div) по высоте

  JavaScript

  		var maxHeight = 0;
  
  		$("div").each(function(){
  		   if ($(this).height() > maxHeight) { maxHeight = $(this).height(); }
  		});
  
  		$("div").height(maxHeight);
  	

  Довольно часто бывает, что длина содержимого блоков, расположенных рядом друг с другом - разная. Это выглядит не очень красиво, поэтому этот небольшой скрипт будет очень полезен в подобных ситуациях. Он помогает выровнять высоту блоков по самому высокому блоку.

• Автоматическая загрузка контента при скроллинге

  JavaScript

  		var loading = false;
  		$(window).scroll(function(){
  				if((($(window).scrollTop()+$(window).height())+250)>=$(document).height()){
  						if(loading == false){
  								loading = true;
  								$('#loadingbar').css("display","block");
  								$.get("load.php?start="+$('#loaded_max').val(), function(loaded){
  										$('body').append(loaded);
  										$('#loaded_max').val(parseInt($('#loaded_max').val())+50);
  										$('#loadingbar').css("display","none");
  										loading = false;
  								});
  						}
  				}
  		});
  
  		$(document).ready(function() {
  				$('#loaded_max').val(50);
  		});
  	

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

• Периодическое обновление содержимого части страницы

  JavaScript

  		setInterval(function() {
  		$("#refresh").load(location.href+" #refresh>*","");
  		}, 10000); // интервал обновления страницы (время в миллисекундах)
  	

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

• Загрузка стороннего контента на страницу

  JavaScript

  		$("#content").load("somefile.html", function(response, status, xhr) {
  		  // обработка ошибок
  		  if(status == "error") {
  			$("#content").html("Произошла ошибка: " + xhr.status + " " + xhr.statusText);
  		  }
  		});
  	

  Возможность загрузки данных на страницу также может оказаться довольно полезной. Например, с помощью представленного кода вы можете загрузить результаты работы какого-нибудь долго отрабатывающего скрипта уже после загрузки страницы. Таким образом, не нужно будет заставлять посетителя сайта ждать пока отработает скрипт, чтобы увидеть остальное содержимое страницы.

CSS

• Превращаем цветное изображение в черно-белое с помощью CSS

  CSS

  		img.desaturate { filter: grayscale(100%);
  		-webkit-filter: grayscale(100%);
  		-moz-filter: grayscale(100%);
  		-ms-filter: grayscale(100%);
  		-o-filter: grayscale(100%);
  		}
  	

  Замечательная возможность создать черно-белое изображение без использования графических редакторов.

• Используем свой цвет выделения текста

  CSS

  		::selection { background: #e2eae2; }
  		::-moz-selection { background: #e2eae2; }
  		::-webkit-selection { background: #e2eae2; }
  	

  Эта возможность придает вашему сайту немного индивидуальности. Позволяет изменять значение свойств CSS: color, background и background-color.

• Вертикально отцентрированный контент

  CSS

  	.container {
  		min-height: 6.5em;
  		display: table-cell;
  		vertical-align: middle;
  	}
  	

  Порой бывает очень нужно выровнять содержимое внутри блока по высоте. Но как известно, такое «поведение» возможно только внутри ячеек таблицы. Поэтому просто «превращаем» блок в ячейку таблицы с помощью CSS. Также полезная возможность

• Шаблон для создания CSS3 градиента

  CSS

  	#colorbox {
  		background: #629721;
  		background-image: -webkit-gradient(linear, left top, left bottom, from(#83b842), to(#629721));
  		background-image: -webkit-linear-gradient(top, #83b842, #629721);
  		background-image: -moz-linear-gradient(top, #83b842, #629721);
  		background-image: -ms-linear-gradient(top, #83b842, #629721);
  		background-image: -o-linear-gradient(top, #83b842, #629721);
  		background-image: linear-gradient(top, #83b842, #629721);
  	}
  	

  При создании градиента с использованием CSS3 нужно учитывать его отображение во всех браузерах. В большинстве из них градиент создается с помощью свойств с префиксами, поэтому CSS-код получается довольно длинным. Чтобы сэкономить время, можно пользоваться приведенным шаблоном. Просто заменяем коды цветов и добавляем в свой проект.

• CSS шаблон для оформления цитат

  CSS

  	blockquote {
  		background: #f9f9f9;
  		border-left: 10px solid #ccc;
  		margin: 1.5em 10px;
  		padding: .5em 10px;
  		quotes: "\201C""\201D""\2018""\2019";
  	}
  	blockquote:before {
  		color: #ccc;
  		content: open-quote;
  		font-size: 4em;
  		line-height: .1em;
  		margin-right: .25em;
  		vertical-align: -.4em;
  	}
  	blockquote p {
  		display: inline;
  	}
  	

  Приведенный CSS-код поможет аккуратно оформить цитаты на странице: перед текстом цитаты добавляются крупные кавычки.

PHP

• Способ проверки типа загружаемого посетителем файла

  PHP

  	 
  		// размещаем в массиве разрешенные для загрузки форматы файлов
  		$extension = array("application/pdf", "image/jpeg", "image/png", "image/gif");
  
  		if(isset($_POST['submit'])){
  				exec("file -i ".$_FILES['inputName']['tmp_name'], $output);
  				$type = explode(':', (string)$output[0]);
  		}
  
  		// Проводим проверку загружаемого файла
  		if (isset($_FILES['inputName']) &&
  					$_FILES['inputName']['error'] == UPLOAD_ERR_OK  &&
  					$_FILES['inputName']['size'] <= 10000000 &&
  					in_array(trim($type[1]), $extension)){
  					var_dump($_FILES['inputName']['tmp_name']);
  		}else{
  			die("Запрещенный формат файла");
  		}
  	

  Один из многочисленных способов проверки типа файлов, загружаемых посетителями сайта.

• Как завершить PHP-сессии по истечении определенного времени

  PHP

  	if (isset($_SESSION['LAST_ACTIVITY']) && (time() - $_SESSION['LAST_ACTIVITY'] > 1800)) {
  		// последний запрос был ранее чем 30 минут назад
  		session_unset();     // очищаем массив переменные в $_SESSION 
  		session_destroy();   // удаляем данные из $_SESSION
  	}
  	$_SESSION['LAST_ACTIVITY'] = time(); // обновляем данные о последнем времени активности
  
  	/*
  	Вы также можете использовать дополнительную метку времени для перииодической генерации идентификатора сессии, чтобы предотвратить атаки, связанные с фиксацией сессий 
  	*/
  	if (!isset($_SESSION['CREATED'])) {
  		$_SESSION['CREATED'] = time();
  	} else if (time() - $_SESSION['CREATED'] > 1800) {
  		// сессия стартовала более 30 минут назад
  		session_regenerate_id(true);    // аннулируем старый идентификатор сессии 
  		$_SESSION['CREATED'] = time();  // обновляем время создания сессии
  	}
  
  	//обратите внимание, что параметр session.gc_maxlifetime(php.ini) должен быть равен показателю времени жизни сессии, указанную в скрипте (в данном примере 1800)
  	

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

• Генерируем csv-файл из PHP массива

  PHP

  	function generateCsv($data, $delimiter = ',', $enclosure = '"') {
  	   $handle = fopen('php://temp', 'r+');
  	   foreach ($data as $line) {
  			   fputcsv($handle, $line, $delimiter, $enclosure);
  	   }
  	   rewind($handle);
  	   while (!feof($handle)) {
  			   $contents .= fread($handle, 8192);
  	   }
  	   fclose($handle);
  	   return $contents;
  	}
  	

  В завершении статьи приведу еще один полезный сниппет. С его помощью можно сохранить данные из массива в файл формата .csv. Несмотря на то, что он очень просто написан, его возможностей хватит для организации простейшего экспорта данных в csv-файл.

Среди множества сниппетов кода, я постарался выбрать в те, которые будут полезны и помогут в работе читателям. Ознакомиться с различными фрагментами кода на разных языках программирования вы сможете на указанных в начале статьи сайтах.