Аудиоплеер для контента. 2.X

1408
Когда-то по заказу Sam Hain делал поле для загрузки и проигрывания аудиофайлов стандартным аудиоплеером html прямо в окне просмотра записи.
Так как заказчик не против, чтобы я поделился этой разработкой, выкладываю здесь.

Смысл следующий: в нужном типе контента создается новое поле с системным именем audio, и при добавлении или редактировании контента, если загрузить аудиофайл, запись о его названии приводится хуком к виду типа:
Код PHP:
  1. ---
  2. id: 4
  3. url_key: 64fea947
  4. name: '<audio controls="controls"><source src="/upload/000/u1/b0/a4/music.mp3"></audio>'
  5. size: 12085334
  6. path: 000/u1/b0/a4/music.mp3

Выглядит это так:
Аудиоплеер для контента.

Итак, что нужно для установки:
1. Скопировать с заменой содержимое архива в корень сайта.
2. Создать в нужном типе контента поле типа файл с системным именем audio. Выставить допустимые разрешения (mp3, ogg, wav, wma) и максимальный размер.
3. Включить хотя бы временно отладку, чтобы хук прописался в базу.

Теперь можно добавлять аудиофайлы и они будут проигрываться на сайте.

Скачать архив с хуком.

05.05.2018
Все переделано без всяких хуков. Просто переделал (изменил две строки) поле "file".
Теперь достаточно просто добавить в тип контента поле "Аудио".

Скачать можно здесь:
Скачать поле "Аудио"
Установка стандартным методом из админки.
Redactor. Вставка картинок, спойлер и удаление кнопок. | Уведомления о добавлении постов, записях на стене и комментариях для INSTANTCMS 1
Комментарии (19)
vikont 10 мая 2017 в 14:42 0
small user social cms
Однозначно, Спасибо! Очень пригодится.
Но лучше бы как то вставлять в любом месте текста и не один, а любое количество аудио файлов.
Если есть такая возможность, подскажите какой код надо вносить в текст, чтобы получить возможность вставлять аудио файлы?
Ris 10 мая 2017 в 14:50 0
small user social cms
В любом месте текста вставляется <audio controls=\"controls\"><source src=\" ссылка на музыку\"></audio>
Главное, чтобы ссылка была.
vikont 10 мая 2017 в 15:10 0
small user social cms
Спасибо! Попробую помудрить с TinyMCE вставку кода через кнопку с полем для ссылки.
Евгений 10 мая 2017 в 19:40 0
small user social cms
Для нужного типа контента попробуйте подключить несколько полей audio, по идее сколько полей подключите, столько аудио файлов и можно вывести
vikont 11 мая 2017 в 00:25 0
small user social cms
Сделал по инструкции, закачал с заменой, прописал поле audio с типом Файл и т.д.
Вставляю код со ссылкой, файл закачан на сайт. Картинка аудиоплеера появляется, но не активная, обновляю страницу становится активной, но при попытке проиграть вновь не активная.
Закачиваю файл музыки через поле - точно такое же поведение.Файл расширением WMA

C MP3 полный порядок. Все работает!
Если вставлять музыку кодом, то можно поле не прописывать вообще!
Сколько музыкальных файлов вставишь, столько и появится в статье.
Можно проигрывать хоть все файлы одновременно!

Осталось дело за малым - выяснить почему не все форматы работают и сделать вставку прямо из редактора!
Ris 11 мая 2017 в 00:41 0
small user social cms
Вставляю код со ссылкой, файл закачан на сайт. Картинка аудиоплеера появляется, но не активная, обновляю страницу становится активной, но при попытке проиграть вновь не активная.
Значит ссылка неправильная.

Если вставлять музыку кодом, то можно поле не прописывать вообще!
Ну конечно. Весь смысл хука - автоматом прописывать тэг <audio> в имя файла.

Закачиваю файл музыки через поле - точно такое же поведение.Файл расширением WMA
Возможно html плеер не ест wma. Каюсь, не проверял.

сделать вставку прямо из редактора!
Попробую сделать.
Ris 11 мая 2017 в 00:44 0
small user social cms
Да, список воспроизводимых форматов ограничен:
http://htmlbook.ru/HTML/audio
vikont 11 мая 2017 в 01:36 0
small user social cms
Я пока не понял, но TinyMCE начал вставлять аудио файлы через кнопку Вставить видео!
В самом плагине MEDIA прописана эта возможность, но что то не получалось!
Все файлы и хуки вернул в исходное состояние. Но продолжает вставлять.
Подозреваю, что причина в хуках которые прописались в базе.
vikont 11 мая 2017 в 17:39 0
small user social cms
Вставка Аудио работает только на двух типах контента Новости и Посты. Так и должно быть?
Ris 11 мая 2017 в 19:45 0
small user social cms
Спойлер
scratch
vikont 11 мая 2017 в 20:47 0
small user social cms
С полем и у меня заработало:
Спойлер
А вот с кодом так и не работает:
Спойлер
Спойлер
Ris 11 мая 2017 в 22:05 +1
small user social cms
Вы занимаетесь черной магией и колдовскими обрядами, вместо того, чтобы понять, что происходит.
Название файла берется из YAML-a
name: '<audio controls="controls"><source src="/upload/000/u1/b0/a4/music.mp3"></audio>'
и типографированию не подвергается. Типографирование - это удаление из текста HTML всех тегов, кроме разрешенных.
Если Вы хотите размещать в тексте HTML всякие дикие тэги - уберите галочку "обрабатывать типографом" в настройках полей, где эти тэги предполагается размещать.
vikont 11 мая 2017 в 23:02 0
small user social cms
Ris:
Вы занимаетесь черной магией и колдовскими обрядами
За "черную магию" ответите по все строгости Магии... превратитесь в двоичный код... shock laugh
Rls:
и типографированию не подвергается. Типографирование - это удаление из текста HTML всех тегов, кроме разрешенных.
БЛИН!!!! А вот тут я круто лоханулся! Спасибо что ткнули носом! Типографирование оказалось включеным.... Давненько так не вляпывался... zst
kseniya 12 июня 2017 в 16:41 0
no profile
Почему не добавите в каталог?
Ris 12 июня 2017 в 16:53 0
small user social cms
Это ж не полноценное дополнение, а так...
Рачей 5 мая 2018 в 14:09 0
small user social cms
Это очень хорошее дополнение!
Ris 5 мая 2018 в 20:13 +3
small user social cms
Переделал в виде нового поля (поле file с измененными двумя строками).
Ссылка на скачивание в тексте поста.
Шляпник Вчера в 08:04 +1
small user social cms
Очень полезное дополнение ) Сам файл грузится на сервер или можно использовать облачные хранилища (с яндекса вставлять или с гугла)?
Ris Вчера в 11:40 0
small user social cms
Грузится на сервер.