<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
    xmlns="*"
    xmlns:mx="http://www.adobe.com/2006/mxml" 
    layout="absolute" 
    pageTitle="Flex Search"
    creationComplete="searchCreationComplete()" viewSourceURL="flexsearch/index.html">
    
    <mx:Style>

        global {
            theme-color: #DF2A1D;
        }
        Application { 
           background-image: Embed(source="assets/FlexAdobeLogo.jpg");
        }
        Panel {
            alpha: 0.3;
            background-alpha: 0.3;
            border-thickness-left:0;
            border-thickness-right:0;
            border-thickness-top:0;
            border-thickness-bottom:0;
            padding-bottom:10;
            padding-top:10;
            padding-left:10;
            padding-right:10;                                    
        }
        List {
            background-alpha: 0.3;
            border-thickness: 2;
        }
        .title {
            color:#333333;
            font-size:18;
            font-weight:bold;    
        }    
        .searchBox {
            font-size:14;
            font-weight:bold;
            font-thickness: 0;
            border-style: inset;
            background-color: #FFFFFF;
            background-alpha: 0.7;
        }
        .bSearch, .smallButton {
            fill-colors: #EEEEEE,#CCCCCC;
            color: #333333;
            font-weight:bold;
            font-size: 14;
            highlight-alphas: 1,0.2;
            text-roll-over-color: #DF2A1D;
        }
        .smallButton {
            font-size:10;
        }
    </mx:Style>
    
    <mx:Script>
        <![CDATA[
            import mx.rpc.events.ResultEvent;
            import flash.net.URLRequest;
            import flash.net.navigateToURL;
            import flash.net.SharedObject;
            
            public var so:SharedObject;
            
            // Had issues with previewBox's visible value
            [Bindable]
            public var isOpen:Boolean = false;
            [Bindable]
            private var interval:int = 200;
            
            public function searchCreationComplete():void
            {
                so = SharedObject.getLocal("search");
                if( so.data.searchText ){
                    searchText.text = so.data.searchText;
                }
                ds.getData( searchText.text );
            }
            
            public function callSearch():void
            {
                if( searchText.text.length < 5 ) {
                    return;
                }
                so = SharedObject.getLocal("search");
                so.data.searchText = new String( searchText.text );
                so.flush();

                ds.getData( searchText.text ); 
            }    
            
            public function goURL():void
            {
                //var gourl:String = 'http://www.flex.org/go/' + String( lstSearchItems.selectedItem.ID ); 
                //navigateToURL( new URLRequest( gourl ) , '_blank' );
                previewBox.source = 'http://www.flex.org/go/' + String( lstSearchItems.selectedItem.ID );
                previewBox.visible = true;
                isOpen = true;
            }
            
            public function closePreview():void
            {
                previewBox.visible = false;
                previewBox.source = '';                
                isOpen = false;
            }

        ]]>
    </mx:Script>

    <mx:RemoteObject 
        id="ds" 
        destination="ColdFusion" 
        endpoint="http://www.flex.org/flex2gateway/"
        showBusyCursor="true"
        source="api.search">

        <mx:method name="getData" />

    </mx:RemoteObject>

    <mx:Text 
        text="Flex Search (Alpha 1)" 
        styleName="title"
        x="8" y="8" />

    <mx:ApplicationControlBar 
        left="8" top="40" right="8"
        height="42" />
        
    <mx:TextInput 
        id="searchText" 
        text="+Cairngorm -flexcoders" 
        enter="callSearch()" 
        left="15" top="48" right="98" 
        styleName="searchBox"/>
    
    <mx:Button 
        id="btnSearch"
        label="Search" 
        click="callSearch()" 
        right="15" top="48" 
        height="28"
        width="75" 
        styleName="bSearch"/>

    <mx:Text 
        text="Enter Search Below: +Cairngorm -flexcoders  --> Must contain 'Cairngorm', remove 'flexcoders'" 
        x="15" y="86" color="#ffffff"/>

    <mx:Text 
        text="Created by Ted Patrick (http://onflex.org) - modified by Renaun Erickson (http:renaun.com)" 
        x="8" bottom="0" color="#999999"/>
            
    <mx:Panel
        id="pnlResults"
        title="{ 'Search Results (' + ds.getData.lastResult.length + ')' }"
        left="8" top="110" right="8" bottom="24"
        layout="absolute"
        >
        
        <mx:List
            id="lstSearchItems"
            width="100%"
            height="100%"
            dataProvider="{ ds.getData.lastResult }">
            <mx:itemRenderer>
                <mx:Component>
                    <mx:Canvas>
                        <mx:Image 
                            y="1"
                            source="@Embed('assets/arrowGreenUp.png')"
                            click="mx.core.Application.application.goURL()"/>
                        <mx:Text 
                            x="18"
                            text="{ data.NAME }" />                           
                    </mx:Canvas>
                </mx:Component>
            </mx:itemRenderer>
        </mx:List>
        
        <IFrame 
            id="previewBox"
            height="100%"
            width="100%"
            x="{ interval }" />
                    
    </mx:Panel>

    <mx:Button
        id="btnClose"
        label="X"
        width="20"
        x="{ previewBox.globalX + 46 }"
        y="{ previewBox.globalY - 22 }"
        visible="{ isOpen }"
        click="closePreview()"
        styleName="smallButton" />
    <mx:Button
        id="btnLeft"
        label="&lt;"
        width="20"
        x="{ previewBox.globalX }"
        y="{ previewBox.globalY - 22 }"
        visible="{ isOpen }"
        click="previewBox.x = ( previewBox.x - interval &gt; 0 ) ? (previewBox.x-interval):0;"
        styleName="smallButton" />
    <mx:Button
        id="btnRight"
        label="&gt;"
        width="20"
        x="{ previewBox.globalX + 23 }"
        y="{ previewBox.globalY - 22 }"
        visible="{ isOpen }"
        click="previewBox.x = ( previewBox.x + interval &lt; pnlResults.width-interval ) ? (previewBox.x+interval):(pnlResults.width-interval);"
        styleName="smallButton" />        

    <mx:StringValidator
        id="vldSearchText"
        minLength="6"
        tooShortError="The search term must be at least 5 characters long."
        source="{ searchText }"
        property="text"
        trigger="{ searchText }"
        triggerEvent="change"
        valid="btnSearch.enabled = true;"
        invalid="btnSearch.enabled = false;"
        />

</mx:Application>