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

2546
Когда-то по заказу 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. Создать в нужном типе контента поле типа файл с любым системным именем . Тип поля выбрать "Аудио". Выставить допустимые разрешения (mp3, wav, wma) и максимальный размер.

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

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

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

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

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

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

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

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

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

Ris 5 августа 2018 в 20:39 +1
Я сейчас перепишу пост. Есть более простой метод.
Ris 5 августа 2018 в 20:47 +1
Переписал. Сделайте по инструкции.
Если что - пишите в личку.
Светлана 5 августа 2018 в 21:08 +1
Теперь работает! Спасибо большое smile
olgatcpip 12 октября 2018 в 07:58 +1
До чего же приятно работать с компонентом, с которым нет проблем!
Благодарю за статью. Большущее спасибо за бесплатный компонент. Если мне денег заплатят за работу, постараюсь перечислить... 10%
Павел 29 января 2019 в 15:04 0
Спасибо за фишку. У кого не загружается, попробуйте указать размер в файле .htaccess , если нет, создайте его в корне сайте и пропишите, где 5м это вес загружаемого аудио файла.
php_value upload_max_filesize 5M
php_value post_max_size 5M
@Inna 14 апреля 2019 в 21:48 0
Все сделано красиво, слушаю музыку, спасибо)
ignat 14 апреля 2019 в 21:52 0
@Inna 14 апреля 2019 в 23:21 0
Добрый вечер, это мне?)
Ris 14 апреля 2019 в 23:42 0
ignat
Мне грех жаловаться на отсутствие благодарности от Инны.