phpBB [media] — bbcode для вставки аудио, видео, карт и др. (без правок кода)

Board index phpBBex 1.x Мастерская

Description: Только готовые решения! Статьи, заметки, моды и другие полезности для phpBBex 1.x и phpBB 3.0.x.
Moderator: Поддержка

Post #1by VEG » 18.05.2012, 15:39

BBCode: phpBB [audio] | phpBB [video] | phpBB [media] | phpBB [youtube]

Представляем вам новый универсальный BBCode «phpBB [media]». Это два BBCode в одном: [video] и [audio]. Помимо этого он умеет встраивать и другие мультимедийные вещи, такие как: карты, панорамы, фотогалереи и др. Надеемся, вам понравится. Он подходит как для phpBB, так и для phpBBex. Для установки нет необходимости править какие-либо файлы, его можно добавить через раздел администратора.

Примеры использования

Для вставки видео пользователь должен вставить его адрес между [media][/media]:
Code: Select all
[media]http://vimeo.com/40558553[/media]
или (с указанием предпочитаемых размеров):
Code: Select all
[media=640,360]http://vimeo.com/40558553[/media]

В сообщении это отобразится следующим образом:
phpBB [media]


Для вставки аудио пользователь должен вставить его адрес между [media][/media]:
Code: Select all
[media]http://pleer.com/tracks/4796774kBZr[/media]

В сообщении это отобразится следующим образом:
phpBB [media]


Поддерживаемые сервисы

Поскольку phpBB [media] — это грамотный симбиоз наших [audio] и [video], он будет поддерживать все сервисы, которые предлагают указанные BBCode. Дополнительно phpBB [media] будет поддерживать сервисы, которые к аудио и видео не имеют прямого отношения, но данные из которых удобно встраивать в сообщения (панорамы, фотогалереи, карты и др.).

На данный момент поддерживаются:
  • все сервисы из phpBB [video] (youtube.com, vimeo.com, rutube.ru, vk.com и др.)
  • все сервисы из phpBB [audio] (soundcloud.com, muzebra.com, pleer.com и др.)
  • docs.google.com (документы, таблицы и формы; берите ссылку из File » Publish to the web)
  • maps.google.com (карты, панорамы)
  • openstreetmap.org (карты)
  • 360cities.net (панорамы)
  • picasaweb.google.com (слайдшоу из галерей)
  • dermandar.com (панорамы)
  • share.mapbbcode.org (карты с вашими метками на ней)
  • connect.garmin.com (GPS-треки)
  • endomondo.com (маршруты и тренировки)
  • gpsies.com (GPS-треки)
  • bikemap.net (GPS-треки)
  • livegpstracks.com (GPS-треки, поддерживаются только ссылки из кода встраивания)

Установка [media] (с автоматическими размерами)

1. Админка, вкладка «Сообщения», страничка «BBCodes», добавить BBCode (если уже есть [media] — редактировать).
2. В поле «Использование BBCode» введите:
Code: Select all
[media]{URL}[/media]
3. В поле «Замена HTML» введите (вводить без изменений!):
Code: Select all
<div class='bbmedia' data-url='{URL}' style='margin: 1px; display: inline-block; vertical-align: bottom;'><div style='width: 200px; height: 40px; border: 1px solid #999; display: table-cell; text-align: center; vertical-align: middle; font: 10px/10px Verdana; color: #555; opacity: 0.5;'><a style='color: #105289; text-decoration: none;' href='http://phpbbex.com/' target='_blank'>phpBB</a> &#91;media&#93;</div><script>if (typeof bbmedia == 'undefined') { bbmedia = true; var e = document.createElement('script'); e.async = true; e.src = 'http://phpbbex.com/api/bbmedia.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(e, s); }</script></div>
4. В поле «Подсказка» введите:
Code: Select all
Вставить аудио, видео, карту, панораму или другое мультимедиа: [media]http://youtube.com/url[/media]
5. Установите галочку «Показывать на странице ответа» и сохраните форму. Готово!

Установка [media=ширина,высота] (с предпочитаемой шириной и высотой плеера)

1. Админка, вкладка «Сообщения», страничка «BBCodes», добавить BBCode (если уже есть [media=] — редактировать).
2. В поле «Использование BBCode» введите:
Code: Select all
[media={INTTEXT}]{URL}[/media]
3. В поле «Замена HTML» введите (вводить без изменений!):
Code: Select all
<div class='bbmedia' data-url='{URL}' data-args='{INTTEXT}' style='margin: 1px; display: inline-block; vertical-align: bottom;'><div style='width: 200px; height: 40px; border: 1px solid #999; display: table-cell; text-align: center; vertical-align: middle; font: 10px/10px Verdana; color: #555; opacity: 0.5;'><a style='color: #105289; text-decoration: none;' href='http://phpbbex.com/' target='_blank'>phpBB</a> &#91;media&#93;</div><script>if (typeof bbmedia == 'undefined') { bbmedia = true; var e = document.createElement('script'); e.async = true; e.src = 'http://phpbbex.com/api/bbmedia.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(e, s); }</script></div>
4. В поле «Подсказка» введите:
Code: Select all
Вставить аудио, видео, карту, панораму или другое мультимедиа: [media=ширина,высота]http://youtube.com/url[/media]
5. Сохраните форму. Готово!

Независимый js-скрипт на вашем сервере

По умолчанию js-скрипт с базой поддерживаемых сервисов загружается напрямую с phpbbex.com. У этого подхода есть преимущество — для всех форумов используется общая копия js-скрипта в кэше браузера пользователей. Однако, это делает вас в какой-то мере зависимыми от нашего сервера. Если вы хотите, чтобы js-скрипт bbmedia загружался с вашего сервера, воспользуйтесь bbmedia.php. Данный PHP-скрипт автоматически возьмёт самую свежую версию bbmedia.js с сервера phpbbex.com, сохранит копию в каталоге вашего форума, после чего будет отдавать её браузеру ваших пользователей, проверяя не чаще раза в сутки наличие обновлений, что не создаст какой-либо ощутимой нагрузки на ваш сервер. Даже при недоступности phpbbex.com этот скрипт будет просто отдавать сохранённую на вашем сервере копию.

Для установки bbmedia.php просто скачайте bbmedia.php.zip и извлеките содержимое архива в кореневую директорию вашего форума. Далее для всех BBCode из серии bbmedia ([audio], [video], [media]) зайдите в редактирование (Админка, вкладка «Сообщения», страничка «BBCodes») и в поле «Замена HTML» замените подстроку «http://phpbbex.com/api/bbmedia.js» на путь к вашему файлу bbmedia.php. Лучше всего указывать путь от слэша! Например, если у вас форум имеет адрес вида «http://example.com/forum/», указывайте такой адрес: «/forum/bbmedia.php». Больше ничего в поле «Замена HTML» менять не нужно.

Для принудительного обновления вашей копии js-скрипта необходимо просто запустить «bbmedia.php?update» (с параметром update). Если вы увидите OK — обновление успешно. Иначе вы увидите сообщение о типе ошибки.

Использование на сайтах с поддержкой HTTPS

При работе сайта с использованием безопасного протокола HTTPS скрипт не работает, так как по умолчанию браузеры блокируют смешанное содержимое.
Вам необходимо произвести локальную установку скрипта по инструкции выше, либо использовать адрес «https://sumanai.ru/api/bbmedia.php» взамен стандартного «http://phpbbex.com/api/bbmedia.js».

Удаление ссылки из кода

На разработку данного bbcode потрачено много времени, поэтому в наличие ссылки на phpbbex.com в коде обязательно. Эта ссылка видна только в момент загрузки и не мешает пользователям. Если по каким-то причинам вам всё-таки необходимо её убрать, свяжитесь с автором любым удобным для вас способом. Возможность убрать ссылку из кода стоит 20$ для одного форума. Это неплохая возможность материально поддержать дальнейшую разработку данного bbcode.

Не работает?

Отображается стандартная заглушка с надписью phpBB [media] и ничего не происходит
Скорее всего на странице есть какая-то ошибка JavaScript, что прекращает выполнение всех скриптов. Включите консоль разработчика и посмотрите что за ошибка. Если у вас на странице используется jQuery, попробуйте обновить версию на более свежую (1.7 и более новую).

Выдаёт ошибку «Неправильный BBCode»
Проблема в том, что вы изменили предлагаемый код либо это сделала за вас какая-то модификация. Попробуйте по очереди убирать модификации, которые влияют на вывод сообщений и обработку BBCode.

Независимо от предлагаемого URL сообщает, что он не поддерживается
Проблема в том, что ваш форум (например, автоцензор) либо какая-то модификация вмешивается в передаваемые URL. Проверьте настройки автоцензора (чтобы в нём не было частей вставляемого URL) либо установленные модификации для обработки ссылок в сообщениях.

При использовании ссылки на файл с моего сервера ничего не проигрывается
Причины может быть две: либо ваш сервер отдаёт некорректный Content-Type, либо данный формат не поддерживается вашим браузером.
Для того, чтобы ваш сервер Apache отдавал корректный Content-Type, добавьте в .htaccess файл в корне вашего сайта (этот код уже есть в phpBBex):
Code: Select all
AddType audio/ogg   ogg oga
AddType video/ogg   ogv
AddType audio/webm  webma
AddType video/webm  webm webmv
AddType audio/mp4   m4a
AddType video/mp4   mp4 m4v
AddType audio/opus  opus
AddType audio/flac  flac
AddType audio/aac   aac
AddType audio/mpeg  mp1 mp2 mp3 mpg mpeg
AddType audio/wav   wav
Учтите, что Firefox и Opera не поддерживают форматы MP3, MP4 и AAC. Зато Firefox, Opera и Chrome поддерживают форматы Ogg Vorbis и WebM. IE также поддерживает WebM при установке соответствующего кодека.

phpBB [media] на других ресурсах

Обсуждение phpBB [media] на phpbbguru.net
Обсуждение phpBB [media] на bb3x.ru
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 29
Location: Минск, Беларусь
Reputation: 1573
With us: 5 years 1 month


Post #121by Lona » 14.07.2013, 18:31

Попыталась вставить видео на форум посредством bbcode [media], видео же расположено на другом моём сайте, на др.домене.
Получила ответ "Извините, этот URL не поддерживается".
Можно ли внести какие-то изменения, чтобы URL зподдерживался? Если да, то какие куда?
Если нет, то какие ещё варианты вставки видео на форум?

Независимо от предлагаемого URL сообщает, что он не поддерживается
Проблема в том, что ваш форум (например, автоцензор) либо какая-то модификация вмешивается в передаваемые URL. Проверьте настройки автоцензора (чтобы в нём не было частей вставляемого URL) либо установленные модификации для обработки ссылок в сообщениях.
Автоцензор проверила.
Lona
Бывалый
Avatar
Reputation: 1
With us: 3 yaers 10 months

Post #122by VEG » 14.07.2013, 18:57

Lona, очевидно, что видео было в неподдерживаемом формате. Разными браузерами поддерживаются только Ogg, Opus, MP3 и MP4 (в разных комбинациях).
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 29
Location: Минск, Беларусь
Reputation: 1573
With us: 5 years 1 month

Post #123by Lona » 14.07.2013, 20:49

Да, было в FLV-формате.
Благодарю за ответ, учту на будущее )
Lona
Бывалый
Avatar
Reputation: 1
With us: 3 yaers 10 months

Post #124by Виталий » 19.07.2013, 18:44

Основные русские видео серверы не работают!!!!
rutube.ru
video.mail.ru
video.yandex.ru
vk.ru
Виталий
Гость

Post #125by VEG » 28.07.2013, 12:52

Виталий, всё работает. Просто некоторые сервисы требуют вставку ссылок из кода встраивания, а не из адресной строки браузера. Внимательно читайте инструкцию и примеры использования в сообщениях на форуме.
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 29
Location: Минск, Беларусь
Reputation: 1573
With us: 5 years 1 month

Post #126by Sumanai » 30.07.2013, 01:58

Вот что нашёл:
JS Audio Codec
Аудио кодек на яваскрипте. Даёт возможность играть MP3, Apple Lossless, FLAC, и AAC даже в браузерах, которые не поддерживают эти форматы.
http://audiocogs.org/codecs/
С помощью этого можно решить проблему с форматами, и выкладывать только в одном формате.
Минусы- при проигрывании в браузере кушал до 70 мегабайт оперативной памяти на песнь менее чем 2 минуты длинной.
Что думаете на счёт этого?
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1555
With us: 4 yaers 3 months

Post #127by VEG » 30.07.2013, 10:21

Sumanai, давно изучал этот проект. Для декодирования на JS в реальном времени нужен мощный компьютер. На моём ноутбуке 2009 года даже стандартные примеры сильно тормозят. Так что плохой вариант. Вариант с фоллбэком на флэше вполне себе хорош. Только автор mediaelement.js задерживает поддержку формата Ogg Vorbis, хотя она уже почти готова (я спрашивал в Twitter). Видно, мало кто «пинает» его с таким вопросом, поэтому он думает, что фишка не востребована, и не спешит с её окончательной реализацией. Поддержку mediaelement.js я планирую добавить в BB [media] как раз после нового релиза с поддержкой Ogg Vorbis.
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 29
Location: Минск, Беларусь
Reputation: 1573
With us: 5 years 1 month

Post #128by Sumanai » 30.07.2013, 15:29

VEG wrote:Для декодирования на JS в реальном времени нужен мощный компьютер.

У меня процента два- три. Хоть ЦП и мощный (QuadCore Intel Core i5-3570, 4000 MHz ), но и два процента от него не сильно много. Было пару заиканий на флаке, когда память чистилась, а на мр3 всё нормально.
Хотя mediaelement.js так mediaelement.js. Хоть и не люблю флеш.
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1555
With us: 4 yaers 3 months

Post #129by VEG » 05.09.2013, 22:11

Появилась поддержка видео с сервиса ign.com:
Code: Select all
[media]http://ie.ign.com/videos/2013/08/20/gamescom-titanfall-stage-demonstation[/media]

Также добавлена поддержка маршрутов с сайта endomondo.com:
Code: Select all
[media]http://www.endomondo.com/routes/20522008[/media]

Ну и наконец появилась поддержка панорам с сайта 360cities.net:
Code: Select all
[media]http://www.360cities.net/image/building-view-of-tahrir[/media]
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 29
Location: Минск, Беларусь
Reputation: 1573
With us: 5 years 1 month

Post #130by VEG » 16.09.2013, 13:31

Появилась поддержка сервиса gpsies.com:
Code: Select all
[media]http://www.gpsies.com/map.do?fileId=gcfinrpqcyaxofvu[/media]

Не забудьте очистить кэш браузера, если BB [media] ругается, что не поддерживает новые виды URL.
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 29
Location: Минск, Беларусь
Reputation: 1573
With us: 5 years 1 month

Post #131by Boroda » 16.09.2013, 14:48

VEG wrote:Появилась поддержка сервиса gpsies.com
Улыбнул запрос на поддержку pornhub. :)
/viewtopic.php?p=1982#p1982
Boroda M
Мастер
Avatar
Age: 42
Reputation: 38
With us: 5 years

Post #132by VEG » 16.09.2013, 16:59

Если скрипт используется на форуме, работающем по HTTPS, теперь он по возможности автоматически встраивает плеер также по HTTPS. Это позволяет избежать предупреждения в браузере об использовании незащищённого содержимого на защищённой странице. При этом, чтобы подключать сам bbmedia по HTTPS, вы должны использовать локальный скрипт bbmedia.php.
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 29
Location: Минск, Беларусь
Reputation: 1573
With us: 5 years 1 month

Post #133by Алексей54 » 18.09.2013, 14:16

Вставляю гугловскую ссылку на карту
Code: Select all
[media]https://www.google.com/maps?ll=55.762764,37.797164&spn=0.004636,0.013969&t=h&dg=opt&z=17[/media]
и получаю вот такой результат:

phpBB [media]


Что-то делаю неправильно?
Алексей54
Гость

Post #134by VEG » 18.09.2013, 15:21

Похоже, Google изменил формат ссылок. Раньше домен был maps.google.com. На первой странице есть пример рабочей ссылки. В ближайшее время изучу изменения и внедрю их поддержку.

Added after 33 minutes 48 seconds:
Добавил поддержку ссылок без субдомена maps. Очистите кэш браузера, если ещё не заработало.
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 29
Location: Минск, Беларусь
Reputation: 1573
With us: 5 years 1 month

Post #135by Алексей54 » 18.09.2013, 18:23

Заработало. Спасибо!

Added after 22 minutes 24 seconds:
Но у Гугла новые карты появились, и скрипт с этими картами похоже не работает...
Алексей54
Гость

Post #136by VEG » 18.09.2013, 18:51

Алексей54, в новых картах нет функции получения ссылки (или я не нашёл). Зато там есть переключатель интерфейса в классический режим.
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 29
Location: Минск, Беларусь
Reputation: 1573
With us: 5 years 1 month

Post #137by Pentium133 » 26.09.2013, 09:19

Где можно скачать несжатый скрипт? Хочу добавить поддержку yandex-карт и ешё некоторых gps-сервисов.
Pentium133
Гость

Post #138by VEG » 01.10.2013, 13:11

Pentium133, такой возможности нет. Если у Яндекс-карт есть код встраивания через iframe, то мы и сами добавим эту поддержку. То же касается и «некоторых» gps-сервисов.
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 29
Location: Минск, Беларусь
Reputation: 1573
With us: 5 years 1 month

Post #139by Pentium133 » 02.10.2013, 08:18

Добавьте пожалуйста карты с http://www.bikemap.net
Url на маршрут www.bikemap.net/ru/route/2347329-test/
Преобразуется в код для вставки
Code: Select all
<div style="background-color:#fff;"> <iframe src="http://www.bikemap.net/ru/route/2347329-test/widget/?width=640&amp;extended=1&amp;height=480&amp;unit=metric" width="640" height="628" border="0" frameborder="0" marginheight="0" marginwidth="0" scrolling="no"> </iframe> <div style="margin: -4px 0 0 5px; height: 20px;"> Route <a href="http://www.bikemap.net/ru/route/2347329-test/" style="color:#2a88ac; text-decoration:underline;">2 347 329</a> - powered by <a href="http://www.bikemap.net" style="color:#2a88ac; text-decoration:underline;" >www.bikemap.net</a> </div> </div>
Pentium133
Гость

Post #140by VEG » 02.10.2013, 20:04

При очередном обновлении постараюсь добавить поддержку этого сервиса.
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 29
Location: Минск, Беларусь
Reputation: 1573
With us: 5 years 1 month

PreviousNext

Return to Мастерская



Who is online (over the past 10 minutes)

Users browsing this forum: 1 guest