JavaScript *

Глава семнадцатая, в которой фронтэнд-разработчики Uprock переходят от GTA к альтернативным путям применения YouTube и практическому применению модели акторов.



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

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

Сегодня я вам расскажу про одно очень интересное сообщество под названием NodeSchool. Данное сообщество продвигает обучение по платформе node.js

Приглашаю всех любителей электронной музыки и программирования, поиграться в синтез мелодий с помощью Code Music Studio.

Неделя 30-ти строчных JS давно прошла, но воодушевлённый постами Разрабатываем Flappy Bird на Phaser (Часть I) и Как Минковский во Flappy Bird играл, я не смог удержаться не попробовать написать ASCII-версию игры «Flappy Bird» на JavaScript и уложиться при этом в 1024 символа.

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

Приветствую, уважаемое Хабрасообщество!

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

Сейчас библиотека выложена с парой примеров на GitHub, а под хабракатом хотелось бы осветить некоторые тонкости её применения и часть внутренней логики. Буду рад, если моя библиотека поможет кому-то сэкономить n-ое количество времени и позволит избежать изобретения собственного велосипеда.

Кому интересно — добро пожаловать под кат.

Достаточно распространенная задача — поменять местами элементы в списке. Но как правило эта задача решается жуткими костылями, особенно если это Drag&Drop.
Сейчас я расскажу вам очень простой и гибкий способ сделать это, используя Marionette.js и jQuery UI Sortable.

Привет, Хабр.
PRT расшифровывается как personal rapid transit. Это автоматический транспорт, управляемый компьютером и перемещающийся по специальным путям. Вот ссылки на википедию по-английски и по-русски. В Лондоне, в аэропорту Хитроу уже пару лет работает действующая система. А японцы сделали такой транспорт ещё в 70-е годы, но потом запретили. Как сказано в википедии: проект CVS (Computer-controlled Vehicle System) был закрыт после того, как Министерство территории, инфраструктуры и транспорта Японии заявило, что система небезопасна и не соответствует существующим правилам о минимальной дистанции. Поэтому для внедрения этого вида транспорта надо будет принять специальный закон.

Для начала я хочу сказать каким я вижу PRT-транспорт — это гениальное изобретение, позволяющее доехать до станции назначения без остановок на перекрёстках и станциях. Я считаю, что колёса должны быть резиновые, как в Лондонском варианте, как у автомобиля. Но питание должно быть не от аккумуляторов, а от контактного рельса. И кабинки должны быть не 4-местные, а одно- и двухместные (одно за другим), что позволит сделать более узкие пути.

Вот здесь написано, что система управления PRT-транспортом бывает синхронной, асинхронной, транс-синхронной, квази-синхронной и Asynchronous Point Follower. Насколько я понял, то, как я вижу PRT-транспорт это и есть синхронная система управления. А вижу я так: по путям двигаются строго по предписанию и на заданном расстоянии транспортные средства (ТС) или их отсутствие. Так сказать электроны и дырки, если сравнивать с полупроводниковыми приборами. При посадке пассажир указывает станцию назначения. Центральный компьютер получает эту информацию, вырабатывает путь движения и отправляет его на ТС.

Когда девять месяцев назад я написал для себя маленькую консольную утилиту, я и не подозревал, что вскоре она превратится в серьёзный и единственный в своём роде инструмент, которым будут пользоваться даже такие известные всем команды, как jQuery, Bootstrap, Angular. Сейчас, когда я пишу эту статью, у моего проекта на гитхабе 1010 звёздочек, и мне очень радостно думать о том, что так много людей смогли с помощью моей придумки сделать свою работу удобнее.

История этого проекта началась с моей личной боли.

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

Есть замечательный сайт http://todomvc.com/, на котором демонстрируется решение одной и той же задачи с помощью разных JavaScript MV* (Model-View-[Controller]) фреймворков. Сейчас там представлены десятки различных фреймворков, у каждого из которых есть свои преимущества и недостатки. Есть там и такие гиганты, как Angular, Ember и Backbone. Несмотря на высокую конкуренцию, я все равно хотел бы продемонстрировать свой MV* фреймворк — jWidget.

Я быстро просмотрел все решения, представленные на сайте TodoMVC, и не нашел ни одного фреймворка, похожего на jWidget. Дело в том, что, помимо JavaScript, я много программирую на объектно-ориентированных языках программирования, таких как Java, C#, а в прошлом и на C++. Поэтому я большой фанат объектно-ориентированного программирования, SOLID принципов и паттернов объектно-ориентированного проектирования. Мне не нужен фреймворк, который стеснял бы меня в возможности применения стандартных объектно-ориентированных решений. То, что я увидел в существующих решениях TodoMVC, не внушает доверия в этом отношении. Как правило, они предоставляют некий декларативный синтаксис и мощный шаблонный движок, но объектно-ориентированная основа всего этого, даже если она существует, скрыта от наших глаз.

В этом посте вы узнаете о новой фиче Marionette.js — Behaviors.

Очень часто в различных элементах интерфейса у нас встречаются похожие элементы управления (например кнопка «Удалить» может быть и у категорий, и у записей, и в списке зарегистрированных пользователей… да везде), и каждый раз приходится описывать обработчик этой кнопки в каждом View, причем везде одинаково.
Но это уже называется дублирование кода, и не приветствуется в большинстве общества. Поэтому разработчики Marionette.js предоставили нам такую замечательную фичу как Behaviors.

Behaviors предоставляет интерфейс для изолирования описаний взаимодействия DOM с пользователем в отдельные логические куски кода. Behavior может быть применено к любому View любое количество раз.

В этой статье рассмотрим самый тривиальный пример — кнопка «Удалить».

Скажу сразу, что стандартная реализация такого взаимодействия — существует.

Однако, поскольку эта статья — продолжение темы «Простой вызов удалённых сервисных методов в одностраничных приложениях», здесь будет приведена альтернативная схема взаимодействия, необходимая для замены ajax на вебсокеты, в контексте подхода (jrspc), описанного в вышеупомянутой теме.

В первой статье — был описан механизм вызова сервисных методов, с использованием ajax.

В этой статье — описано, как можно реализовать данный механизм, с заменой ajax на вебсокеты, не меняя код бизнес-логики приложения.

Такая замена даёт более быстрое соединение(тесты в конце), экономию серверной памяти, и добавляет возможность вызывать методы клиента с сервера.

Для демонстрации, написано небольшое чат-приложение, с исходным кодом на гитхабе.
на примере разбора которого, я попытаюсь объяснить, как реализованы клиентская и серверная части такого взаимодействия.
Приложение работает на сервере tomcat 7.042.
Поддерживает https и wss (сертификат неподтверждённый), и не ведёт логов на сервере.

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

PourOver

Библиотека для реально быстрой фильтрации и сортировки огромных коллекций, где речь идет о сотне тысяч элементов. PourOver построен на идеально простых запросах, которые могут произвольно формироваться друг с другом. Вы сможете объединять, скрещивать и разделять запросы. PourOver будет помнить как были построены ваши запросы и по-умному обновлять их, если появятся новые элементы или будут изменены старые. Работает на IE7+, Firefox 4+, Safari 5+, Opera 9+, Chrome 1+.

Стоит также заметить, что это проект от New York Times, на корпоративном Гитхабе которого есть еще популярный backbone.stickit плагин для датабиндинга и Tamper — serialization protocol for categorical data. В последнее время гики из западных СМИ прямо раскочегарились — вот недавно я писал про классные проекты от The Guardian и Financial Times.

Несколько дней назад произошло одно важное событие в развитии JS фреймворка Kendo UI от компании Telerik. Они выпустили OpenSource версию продукта, под лицензией Apache v2 — Kendo UI Core. На деле же всё оказалось не так просто и однозначно.

Ранее вся библиотека Kendo UI выпускалась под лицензией GPL v3, что не разрешало использовать её бесплатно в коммерческих продуктах, для коммерческих приложений на основе этой библиотеки была разработана Kendo UI commercial license. Но для OpenSource же эта библиотека была настоящим подарком. Конечно же есть и другие аналогичные библиотеки и у них огромное количество своих поклонников. Плюсами Kendo можно считать:
1) Полная поддержка JQuery
2) Большое количество виджетов, что позволяет обойтись одной JS библиотекой (не считая jquery) в большинстве случаев
3) Качественные и приятные темы оформления
4) Отличная поддержка Twitter Bootstrap. Для kendo даже есть своя тема оформления bootstrap, для одновременной работы с CSS фреймворком.

Достал из черновиков, чтобы поделиться с друзьями, пост довольно старый, можно не обращать внимания

Этот пост навеян вот этим постом: тыц.

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

Число JS-библиотек ни в коей мере не уменьшается; наоборот, оно растёт с каждым днём. Когда мы доходим до приложений JS, лучшим выбором оказываются шаблоны, чем полноценные библиотеки, потому что это приводит к более чистому базовому коду и лучшему процессу работы с ними.

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

Раньше автокомлит работал только в JS — в запущенном приложении COLT находил нужный объект и смотрел его структуру. Теперь внутри {{}} и атрибутах директив в списке автокомплита появился выбор всех поля и методов из текущего $scope.

Счетики функций COLT — как пользоваться. В чем профит.

При запуске сессии разработки с помощью COLT, каждая функция JavaScript снабжается специальным кодом, который позволяет вести статистику по потоку исполнения. Одно из полезных возможностей — прямо в коде видеть сколько раз была выполнена та или иная функция — видеть счетчики функций.

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

Статья устарела. См. актуальную историю версий.

• Введение
• Наследование
• MK.Object
• MK.Array
• Matreshka.js v0.1
• Matreshka.js v0.2
• Реализация TodoMVC

(Все предыдущие статьи обновлены до актуального состояния)
Репозиторий

Сайт (там же и документация)

Всем привет. Прошло 5 месяцев после последней публикации серии статей о Матрешке. С тех пор исправлен небольшой ряд найденных ошибок, появилось несколько удобных фич, в том числе и под влияниев ваших комментариев, проект обрел спонсора в лице Shooju, получил логотип и нормальный, не-бутстраповский сайт.

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



Такая организация имеет свои неоспоримые достоинства, например синхронизация игровых состояний клиентов на сервере, простота в реализации и почти фиксированные задержки до пользователя. Там где есть плюсы, обычно обитают и минусы — это ограниченная пропускная способность сервера и довольно большие задержки, если клиент находится далеко от вашего сервера. Как с ними бороться подробно написано в блоге 0fps.net и есть возможность эти проблемы довольно эффективно решать оставаясь в любимой «звездочке» — купить больше серверов, но что делать если вы студент вы ограничены в финансах и горизонтальное/вертикальное масштабирование для вас не вариант?

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