<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>CarbonRider &#187; AIR popup</title>
	<atom:link href="http://www.carbonrider.com/tag/air-popup/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.carbonrider.com</link>
	<description>You make a matrix, you define the limits.</description>
	<lastBuildDate>Thu, 19 Jan 2012 04:35:06 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>Adobe AIR &#8211; Window Manager</title>
		<link>http://air.carbonrider.com/2010/01/14/adobe-air-window-manager/</link>
		<comments>http://air.carbonrider.com/2010/01/14/adobe-air-window-manager/#comments</comments>
		<pubDate>Thu, 14 Jan 2010 15:24:08 +0000</pubDate>
		<dc:creator>Carbon Rider</dc:creator>
				<category><![CDATA[Air]]></category>
		<category><![CDATA[adobe air]]></category>
		<category><![CDATA[AIR new window]]></category>
		<category><![CDATA[AIR popup]]></category>

		<guid isPermaLink="false">http://www.carbonrider.com/?p=176</guid>
		<description><![CDATA[If you have read my previous post AIR Notifier, it describes a simple technique to display new window in AIR. While it is very easy to create new window using the technique described in above article, it certainly not the right choice for creating new windows. Applications which may want to have a centralised control [...]]]></description>
			<content:encoded><![CDATA[<div class="tweetmeme_button" style="float: right; margin-left: 10px;">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fair.carbonrider.com%2F2010%2F01%2F14%2Fadobe-air-window-manager%2F"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fair.carbonrider.com%2F2010%2F01%2F14%2Fadobe-air-window-manager%2F&amp;style=normal&amp;b=2" height="61" width="50" /><br />
			</a>
		</div>
<p>If you have read my previous post <a title="AIR Notifier" href="http://air.carbonrider.com/2009/10/17/air-notifier" target="_self">AIR Notifier</a>, it describes a simple technique to display new window in AIR. While it is very easy to create new window using the technique described in above article, it certainly not the right choice for creating new windows. Applications which may want to have a centralised control over popup creation, customization of popup windows &#8211; will soon find it difficult to implement it. Well offcourse, the post just describes a technique for displaying new window, I thought of encapsulating the functionality and developing a convenient library API.</p>
<p><span id="more-176"></span></p>
<p>Well I have started working on same and soon will be releasing the library as opensource. Meanwhile, here is the list of features planned for libary.</p>
<p><strong>Simple to code and requires minimum one line of code to create window.<br />
</strong><br />
<strong>Options to customize appearance.</strong><br />
  - Display close, minimize, maximize, resizable<br />
  - Use standard or transparent interface.</p>
<p><strong>Option to specify location of window.</strong><br />
  - Set location of window after creation</p>
<p><strong>Unique id reference to manage window behavior.</strong><br />
  - Activate/Deactivate focus of window.<br />
  - Dynamically minimize, close, maximize window.</p>
<p><strong>Option to close all open windows.</strong></p>
<p><strong>Auto exit of all open windows on main application exit.</strong></p>
<p><span style="text-decoration: line-through;">Watch this space for release of library.</span></p>
<p>Finally I am releasing version 1 of the libray and you can <a title="AIR Popup" href="http://www.carbonrider.com/wp-content/uploads/2010/01/air_popup.zip" target="_blank">download it here</a>. To see it actually working, you can download AIR source file by <a title="AIR Popup example source" href="http://www.carbonrider.com/wp-content/uploads/2010/01/src.zip" target="_blank">clicking here</a>. (Note that the example just contain source files, you must create new AIR project and copy source &amp; library files. To download source code of the library <a title="AIR Popup source" href="http://www.carbonrider.com/wp-content/uploads/2010/01/src1.zip" target="_blank">click here</a>.)</p>
]]></content:encoded>
			<wfw:commentRss>http://air.carbonrider.com/2010/01/14/adobe-air-window-manager/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>AIR Notifier</title>
		<link>http://air.carbonrider.com/2009/10/17/air-notifier/</link>
		<comments>http://air.carbonrider.com/2009/10/17/air-notifier/#comments</comments>
		<pubDate>Sat, 17 Oct 2009 06:30:22 +0000</pubDate>
		<dc:creator>Carbon Rider</dc:creator>
				<category><![CDATA[Air]]></category>
		<category><![CDATA[AIR notification]]></category>
		<category><![CDATA[AIR notifier]]></category>
		<category><![CDATA[AIR popup]]></category>
		<category><![CDATA[popup window]]></category>

		<guid isPermaLink="false">http://air.carbonrider.com/?p=133</guid>
		<description><![CDATA[Building applications with AIR is real fun and what could be more interesting when you install it on desktop and see it running. In last few months, I have seen many applications built using Adobe AIR. Nice, soft look and feel, great functionality, quite handy are some of the words I will use to describe those applications. [...]]]></description>
			<content:encoded><![CDATA[<div class="tweetmeme_button" style="float: right; margin-left: 10px;">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fair.carbonrider.com%2F2009%2F10%2F17%2Fair-notifier%2F"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fair.carbonrider.com%2F2009%2F10%2F17%2Fair-notifier%2F&amp;style=normal&amp;b=2" height="61" width="50" /><br />
			</a>
		</div>
<p>Building applications with AIR is real fun and what could be more interesting when you install it on desktop and see it running. In last few months, I have seen many applications built using Adobe AIR. Nice, soft look and feel, great functionality, quite handy are some of the words I will use to describe those applications.</p>
<p><span id="more-133"></span></p>
<p>Well how can I keep myself from building one on this buzzing technology and so I started one. I found that building application in Flex and AIR is not so different (apart from configuration and few more added AIR API&#8217;s). The journey was so far good but when I started looking for creating a notifier that can have a pleasant look and feel and with some flashy effects, I really struggled to find options.</p>
<p>It wasn&#8217;t that bad, I found quite a few good reference sites but unfortunately none of them met my expectations. But when I saw twhirl with its awesome notification display, my fingers started googling again to find how can I get something like the one I can see now on my desktop.</p>
<p>Overall I liked the appearance of twhirl and the way stuffs are managed into it. The most interesting part was twhirl notifier. It pops up when you receive a message and it goes like whosshhh. After crawling through various sites and reading many source codes, I found an interesting project on Google Code &#8211; <a title="Bamboo Notifier" href="http://code.google.com/p/bamboo-notifier/" target="_blank">Bamboo notifier</a>. Getting deeper into the source code, helped me to understand how Bamboo displays notification and hurrayy thats what I was looking for. No additional SWC, everything built using Adobe AIR APIs.</p>
<p>I used similar concept and on top of that using Flex Effects, I finally achieved what I was looking for.</p>
<p>Well not to stretch any more, here is the code snippet that might help you to built your own notifier.<br />
There are two files,<br />
1. One that is used as popup. (Notification.mxml)<br />
2. Used to display popup. (Client.mxml)</p>
<p><strong>Notification.mxml</strong></p>
<pre class="brush: xml;">
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" creationCompleteEffect="{fade}"
width="250" height="75" cornerRadius="8" borderStyle="solid" borderThickness="1" alpha="0.1"
backgroundAlpha="0.8" backgroundColor="#2E2E2E"  creationComplete="startCloseTimer()" mouseOver="closeTimer.stop()" mouseOut="closeTimer.start()">
<mx:Script>
<![CDATA[
import mx.events.CloseEvent;
[Bindable]
public var message:String;

private var closeTimer:Timer;

private function startCloseTimer():void
{
closeTimer = new Timer(3000);
closeTimer.addEventListener(TimerEvent.TIMER, function():void
	{
	mvEffect.play();
	closeTimer.stop();
	closeTimer = new Timer(1500);
	closeTimer.addEventListener(TimerEvent.TIMER, function():void
		{
		dispatchEvent(new CloseEvent(CloseEvent.CLOSE));
		closeTimer.stop();
		});
	closeTimer.start();
});
closeTimer.start();
}

private function closeWindow():void
{
mvEffect.play();
closeTimer.stop();
closeTimer = new Timer(1500);
closeTimer.addEventListener(TimerEvent.TIMER, function():void
	{
	dispatchEvent(new CloseEvent(CloseEvent.CLOSE));
	closeTimer.stop();
	});
closeTimer.start();
}
]]&gt;
</mx:Script>
<mx:Text text="{message}" x="16" y="24" width="170" height="39" color="#FFFFFF" fontFamily="Arial" fontSize="12" id="notificationText"/>
<mx:Button click="closeWindow()" label="X" cornerRadius="8" fillColors="[#B70000, #560000]" fillAlphas="[1.0, 1.0]" right="0" top="0" color="#FFFFFF"/>
<mx:Fade id="fade" alphaFrom="0.1" alphaTo="1.0" duration="2000"/>
	<mx:Move id="mvEffect" target="{this}" yTo="{this.y + 150}" duration="1000"/>

</mx:Canvas>
</pre>
<p><strong>Client.mxml</strong></p>
<pre class="brush: xml;">
<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="showPopup()">
<mx:Script>
<![CDATA[
import mx.events.CloseEvent;
import notification.Notification;
private function showPopup():void
{
var descriptionPopup:NativeWindow;
var nativeWindowOptions:NativeWindowInitOptions = new NativeWindowInitOptions();
nativeWindowOptions.type = NativeWindowType.UTILITY;
nativeWindowOptions.systemChrome = NativeWindowSystemChrome.NONE;
nativeWindowOptions.transparent = true;
nativeWindowOptions.resizable = true;
descriptionPopup = new NativeWindow(nativeWindowOptions);
descriptionPopup.width = 250;
descriptionPopup.height = 75;
descriptionPopup.stage.align = "TL";
descriptionPopup.stage.scaleMode = "noScale";
descriptionPopup.alwaysInFront = true;
descriptionPopup.x = Screen.mainScreen.visibleBounds.right - descriptionPopup.width;
descriptionPopup.y = Screen.mainScreen.visibleBounds.bottom - descriptionPopup.height;

var container:Notification = new Notification();
container.message = "Hey hi there";
mx.core.Application.application.addChild(container);
mx.core.Application.application.removeChild(container);
descriptionPopup.stage.addChild(container);
descriptionPopup.activate();

container.addEventListener(CloseEvent.CLOSE, function():void{
	descriptionPopup.close();
});
}
]]&gt;
</mx:Script>
<mx:Button label="Hi there" click="showPopup()"/>
</mx:WindowedApplication>
</pre>
<p>For your reference, I am attaching Flex project with this post. <a href="http://www.carbonrider.com/wp-content/uploads/2009/11/AIRRND.zip">Click here</a> to download.</p>
<p>Hope this will help you to kickstart building your own Notifier.<br />
So keep airing and notifying <img src='http://www.carbonrider.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
]]></content:encoded>
			<wfw:commentRss>http://air.carbonrider.com/2009/10/17/air-notifier/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
	</channel>
</rss>

