AdLib, new iPad Javascript Framework for iPad web Development

Posted: April 7th, 2010

DOWNLOAD LINKS
DOWNLOAD UNCOMPRESSED ADLIB.JS and the IPAD INTRO.JS
Done21 reports on the curious discovery of a new Web-based framework used in the iPad that allows web pages to behave in ways much more akin to native applications than previously observed. The framework, dubbed ‘AdLib’ by the report’s author after the name of the file containing the code, was first noticed in action when navigating to Apple’s iPad User Guide using the iPad’s mobile version of Safari. It allows the user guide, which is simply a web page, to be offered in a split-pane view with scrollbars and with a native app-like feel.
What’s particularly interesting is that it does something that shouldn’t really be possible in Mobile Webkit: It includes scrolling panes that can be manipulated with a single finger, complete with the signature iPhone OS “scroll bars” and elastic transitions. If you have ever worked with Safari on the iPhone, you know that having scrolling boxes of content is sort of possible, but requires a special two-finger gesture to scroll.
Curiosity got the best of me, so I loaded the page in Safari on my laptop (and changed Safari’s user agent to mimic the iPad) and got to work with the developer tools. After extracting the JavaScript and de-minifying it, my suspicions were confirmed. Apple was manually reading the touch events, calculating the inertia of the scrolling, and manually drawing the scroll bars. It was incredible that it worked so smoothly in the browser.
The framework, which weighs in at about 4,300 lines of code, permits Mobile Safari to display the native-like user guide simply using HTML, CSS, JavaScript, the basic web technologies supported by the iPhone and iPad. It appears similar in some respects to the PastryKit framework described by John Gruber last December, although AdLib appears to be a more advanced version that incorporates iPad-specific references.
It remains to be seen whether Apple will release the custom API for use by third-developers, but despite an absence of documentation, the report notes that the framework is “extremely well thought out and complete” and could be of significant utility to developers.

Done21 reports on the curious discovery of a new Web-based framework used in the iPad that allows web pages to behave in ways much more akin to native applications than previously observed. The framework, dubbed ‘AdLib’ by the report’s author after the name of the file containing the code, was first noticed in action when navigating to Apple’s iPad User Guide using the iPad’s mobile version of Safari. It allows the user guide, which is simply a web page, to be offered in a split-pane view with scrollbars and with a native app-like feel.

What’s particularly interesting is that it does something that shouldn’t really be possible in Mobile Webkit: It includes scrolling panes that can be manipulated with a single finger, complete with the signature iPhone OS “scroll bars” and elastic transitions. If you have ever worked with Safari on the iPhone, you know that having scrolling boxes of content is sort of possible, but requires a special two-finger gesture to scroll.

Curiosity got the best of me, so I loaded the page in Safari on my laptop (and changed Safari’s user agent to mimic the iPad) and got to work with the developer tools. After extracting the JavaScript and de-minifying it, my suspicions were confirmed. Apple was manually reading the touch events, calculating the inertia of the scrolling, and manually drawing the scroll bars. It was incredible that it worked so smoothly in the browser.

The framework, which weighs in at about 4,300 lines of code, permits Mobile Safari to display the native-like user guide simply using HTML, CSS, JavaScript, the basic web technologies supported by the iPhone and iPad. It appears similar in some respects to the PastryKit framework described last December, although AdLib appears to be a more advanced version that incorporates iPad-specific references.

It remains to be seen whether Apple will release the custom API for use by third-developers, but despite an absence of documentation, the report notes that the framework is “extremely well thought out and complete” and could be of significant utility to developers.

What was more interesting is that there was an entire framework running this web application. The framework weighed in at 4,300 lines of code, and was unmistakably an Apple-born API. Every class and constant was prefixed with the letters “AD” and some of the classes include ADTabBarController, ADScrollPane, ADViewController, ADView, ADToolbar, and dozens more.

What does the AD prefix stand for? I don’t know. The framework itself was contained in a file called AdLib-ug-ipad.js, so for the time being let’s call it AdLib. I also appreciate the sense of humor the developers seem to have about the name. The accompanying application code that utilizes the framework is about 1,500 lines and offers a few clues as to how to use the AdLib framework. There is no documentation in the code or anywhere online, and the local variables are shortened to a, b, c, etc… If you want to know more about how it works, take a look at the code linked below.

Is AdLib a framework that Apple plans to release for the public? I sure hope so. The framework looks to be extremely well thought out and complete. Perhaps this will be a framework to support a future release of Dashcode, an application for writing dashboard widgets and Safari/iPhone web apps. Maybe we’ll hear something about it this Thursday at Apple’s event for iPhone OS 4.

Bookmark and Share
4 Comments »

Apple’s Pastry Kit | iPhone Javascript Toolkit

Posted: December 21st, 2009

ANOTHER UPDATE: Thanks to a anonymous Sponsor, we got now the full Assets as well DOWNLOAD THE ENTIRE ASSETS COLLECTION

iphoneguideJohn Gruber has found a javascript library for iPhone webApps, from nobody  other than Apple itself. This interesting library, called PastryKit, seems to have been pretty much undiscovered since google does not have much on it. In likes of others, Apple’s javascript library provides support for that app native-feel. (That is the main objective anyway; some look & feel emulators are pretty “good”, while others get stuck in the past).

Ok, so how do we use it, or get our hands on it?

Visit http://help.apple.com/iphone/3/mobile/ from your iPhone or iPod Touch. This is the official Apple guide using PastryKit.
Now with this page in regular Safari (on your Mac/PC), open the Develop Menu (if it’s not there, enable it in Preference|Advanced). Choose User Agent > Mobile Safari 3.x . And now you can see it in your Browser like an iPhone would. From Develop Menu, Web Inspector will let you view the script.

The HTML includes PastryKit as follows:

<!-- PastryKit -->
<link rel="stylesheet" href="dist/PastryKit-ug-compact.css">
<script type="text/javascript" src="dist/PastryKit-ug-compact.js" charset="utf-8"></script>

PastryKit Javascript and PastryKit CSS are available via a quick Download.

They are kind of hard to read because of their Compression.

Gruber looked at the source anyway:

PastryKit accomplishes all three of the aforementioned things — hiding the MobileSafari address bar, providing fixed-position toolbars, and providing scrolling with momentum — by disabling regular scrolling and setting up its own view hierarchy and implementing its own scrolling.

The  question of native iPhone apps on the web was a very hot discussion topic last month after PPK whipped up a storm on the never ending question of web-apps replacing iPhone apps. The  interesting point here is Apple’s stance. They launched the iPhone with web plattform intended to be the platform for 3rd party apps, then switched over to native apps and have not done very much to facilitate native-style web apps since then. Is a change coming? As Gruber puts it:

The $64,000 question, though, is whether PastryKit is something Apple intends (or that a team within Apple hopes) to ship publicly. It seems like a lot of effort to build a framework this rich just for this iPhone User Guide, so I’m hopeful the answer is yes. Perhaps something integrated with the next major release of Dashcode? And, perhaps with integrated UI layout tools, along the lines of Interface Builder?

UPDATE: Added full uncompressed Source to the Downloads

ANOTHER UPDATE: Thanks to a anonymous Sponsor, we got now the full Assets as well DOWNLOAD THE ENTIRE ASSETS COLLECTION

Bookmark and Share
26 Comments »

Chrome Beta for OSX almost Ready

Posted: November 30th, 2009

UPDATE Its available now DOWNLOAD GOOGLE CHROME
In Tech report posted on Nov 29th 2009, TechCrunch points to a Twitter entry from Mike Pinkerton (Chrome for Mac team) stating that there were only 8 bugs/errors remaining to be fixed before the Macintosh beta of Chrome is ready for its launch in the next month.


“8 remaining M4 Mac beta blockers! Go team! #chrome”

This means that there are only 8 things standing in the way of Chrome for Mac going beta. “M4″ stands for “milestone 4,” which is how they phrase “version 4,” which the Mac beta build of Chrome will be (the current dev channel version is 4.0.249.12, for example).

Speculation on the eight bugs noted by Pinkerton centers on this list, which is already down to four outstanding issues.

In a follow-up article, TechCrunch looks at the features for Chrome that will not be included in the initial beta release and have been pushed out to the next beta version in order to allow Google to meet its goal of releasing the initial beta before the end of the year.

- Bookmark Manager
- App Mode (allows Chrome to run Web apps in their own simplified windows)
- Task Manager
- Gears (offline support for Web apps; apparently being scrapped entirely in favor of HTML5)
- Bookmark syncing
- Multi-touch gestures
- 64-bit support
- Full support for extensions
- Full screen mode (possibly)

Developer builds of Chrome for Mac have been available for several months, but the move to a beta version suggests that users can expect to see a fairly stable browser with a number of significant features included. Work will continue on Chrome with additional Developer Preview releases occurring on a regular basis. Refined versions will then periodically be released as new additions to Chrome’s Beta channel. Releases will eventually make their way to Chrome’s “Stable” channel, which will offer “rock solid” performance without the inclusion of features still under development and testing.

Bookmark and Share
No Comments »

Google Redesigned (Google 2.0)

Posted: November 29th, 2009

So i have been browsing around, and all the sudden i came across a piece of code, using that cookie code, you are able to see a new version of google, its some kind of redesign or draft. Nothing fancy, nothing special, but check it out anyway, one feature defiantly like is the visible sidebar and options.

How to: When you paste the following into the address bar of your browser when on google.com and hit return, you should find yourself as new participant of Google’s latest and more all-encompassing prototype test – the one with a new logo, buttons, and always-visible left-hand pane in results. Please note I needed to sign out first for this to work.

Google Redesigned

Read the rest of this entry »

Bookmark and Share
1 Comment »

FTC Guideline Updates

Posted: November 29th, 2009

The FTC has updated their guidelines and rules regarding endorsements /testimonials. It is important to determine how these guidelines may affect your website or bloggind business, or how you should proceed; so be aware of this update that goes into effect on the 1st of December 2009. You can find out all the details on the FTC website and read about some members of the industry’s take on this and way to avoid trouble and be compliant.
For most of our Clients and Partners this will not have a large impact, but be warned competitive Bloggers may report you to the FTC or your Affiliate Network like commission junction, linkshare etc

VIEW PDF

Below you can see some interviews and videos with the FTC

What’s new about the Endorsement Guides?
Mary Engle, Associate Director – Bureau of Consumer Protection

Read the rest of this entry »

Bookmark and Share
No Comments »