JavaScript *

Те, кто использует HTML5 Canvas знают, что картинку нельзя использовать через URL к ней. Картинку нужно сначала загрузить либо через тэг img, либо через объект Image, либо через data: url.
Чтобы не думать о загрузке каждой картинки, делают загрузку всех необходимых картинок перед отрисовкой самой сцены. В этом топике я приведу в пример свой загрузчик изображений, который использует Mootools с его механизмов для работы с классами.

Не забывайте, уважаемые джаваскрипт-программисты, в строковых константах указывать амперсанд как "&", а не просто как "&". Ибо иначе результаты будут очень браузеро-зависимы:

document.body.innerHTML = "http://example.org/get.php?test";
document.body.innerHTML += "&ok";
document.body.innerHTML += "&wonderful";

Результат:

Firefox:	http://example.org/get.php?test&ok&wonderful
Chrome:	http://example.org/get.php?test&wonderful
IE:	http://example.org/get.php?test

Не так давно из лекции Дугласа Крокфорда я узнал об очень интересной технике «шаблонизирования» в JavaScript. Основная цель техники заключается в том, что мы получаем с сервера JSON и потом как-то формируем из этого HTML. Во многих ситуациях этот процесс оставляет желать лучшего потому, что формирование HTML происходит или с помощью конкатенации строк или ряда операций createElement, appendChild и т.п. Возможно многие уже знают об этом решении, но для тех кто не знал надеюсь будет полезно.

Увидел недавно топик-ссылку Smokescreen — конвертер flash в html5\js, решил сделать перевод той информации, которую я уже читал в сети про этот новый инструмент. Если коротко: Smokescreen — новый проект с открытыми исходниками, направленный на преобразование Flash в JavaScript/HTML5 для лучшего взаимодействовия с веб-страницей там, где раньше это было невозможно.
С его помощью вы можете расширить поддержку своего проекта на новые платформы без изучения новых инструментов, Flash автоматически преобразуется в JavaScript/HTML5. Smokescreen будет выпущен под open source лицензией и будет распространяться бесплатно. Стоимость поддержки и обслуживания будет низкой, чтобы вы могли убедиться, что Smokescreen работает именно так, как вам необходимо. Библиотека даст вам широкий выбор инструментов для разработки, включая разработку на JavaScript, без использования ActionScript, и разработку с подключением Flash к HTML-страницам проекта.

Всем привет!

Этим летом будут мастер-классы в нескольких городах.

17-18 июля в Москве.
24-25 июля в Киеве.

Ведущий — Илья Кантор ( javascript.ru, algolist.manual.ru, еще пара слов на странице мастер-классов).
Программы:

• Профессиональное javascript-программирование.
• Сложный AJAX и COMET: тонкости Web 2.0.
• Мастер-класс по клиентской оптимизации.
• Секреты jQuery.

Более подробно программу вы можете прочитать на javascript.ru/mk

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

Мероприятие платное, но цена очень доступная. Сейчас это 1300 руб / 350 грн за мастер-класс.

Регистрация открыта на javascript.ru/mk, там же больше информации о мастер-классах.

P.S. На этом же URL — планы по другим городам.

Данная статья посвящена Appcelerator Titanium — платформе для создания мобильных и десктопных кроссплатформенных приложений на JavaScript (HTML+CSS в придачу). Развитие платформы, особенности, варианты использования, личный опыт

Некоторое время назад, я публиковал топик про 3D с z-buffer-ом, субпиксельной точностью и освещением по Гуро на javascript с использованием канвы.

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



Это всего-лишь тестовые наработки, но, тем не менее, они работают (а лучше посмотрите сами).

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

Это часть фреймворка, который я сделал для своей платформы Akshell, вот полный код решения и документация. Однако оно может пригодиться в любой Server-Side JavaScript среде, на стороне сервера удобное создание иерархий классов особенно актуально. Его можно использовать и на клиенте, если заменить работу со свойством __proto__ оператором new.

Недавно Гугл позволил проговаривать текст с помощью Text-To-Speech API. Теперь возможно и обратное преобразование речи в текст.

Используя speechapi.com возможно построение интересных речевых веб-ресурсов включающих двустороннее текст-в-речь и речь-в-текст (speech-to-text as и text-to-speech) преобразования.

Это стало возможным благодаря использованию различных технологий: flash используется для доступа к микрофону и потоковому аудио, Red5 — как разносторонний медиа сервер с открытым исходным кодом.

(Ссылка на оригинал)
UPD: перенес в Javascript

Пример использования API:

Marak Squires выпустил в свет JSLINQ — реализацию LINQ для JavaScript, работающую как на стороне браузера, так и на стороне сервера (к примеру, node.js). Поддерживаются такие конструкции, как JOIN, UNION, RANGE, DISTINCT, COUNT etc.

Смотрите:

• Код и примеры на GitHub;
• Живая демонстрация на сайте автора.

— Здра…
— А-а-а!
— Ну ты чего?
— Я вас боюсь!
— Чего это?
— Вы вечно меня унижаете…
— Хех, ну ладно, больше не буду.
— Правда?
— Доо, хочешь конфетку с аяксом?
— Конечно!
— Тада давай, лети к нам в Питер. Вот список авиарейсов на которые есть билеты отсортированный по цене: rasp.yandex.ru/search?cityFrom=Санкт-Петербург&cityTo=Москва
— Эм… что-то вы наврали дяденька — там вообще все рейсы из Москвы в Питер, отсортированные по времени отправления.
— Гм… действительно, не хорошо получилось… а значешь почему?
— Нэ?
— Потому что состояние приложения не отражается на uri. Поэтому каждый раз заходя на эту страницу из закладок, тебе придётся заново устанавливать фильтрацию и сортировку.
— Блоо, как же быть?

Я думаю многие пользуются DataBinding`ом в .NET, она же привязка данных. Она позволяет, при выделенной модели данных и независимом визуальном представлении, забыть о синхронизации данных с формой. Привязав один раз properties модели к элементам представления, мы избавляемся от десятков обработчиков onChange и подобных для изменения полей модели, а в случае изменения поля вне gui-интерфейса (например синхронизация модели с базой), мы не будем мешать уровни абстрации, чтобы обновить textBox.text. Давайте данные будут отдельно, gui отдельно. Плюс мы получаем наглядный, легко переносимый код на asp.net или даже на другой язык/платформу.

 

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

— Здравствуй…
— А-а-а! Памагите! Убивают! \(0_0)/
— Дружок, спокойно, я свой :-\
— Свои незаметно сзади не подкрадываются! \(@_@)/
— А я динамически добавился В-]
— Э-э-э \(~_~)/
— Ясно, не знаешь, как реагировать на такие ситуации? XD
— Ну… как бы… есть мысли… \(=_=)/
— Покажи-ка свой исходник %-)
— Я… эта… стесняюсь… \(._.)/
— Давай, не боись, я же свой ;-)
— Лаааадно \(-_-)/

<body><br>    <script><br>        $(function(){<br>            $('.c-example').wrapInner( '<span class="wrapper" />' )<br>        })<br>    </script><br>    <div class="c-example">epic</div><br></body>

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

C помощью библиотеки CanVG, в тэг можно отрисовывать SVG файлы.
Посмотреть на различные SVG-шки и даже вставить свою можно на тестовой страничке.
Надо сказать, что сложные изображения довольно сильно нагружают браузер, к примеру, world

via Ajaxian

Недавно проделана работа по написанию пользовательского скрипта (браузеры Firefox, Chrome и Opera), в котором понадобилось обращаться к документу XML, находящемуся в старшем домене 2-го уровня из домена 3-го уровня. Работа открыла взгляд на некоторые особенности поведения браузеров, особенно, Оперы, причины которых до конца не выяснены. Но, так как такой скриптинг (чтение и запись в документы XML в наддомене) иногда необходим, хотел бы поделиться практическими результатами и показать открытые вопросы.

Предлагаю вашему вниманию мастер-классы по Javascript.

В апреле-мае пройдут мастер-классы по javascript в Москве и Санкт-Петербурге.
Даты — 24 и 25 апреля для Москвы, 29 и 30 мая для Санкт-Петербурга.

Все мастер-классы веду я, Илья Кантор ( javascript.ru, algolist.manual.ru, еще пара слов на странице мастер-классов).

Темы мастер-классов:

• Профессиональное javascript-программирование.
• Сложный AJAX и COMET: тонкости Web 2.0.
• Мастер-класс по клиентской оптимизации.
• Секреты jQuery.

Более подробно программу вы можете прочитать на javascript.ru/mk.

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

Мероприятие платное, но цена очень доступная.
Даже можно сказать, символическая.
Приходите, узнаете много нового.

Регистрация открыта на javascript.ru/mk, там же больше информации о мастер-классах.

Решил сделать интерактивную турнирную таблицу-график для футболного чемпионата России. Вот такую:



Выбор инструментов был прост:

• табличка для браузера — значит, что-нибудь из вэб-технологий;
• нужна векторная графика;
• никаких закрытых либо сложных приложений при создании — я все-таки не вэб-дизайнер.

В итоге выбор естественным образом пал на связку SVG+JavaScript (что, правда, исключило IE из списка поддерживаемых браузеров).

URI-fragments (они же fragment identifiers, hash, закладки, якоря) в последнее время стали активно использоваться в интерактивных веб-приложениях как удобное средство для указания прямых ссылок на различные элементы интерфейса и состояния приложения. Наиболее ярким примером использования fragment-адресации является GMail. Как Вы могли заметить, папки Входящие, Отправленные, Черновики имеют ссылки, оканчиващиеся на #inbox, #sent, #drafts. Переход между ними не приводит к перезагрузке всей страницы (обновляется только список писем), но в то же время при открытии каждой из них в отдельном окне/вкладке мы сразу же попадаем на искомую страницу.

Реализации такого удобного механизма навигации средствами JavaScript посвящена данная статья

I was impressed! Вроде бы все понятно и давно известно, но в голову не приходило.

	var store = {
		id: 1,
		cache: {},
		add: function( fn ) {
			if ( !fn.uuid ) {
				fn.uuid = store.id++;
				return !!(store.cache[fn.uuid] = fn);
			}
		}
	};

	function ninja(){}

	assert( store.add( ninja ), "Function was safely added." );
	assert( !store.add( ninja ), "But it was only added once." );

Взято из Secrets of JavaScript ninja by John Resig