show tweets inside div from an asynchronous loop

Posted by ak_47 on Stack Overflow See other posts from Stack Overflow or by ak_47
Published on 2012-09-03T20:14:16Z Indexed on 2012/09/05 21:38 UTC
Read the original article Hit count: 191

Filed under:

Am trying to laod tweets into a div after looping them from yahoo placemaker. They are loading on the div but the information shown by them is placemaker's last result.

This is the code..

            function getLocation(user, date, profile_img, text,url) {
            var templates = [];
            templates[0] = '<div><div></div><h2 class="firstHeading">'+user+'</h2><div>'+text+'</div><div><p><a href="' + url + '"target="_blank">'+url+'</a></p></div><p>Date Posted- '+date+'</p></div>';
            templates[1] = '<table width="320" border="0"><tr><td class="user"  colspan="2" rowspan="1">'+user+'</td></tr><tr><td width="45"><a href="'+profile_img+'"><img src="'+profile_img+'" width="55" height="50"/></a></td><td width="186">'+text+'<p><a href="' + url + '"target="_blank">'+url+'</a></p></td></tr></table><hr>';
            templates[2] = '<div><div></div><h2 class="firstHeading">'+user+'</h2><div>'+text+'</div><div><p><a href="' + url + '"target="_blank">'+url+'</a></p></div><p>Date Posted- '+date+'</p></div>';
            templates[3] = '<table width="320" border="0"><tr><td class="user"  colspan="2" rowspan="1">'+user+'</td></tr><tr><td width="45"><a href="'+profile_img+'"><img src="'+profile_img+'" width="55" height="50"/></a></td><td width="186">'+text+'<p><a href="' + url + '"target="_blank">'+url+'</a></p></td></tr></table><hr>';
                        var geocoder = new google.maps.Geocoder();
                Placemaker.getPlaces(text, function (o) {
                    console.log(o);
                    if (!$.isArray(o.match)) {
                        var latitude = o.match.place.centroid.latitude;
                        var longitude = o.match.place.centroid.longitude;
                        var myLatLng = new google.maps.LatLng(latitude, longitude);
                        var marker = new google.maps.Marker({
                            icon: profile_img,
                            title: user,
                            map: map,
                            position: myLatLng
                        });

                      var infowindow = new google.maps.InfoWindow({
                          content: templates[0].replace('user',user).replace('text',text).replace('url',url).replace('date',date)
                      });
                      var $tweet = $(templates[1].replace('%user',user).replace(/%profile_img/g,profile_img).replace('%text',text).replace('%url',url));
                      $('#user-banner').css("visibility","visible");$('#news-banner').css("visibility","visible");
                      $('#news-tweets').css("overflow","scroll").append($tweet);
                      function openInfoWindow() {
                          infowindow.open(map, marker);
                      }
                      google.maps.event.addListener(marker, 'click', openInfoWindow);
                      $tweet.find(".user").on('click', openInfoWindow);
                        bounds.extend(myLatLng);
                    }
                });
            }

© Stack Overflow or respective owner

Related posts about JavaScript