воскресенье, 21 октября 2012 г.

Изменить кнопку загрузки файла

Все просто, никакого JS, просто меняем стили (ну не совсем просто, если вы оказались на этой странице). Если все сделать правильно, кнопка загрузки файлов больше не будет такой ущербной. По примеру можно сделать ее и в своем стиле.

регистрация доменов

HTML
<div class="container upload">    <span class="btn">Добавить файл</span>    <input type="file"/></div>    
..и немного стилей:
CSS
.container {
width:300px;
margin:50px auto 0;
height:80px;
}
.upload {
position:relative;
}
.upload > input[type=file] {
display:block;
width:100%;
height:100%;
opacity:0;
}
.upload > .btn {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:#efefef;
color:#555;
border:solid 1px #ddd;
border-radius:4px;
text-align:center;
font-size:2em;
line-height: 80px;
z-index:0;
}
.upload:hover > .btn {
background:#f7f7f7;
color:#333;
}
.upload:active > .btn {
background:#efefef;
color:#333;
margin-top:1px;
} ​
Вот и все! до невозможности просто)
Посмотреть как это выглядит можно здесь 

вторник, 28 августа 2012 г.

Все media типы (Content-Type)

В довесок к статье про media-типы в php, вот вам массив с полным собранием типов.
$mimes = array( 'hqx' => 'application/mac-binhex40',
'cpt' => 'application/mac-compactpro',
'csv' => array('text/x-comma-separated-values', 'text/comma-separated-values', 'application/octet-stream', 'application/vnd.ms-excel', 'application/x-csv', 'text/x-csv', 'text/csv', 'application/csv', 'application/excel', 'application/vnd.msexcel'),
'bin' => 'application/macbinary',
'dms' => 'application/octet-stream',
'lha' => 'application/octet-stream',
'lzh' => 'application/octet-stream',
'exe' => array('application/octet-stream', 'application/x-msdownload'),
'class' => 'application/octet-stream',
'psd' => 'application/x-photoshop',
'so' => 'application/octet-stream',
'sea' => 'application/octet-stream',
'dll' => 'application/octet-stream',
'oda' => 'application/oda',
'pdf' => array('application/pdf', 'application/x-download'),
'ai' => 'application/postscript',
'eps' => 'application/postscript',
'ps' => 'application/postscript',
'smi' => 'application/smil',
'smil' => 'application/smil',
'mif' => 'application/vnd.mif',
'xls' => array('application/excel', 'application/vnd.ms-excel', 'application/msexcel'),
'ppt' => array('application/powerpoint', 'application/vnd.ms-powerpoint'),
'wbxml' => 'application/wbxml',
'wmlc' => 'application/wmlc',
'dcr' => 'application/x-director',
'dir' => 'application/x-director',
'dxr' => 'application/x-director',
'dvi' => 'application/x-dvi',
'gtar' => 'application/x-gtar',
'gz' => 'application/x-gzip',
'php' => 'application/x-httpd-php',
'php4' => 'application/x-httpd-php',
'php3' => 'application/x-httpd-php',
'phtml' => 'application/x-httpd-php',
'phps' => 'application/x-httpd-php-source',
'js' => 'application/x-javascript',
'swf' => 'application/x-shockwave-flash',
'sit' => 'application/x-stuffit',
'tar' => 'application/x-tar',
'tgz' => array('application/x-tar', 'application/x-gzip-compressed'),
'xhtml' => 'application/xhtml+xml',
'xht' => 'application/xhtml+xml',
'zip' =>  array('application/x-zip', 'application/zip', 'application/x-zip-compressed'),
'mid' => 'audio/midi',
'midi' => 'audio/midi',
'mpga' => 'audio/mpeg',
'mp2' => 'audio/mpeg',
'mp3' => array('audio/mpeg', 'audio/mpg', 'audio/mpeg3', 'audio/mp3'),
'aif' => 'audio/x-aiff',
'aiff' => 'audio/x-aiff',
'aifc' => 'audio/x-aiff',
'ram' => 'audio/x-pn-realaudio',
'rm' => 'audio/x-pn-realaudio',
'rpm' => 'audio/x-pn-realaudio-plugin',
'ra' => 'audio/x-realaudio',
'rv' => 'video/vnd.rn-realvideo',
'wav' => array('audio/x-wav', 'audio/wave', 'audio/wav'),
'bmp' => array('image/bmp', 'image/x-windows-bmp'),
'gif' => 'image/gif',
'jpeg' => array('image/jpeg', 'image/pjpeg'),
'jpg' => array('image/jpeg', 'image/pjpeg'),
'jpe' => array('image/jpeg', 'image/pjpeg'),
'png' => array('image/png',  'image/x-png'),
'tiff' => 'image/tiff',
'tif' => 'image/tiff',
'css' => 'text/css',
'html' => 'text/html',
'htm' => 'text/html',
'shtml' => 'text/html',
'txt' => 'text/plain',
'text' => 'text/plain',
'log' => array('text/plain', 'text/x-log'),
'rtx' => 'text/richtext',
'rtf' => 'text/rtf',
'xml' => 'text/xml',
'xsl' => 'text/xml',
'mpeg' => 'video/mpeg',
'mpg' => 'video/mpeg',
'mpe' => 'video/mpeg',
'qt' => 'video/quicktime',
'mov' => 'video/quicktime',
'avi' => 'video/x-msvideo',
'movie' => 'video/x-sgi-movie',
'doc' => 'application/msword',
'docx' => 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
'xlsx' => 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
'word' => array('application/msword', 'application/octet-stream'),
'xl' => 'application/excel',
'eml' => 'message/rfc822',
'json' => array('application/json', 'text/json')
);

пятница, 17 августа 2012 г.

Пиар сайта

Только приступили или уже реализовали вашу задумку в жизнь, но никто кроме ваших друзей и мамы с папой о нем не знает? Никакого трафика и развития проекта? -Самое время рассказать о проекте в сети!

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

Помните, главное - это качественный текст!
Эсли статья ниочем, то и читать ее никто не будет. Никому не нравится шлак. Не нравятся статьи перегруженные ссылками. Текст, где через строчку: "купи у нас, купи у нас, мы такие ах*енные, а вот те не оч". Избегайте такого стиля, это никому не нравится! Очень важны изображения. Людям нравится визуализация. Но, главное, и с ними не переборщить. Инфографика - идеальный вариант. Всем нравится инфографика. Ну и конечно же видео. Короткое, 3-5 минут максимум. Никакого унылого голоса за кадром, все должно выглядеть очень бодро.

Список сайтов\сообществ, для публикации своих идей, пиара проектов:


dou.ua

it-job.by

http://1hub.ru/

http://pr-cy.ru/blogs/new
Регистрируемся и пишем статью. Если статья интересная - ее не заминусуют. Имейте ввиду то, что сайт SEO тематики. Так что статьи по seo заходят на ура, так же норм отношение к веб-девелоперским темам.

http://surfingbird.ru
Схема такая:
1. Регистрируемся на сайте и больше его не трогаем.
2. Закидываем несколько статей на одну тему (к примеру насколько классный ваш сайт, проект и тп) на разные блоги, сайты, странички. Желательно, чтобы статьи не копировали друг друга. В идеале эти стать писать на вышеперечисленных площадках.
3. Заходим обратно на сайт и добавляем ссылки на свои ранее написанные посты.
Важно: правильно выставить категории, описание статьи.

habrahabr.ru
Нуу.. Про хабр знают все. И, наверное, это лучшая площадка для пиара вашего проекта. Есть специальный раздел - 'Я пиарюсь'.
Но! Свободной регистрации на хабре нет. Точнее есть, но писать вы не сможете, аккаунт - read-only. Для того чтобы стать полноценным участником нужен инвайт или написать пост в песочницу (с read-only аккаунтом писать можно только туда). Если хабраюзеры оценят вашу писанину - можно считать, что инвайт у вас в кармане!). пс: буду рад инвайту)


freehabr.ru
Площадка позиционирует себя как "свободный хобр". То есть тот же хабр, только со свободной регистрацией. Аудитория конечно несравнима, но для рекламы своих проектов вполне сгодится. После регистрации сразу же можно добавить свой пост.
Если вашу статью "залайкает" хотя бы 3 пользователя - пост попадает на главную страницу, а это гораздо больше просмотров.


*Пользуетесь другими площадками для данных целей - оставляйте в комментариях, добавлю в список

Скачать Lung - Afterlife (Kryptic Minds Remix).

четверг, 16 августа 2012 г.

Будущее интернета из 95-го года

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

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



Интересно то, что ролик создавался как социальная реклама, предназначенная для популяризации интернета.

А вот и сам ролик:

вторник, 14 августа 2012 г.

Архивирование файлов на php

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

HTML
<form name="zips" method="post">
<input type="checkbox" name="files[]" value="flowers.jpg" />
<img src="files/image.png" />
flowers.jpg
<input type="checkbox" name="files[]" value="fun.jpg" />
<img src="files/image.png" />
fun.jpg
........
<input type="submit" name="createpdf" value="Скачать ZIP" />&nbsp;
<input type="reset" name="reset" value="Сбросить" />
</form>


PHP
Следующий код конвертирует выбранные файлы в ZIP формат.
<?php
$error = "";
if(isset($_POST['createpdf']))
{
$post = $_POST;
$file_folder = "files/"; // папка для загрузки файлов
if(extension_loaded('zip'))
{
// проверяем подгрузку расширения
if(isset($post['files']) and count($post['files']) > 0)
{
// проверяем выбранные файлы
$zip = new ZipArchive(); // подгружаем zip библиотеку
$zip_name = time().".zip"; // имя файла - текущее время
if($zip->open($zip_name, ZIPARCHIVE::CREATE)!==TRUE)
{
// открываем zip
$error .= "* Ошибка создания файла";
}
foreach($post['files'] as $file)
{
$zip->addFile($file_folder.$file); // добавление файлов в zip
}
$zip->close();
if(file_exists($zip_name))
{
// отправляем файлы на загрузку
header('Content-type: application/zip');
header('Content-Disposition: attachment; filename="'.$zip_name.'"');
readfile($zip_name);
// убираем файлы из кэша
unlink($zip_name);
}
}
else
$error .= "* Выберите файл!";
}
else
$error .= "* Нет расширения";
}
?>

вторник, 7 августа 2012 г.

Горячие клавиши sublime text 2

Как и обещал, вот вам отдельный пост о горячих клавишах sublime text 2.

Горячие клавиши изменяются по тому же принципу, что и все остальные настройки, и точно также вступают в силу сразу же после сохранения конфига. В случае какой-либо ошибки, вроде неправильной комбинации клавиш, вы можете узнать подробности в консоли (Ctrl + `). Там вообще можно найти много полезных данных. Обратите внимание на картинку — это ссылка на подробную карту горячих клавиш (случайно нашёл в сети).



Работа с текстом
Хоткей Описание
ctrll Выделить строку.
ctrlm Выделить текст между двумя парными скобками.
ctrla Выделить текст между двумя парными тегами.
ctrlj Выделить текст с соответствующим отступом.
ctrlspace Выделить по контексту.
ctrlleft Выделить слово слева.
ctrlright Выделить слово справа.
ctrla Выделить весь текст.
ctrll Разделить выделенные строки на независимые участки редактирования.
ctrlup Переместить выделенные строки вверх.
ctrldown Переместить выделенные строки вниз.
ctrld Дублировать строку.
ctrlk Удалить строку.
ctrlbackspace Удалить часть слова до курсора.
ctrldelete Удалить часть слова после курсора.
ctrlbackspace Удалить текст от курсора и до начала строки.
ctrlk, ctrlbackspace Удалить текст от курсора и до начала строки.
ctrldelete Удалить текст от курсора и до конца строки.
ctrlk, ctrlk Удалить текст от курсора и до конца строки.
ctrlj Объединить выделенные строки.
altq Объединить строки в параграфе.
ctrlenter Добавить пустую строку под курсором.
ctrlenter Добавить пустую строку над курсором.
ctrlaltup Добавить курсор на следующей или предыдущей строке.
ctrlaltdown Добавить курсор на следующей или предыдущей строке.
ctrl/ Добавить или убрать однострочный комментарий.
ctrl/ Добавить или убрать блочный комментарий.
f9 Отсортировать строки в алфавитном порядке.
ctrlf9 Отсортировать строки в алфавитном порядке с учетом регистра.
ctrlk, ctrll Трансформировать выделенный текст в нижний регистр.
ctrlk, ctrlu Трансформировать выделенный текст в верхний регистр.
ctrlt Транспонировать текст.
alt. Закрыть незакрытый тег.
altw Обернуть тегом выделенный текст.
insert Переключить режим ввода: вставка или замена.
ctrlk, ctrlspace Установить метку.
ctrlk, ctrla Выделить текст от курсора до метки.
ctrlk, ctrlx Поменять местами метку и курсор.
ctrlk, ctrlw Удалить метку.
ctrlk, ctrlg Удалить все метки.
ctrl] Убрать отступ.
ctrl[ Добавить отступ.
ctrly Повторить последнее действие.
ctrlc or ctrlinsert Копировать.
ctrlv or insert Вставить.
ctrlv Вставить с отступом.
ctrlx Вырезать.
delete Вырезать.
ctrlz Отмена последнего действия.
ctrlz Повторить последнее отмененное действие.
ctrlu Отменить последние выделение.
ctrlu Повторить последние отмененное выделение.
Поиск и замена
Хоткей Описание
ctrlf Открыть панель поиска.
ctrlh Открыть панель поиска и замены.
ctrlf Открыть панель поиска и замены по всем файлам проекта.
ctrli Открыть панель быстрого поиска и поиск.
ctrli Открыть панель быстрого поиска и поиск в обратном направлении.
alta Включить или выключить режим сохранения регистра на панели поиска и замены.
altr Включить или выключить использование регулярных выражений на панели поиска и замены.
f6 Включить или выключить проверку правописания.
altc Включить или выключить чувствительность к регистру на панели поиска и замены.
altw Включить или выключить режим поиска слова целиком на панели поиска и замены.
altenter Найти все.
ctrl` Показать панель.
enter Поиск в обратном направлении.
ctrlaltenter «Заменить все» на панели поиска и замены.
ctrlh Заменить текст далее.
f3 Поиск.
f3 Поиск в обратном направлении.
f4 Переход к следующему результату поиска по всем файлам.
f4 Переход к предыдущему результату поиска по всем файлам.
ctrlf3 Быстрый поиск.
ctrlf3 Быстрый поиск в обратном направлении.
ctrld Найти и выделить текст.
ctrlk, ctrld Пропустить выделенный текст.
altf3 Найти все.
ctrle Скопировать слово или выделенный текст в окно поиска.
ctrle Скопировать слово или выделенный текст в окно замены.
ctrlf6 Перейти к следующей ошибке.
ctrlf6 Перейти к предыдущей ошибке.
ctrlp Открыть окно поиска файла «Goto Anything...».
ctrlr Открыть окно перехода к функциональному блоку.
ctrlg Открыть окно для перехода к заданной строке.
ctrl; Открыть окно для перехода к заданному слову.
Фолдинг
Хоткей Описание
ctrl[ Свернуть код.
ctrl] Развернуть код.
ctrlk, ctrl1 - 9 Свернуть код соответсвующего уровня.
ctrlk, ctrl0 or ctrlk, ctrlj Развернуть все.
ctrlk, ctrlt Свернуть атрибуты тегов.
Навигация
Хоткей Описание
ctrlaltp Открыть окно выбора проектов.
ctrlf2 Установить или снять закладку.
f2 Перейти к следующей закладке.
f2 Перейти к предыдущей закладке.
altf2 Выделить все закладки.
ctrlf2 Удалить все закладки.
ctrlk, ctrlc Переместить экран к курсору.
ctrlup Прокрутка окна редактирования.
ctrldown Прокрутка окна редактирования.
ctrlm Переместить курсор к парной скобке.


Управление окнами
Хоткей Описание
alt0 - 9 Выбор соответствующей вкладки.
ctrltab Переключиться на следующую вкладку.
ctrlf4 Закрыть вкладку.
ctrltab Переключиться на предыдущую вкладку.
ctrlpageup Переключиться на вкладку слева.
ctrlpagedown Переключиться на вкладку справа.
alt1 - 5 Управление количеством и расположением областей редактирования.
alt8 - 9 Управление количеством и расположением областей редактирования.
ctrl1 - 4 Переключиться в соответсвующую область.
ctrl1 - 4 Переместить вкладку в соответствующую область.
f11 Развернуть окно во весь экран.
f11 Переключиться в «Отвлеченный режим».
ctrlk, ctrlb Показать или скрыть боковую панель.
ctrl0 Переключить фокус на боковую панель.
ctrln Создать новую вкладку.
ctrlw Закрыть текущую вкладку.
ctrln Создать новое окно.
ctrlw Закрыть окно.

Работа с файлами
Хоткей Описание
ctrlo Вызвать окно «Открыть файл».
ctrlt Открыть последний закрытый файл.
ctrls Сохранить текущий файл.
ctrls Вызвать окно «Сохранить как».
alto Переключение между файлами представления и реализации.


Разное
Хоткей Описание
ctrlp Открыть окно списка функций.
ctrlplus Увеличить размер шрифта.
ctrlminus Уменьшить размер шрифта.
ctrlq Запустить или остановить запись макроса.
ctrlq Вопроизвести макрос.
ctrlaltp Отобразить в статусной строке название контекста, в котором находится курсор.
f7 Выполнить
ctrlb Выполнить
ctrlb Выполнить
ctrlbreak Отменить выполнение



среда, 25 июля 2012 г.

Подтверждение формы без перезагрузки страницы

Привет, %username%!
В этом примере я покажу тебе, как при помощи аякс можно создать форму, которая при подтверждении данных не будет перезагружать страницу!

JS:
Обратите внимание на dataString
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js">
</script>
<script type="text/javascript" >
$(function() {
$(".submit").click(function() {
var name = $("#name").val();
var username = $("#username").val();
var password = $("#password").val();
var gender = $("#gender").val();
var dataString = 'name='+ name + '&username=' + username + '&password=' + password + '&gender=' + gender;
if(name=='' || username=='' || password=='' || gender=='')
{
$('.success').fadeOut(200).hide();
$('.error').fadeOut(200).show();
}
else
{
$.ajax({
type: "POST",
url: "join.php",
data: dataString,
success: function(){
$('.success').fadeIn(200).show();
$('.error').fadeOut(200).hide();
}
});
}
return false;
});
}); </script>

HTML:
Сама форма:
<form method="post" name="form">
<ul><li>
<input id="name" name="name" type="text" />
</li><li>
<input id="username" name="username" type="text" />
</li><li>
<input id="password" name="password" type="password" />
</li><li>
<select id="gender" name="gender">
<option value="">Пол</option>
<option value="1">Муж</option>
<option value="2">Жен</option>
</select>
</li></ul>
<div >
<input type="submit" value="Submit" class="submit"/>
<span class="error" style="display:none"> Ошибка! Введите норм данные</span>
<span class="success" style="display:none"> Регистрация успешно завершена</span>
</div></form>

join.php
Именно этот код будет обрабатываться посредствам aJax. Т.е. при нажатии на кнопку 'submit' будет выполненно следуещее:
if($_POST){
$name=$_POST['name'];
$username=$_POST['username'];
$password=$_POST['password'];
$gender=$_POST['gender'];
mysql_query("*ваш sql запрос..");
}else { }
?>