<?xml version="1.0" encoding="utf-8"?>
  <!--
  
//////////////////////////////////////////////////////////////////////////


  //
  // Copyright (C) 2003-2006 Adobe Macromedia Software LLC and its licensors.
  // All Rights Reserved.
  // The following is Sample Code and is subject to all restrictions on such code
  // as contained in the End User License Agreement accompanying this product.
  // If you have received this file from a source other than Adobe,
  // then your use, modification, or distribution of it requires
  // the prior written permission of Adobe.
  //
  
//////////////////////////////////////////////////////////////////////////


  -->
  <mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" 
      verticalAlign="middle" 
      paddingTop="0" 
      paddingBottom="0"
      horizontalScrollPolicy="off"
          currentState="showFilter">
      <mx:Script>
          <![CDATA[
              [Bindable]
              public var cartCount:int;
              
              private function rollOverLabel(event:Event):void
              {
                  Label(event.target).setStyle("styleName", "catalogTitleButtonHighlighted");
              }
              
              private function rollOutLabel(event:Event):void
              {
                  Label(event.target).setStyle("styleName", "catalogTitleButtonDeselected");
              }
          ]]>
      </mx:Script>
      
      <mx:Spacer width="100%" />
      <mx:Label id="findPhones" text="Find Phones" click="currentState = 'showFilter'"/>
      <mx:VRule height="{findPhones.height * .75}" themeColor="#333333" alpha=".75"/>
      <mx:Label id="viewCart" text="View Cart ({cartCount} items)" click="currentState = 'showCart'"/>
      
      <mx:states>
          <mx:State name="showFilter">
              <mx:SetStyle target="{findPhones}" name="styleName" value="catalogTitleButtonSelected" />
              <mx:SetStyle target="{viewCart}" name="styleName" value="catalogTitleButtonDeselected" />
              <mx:SetEventHandler target="{viewCart}" name="rollOver" handlerFunction="rollOverLabel" />
              <mx:SetEventHandler target="{viewCart}" name="rollOut" handlerFunction="rollOutLabel" />
          </mx:State>
          <mx:State name="showCart">
              <mx:SetStyle target="{viewCart}" name="styleName" value="catalogTitleButtonSelected" />            
              <mx:SetStyle target="{findPhones}" name="styleName" value="catalogTitleButtonDeselected" />
              <mx:SetEventHandler target="{findPhones}" name="rollOver" handlerFunction="rollOverLabel" />
              <mx:SetEventHandler target="{findPhones}" name="rollOut" handlerFunction="rollOutLabel" />
          </mx:State>
      </mx:states>
  </mx:HBox>