Skip to content

Instantly share code, notes, and snippets.

@egomez99
Created January 23, 2012 22:11
Show Gist options
  • Save egomez99/1665795 to your computer and use it in GitHub Desktop.
Save egomez99/1665795 to your computer and use it in GitHub Desktop.
var win = Titanium.UI.currentWindow;
var isAndroid = false;
if(Titanium.Platform.name == 'android') {
isAndroid = true;
}
//
// CREATE ANNOTATIONS
//
var mountainView = Titanium.Map.createAnnotation({
latitude : 37.390749,
longitude : -122.081651,
title : "Appcelerator Headquarters",
subtitle : 'Mountain View, CA',
pincolor : isAndroid ? "orange" : Titanium.Map.ANNOTATION_RED,
animate : true,
leftButton : '../images/appcelerator_small.png',
myid : 1 // CUSTOM ATTRIBUTE THAT IS PASSED INTO EVENT OBJECTS
});
var apple = Titanium.Map.createAnnotation({
latitude : 37.33168900,
longitude : -122.03073100,
title : "Steve Jobs",
subtitle : 'Cupertino, CA',
pincolor : Titanium.Map.ANNOTATION_GREEN,
animate : true,
rightButton : '../images/apple_logo.jpg',
myid : 2 // CUSTOM ATTRIBUTE THAT IS PASSED INTO EVENT OBJECTS
});
var atlantaParams = {
latitude : 33.74511,
longitude : -84.38993,
title : "Atlanta, GA",
subtitle : 'Atlanta Braves Stadium\nfoo',
animate : true,
image : 'img/029vps_.png',
rightButton : Titanium.UI.iPhone.SystemButton.DISCLOSURE,
myid : 3 // CUSTOM ATTRIBUTE THAT IS PASSED INTO EVENT OBJECTS
};
if(!isAndroid) {
atlantaParams.pincolor = Titanium.Map.ANNOTATION_PURPLE;
} else {
atlantaParams.pinImage = "../images/map-pin.png";
}
var atlanta = Titanium.Map.createAnnotation(atlantaParams);
//
// PRE-DEFINED REGIONS
//
var regionAtlanta = {
latitude : 33.74511,
longitude : -84.38993,
animate : true,
latitudeDelta : 0.04,
longitudeDelta : 0.04
};
var regionSV = {
latitude : 37.337681,
longitude : -122.038193,
animate : true,
latitudeDelta : 0.04,
longitudeDelta : 0.04
};
//
// CREATE MAP VIEW
//
var mapview = Titanium.Map.createView({
mapType : Titanium.Map.STANDARD_TYPE,
region : {
latitude : 33.74511,
longitude : -84.38993,
latitudeDelta : 0.5,
longitudeDelta : 0.5
},
animate : true,
regionFit : true,
userLocation : true,
annotations : [atlanta, apple]
});
if(!isAndroid) {
mapview.addAnnotation(atlanta);
}
mapview.selectAnnotation(atlanta);
win.add(mapview);
//
// NAVBAR BUTTONS
//
var removeAll = null;
var atl = null;
var sv = null;
var sat = null;
var std = null;
var hyb = null;
var zoomin = null;
var zoomout = null;
var wireClickHandlers = function() {
removeAll.addEventListener('click', function() {
mapview.removeAllAnnotations();
});
atl.addEventListener('click', function() {
var blob = Ti.UI.createImageView({
image : "img/4832532-Atlanta_Braves_Turner_Field-Atlanta.jpg"
}).toBlob();
atlanta.image = blob;
var annotations = [atlanta];
mapview.annotations = annotations;
// set location to atlanta
mapview.setLocation(regionAtlanta);
// This has no effect. :-(
///mapview.annotations[0].image = 'img/4832532-Atlanta_Braves_Turner_Field-Atlanta.jpg';
// activate annotation
///mapview.selectAnnotation(mapview.annotations[0].title,true);
Ti.API.error("CLICKED ATL");
});
sv.addEventListener('click', function() {
Ti.API.info('IN SV CHANGE');
// set location to sv
mapview.setLocation(regionSV);
// activate annotation
mapview.selectAnnotation(mapview.annotations[1].title, true);
});
sat.addEventListener('click', function() {
// set map type to satellite
mapview.setMapType(Titanium.Map.SATELLITE_TYPE);
});
std.addEventListener('click', function() {
// set map type to standard
mapview.setMapType(Titanium.Map.STANDARD_TYPE);
});
hyb.addEventListener('click', function() {
// set map type to hybrid
mapview.setMapType(Titanium.Map.HYBRID_TYPE);
});
zoomin.addEventListener('click', function() {
mapview.zoom(1);
});
zoomout.addEventListener('click', function() {
mapview.zoom(-1);
});
};
if(!isAndroid) {
removeAll = Titanium.UI.createButton({
style : Titanium.UI.iPhone.SystemButtonStyle.BORDERED,
title : 'Remove All'
});
win.rightNavButton = removeAll;
//
// TOOLBAR BUTTONS
//
// button to change to ATL
atl = Titanium.UI.createButton({
style : Titanium.UI.iPhone.SystemButtonStyle.BORDERED,
title : 'ATL'
});
// activate annotation
mapview.selectAnnotation(mapview.annotations[0].title, true);
// button to change to SV
sv = Titanium.UI.createButton({
style : Titanium.UI.iPhone.SystemButtonStyle.BORDERED,
title : 'SV'
});
mapview.addEventListener('complete', function() {
Ti.API.info("map has completed loaded region");
});
var flexSpace = Titanium.UI.createButton({
systemButton : Titanium.UI.iPhone.SystemButton.FLEXIBLE_SPACE
});
// button to change map type to SAT
sat = Titanium.UI.createButton({
title : 'Sat',
style : Titanium.UI.iPhone.SystemButtonStyle.BORDERED
});
// button to change map type to STD
std = Titanium.UI.createButton({
title : 'Std',
style : Titanium.UI.iPhone.SystemButtonStyle.BORDERED
});
// button to change map type to HYBRID
hyb = Titanium.UI.createButton({
title : 'Hyb',
style : Titanium.UI.iPhone.SystemButtonStyle.BORDERED
});
// button to zoom-in
zoomin = Titanium.UI.createButton({
title : '+',
style : Titanium.UI.iPhone.SystemButtonStyle.BORDERED
});
// button to zoom-out
zoomout = Titanium.UI.createButton({
title : '-',
style : Titanium.UI.iPhone.SystemButtonStyle.BORDERED
});
wireClickHandlers();
win.setToolbar([flexSpace, std, flexSpace, hyb, flexSpace, sat, flexSpace, atl, flexSpace, sv, flexSpace, zoomin, flexSpace, zoomout, flexSpace]);
} else {
var activity = Ti.Android.currentActivity;
activity.onCreateOptionsMenu = function(e) {
var menu = e.menu;
atl = menu.add({
title : 'ATL'
});
sv = menu.add({
title : 'SV'
});
sat = menu.add({
title : 'Sat'
});
std = menu.add({
title : 'Std'
});
hyb = menu.add({
title : 'Hyb'
});
zoomin = menu.add({
title : "Zoom In"
});
zoomout = menu.add({
title : 'Zoom Out'
});
removeAll = menu.add({
title : 'Remove All'
});
wireClickHandlers();
};
}
//
// EVENT LISTENERS
//
// region change event listener
mapview.addEventListener('regionChanged', function(evt) {
Titanium.API.info('maps region has updated to ' + evt.longitude + ',' + evt.latitude);
});
var annotationAdded = false;
// map view click event listener
mapview.addEventListener('click', function(evt) {
// map event properties
var annotation = evt.annotation;
var title = evt.title;
var clickSource = evt.clicksource;
// custom annotation attribute
var myid = (evt.annotation) ? evt.annotation.myid : -1;
Ti.API.info('mapview click clicksource = ' + clickSource);
// use custom event attribute to determine if atlanta annotation was clicked
if(myid == 3 && evt.clicksource == 'rightButton') {
// change the annotation on the fly
evt.annotation.rightView = Titanium.UI.createView({
width : 20,
height : 20,
backgroundColor : 'red'
});
evt.annotation.leftView = Titanium.UI.createView({
width : 20,
height : 20,
backgroundColor : '#336699'
});
evt.annotation.title = "Atlanta?";
evt.annotation.pincolor = Titanium.Map.ANNOTATION_GREEN;
evt.annotation.subtitle = 'Appcelerator used to be near here';
evt.annotation.leftButton = 'images/appcelerator_small.png';
}
if(myid == 2) {
if(annotationAdded === false) {
mapview.addAnnotation(mountainView);
annotationAdded = true;
} else {
mapview.removeAnnotation(mountainView);
annotationAdded = false;
}
}
});
// annotation click event listener (same as above except only fires for a given annotation)
atlanta.addEventListener('click', function(evt) {
// get event properties
var annotation = evt.source;
var clicksource = evt.clicksource;
Ti.API.info('atlanta annotation click clicksource = ' + clicksource);
});
apple.addEventListener('click', function(evt) {
// get event properties
var annotation = evt.source;
var clicksource = evt.clicksource;
Ti.API.info('apple annotation click clicksource = ' + clicksource);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment