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

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

Скриншот

todocamp.com

Возможности

дела («туду») организованные в списки;
простой и быстрый интерфейс;
сортировка туду и списков простым перетаскиванием (драг-н-дроп);
клавиатурные сокращения;
печать списков туду;
посылка списка туду на почту;
быстрые сообщения в твиттер и напоминания в гугл-календарь;
вход с помощью фейсбук и гугл аккаунтов.

Запланированное

мобильная версия;
групповая работа над списками (и получится простое управление проектами);
интеграция с соцсетями.

Единственный недостаток сервиса — очень плохая дружба с интернет эксплорерами. Но я уже работаю над этим.

Внутри всё просто. На сервере: django, django_openid_auth, registration, south. Сервер баз данных — mysql. На клиенте: jquery плюс несколько расширений. Проект живет в git-репозитории.

Втсречайте, заходите, пользуйтесь — todocamp.com.

Сайт intermova.dp.ua

2010-07-18 19:14комментарии done web

Сайт pena.dp.ua

2010-06-12 10:42комментарии done web

Пивовед

2010-04-02 10:22комментарии beer done web

Сайт polosmak.com

2010-01-16 22:20комментарии design django done web

Сайт концерт-холла «ТаймАут»

2009-05-21 09:50комментарии design django done google web

Markdown синтаксис по-русски

2009-02-28 21:01комментарии python web

Markdown - это легковесный язык разметки текста для веба. Был создан для удобства чтения и написания размеченных текстов. Движок markdown генерирует валидный XHTML. Авторы - John Gruber и Aaron Swartz. Официальная страница проекта и более подробная документация на сайте Daring Fireball.

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

Блочные Элементы

Параграфы

<пустая строка>
Текст параграфа. Может быть
разбит на несколько строк.
<пустая строка>

Переводы строк

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

Текст параграфа.<пробел><пробел>
Этот текст будет с новой строки.

Заголовки

Заголовок первого уровня H1
===========================


Заголовок второго уровня H2
---------------------------

или так

# Заголовок первого уровня H1
## Заголовок второго уровня H2
###### Заголовок шестого уровня H6

или так

# Заголовок первого уровня H1 #
## Заголовок второго уровня H2 ##
###### Заголовок шестого уровня H6 ######

Цитаты

> Это
> многострочная
> цитата

или так

> Это
многострочная
цитата

Списки

Ненумерованные:

* красный
* зеленый
* синий

или так

- красный
- зеленый
- синий

или даже так

+ красный
+ зеленый
+ синий

Нумерованные:

1. Первый
2. Второй
3. Третий

Код

Отступ в четыре пробела или один таб генерирует блок кода:

<пробел><пробел><пробел><пробел>print 'Hello, World!'

Горизонтальная линия

* * *

или так:

***

или так:

------

Строчные элементы

Ссылки

Инлайн ссылки

Это простая [ссылка](http://rukeba.com/) в тексте.
Это [ссылка](http://rukeba.com/ "Титул") с аттрибутом title.

Ссылки в справочном стиле

Это [ссылка][1] в справочном стиле.
...
...
[1]: http://rukeba.com/ "Необязательный титул"

Что бы урл в тексте стал ссылкой его нужно обрамить в < и >

По урлу <http://rukeba.com/> находится мой сайт.

Выделение

Одинарные звездочки генерируют тег <em>

это \*выделенный\* текст

Двойные звёздочки генерируют тег <strong>

это \*\*очень выделенный\*\* текст

Код в строке

Используйте функцию `printf()` для вывода.

Изображения

![alt-текст](http://example.com/image.jpg "Необязательный титул")

или в справочном стиле:

![alt-текст][2]
...
...
[2]: http://example.com/image.jpg "Необязательный титул"

Дополнительно

Экранирование

Для экранирования служебных символов маркдауна нужно использовать обратный слеш \

Сделал определитель аппликатур гитарных аккордов

2009-01-10 15:07комментарии chords done music web

Подсветка синтаксиса Apache

2008-12-27 14:27комментарии apache done web

Появилась у меня необходимость на страницах блога HeliconTech синтаксически подсвечивать конфигурационные файлы Apache (httpd.conf и .htaccess). Первым делом я пошёл на сайт Ивана Сагалаева, но оказалось, что его замечательный highlight.js подсвечивать конфигурацию Apache не умеет. Но также выяснилось, что написать новую подсветку синтаксиса довольно просто. С сайта документации Apache я получил html-страницу, на которой были все (*почти все :) его директивы. После некоторого шаманства с регулярными выражениями из этого html-файла я получил список всех директив Apache в простом текстовом файле. Дальше, немного потрудившись, получилось и само описание синтаксиса.

Скачать highlight-apache.zip
Пример работы

Для использования распакуйте архив на сайте и в html-документах внутри тега head необходимо добавить:

<link rel="stylesheet" href="apache.css">
<script src='highlight.js'></script>
<script src='apache.js'></script>
<script>hljs.initHighlightingOnLoad();</script>

Не забудьте поправить пути к файлам.

Подсветка работает. И я радуюсь.

2009-01-03 UPDATE: Иван Сагалаев добавил подсветку apache в проект highlight.js!

2009-01-04 UPDATE: сделал новый стиль - Magula. Тоже уже принят в основной бранч.

Дизайн для блога HeliconTech

2008-12-24 11:09комментарии design done web

CSS Reset

2008-12-02 20:14комментарии design howto web

Все, кто пытался сделать нетривиальную html-страницу, которая будет отображаться более чем в одном браузере, знают о проблемах совместимости (а точнее несовместимости :) между ними. Об этом уже очень много написано. Самое первое лекарство, которое применяю я -- Css Reset. Файл стилей сайта я всегда начинаю так:

/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.3.1
*/
body {color:#000;background:#FFF;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
    pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
li {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym {border:0;font-variant:normal;}
sup,sub {line-height:-1px;vertical-align: text-top;}
sub {vertical-align:text-bottom;}
input, textarea, select{font-family:inherit;font-size:inherit;font-weight:inherit;}

Эти строки сбрасывают стили html-элементов для всех браузеров. А после я определяю стили как мне нужно. Сейчас доступна уже 3я версия этой фичи, но меня вполне устраивает и та, которая уже есть.

CSS Reset - часть большого проекта Yahoo User Interface, в которой есть ещё много интересных возможностей.

CSS Reset облегчает мне вёрстку, и я радуюсь!

Комментирование с помощью JS-Kit

2008-12-01 21:34комментарии a1blog web

Месяц назад я обновил свой блогодвижок до Django 1.0. Прежние FreeComments работать перестали, а сделать комментирование по-новому руки всё не доходили. А вчера я вспомнил о замечательном проекте JS-Kit Comments. Идея до гениальности проста и удобна -- вставляете в html код

<div class="js-kit-comments" permalink=""></div>
<script src="http://js-kit.com/comments.js"></script>

и всё - комментарии рисуются, постятся, модерируются. Хранятся - на серверах JS-Kit. Стилями подгоняете под свой дизайн. Есть rss-лента для комментариев каждой странички. Недостаток в том, что комментарии не индексируются, но для меня это не очень важно (ресурс не очень комментируемый :). Всё бесплатно, естественно.

Красота. Я радуюсь.