Posterous theme by Cory Watilo

Filed under: Code

Django: CSRF verification failed. Request aborted.

I just recently upgraded to Django v1.2.3. I'm really diggin' this new version so far. The framework has significantly matured now. There were no major problems with porting my existing sites except when I went into the CMS, would make an edit and then tried to save any changes to the db and I would get the following error message: "CSRF verification failed. Request aborted." I had NEVER seen that error before and no idea what to do. As with most things related to Django, (and really almost all open source projects), there was no documentation on this error. Not in the release notes. Not in the online documentation. Nowhere! I was foreseeing a long night ahead of me trying to get to the bottom of this error. So after some digging around I came across this blog entry from Jordan Messina that solved it for me. I sharing the solution here. Simply edit your settings.py file and add the following lines to the MIDDLEWARE_CLASSES section: 'django.middleware.csrf.CsrfViewMiddleware', 'django.middleware.csrf.CsrfResponseMiddleware', So it should now look like this: MIDDLEWARE_CLASSES = ( 'django.middleware.common.CommonMiddleware', 'django.contrib.sessions.middleware.SessionMiddleware', 'django.middleware.csrf.CsrfViewMiddleware', 'django.middleware.csrf.CsrfResponseMiddleware', 'django.contrib.auth.middleware.AuthenticationMiddleware', 'django.contrib.messages.middleware.MessageMiddleware', ) Kill the server. (If it's running.) Run "syncdb". Run the server and voila... when you save all should be good with the world. This saved me hours of my life. (Your mileage may vary.)

Intercepting UIButton Touch Events

I was recently building an iPhone app that required a UIButton be held down and then released after a certain period of time had elapsed. The problem I encountered was that testing for touchesBegan didn't work for buttons. I'm not talking about UIControlEvents. I didn't need to know that button had been tapped or it's current state. I needed to know when the button was being pressed and when it was released. The solution was to simply create a UIButton subclass and pass it's touches up the responder chain. MyButton.h - [code lang="cpp"] @interface MyButton : UIButton { } - (void) touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event; @end [/code] MyButton.m - [code lang="cpp"] #import "BrakeButton.h" @implementation BrakeButton - (void) touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { [self.nextResponder touchesBegan:touches withEvent:event]; // This is where the touch is passed on } - (void) touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event { [self.nextResponder touchesEnded:touches withEvent:event]; // This is where the touch is passed on } @end [/code] Then in your view controller be sure to import your new class: [code lang="cpp"] #import "MyButton.h" [/code] Then you simply implement the touchesBegan and touchesEnded methods. [code lang="cpp"] -(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { NSLog(@"Button Touches began"); } -(void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event { NSLog(@"Button Touches ended"); } [/code] So what is happening here? The main point to understand is that UIButtons are in actuality just UIViews. So they inherit from UIViews giving them the ability to access UIView-like functionality. (touchesBegan, touchesEnded, etc...) I've seen many folks banging their heads against the wall trying to figure out how to capture / intercept button touches so I apparently it's a pretty common problem. Let me know if you find this helpful.

Using the UIImagePickerController in an iPhone OS v2.2.1 app & On A OS v3.0 Device

I recently wrote an iPhone application for a client using v2.2.1 of the iPhone SDK. (The client did not want to go OS v3.0 yet.) I needed to give a user the capability of taking and uploading a picture with the built-in camera or uploading a picture from the photo library on the phone. Seems pretty straightforward so far. Yes? I thought so. It turned out to be pretty tricky but the solution was very simple and was staring me in the face. The Problem I had a UIViewController with an UIImageView setup to be used as a container for the selected image. I also had several UIButtons on the page. (One button for calling up the camera. Another button for calling up the photo library, etc...) So what should have happened is that the Camera or photo library UI would display a Modal View window the user instructing them to either take a picture or select a photo from their library. Once they did that, they would be returned to the main view and whatever photo they took or selected would appear in UIImageView as a preview. However, when I was selecting the photo the "editingInfo" NSDictionary object that was supposed to be returned would be there only about 50% of the time. The other 50% it would be returned empty. I double and triple checked my code and it was all correct. Something was zapping my dictionary object and I couldn't, for the life of me, figure out what it was. The second part to this problem was that the preview image never appeared whenever the user was grabbing their image from the camera. It worked if the photo library was the source but not if it was the camera. Very, very frustrating. Here is my original code: My .h file - [code lang="cpp"] @interface AddPhotoController : UIViewController { IBOutlet UIImageView *imageView; IBOutlet UIButton *snapNewPictureButton; IBOutlet UIButton *selectFromPhotoLibraryButton; } @property (nonatomic, retain) UIImageView *imageView; @property (nonatomic, retain) UIButton *snapNewPictureButton; @property (nonatomic, retain) UIButton * selectFromPhotoLibraryButton; [/code] My .m file - [code lang="cpp"] @implementation AddPhotoController @synthesize imageView, snapNewPictureButton, selectFromPhotoLibraryButton; - (IBAction)getCameraPicture:(id)sender { UIImagePickerController *picker = [[UIImagePickerController alloc] init]; picker.delegate = self; picker.sourceType = UIImagePickerControllerSourceTypeCamera; picker.allowsImageEditing = YES; [self presentModalViewController:picker animated:YES]; [picker release]; } - (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingImage:(UIImage *)image editingInfo:(NSDictionary *)editingInfo { NSLog(@"Image Meta Info.: %@",editingInfo); UIImage *selectedImage = image; imageView.image = selectedImage; self._havePictureData = YES; [self.useThisPhotoButton setEnabled:YES]; [picker dismissModalViewControllerAnimated:YES]; } - (void)imagePickerControllerDidCancel:(UIImagePickerController *)picker { [picker dismissModalViewControllerAnimated:YES]; } [/code] Like I said before, it all seems pretty straightforward. However, there were two things wrong with the above code. #1. Deprecated Method The UIImagePickerController method, – imagePickerController:didFinishPickingImage:editingInfo:, is deprecated in v3.0 of the iPhone OS. So even though I built the app using SDK v2.2.1, because the app will be running on 3.0 devices, I needed to use the new and improved method, - imagePickerController:didFinishPickingMediaWithInfo:editingInfo, which contains FIVE pieces of really important information:
  1. UIImagePickerControllerMediaType - Which specifies the type of media that this dictionary contains.
  2. UIImagePickerControllerOriginalImage - Contains the original non-cropped image.
  3. UIImagePickerControllerEditedImage - Contains the user-edited cropped image.
  4. UIImagePickerControllerCropRect - Contains the CGRect that was applied to the original image.
  5. UIImagePickerControllerMediaURL - If the object is a movie, this object contains the URL to be used by the media player.
I simply accessed the "UIImagePickerControllerEditedImage" object from the dictionary and was off to the races. #2. Dismissing the Modal View This one was really painful as it was so simple to solve. In order for the UIImageView to be updated correctly, you must dismiss the ImagePicker modal window BEFORE you attempt to update your UIImageView. As a result of this, here is my updated method call: [code lang="cpp"] - (void) imagePickerController:(UIImagePickerController *)thePicker didFinishPickingMediaWithInfo:(NSDictionary *)imageInfo { [thePicker dismissModalViewControllerAnimated:YES]; UIImage *img = [imageInfo objectForKey:@"UIImagePickerControllerEditedImage"]; previewImage.image = nil; self.previewImage.image = img; NSData *imageData = UIImagePNGRepresentation(img); if ([imageData length] > 0) { [self archivePictureData:imageData]; self._havePictureData = YES; [self.useThisPhotoButton setEnabled:YES]; } } [/code] That was it. Hope that was helpful.

Case Study: Carlos Santana iPhone App

Media_httpwwwlawrence_ifafm
About a month ago, my company: WebSight Design released our first iPhone application, (http://itunes.com/app/Santana), for the musician Carlos Santana. I thought it might be interesting and maybe even helpful for others iPhone developers if I listed some of my experiences with building this application. I figure I would describe the application (features, etc...), and illustrate some of the pitfalls I encountered throughout the development process and how they were dealt with.

Media_httpwwwlawrence_yfkey
Application Features
Right off the bat, having such a distinctive and dynamic client such as Carlos Santana means that nothing can be done in a simply pedestrian manner. (The man is an icon for crying out loud.) We wanted to incorporate custom artwork to try to create an immersive as an experience as possible. (Without blowing the bank of course.) We wanted the focus to be on his music. So we started there. Our Creative Director has been working with Santana for years now so she knew exactly what needed to be done. She came up with the icons for the navigation and the photo-scroller watermark image.

Seeing how we wanted it to be focused on Carlos' music, we incorporated several of his most popular music videos and song tracks. We optimized all of the videos for delivery specifically for the iPhone. We included his entire album discography and even included links to purchase songs and entire albums, (How old am I that I actually refer to them as "albums".), via iTunes. but we also wanted to take advantage of the intimate nature of the iPhone by bringing back a feature that Carlos had intended for his website called: Musician's Corner.

Media_httpwwwlawrence_ywjek
I really wanted to take advantage of the personal or intimate nature of the iPhone. On Santana.com, there is a section buried way, way down on the site called "The Musician's Corner". The original intent was to establish an area online where fellow musicians and fans could see and hear directly from Carlos and the musicians in his band, and learn how they work. Gain a better understanding and appreciation of some of his most popular songs. A few videos had been recorded and posted to the Santana website. Unfortunately, it never really took off. (I think, because it was so buried on the site.) However, I felt that the iPhone was the PERFECT platform for this type of content. With the tacit agreement from Santana Management, we added two videos for a couple of Carlos' most popular songs: Black Magic Woman and Oye Como Va. We added them to the "More" section of the application under the heading "Lessons".

So all told, we had about 12 videos and 25 music tracks. Plus, the discography, bio information, News and Tour Dates, made for a pretty hefty app. (Both in size and overall experience.)

Ad-hoc Distribution
Once we had the foundation laid out, I wanted to get the application installed on Carlos' and/or an iPhone for Santana Management. Apple provides two methods for deploying an app on to an iPhone: 1.) Via the App Store. 2.) Via Ad-hoc Distribution. Ad-hoc is the method given to developers to test their app or to get client approvals and such. Apple is very clear about it's instructions on what you need to do in order to make Ad-hoc distribution work. I was so focused on building the app that I didn't test as throughly as I could have, the steps to make the ad-hoc method work. The day came that Santana Management wanted me to install the application so they could play with it and review it. Sat there for several hours and could not for the life of me get it to work. That could have killed the deal right then and there. Thankfully, the folks over at Santana Management were very cool and understanding. They saw it running on my phone so they knew I wasn't trying to pull a fast one. Still, that could have spelled the end-game right there.

Certificates and App Store Submission
Actually, writing the app code was the easy part compared to submitting the app to Apple and getting through their review process. First off, you have no idea how long it will take. You aren't given a ballpark or even just a rough estimate. Nada. You just have to wait. We waited for one month before we were finally approved. (I have spoken with folks at Apple and they have since told me that the amount of time we spent "In Review" was about normal.)

My second error in this whole thing was that I failed to put in the appropriate alerts for when there is no available Internet connection. (Either WiFi, 3G or Edge.) I know, I know... a really silly, academic and time-wasting error. Well, Apple caught it immediately and rejected the app. doh! However, corrected the error and resubmitted the app within 24 hours of said rejection. One month later, I received notice that we were approved and inserted into the App Store.

Lessons Learned
There are several lessons I took away from the whole experience of developing for the iPhone platform for the first time. Here are a few of them:

  1. Read the Apple Human Interface Guidelines (HIG): Apple is *very* serious about developers following their guidelines. Plus, it's actually a really good read with lots of extremely helpful information. Don't skip this... you have been warned.
  2. Work With A Designer: I recently attended an iPhone Tech Talk where I sat in on the UI Design workshop. Several iPhone apps were compared to one another. Time-and-time again, the most popular apps in their category were the ones with original artwork and a unique UI. Let's face it. A table view is what it is. The trick is to come up with a unique approach to solving common problems. I was lucky enough to have access to a great designer. Take the time to work on the UI.
  3. Check for Leaks: Leaks will crash your app. Apple provides an AWESOME app called Shark to help with tracking down memory leaks and helping optimize your code.
  4. Code to Avoid Leaks: There are many best practices you should follow to avoid writing "leaky" code to begin with. Remember, there is no garbage collecting on the iPhone yet, (we'll see in v3.0), so be sure to watch your retain-and-release counts. (It sounds much more daunting than it actually is.)
  5. Use the Simulator But Don't Rely On It: The iPhone simulator that comes with the iPhone SDK is very nice but you have to be careful when using it. Sometimes code that works correctly in the simulator DOES NOT work once you compile and deploy onto the phone. This is true inversely as well. For example, I couldn't figure out why I kept getting an error when compiling code for the simulator that included the Media framework. As soon as I just recompiled and deployed to the phone, the error went away.
  6. Test Ad-Hoc Deployment: There is gonna come a time when you need to deploy your app on a phone other than the one you use for your development. Perhaps your client would like to see the application running on their phone. You don't want to be caught off guard like that. I know already... it's not a fun position to be in!
  7. Submit and Be Patient: There is no rhyme-or-reason to the Apple app review process. (At least no reason they've made public anyway.) You just have to submit your app and then walk away. Go walk the dog. Go work on another app. Go be with your family that you have been neglecting for the past few weeks. ;-) Some application categories have a longer review queue than others. Regardless, it's a fact that you're gonna have some time on your hands. Don't fight it. Embrace it.

The only other takeaway from this whole experience I found is that people LOVE Carlos Santana. In the first week alone that the application was available in the Apple App Store, it was downloaded and installed by over one thousand iPhone and iPod Touch users. I've received comments from users that they really love the original artwork and in particular, they really like the music lessons. (I'm a musician too. I know what I'm talking about.)

I would love to hear if anyone has downloaded the app and would like to get your thoughts on it. Drop me a line and let me know.

I've Fallen in Love... Her Name is Cocoa!

I've recently *really* been getting into Cocoa development for both the MacOSX and the iPhone. Can I just say that Cocoa, (especially Cocoa Touch), ROCKS!!! I am in the middle of building a soon-to-be-published app for the Apple App Store. I forgot how much I loved writing C code. Objective-C is really a nice, simple and clean language. I'll be posting some tutorials on it soon.

Configuring MySQL-Python on OSX Leopard

At WebSight Design we try to remain technology-agnostic. (The right tool or language for the job.) Having said that, we are primarily a PHP shop. However, with the launch of the Google App Engine, we've been looking seriously at Python. In recent years, I have become a big fan of development frameworks so to aide me in learning the ways of the snake, I have been using the Django framework. Getting it all setup wasn't difficult. The Django installation is very easy. I started to get errors when I was trying to get my models working when I ran manage.py syncdb. Come to find out that I needed the MySQL-Python library installed to work correctly on my OSX Leopard machine. Most everything that I illustrate below is to be executed from the command-line. So if you are not familiar with working in the Terminal app, this post is gonna suck for you. So here is what I did to get it working: First, download MySQL for Python http://sourceforge.net/projects/mysql-python for me it was MySQL-python-1.2.2.tar Unpack it: tar -xzf MySQL-python-1.2.2.tar Change to the directory that is created: cd MySQL-python-1.2.2 Next, locate your "mysql_conf" file. locate mysql_conf Copy the location of this file so you can use it in the next few steps. Next, you need to edit the "site.cfg" file and add the path to your "mysql_conf" file. mysql_config = "YOUR_PATH_GOES_HERE" Also, (very important), change the line that reads: threadsafe = True TO threadsafe = False Save and exit the file. Now, compile and install the library: python setup.py build sudo python setup.py install NOTE: You may need to run "python setup.py clean" if you previously tried to build and install the library. Next is the *really* important part. After I kept getting errors trying to run the Python server I found the missing piece on the ProjectMouse.org site. The key is, you need to create a symbolic link in the location that Python is expecting to find MySQL. This should be a link to the MySQL library that your computer is setup to use. See here: sudo mkdir /usr/local/mysql/lib/mysql/ sudo ln -s /usr/local/mysql-5.0.41-osx10.4-i686/lib/libmysqlclient_r.15.dylib /usr/local/mysql/lib/mysql/libmysqlclient_r.15.dylib NOTE: "mysql-5.0.41-osx10.4-i686" is where MySQL is installed on my machine. Change this to the location specific to your computer. Finally, import MySQLdb into Python and test your configuration: python import MySQLdb NOTE: You should not see any errors or warnings. Hit "Ctrl+d" to exit the interepter. Now go back and run manage.py syncdb again and you should not get any errors.

Compile / Configure Subversion w/SSL Enabled

My company: WebSight Design, uses Subversion for source and version control for all of our web development projects. We also use the amazing hosted Subversion service: Springloops. (If you ever need a Subversion deployment tool, Springloops is it!) Springloops repositories are *only* accessible via HTTPS. In order to gain access to a repository from the command line, I had to re-configure Subversion on our servers to enable access to ssl urls. Seems simple enough and actually it is. However, as with all things Linux, the devil is in the details. I spent hours-upon-hours trying to get it to work. It simply comes down to the sequence of steps you take. What I've done here is list out all of the steps done to get it working to save you from the same pain I went through. So, I am assuming that you are trying to access a Subversion repository via an https url and you are getting the message "ssl not supported" or something similar to this. I know, it sucks and it's pretty frustrating. I promise you however, if you do *exactly* what I spell out below, in the sequence I list... you will be up and working in about 15-20mins. The only other assumption here is that you are using Ubuntu or some other Debian-based Linux distro that supports the APT package manager. It's important to know that Subversion uses a module called Neon to provide ssl connectivity. The key here is to use the version of Neon for your specific release of Subversion. This is key to everything else that follows. Don't just grab the latest versions of Subversion and Neon and assume they will work correctly together. So with that... let's get to work. First, make sure the following packages are installed on your server: GCC sudo apt-get install build-essential Expat sudo apt-get install expat Libxml-dev sudo apt-get install libxml2-dev Next, download latest Subversion files: wget http://subversion.tigris.org/downloads/subversion-1.4.X.tar.bz2 wget http://subversion.tigris.org/downloads/subversion-deps-1.4.X.tar.bz2 NOTE: "X" above is a placeholder for your version no. Untar em' in this order: tar xjvf subversion-1.4.X.tar.bz2 tar xjvf subversion-deps-1.4.X.tar.bz2 Once you have extracted the files, open the file "subversion-1.4.X/INSTALL". Locate the section on Neon. It will state which version you need to download and compile with this version of Subversion. Make sure you are *not* in the Subversion directory you just created. Then go ahead and download Neon: wget http://www.webdav.org/neon/neon-0.2X.0.tar.gz NOTE: The "X" above is placeholder for the version of Neon you need. Next, extract the archive: tar zxvf neon-1.X.X.tar.gz cd neon-1.X.X Now is where the fun begins. You need to compile and install Neon. Do the following from *within* the Neon directory you created: ./configure --with-ssl make sudo make install It's important to note that Neon gets installed to /usr/local by default. You need to note that as you will now need it when compiling and installing Subversion. Change back to the Subversion folder: cd ../subversion-1.4.X Compile and install Subversion: ./configure --enable-ssl --with-neon=/usr/local/ make sudo make install Now, realize that the Subversion compilation and installation process takes a long time to complete. So just be patient. You can ignore any warning messages that scroll by. You only need to be concerned with error messages or if the installation stops for any reason. Once compilation and installation are complete you need to confirm that you are running the version of Subversion you just tried to install: svn --version --quiet If you get *anything* other than the version number you thought you installed, something went horribly wrong. Go back to the very beginning of this and try again. Most time folks get errors it is because that don't have the prerequisite tools and utilities installed. If you see the version you wanted... you're all good!

Getting Ruby-on-Rails Up On Ubuntu / Apache

GCC: sudo apt-get install build-essential Ruby & Friends: sudo apt-get install ruby1.8-dev ruby1.8 ri1.8 rdoc1.8 irb1.8 libreadline-ruby1.8 libruby1.8 *** Create Symbolic Links *** sudo ln -s /usr/bin/ruby1.8 /usr/local/bin/rubysudo ln -s /usr/bin/ri1.8 /usr/local/bin/risudo ln -s /usr/bin/rdoc1.8 /usr/local/bin/rdocsudo ln -s /usr/bin/irb1.8 /usr/local/bin/irbZlib:wget http://www.zlib.net/zlib-1.2.3.tar.gztar -xvf zlib-1.2.3.tar.gz./configure make sudo make install Install Open SSL: sudo apt-get install openssl libssl-dev Apache 2.2: wget http://apache.rmplc.co.uk/httpd/httpd-2.2.4.tar.gz tar -xvf httpd-2.2.4.tar.gz ./configure --prefix=/usr/local/apache --enable-proxy --enable-proxy-http --enable-proxy-balancer --enable-dav --enable-rewrite --enable-so --enable-http --enable-ssl --enable-expires --enable-headers --enable-mods=deflate_module --with-php --with-mysql --with-susexec --disable-info --without-berkeley-db --enable-dav=shared --enable-dav-lock=shared --with-included-apr make sudo make install MySQL & Postfix Postfix: sudo apt-get install postfix note: select "Internet Site" option when prompted MySQL: sudo apt-get install mysql-server mysql-common mysql-client libmysqlclient15-dev libmysqlclient15off sudo apt-get install libmysql-ruby1.8 /* MySQL Ruby bindings */ sudo apt-get install libmysqlclient15-dev libmysql-ruby1.8sudo gem install mysql note: Select the most recent non-win32 version FastCGI: sudo apt-get install libfcgi libfcgi-dev libfcgi-ruby1.8 sudo gem install fcgi Lighttpd: apt-get install lighttpd RubyGems: wget http://rubyforge.iasi.roedu.net/files/rubygems/rubygems-0.9.0.tgz tar xvzf rubygems* cd rubygems* sudo ruby setup.rb Rails: sudo gem install rails --include-dependencies Mongrel, Subversion and Capistrano Mongrel: sudo gem install daemons gem_plugin mongrel mongrel_cluster --include-dependencies Subversion: sudo apt-get install libxml2-dev wget http://subversion.tigris.org/downloads/subversion-1.4.5.tar.gz tar xfz subversion-1.4.5.tar.gz cd subversion-1.4.5 ./configure --with-apr=/usr/local/apache/bin/apr-1-config --with-apr-util=/usr/local/apache/bin/apu-1-config --with-apxs=/usr/local/apache/bin/apxs --without-berkeley-db --with-ssl Capistrano sudo gem install deprec --include-dependencies Redcloth sudo gem install redcloth