Flex Development

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
	backgroundColor="#FFFFFF" width="100%" height="100%" creationComplete="init()"
	xmlns:ns1="*" viewSourceURL="srcview/index.html">
 
	<mx:Script>
		<![CDATA[
			import mx.controls.Image;
			import flash.events.KeyboardEvent;
			import mx.core.mx_internal;
			use namespace mx_internal;
			public var smiles:XML;
 
			public function init():void
			{
				//we want the textArea control to grow in height with its content
				textArea.height = textArea.textHeight + 10;
 
				textInput.addEventListener(KeyboardEvent.KEY_DOWN, keyDown);
				textInput.textArea.setFocus();
 
				//we'll define smileys here, though these can be read in from xml file
				smiles = <smiles>
					<smile file="angry.gif" code=":{" width="20" height="20" />
					<smile file="smile.gif" code=":)" width="20" height="20" />
					<smile file="smile.gif" code=":-)" width="20" height="20" />
					<smile file="biggrin.gif" code=":D" width="20" height="20" />
					<smile file="ohmy.gif" code=":O" width="20" height="20" />
					<smile file="sad.gif" code=":(" width="20" height="20" />
					<smile file="sad.gif" code=":-(" width="20" height="20" />
					<smile file="tongue.gif" code=":p" width="20" height="20" />
					<smile file="wink.gif" code=";)" width="20" height="20" />
				</smiles>;
 
				//set some initial text
				textInput.textArea.htmlText="Smileys example.&#xa;Available smileys: :{,:),:D,:O,:(,;),:p.";
 
				//run the smileyHandler routine right at the start
				smileyHandler();
			}
 
			private function keyDown(event:KeyboardEvent):void
			{
				// Check to see if ENTER pressed.
				if (event.keyCode == Keyboard.ENTER)
				{
					smileyHandler();
				}
			}
 
			public function smileyHandler():void
			{
				var smileyIndex:int = -1;
				var searchIndex:int = -1;
				var testSearchIndex:int = -1;
				var testString:String;
				var searchString:String = textInput.htmlText;
 
				//recurse through all smileys to see if they occur in searchString
				for (var x:int = 0; x < smiles.child("*").length(); x++)
				{
					//setup testString by escaping various punctuation marks before search
					testString = smiles.smile[x].attribute("code").toString().replace(/(\)|\()/, "\\$&");
					searchIndex = searchString.search(testString);
					if (searchIndex >= 0)
					{
						//occurrence of this smiley found. test for previous occurence
						//and see if it's earlier in the text than this occurence
						if (testSearchIndex < 0)
						{
							//no previous smiley found, this is the first
							testSearchIndex = searchIndex;
							smileyIndex = x;
						}
						else
						{
							//previous smiley found. test if this occurrence is earlier
							//in text than previous occurence
							if (testSearchIndex > searchIndex)
							{
								testSearchIndex = searchIndex;
								smileyIndex = x;
							}
						}
					}
				}
				searchIndex = testSearchIndex;
				var newText:String = "";
				var oldText:String = textArea.htmlText;
				//if no smiley found, add textInput to textArea
				if (searchIndex < 0)
				{
					newText = textInput.htmlText;
				}
 
				//recurse until no smileys found in searchString
				while (searchIndex >= 0)
				{
					//set replacement string as text smiley with background color so that it's semi-invisible
					var smileyReplaceString:String = '<FONT COLOR="#'
						smileyReplaceString += chatCanvas.getStyle("backgroundColor").toString(16);
						smileyReplaceString += '"> ';
						smileyReplaceString += smiles.smile[smileyIndex].attribute("code");
						smileyReplaceString += '  </FONT>';
 
					//slice searchString at index where smiley occurs and put that in textArea for operation
					//notice: +1 is added to searchIndex here to compensate for smiley at index 0
					textArea.htmlText = oldText + newText + searchString.slice(0, searchIndex + 1);
 
					textArea.validateNow();
 
					//get necessary coordinates and display smiley
					var numLines:int = textArea.mx_internal::getTextField().numLines;
					var smiley:Image = new Image();
					smiley.source = "assets/" + smiles.smile[smileyIndex].attribute("file");
					smiley.x = textArea.getLineMetrics(numLines - 1).width;
					smiley.y = textArea.textHeight - textArea.getLineMetrics(numLines - 1).height;
					chatCanvas.addChild(smiley);
 
					newText += searchString.slice(0, searchIndex) + smileyReplaceString;
					var codeLength:int = smiles.smile[smileyIndex].attribute("code").toString().length;
					searchString = searchString.slice(searchIndex + codeLength);
 
					//begin with smiley search again
					searchIndex = -1;
					testSearchIndex = -1;
					smileyIndex = -1;
					for (x = 0; x < smiles.child("*").length(); x++)
					{
						//setup testString by escaping various punctuation marks before search
						testString = smiles.smile[x].attribute("code").toString().replace(/(\)|\()/, "\\$&");
						searchIndex = searchString.search(testString);
						if (searchIndex >= 0)
						{
							//occurrence of this smiley found. test for previous occurence
							//and see if it's earlier in the text than this occurence
							if (testSearchIndex < 0)
							{
								//no previous smiley found, this is the first
								testSearchIndex = searchIndex;
								smileyIndex = x;
							}
							else
							{
								//previous smiley found. test if this occurrence is earlier
								//in text than previous occurence
								if (testSearchIndex > searchIndex)
								{
									testSearchIndex = searchIndex;
									smileyIndex = x;
								}
							}
						}
					}
					searchIndex = testSearchIndex;
					if (searchIndex < 0)
					{
						newText += searchString;
					}
				}
				textArea.htmlText = oldText + newText;
				textArea.validateNow();
 
				//set height of textArea to height of new text content
				textArea.height = textArea.textHeight + 10;
 
				//clear textInput
				textInput.htmlText = "";
 
				//scroll to bottom of canvas
				chatCanvas.validateNow();
				chatCanvas.verticalScrollPosition = chatCanvas.maxVerticalScrollPosition;
			}
 
		]]>
	</mx:Script>
 
	<mx:VBox x="0" y="0" width="100%" height="100%">
		<mx:Canvas id="chatCanvas" width="100%" height="90%" horizontalScrollPolicy="off"
			backgroundColor="#FFFFFF" borderStyle="solid">
			<mx:TextArea width="100%" id="textArea" editable="false"
				fontSize="12" verticalScrollPolicy="off" borderStyle="none">
			</mx:TextArea>
		</mx:Canvas>
		<ns1:CoolRichTextEditor width="100%" height="147" id="textInput" cornerRadius="5" headerHeight="0"
			roundedBottomCorners="true" verticalScrollPolicy="off" fontSize="12"
			 controlBarPosition="top"/>
	</mx:VBox>
 
</mx:Application>