I’m doing a small YouTube app with node-webkit but I’m not a master with JavaScript.
I have some JSON objects from gdata responses and have items in a particular order, always the same. I can load everything in my playlist but I can’t keep the same order than the JSON object.
I dont understand sync/async calls.
Here's my code: http://pastebin.com/hM72T6rT
How can I do this with my for loop, so that I get all the items loaded in the same order as my JSON?
The functions are in the order I want:
function searchVideos(user_search){
try{
$('#items_container').empty();
youtube.feeds.videos({
q: ''+user_search+'',
'start-index' : ''+current_start_index+'',
'max-results': 25,
orderby: 'relevance'
},
function( err, data ) {
if( err instanceof Error ) {
console.log( err )
} else {
items=data.items
current_prev_start_index=current_start_index;
if (current_page == 1){
$('.back').css({'display':'None'});
} else {
$('.back').css({'display':'block'});
$('.next').css({'display':'block'});
}
if (items.length < 25) {
$('.next').css({'display':'None'});
}
for(var i=0; i<items.length; i++) {
video_loaded = false;
truc = function() { getVideoInfos('http://www.youtube.com/watch?v='+items[i].id) }(i);
}
}
});
}catch(err){
console.log('searchVideos err: '+err)
}
}
function getVideoInfos(video_link){
try {
ytdl.getInfo(video_link, function(err,info){
if(err) {
console.log(err);
} else {
printVideoInfos(info);
}
});
} catch(err) {
console.log('getVideoInfos err: '+ err);
}
}
function printVideoInfos(infos){
try{
var title = infos.title;
var thumb = infos.thumbnail_url;
var vid = infos.video_id;
$('#items_container').append('<div class="youtube_item"><img src="'+thumb+'" style="float:left;"/><p><b>'+title+'</b></p><div id="youtube_entry_res_'+vid+'"></div></div>');
//console.log(infos);
var num=infos.formats.length;
if ( parseInt(num) == 0) {
return;
}
var resolutions = new Array([]);
for(var i=0; i<num; i++) {
var vlink = infos.formats[i].url;
var resolution = infos.formats[i].resolution;
var resolution_full = infos.fmt_list[i][1];
var container = infos.formats[i].container;
// if resolution is alreay available in webm continue...
if ( $.inArray(resolution, resolutions) > -1 ) {
continue;
}
resolutions.push(resolution);
if (container == 'flv' || container == '3gp') {
continue;
}
var img='';
if (resolution == "720p" || resolution == "1080p") {
img='images/hd.png';
} else {
img='images/sd.png';
}
$('#youtube_entry_res_'+vid).append('<div class="resolutions_container"><a class="video_link" href="'+vlink+'" alt="'+resolution+'"><img src="'+img+'" class="resolution_img" /><span>'+ resolution+'</span></a><a href="'+vlink+'" title="'+title+'.'+container+'" class="download_file"><img src="images/down_arrow.png" /></a></div>');
}
if ($('#youtube_entry_res_'+vid+' div a.video_link').length == 0){
$('#youtube_entry_res_'+vid).parent().remove();
}
} catch(err){
console.log('printVideoInfos err: '+);
}
}
to keep them all in order, you are going to want to use the async module, Look up the async.series function, which should help you out. That will execute everything in the order you give it.