can3p: (Default)

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

http://addyosmani.com/toolsforjqueryapparchitecture/

Виджеты, SPA, MVC, History, templating, deployment и прочие слова, все здесь.


Оригинал: http://blog.dpetroff.ru/tech/javascript-trends
can3p: (Default)
Помните те самые зачетные посты про 50 amazing jquery lightbox plugins?

Написал в свое время плагин, особо не пиарил. Спустя полгода пошли письма от иностранцев, и поток не иссякает, даже при том, что последняя как-то корректная версия вышла чуть ли не год назад.

Наконец догадался погуглить, и вот что получилось: раз, два, три, четыре, пять, шесть, семь.

www.ajaxguru.co.cc отличился тем еще, что написал новость про каждую выходившую версию плагина.

Вот как оно бывает - сидишь себе, ваяешь на коленке и не знаешь, что в мире творится. Похоже придется таки перевести все на канвас, добавить слои, маркеры и вообще сделать гугл мэпс.
can3p: (Default)

Решил поторопиться и докодить всякие вещи, на которые как всегда не хватает времени.

1) Перевел руководство пользователя к gmpc. Клиент отличный, в нем есть все и еще немного больше для того, чтобы управлять своей музыкальной коллекцией совместно с mpd. Использую уже года три, очень доволен. Кроме богатого функционала у gmpc есть та особенность, что он работает просто реактивно, не жертвуя для этого ни чем. Запускается моментально, без проблем переваривает большие списки файлов и отказывается падать вообще, автор молодец, решил помочь проекту хоть как-то. По скорости работы с gmpc может поспорить только почтовый клиент sylpheed, который можно успеть запустить, проверить почту и быстро ответить на сообщение, пока тот же evolution успеет достроить свой интерфейс.

2) Влепил пару патчей для getmap, раньше поле города было позорно регистрозависимым, а по ссылкам только для чтения зачем-то выводились ненайденные запросы.

3) Решил выложить прототип онлайн менеджера паролей, встречайте:
http://kdb.dpetroff.ru/

Эта программа также как и getmap выросла из того, что «а круто посмотреть, можно ли читать двоичные файлы с помощью javascript». Можно, без особых проблем. Особенности программы:

  • В качестве формата файлов подходят базы паролей от keepassx и keepass (старый формат, который по сути тот же, что и у keepassx)
  • Из механизмов шифрования поддерживается только AES256, он стоит во обеих программах по умолчанию, но вдруг вы решили поменять
  • Программа использует HTML File API. Из этого следует два вывода: 1) Серверной части просто нет. Можно собрать этот менеджер паролей у себя в укромном уголке vds или просо не бояться, что я на сервере храню все введенные пароли. 2) Для работы нужен свежий google chrome или firefox 3.6+, остальные пока не почесались с поддержкой стандарта. Да, про safari не знаю.
  • На firefox 3.6 расшифровка файла может занять длительное время, из-за большого выставленного исла раундов шифрования ключа (можно менять в keepass в настройках базы). По умолчанию стоит 50000, firefox жевал у меня это 2 минуты, google chrome справлялся за 5 секунд, opera за схожий промежуток времени. Такие вот дела. Решить можно просто – поставить число раундов, например, 5000.
  • Все стандартные значки поддерживаются, все нестандартные не поддерживаются
  • Если у вас нет файла на посмотреть, возьмите этот. пароль 123123

В программе конечно же есть известные и неизвестные баги.

Благодаря этому проектику научился читать cpp код, разобрался в разумных пределах в шифрованием AES256, написал парсер формата файлов keepassx сначала на питоне, потом на js, а на самом js накодил на удивление удачный код для создания многоэкранных приложений в рамках одного html файла.

В общем, было интересно =) Всех с наступающим


Оригинал: http://blog.dpetroff.ru/tech/ny2011
can3p: (Default)

Как это часто бывает, демка, на которую думал потратить пару дней, отняла у меня больше месяца. Замысел был такой – в яндекс.картах все хорошо, но искать там сразу можно только одну точку. А потом еще одну. И еще. Что делать, если их сто?

Можно делать вот так: http://getmap.dpetroff.ru/

Сайт позволяет загнать сразу большой список адресов и найти их на карте. Вот, например, адреса всех салонов Евросети в Москве. Как ни странно, у этой сети нормальной карты с адресами нигде нет, адреса брал со страницы интернет-провайдера. И ведь эта контора не одна такая ущербная.

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

При всем при этом сервис не достиг даже половины того удобства, которым мог бы обладать. Можно было бы предоставить возможность тасовать метки между собой в пределах одного поиска, сделать везде возможность добавлять аннотации и комментарии, настоящей киллер-фичей была бы возможность сохранения истории действия пользователя и его предыдущих запросов. Ну и всякие иконочки и ссылочки. И все это можно было бы делать до победного конца, но я решил, что нужно уже выкатить стабильный срез, чтобы поставить точку, ну или точку с запятой и заняться другими делами :)

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

Если вдруг есть комментарии, пожелания или предложения, буду рад услышать.


Оригинал: http://blog.dpetroff.ru/tech/yandex_maps_multisearch
can3p: (Default)

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

Допустим, вы хотите, чтобы форму можно было отправить только раз и пишете что-то навроде такого:

<input type="submit" value="Sendme" onclick="this.disabled = true;" />

Во всех браузерах кроме ff это срабатывает как метод preventDefault(), т.е. сначала кнопка отключается в событии onclick, а потом браузер, видя что кнопка отключена, прекращает отправку формы. Файрфокс же в этом случае форму отправляет, что мне кажется более предсказуемым поведением, т.к. на момент нажатия кнопка была активна.


Оригинал: http://blog.dpetroff.ru/tech/onclick_disable_submit
can3p: (Default)

Закончил читать книгу, хочу поделиться небольшим отзывом.

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

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

Стефан Стоянов попробовал собрать все типовые задачи в одном месте, результатом чего и является эта книга. JS Patterns надо понимать буквально – не просто шаблоны проектирования (см. GoF), а именно типовые приемы решения технических вопросов, возникающих при программировании.

Read the rest of this entry » )
Оригинал: http://blog.dpetroff.ru/tech/stoyanov-javascript-patterns
can3p: (Default)

Удивительное рядом.

Существуют два события – keydown и keypress, и если вызвать ev.preventDefault() в каждом из них, то одно из действий будет одинаково во всех браузерах – символ не будет напечатан. Но, если нажать enter в поле на форме, то preventDefault на keyDown отменит во всех браузерах, кроме оперы, там форма не будет отправлена, только если отменить keyPress. Это тем более странно, что keydown как раз и создан для обработки спец.символов, клавиш и т.п.


Оригинал: http://blog.dpetroff.ru/tech/opera_prevent_form_submit_enter

JS speed

Sep. 16th, 2010 02:01 am
can3p: (Default)
Невольно получил свой тест скорости браузеров. Операций с DOM нет, сплошная числодробилка.

Что получилось:
FF 3.5 50s
Chromium 7.0.524 5.9s
Opera 10.62 6.8
Chrome 6.0.472 6.3s

Очень интересно, с чем связан такой провал в производительности у Firefox

UPD: отключил firebug, получил 30 секунд выполнения. В два раза быстрее, чем было, но в 5 раз медленнее хрома. Мда.
can3p: (Default)

Источник: http://blog.nihilogic.dk/2008/05/compression-using-canvas-and-png.html

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

Например:
163855 jquery.js
45997 jquery.js.gz
63490 jquery.png
46326 jquery.gz.png

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

Смотреть:
Компрессор на питоне: http://gist.github.com/550578
Декодер на js: http://test.dpetroff.ru/png_loader/ (проверяем наличие jQuery объектов в DOM)
Декодер на js с загрузкой через File API: http://test.dpetroff.ru/png_loader/index2.html (картинку можно взять из предыдущего примера)

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


Оригинал: http://blog.dpetroff.ru/tech/store_data_in_png

Profile

can3p: (Default)
can3p

April 2017

S M T W T F S
      1
2 3 45678
9101112131415
16171819202122
23 242526272829
30      

Syndicate

RSS Atom

Most Popular Tags

Style Credit

Expand Cut Tags

No cut tags
Page generated Jul. 24th, 2017 10:52 am
Powered by Dreamwidth Studios