JavaScript *

Часто, на промышленных предприятиях, возникает необходимость удобного представления технологических процессов с возможностью вмешиваться в их ход. Данную функциональность реализуют SCADA системы или АРМ (автоматизированное рабочее место). В посте речь пойдет о том, как с минимальными трудозатратами создать полноценное место оператора.

Графический редактор

Будем пользоваться редактором векторной графики Inkscape[1]. Этот редактор является свободно распространяемым под лицензией GNU GENERAL PUBLIC LICENSE. Данный инструмент позволяет сохранять графику в виде svg[2] Scalable Vector Graphics. Что по сути представляет из себя xml-файл.

Вот и настало время весеннего обновления WebStorm, нашей IDE для front-end разработки и Node.js.
В новом WebStorm 8 появились поддержка фреймворка AngularJS, JavaScript-трейсер spy-js, долгожданные множественные курсоры в редакторе, интеграция Grunt и Bower и еще много интересных нововведений и улучшений.
Теперь обо всем по порядку.

Теория

Возможно найдутся много таких как я, фанатов синтаксиса и функций PHP, которым нужно писать, скажем, на JavaScript, а времени изучать функции нету.
Да, мы хорошо знаем основные функции PHP — это и есть наше оружие! А если мы еще и думаем вместо родного языка на PHP — это и есть наш запущенный случай, ради чего я стал наполнять свою библиотеку, которую назвал JSSamePHP (JS как PHP).
Понятным языком — аналоги PHP функций в JavaScript.

MIT опубликовал исходники проекта Mylar — платформы для создания безопасных приложений, с шифрованием и
поиском по зашифрованным данным.

Как понять в чём разница между двумя цветами? Как из одной цветовой схемы сделать 360? Как превратить имеющиеся у нас цвета схемы в переменные, которые зависят от одного базового цвета и использовать это в CSS-препроцессоре? Об этом мы узнаем далее: зачем нам это, какие юскейсы возможны с цветами и схемами в LESS (Sass), а также какие сервисы помогут нам в превращении двух цветов в один и функции над первым. Статья будет интересна тем, кто использует CSS-препроцессоры, переменные в них, а также функции/примеси.

Это первая из двух статей, рассказывающая о тестировании с помощью gremlins.js и grunt-gremlins. Первая статья — перевод официальной документации gremlins.js. Вторая — опыт внедрения gremlins.js в реальный проект при помощи grunt-gremlins.

Gremlins.js это monkey testing библиотека написанная на JavaScript, для Node.js и браузеров. С ее помощью проверяется надежность веб-приложений под полчищем гремлинов.

Kate: What are they, Billy?
Billy Peltzer: They're gremlins, Kate, just like Mr. Futterman said.

Broccoli является новой системой автоматической сборки. Её вполне можно сравнить с Rails asset pipeline, однако есть и некоторые различия: он запускается на Node.JS и не зависит от серверной части приложения.

После длинной вереницы 0.0.х альфа релизов, я только что выпустила первую бета версию, Broccoli 0.1.0.

Оглавление:

1. Быстрый пример
2. Мотивация / Особенности
3. Архитектура
4. За кулисами / Общий взгляд
5. Сравнение с другими системами сборки
6. Что дальше?

Привет, Хабр!

Вместе с хорошим известием для Северного полушария, что продолжительность светлого времени суток увеличилась, мы хотим рассказать о релизе IntelliJ IDEA 13.1, случившемся на этой неделе. Но перед рассказом о новинках хотелось бы отметить еще одно, весьма ожидаемое всем Java-cообществом, событие…

Недавно появился проект pako, это порт на яваскрипт известной библиотеки для компрессии и декомпрессии данных — zlib.

Очень любопытен результат тестов.

От переводчика: в статье рассказывается о новом планировщике задач в библиотеке WinJS 2.0, обновившейся вместе с выходом Windows 8.1. Для понимания части материала крайне желательно понимание работы с отложенными результатами (Promise). См. раздел MSDN, посвященный асинхронному программированию на JavaScript.

Не считая рабочих веб-процессов (web workers) и фоновых задач, которые также выполняются как отдельные веб-процессы, весь JavaScript-код в приложениях для Windows Store выполняется в общем так называемом UI-потоке. Этот код может делать асинхронные вызовы WinRT API, которые выполняют свои операции в отдельных потоках, но есть один важный момент, о котором нужно помнить: результаты из этих не-UI-потоков возвращаются назад для обработки в UI-поток. Это означает, что запуск серии асинхронных вызовов WinRT (например, HTTP-запросов), — всех сразу, — может потенциально перегрузить UI-поток, если результаты от них придут примерно в одно и то же время. Более того, если вы (или WinJS) добавляете элементы в DOM или изменяете стили, которые требуют обновления компоновки страницы в UI-потоке, это создает еще больше задач, конкурирующих за ресурсы CPU. Как результат ваше приложение становится «тормозящим» и неотзывчивым.

В Windows 8 приложение может предпринять ряд шагов для снижения таких эффектов, например, запускать асинхронные операции в рамках временных блоков, чтобы управлять частотой возвратов в UI-поток, или объединять вместе задачи, требующие цикла обновления страницы, чтобы за один проход выполнялось больше операций. Начиная с Windows 8.1, появилась возможность асинхронно расставлять приоритеты разным задачам непосредственно в UI-потоке.

basis.js – JavaScript-фреймворк для разработки одностраничных веб-приложений, ориентированный на скорость и эффективность. Возможно он пока не такой популярный. Но благодаря моим выступлениям на различных конференциях и meetup'ах, некоторые уже слышали о нем и заинтересовались. Однако, чтобы начать использовать фреймворк или разбираться в нем, большинству не хватает руководства.

И вот, собрав волю в кулак (ну какой программист не любит писать документацию?), я сел писать руководство. Просто, доступно, последовательно.

Написав первую часть, я дал прочесть другим. Они прочитали и убедили меня, что это обязано быть опубликованным на Хабре. Ведь, что может лучше рассказать об инструменте, чем примеры его использования?

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

Использование AngularJS в паре с RequireJS — достаточно популярный подход к разработке веб приложений в последнее время. И один из основных вопросов — структура приложения. Существует достаточно известный seed для такого приложения tnajdek/angular-requirejs-seed, но мне это не походит, так как при увеличении функционала приложения — данная структура просто будет засоряться кучей файлов, не будет никакого логического разделения скриптов и достаточно сложно будет их менеджить.

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

Привет Хабр!

Изначально хотел назвать статью «HTML по ГОСТ`у», но потом выяснилось что у большинства программистов не было предмета «Метрология и стандартизация» и о «стандартизации», «сертификации», «унификации» не все слышали.

В i-Free я много занимаюсь разработкой веб-приложений. А поскольку их много, они разные и работают в разных условиях, то само собой приходится задумываться о стандартизации. Есть такой проект «Пуленепробиваемый HTML5» (http://html5boilerplate.com/), в котором разработчики решили создать идеальный шаблон странички. Он мне очень нравился, и все свои проекты я начинал именно с него. Но, исправляя баг за багом, делая все новые и новые приложения, я пришел к выводу, что многого в нем не хватает. В этой статье я хотел бы рассказать о том, что обычно пропускают при написание страничек и веб-приложений и показать, чем и зачем я прокачал свой шаблон пустой странички.

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

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

В статье будет рассмотрен пример реагирования веб-старницы в браузере на окружающую освещенность.

Я предполагаю, что эта статья будет интересна тем, кто знает и умеет HTML&JavaScript, но не пробовал силы в разработке приложений для Win8. Для того, чтобы пройти эту статью и кодить в сласть необходимо иметь на борту VS 2013.

В статье будут рассмотрены ключевые аспекты разработки приложений для платформы Win 8.1. А именно:

1. Жизненный цикл работы приложения;
2. Promise;
3. Работа с DataSource;
4. Создание собственных контролов;
5. Работа с темплейтами;
6. Tile-ы;
7. Share;

Для тех кто не любит читать, как я, например, исходники я выложил на github.com/Sigura/HubraWin,

Когда начались утечки баз паролей/хэшей с разных форумов и соц. сетей я начал задумываться о том как и где хранить свои пароли, что бы их можно было быстро менять и при этом не забыть. Так я наткнулся на программу KeePass Password Safe, о её возможностях я расписывать не буду так как на Хабре статей предостаточно и тематика данной статьи не о его возможностях. По мере эксплуатации KeePass обрастал плагинами, особенно для связки с браузерами, LastPass был отброшен так как не хотелось где-то «у дяди» хранить пароли (особенно к рабочим системам), да и не факт, что их от туда тоже не сольют.

Сначала для Firefox было расширение KeeFox, но так как через KeePassRPC (плагин KeePass) работает только оно — то сейчас это расширение давно отключено и не используется. Затем было найдено расширение PassIFox (работает через плагин KeePass — KeePassHttp) с ним же сразу и ChromeIPass — а вот для Opera 11, Opera 12 (здесь и в дальнейшем подразумевается на движке Presto и это мой основной браузер) хорошей интеграции не было, был только UserJS-скрипт добавляющий в заголовок окна адрес страницы, было даже создано расширение делающее тоже самое — для того чтобы KeePass мог определить адрес для которого нужно искать логин и пароль для подстановки по Ctrl+Alt+A (стандартный хот-кей авто-заполнения KeePass). Так как современных навыков по JavaScript у меня нет, я попытал счастья на OperaFan с просьбой написать/переделать расширение для Opera — где меня и назвали параноиком. Продолжение истории о портировании ChromeIPass в Opera 12 (без сильно технических деталей) под катом.

В компании, занимающейся выпуском приложений для Smart TV я начал работать в 2013 году, выбрав её как по удобному расположению от дома (35 минут на велосипеде, 8 км), так и по интересному кругу задач, которые составляли IPTV- и Smart TV — проекты.

С тех пор разработчики и заказчики часто спрашивают меня об особенностях работы в окружении браузерного движка Smart TV, приходится повторять не слишком простые, но интересные особенности, которые слушателям хотелось бы знать и иметь под рукой в качестве справочника. Формат статьи, думаю, идеально подходит для информации по этой теме, тем более, что разработчики из других групп и городов тоже предоставляли сообществу такие обзоры. Объединение знаний сложит необходимую картину из разбросанных паззлов отдельных взглядов. Будем координировать их сборку вместе, и…

Поступила ко мне такая задача, есть сайт на Magento и заказчик желает мониторить ошибки заполнения форм на сайте в Google Analytics (GA). Как всегда на сайте есть и Prototype и jQuery ну и куча JS лапши в придачу, в общем все как обычно. Сначала я нагородил громоздкое решение, но потом в голову пришла хорошая идея, которой и хочу поделиться с хабрасообществом.

Я стал замечать, что в последнее время build-системам стали уделять всё больше внимания, и, под влиянием этого, их в одночасье стало настолько много, что, честно говоря, уже всех и не упомнить. Последнее время у меня на слуху четыре системы: Grunt, Gulp, Brunch и Gear. Про все что-то где-то было написано, но ни разу не ставился вопрос о том, какие преимущества или недостатки они имеют друг перед другом? И именно поэтому я решил провести сравнительный анализ самых популярных build-систем(по версии google).

Но сперва надо определиться с критериями, по которым мы будем оценивать эти системы:

• Начало работы.
• Производительность. Никто не хочет ждать по минуте после изменения одного coffee-файла.
• Документация. Чем нагляднее и проще — тем лучше.
• Плагины. Ведь мы не хотим столкнуться с проблемой, когда мы начали использовать билд-систему, а в ней нет адаптера, скажем, для jasmine?

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

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

Colour Schemes

Репозиторий уже набрал более 4000 старов на GitHub. Автор проекта — Dayle Rees — один из участников команды Laravel PHP, где люди убеждены, что «код должен приносить удовольствие разработчикам, а не только пользователям, принимающим вашу трудную работу». Сolour Schemes на сегодняшний день это 56 различных тем для: Sublime Text (2 & 3), Sublime Text UI (2 & 3), Textmate, Coda 2, VIM, Jetbrains Editors (inc. PHPStorm), Google Code Prettify, Highlight.js и Xcode.