0

アーティストの関連アーティストのトップ トラックを返すヘルパー ファイルを作成しようとしています。私がやりたいことは、1 つのアーティスト URI を使用して、関連するアーティストの名前、人気、トップ トラックを表示することだけです。そして、最上位のトラック機能を別のファイルに分けて、いつでも呼び出すことができるようにしたいと考えています。

しかし、関連するアーティストのトップ トラックを正しく返す方法がわかりません。

私の「get-toptrack.js」ファイルでは：

   require([
      '$api/models',
      '$api/toplists#Toplist'
    ], function(models, Toplist) {
      'use strict';

      var doGetTopTrack = function(uri, num) {
        var artistURI = uri;
        var artist = models.Artist.fromURI(artistURI);
        var artistTopList = Toplist.forArtist(artist);

        artistTopList.tracks.snapshot().done(function(snapshot){

          snapshot.loadAll('name').done(function(tracks) {
            var i, num_toptracks;
            num_toptracks = num;

              for(i = 0; i < num_toptracks; i++){
                console.log("top track: " + tracks[i].name);
                // WHERE DO I RETURN THE TOP TRACKS??
              }
          });
        });
      };

      exports.doGetTopTrack = doGetTopTrack;
    });

私の「artist.js」ファイルで」：

require([
    '$api/models',
    'scripts/get-toptrack'
  ], function(models, getTopTrack) {
    'use strict';

    var showRelated = function() {
      var artist_properties = ['name', 'popularity','related', 'uri'];

      models.Artist
        .fromURI('spotify:artist:11FY888Qctoy6YueCpFkXT')
        .load(artist_properties)
        .done(function(artist){

          artist.related.snapshot().done(function(snapshot){
            snapshot.loadAll('name').done(function(artists) {

              for(var i = 0; i < artists.length; i++){
                var u, p, n, t, listItem;

                // store artist details
                p = artists[i].popularity;
                n = artists[i].name;
                u = artists[i].uri;

                // am I missing something here?
                t = getTopTrack.doGetTopTrack(u, 1);

                listItem = document.createElement("li");
                listItem.innerHTML = "<strong>Name</strong>: " + n.decodeForText() + " | <strong>Popularity: </strong> " + p + " | <strong>Top Track: </strong>" + t;

                // undefined name
                $('#artistsContainer').append(listItem);

              }
            });

          });
        });
    };

    exports.showArtists = showArtists;
  });

「main.js」ファイルでは、artists 関数を呼び出して開始します。

require([
  '$api/models',
  'scripts/artist'
], function(models, initArtist) {
  'use strict';

  initArtist.showRelated();
});
4

1 に答える 1

1

アプリを複数のファイルにリファクタリングしていないため、複数の .js ファイルについてコメントすることはできません。

戻る限り、非同期アプリケーションで作業しているため、できません。コールバックを使用する必要があります。そうしないと、Spotify Promise によって API が Spotify のものとより一致する可能性があります。Promise.each() のドキュメントを参照してください。

コールバック メソッドの実装を次に示します。テストしやすくするために、いくつかの変更を行いました。代わりに、アーティストを渡すのが少し楽になりました。また、2 番目のアーティストのトップリストが最初のアーティストよりも早く返される可能性があるため、それらが順番に表示されるという保証はありません。順序を維持したい場合は、さらにコードを追加する必要があります。

function doGetTopTrack(artist, num, callback) {
    var artistTopList = Toplist.forArtist(artist);

    artistTopList.tracks.snapshot(0,num).done(function (snapshot) { //only get the number of tracks we need

        snapshot.loadAll('name').done(function (tracks) {
            var i, num_toptracks;
            num_toptracks = num; //this probably should be minimum of num and tracks.length

            for (i = 0; i < num_toptracks; i++) {
                callback(artist, tracks[i]);
            }
        });
    });
};

function showRelated() {
    var artist_properties = ['name', 'popularity', 'related', 'uri'];

    models.Artist
      .fromURI('spotify:artist:11FY888Qctoy6YueCpFkXT')
      .load(artist_properties)
      .done(function (artist) {

          artist.related.snapshot().done(function (snapshot) {
              snapshot.loadAll('name').done(function (artists) {

                  for (var i = 0; i < artists.length; i++) {
                      // am I missing something here?
                      doGetTopTrack(artists[i], 1, function (artist, toptrack) {
                              console.log("top track: " + toptrack.name);

                              var p = artist.popularity;
                              var n = artist.name;
                              var u = artist.uri;

                              //listItem = document.createElement("li");
                              console.log("<strong>Name</strong>: " + n.decodeForText() + " | <strong>Popularity: </strong> " + p + " | <strong>Top Track: </strong>" + toptrack.name);

                              //// undefined name
                              //$('#artistsContainer').append(listItem);
                      });
                  }
              });

          });
      });
};
showRelated();
于 2013-11-04T15:01:15.037 に答える