0

トラックモデルとトラックのコレクションがあります。モデル自体には、単一のトラックを再生する関数play（）があります。コレクションは、単一のトラック（リストの順序）が終了したときに、各トラックを次々に再生できる必要があります。

モデル：

app.Track = Backbone.Model.extend({
    defaults: {...},
    initialize: {...},
    play: function(playlist) {
       if(finished && playlist) {
           Backbone.pubSub.trigger('finishedPlaybackLoadNext')
       } else {
           Backbone.pubSub.trigger('finishedPlayback')  
       }
    },
})

コレクション：

var TrackList = Backbone.Collection.extend({
    model: app.Track,
    nextOrder: function() {...},
    comparator: function( track ) {...},
    playAll: function() {
       this.models.forEach(function(item) {
          item.play(true); //true = play as playlist
       });
    }
})

予想どおり、forEachは、リスト内の個々のモデルごとに再生が完了するまで待機しません。どうすればこの種の待機を実現できますか？

編集：イベントにグローバルトリガー/サブスクライバーを使用して、さまざまなビュー内でイベントを共有しています。

Backbone.pubSub = _.extend({}, Backbone.Events);
4

1 に答える 1

1

曲を続けて演奏するためには、2つのモデルが必要だと思います。最初にTrackモデルとそれに対応するTrackListコレクションがありますが、次にPlayListと呼ばれる別のモデルとそのコレクションもあります。

次に、トラックの再生関数は、トラックの再生が終了したときに実行する必要があるコールバックとなる別のパラメーターを受け取る必要があります。このようにして、PlayListにplay関数を含めることもできます。この関数は、ネストされたコールバック（recursive fun：Pのようなサウンド）を介してすべての曲を連続して再生します。

編集：私は先に進んで、私が考えていたもののいくつかの小さな実装をハッキングしました。ここではBackboneを使用していませんが、コールバック関数を曲の再生関数に渡すというワズがあれば、アイデアを適応させることができると確信しています（ちなみに...実際に曲をどのように再生していますか？） 。

Song = function(name) {
  var play = function() {
    console.log(name);
    sleep(1000);
  };

  this.name = name;
  this.play = function(cb) {
    play();
    if (typeof cb == "function") {
      cb.call(this);
    }
  };
};

PlayList = function(songs) {
  this.play = function(cb) {
    // define a function that calls the first song with a callback 
    // that calls the next song with a callback that calls the next
    // ... untill the last songs play function gets called with cb 
    // (parameter top this function) as the callback.
    var playFirstSong = _.reduce(songs.reverse(), function(cb, song) { 
      return function() {
        song.play(cb);
      };
    }, cb);

    playFirstSong();
  };
};

私もこれでjsFiddleを作りました。

于 2012-09-19T15:00:59.963 に答える