My first Apollo Application: zoomBrowser

March 21, 2007 · 8 Comments

I had a little play this morning with Apollo and Flex, and I apologize to all you Flexers out there, I haven't as yet had the time to REALLY get into Flex, so all of this is really obvious to you all. Anyway, I made a little browser implementation, you can load a URL and browse as you normally would, but if you have bad eyesight (as I do at 6 am) its nice to be able to zoom into the web page, hence zoomBrowser! The code for this is really simple:

<?xml version="1.0" encoding="utf-8"?>
<mx:ApolloApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" height="700" width="800">

<mx:Script>
   <![CDATA[
      private function loadURL():void{
         htmlBrowser.location = locationBar.text;
      }
   ]]>
</mx:Script>
   <mx:HTML id="htmlBrowser" right="10" left="10" bottom="30" top="40" scaleX="{zoomSlider.value}" scaleY="{zoomSlider.value}"/>
   <mx:HSlider id="zoomSlider" right="10" bottom="10"  minimum="0.5" value="1" maximum="3" snapInterval="0.1" liveDragging="true"/>
   <mx:TextInput id="locationBar" text="http://" right="59" left="50" top="10" enter="loadURL()"/>
   <mx:Button label="Go" id="goButton" right="10" top="10" click="loadURL()"/>
   <mx:Label text="URL:" left="10" top="10"/>
   <mx:Label text="Zoom:" right="178" bottom="5"/>
   
</mx:ApolloApplication>

There are two functions, loadURL and zoomBrowser. LoadURL is called either when you press enter in the mx:TextInput field or when you click on the "Go" button. The mx:HTML item is simply bound to the slider and it resizes with the values. Amazing that you can build such a complicated app (if you think about it) with so few lines of code! Download and unzip and give it a whirl (you need to download the Apollo runtime from Adobe Labs)

Tags: AIR · flex

8 responses so far ↓

1 Kevin Roche // Sep 22, 2008 at 4:12 PM

Impresive. I can't wait to try it myself.
2 IanT // Sep 22, 2008 at 4:12 PM

Nice, Mark. Good to see that Apollo's so simple to use. I'll be interested to see how the installation part of Apollo evolves - I can't see an immediate use for Apollo in our own products unless there's some sort of silent install/redistributable for the Apollo runtime.

(I can't even find an 'uninstall Apollo app' option anywhere yet, but may be missing something.)
3 Gareth // Sep 22, 2008 at 4:12 PM

Ian is right, my biggest disappointment with Apollo is the lack of an uninstall and that the users have to first install the runtime.. but I guess its still an alpha.
4 Mark Drew // Sep 22, 2008 at 4:12 PM

Indeed its still an Alpha, and I have spotted some problems with it (minor and probably they are *MY* problems rather than Apollo's) to do with managing the HTML component... but I think its a nice way to build my own apps... now to integrate it with XMLRPC so I can edit my blog posts!
5 Daniel Tome // Sep 22, 2008 at 4:12 PM

Hi Mark,

There's no need to zip the air file. It already is a zip file. Try renaming the .air file to zip, and open it. You'll see the folder structure with your swf file. You've also included the source. Thanks!

Nice Idea for a first apollo app! Good work.

Here are some "issues" I found:
- When zooming, it also zooms the scrollbar.
- If you enter an address without http:// it doens't work.
- Sites with Flash don't work :-( (I've tested one that uses swfObject, not sure on other embeding options.)

Cheers
6 Ernesto Quezada // Sep 22, 2008 at 4:12 PM

is it just me or the link to download the file is not working?
gives me a 404 error...

salut!
7 Mark Drew // Sep 22, 2008 at 4:12 PM

I was in the process of putting just the .air file, but my webserver doesnt seem to like it. (due to this: http://weblogs.macromedia.com/mesh/archives/2007/03/setting_the_mim.html) and since I am on a shared host, cant do much about it!

So, a zip it is for the moment kids :)
8 johnb // Sep 22, 2008 at 4:12 PM

you can uninstall apollo apps from the windows add/remove programs screen...I nearly missed that myself.

Mark Drew (Redux)- cf_etc...

a compendium of railo, cfml, cfeclipse and technology topics