Уникальные комментарии на Facebook с видео плейлиста Viddler

Question

Можно ли поменять поле «Комментарии» на странице Facebook на новое, когда пользователь меняет видео в наших плейлистах Viddler?

Список воспроизведения изменяется на той же странице без обновления, поэтому, если я просто вставлю одно поле комментария FB, он останется неизменным независимо от того, какое видео вызывается.

Я знаю, что это было бы возможно с JavaScript ...

Вот скрипт, который был создан здесь для изменения списка воспроизведения:

$(".playlist-link").click(function(e){
e.preventDefault();
var playlist = $(this).attr("href");

var url = 'http://www.viddler.com/tools/vidget.js' +
              '?widget_type=js_list' +
              '&widget_width=940' +
              '&source=playlist' +
              '&user=Fanaticgroup' +
              '&playlist='+ playlist +
              '&style=grid'+
              '&show_player=true'+
              '&player_type=simple'+
              '&max=12'+
              '&videos_per_row=6'+
              '&v=2.0'+
              '&id=7476737550';

$.getScript(url, function(data, textStatus){

});
});

Теперь это отлично работает и оставляет для меня открытым возможность вызывать другие функции после выбора плейлиста, например, автоматический запуск первого видео и т. Д.

Есть ли способ вызвать новое поле комментария FB на странице после изменения списка воспроизведения и при каждом новом видео?

Answer 1

В соответствии с документацией Facebook вы можете вставить плагин для комментариев, используя html, например:

<div class="fb-comments" data-href="http://example.com" data-num-posts="2" data-width="500"></div>

<div id="fb-root"></div>
<script>
(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=132892600147693";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

В этот момент должно быть достаточно просто сделать что-то похожее на это:

<div class="fb-comments" data-href="http://www.yourdomain.com/some/unique/path/identifying/your/playlist" data-num-posts="5" data-width="500"></div>

<div id="fb-root"></div>
<script>
(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=YOUR_APP_ID";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

var commentContainerTemplate = $('.fb-comments').clone();
function loadNewPlaylistComments(playlist_id)
{
    var currentComments = $('.fb-comments'),
    newComments = commentContainerTemplate.clone()
            .data('href', "http://www.yourdomain.com/some/unique/path/identifying/your/playlist/" + playlist_id)
            .before(currentComments);

    currentComments.remove();

    FB.XFBML.parse( newComments.get() );
}
</script>

Затем при каждом вызове loadNewPlaylistComments() старые комментарии будут удаляться, на страницу будет добавлен новый контейнер комментариев и будет выполнен синтаксический анализатор FB XFBML. Это должно загрузить комментарии для нового плейлиста. Загрузка новых комментариев может занять несколько секунд, поэтому я предлагаю вам встроить какой-то индикатор загрузки для пользователя, как только вы все выясните.