<?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>Flex notes &#187; Flex</title>
	<atom:link href="http://www.robertbak.com/wordpress/category/flex/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.robertbak.com/wordpress</link>
	<description>My notes on Flex related topics</description>
	<lastBuildDate>Thu, 10 Nov 2011 10:49:53 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>Generating PDF-s on the client side (including non-latin chars)</title>
		<link>http://www.robertbak.com/wordpress/2011/11/generating-pdf-s-on-the-client-side-including-non-latin-chars/</link>
		<comments>http://www.robertbak.com/wordpress/2011/11/generating-pdf-s-on-the-client-side-including-non-latin-chars/#comments</comments>
		<pubDate>Thu, 10 Nov 2011 09:59:54 +0000</pubDate>
		<dc:creator>Robert Bak</dc:creator>
				<category><![CDATA[Actionscript]]></category>
		<category><![CDATA[Flex]]></category>
		<category><![CDATA[Flex 4]]></category>
		<category><![CDATA[pdf]]></category>
		<category><![CDATA[polskie znaki]]></category>
		<category><![CDATA[purepdf]]></category>
		<guid isPermaLink="false">http://www.robertbak.com/wordpress/?p=435</guid>
		<description><![CDATA[This seems to come up every once in a while, especially outside US and UK. People start looking at the PDF generating libraries, and find that when they use a non-latin character it stops to work. It needs some special care but it is really easy to get it working, I&#8217;m going to show how [...]]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop Automatic --><!-- End Shareaholic LikeButtonSetTop Automatic --><p>This seems to come up every once in a while, especially outside US and UK. People start looking at the PDF generating libraries, and find that when they use a non-latin character it stops to work. It needs some special care but it is really easy to get it working, I&#8217;m going to show how to do it, step by step, when using purepdf (a port of iText</p>
<h3>Getting ready</h3>
<p>You can find purepdf on <a href="http://code.google.com/p/purepdf/downloads/list">google code</a>. Once you download the zip you&#8217;ll find <em>purePDF.swc</em> and <em>purePDFont.swc</em>, for this example you&#8217;ll only need the first one so put it in your projects lib folder and you&#8217;re ready.<br />
The next thing you need is a font to use, I&#8217;ll be using <em>Ubuntu-L.ttf</em> which can be downloaded from <a href="http://font.ubuntu.com/">font.ubuntu.com</a>, just drop it in the project. You can use any font, as long as it supports the charset you&#8217;ll be using. At this point my project looks something like this:<br />
<a href="http://www.robertbak.com/wordpress/wp-content/uploads/2011/11/testingPDF1.png"><img src="http://www.robertbak.com/wordpress/wp-content/uploads/2011/11/testingPDF1.png" alt="" title="testingPDF1" width="233" height="206" class="aligncenter size-full wp-image-437" /></a><br />
<span id="more-435"></span></p>
<h3>Flex stuff</h3>
<p>To make the example work, we need some basic UI which, in the example, begins and ends with:</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #66cc66;">&lt;</span>s:TextInput id=<span style="color: #ff0000;">&quot;TI&quot;</span> <span style="color: #0066CC;">text</span>=<span style="color: #ff0000;">&quot;ążółć - works!&quot;</span> <span style="color: #66cc66;">/&gt;</span><br />
<span style="color: #66cc66;">&lt;</span>s:<span style="color: #0066CC;">Button</span> click=<span style="color: #ff0000;">&quot;createPDF()&quot;</span> label=<span style="color: #ff0000;">&quot;Generate PDF&quot;</span> y=<span style="color: #ff0000;">&quot;22&quot;</span> <span style="color: #66cc66;">/&gt;</span></div></div>
<p>As you can see, the text has some polish characters (as Flex text is UTF encoded there&#8217;s no problem with putting what you need there). The other thing worth noting is that we&#8217;re going to be creating the PDF after a click, that&#8217;s important as we want to save the pdf to the user system and that&#8217;s only possible when the <em>save</em> function is being called after an user interaction.</p>
<p>What&#8217;s left to do now is embedding the font:</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #66cc66;">&#91;</span>Embed<span style="color: #66cc66;">&#40;</span>source=<span style="color: #ff0000;">&quot;Ubuntu-L.ttf&quot;</span>, mimeType=<span style="color: #ff0000;">&quot;application/octet-stream&quot;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#93;</span><br />
<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> embeddedFont: <span style="color: #000000; font-weight: bold;">Class</span>;</div></div>
<p>The mineType is required to stop Flex from handling the fonts as a font  <a class="simple-footnote" title="Without it you&#8217;ll get a message like &#8220;font transcoding requires you to specify &#8216;fontName&#8217; and one of &#8216;source&#8217;, &#8216;systemFont&#8217;, or &#8216;sourceList&#8217;&#8221;" id="return-note-435-1" href="#note-435-1"><sup>1</sup></a>. That&#8217;s all the setup we need no we can get to the purepdf code.</p>
<h3>Purepdf code</h3>
<p>The code that&#8217;s needed to start using the font and generatign the pdf takes around 10 lines, I&#8217;ll paste it first and than add comments.</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;height:300px;"><table cellspacing="0" cellpadding="0"><tbody><tr><td style="padding:5px;text-align:center;color:#888888;background-color:#EEEEEE;border-right: 1px solid #9F9F9F;font: normal 12px/1.4em Monaco, Lucida Console, monospace;"><div>1<br />2<br />3<br />4<br />5<br />6<br />7<br />8<br />9<br />10<br />11<br />12<br />13<br />14<br />15<br />16<br />17<br />18<br />19<br />20<br />21<br />22<br />23<br /></div></td><td><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap">protected <span style="color: #000000; font-weight: bold;">function</span> createPDF<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span><br />
<span style="color: #66cc66;">&#123;</span><br />
&nbsp; &nbsp;<span style="color: #808080; font-style: italic;">// Prepare the font </span><br />
&nbsp; &nbsp;FontsResourceFactory.<span style="color: #006600;">getInstance</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>.<span style="color: #006600;">registerFont</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;newFont.otf&quot;</span>, <span style="color: #000000; font-weight: bold;">new</span> embeddedFont<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#41;</span>;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <br />
&nbsp; &nbsp;<span style="color: #000000; font-weight: bold;">var</span> bf: BaseFont = BaseFont.<span style="color: #006600;">createFont</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;newFont.otf&quot;</span>, BaseFont.<span style="color: #006600;">IDENTITY_H</span>, BaseFont.<span style="color: #006600;">EMBEDDED</span> <span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp;<span style="color: #808080; font-style: italic;">// parameters are:</span><br />
&nbsp; &nbsp;<span style="color: #808080; font-style: italic;">// family, font-size, style, color, BaseFont</span><br />
&nbsp; &nbsp;<span style="color: #000000; font-weight: bold;">var</span> <span style="color: #0066CC;">font</span>: org.<span style="color: #006600;">purepdf</span>.<span style="color: #0066CC;">Font</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp;= <span style="color: #000000; font-weight: bold;">new</span> org.<span style="color: #006600;">purepdf</span>.<span style="color: #0066CC;">Font</span><span style="color: #66cc66;">&#40;</span> org.<span style="color: #006600;">purepdf</span>.<span style="color: #0066CC;">Font</span>.<span style="color: #0066CC;">UNDEFINED</span>, <span style="color: #cc66cc;">24</span>, -<span style="color: #cc66cc;">1</span>, RGBColor.<span style="color: #006600;">BLACK</span>, bf <span style="color: #66cc66;">&#41;</span>;<br />
<br />
&nbsp; &nbsp;<span style="color: #000000; font-weight: bold;">var</span> buffer:ByteArray = <span style="color: #000000; font-weight: bold;">new</span> ByteArray<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <br />
&nbsp; &nbsp;<span style="color: #000000; font-weight: bold;">var</span> writer:PdfWriter = PdfWriter.<span style="color: #006600;">create</span><span style="color: #66cc66;">&#40;</span> buffer, PageSize.<span style="color: #006600;">A4</span><span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp;<span style="color: #000000; font-weight: bold;">var</span> doc:PdfDocument = writer.<span style="color: #006600;">pdfDocument</span>;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <br />
&nbsp; &nbsp;doc.<span style="color: #006600;">open</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp;<span style="color: #808080; font-style: italic;">// When creating a paragraph &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </span><br />
&nbsp; &nbsp;<span style="color: #808080; font-style: italic;">// add the font parameter</span><br />
&nbsp; &nbsp;doc.<span style="color: #0066CC;">add</span><span style="color: #66cc66;">&#40;</span> <span style="color: #000000; font-weight: bold;">new</span> Paragraph<span style="color: #66cc66;">&#40;</span>TI.<span style="color: #0066CC;">text</span>,<span style="color: #0066CC;">font</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp;doc.<span style="color: #0066CC;">close</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;<br />
<br />
&nbsp; &nbsp;<span style="color: #808080; font-style: italic;">// save the file</span><br />
&nbsp; &nbsp;<span style="color: #000000; font-weight: bold;">var</span> f: FileReference = <span style="color: #000000; font-weight: bold;">new</span> FileReference<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp;f.<span style="color: #006600;">save</span><span style="color: #66cc66;">&#40;</span> buffer, <span style="color: #ff0000;">&quot;test.pdf&quot;</span> <span style="color: #66cc66;">&#41;</span>;<br />
<span style="color: #66cc66;">&#125;</span></div></td></tr></tbody></table></div>
<p>In lines <em>4-9</em> we&#8217;re using the embedded font file to create an instance of an <em>org.purepdf.Font</em>, that&#8217;s all you need to do to start using the font. The rest of the code is standard purepdf code.</p>
<p>11 &#8211; creates a buffer to hold the pdf file</p>
<p>12 &#8211; creates a <a href="http://www.sephiroth.it/purepdf/asdoc-output/org/purepdf/pdf/PdfWriter.html#create()">PDFWriter</a> linked with that buffer and sets the size of the pdf page</p>
<p>13 &#8211; gets the <a href="http://www.sephiroth.it/purepdf/asdoc-output/org/purepdf/pdf/PdfDocument.html">PDFDocument</a> from the writer</p>
<p>14 &#8211; opens the document</p>
<p><strong>15</strong> &#8211; adds a <a href="http://www.sephiroth.it/purepdf/asdoc-output/org/purepdf/elements/Paragraph.html">paragraph</a> to the open document. Here&#8217;s the important change if you already have some code written, you need to set the second parameter which is the font you&#8217;re wanting to use. If it supports the chars you&#8217;re using there will be no problem.</p>
<p>16 &#8211; closes the document</p>
<p>and 20-21 save the document to the user filesystem.</p>
<p>That&#8217;s it, the PDF you get in result looks something like this:<br />
<a href="http://www.robertbak.com/wordpress/wp-content/uploads/2011/11/testingPDF2.png"><img src="http://www.robertbak.com/wordpress/wp-content/uploads/2011/11/testingPDF2-300x59.png" alt="" title="testingPDF2" width="300" height="59" class="aligncenter size-medium wp-image-450" /></a></p>
<p>Hopefully this get&#8217;s people started. You can find many more examples and tutorials on the <a href="http://code.google.com/p/purepdf/w/list">google code</a> page for the project.</p>
<p><a href="http://dl.dropbox.com/u/207892/Flex/TestingPurePDF.fxp">Download source code.</a></p>
<div class="shr-publisher-435"></div><!-- Start Shareaholic LikeButtonSetBottom Automatic --><!-- End Shareaholic LikeButtonSetBottom Automatic --><div class="simple-footnotes"><p class="notes">Notes:</p><ol><li id="note-435-1">Without it you&#8217;ll get a message like &#8220;font transcoding requires you to specify &#8216;fontName&#8217; and one of &#8216;source&#8217;, &#8216;systemFont&#8217;, or &#8216;sourceList&#8217;&#8221; <a href="#return-note-435-1">&#8617;</a></li></ol></div>]]></content:encoded>
			<wfw:commentRss>http://www.robertbak.com/wordpress/2011/11/generating-pdf-s-on-the-client-side-including-non-latin-chars/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Basic socket server in AIR</title>
		<link>http://www.robertbak.com/wordpress/2011/10/example-basic-socket-server-in-air/</link>
		<comments>http://www.robertbak.com/wordpress/2011/10/example-basic-socket-server-in-air/#comments</comments>
		<pubDate>Tue, 25 Oct 2011 11:04:56 +0000</pubDate>
		<dc:creator>Robert Bak</dc:creator>
				<category><![CDATA[Actionscript]]></category>
		<category><![CDATA[Flex]]></category>
		<guid isPermaLink="false">http://www.robertbak.com/wordpress/?p=316</guid>
		<description><![CDATA[The socket api is relatively simple, but I couldn&#8217;t find a simple step by step tutorial on getting sockets working. The basic idea was to create an app that can send text to connected clients (which I&#8217;ll be using to send code while teaching a Flex class), and getting that basic functionality working is amazingly [...]]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop Automatic --><!-- End Shareaholic LikeButtonSetTop Automatic --><p>The socket api is relatively simple, but I couldn&#8217;t find a simple step by step tutorial on getting sockets working. The basic idea was to create an app that can send text to connected clients (which I&#8217;ll be using to send code while teaching a Flex class), and getting that basic functionality working is amazingly simple with AIR 2+. </p>
<h3>The config</h3>
<p>To make life easier, first I&#8217;ve created a class that will hold the configuration for the socket, it&#8217;s nothing interesting, but as it will be used later, I&#8217;ll put it at the top. There are a few things to keep in mind while choosing the port &#8211; it needs to be smaller than 65536 and should be bigger than 1024 (see <a href="http://help.adobe.com/en_US/air/reference/html/flash/net/ServerSocket.html#bind()">docs</a>) and ports can&#8217;t be shared, so you need to make sure that the port you&#8217;re choosing isn&#8217;t already used <a class="simple-footnote" title="Remember to close the socket when closing the app, otherwise you might run into trouble when launching it again" id="return-note-316-1" href="#note-316-1"><sup>1</sup></a>.</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> SocketConfig<br />
<span style="color: #66cc66;">&#123;</span><br />
&nbsp; &nbsp;<span style="color: #0066CC;">static</span> <span style="color: #0066CC;">public</span> const port:<span style="color: #0066CC;">int</span> = <span style="color: #cc66cc;">9231</span>;<br />
&nbsp; &nbsp;<span style="color: #0066CC;">static</span> <span style="color: #0066CC;">public</span> const address:<span style="color: #0066CC;">String</span> = <span style="color: #ff0000;">&quot;127.0.0.1&quot;</span>;<br />
<span style="color: #66cc66;">&#125;</span></div></div>
<h3>The server &#8211; setup</h3>
<p>Creating the server is really easy. We just need to set up an instance of the <a href="http://help.adobe.com/en_US/air/reference/html/flash/net/ServerSocket.html">ServerSocket</a> class, and start listening and handling incoming connections.</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #808080; font-style: italic;">// create a server socket</span><br />
protected <span style="color: #000000; font-weight: bold;">var</span> socket:ServerSocket = <span style="color: #000000; font-weight: bold;">new</span> ServerSocket<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;<br />
<br />
protected <span style="color: #000000; font-weight: bold;">function</span> createServer<span style="color: #66cc66;">&#40;</span>event:FlexEvent<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span><br />
<span style="color: #66cc66;">&#123;</span><br />
&nbsp; &nbsp;<span style="color: #808080; font-style: italic;">// bind the socket to a given address and port</span><br />
&nbsp; &nbsp;socket.<span style="color: #006600;">bind</span><span style="color: #66cc66;">&#40;</span>SocketConfig.<span style="color: #006600;">port</span>,SocketConfig.<span style="color: #006600;">address</span><span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp;<span style="color: #808080; font-style: italic;">// the CONNECT event is dispatched after a client connects</span><br />
&nbsp; &nbsp;<span style="color: #808080; font-style: italic;">// to the socket, make sure we handle it</span><br />
&nbsp; &nbsp;socket.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>ServerSocketConnectEvent.<span style="color: #0066CC;">CONNECT</span>,<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;clientConnectedHandler<span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp;<span style="color: #808080; font-style: italic;">// start listening for connections</span><br />
&nbsp; &nbsp;socket.<span style="color: #006600;">listen</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;<br />
<span style="color: #66cc66;">&#125;</span></div></div>
<p><span id="more-316"></span><br />
As it&#8217;s supposed to push data to multiple clients, here&#8217;s the code to keep track of the connections,</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #66cc66;">&#91;</span>Bindable<span style="color: #66cc66;">&#93;</span> <span style="color: #808080; font-style: italic;">// for keeping track of the clients</span><br />
protected <span style="color: #000000; font-weight: bold;">var</span> clientSockets:ArrayCollection = <span style="color: #000000; font-weight: bold;">new</span> ArrayCollection<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;<br />
<br />
<span style="color: #808080; font-style: italic;">// adds the client to the list and adds the disconnect handler&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </span><br />
<span style="color: #000000; font-weight: bold;">function</span> clientConnectedHandler<span style="color: #66cc66;">&#40;</span>event:ServerSocketConnectEvent<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span><span style="color: #66cc66;">&#123;</span><br />
&nbsp; &nbsp;clientSockets.<span style="color: #006600;">addItem</span><span style="color: #66cc66;">&#40;</span>event.<span style="color: #006600;">socket</span><span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp;event.<span style="color: #006600;">socket</span>.<span style="color: #006600;">addEventListener</span><br />
&nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&#40;</span>Event.<span style="color: #0066CC;">CLOSE</span>,clientDisconnectedHandler<span style="color: #66cc66;">&#41;</span>;<br />
<span style="color: #66cc66;">&#125;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <br />
<span style="color: #000000; font-weight: bold;">function</span> clientDisconnectedHandler<span style="color: #66cc66;">&#40;</span>event:Event<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span><span style="color: #66cc66;">&#123;</span><br />
&nbsp; &nbsp;clientSockets.<span style="color: #006600;">removeItemAt</span><span style="color: #66cc66;">&#40;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;clientSockets.<span style="color: #006600;">getItemIndex</span><span style="color: #66cc66;">&#40;</span>event.<span style="color: #0066CC;">target</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp;event.<span style="color: #0066CC;">target</span>.<span style="color: #006600;">removeEventListener</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<span style="color: #66cc66;">&#40;</span>Event.<span style="color: #0066CC;">CLOSE</span>,clientDisconnectedHandler<span style="color: #66cc66;">&#41;</span>;<br />
<span style="color: #66cc66;">&#125;</span></div></div>
<h3>The client &#8211; setup</h3>
<p>Setting up a client is as easy, if not easier. You just need to create a <a href="http://help.adobe.com/en_US/air/reference/html/flash/net/Socket.html">Socket</a>, add event listeners to link some logic to it and connect to the server (using it&#8217;s address and port)</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #808080; font-style: italic;">// create our client socket</span><br />
protected <span style="color: #000000; font-weight: bold;">var</span> socket:Socket = <span style="color: #000000; font-weight: bold;">new</span> Socket<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;<br />
<br />
protected <span style="color: #000000; font-weight: bold;">function</span> createSocket<span style="color: #66cc66;">&#40;</span>event:Event<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span><br />
<span style="color: #66cc66;">&#123;</span> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <br />
&nbsp; &nbsp;<span style="color: #808080; font-style: italic;">// get notified when the socket connects</span><br />
&nbsp; &nbsp;socket.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>Event.<span style="color: #0066CC;">CONNECT</span>,socketConnected<span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp;<span style="color: #808080; font-style: italic;">// get notified when there's data</span><br />
&nbsp; &nbsp;socket.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>ProgressEvent.<span style="color: #006600;">SOCKET_DATA</span>,socketData<span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp;<span style="color: #808080; font-style: italic;">// connect</span><br />
&nbsp; &nbsp;socket.<span style="color: #0066CC;">connect</span><span style="color: #66cc66;">&#40;</span>SocketConfig.<span style="color: #006600;">address</span>,SocketConfig.<span style="color: #006600;">port</span><span style="color: #66cc66;">&#41;</span>;<br />
<span style="color: #66cc66;">&#125;</span></div></div>
<p>We can create functions with trace statements to check if the connection works and, as the only thing this server will be sending will be strings, output the data is being sent.</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap">protected <span style="color: #000000; font-weight: bold;">function</span> socketConnected<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:Event<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span><span style="color: #66cc66;">&#123;</span><br />
&nbsp; &nbsp;<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;client - socket connected&quot;</span><span style="color: #66cc66;">&#41;</span>;<br />
<span style="color: #66cc66;">&#125;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <br />
protected <span style="color: #000000; font-weight: bold;">function</span> socketData<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:ProgressEvent<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span><span style="color: #66cc66;">&#123;</span><br />
&nbsp; &nbsp;<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;client - socket data&quot;</span><span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp;<span style="color: #808080; font-style: italic;">// read the string from the socket</span><br />
&nbsp; &nbsp;<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span>socket.<span style="color: #006600;">readUTF</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#41;</span>;<br />
<span style="color: #66cc66;">&#125;</span></div></div>
<h3>The server &#8211; finishing</h3>
<p>The last thing we need to do is send the data to sockets, we&#8217;re going to use the <em><a href="http://help.adobe.com/en_US/air/reference/html/flash/net/Socket.html#writeUTF()">writeUTF</a></em> <a class="simple-footnote" title="writeUTF has a limit on string length &#8211; it needs to be shorter than 65536" id="return-note-316-2" href="#note-316-2"><sup>2</sup></a> of the socket. Notice that this function is called on each of the connected sockets (stored in the <em>clientSockets</em> collection) and not on our <em>ServerSocket</em> instance. It&#8217;s also important to flush the data to the socket once finished to make sure the data is sent.</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap">protected <span style="color: #000000; font-weight: bold;">function</span> writeDataToSockets<span style="color: #66cc66;">&#40;</span>event:Event<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span><br />
<span style="color: #66cc66;">&#123;</span><br />
&nbsp; &nbsp;<span style="color: #b1b100;">for</span> <span style="color: #b1b100;">each</span> <span style="color: #66cc66;">&#40;</span><span style="color: #000000; font-weight: bold;">var</span> sock:Socket <span style="color: #b1b100;">in</span> clientSockets<span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#123;</span><br />
&nbsp; &nbsp; &nbsp; sock.<span style="color: #006600;">writeUTF</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;test&quot;</span><span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp; &nbsp; sock.<span style="color: #0066CC;">flush</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp;<span style="color: #66cc66;">&#125;</span><br />
<span style="color: #66cc66;">&#125;</span></div></div>
<p>That&#8217;s it, now we have a fully working server which can push data to clients over TCP. </p>
<p><a href="http://www.robertbak.com/wordpress/wp-content/uploads/2011/10/AIRSocket.png"><img src="http://www.robertbak.com/wordpress/wp-content/uploads/2011/10/AIRSocket.png" alt="" title="AIRSocket screenshot" width="468" height="121" class="aligncenter size-full wp-image-375" /></a></p>
<p>Please remember that this is a very basic example with no code for error handling, etc. Just enough code to get it working. The very last thing to do is make sure we release the port once the server application closes.</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap">protected <span style="color: #000000; font-weight: bold;">function</span> applicationCloseHandler<span style="color: #66cc66;">&#40;</span>event:Event<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span><br />
<span style="color: #66cc66;">&#123;</span> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <br />
&nbsp; &nbsp; socket.<span style="color: #0066CC;">close</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;<br />
<span style="color: #66cc66;">&#125;</span></div></div>
<p>The source code has some additional code for the UI.<br />
<a href="http://robertbak.com/flexsamples/AIRSocket.fxp">Download source code.</a></p>
<div class="shr-publisher-316"></div><!-- Start Shareaholic LikeButtonSetBottom Automatic --><!-- End Shareaholic LikeButtonSetBottom Automatic --><div class="simple-footnotes"><p class="notes">Notes:</p><ol><li id="note-316-1">Remember to close the socket when closing the app, otherwise you might run into trouble when launching it again <a href="#return-note-316-1">&#8617;</a></li><li id="note-316-2">writeUTF has a limit on string length &#8211; it needs to be shorter than 65536 <a href="#return-note-316-2">&#8617;</a></li></ol></div>]]></content:encoded>
			<wfw:commentRss>http://www.robertbak.com/wordpress/2011/10/example-basic-socket-server-in-air/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Snippet- DataGrid labelField upgrade &#8211; complexFieldNameComponents</title>
		<link>http://www.robertbak.com/wordpress/2011/04/snippet-datagrid-labelfield-upgrade-complexfieldnamecomponents/</link>
		<comments>http://www.robertbak.com/wordpress/2011/04/snippet-datagrid-labelfield-upgrade-complexfieldnamecomponents/#comments</comments>
		<pubDate>Tue, 26 Apr 2011 23:48:54 +0000</pubDate>
		<dc:creator>Robert Bak</dc:creator>
				<category><![CDATA[Flex]]></category>
		<guid isPermaLink="false">http://www.robertbak.com/wordpress/?p=307</guid>
		<description><![CDATA[When displaying data in a DataGrid you can now reach into the inner structure of the data item while using the dataField property. Let&#8217;s say your data is: &#60;employee&#62; &#160; &#160; &#60;name&#62;Maurice Smith&#60;/name&#62; &#160; &#160; &#60;phone&#62;555-219-2012&#60;/phone&#62; &#160; &#160; &#60;email&#62;maurice@fictitious.com&#60;/email&#62; &#160; &#160; &#60;active&#62;false&#60;/active&#62; &#160; &#160; &#60;description&#62; &#160; &#160; &#160; &#160; &#60;short&#62;short description &#60;/short&#62; &#160; &#160; &#60;/description&#62; [...]]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop Automatic --><!-- End Shareaholic LikeButtonSetTop Automatic --><p>When displaying data in a DataGrid you can now reach into the inner structure of the data item while using the <em>dataField</em> property.</p>
<p>Let&#8217;s say your data is:</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #66cc66;">&lt;</span>employee<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>name<span style="color: #66cc66;">&gt;</span>Maurice Smith<span style="color: #66cc66;">&lt;/</span>name<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>phone<span style="color: #66cc66;">&gt;</span><span style="color: #cc66cc;">555</span>-<span style="color: #cc66cc;">219</span>-<span style="color: #cc66cc;">2012</span><span style="color: #66cc66;">&lt;/</span>phone<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>email<span style="color: #66cc66;">&gt;</span>maurice<span style="color: #66cc66;">@</span>fictitious.<span style="color: #006600;">com</span><span style="color: #66cc66;">&lt;/</span>email<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>active<span style="color: #66cc66;">&gt;</span>false<span style="color: #66cc66;">&lt;/</span>active<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>description<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>short<span style="color: #66cc66;">&gt;</span>short description <span style="color: #66cc66;">&lt;/</span>short<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;/</span>description<span style="color: #66cc66;">&gt;</span><br />
<span style="color: #66cc66;">&lt;/</span>employee<span style="color: #66cc66;">&gt;</span><br />
<span style="color: #66cc66;">&lt;</span>employee<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>name<span style="color: #66cc66;">&gt;</span>Mary Jones<span style="color: #66cc66;">&lt;/</span>name<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>phone<span style="color: #66cc66;">&gt;</span><span style="color: #cc66cc;">555</span>-<span style="color: #cc66cc;">219</span>-<span style="color: #cc66cc;">2000</span><span style="color: #66cc66;">&lt;/</span>phone<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>email<span style="color: #66cc66;">&gt;</span>mjones<span style="color: #66cc66;">@</span>fictitious.<span style="color: #006600;">com</span><span style="color: #66cc66;">&lt;/</span>email<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>active<span style="color: #66cc66;">&gt;</span>true<span style="color: #66cc66;">&lt;/</span>active<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>description<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>short<span style="color: #66cc66;">&gt;</span>short description <span style="color: #66cc66;">&lt;/</span>short<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;/</span>description<span style="color: #66cc66;">&gt;</span><br />
<span style="color: #66cc66;">&lt;/</span>employee<span style="color: #66cc66;">&gt;</span></div></div>
<p>If your data has nested fields, like the <em>short</em> one above you can use simple <em>dataField</em> to reach for them, like this:</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #66cc66;">&lt;</span>mx:DataGrid dataProvider=<span style="color: #ff0000;">&quot;{employees}&quot;</span><span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>mx:columns<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>mx:DataGridColumn dataField=<span style="color: #ff0000;">&quot;description.short&quot;</span> headerText=<span style="color: #ff0000;">&quot;Description&quot;</span><span style="color: #66cc66;">/&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;/</span>mx:columns<span style="color: #66cc66;">&gt;</span><br />
<span style="color: #66cc66;">&lt;/</span>mx:DataGrid<span style="color: #66cc66;">&gt;</span></div></div>
<p>I&#8217;m almost sure this wasn&#8217;t possible the last time I&#8217;ve tried this with some previous version of Flex SDK.</p>
<div class="shr-publisher-307"></div><!-- Start Shareaholic LikeButtonSetBottom Automatic --><!-- End Shareaholic LikeButtonSetBottom Automatic -->]]></content:encoded>
			<wfw:commentRss>http://www.robertbak.com/wordpress/2011/04/snippet-datagrid-labelfield-upgrade-complexfieldnamecomponents/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Flash Builder extension for Swiz &#8211; sneak peak</title>
		<link>http://www.robertbak.com/wordpress/2011/03/flex-builder-extension-for-swiz-sneak-peak/</link>
		<comments>http://www.robertbak.com/wordpress/2011/03/flex-builder-extension-for-swiz-sneak-peak/#comments</comments>
		<pubDate>Fri, 25 Mar 2011 00:13:25 +0000</pubDate>
		<dc:creator>Robert Bak</dc:creator>
				<category><![CDATA[Builder]]></category>
		<category><![CDATA[Flex]]></category>
		<category><![CDATA[Swiz]]></category>
		<category><![CDATA[flash builder]]></category>
		<category><![CDATA[plugin]]></category>
		<category><![CDATA[swiz]]></category>
		<category><![CDATA[swizframework]]></category>
		<guid isPermaLink="false">http://www.robertbak.com/wordpress/?p=296</guid>
		<description><![CDATA[I&#8217;ve spent some time lately learning how to extend Flash Builder, and finally have some results to show. I&#8217;ve build a few projects using the Swiz framework, which I love, but I&#8217;ve always felt that adding event handlers in the controllers was a rather tedious task, requiring a lot of checking of what&#8217;s in the [...]]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop Automatic --><!-- End Shareaholic LikeButtonSetTop Automatic --><p>I&#8217;ve spent some time lately learning how to extend Flash Builder, and finally have some results to show. </p>
<p>I&#8217;ve build a few projects using the Swiz framework, which I love, but I&#8217;ve always felt that adding event handlers in the controllers was a rather tedious task, requiring a lot of checking of what&#8217;s in the event and copy pasting. So I&#8217;ve started looking into ways that I could automatize the task, and ended up learning how to extend Eclipse and Flash Builder. The plugin is very raw and  still has a long way to go, but it&#8217;s doing something useful, so I&#8217;ll start using it and keep working on it. Below a quick video showing it at work.</p>
<iframe src='http://player.vimeo.com/video/21464122?title=0&amp;byline=0&amp;portrait=0' width='555' height='450' frameborder='0'></iframe>
<div class="shr-publisher-296"></div><!-- Start Shareaholic LikeButtonSetBottom Automatic --><!-- End Shareaholic LikeButtonSetBottom Automatic -->]]></content:encoded>
			<wfw:commentRss>http://www.robertbak.com/wordpress/2011/03/flex-builder-extension-for-swiz-sneak-peak/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Spell checking in Flex (with support for multiple languages)</title>
		<link>http://www.robertbak.com/wordpress/2010/11/spell-checking-in-flex-with-support-for-multiple-languages/</link>
		<comments>http://www.robertbak.com/wordpress/2010/11/spell-checking-in-flex-with-support-for-multiple-languages/#comments</comments>
		<pubDate>Fri, 19 Nov 2010 11:21:37 +0000</pubDate>
		<dc:creator>Robert Bak</dc:creator>
				<category><![CDATA[Flex]]></category>
		<category><![CDATA[Flex 4]]></category>
		<guid isPermaLink="false">http://www.robertbak.com/wordpress/?p=217</guid>
		<description><![CDATA[A while ago the way to go, if you needed spell checking in Flash or Flex was Grant Skinners Spelling Plus Library (which still has a lot to offer, especially for Web applications, as it&#8217;s much smaller than the Adobe library). But, for a while now, Adobe has been working on their own project, called [...]]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop Automatic --><!-- End Shareaholic LikeButtonSetTop Automatic --><p style="text-align: justify;">A while ago the way to go, if you needed spell checking in Flash or Flex was Grant Skinners <a href="http://gskinner.com/products/spl/about.php">Spelling Plus Library</a> (which still has a lot to offer, especially for Web applications, as it&#8217;s much smaller than the Adobe library). But, for a while now, Adobe has been working on their own project, called Squiggly, which I&#8217;m going to use. </p>
<h3>The Squiggly library</h3>
<p style="text-align: justify;">You can download the library files from <a href="http://labs.adobe.com/downloads/squiggly.html">Adobe Labs</a>. After uncompressing the .zip file you&#8217;ll find three files in the libs folder. The one you need for this tutorial is &#8220;<i>AdobeSpellingUIEx.swc</i>&#8221; &#8211; it&#8217;s the Flex 4 version for simple integration, so just put it in your <i>libs</i> folder. The &#8220;<i>AdobeSpellingUI.swc</i>&#8221; is what you would use if your target would be a Flex 3 application. You should use only one of them as putting both in your <i>libs</i> might cause troubles. The third file is used when working with more advanced options given by the library.</p>
<p><a href="http://www.robertbak.com/wordpress/wp-content/uploads/2010/11/plikiSqu.png"><img src="http://www.robertbak.com/wordpress/wp-content/uploads/2010/11/plikiSqu.png" alt="" title="plikiSqu" width="187" height="72" class="aligncenter size-full wp-image-239" /></a><br />
 <span id="more-217"></span></p>
<h3>Getting additional dictionaries</h3>
<p style="text-align: justify;">While it&#8217;s nice to be able to spell check English words it doesn&#8217;t solve the issue for everyone. Although Adobe seems to discourage using the library with most languages, I&#8217;ve had a really good experience while using it with Polish language. So let&#8217;s take a look on how to install, and use, additional dictionaries. </p>
<p style="text-align: justify;">First thing you need to do is get the new dictionary. There are many places that can provide you with dictionary files, I usually go to the dictionary listing on <a href="http://wiki.services.openoffice.org/wiki/Dictionaries">Open Office wiki</a> <a class="simple-footnote" title="Please remember that dictionaries have different licenses, so you want to check them carefully before using them in any commercial software." id="return-note-217-1" href="#note-217-1"><sup>1</sup></a>. There&#8217;s sometimes more than one set of files available for a given language, but what you&#8217;re looking for is usually just the spelling part, which consists of two files – one with a <em>.aff</em> extension and one with <em>.dic</em>. The rule is that the first part of the file names will be the language code, so for English spellchecker you might need &#8220;<em>en_US.aff</em>&#8221; and &#8220;<em>en_US.dic</em>&#8221; and for Polish it would be &#8220;<em>pl_PL.aff</em>&#8221; and &#8220;<em>pl_PL.dic</em>&#8220;. In my project I&#8217;m going to use both, so I&#8217;ll just put them in some directory. Here&#8217;s how it looks:</p>
<p><a href="http://www.robertbak.com/wordpress/wp-content/uploads/2010/11/spellcheckerDirStruct.png"><img src="http://www.robertbak.com/wordpress/wp-content/uploads/2010/11/spellcheckerDirStruct.png" alt="" title="spellcheckerDirStruct" width="165" height="160" class="aligncenter size-full wp-image-227" /></a></p>
<h3>Creating a dictionary configuration file</h3>
<p style="text-align: justify;">The structure of the configuration file is fairy simple, and more ore less, only points to the files downloaded above, it&#8217;s included in the project but just for reference, here&#8217;s how to define the support for two languages.</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #66cc66;">&lt;</span>?<span style="color: #0066CC;">xml</span> <span style="color: #0066CC;">version</span>=<span style="color: #ff0000;">&quot;1.0&quot;</span> encoding=<span style="color: #ff0000;">'UTF-8'</span>?<span style="color: #66cc66;">&gt;</span><br />
<span style="color: #66cc66;">&lt;</span>SpellingConfig<span style="color: #66cc66;">&gt;</span><br />
&nbsp; <span style="color: #66cc66;">&lt;</span>LanguageResource <span style="color: #0066CC;">language</span>=<span style="color: #ff0000;">&quot;English&quot;</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; languageCode=<span style="color: #ff0000;">&quot;en_US&quot;</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ruleFile=<span style="color: #ff0000;">&quot;assets/dict/en_US/en_US.aff&quot;</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; dictionaryFile=<span style="color: #ff0000;">&quot;assets/dict/en_US/en_US.dic&quot;</span><span style="color: #66cc66;">/&gt;</span><br />
&nbsp; <span style="color: #66cc66;">&lt;</span>LanguageResource <span style="color: #0066CC;">language</span>=<span style="color: #ff0000;">&quot;Polski&quot;</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; languageCode=<span style="color: #ff0000;">&quot;pl_PL&quot;</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ruleFile=<span style="color: #ff0000;">&quot;assets/dict/pl_PL/pl_PL.aff&quot;</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; dictionaryFile=<span style="color: #ff0000;">&quot;assets/dict/pl_PL/pl_PL.dic&quot;</span><span style="color: #66cc66;">/&gt;</span><br />
<span style="color: #66cc66;">&lt;/</span>SpellingConfig<span style="color: #66cc66;">&gt;</span></div></div>
<h3>Full project structure</h3>
<p style="text-align: justify;">Now we have all the files ready, and can start coding. Here&#8217;s how my project looks:</p>
<p><a  href="http://www.robertbak.com/wordpress/wp-content/uploads/2010/11/fullProject.png"><img src="http://www.robertbak.com/wordpress/wp-content/uploads/2010/11/fullProject.png" alt="" title="fullProject" width="213" height="305" class="aligncenter size-full wp-image-254" /></a></p>
<p style="text-align: justify;">As you can see the project is using the new Flex SDK version named &#8220;Hero&#8221;, but it was also tested with SDK 4.1. The project downloadable at the end of this article has been created in the new version of Flash Builder &#8220;Burrito&#8221;, which includes the new SDK, and which you can download from <a href="http://labs.adobe.com/technologies/flashbuilder_burrito/">Adobe Labs</a> </p>
<h3>The code</h3>
<p style="text-align: justify;">To get basic spellchecking to work you don&#8217;t need to do a whole lot. I&#8217;ll paste the whole code first, and than explain what happens.</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;height:300px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #66cc66;">&lt;</span>s:Application xmlns:fx=<span style="color: #ff0000;">&quot;http://ns.adobe.com/mxml/2009&quot;</span> &nbsp; <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;xmlns:s=<span style="color: #ff0000;">&quot;library://ns.adobe.com/flex/spark&quot;</span> &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;xmlns:mx=<span style="color: #ff0000;">&quot;library://ns.adobe.com/flex/mx&quot;</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;creationComplete=<span style="color: #ff0000;">&quot;creationCompleteHandler()&quot;</span><span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;!</span>-- VIEW --<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>s:TextArea id=<span style="color: #ff0000;">&quot;myTextArea&quot;</span> bottom=<span style="color: #ff0000;">&quot;50&quot;</span> &nbsp;top=<span style="color: #ff0000;">&quot;0&quot;</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #0066CC;">left</span>=<span style="color: #ff0000;">&quot;0&quot;</span> <span style="color: #0066CC;">right</span>=<span style="color: #ff0000;">&quot;0&quot;</span> <span style="color: #66cc66;">/&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>s:HGroup &nbsp;<span style="color: #0066CC;">height</span>=<span style="color: #ff0000;">&quot;50&quot;</span> bottom=<span style="color: #ff0000;">&quot;0&quot;</span><span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>s:<span style="color: #0066CC;">Button</span> label=<span style="color: #ff0000;">&quot;Switch to pl_PL&quot;</span> &nbsp;<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; click=<span style="color: #ff0000;">&quot;polishButton_clickHandler()&quot;</span> <span style="color: #66cc66;">/&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>s:<span style="color: #0066CC;">Button</span> label=<span style="color: #ff0000;">&quot;Switch to en_US&quot;</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; click=<span style="color: #ff0000;">&quot;englishButton_clickHandler()&quot;</span> <span style="color: #66cc66;">/&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;/</span>s:HGroup<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>fx:Script<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;!</span><span style="color: #66cc66;">&#91;</span>CDATA<span style="color: #66cc66;">&#91;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #0066CC;">import</span> com.<span style="color: #006600;">adobe</span>.<span style="color: #006600;">linguistics</span>.<span style="color: #006600;">spelling</span>.<span style="color: #006600;">SpellUI</span>;&nbsp; <br />
<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; protected <span style="color: #000000; font-weight: bold;">function</span> polishButton_clickHandler<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&#123;</span> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; SpellUI.<span style="color: #006600;">disableSpelling</span><span style="color: #66cc66;">&#40;</span>myTextArea<span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; SpellUI.<span style="color: #006600;">enableSpelling</span><span style="color: #66cc66;">&#40;</span>myTextArea,<span style="color: #ff0000;">&quot;pl_PL&quot;</span><span style="color: #66cc66;">&#41;</span>; <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&#125;</span><br />
<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; protected <span style="color: #000000; font-weight: bold;">function</span> englishButton_clickHandler<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&#123;</span> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; SpellUI.<span style="color: #006600;">disableSpelling</span><span style="color: #66cc66;">&#40;</span>myTextArea<span style="color: #66cc66;">&#41;</span>;<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; SpellUI.<span style="color: #006600;">enableSpelling</span><span style="color: #66cc66;">&#40;</span>myTextArea,<span style="color: #ff0000;">&quot;en_US&quot;</span><span style="color: #66cc66;">&#41;</span>; <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&#125;</span><br />
<br />
<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; protected <span style="color: #000000; font-weight: bold;">function</span> creationCompleteHandler<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&#123;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; SpellUI.<span style="color: #006600;">spellingConfigUrl</span> = <span style="color: #ff0000;">&quot;assets/dict/SpellingConfig.xml&quot;</span>; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&#125;</span><br />
<br />
&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&#93;</span><span style="color: #66cc66;">&#93;</span><span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;/</span>fx:Script<span style="color: #66cc66;">&gt;</span><br />
<span style="color: #66cc66;">&lt;/</span>s:Application<span style="color: #66cc66;">&gt;</span></div></div>
<p style="text-align: justify;"> The first thing you need to do is configure the spell checker by providing it with an XML configuration you have created. That&#8217;s what happens in the <i>creationCompleteHandler</i>. After that you just need to call the <i>enableSpelling</i> function with two parameters: first is the id of a component which should be spell checked, and the second one specifies the language which should be used. The <i>disableSpelling</i> function removes the spell checking, I&#8217;ve noticed you need to call it before setting a new language, otherwise it will not change. With just this few lines of code you get a fully functional spell checker. Here&#8217;s how it looks when switching languages:
<p>
<a href="http://www.robertbak.com/wordpress/wp-content/uploads/2010/11/kot.png"><img src="http://www.robertbak.com/wordpress/wp-content/uploads/2010/11/kot.png" alt="" title="kot" width="222" height="53" class="aligncenter size-full wp-image-269" /></a><br />
<a href="http://www.robertbak.com/wordpress/wp-content/uploads/2010/11/cat.png"><img src="http://www.robertbak.com/wordpress/wp-content/uploads/2010/11/cat.png" alt="" title="cat" width="223" height="54" class="aligncenter size-full wp-image-270" /></a></p>
<p style="text-align: justify;">If you look at code, you might also notice that the you don&#8217;t need to create a new object of class SpellUI, all the functions are static.</p>
<h3>Final notes</h3>
<p style="text-align: justify;">A modern spell checking library would not be complete without a way to suggest proper spelling, and this also works out of the box, you just need to right click on an underlined word to get them. </p>
<p><a href="http://www.robertbak.com/wordpress/wp-content/uploads/2010/11/righClickSuggestions.png"><img src="http://www.robertbak.com/wordpress/wp-content/uploads/2010/11/righClickSuggestions.png" alt="" title="righClickSuggestions" width="156" height="176" class="aligncenter size-full wp-image-273" /></a></p>
<p style="text-align: justify;">But there are some things to keep in mind when starting to use this library. First, it&#8217;s still in development an a lot can change, including the way you use the library. Second, there are some issues with efficiency, the dictionaries are quite big (the Polish one is 4MB, the en_US around 600kB) and even after downloading them the parsing process freezes the application for a noticeable time. But still, a long needed addition to the Flex ecosystem is here, and it&#8217;s really easy to use.</p >
<p><a href="http://robertbak.com/flexsamples/FlexSquiggly.zip"><br />
Download source code.</a></p>
<div class="shr-publisher-217"></div><!-- Start Shareaholic LikeButtonSetBottom Automatic --><!-- End Shareaholic LikeButtonSetBottom Automatic --><div class="simple-footnotes"><p class="notes">Notes:</p><ol><li id="note-217-1">Please remember that dictionaries have different licenses, so you want to check them carefully before using them in any commercial software. <a href="#return-note-217-1">&#8617;</a></li></ol></div>]]></content:encoded>
			<wfw:commentRss>http://www.robertbak.com/wordpress/2010/11/spell-checking-in-flex-with-support-for-multiple-languages/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>How not to use &#8220;services_config.xml&#8221;</title>
		<link>http://www.robertbak.com/wordpress/2010/02/how-not-to-use-services_config-xml/</link>
		<comments>http://www.robertbak.com/wordpress/2010/02/how-not-to-use-services_config-xml/#comments</comments>
		<pubDate>Wed, 24 Feb 2010 07:43:12 +0000</pubDate>
		<dc:creator>Robert Bak</dc:creator>
				<category><![CDATA[Flex]]></category>
		<category><![CDATA[RemoteObject]]></category>
		<category><![CDATA[services]]></category>
		<category><![CDATA[services_config]]></category>
		<guid isPermaLink="false">http://www.robertbak.com/wordpress/?p=102</guid>
		<description><![CDATA[The most common way to use RemoteServices in flex is by creating a separate file to keep the configuration, and adding the &#8220;-services&#8221; switch to the compiler arguments. It&#8217;s a good way to do it, but not always, and is especially painful when explaining remoting to someone. But you can skip the whole file and [...]]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop Automatic --><!-- End Shareaholic LikeButtonSetTop Automatic --><p>The most common way to use RemoteServices in flex is by creating a separate file to keep the configuration, and adding  the  &#8220;-services&#8221; switch to the compiler arguments. It&#8217;s a good way to do it, but not always, and is especially painful when explaining remoting to someone. But you can skip the whole file and configure the same thing using MXML tags. I&#8217;ll take a sample &#8220;services_config&#8221; file (this one is for zend_amf) and translate it to MXML.</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;height:300px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #66cc66;">&lt;</span>?<span style="color: #0066CC;">xml</span> <span style="color: #0066CC;">version</span>=<span style="color: #ff0000;">&quot;1.0&quot;</span> encoding=<span style="color: #ff0000;">&quot;UTF-8&quot;</span>?<span style="color: #66cc66;">&gt;</span><br />
<span style="color: #66cc66;">&lt;</span>services-config<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>services<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>service id=<span style="color: #ff0000;">&quot;amfphp-flashremoting-service&quot;</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">class</span>=<span style="color: #ff0000;">&quot;flex.messaging.services.RemotingService&quot;</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp; messageTypes=<span style="color: #ff0000;">&quot;flex.messaging.messages.RemotingMessage&quot;</span><span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>destination id=<span style="color: #ff0000;">&quot;zend&quot;</span><span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>channels<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>channel ref=<span style="color: #ff0000;">&quot;library&quot;</span><span style="color: #66cc66;">/&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;/</span>channels<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>properties<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>source<span style="color: #66cc66;">&gt;*&lt;/</span>source<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;/</span>properties<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;/</span>destination<span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;/</span>service<span style="color: #66cc66;">&gt;</span> &nbsp; &nbsp; &nbsp; <br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;/</span>services<span style="color: #66cc66;">&gt;</span> &nbsp; <br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>channels<span style="color: #66cc66;">&gt;</span> &nbsp;<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<span style="color: #66cc66;">&lt;</span>channel-definition id=<span style="color: #ff0000;">&quot;library&quot;</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">class</span>=<span style="color: #ff0000;">&quot;mx.messaging.channels.AMFChannel&quot;</span> <span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<span style="color: #66cc66;">&lt;</span>endpoint uri=<span style="color: #ff0000;">&quot;http://localhost/librarySample/amf.php&quot;</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #000000; font-weight: bold;">class</span>=<span style="color: #ff0000;">&quot;flex.messaging.endpoints.AMFEndpoint&quot;</span> <span style="color: #66cc66;">/&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;/</span>channel-definition<span style="color: #66cc66;">&gt;</span> &nbsp; &nbsp; &nbsp; &nbsp;<br />
&nbsp; &nbsp; <span style="color: #66cc66;">&lt;/</span>channels<span style="color: #66cc66;">&gt;</span> <br />
<span style="color: #66cc66;">&lt;/</span>services-config<span style="color: #66cc66;">&gt;</span></div></div>
<p>translates to:</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #66cc66;">&lt;</span>mx:ChannelSet id=<span style="color: #ff0000;">&quot;chanelSet&quot;</span> <span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>mx:AMFChannel <br />
&nbsp; &nbsp; &nbsp; uri=<span style="color: #ff0000;">&quot;http://localhost/librarySample/sampleamf.php&quot;</span> <span style="color: #66cc66;">/&gt;</span><br />
<span style="color: #66cc66;">&lt;/</span>mx:ChannelSet<span style="color: #66cc66;">&gt;</span><br />
<br />
<span style="color: #66cc66;">&lt;</span>mx:RemoteObject &nbsp; <br />
&nbsp; &nbsp; &nbsp; channelSet=<span style="color: #ff0000;">&quot;{chanelSet}&quot;</span> <span style="color: #66cc66;">&gt;</span>&nbsp; &nbsp; &nbsp; &nbsp; <br />
&nbsp;<span style="color: #66cc66;">&lt;/</span>mx:RemoteObject<span style="color: #66cc66;">&gt;</span></div></div>
<p>So what you need to do is create a ChannelSet, put a channel inside (in this case AMFChannel) and set its uri to the one you would usually put as endpoint uri in the config file.<br />
Once you do that you can start using your RemoteObjects without the services_config. </p>
<p>Of course you should add the rest of the things you usually put inside a remote object. For people who would like an example:</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #66cc66;">&lt;</span>mx:RemoteObject &nbsp; <br />
&nbsp; &nbsp; &nbsp; &nbsp; channelSet=<span style="color: #ff0000;">&quot;{chanelSet}&quot;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; source=<span style="color: #ff0000;">&quot;myServerSideClassName&quot;</span> &nbsp;<br />
&nbsp; &nbsp; &nbsp; &nbsp; destination=<span style="color: #ff0000;">&quot;zend&quot;</span> <span style="color: #66cc66;">&gt;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #66cc66;">&lt;</span>mx:method <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #0066CC;">name</span>=<span style="color: #ff0000;">&quot;serverSideFunctionName&quot;</span> <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; result=<span style="color: #ff0000;">&quot;someResultFunction()&quot;</span> <span style="color: #66cc66;">/&gt;</span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <br />
<span style="color: #66cc66;">&lt;/</span>mx:RemoteObject<span style="color: #66cc66;">&gt;</span></div></div>
<div class="shr-publisher-102"></div><!-- Start Shareaholic LikeButtonSetBottom Automatic --><!-- End Shareaholic LikeButtonSetBottom Automatic -->]]></content:encoded>
			<wfw:commentRss>http://www.robertbak.com/wordpress/2010/02/how-not-to-use-services_config-xml/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Geolocation Library</title>
		<link>http://www.robertbak.com/wordpress/2009/08/geolocation-library/</link>
		<comments>http://www.robertbak.com/wordpress/2009/08/geolocation-library/#comments</comments>
		<pubDate>Mon, 17 Aug 2009 12:16:25 +0000</pubDate>
		<dc:creator>Robert Bak</dc:creator>
				<category><![CDATA[Flex]]></category>
		<category><![CDATA[asgeolocation]]></category>
		<category><![CDATA[gears]]></category>
		<category><![CDATA[geolocation]]></category>
		<guid isPermaLink="false">http://www.robertbak.com/wordpress/?p=3</guid>
		<description><![CDATA[Yesterday I&#8217;ve started to experiment with geolocation features built into Firefox 3.5 (check here) and Chrome with Gears installed. What was ment as a Flex Cookbook post grew into a handy library. It supports both Firefox and Chrome (including the loading of the address), includes functions to check the users geolocation, track him, etc. For [...]]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop Automatic --><!-- End Shareaholic LikeButtonSetTop Automatic --><p>Yesterday I&#8217;ve started to experiment with geolocation features built into Firefox 3.5 (check <a href="http://www.mozilla.com/firefox/geolocation/">here</a>) and Chrome with Gears installed. What was ment as a Flex Cookbook post grew into a handy library. It supports both Firefox and Chrome (including the loading of the address), includes functions to check the users geolocation, track him, etc.</p>
<p>For the geolocation to work you need to have some javascript code in your page, the library injects the code into the DOM so that you don&#8217;t need to do it manually, for those of you who are interested how to do it here&#8217;s a <a href="http://www.adobe.com/cfusion/communityengine/index.cfm?event=showDetails&amp;postId=7183&amp;productId=2" >cookbook post</a>.</p>
<p>The project is hosted on Google Code  <a href="http://code.google.com/p/asgeolocation/">here</a>, where you can also find a detailed documentation. Below you can find a sample application.</p>
<p>A simplest example I could think off:</p>
<div class="codecolorer-container mxml geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="mxml codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #000000;">&lt;?xml version=<span style="color: #ff0000;">&quot;1.0&quot;</span> encoding=<span style="color: #ff0000;">&quot;utf-8&quot;</span>?<span style="color: #7400FF;">&gt;</span></span><br />
<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Application</span> xmlns:mx=<span style="color: #ff0000;">&quot;http://www.adobe.com/2006/mxml&quot;</span></span><br />
<span style="color: #000000;"> &nbsp; &nbsp; &nbsp;xmlns:geolocation=<span style="color: #ff0000;">&quot;com.robertbak.geolocation.*&quot;</span></span><br />
<span style="color: #000000;"> &nbsp; &nbsp; &nbsp;creationComplete=<span style="color: #ff0000;">&quot;geo.send()&quot;</span><span style="color: #7400FF;">&gt;</span></span><br />
&nbsp; &nbsp; &nbsp; <span style="color: #000000;"><span style="color: #7400FF;">&lt;geolocation:GeoLocator</span> id=<span style="color: #ff0000;">&quot;geo&quot;</span></span><br />
<span style="color: #000000;"> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;applicationID=<span style="color: #ff0000;">&quot;YOUR_APPLICATION_ID_HERE&quot;</span><span style="color: #7400FF;">/&gt;</span></span><br />
&nbsp; &nbsp; &nbsp; <span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Label</span> text=<span style="color: #ff0000;">&quot;Lat: {geo.lastResult.coords.latitude}&quot;</span><span style="color: #7400FF;">/&gt;</span></span><br />
<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:Application</span><span style="color: #7400FF;">&gt;</span></span></div></div>
<p>As you can see the whole configuration consists of adding the library and setting the applicationID, it&#8217;s usually the same as your main class name (eg. if you create an application as App.mxml, the applicationID should be set to &#8220;App&#8221;). This is needed so that javascript in the DOM of the page can call your application with the results.</p>
<p>The lastResult implements the IPosition interface:</p>
<div class="codecolorer-container actionscript geshi" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><div class="actionscript codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap">IPosition<br />
&nbsp; &nbsp; <span style="color: #66cc66;">*</span> coords <span style="color: #66cc66;">&#40;</span>ICoordinates<span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o latitude <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">Number</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o longitude <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">Number</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o altitude <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">Number</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o accuracy <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">Number</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o altitudeAccuracy <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">Number</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o heading <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">Number</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o speed <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">Number</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">*</span> address <span style="color: #66cc66;">&#40;</span>IAddress<span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o streetNumber <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">String</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o street <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">String</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o premises <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">String</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o city <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">String</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o county <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">String</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o region <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">String</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o country <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">String</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; o countryCode <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">String</span><span style="color: #66cc66;">&#41;</span><br />
&nbsp; &nbsp; <span style="color: #66cc66;">*</span> timestamp <span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">Date</span><span style="color: #66cc66;">&#41;</span></div></div>
<p style="text-align: center;"><a href="http://robertbak.com/geolocation/Geolocation.html" ><img class="size-full wp-image-7 aligncenter" title="asgeolocator" src="http://www.robertbak.com/wordpress/wp-content/uploads/2010/02/Untitled-2.png" alt="asgeolocator" /></a></p>
<p style="text-align: center;">Sample (view source enabled): <a href="http://robertbak.com/geolocation/Geolocation.html" >link</a></p>
<div class="shr-publisher-3"></div><!-- Start Shareaholic LikeButtonSetBottom Automatic --><!-- End Shareaholic LikeButtonSetBottom Automatic -->]]></content:encoded>
			<wfw:commentRss>http://www.robertbak.com/wordpress/2009/08/geolocation-library/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>

