Продолжите песню на следующей странице с Amplitude.js - PullRequest
0 голосов
/ 28 июня 2018

Я использую Amplitude.js для воспроизведения песен, которые динамичны. Серверный скрипт php. Моя цель - проверить, воспроизводится ли какая-либо песня, и если да, то перед тем, как эта страница будет удалена, сохраните индекс этой песни и текущую позицию (в процентах). Затем на следующей странице я должен продолжить эту песню с той же позиции. Пока что мне удалось воспроизвести ту же песню на следующей странице, но она воспроизводится с самого начала.

Здесь $ feat - массив, созданный как:

$featured = array();
        foreach ($all as $key => $value) {
           array_push($featured, array(
                "id" => $value['audio_id'],
                "name" => $value['audio_name'],
                "artist" => $value['audio_artist'],
                "album" => $value['product_name'],
                "url" => l($value['audio_file_path'].$value['audio_file']),
                "cover_art_url" =($value['product_image_path'].$value['product_image']),
           ));
        }

Мой код JavaScript для инициализации Amplitude js:

<script>
Amplitude.setDebug( true );
let _songs = JSON.parse('<?=$feat?>');
Amplitude.init({
  "songs":_songs,
});
</script>

При изменении каждой страницы я сохраняю текущий индекс песни и текущий процент проигранной песни. Работает нормально. Home / song_stats сохранит информацию о песне в сеансе

<script>
    $(window).on("beforeunload", function() {
    song_percent =  Amplitude.getSongPlayedPercentage();
    song_index = Amplitude.getActiveIndex();

    $.ajax({
      type: "POST",
      url: "<?=g('base_url')?>Home/song_stats", 
      data:  "song_percent="+song_percent+"&song_index="+song_index,
      dataType: "json"
    });
    return false;    
    });

</script>

Этот javascript-код воспроизводит песню по щелчку, и, если доступны какие-либо данные сеанса для продолжения песни, он продолжит эту песню.

<script>
$(window).load(function(){

  function playmysongs(_index){
  $('div[amplitude-song-index="'+_index+'"]').click();
}


  var appender = '';
  for(var i =0;i<_songs.length;i++){
    appender+='<div class="rixinside-list"><a onclick="playmysongs('+i+')"><span class="album_img"><img src="'+_songs[i].cover_art_url+'" class="img-responsive"/></span><span class="album_name">'+_songs[i].album+'<span class="album_artist">'+_songs[i].artist+'</span></span></a></div>';
  }
$('#playlist-container .rixplaylist').append(appender);

  //cont song
     $.ajax({
      type: "POST",
      url: "<?=g('base_url')?>Home/continue_song",
      data:  "",
      dataType: "json",
      success: function(response){
        playmysongs(response.song_index);
        Amplitude.setSongPlayedPercentage(response.song_percent);
      }
    });
    return false;  
    //cont song end
});


$('#playlist-container').click(function(){
  $('.rixplaylist').toggle();
});
$('#wishlist-container i').click(function(){
  $(this).toggleClass('like');
});

Строка ниже не работает, хотя "response.song_percent" показывает правильное значение. Любая помощь будет оценена. Amplitude.setSongPlayedPercentage (response.song_percent);

Ответы [ 2 ]

0 голосов
/ 29 июня 2018

Существует несколько вариантов использования AmplitudeJS 3.3 или выше.

Во-первых, перед навигацией я бы сохранял текущую позицию воспроизводимой песни в локальном хранилище или в файле cookie. Если вы хотите сохранить расположение на стороне сервера, вы также можете это сделать. Локальное хранилище может быть проще, если вы все делаете в Javascript.

При загрузке страницы после того, как вы получите процент воспроизведения песни (или текущее время), у вас есть один из двух вариантов.

1. Использовать Amplitude.setSongPlayedPercentage (процент).

Для этого устанавливается текущая песня, воспроизводимая в соответствии с заданным процентом. Ключ актуален. Теперь, если пользователь переходит к песне 3, переходит на следующую страницу, устанавливает процент проигранной песни, равный 35, он будет делать первую песню в массиве, которая будет неправильной песней. Перед выполнением Amplitude.setSongPlayedPercentage вам необходимо установить ключ start_song в методе Amplitude.init () в качестве индекса песни, которую играет пользователь. Затем вы можете запустить Amplitude.setSongPlayedPercentage (процент), и он будет работать надлежащим образом.

2. Используйте Amplitude.skipTo (секунды, индекс);

Этот метод немного новее, но немного менее сложен. Что вам нужно будет сделать, это сохранить секунды в песне либо в локальном хранилище, в cookie-файле, либо как вы делаете это вместе с индексом песни. При загрузке страницы после инициализации AmplitudeJS вы можете запустить Amplitude.skipTo (секунды, индекс). В секундах указывается, насколько далеко в песне находился пользователь, а индексом - индекс песни в массиве песен. Это возобновится оттуда.

Надеюсь, это поможет!

0 голосов
/ 29 июня 2018

Возможна асинхронная проблема: попробуйте заменить вызов функции «playmysongs» самой строкой кода, прежде чем устанавливать процент, или добавьте время ожидания 200, прежде чем устанавливать процентное значение.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...