Итак, нам понадобятся два файла:

1. index.php — загружаем основу и немного контента из базы
2. loadmore.php — динамическая загрузка данных

Эти два файла нужны чтобы взаимодействовать с базой. Я использую MySQL.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

$(window).scroll(function(){
	if($(window).scrollTop() == $(document).height() - $(window).height()){
		$('div#loadmoreajaxloader').show();
		$.ajax({
			url: "loadmore.php?lastid=" + $(".postitem:last").attr("id"),
			success: function(html){
				if(html){
					$("#postswrapper").append(html);
					$('div#loadmoreajaxloader').hide();
				}else{
					$('div#loadmoreajaxloader').html('<center>No more posts to show.</center>');
				}
			}
		});
	}
});

Этот код занимается тем, что смотрит проскролили ли мы до низа. Он расположен в index.php. Тут сразу скажу, что такой способ не айс. Т.к. если мы будем выводить мало контента и скролбара на странице не будет, то и событие не сработает.

Я вынес ajax в отдельную функцию, которую можно вызывать как ссылкой, так и при срабатывании события. Но тут я привожу код без правок.

1
2
3
4
5
6
7
8
9

$dblink = mysql_connect('DB_HOST', 'DB_USERNAME', 'DB_PASSWORD');
mysql_select_db('DB_NAME');
if($_GET['lastid']){
	$query = 'SELECT * FROM infinitescrolling WHERE id < "'.$_GET['lastid'].'" ORDER BY id DESC LIMIT 0, 10';
	$result = mysql_query($query);
	while($rec = mysql_fetch_object($result)) {
		echo '<div class="postitem" id="'.$rec->id.'">Post no '.$rec->id.': '.$rec->text.'"</div>';
	}
}

Ну а в loadmore.php у нас загрузка новых записей из базы.

Это только пример. Я знаю, что в продакшене такое никогда не будет и не имеет права использоваться. Это лишь пример.

Решение в моем случае оказалось простое: я дал кнопке имя submit чего категорически делать нельзя, т.к. в этом счучае js обращается к кнопке и пытается сделать ей submit а никак не форме.

Суть кода в том, чтобы взять строку, закодить ее через RSA алгоритм и передавая эту строку и ключи JS скрипту раскодировать на стороне клиента. Да да именно так, а не наоборот. Хотя генерить ключик на стороне php передавать его js и закриптованную строку обратно в php тоже можно.

А вот и сам архивчик: rsa-php_to_js

Увы незнаю пока как сделать не 32битное шифрование. Но это впереди.
PHP RSA Encoding, Decoding and JS decoding and encoding RSA

Посмотреть в действии (демо)…

Возможности:

• Загрузка сразу нескольких файлов при помощи ctrl/shift выбора в диалоге открытия
• Javascript callbacks на все действия
• Информация о файле до его загрузки
• Стилизация элементов на странице
• Вывод информации во время загрузки файлов
• Загрузка без рефреща страницы
• Работает везде где включен JavaScript и есть Flash
• Загрузка обычными средствами, если flash или javascript отключены
• Контроль размера файла до его загрузки
• Выбор в диалоге, только указанных типов файлов
• Возможность удаления после загрузки

На момент поста, последний релиз — SWFUpload v2.2.0

Скачать >>>

На своем примере опишу, как я загружаю файлы:

подключаю в основном файле в head

<script type="text/javascript">
var swfu;
window.onload = function() {
var settings = {
flash_url : "swfupload.swf",
upload_url: "upload.php",
post_params: {"PHPSESSID" : "<?php echo session_id(); ?>"},
file_size_limit : "100 MB",
file_types : "*.*",
file_types_description : "All Files",
file_upload_limit : 100,
file_queue_limit : 0,
custom_settings : {
progressTarget : "fsUploadProgress",
cancelButtonId : "btnCancel"
},
debug: false,
// Button settings
button_image_url: "images/TestImageNoText_65x29.png",
button_width: "65",
button_height: "29",
button_placeholder_id: "spanButtonPlaceHolder",
button_text: '<span class="theFont">Hello</span>',
button_text_style: ".theFont { font-size: 16; }",
button_text_left_padding: 12,
button_text_top_padding: 3,

// The event handler functions are defined in handlers.js
file_queued_handler : fileQueued,
file_queue_error_handler : fileQueueError,
file_dialog_complete_handler : fileDialogComplete,
upload_start_handler : uploadStart,
upload_progress_handler : uploadProgress,
upload_error_handler : uploadError,
upload_success_handler : uploadSuccess,
upload_complete_handler : uploadComplete,
queue_complete_handler : queueComplete // Queue plugin event
};
swfu = new SWFUpload(settings);
};
</script>


а в body добавляем формочку в блоке

<div id="content">
<form id="form1" action="index.php" enctype="multipart/form-data" method="post">
<div id="fsUploadProgress" class="fieldset flash">
<span class="legend">Upload Queue</span>
</div>
<div id="divStatus">0 Files Uploaded</div>
<div>
<span id="spanButtonPlaceHolder"> </span>
<input id="btnCancel" style="margin-left: 2px; font-size: 8pt; height: 29px;" onclick="swfu.cancelQueue();" disabled="disabled" type="button" value="Cancel All Uploads" />
</div>
</form>
</div>

далее проверяем все ли файлы подключенные на своих местах:

images

• TestImageNoText_65x29.png

js

• fileprogress.js
• handlers.js
• swfupload.queue.js

upload
.

• default.css
• index.php
• swfupload.js
• swfupload.swf
• upload.php

вот код файла upload.php тут можно навернуть еще всякого, но это лишь пример.

если неохото копать ручками, то можно качать этот пример.

SWFupload

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

Регулярные выражения часть любого программерского набора. Они могут пригодиться, если Вам необходимо найти, заменить части текстовых шаблонов или символов. Регулярные выражения, как швейцарский нож для модификации строк. Хотите чтобы url сайта выглядел приятно? Используйте regex. Нужно удалить всю пунктуацию или убрать все теги? Тем более используйте регулярные выражения. Использование регулярных выражений безгранично.

Регулярные выражения это то, с чем Вам нужно столкнуться как минимум единожды, хотябы для того, чтобы поправить .htaccess файл для создания Человеко-понятных ссылок, или что-то покруче, например для фильтрации RSS фидов или другой информации. Ниже представленно несколько ресурсов, которые помогут Вам на пути изучения и использования regex.

Вступление

Только начали изучение regex? Вот несколько must-read ресурсов, которые познакомят Вас с основами.

Необходимый минимум о регулярных выражениях
Простая и понятная статья о принципах работы с регулярными выражениями.

Обьяснение Регулярных Выражений
В этой статье описываются простые примеры регулярных выражений. Автор старается донести до пользователей технику использования поиска с использованием регулярных выражений.

Регулярные выражения: быстрый старт
Учебник, для начинающих осваивать regex, написанный в легкой и доступной форме.

Использование регулярных выражений в PHP
Небольшой обзор о синтаксисе регулярных выражений в PHP.

Научитесь использовать регулярные выражения
Каждый раздел этой стать содержит пример кода, что поможет более легко выспринимать описание.

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

PHP фрики: Регулярные Выражения
Еще одна обьемная статья с основами регулярных выражений; статья также описывает использование метасимволов, жадность и ленивость, а также модификаторы и другие полезные дополнения.

Введение в регулярные выражения от MSDN
Статья описывает введение в регулярные выражения и то, как их можно использовать.

Шпаргалка по регулярным выражениям
Данная шпаргалка описывает паттерны и не основывается на каком-то конкретном языке. Доступна в PDF и PNG.

Регулярные Выражения: шпаргалка
Краткое описание использования регулярных выражений для Javascript. Доступна в png.

Регулярные выражения для Perl: шпаргалка (pdf) и Регулярные выражения для Perl: краткое описание (pdf)

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

Регулярные Выражения в Ruby and Rails
Регулярные выражения в Rails окружены прямыми слешами, тоесть они выглядят следующим образом: /[0-9]*/. Модификаторы, (например регистронезависимый i) ставятся после второго слеша.

Всесторонний разбор

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

Основные понятия на пути к продвинутому использованию регулярных выражений
Это введение в продвинутое использование регулярных выражений, включающее восемь примеров и основных описаний. Каждый пример показывает простой способ соответствия правилам при использовании в сложных последовательностях. Если у Вас нет опыта работы с регулярныеми выражениями, обратите внимание на эту статью для начала. Синтаксис используемый тут, показывается на примере Perl и PHP.

Инструкция Regex
Эта инструкция шаг за шагом учит использовать инструменты и рассказывает обо всех аспектах регулярных выражений. Лучше читать от начала и до конца, т.к. каждая последующая глава основывается на предыдущей.

Регулярные выражения — путеводитель ползователя
Это путеводитель с легким введением и быстрым но конкретным описанием всего, что связанно с regex. Также включает примеры.

perlretut
Очень хорошее руководство о регулярках на Perl. Это руководство достаточно детализированно и хорошо описывает тему. Стоит прочесть от начала до конца.

Ресурсы о регулярных выражениях
Это сборник ресурсов о и про регулярные выражения, включает в себя статьи и приложения.

Regex Tools
Примеры для .NET о работе с регулярными приложениями.

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

Практика регулярных выражений

Разбор номера телефона (от Matt83)
Номер соответствует следующей форме: (###) ###-####

$string = "(232) 555-5555";
if (preg_match('/^\(?[0-9]{3}\)?|[0-9]{3}[-. ]?
[0-9]{3}[-. ]?[0-9]{4}$/', $string)) {
echo "Это верный номер.";
}

Почтовые коды (от Matt83)

	$string = "55324-4324";
if (preg_match('/^[0-9]{5,5}
([- ]?[0-9]{4,4})?$/', $string)) {
echo "Это правильный почтовый код.";
}

Соответствие имен пользователей (от immike.net)

function validate_username( $username ) {
  if(preg_match('/^[a-zA-Z0-9_]{3,16}$/', $_GET['username'])) {
    return true;
  }
  return false;
}

Соответствие XHTML/XML тегам (от immike.net)

function get_tag( $tag, $xml ) {
  $tag = preg_quote($tag);
  preg_match_all('{<'.$tag.'[^>]*>(.*?)</'.$TAG.'>.'}',
                   $xml,
                   $matches,
                   PREG_PATTERN_ORDER);

  return $matches[1];
}

Проверка URL (от Matt83)

$szString = "http://www.talkPHP.com";
if (preg_match('/^(http|https|ftp):\/\/([\w]*)\.([\w]*)\.
(com|net|org|biz|info|mobi|us|cc|bz|tv|ws|name|co|me)
(\.[a-z]{1,3})?\z/i', $szString))
    echo "Это валидный URL";

Парсинг электронной почты (от Matt83)

$string = "first.last@domain.co.uk";
if (preg_match(
'/^[^\W][a-zA-Z0-9_]+(\.[a-zA-Z0-9_]+)*\@[a-zA-Z0-9_]+
(\.[a-zA-Z0-9_]+)*\.[a-zA-Z]{2,4}$/',
$string)) {
echo "Это правильный e-mail.";

Валидность номеров кредитных карт (JavaScript, от ntt.cc)

	function luhn (cc) {
   var sum = 0;
   var i;

   for (i = cc.length - 2; i >= 0; i -= 2) {
      sum += Array (0, 2, 4, 6, 8, 1, 3, 5, 7, 9)
      [parseInt (cc.charAt (i), 10)];
   }
   for (i = cc.length - 1; i >= 0; i -= 2) {
      sum += parseInt (cc.charAt (i), 10);
   }
   return (sum % 10) == 0;
}

Регулярные Выражения, то, что нужно на практике
Множество regex-паттернов которые часто используются при разработке.

10+ Полезных JavaScript функция для работы с регулярными выражениями.
JavaScript регулярные выражения для различных проверок: на пустые строки, на числовые данные, и другое.

RegExLib.com
Первая онлайн библиотека регулярных выражений. На данный момент содержит 2,511 паттернов от более чем 1,500 пользователей. Вы можете выбрать наиболее подходящий пример для своего проекта.

Инструменты Regex

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

The Regulator
The Regulator — продвинутый и бесплатный инструмент, который позволит оттестировать регулярные выражения и поможет понять их устройство. Входные данные могут быть как текстовые, так и уже готовые страницы. Позволяет использовать нахождение вхождений, деление и замену. Строит иерархические деревья паттернов.Может генерировать код VB.NET и C#.

Regular Expression Tester Firefox Plugin
Это плагин для Firefox, который позволяет разработчикам тестировать их регулярные выражения. Инструмент включает регистрозависимость, глобальный и многострочный поиск, подсветку вхождений, функцию замены. Автозакрытие параметров, тестирование при написании и сохранение паттернов.

html2regexp — генератор регулярных выражений для HTML
html2regexp написан на ruby для генерирования регулярных выражений.

reWork
ReWork — это бенчмарк для регулярок. Вводим паттерн и текст в соответствующие поля. Результаты автоматически появлются на экране. Можно применять функции поиска, замены, дробления, сканирования и парсинга, а также генерировать графы конечного автомата (КА).

RegExr
RegExr является онлайн тестером и генератором паттернов ля регулярок. Тут можно поиграться с регулярками перед тем как вводить в свой проект.

The Regex Coach
Кроссплатформеный инструмент который обучит Вас работе с регулярными выражениями.

Rubular
Онлайн тестер паттернов, написанный на Ruby.

Rex V — Regular Expression eValuator
Инструмент тестирует на валидность регулярки написанные для использования в PHP PCRE, PHP Posix и Javascript.

Flex 3 Regualr Expression Explorer
Этот сервис предоставляет доступ к сообществу в котором присутствуют популярные регулярные выражения, а также позволяет тестировать свои.

regexpal
Интерактивный javascript тестер для регулярок. Сервис можно установить себе на хостинг, т.к. он является опенсорсным.

Txt2re
Regex генератор с возможностью подсветки синтаксиса и вхождений, который позволит писать паттерны эффективней.

reAnimator: Regular Expression FSA Visualizer
Подручное средство для regex выражений. Для ознакомлений стоит перейти по ссылке launch post.

Javascript Regular Expression Validator
Полезный regex tester для Javascript который также имеет набор уже готовых паттернов. Простой но мощный инструмент.

RegEx Buddy
RegexBuddy, вот кто заслуживает внимания! Лично я пользуюсь только им. Это мощнейшее средство для составления регулярок, с подсветкой синтаксиса, проверкой на валидность, собственной встроенной библиотекой паттернов. Он работает с различными типами регулярок eReg, pReg. Генерирует код сразу для нескольких языков. Имеется откат при неправильном составлении регулярок. Строит иерархию паттерна. Можно применять сразу несколько регулярок к строке последовательно. Вобщем это мой выбор.

На рисунке, как-раз показано построение дерева, которое поможет рассмотреть паттерн шаг за шагом.

Expreso
Expresso — это бесплатное средство для разработчика, завоевавшее различные награды. Вы можете строить комплексные регулярные выражения, выбирая из встроенного набора различные паттерны и тестировать на реальных образцах данных. Также имеется возможность генерации кода под Visual Basic, C#, или C++ и просматривать выражения в виде дерева также как это делает RegEx Buddy. Можно подсвечивать группы и отдельные вхождения. Также можно создать дополнительную библиотеку с собственными паттернами и использовать ее для тестирования своих регулярок. Требует регистрации и только под Windows.

JavaScript Regex Generator
Попытка сделать генератор регулярок с дружественным интерфейсом. Есть баги при просмотре в IE. Есть ограничения на работу с регулярками.

Regex видеоуроки

Для тех, кто хочет учить регулярные выражения по видеоурокам, есть отличные скринкасты.

Учим Регулярные Выражения (Video Tutorial and Cheatsheet)
В этом видео рассказывается о том, как пользоваться E Text Editor для составления регулярок.

Погружение В Регулярные Выражения
Вводный курс от Джефри Вейя. Немного старенький, но все еще актуальный и полезный туториал по изучению регулярных выражений. Показывается как проверять на валидность электронные адреса. «Для новичка в разработке, регулярные выражения самые ужасные конструкции на свете. Для простоты разберем регулярные выражения на некоторых примерах. После небольшого изучсения Вы поймете, что регулярки довольно структурированные и не сложные в понимании конструкции.»

Регулярные Выражения для чайников
Вводное видео для изучения регулярных выражений. В конце дается задание для проверки усвренного материала.

Regex для чайников: день 2
Продолжение перврго скринкасиа по изучению регулярок.

Регулярные Выражения (серии)
Пять серий по введению в Регулярные Выражения.

Учебники по регулярным выражениям

Примеры регулярных выражений на PHP
Множество различных примеров регулярных выражений, которые могут использоваться в PHP. Описывается несколько полезных вещей: валидациа номеров кредиток, дат, email адресов, и еще несколько полезных вещей.

Учебник по регуляркам для PHP
Эта статья раскрывает основы использования регулярных выражений в PHP и показывает примеры наиболее распространенных regex-паттернов.

Разоблачение регулярных выражений
Регулярные выражения кажутся достаточно сложными. Мало того, что язык выглядит довольно странным, он также требует логики. Эта статья старается стереть клеймо, которое некоторые навешивают на регулярные выражения, и показывает простоту и логичность паттернов в примерах.

Радость регулярных выражений [1]
Эта обучающая программа использует простые примеры, которые не включают несвязные демонстрационные строки как например “aabbcc”, чтобы показать, как regex работает на самом деле. Статья раскрывает все основные понятия: точное соответствее, позитивное соответствовие, модификаторы шаблона и другие примеры.

Радость регулярных выражений [2]
Во второй обучающей программе показывается как регулярные выражения обеспечивают много полезных функций, например, как найти изображения с .jpg расширениями, или нахождение xss уязвимостей в Вашем коде.

Введение в регулярные выражения
Быстрое введение в основы работы с регулярными выражениямии паттернами. Содержит простые примеры на javascript.

Знаете ли Вы регулярные выражения
У IBM есть отличная статья по регулярным выражения в UNIX системах. Читать обязательно.

Регулярные Выражения: две проблемы
Джеф Этвуд (со-основатель Stackoverflow), показывает на практике, как используются регулярные выражения. Знание где и как использовать regex иногда очень полезно, и Джеф показывает примеры эффективного использования регулярных выражений.

Об авторе

Глен Стансберри (Glen Stansberry), разработчик и блоггер. В его блоге WebJackalope можно найти много статей по тематике веб разработок. А также можно следовать за ним в твиттере: @webjackalope.

Итак, чем-же удобны всплывающие окна? Ответ прост. Это привлекает внимание, это стильно, модно и просто в исполнении. Эти появляющиеся окна по сути похожи на то как работает lightbox, т.е. тоже плавное затемнение фона и появление окна посередине экрана.

Ну и от теории к практике.

Для начала нам нужны следующие файлы: jquery.js, jwin.css и jwin.js

И код который вставляется в HEAD файла.

<script type="text/javascript" src="./js/jquery.js"></script>
<script type="text/javascript" src="./js/jwin.js"></script>
<link href="./js/jwin.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">
var cont;
cont = 'Текст сообщения';
function testWindow(){
var w = $.jWin.create({alwaysCentered:true,autoShow:false,
modal:true,overlayOpacity:0.8,overlayColor:'#000',
title: '<strong>Заголовок</strong>',handleEscape:true
});
w.setContent(cont);
w.show();
}
</script>


Ссылки формируются как обычно, но плюс onclick=»testWindow();»
Естественно никто не мешает усовершенствовать интерефейс. Это и так переделка окошек от http://maxantonov.name за что ему огромнейшее спасибо.

UPD: было обновление у на сайте у Макса забирайте новую версию, умеет заберать контент через $.get и вставит в .body окна из http:// и из ./file.html

Как переводить?

• Выделяете слово на странице
• Нажимаете на эту закладку

1

javascript:var perevod = window.open('http://lingvo.yandex.ru/en?text='+window.getSelection()+'&st_translate=on','Yandex perevod',''); perevod.focus();