Как-то раз я приуныл, делать ничего не хотелось, и тут я вспомнил, что в детстве мне сильно хотелось иметь пульт видео наблюдения, как у какого-то злодея из кино, который сидит в темной комнате и хохочет, наблюдая за беспомощными людишками, которые пытаются найти выход. Ну и освежив свои детские воспоминания, я решил воплотить их в жизнь, ну ту часть с пультом наблюдения, без людишек. И тут моим другом стал шагающий семимильными шагами HTML5, а если точнее Stream API.
Так как я раньше уже использовал getUserMedia для захвата звука с микрофона, я подумал, что с видео тоже не будет никаких проблем, но они все же вылезли на свет. Т.е. проблем с самим захватом видео-потока не было, а вот с одновременным выводом данных с нескольких источников на одной странице оказалось не все так просто, как хотелось.

Итак, начнем с самого начала, а именно с захвата и вывода видео с одного источника. Для этого мы будем использовать ф-ю getUserMedia, которая поддерживается во всех нормальных браузерах старших версий (Stream API), ну разумеется кроме IE.

Иллюстрация к последней задаче.

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