Trouble understanding and creating dynamic JavaScript objects

Question

I hope my code can explain itself, I am almost there, I just am stuck on the way how to merge optional data into a JSON object with multiple levels (is that even what it is?)

//get video list - example: video1.flv;test23.flv;Grabledable.flv
var files = j('.videos').html().split(';');
// assume first we have one video, so no need of playlist
var isplaylist = false;
// check if there are actually more than one video
if (files.length > 1) {
    isplaylist = true;
    var playlist = new Array(); // is this right? I want to add this to the video var
    for (var i in files) {
        playlist[] = {
            url: files[i],
            title: 'Video ' + i
        };
    }
};

//here's where the trouble starts
var video = {
    plugins: {
        controls: {
            playlist: isplaylist,
            //i cut out all irrelevant extra data
        }
    }, 
    clip: {

        url: files[0],
        // ONLY DO THIS IF isplayer == false;
        wmode: 'opaque',
        baseUrl: "/video/",
        autoPlay: false
    },

    // from here on this should only occur if isplayer == true;
    // following is the way I want it attached from var playlist
    playlist: [{
        url: 'video1.flv',
        title: 'Video 0'
    },
    {
        url: 'test23.flv',
        title: 'Video 1'
    },
    {
        url: 'Grabledable.flv',
        title: 'Video 2'
    }]
};

My target is the format listed here: http://flowplayer.org/plugins/javascript/playlist.html under the section JavaScript coding.

Answer 1

Is "playlist" supposed to be a JSON object or an array? If it's an array of objects, you just want to do: playlist[i] = {...

Answer 2

If I am not mistaken, you want something like this:

var video = {
  plugins: {
    controls: {
      playlist: false
    }
  },
  clip:  {
      wmode: 'opaque',
      baseUrl: "/video/",
      autoPlay: false
  }
}

// check if there are actually more than one video
if(files.length > 1){
  video.plugins.controls.playlist = true;
  var playlist = [];
  for ( var i = 0, l = files.length; i < l; i++ )
  {
     playlist.push({url: files[i], title: 'Video '+ i});
  }
  video.playlist = playlist;
}
else {
  video.clip.url = files[0];
}

The corresponding entries (like video.playlist or video.clip.url) are added dynamically. Never traverse arrays with the for ( ... in ...) construct!

Answer 3

1. don't use for-in for arrays
2. use push method to add new elements to an array (the format you used only exists in PHP)

Code:

// assuming you have video declared before
var video = { ... };

//get video list - example: video1.flv;test23.flv;Grabledable.flv
var files = j('.videos').html().split(';');
// assume first we have one video, so no need of playlist
var isplaylist = false;
// check if there are actually more than one video
if ( files.length > 1 ) {
    isplaylist = true;
    var playlist = new Array();
    for ( var i = 0; i < files.length; i++ ) {
        playlist.push ({
            url: files[i],
            title: 'Video ' + i
        });
    }
};

video.playlist = playlist;