[3.1/3.2] videobbredy - адаптивный bb код видео

[KEMnEP]

Расширение и video bb соde на jquery для просмотра на сайте видео. Совместимо с [beta] Быстрый ответ: перезагрузка (QuickReply Reloaded)
Просьба тапками не кидать, всё равно с бронепоезда не слезу. Код Чихуахуа на "Стандарты", оптимизирован на минимальную нагрузку серверной части, поэтому лишён даже файлов локализации, всё по старинке в админке. Считаете что сделаете лучше? сразу выкладывайте готовый вариант, я переделывать не буду.
Конструктивная просьба, так как код в тестовом варианте, просьба кидать сюда нерабочие ссылки (если не противоречат настройкам приватности автора видео)
Дисклеймер, расширение и бб код предоставляются как есть и никто не за что не несёт никакой ответственности.

Описание; Связка расширение + ббкод позволяет просматривать видео на сайте. Не нарушая авторские права, и слушаясь настроек приватности самого видео. Также с youtube убираются настройки плей листов, То есть проигрывается просто видео от начало до конца, если не запрещено настройками приватности автора или самого ютюба. Адаптивность заключается в том что на малых экранах это просто кликабельные ссылки, на больших готовое вставленное видео.
Подключает https где это возможно.

Установка:
В администраторском разделе форума сообщения/BBcodes/Добавить BBcode
Использование BBCode [video]{URL}[/video]
Замена HTML <a class="videobbcode" href="{URL}">{URL}</a>
Подсказка Вставить видео [video]URL[/video]
Показывать на странице ответа галка
Если код не отображается в панеле, дополнительно выбрать "Группы, которые могут использовать BB-код".

Собственно установить расширение прикреплённое архивом к данному посту.

Поддерживает вставку аудио и видео со следующих сайтов:
youtube.com
vimeo.com
video.mail.ru
vk.com (Вконтакта)
lovi.tv
intv.ru (без https)
facebook.com
promodj.com
rutube.ru (без https)
twitch.tv
dailymotion.com
videochart.net
video.sibnet.ru
metacafe.com (без https)
coub.com
goodgame.ru
video.online.ua (без https)
tvforsite.ru (без https)
afreeca.tv (без https)
hitbox.tv (без https)
ipeye.ru (без https)
smotri.com (без https)
pleer.com
music.yandex.ru

Поддерживает html5 вставку контента обычным урл адресом.
mp3
ogv
webm
mp4
avi
(Так как используется "чистый" html5 код вставки, все форматы кроме пожалуй mp3 могут не открываться в разных браузерах)

Показывает видео на стандартных плеерах сайтов из списка, сохраняя полный их функционал (к примеру автоматический перевод субтитров youtube.com на разные языки мира)

Использование;

youtube.com, vimeo.com, video.mail.ru dailymotion.com video.online.ua video.sibnet.ru ipeye.ru вставить между [video][/video] url любой страницы с нужным изображением.

yotube.com Существует возможность вставки плейлиста целиком из ютюба, Для этого допишите адресу ютюба с плейлистом, слитно, &1
пример:
[video]http://www.youtube.com/watch?v=WPWJJsEnYEM&list=PLPYC---L3hwl7yImm5Rk3Iol0Efln7CDe&index=5&1[/video]
Внимание! Запоминает только сам плейлист и начинает с первого файла, если Вы хотите передать конкретный файл и/или его же с тайминогом, добавлять нечего ненужно, но и плейлист не передастся.

list1.jpg

list2.jpg

Также возможен просмотр сразу всех видео загруженных конкретным пользователем.
Пример: [video]http://www.youtube.com/user/yplandrew[/video]

vk.com найдите нужное видео на сайте vk.com, кликните по нему правой кнопкой мышки и нажмите левой на "копировать код видео"

4.jpg

После на сайте в комментарии жмём правой кнопкой мышки, выбираем, и левой нажимаем вставить.

5.jpg

Удаляем всё лишние кроме урл. После выделяем оставшиеся, и нажимаем кнопку video.

6.jpg

lovi.tv Поделиться/ссылка на видео

lovi.jpg

intv.ru Где присутствует "Постоянная ссылка" под видео.

intv.jpg

facebook.com Правой кнопкой на заинтересовавшем видео и там Get video URL

facebook.jpg

promodj.com вставить между [video][/video] url любой страницы с нужным изображением или музыкой. Единственное условие страница должна быть посвящена именно треку, а не списку треков. И не в разделе tv.
Пример страницы видео и отображения:
https://promodj.com/yaaman/videos/55139 ... ck_To_Stay

video.jpg

Пример страницы с аудио и отображения:
https://promodj.com/slamdjs/tracks/5107 ... ngrad_Like

tracks.jpg

Для вставки из раздела TV нужно нажать <> на самом видео.

1.jpg

После вставить в поле ответа из буфера обмена. очистить до вида URL (пример http://promodj.com/embed/5364879/big) и заключить в тег [video][/video]

rutube.ru Вставить между [video][/video] адрес отдельной страницы с самим видео.

twitch.tv Добавить url адрес стрима между тегами. Пример [video]http://www.twitch.tv/meteos[/video]
metacafe.com Копируем адрес странницы посвящённой самому видео. Пример:
[video]http://www.metacafe.com/watch/11324313/clumsy_reporter_knocks_down_jenga_tower/[/video]

coub.com Добавить URL видео. Который к примеру можно получить с самого видео.

coub2.jpg

goodgame.ru Вставить url канал стримера.

video.online.ua он же moevideo.net
Вставить адрес страницы с нужным видео.

tvforsite.ru Для использования, получите код встройки после на нужных Вам темах форума добавите только [video]URL[/video] из полученного кода.

afreeca.tv урл брать под стримом.

afreecatv.jpg

hitbox.tv Вставить ссылку страницы стрима между бб кодом.

Ещё раз повторюсь выкладываю только из за просьбы показать как сделал. В советах, кроме как нерабочих (на самом деле рабочих) ссылок не нуждаюсь.

Так же доступна версия newadapvideobbredy.zip с видео адаптацией под мобильные экраны вставки видео с сайтов
youtube.com vk.com rutube.ru vimeo.com mail.ru coub.com
В ней также реализован режим экономии мобильного трафика для youtube.com, изначально загружаются только изображения, после первого клика идёт подгрузка управления и подготовка видео, после второго клика только загрузка самого видео

[misterleks]

KEMnEP, он для всех будет работать? Или только с конкретным доменом? А то я заносил поддерживаемые домены в белый список.

[KEMnEP]

Версия из поста Re: [3.1/3.2] videobbredy - адаптивный bb код видео будет работать со всеми поддерживаемыми доменами. Но в ней есть микро баг, который если честно не вижу причины устранять ибо не понимаю смысл вообще переходных страниц, ну да неважно. Проще говоря с той версией неподдерживаемые домены в бб коде видео будут обычными ссылками но с убранными возможностями екстернал.

[Beer]

Кешь очистил, включал-выключал. Что-то у меня немножко не але...

81547b65-a9c0-42b8-a271-4315c7507af8.png

youtube:

Код: Выделить всё

<a href="/forum/link/http%253A%252F%252Fwww.youtube.com%252Fwatch%253Fv%253DWPWJJsEnYEM%2526amp%253Blist%253DPLPYC---L3hwl7yImm5Rk3Iol0Efln7CDe%2526amp%253Bindex%253D5%2526amp%253B1" class="exlinks" onclick="this.target='_blank';">http://www.youtube.com/watch?v=WPWJJsEn ... &index=5&1</a>

vimeo:

Код: Выделить всё

<a class="videobbcode exlinks" href="/forum/link/https%253A%252F%252Fvimeo.com%252F207466220" onclick="this.target='_blank';">https://vimeo.com/207466220</a>

Смысл екстернал - типо отсутствия спаскруга на лодке, т.е. чтобы народ больше проводил время на борту, и меньше сваливал, чтобы постил ссылки так, чтобы можно было смотреть на форуме, а не в один клик на другом сайте.
Мы же форумы держим никак не для развития ютуба или вимео - так ведь?

[misterleks]

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

Отправлено спустя 10 минут 31 секунду:
Странно, на компьютере все хорошо, плеер и все работает как надо, а если смотреть тоже самое с мобильного, то просто ссылка.
Установлена версия из последнего сообщения.

[KEMnEP]

misterleks,

а если смотреть тоже самое с мобильного, то просто ссылка.

Адаптивность заключается в том что на малых экранах это просто кликабельные ссылки, на больших готовое вставленное видео.

Так же доступна версия newadapvideobbredy.zip с видео адаптацией под мобильные экраны вставки видео с сайтов
youtube.com vk.com rutube.ru vimeo.com mail.ru coub.com

[misterleks]

В ней также реализован режим экономии мобильного трафика для youtube.com, изначально загружаются только изображения, после первого клика идёт подгрузка управления и подготовка видео, после второго клика только загрузка самого видео

Меня интересует именно это. Как понять, маленький экран или нет. Смотрю с 5и дюймов, разрешение ФуллХД.

[KEMnEP]

Beer, misterleks, версия с убиранием влияния расширения External Links (кроме чёрного списка) на ббкод видео
в прошлом архве был баг и на мобильных

Так же доступна версия newadapvideobbredy.zip с видео адаптацией под мобильные экраны вставки видео с сайтов
youtube.com vk.com rutube.ru vimeo.com mail.ru coub.com

не работало, исправил.
Отвечая на вопрос,

Меня интересует именно это. Как понять, маленький экран или нет. Смотрю с 5и дюймов, разрешение ФуллХД.

маленьким считается физическое разрешение экрана меньше 600Х500 без учёта маркетингового преобразования "фул хд" в эту малость.

упд архив удалён, рабочая версия в посте Re: [3.1/3.2] videobbredy - адаптивный bb код видео

[misterleks]

Проверил на мобильном и на десктопе, все работает без включений доменов в белый список.

[Beer]

misterleks, ставь видос в спойлер с постзагрузкой от ppk - лучшее мобильное решение.

KEMnEP, у меня только цвет ссылки изменился:

Код: Выделить всё

[video]http://www.youtube.com/watch?v=-lqfyXvx0_M[/video]

Код: Выделить всё

<a class="videobbcode" href="/forum/link/http://www.youtube.com/watch?v=-lqfyXvx0_M">/forum/link/http://www.youtube.com/watch?v=-lqfyXvx0_M</a>

80f8e4ea-a3cf-4cb4-903b-51e14b25b56a.png

[KEMnEP]

Beer, это должно и Вам помочь

[Beer]

Супер! Перезагрузил страницу - все заработало!
Спасибо тебе большое KEMnEP!
Всегда уважал грамотных людей, осуществляющих ликбез для недостаточно умных...

Начинаю тестировать.

[Beer]

Результаты тестирования таковы: все работает просто супер!
Дополнительно добавил автоматический спойлер для видео от ppk.

[va-spb]

KEMnEP, спасибо за Вашу работу.
Я с Яндекс.Музыкой. Отдельные треки со ссылкой https://music.yandex.ru/track/23554003 вставляются и работают нормально. Но вот, захотелось вставлять сразу альбом целиком, ссылка у альбомов такая https://music.yandex.ru/album/3508363, HTML код такой

Код: Выделить всё

<iframe frameborder="0" style="border:none;width:100%;height:600;" width="100%" height="600" src="https://music.yandex.ru/iframe/#album/3508363/white/C4EFF3/">Слушайте <a href='https://music.yandex.ru/album/3508363'>День Победы</a> — <a href='https://music.yandex.ru/artist/4379065'>Ансамбль песни и пляски Российской армии имени А. В. Александрова</a> на Яндекс.Музыке</iframe>

К Празднику подключил альбом пока без Вашего BBCode, на отдельной странице, вот так http://forum.prihozovka.ru/page/musik
Хотелось бы поиметь разбор ссылки альбомов и подключение их в Вашем BBCode.

[KEMnEP]

Сегодня занят, завтра посмотрю что можно сделать.

[va-spb]

KEMnEP, чтобы сэкономить Ваше время, вот тексты ссылок и соответствующие им HTML-коды плееров.
Есть Альбомы, Плейлисты и Треки, они доступны для показа и проигрывания.

Альбомы, плейлисты, треки на Яндекс Музыке 

Код: Выделить всё

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<head></head>
<body>
<h2>
<br>Альбом 2840980 с обложкой<br>
https://music.yandex.ru/album/2840980
<iframe frameborder="0" style="border:none;width:100%;height:600;" width="100%" height="600" src="https://music.yandex.ru/iframe/#album/2840980/">Слушайте <a href='https://music.yandex.ru/album/2840980'>Как здорово, что все мы здесь сегодня собрались! (Четверть века спустя)</a> — <a href='https://music.yandex.ru/artist/218090'>Олег Митяев</a> на Яндекс.Музыке</iframe>


<br><br>Альбом 2840980 без обложки (hide/cover)<br>
https://music.yandex.ru/album/2840980
<iframe frameborder="0" style="border:none;width:100%;height:600;" width="100%" height="600" src="https://music.yandex.ru/iframe/#album/2840980/hide/cover/">Слушайте <a href='https://music.yandex.ru/album/2840980'>Как здорово, что все мы здесь сегодня собрались! (Четверть века спустя)</a> — <a href='https://music.yandex.ru/artist/218090'>Олег Митяев</a> на Яндекс.Музыке</iframe>

<br><br>Альбом 2840980, с обложкой, Тема темная(black)<br>
https://music.yandex.ru/album/2840980
<iframe frameborder="0" style="border:none;width:100%;height:600;" width="100%" height="600" src="https://music.yandex.ru/iframe/#album/2840980/black/">Слушайте <a href='https://music.yandex.ru/album/2840980'>Как здорово, что все мы здесь сегодня собрались! (Четверть века спустя)</a> — <a href='https://music.yandex.ru/artist/218090'>Олег Митяев</a> на Яндекс.Музыке</iframe>

<br><br>Плейлист 1034, юзера newyearplaylists, с обложкой, тема светлая (white), фон ECF3F7<br>
https://music.yandex.ru/users/newyearplaylists/playlists/1034
<iframe frameborder="0" style="border:none;width:100%;height:600;" width="100%" height="600" src="https://music.yandex.ru/iframe/#playlist/newyearplaylists/1034/show/cover/description/white/ECF3F7/">Слушайте <a href='https://music.yandex.ru/users/newyearplaylists/playlists/1034'>Наши праздничные песни</a> — <a href='https://music.yandex.ru/users/newyearplaylists'>Новогодние песни</a> на Яндекс.Музыке</iframe>

<br><br>Плейлист 3, юзера va-spb (это я), с обложкой, тема светлая, <br>
Это мой плейлист "Мне нравится", он создается автоматом, треки попадают в него при клике на сердечко "Мне нравится". Этот плейлист будет постоянно меняться. Его номер 3, надо проверить под другими аккаунтами. Проверил, у других пользователей тоже номер 3, это первый плейлист, дается каждому пользователю.
<br>https://music.yandex.ru/users/va-spb/playlists/3
<iframe frameborder="0" style="border:none;width:100%;height:600;" width="100%" height="600" src="https://music.yandex.ru/iframe/#playlist/va-spb/3/show/cover/description/">Слушайте <a href='https://music.yandex.ru/users/va-spb/playlists/3'>Мне нравится</a> — <a href='https://music.yandex.ru/users/va-spb'>va-spb</a> на Яндекс.Музыке</iframe>

<br><br>Трек 31920858 из альбома 3879428 с обложкой
<br>https://music.yandex.ru/album/3879428/track/31920858
<iframe frameborder="0" style="border:none;width:100%;height:100;" width="100%" height="100" src="https://music.yandex.ru/iframe/#track/31920858/3879428/">Слушайте <a href='https://music.yandex.ru/album/3879428/track/31920858'>Ну, вот и всё</a> — <a href='https://music.yandex.ru/artist/391868'>Стас Михайлов</a> на Яндекс.Музыке</iframe>

<br><br>Трек 31920858 из альбома 3879428, без обложки (hide/cover), тема темная (black)
<br>https://music.yandex.ru/album/3879428/track/31920858
<iframe frameborder="0" style="border:none;width:100%;height:100;" width="100%" height="100" src="https://music.yandex.ru/iframe/#track/31920858/3879428/hide/cover/black/">Слушайте <a href='https://music.yandex.ru/album/3879428/track/31920858'>Ну, вот и всё</a> — <a href='https://music.yandex.ru/artist/391868'>Стас Михайлов</a> на Яндекс.Музыке</iframe>

</h2>
</body
</html

BBcode можно попробовать использовать с параметрами:
Ссылка оканчивается цифрами. Если добавлять руками в конце ссылки b, то тема будет black, если добавлять с(и рус и англ, так как выглядят одинаково), то будет показана обложка-cover.