HTML партитуры
ХРИСТОС ВОСКРЕСЕ!
Странно как-то. Вот смотришь, всё так развивается! Уже и 3D-онлайн на страница сколько лет, да потихоньку переливается из VRML и всяких x3D в простые JS-скрипты с саnvаs-тэгом, о чём я недавно всё тут прожужжал... А вот со звуком, застой какой-то. Ни тэга нормального, ни средств приличных... Ну можно там миди подключить, mp3 к странице. Но динамически генерировать - никак! SWF скажите? Но так давайте ещё предложите голую html-страницу сделать и тупо весь интерактивный динамичный интерфейс во флэш сделать! Мне это никак не подходит... На днях закончил для code.google ассемблер. Ещё с прошлого года писал. Установил Chrome, FireFox, Opera - с потом и терпением везде заставил работать. А вот в IE - глючит. Если раньше я писал только под IE, то за год - разучился. Даже регулярные выражения еле нашёл где глючат. Везде работают, а в IE - скобки лишние пришлось добавить... И вот. Товарищи! Что за дела со звуком? Будет ли алгоритмическая поддержка звука в HTML с динамической генерацией в JS в ближайщее десятилетие? Что-то всё зациклилось на визуальных наворотах. Когда в Си я изучал DirectX, звук одолеть так и не смог. Писк - визг получал, а дальше. Сцена OpenGL легче давалась. Игрушки делал. А звук... Используя Bass/FMod библиотеки чувствуешь себя легче, как и с OpenAL. Но без них, тёмный лес! P.S.: Был ещё некий SOL - один из вариантов цифрового представления музыки до появления трэкерной и стандарта MIDI. Партитуры выглядили как листинг языка программирования и имели соответственный синтаксис. Вот часть этого архива: "HARMONIOUS BLACKSMITH" G.F. HANDEL "BOURREE" G.F. HANDEL "SARABANDE" JOHANN JAKOB DE NEUFVILLE ... Файлы с расширением .asc можно просмотреть и писать прямо Блокнотом. В СССР музыкальный интерпретатор таких партитур был адаптирован под популярный в те годы радиолюбительский компьютер РАДИО-86РК в программе Музыкальная система. С помощью эмулятора мне удалось прослушать практически все композиции с того сайта, а их - несколько десятков! Увы, так легко загружать их в эмулятор мне не удалось и пришлось написать JavaScript для адаптации оригинальных партитур под формат листингов советского ПК. Захватывает то, что партитуры могут длиться до 10 минут! И это без привычного нам визуального набора нот. Как можно видеть, практически все партитуры датируются концом 70-ых. Увы, но мне не известно ничего об отечественных партитурах.Сам я пытался написать на Си интерпретатор этих листингов. Но дальше проигрывания простых рядов нот не дошёл, так-как в конец запутался с пониманием всяких музыкальных терминов, как триоль или нота с точкой. |
<audio>
|
Хороший вопрос, однако!
К сожалению (или к счастью?), html рассчитан на страницы. Ну, как в газете или журнале. Голосовой браузер прочитает Вам этот журнал. Какой-нибудь там проектор - покажет презентацию на его основе. Но страницы останутся страницами. Мне попадалось приложение на флеше, которое без посторонней помощи разбирало формат mod, транслировало его в wav, а затем воспроизводило. А, ведь, формат этот куда сложнее, чем midi! |
Что за баги?
Вложений: 1
Хм. Написал скрипта два. Один из текста генерирует midi-поток и воспроизводится object-тэгом в FF и Opera. А вот в IE ну никак не работает, и в Chrome тоже. Но если линк на файл - звучит. Даже такой мизерный код не работает.
<html><head><title>sound</title> </head><body><bgsound src="data:audio/mid;base64,TVRoZAAAAAYAAQADAGRNVHJrAAAAHwDAUACQUH9ggFAAAJBSf2CAUgAAkFR/YIBUAAD/LwBNVHJrAAAAEADAUQCQAACCIIAAAAD/LwBNVHJrAAAAEADAUgCQAACCIIAAAAD/LwAgIA=="/> -</body>Звук слышен лишь в Opera и FF. В чём же дело? А вот Audio-тэг понимает миди? В виде data:audio-mid нужно чтобы. И с new Audio() никак не разобрался:blink: Вот эта морзянкаВложение 355 |
Ну ие не понимает data-url, а что с хромом хз, может он принципиально против звука)
Простой эксперемент: вводим тот же самый data:audio/mid;base64,TVRoZAAAAAYAAQADAGRNVHJrAAAAHwDAUACQUH9 ggFAAAJBSf2CAUgAAkFR/YIBUAAD/LwBNVHJrAAAAEADAUQCQAACCIIAAAAD/LwBNVHJrAAAAEADAUgCQAACCIIAAAAD/LwAgIA== в строку адреса и жмём энтер: 1.FF предложил сохранить. 2.Оpera воспроизвела(0_о). 3.Chrome сбросил. 4.IE6 не понял. 5. .... 6. profit! Теперь попробуем картинку: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgAAAAIAAQMAAAD Otka5AAAABlBMVEUAAAD///+l2Z/dAAAA/ElEQVR4Xu3UoY3EMBRFUY8WBKYEl5LSMqWlFJdgaBDFq3EJ+8i sdA748KKnX74BAAAAAAAAAAAAAAAAAMzP2Uap86P/74DAcrYwMMPAa15Z4Ge+00DJAlsa2J8wUO80MMLAkQbOHgZmSw NXFnhlgbXkLLDNEgaeMLCngXqHgWOkgR4GzvanwLICMwqsIaaB dxb4mSULbGlgf9LAXbId1BEGjjRw9jTQwsC8ssArC6yXmgZKFt ieMLCngXqngREGjh4GzjQwWxq4osB6qUlgDTEKbHHgCQP7HQbq CANHHOhh4GxhYF5pYBnfFBDIAQAAAAAAAAAAAAAAAADwCwgdT2 zNcD4sAAAAAElFTkSuQmCC Везде кроме ie6 открывается. Последующие исследование показали: chrome не желает понимать нетепичные data, т.е. text/javascript, text/css, image/png итд - понимает, а text/txt например - уже сбрасывает. |
Спасибо! А есть ли более-менее кросс-браузерный метод?
Вот написал какрас скрипт, который рендерит те самые треки в midi-поток. И всё отлично работает Но только в Mozilla-FF и в Opera. Как я понимаю, в IE эта проблема решается довольно легко с помощью ActiveX файловой системы: Сохраняем на диск C:/sol2midi.mid и передаём ссылку. Пока не попробовал, но сработать должно. Это уже 3 браузера! А вот как с Chrome быть..?:-? Эм-ммм, в Chrome используя new Audio удалось воспроизвести лишь mp3. Ни mid, ни rmi не воспроизводятся, а wav выдаёт ошибку! Но, вот написал более-менее кросс-браузерный метод. Работает в Mozilla-FF и Opera, а также и в IE с использованием ActiveX файловой системы. Если проверите в IE, отпишите, у кого работает/нет? ;)
<html><head><title>MIDI-song for FireFox / IE / Opera by Paguo-86PK from javascript.ru</title>
<script language="JavaScript">
String.prototype.toBase64 =
function (header) {
// Encodes data with MIME base64
// + original by: Tyler Akins (http://rumkin.com)
// + improved by: Bayron Guevara
var b64 = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
var enc = "", i = 0, o1, o2, o3, h1, h2, h3, h4, bits;
do { // pack three octets into four hexets
o1 = this.charCodeAt(i ++);
o2 = this.charCodeAt(i ++);
o3 = this.charCodeAt(i ++);
bits = o1 << 16 | o2 << 8 | o3;
h1 = bits >> 18 & 0x3f;
h2 = bits >> 12 & 0x3f;
h3 = bits >> 6 & 0x3f;
h4 = bits & 0x3f;
// use hexets to index into b64, and append result to encoded string
enc += b64.charAt(h1) + b64.charAt(h2) + b64.charAt(h3) + b64.charAt(h4);
} while (i < this.length);
switch(this.length % 3) {
case 1:
enc = enc.slice(0, -2) + "==";
break;
case 2:
enc = enc.slice(0, -1) + "=";
break;
}
return header + ";base64," + enc;
}
var
player = ( //////////////////////// Cross-browser midi-play method are here
function (fileName) {
try { //////////////////////////// Try to IE way
this.fso = new ActiveXObject("Scripting.FileSystemObject");
this.name = fileName;
this.play = function(stream) { // Flexable function for play sound
Player = document.getElementById("Media");
Player.FileName = ""; // document.getElementsByTagName("bgsound")[0].src="";
try { ////////////////////////// Save stream to HDD and play it
File = this.fso.CreateTextFile(this.name);
Enc = "\x00\x01\x02\x03\x04\x05\x06\x07\x08\x09\x0A\x0B\x0C\x0D\x0E\x0F"
+ "\x10\x11\x12\x13\x14\x15\x16\x17\x18\x19\x1A\x1B\x1C\x1D\x1E\x1F"
+ "\x20\x21\x22\x23\x24\x25\x26\x27\x28\x29\x2A\x2B\x2C\x2D\x2E\x2F"
+ "\x30\x31\x32\x33\x34\x35\x36\x37\x38\x39\x3A\x3B\x3C\x3D\x3E\x3F"
+ "\x40\x41\x42\x43\x44\x45\x46\x47\x48\x49\x4A\x4B\x4C\x4D\x4E\x4F"
+ "\x50\x51\x52\x53\x54\x55\x56\x57\x58\x59\x5A\x5B\x5C\x5D\x5E\x5F"
+ "\x60\x61\x62\x63\x64\x65\x66\x67\x68\x69\x6A\x6B\x6C\x6D\x6E\x6F"
+ "\x70\x71\x72\x73\x74\x75\x76\x77\x78\x79\x7A\x7B\x7C\x7D\x7E\x7F"
+ "\u0402\u0403\u201A\u0453\u201E\u2026\u2020\u2021\u20AC\u2030\u0409"
+ "\u2039\u040A\u040C\u040B\u040F\u0452\u2018\u2019\u201C\u201D\u2022"
+ "\u2013\u2014\x98\u2122\u0459\u203A\u045A\u045C\u045B\u045F\xA0\u040E"
+ "\u045E\u0408\xA4\u0490\xA6\xA7\u0401\xA9\u0404\xAB\xAC\xAD\xAE\u0407"
+ "\xB0\xB1\u0406\u0456\u0491\xB5\xB6\xB7\u0451\u2116\u0454\xBB\u0458"
+ "\u0405\u0455\u0457\u0410\u0411\u0412\u0413\u0414\u0415\u0416\u0417"
+ "\u0418\u0419\u041A\u041B\u041C\u041D\u041E\u041F\u0420\u0421\u0422"
+ "\u0423\u0424\u0425\u0426\u0427\u0428\u0429\u042A\u042B\u042C\u042D"
+ "\u042E\u042F\u0430\u0431\u0432\u0433\u0434\u0435\u0436\u0437\u0438"
+ "\u0439\u043A\u043B\u043C\u043D\u043E\u043F\u0440\u0441\u0442\u0443"
+ "\u0444\u0445\u0446\u0447\u0448\u0449\u044A\u044B\u044C\u044D\u044E\u044F";
for(i = 0; i < stream.length; ++ i)
File.write(Enc.charAt(stream.charCodeAt(i)));
File.close();
Player.FileName = this.name; // document.getElementsByTagName("bgsound")[0].src = this.name;
} catch(e) {
alert("Sorry...\r\nCan't played");
}
}
document.writeln("<object id='Media' classid='CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95'"
+" width='200' height='40'>");
document.writeln("<param name='Filename' value=''>");
document.writeln("<param name='AutoStart' value='True'>");
document.writeln("<param name='AutoRewind' value='True'>");
document.writeln("<param name='ShowDisplay' value='False'>");
document.writeln("<param name='ShowControls' value='True'>");
document.writeln("<param name='ShowStatusBar' value='False'>");
document.writeln("</object><br>");
} catch(e) { ///////////////////// All other browsers (Mozilla FireFox / Opera)
this.play = function(stream) {
Player = document.getElementById("Media");
Player.data = "";
Player.data = stream.toBase64("data:audio/mid");
}
document.writeln("<object id='Media' type='audio/mid' width='200' height='40' autoplay>");
document.writeln("<param name='AutoStart' value='True'>");
document.writeln("<param name='AutoRewind' value='True'>");
document.writeln("<param name='ShowDisplay' value='False'>");
document.writeln("<param name='ShowControls' value='True'>");
document.writeln("<param name='ShowStatusBar' value='False'>");
document.writeln("</object><br>");
}
return this;
})("C:/_base64_.mid"); //////////// <-- Choice to IE-generated file at here
var
song = "\x4D\x54\x68\x64\x00\x00\x00\x06\x00\x01\x00\x03\x7F\xFF\x4D\x54"
+ "\x72\x6B\x00\x00\x00\x53\x00\xC0\x50\x00\x90\x00\x00\x82\x9D\x60"
+ "\x80\x00\x00\x00\x90\x37\x7F\xC7\x38\x80\x37\x00\x00\x90\x38\x7F"
+ "\xC7\x38\x80\x38\x00\x00\x90\x39\x7F\x88\xF7\x00\x80\x39\x00\x00"
+ "\x90\x00\x00\x84\xBB\x40\x80\x00\x00\x00\x90\x3A\x7F\xC7\x38\x80"
+ "\x3A\x00\x00\x90\x39\x7F\xC7\x38\x80\x39\x00\x00\x90\x3B\x7F\x88"
+ "\xF7\x00\x80\x3B\x00\x00\xFF\x2F\x00\x4D\x54\x72\x6B\x00\x00\x00"
+ "\x11\x00\xC0\x51\x00\x90\x00\x00\x9A\xE5\x00\x80\x00\x00\x00\xFF"
+ "\x2F\x00\x4D\x54\x72\x6B\x00\x00\x00\x11\x00\xC0\x52\x00\x90\x00"
+ "\x00\x9A\xE5\x00\x80\x00\x00\x00\xFF\x2F\x00\x20\x20";
</script>
</head>
<body>
<button onclick='player.play(song)'>Cross-browser playing test</button>
</body>
|
О программистах думают вообще
На днях наткнулся на MusicXML и ужаснулся!:blink:
Это к чему же всё идёт? Скоро и exe-файлы будут в XML с чудовищной избыточностью! На описание одной ноты целое древо из в 33 строки!:-E Тогда как раньше, как я уже писал, было проще. Почему не могут лишь доработать и обогатить, чем всё в XML пихать?:agree: Я вот подумал. Этот Audio() в HTML-5 поддерживает только MP3 и никакие мидии не признаёт. Но это не главное... Ведь Audio объект включили в HTML из уже готовой и достаточно зрелой реализации некоего браузера. Не с потолка W3C же берёт всё, типо "да будет тэг! и стал тэг"... А нету ли браузера с каким-либо плагином, хоть в любимом вашем Flash'е, где звуком можно оперировать в реальном масштабе времени, как в Си скажем. Открыть звуковое устройство, создать миди-поток и управлять в нём включением/выключением нот на лету, чтобы пользователь мог двигать мышью по струнам на экране, а они тут же брынчали. Ну вы поняли... Вот с саnvаs'ом дело куда лучше: Интерактивность практически полная. А вот со звуком. Ни устройство не открыть, ничего. Воспроизвожу туда, не знаю куда. Даже не знаю, а воспроизводится ли вообще? |
swf wav-form генерация
Цитата:
Даже простой wav-писк не могу сгенерировать в Flash, так-как chr(0) в строку не вставляется. А ведь это ключевой символ! Гуглил, проблема очень насущная... |
Цитата:
почитай спецификацию к аудио -а то тут такой сыр-бор развёл.видно что ничего о нём не читал. напомнило театр одного актёра..... |
| Часовой пояс GMT +3, время: 13:48. |