New Innerviews iPhone/iPad App Delivers In-Depth, Immersive and Visually-Rich Interviews With Rock, Pop and Jazz Luminaries

Innerviews, a pioneering online music magazine, and Heuristic Media, a leading mobile app development company, are pleased to announce the immediate availability of the Innerviews app for iPhone, iPad and iPod Touch via the Apple App Store.

The Innerviews iPhone/iPad app delivers in-depth, uncompromising interviews with music’s most vital and original voices, optimized for mobile reading. Brought to you by the creator of Innerviews.org, the first and longest-running music magazine on the Web, the app explores the widest variety of genres and styles of music imaginable, including rock, jazz, hip-hop, world music, pop, and folk. A few of the artist interviews featured in the initial app deployment include Porcupine Tree, Richard Thompson, Marcus Miller, Mike Stern, Ron Carter, Afro Celt Sound System, and Steve Hackett.

The Innerviews app was designed by Heuristic Media CEO and lead programmer Tony Wallace. Heuristic Media is a renowned app creation and consulting firm responsible for a variety of business and educational apps. The Innerviews app is Heuristic Media’s first foray into the entertainment and media field.

Key features of the Innerviews iPhone/iPad app include:

• The latest Innerviews interviews optimized for mobile viewing
• Playlists exploring the latest in eclectic album and reissue releases
• News about forthcoming interviews
• Artists reflecting on their Innerviews experiences
• Full support for iPhone 4 Retina display, iPad, earlier iPhones, and iPod Touch
• Offline reading support
• Gorgeous, intuitive user interface

The app is available for download at: http://www.itunes.com/apps/innerviews

Notice that the resulting string contains percent escapes in place of the apostrophe (‘%27′) and exclamation point (‘%21′), but the spaces have been replaced with ‘+’ symbols. This is what urlencode() does, and it works just fine if the encoded string will be decoded by the urldecode() function in PHP.

Things get a little more complicated if you use urlencode() to encode a query response for an iOS app. The standard, easy way to remove percent escapes is the NSString stringByReplacingPercentEscapesUsingEncoding: method. When used on the encoded string shown above, we get this:

Oh crap. Why are the ‘+’ symbols still there?

Well, it turns out that stringByReplacingPercentEscapesUsingEncoding: is named accurately – it only replaces percent escapes, so it thinks those ‘+’ symbols are a valid part of the string. There are two simple ways around this problem.

If you have to work with an existing web service that uses urlencode(), you can prepare the string for decoding with the NSString stringByReplacingOccurrencesOfString:withString: method, which replaces the ‘+’ symbols with percent escapes representing spaces (%20):

Ahhhhh… much better!

VERY IMPORTANT DETAIL: You have to replace the ‘+’ symbols before decoding the percent escapes or you’ll run into problems when you encounter a string that contains a valid ‘+’ symbol (i.e. one that the string contained before encoding). The urlencode() function escapes ‘+’ with ‘%2B’ before escaping spaces with ‘+’ , so valid ‘+’ symbols will be safe until you finally decode the string. If that seems confusing to you, read it again and again and again. Or just urlencode() a string that contains a ‘+’ symbol and study the result. You’ll figure it out.

On the other hand, if you’re building your own web service for your app, you can avoid that extra step by using PHP’s rawurlencode() function:

The rawurlencode() function conforms to RFC 1738 and uses ‘%20′ escapes for spaces, so it plays nice with stringByReplacingPercentEscapesUsingEncoding: right away:

There you have it! URL encoded strings decoded by NSString in one (or two) easy step(s).

The response to the iPad has been predictable. Apple’s fans are crazy for it, while their detractors are falling over themselves to find fault with it. Is the device perfect? Certainly not. Either was the iPhone, but that didn’t stop over 40 million people from buying it, or stop tens of thousands of developers from contributing over 140000 apps to the platform. Apple currently owns the smartphone market, not because they produced the clearest sounding phone or the most powerful mobile email client, but because they created the best mobile user experience. The iPad promises a similar experience, with the benefit of a larger screen.

The large screen is the whole point of this device. Small devices like the iPhone are wonderful for personal use, but they don’t make it easy to share your content with others. They also don’t support truly rich user interfaces. Before you point out that your laptop handles those things nicely (one of the most frequent arguments against the iPad), stop for a moment to consider what you have to do to get information into it and out of it.

Your laptop is married to input technology that is over 30 years old. The QWERY keyboard and mouse/trackpad don’t exist because they represent the best way to accomplish their respective tasks. They exist because, several decades ago, they were the only practical solutions. Apple clearly recognizes that past necessity is a bad reason to continue doing anything, and the iPad is the first big step towards freeing users and developers from the limitations presented by these devices. Once app developers get their hands on actual devices, expect to find yourself using fewer traditional input methods and more innovative, human-friendly gestures. We don’t know exactly what these gestures will be yet, but the potential is there for the first time.

Multitouch technology married to a screen with decent real estate is a big deal for usability and accessibility. Anybody who can’t see that should think a little less about how they worked yesterday, and more about how they want to work tomorrow.

Update:

Steven F. does a better job of explaining this than me. Read his take on the iPad and the future of computing.

If you’re constantly disappointed by minor flaws in new technology, like a lot of people seem to be, you should probably read this.

Note: This is not an in-depth tutorial. You should already be comfortable with basic JavaScript and programming concepts like functions and arrays before you start.

Start by examining the code in example 1:

Example 1: albuminfo.js

There is a lot going on here, so let’s dig deeper and see what it all does.

Explaining Object Definitions

The first three functions are object definitions. These serve as templates for the information you will store and manipulate. Object definitions look a lot like like regular functions. You pass data to the object definition the same way you would pass values to a function, then create properties to store it.

A property definition looks like this:

In the above, this refers to the object itself, theProperty is the name of the property, and theData is data that was passed to the object definition. Properties can store simple values, like strings and numbers, arrays, or even other objects.

You access properties like this:

Properties can also represent functions. This allows you to create objects that can perform complex (or not so complex) operations on their own data, and return a result. Look at the albumObject() definition in example 1. The artist property represents a function that compiles the artist’s first and last names into a single string, with a space between the names. Similar functions are used in the trackObject and personnelObject definitions to make it easier to access full names. Remember that whenever you access a property that represents a function, you have to include the brackets at the end of the function name:

Implementation

Now that we have taken a quick overview of object definitions, let’s work backwards though the rest of the code to see how it works. The implementation line is very simple:

This calls the printAlbum function when the window has finished loading. The first line of the printAlbum function creates a variable called album to store the result of the albumInfo function.

The albumInfo function simply creates and returns a new albumObject object. Notice that the last argument passed to the new object is a call to the trackList function. The result of this function call will be stored in the tracks property.

The trackList function returns an array of trackObject objects, which contain information about the album’s tracks. The first two lines of the trackList function are calls to the personnelSideA and personnelSideB functions, which return arrays of personnelObject objects. Each instance of personnelObject contains the name and role of a different contributor. The personnelSideA and personnelSideB functions both call the allPersonnel, which creates all the personnelObject objects for the entire album.

Turning our attention back to the printAlbum function, we can summarize the album object as follows:

• 1. The album object is an instance of albumObject, and stores general information about the album.
• 2. The album object contains a property called tracks, which stores an array of trackObject objects.
• 3. Each instance of trackObject contains a property called personnel, which stores an array of personnelObject objects.

The remainder of the printAlbum function writes the contents of the album object to the document. Example 2 shows the result.

If you want to try the script for yourself, you’ll need to reference it from an HTML document. Example 3 provides a basic one that will do the trick.

Example 3: albuminfo.html

Wrapping Up

There we have it! All that data is wrapped up in one little object, easily accessible whenever we need it. The usefulness of custom objects goes beyond static data storage. For example, I use them to track users’ mouse clicks and movements when designing complex user interfaces. By creating objects to represent each element on a page, I can independently track which objects have been clicked and change their state or appearance accordingly. Custom objects can take a lot of the pain out of JavaScript programming, and make your scripts more efficient at the same time.

Jim suggested that the tax settings panel should be moved into the app, instead of the iPhone settings bundle where it currently resides. A number of Taxulator users have asked for this change and it will be implemented in the next update.

Follow @heuristicmedia for updates about iPhone apps and web development.

Follow @heuristicmusic for updates about new music, cool links and my daily ranting.

You can also find us on Facebook.