0
안녕하세요 저는 테스트 sencha touch geotwitter를 시도했지만 작동하지 않는 것 같습니다. 예 : Google지도 표시로 데모에서와 같이 각 트윗을 표시합니다.Sencha 예제가 작동하지 않습니다.
가장 인기있는 트윗을 표시하는 데 3 번째 탭을 추가하려고했습니다. 어떻게 추가할까요?
것은 내가이 데모 http://dev.sencha.com/deploy/touch/getting-started.html
http://www.youtube.com/watch?v=YdRHPSbsIhc
// JavaScript Document
Ext.setup ({
tabletStartupScreen: 'tablet_startup.png',
phoneStartupScreen: 'phone_startup.png',
icon: 'icon.png',
glossOnIcon:false,
onReady:function() {
var panel,timeline, mapPanel, mostPopular,tabBar, refresh;
timeline =new Ext.Component({
title:"Timeline",
scroll:"vertical",
tpl:[
'<tpl for=".">',
'<div class="tweet">',
'<div class="avatar"><img src="{profile_image_url}" /></div>',
'<div class="tweet-content">',
'<h2>{from_user}</h2>',
'<p>{text}</p>',
'</div>',
'</div>',
'</tpl>'
]
})
mapPanel = new Ext.Map({
title:"Map",
geolocation:true
});
mostPopular ={
title:"MostPopular",
html:'Most Popular tweets'
}
panel = new Ext.TabPanel({
fullscreen:true,
animation:'slide',
items:[mapPanel, timeline, mostPopular]
});
refresh = function() {
var coords = mapPanel.geo.coords;
Ext.util.JSONP.request ({
url:'http://search.twitter.com/search.json',
callbackKey: 'callback',
params: {
geocode: coords.latitude + ',' + coords.longitude + ',' + '5mi',
q: "healthcare ",
rpp: 30
},
callback:function(data){
var tweetlist = data.results;
timeline.update(tweetlist);//update the tweets in the timeline
// Add point to map by looping through tweets
for(var i=0, ln =tweetlist.length; i<ln; i++){
var tweet =tweetlist[i];
if(tweet.geo && tweet.geo.coordinates) {
addMarker(tweet);
}
}
}
});
addMarker = function(tweet){
var latlng = new google.maps.Latlng(tweet.geo.coordinates);
var marker = new google.maps.Marker ({
map:mappanel.map,
position:latlng
});
google.maps.event.addListener(marker,"click", function() {
tweetBubble.setContent(tweet.text);
tweetBubble.open(mapPanel.map, marker);
});
};
tweetbubble = new google.maps.InfoWindow();
/*mock statis data var tweet= {
text:"hello world",
from_user:"nelstrom",
profile_image_url:"http://bit.ly/nelstrom-avatar"
};
var tweetlist =[tweet, tweet, tweet, tweet, tweet, tweet, tweet, tweet, tweet, tweet, tweet, tweet, tweet, tweet, tweet, tweet, tweet, tweet, tweet]
timeline.update(tweetlist);// update the tweets in the timeline
*/
}
tabBar = panel.getTabBar();
tabBar.addDocked ({
dock:'right',
xtype:'button',
ui:'plain',
iconMask:true,
iconCls:'refresh',
align:'center',
handler:refresh
});
mapPanel.geo.on('locationupdate',refresh);
}
});