Angular: $scope.$on() – listen to several events

I found it quite strange that AngularJS does not have possibility to watch several Angular-events, i.e.:

[javascript]
$scope.$on([‘user.login’, ‘user.logout’], callback);
[/javascript]

and I decided to extend $on method, to make it handle such case:

[javascript]
var $onOrigin = $rootScope.$on;
$rootScope.$on = function(names, listener) {
var self = this;

if (!angular.isArray(names)) {
names = [names];
}

names.forEach(function(name) {
$onOrigin.call(self, name, listener);
});

};
[/javascript]

Sandbox for this code you can find here.

 

Отличие Streaming от Progressive Download и Adaptive Streaming

Сейчас начал заниматься оптимизацией и улучшением нашего фронт-энд проигрывателя и копнул тему, которой раньше не касался – передача медиа потока. Так вот оказывается существует 3 основных варианта передачи:

  • streaming – будет работать нормально только в случае, если скорость соединения превышает необходимую для передачи, иначе видео будет постоянно дергаться.
  • progressive download – плохое соединение решается путем предзагрузки, то есть видео не начинает воспроизводиться пока не загружено Х секунд наперед.
  • adaptive streaming – существует несколько форматов различного качества и в случае плохого соединения автоматически идет переключение на более низкое качество.

Десктопное приложение для Mac на JavaScript

Оказывается Objective-C теперь можно писать на JavaScript, точнее обращаться к его свойствам. Вот тут на хабре разбирается пример как это делать. Если лень читать все – под катом я делаю выжимку из статьи.

Continue reading

Отличие $applyAsync от $evalAsync в Angular 1.3

Пост подготовлен на основе статьи “Scope.$applyAsync() vs. Scope.$evalAsync() in AngularJS 1.3” от Ben Nadel.

Из Angular1.2 мы все знаем метод скоупа $evalAsync, который позволяет вызывать код асинхронно (относительно цикла дайджеста) не прибегая к использованию сервиса $timeout.

В Angular1.3 был добавлен еще один метод – $applyAsync. После прочтения документации может оказаться, что по прежнему не ясно отличие этих 2х методов. С этим мы и попробуем разобраться в посте.

Continue reading

Dnsmasq для локальной разработки под Mac

Так как наш проект использует динамические поддомены, то есть, кроме основного www.studytube.com, может быть еще сколько угодно XXX.studytube.com. Для локальной среды мы настроили домен studytube.dev. Но тут же появился вопрос: как сделать так, чтобы не нужно было каждый раз прописывать в хосты новый поддомен. Wildcard опцию, то есть возможность указать *.studytube.dev, к сожалению, /etc/hosts не поддерживает.

К счастью, на помощь к нам пришел локальный DNS-сервер Dnsmasq.

Continue reading

Simple script to migrate from Angular1.* to Angular2.0

Angular team is still working on this script, but Todd Motto has already provided us first version. It’s really simple:

[javascript]
var ngMigrate = (function () {

var v2uri = ‘https://code.angularjs.org/2.0.0-alpha.19/angular2.js’;

return function (version) {
var v1 = document.querySelector(‘script[src*=angular]’);
if (!v1) return;
var body = document.body;
var script = document.createElement(‘script’);
script.async = script.src = v2uri;
body.removeChild(v1);
body.appendChild(script);
};

})();

ngMigrate(‘2.0’);
[/javascript]

Here you can play with the code.

And one more brilliant idea from Todd – here – tool to define which type of service you should use (service, factory or provided). You can safely provide this link to you colleagues if somebody asks you to help with this question.

AngularJS external links

I found it was not very obvious how to have external link that coincides with you application base.

For example you have application on http://somedomain.com and on http://somedomain.com/admin you have another application. And even with href (not ng-href) and the absolute path your second application will be not accessible by link from first one. The router will keep you inside application.

The only way to solve it is to use href together with target="_self" attribute:

[javascript]
<a href="/admin" target="_self">Admin</a>
[/javascript]

And yes, this option is documented, but why it’s so hard to find?