Print This Post HTML5 пианино

Суббота, 11. Декабрь 2010
Раздел: HTML/JS, автор:

Недавно пересматривал старый фильм Amadeus и захотелось тоже что-нибудь сыграть на фортепиано, но так уж сложилось, что мой синтезатор позаимствовал dx, а другого инструмента у меня не имеется. Поэтому решил поизвращаться и сделать свое "фортепиано" с использованием HTML5.
Реализация довольно простая. Клавиши рисуются в элементе canvas, создается элемент audio для каждой ноты и, соответственно, при нажатии клавиши определяются координаты курсора, высчитывается, в область какой клавиши было совершено нажатие и играется сэмпл (каждая нота хранится в отдельном ogg-файле).
Живой пример можно посмотреть здесь.
Все файлы одним архивом: скачать.

P.S.

 Обсудить на форуме


Получать обновления на почту:     

Метки: , , , , , .

Комментариев: 15 к “HTML5 пианино”


  1. laver :

    прикольно придумано

    [Ответить]

  2. мне тоже нравится

    [Ответить]

  3. Минималистично и круто :)

    [Ответить]

  4. можно оборудовать под капчу, сначала играет мелодия, а потом ты ее повторяешь=)

    [Ответить]

    Kaimi:

    Так звук распознавать тоже можно автоматически...

    [Ответить]

  5. MULTI XYNTA

    [Ответить]

    Kaimi:

    Что такое "MULTI"?

    [Ответить]

    dx:

    Он же якубович, не парься. Возраст не тот уже.

    [Ответить]

    якубович:

    Приз в студию!

  6. Парни, немного не в тему.
    1. Залез в статьи про асм почитать, а они там не работают, мол 404.
    2. Обменяемся ссылями на блоги? Там некоторые линки у вас здохли, почекайте.
    3. До каими не мог достучаться в асю.

    [Ответить]

    Kaimi:

    1. Это какие статьи "не работают"?
    2. Как угодно. В списке ссылок на другие сайты не работает только одна.
    3. У меня никаких фильтраций в icq не стоит.

    [Ответить]

    [Bo0oM]:

    Пишем регер на асм. Грит не найдено)

    [Ответить]

    Kaimi:

    А, потому что стерто давно было


  7. Гитеша :

    Как влиять на длительность ноты? Если хочешь что-нибудь толковое сыграть как минимум длительность ноты надо уметь менять...

    [Ответить]

    Kaimi:

    В данном случае скорее всего никак, так как играются статичные ogg-файлы.

    [Ответить]


Оставьте ваш комментарий