Re: [FlexJS] question about porting an Adobe Flex 3 project to HTML+JS

[Justin Mclean]

Hi,

I’ve not tested this and it’s likely to have issues (I’m not 100% sure the 
binding will work) and you need to modify it so it's not an application.

I think this may help you get towards a working version - their may be other 
ways of doing this as well.

<?xml version="1.0" encoding="utf-8"?>
<js:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
               xmlns:js="library://ns.apache.org/flexjs/basic">
   <fx:Script>
        <![CDATA[

        [Bindable]
        public var target:ISearchable;

        ]]>
     </fx:Script>

  <js:valuesImpl>
     <js:SimpleCSSValuesImpl/>
  </js:valuesImpl>

  <js:beads>
     <js:BindableCSSStyles />
     <js:SimpleBinding />
  </js:beads>

   <js:initialView>
       <js:View>
          <js:HContainer>
             <js:Label text="Search:" />
             <js:TextInput id="searchInput" 
change="{target.find(searchInput.text)}" width="207">
                   <js:beads>
                       <js:ToolTip text="Live search" />
                       <js:SimpleCSSStyles 
backgroundColor="{!target.searchString || target.found ? 0xffffff:0xff0000}" />
                   </js:beads>
               </js:TextInput>
             <js:TextButton id="previousButton"  text="&lt;" 
click="{target.findPrevious()}">
              <js:beads>
                 <js:ToolTip text="Previous" />
                 <js:DisableBead disabled=“{!target.searchString}" />
              </js:beads>
           </js:TextButton>
             <js:TextButton id="nextButton" text="&gt;" 
click="{target.findNext()}">
              <js:beads>
                 <js:ToolTip text="Next" />
                 <js:DisableBead disabled=“{!target.searchString}" />
              </js:beads>
           </js:TextButton>
          </js:HContainer>
       </js:View>
   </js:initialView>

</js:Application>

Thanks,
Justin