Все привет.

Была у меня недавно такая задачка. Мне надо было сделать небольшое веб-приложение, которое должно было помочь работе врача. Use-Casе‘ов там не много, посмотреть кто сегодня записан на прием, возможность посмотреть историю болезни, занести новые данные и создать нового пациента. Делов то…

Времени у меня было много, спешить некуда. Сначала подумал спрограмить по быстрому на GWT + SmartGWT, но подумалось мне, что пора бы что нибудь новое посмотреть. К тому же были явные намеки, что появятся мелкие заказы подобного рода, для библиотек там всяких и мелких фирмочек. Хотелось нечто простое с одной стороны, но в тоже время достаточно мощное.

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

К сожалению, во втором случае обычного времени показа титров бывает недостаточно. Удлинить его можно во многих программах (например, в SubtitleEdit) — но иногда это удлинение ограничено разумными пределами, да и запускать для такого простого действия полноценный редактор не всегда удобно.

Поэтому я попробовал написать простые скрипты только под эту нужду и выбрал два принципа удлинения времени.

Продолжая тему веб-разработки мобильных сайтов и приложений под мобильные устройства нельзя не затронуть такую тему как Фреймворки для манипуляции DOM и отправкой асинхронных запросов.
Стандартом на десктопе уже давно стал jQuery, но он никуда не годится для разработки под мобильную платформу. Давайте посмотрим, как jQuery дружит с мобильными устройствами.

Как часто Вы используете конструкции вида «5 минут назад», «Полчаса назад» на вашем сайте? А что если пользователь открыл вкладку и забыл про нее на пару часов? «5 минут назад» явно теряет свою актуальность.
Именно для того чтобы исправить это досадное недоразумение служит uptodate.js

Начиная работать в IntelliJ IDEA, обнаружил отсутствие удобной комбинации клавиш, которой пользуюсь в Eclipse — Ctrl+Alt+Up. По этой комбинации выделенный блок текста или строка, копируется вверх с перемещением курсора в начало скопированного блока.
В Idea есть действие по умолчанию на Ctrl+D, которое копирует блок вниз (Ctrl+Alt+Down в Eclipse), но невозможно добавить аналогичное действие вверх. После гугления был задан вопрос в Q&A, оставшийся без ответа. Заведён issue на jetbrains. Все эти действия не дали ответа, поэтому решено было написать небольшой плагин для Idea.

Приветствую всех!

Статья посвещена решению проблемы кастомизации скроллбаров браузера ради воплощения в жизнь амбициозных идей дизайнера. Статья расчитана на тех, кто свободно ориентируется в технологиях html, css, js, т.к. предлагаемое решение основано на их компромиссном использовании.



В статье будут описаны и решены следующие задачи и цели:

• минимум JavaScript вычислений при прокрутке и изменении размеров элемента
• кроссбраузерность и работа на мобильных браузерах
• простота использования, кастомизации и внедрения
• учитывание поведения элементов при прокрутке с помощью выделения контента
• обновление параметров скроллбаров при обновлении, изменении или догрузке контента
• обход стандартного поведения содержимого браузера при изменении ширины его окна

Все мы слышали про ajax и node.js. Они прочно обосновались уже не просто в словарном запасе, но и в наборе инструментов веб-разработчика. Ajax — асинхронное подтягивание данных с сервера на страницу, node — фреймворк с асинхронным IO. Но как в таком однопоточном языке, как Javascript, реализуется та самая асинхронность?

Вы, наверное, уже догадались из заголовка, речь пойдет об основном цикле («main loop»).

Равенство parseInt("042") === 42 (как и другие ему подобные) станет верным в Firefox следующей версии (Firefox 21) и в более новых, хотя прежде Firefox действовал по образу и подобию языка Си, считая восьмеричными числа, запись которых начиналася нулём — так что вызов parseInt("042") давал тогда значение 34.

Обсуждение в мозилловской багзилле показывает, что перемена эта произошла под влиянием ECMAScript 5 и соответствует изменениям, случившимся в других браузерах (Safari 6, Google Chrome 23 и др.), в движке V8 (и в основанном на нём Node.js, например), так что в этом году Firefox оставался последним оплотом восьмеричности.

Теперь оплот этот не устоял, оплот этот пал. Обновите свои сайты по мере необходимости, особенно если они имели дело с обработкою записей времени, где нередко попадаются числа с ведущим нулём.

Доброго времени суток, господа!

В джаваскрипте существует очень много интересных нюансов, которые едва ли можно встретить в других языках программирования. Рассмотрим самый нужный, на мой взгляд, из них — this.
Данный пост поможет освежить знания по этой теме.
Я не буду долго объяснять теорию, лучше сразу перейдем к коду и подумаем, что же произойдет в результате его выполнения.

Метод численного интегрирования Верле издавна использовался для вычисления траекторий частиц. Сам метод был впервые использован ещё в 1791 году французским астрономом Жаном-Батистом-Жозефом Деламбром. В 1907 норвежский математик и физик Карл Штёрмер использовал его для моделирования движения частиц в магнитном поле, поэтому иногда этот метод называют методом Штёрмера. Современное название этот алгоритм получил от имени французского физика Лу Верле, который в 1967 году использовал его в моделировании молекулярной динамики. В последнее время метод Верле применяется и в разработке компьютерных игр.

Проверка на поддержку конкретных технологий браузером с помощью JavaScript по праву считается наилучшей практикой при клиент-сайд разработке (Часто используют другой способ, заключающийся в проверке из какого браузера пользователь просматривает страницу — Прим. пер.), но, к сожалению, такую проверку нельзя было сделать с использованием только лишь CSS. Firefox, Chrome и Opera недавно объявили о поддержке CSS директивы @supports и CSS.supports (JavaScript), которые помогут разработчикам определять справится ли браузер пользователя с CSS свойством или нет. Давайте посмотрим на них в деле!

tFormer.js — empower your HTML forms

Предисловие:

Вам приходилось верстать формы? Приходилось писать скрипт для валидации этих форм на клиенте? Доводилось ли использовать уже существующие плагины/надстройки для валидации форм?
Мне приходилось, но я не был на 100% удовлетворен ни от подхода решения задачи в лоб (собственный скрипт валидации для каждого проекта под его формы), ни от того, как работают существующие сторонние плагины.

Проблема:

Основными проблемами собственных скриптов и плагинов всегда были — гибкость, удобство и простота.
Большое количество data-attributes, необходимых для конфигурации скриптов (как это в Parsley.js) делают и код менее читабельным, и никогда не помнишь, как все они пишутся. Не просто…
Не все плагины хорошо подходили под желаемые HTML-формы, а постоянно писать свои скрипты под разные формы не всегда удобно и разумно.

Задача:

Создать нечто гибкое, удобно настраиваемое, полностью подконтрольное, с интуитивным синтаксисом и чтоб валидировало.

Решение:

Решение вылилось в небольшой опенсорсный плагин, который получил название tFormer.js.

Что хотелось:

• при завершении задачи в jenkins выводить уведомление на компьютере и как дополнение — вывести его на физический дисплей, подключенный к arduino;
• интерфейс, который можно открыть на телефоне или планшете, для управления проигрывателем музыки на компьютере и видеоплеером на raspberry pi;
• интерфейс, доступный снаружи локальной сети, для вывода значения с датчиков, установленных на arduino.

Что получилось:

• клиент, запускаемый на устройстве, с декларацией методов на python;
• RESTful api для запуска «методов»(картинка справа выведена через него);
• «панели управления» с web-интерфейсом;
• сервис для управления устройствами, методами и панелями.

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

С traceGL можно увидеть весь JavaScript поток в шустром webGL визуализаторе. Это как осциллограф, только для кода.

На сайте traceGL предлагают купить за $14.99 или € 11.50

jRIApp — ещё один HTML5 фреймворк, созданный для разработки Web приложений, которые по своей функциональности мало чем уступают desktop приложениям.

Основное отличие от уже существующих фреймворков типа angularJS или emberJS, это наличие интегрированного с фреймворком сервиса данных, а также использование MVVM дизайн-архитектуры вместо наиболее распространенного в фреймворках такого типа MVC дизайна.
В общих чертах его можно охарактеризовать как HTML5 Фреймворк реализующий привязку к данным, имеющий инфраструктуру для декларативного прикрепления логики к HTML элементам, имеющий классы для работы с данными (DbContext, DbSet) и имеющий реализованную серверную часть дата сервисов.

Клиентская часть фреймворка написана на javascript (сейчас в разработке typescript версия), а серверная часть на C#.

Этот фреймворк опубликован на GitHub под MIT лицензией. Он включает демо-приложение написанное с использованием ASP.NET MVC4 и содержит документацию по его использованию.

Из года в год, сталкиваюсь с одной и той же проблемой. Как добавить, изменить или удалить параметр к некоторому адресу в строковом виде. Быстро и грязно это можно делать с помощью, например, регулярных выражений или найти каке-то готовое решение. Зачастую также может потребоваться, к примеру, подменить путь в адресе или изменить протокол с HTTP на HTTPS и т.д.

В целом, это хочется делать просто и понятно. При этом хочется разумного компромиса. Я встречал некоторые библиотеки, которые дают мощный функционал, но при этом по объему — десятки килобайт JavaScript кода. Несколько десятков килобайт, чтобы, например, подменить параметр в QueryString? Эх…

Недавно я задался вопросом поиска инструментария для разработки мобильных приложений на html/css. Из требований были: доступность, легковесность, простота настройки. Выбор пал на встроенный Node менеджер NPM. NPM содержит
инструментарий для базовых тасков типа install и запуска пользовательских скриптов. Также NPM не такой громоздкий, как Grunt и не требует адаптации модулей под себя, т.к. запускает модули с командной строки.

В скрипте HabrAjax (113.2013.04.20) добавлено удобное редактирование исправлений в собственных статьях. Достаточно просто выделить уникальный участок текста и среди контекстных кнопок выбрать кнопку <E>. В фрейме половинной высоты откроется поле ввода с выделением именно на том месте, которое было выделено.

Также, обеспечена поддержка браузеров Iceweasel (на основе Fx3.6) в Дебиане и возвращена поддержка Firefox 3.6 в остальных ОС (но там будет иметься проблема установки старой версии Greasemonkey, актуальной для 3.6). Потенциальная аудитория — 1% от остальных пользователей Firefox.

Аудитория пользователей HabrAjax и направленность статьи

Среднее число пользователей скрипта — 40-60 человек. Поэтому, если статью прочитает 3000 человек, то практический интерес она может иметь только для 1.5% читателей. Пусть, ещё 10% будут иметь желание попробовать скрипт. Но не более. Потому что скриптами вообще пользуются немного людей. Остальным — достаточно узнать, что функции, сделанные для удобства пользования, имеются в том или ином скрипте.

Что такое GruntJS

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

Grunt помогает управлять всеми этими шагами в одном месте и организовать сторонние компоненты.