A little while ago I posted that I was experimenting with Appcelerator. I had combined 2 different tutorials that I had found to create a fortune cookie app that opens to randomly reveal 1 of a bunch of tweets. While I don’t claim to be an expert I am posting the source with my comments only because it was requested. Usually I would prefer to have a bit more experience before making a tutorial.
I also regret that I will not show you how to setup Appcelerator to successfully output for iPhone and Android. The process is well documented in other places and to be honest the hoops you have to jump through to do stuff with Apple gives me a headache
The code is relatively simple. The toughest part is getting your mind around the way that the JS framework for Appcelerator works. The order that tasks are carried out in etc. While this project could be done out without the constructor functions grouping the code, it is a lot tidier this way and more flexible when you have multiple windows and you want to refresh. The only way to refresh a window in Appcelerator is to run the code again on a “FOCUS” event.
So here it is, I hope it is helpful.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 | //Detecting if this is an iPhone as it will change the way we do random numbers var HAS_BAD_RAND = Ti.Platform.osname.match(/iphone/); //Creating the native Window UI element in which to put our graphics and text var win = Ti.UI.createWindow({ backgroundColor: '#ffffff' }); //Opening a link to Twitter and storing the results in a Network Object called loader var loader = Titanium.Network.createHTTPClient(); loader.open("GET","http://api.twitter.com/1/statuses/user_timeline.json?screen_name=aziraphael&count=10"); //Creating the variables we will be using including all graphic holders and the array var fortunes = []; var closed_cookie, opened_cookie, opened_cookie_image, paper, new_cookie_button; //The function that is called once the tweets are loaded loader.onload = function() { //Feed the tweets into our array var tweets = eval('('+this.responseText+')'); for (var i = 0; i < tweets.length; i++) { var tweet = tweets[i].text; fortunes.push(tweet); } //Run our constructor functions createElements(); assignBehaviors(); arrangeElements(); win.open(); //Opening the window practically opens the app }; //Our constructor functions are arranged for tidyness function createElements() { //Our closed cookie image view (an apple term for the image container) closed_cookie = Ti.UI.createImageView({ image: 'closed_cookie.png', width: 'auto', height: 'auto' }); //An empty view to store the open image and text opened_cookie = Ti.UI.createView({ width: 300, height: 234, visible: false }); //The actual opened cookie image opened_cookie_image = Ti.UI.createImageView({ image: 'opened_cookie2.png', width: 'auto', height: 'auto' }); //The text box in which the tweets are written paper = Ti.UI.createLabel({ color: '#000000', font: {fontSize: 12, fontFamily: 'Courier'}, width: 150, height: 'auto', top: 25, left: 40, opacity: 0, textAlign: 'left' }); //A native iPhone or Android button new_cookie_button = Ti.UI.createButton({ title: 'New Fortune Cookie', width: 200, height: 50, bottom: 25, visible: false }); } //Setting up the event listeners function assignBehaviors() { //If the cookie is clicked on closed_cookie.addEventListener('click', openCookie); //If the "new cookie" button is clicked on new_cookie_button.addEventListener('click', newCookie); //If the phone is shaken (same result as "new cookie") Ti.Gesture.addEventListener('shake', toggleCookie); } //Toggle between open and closing cookie function toggleCookie( ev ) { opened_cookie.visible ? newCookie() : openCookie(); } //Set up a new cookie function newCookie( ev ) { paper.opacity = 0; opened_cookie.hide(); new_cookie_button.hide(); closed_cookie.show(); } //Opening the cookie function openCookie( ev ) { closed_cookie.hide(); paper.text = getFortune(); opened_cookie.show(); paper.animate({opacity:1, duration:500}); //Fade tween of paper new_cookie_button.show(); } function getFortune() { //Get a fortune using custom random function var rand = random( 0, fortunes.length - 1 ); return fortunes[ rand ]; } //Custom random function function random( min, max ) { //Because of a bug in iPhone random numbers, the number //is determined using the time as a random seed- min = min || 0; max = max || 1; if (HAS_BAD_RAND){ max += 1; } var secs = (new Date()).getTime(); var rand = min + Math.round( Math.random( secs ) * (max - min) ); return HAS_BAD_RAND ? ( secs % max ) : rand; } //Adding all the visual elements to the window in the right order function arrangeElements() { opened_cookie.add( opened_cookie_image ); opened_cookie.add( paper ); win.add( closed_cookie ); win.add( opened_cookie ); win.add( new_cookie_button ); } //Initiating the whole process by sending the loader request loader.send(); |

