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: 32
Location: Минск, Беларусь
Reputation: 1576
With us: 7 years 7 months


Post #301by Boloto » 15.10.2014, 14:17

VEG wrote:Если у Яндекс-карт есть код встраивания через iframe, то мы и сами добавим эту поддержку.
добрый день, не появилось еще решение проблемы для Яндекс-карт?
Boloto
Новичок
Reputation: 0
With us: 6 years 2 months

Post #302by odseg » 23.10.2014, 18:10

гугл таблицы тоже не работают =(
phpbbex 1.7.1 + gallery + portal 2.0.1 -> Версия phpBBex: 2.0.1 (phpBB 3.1.6)
odseg M
Новичок
Age: 32
Location: Молодечно
Reputation: 2
With us: 5 years 5 months

Post #303by ЖЪРЧИК » 28.10.2014, 21:09

pdf и доки с гуглодиска не пашет. :think:
плешивый кот
ЖЪРЧИК
Гуру
Avatar
Reputation: 174
With us: 5 years 3 months

Post #304by Sumanai » 28.10.2014, 21:25

ЖЪРЧИК, а конкретнее? Примеры ссылок, которые не работают.
Поддержки pdf нету, поэтому правильно, что не работает.
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1667
With us: 6 years 9 months

Post #305by ЖЪРЧИК » 28.10.2014, 23:47

Поддержки pdf нету, поэтому правильно, что не работает.
:sad:

VEG wrote:Внимание! Обновился [media=ширина,высота] (с предпочитаемой шириной и высотой плеера). Его нужно обновить вручную в админке.
Новая возможность: при вставке можно указать только ширину. В старом коде даже если вы вставляете аудио, вы должны были указать и высоту. В новом коде это не обязательно. Если высота не указана, она вычисляется автоматически с соотношением сторон 16:9 для видео и по высоте аудиоплеера для аудио.

Не пашет без указания. Хотелось бы, чтобы без указания размеров работал как автоматический.
плешивый кот
ЖЪРЧИК
Гуру
Avatar
Reputation: 174
With us: 5 years 3 months

Post #306by odseg » 29.10.2014, 18:42

Примеры ссылок, которые не работают.
пример работы на форуме и код ссылки :
http://skvepr.com/viewtopic.php?f=2&t=960
phpbbex 1.7.1 + gallery + portal 2.0.1 -> Версия phpBBex: 2.0.1 (phpBB 3.1.6)
odseg M
Новичок
Age: 32
Location: Молодечно
Reputation: 2
With us: 5 years 5 months

Post #307by VEG » 01.11.2014, 16:10

Boloto, когда Яндекс научится встраиваться через iframe, тогда и появится решение.

odseg, там изменился формат ссылок. Будет исправлено с обновлением.

ЖЪРЧИК, pdf никогда не позволялось встраивать. Без указания размеров должно работать. Добавляйте обе версии BBCode для этого, а кнопку отображайте только для версии без задания размеров. Когда нужно будет указать размер вручную дописывайте знак «=» и размер.

В связи с выходом phpBB 3.1 с отзывчивым дизайном планируется серьёзное обновление, которое сделает плеер так же отзывчивым. Правда, нужно будет обновить код встраивания немного. Также основным способом станет работа через новый bbmedia.php (текущую версию этого файла придётся также вручную заменить, если вы им пользуетесь).
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 32
Location: Минск, Беларусь
Reputation: 1576
With us: 7 years 7 months

Post #308by ЖЪРЧИК » 01.11.2014, 22:13

VEG, будем ждать. А объем работ на сколько недель приблизительно? :clap:
плешивый кот
ЖЪРЧИК
Гуру
Avatar
Reputation: 174
With us: 5 years 3 months

Post #309by ЖЪРЧИК » 02.11.2014, 11:32

Code: Select all
<iframe width="640" height="360" src="http://gidtv.cc/s/1261/" frameborder="0" allowfullscreen></iframe>
видеохостинг
:pray:
плешивый кот
ЖЪРЧИК
Гуру
Avatar
Reputation: 174
With us: 5 years 3 months

Post #310by VEG » 03.11.2014, 12:17

ЖЪРЧИК, а что это за сервис? По адресу http://gidtv.cc/ выдаёт просто «hello». Несерьёзно. В BB [media] я стараюсь добавлять только популярные сервисы.
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 32
Location: Минск, Беларусь
Reputation: 1576
With us: 7 years 7 months

Post #311by ЖЪРЧИК » 03.11.2014, 17:00

VEG, http://baskino.com/
это их хостинг, фильмы там свежачок. :hi:
плешивый кот
ЖЪРЧИК
Гуру
Avatar
Reputation: 174
With us: 5 years 3 months

Post #312by Test » 03.11.2014, 17:03

Этот gidtv.cc дает всплывающее окно на весь экран с рекламой.
Test
Гость

Post #313by ЖЪРЧИК » 03.11.2014, 17:20

Test, у меня черное окно, видимо из-за носкрипта или адблока.
плешивый кот
ЖЪРЧИК
Гуру
Avatar
Reputation: 174
With us: 5 years 3 months

Post #314by Test » 03.11.2014, 17:55

ЖЪРЧИК, представляешь как будет выглядеть просмотр форума с этим видео ;)
Test
Гость

Post #315by Conta » 03.11.2014, 21:53

Здравствуйте!
А можно добавить поддержку инстаграма?
Собственно, отдельный bbcode на эту тему уже существует
Code: Select all
[instagram]{SIMPLETEXT1}://instagram.com/p/{IDENTIFIER}/[/instagram]

<iframe src="//instagram.com/p/{IDENTIFIER}/embed/" width="612" height="710" frameborder="0" scrolling="no" allowtransparency="true"></iframe>

Но не охота плодить лишние теги и кнопки, а media в этом плане идеален, все в одном.
А совсем круто было бы, если б еще и подпись к фотографии отображалась.
Conta
Гость

Post #316by VEG » 04.11.2014, 00:40

Инстаграм известный сервис, его добавим. Хотя не проще ли вставлять картинки через [img]? Зачем там отдельный код встраивания?
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 32
Location: Минск, Беларусь
Reputation: 1576
With us: 7 years 7 months

Post #317by Conta » 04.11.2014, 11:34

VEG wrote:Хотя не проще ли вставлять картинки через [img]? Зачем там отдельный код встраивания?
Скажем так, не совсем проще. Сайт инстаграма очень неохотно отдает прямой адрес картинки, многое зависит от браузера и навыков пользователя.
Тем более, что предложенный код дает не только картинку, но дополнительную информацию, которую хотелось бы показать (особенно если фотография - своя :)). Для полного счастья не хватает только отображения подписи к фотографии.
Conta
Гость

Post #318by cefp » 08.11.2014, 07:50

Здравствуйте еще раз.

Модом пользуюсь давно, очень хорошо себя показывает, благодарю за проделанную работу. Пришел я с вопросом по установке. Заметил что при вставке видео большого разрешения окно с видео не влезает в окно сообщения и полоса прокрутки не появляется. Как сделать чтобы размер окна с видео подгонялся под ширину области выделенной под сообщение? Если вопрос обсуждался, то намекните пожалуйста, где искать.

По версии для 3.1 возник вопрос: что подразумевается под отзывчивостью?
cefp
Гость

Post #319by VEG » 08.11.2014, 14:08

cefp, как раз то, что блок по ширине будет подстраиваться по текущей доступной максимальной ширине.

Added after 5 hours 23 minutes:
Добавлена поддержка новых форматов URL видео mail.ru, таблиц и форм Google Docs. Примеры:
Code: Select all
http://my.mail.ru/bk/rimskiyofficial/video/_myvideo/67.html
https://docs.google.com/forms/d/16PVZPeS5fm2Qrs08SBfsSWu9AKkQ0CV5HYG_1MwBPjQ/viewform
https://docs.google.com/spreadsheets/d/1O9AKpLlMunfJCsWGB2V8qjPXY93hAPhVNJdur0-h3r0/pubhtml
С наилучшими пожеланиями, Евгений
VEG M
Topic author, Администратор
Avatar
Age: 32
Location: Минск, Беларусь
Reputation: 1576
With us: 7 years 7 months

Post #320by Dr.Death » 08.11.2014, 19:40

VEG, есть ли какая то функция, которую можно запустить, чтобы обработались динамически добавленные bbmedia блоки?
Моды не пишу, программированию не обучаю. Ваше незнание и нежелание знать, ваши проблемы, а не повод меня оскорблять. Минусите на здоровье, вдруг поможет.
Dr.Death M
Гуру
Avatar
Reputation: 69
With us: 5 years 4 months

PreviousNext

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



Who is online (over the past 10 minutes)

Users browsing this forum: 1 guest