Integrating SignUp/Login

[RiccardoNL]

Hey all,

Is there a way to integrate the Sign Up / Login component with the Video Conference example? I've been messing around a little, but all I get is 44 errors.
As soon as I use the login.xml from the SignUp/Login Component, instead of SmartFoxBits' LoginPanel, I get 44 errors with: "Use of non-defined property". For example: "Use of non-defined property bt_JoinConf." I can't define them, cause SmartFoxBits is apparently closed piece of code?

How can I integrate the signup/login component with Video Conference? I want it to show the video conference, when clicking on "Login."

Riccardo

[RiccardoNL]

Alright this is the code so far:

Code: Select all

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
   xmlns:mx="http://www.adobe.com/2006/mxml"
   xmlns:sfb="http://www.smartfoxserver.com/bits"
   xmlns:components="components.*"
   creationPolicy="all"
   layout="absolute"
   frameRate="31"
   creationComplete="init()">
   
   <mx:Style source="style/style.css"/>
   <mx:Script source="SignUp.as"/>
   <mx:Script source="VideoConference.as" />

   <mx:VBox width="100%" height="100%" verticalGap="0">
      
      <!-- Application views container -->
      <mx:ViewStack id="mainView" width="100%" height="100%" styleName="mainView" creationPolicy="all">
         
         <!-- Main Screen -->
         <mx:VBox id="view_main" width="100%" height="100%" verticalAlign="middle" horizontalAlign="center">
            <mx:Panel title=":: Login" height="400" width="700" styleName="largeText">
               <mx:Canvas width="100%" height="100%">
      
                  <mx:Button id="bt_login" x="22" y="268" width="111" label="Login"/>
                  <mx:Button id="bt_signup" x="398" y="109" width="225"
                           label="Create New Account"/>
                  <mx:Label x="22" y="48" width="239" styleName="largeText" text="Login to your Account"
                          textAlign="left"/>
                  <mx:Label x="398" y="48" width="239" styleName="largeText" text="New User?"
                          textAlign="left"/>
                  <mx:Label x="22" y="88" width="239" text="Your email address:"
                          textAlign="left" styleName="miniText" />
                  <mx:Label x="398" y="87" width="239" text="Follow our simple SignUp process"
                          textAlign="left" styleName="miniText" />
                  <mx:Label x="22" y="161" width="239" text="Your password:"
                          textAlign="left" styleName="miniText" />
                  <mx:Label id="tf_lostpassword" x="22" y="221" width="239" color="#CC0000" styleName="miniText"
                           textAlign="left" selectable="true"/>
                  <mx:TextInput id="tf_login" x="22" y="109" width="292"/>
                  <mx:TextInput id="tf_password" x="22" y="182" width="292"
                             displayAsPassword="true"/>
               </mx:Canvas>
               
            </mx:Panel>
         </mx:VBox>
         
         
         <!-- SignUp View -->
         <mx:VBox id="view_signup" width="100%" height="100%" verticalAlign="middle" horizontalAlign="center">
            <mx:Panel id="panel_signup" title="Sign Up" height="500" width="400" styleName="largeText">
               <mx:Canvas width="100%" height="100%" horizontalScrollPolicy="off" verticalScrollPolicy="off">
                  <mx:Button id="bt_sup_submit" x="22" y="388" width="112" label="Submit!"/>
                  <mx:Label x="22" y="18" width="239" styleName="largeText" text="Create a User Account" textAlign="left"/>
                  <mx:Label x="22" y="58" width="239" text="Your nickname:" textAlign="left" styleName="miniText" />
                  <mx:TextInput id="tf_sup_username" x="22" y="79" width="239"/>
                  <mx:Label x="22" y="128" width="239" text="Your email address:" textAlign="left" styleName="miniText" />
                  <mx:TextInput id="tf_sup_email" x="22" y="149" width="239"/>
                  <mx:Label x="22" y="198" width="239" text="Choose your password:" textAlign="left" styleName="miniText" />
                  <mx:TextInput id="tf_sup_password" x="22" y="219" width="239"
                             displayAsPassword="true"/>
                  <mx:Label x="22" y="278" width="239" text="Let us know your country:" textAlign="left" styleName="miniText" />
                  <mx:TextInput id="tf_sup_country" x="22" y="299" width="239"/>
                  <mx:Label x="282" y="278" width="239" text="… and age:" textAlign="left" styleName="miniText" />
                  <mx:TextInput id="tf_sup_age" x="282" y="299" width="59" maxChars="2"/>
               </mx:Canvas>
            </mx:Panel>
         </mx:VBox>
         
         <!-- Activate Account View -->
         <mx:VBox id="view_activate" width="100%" height="100%" verticalAlign="middle" horizontalAlign="center">
            <mx:Panel title="Activate your Account" height="300" width="600" styleName="largeText">
               <mx:Canvas width="100%" height="100%">

                  <mx:Label x="22" y="68" width="532" styleName="largeText" color="#999999" text="Paste here the Activation Code we sent to your email address" textAlign="left"/>

                  <mx:TextInput id="tf_activation" x="22" y="102" width="532"/>
                  <mx:Button id="bt_activation" x="174" y="164" label="Activate"/>
                  <mx:Button id="bt_resend" x="278" y="164" label="Resend Email"/>
               </mx:Canvas>
               
            </mx:Panel>
         </mx:VBox>
         
         <!-- Password Recovery View -->
         <mx:VBox id="view_password_recover" width="100%" height="100%" verticalAlign="middle" horizontalAlign="center">
            <mx:Panel title="Password Recovery" height="300" width="600" styleName="largeText">
               <mx:Canvas width="100%" height="100%">
                  
                  <mx:Label x="22" y="68" width="532" styleName="largeText" color="#999999" text="Please type here your account's user name:" textAlign="left"/>
                  
                  <mx:TextInput id="tf_recover" x="22" y="102" width="532"/>
                  <mx:Button id="bt_recover_email" x="190" y="158" label="Resend my Password"/>
               </mx:Canvas>
               
            </mx:Panel>
         </mx:VBox>
         
         <!-- Public chat + video conference view -->
         <mx:HBox id="view_inside" width="100%" height="70%" verticalAlign="middle" horizontalAlign="center" borderColor="#292929">
            <mx:Panel width="75%" height="100%" layout="vertical" borderColor="#0094B4">
               <mx:HBox width="75%" horizontalAlign="left" borderColor="#2B2B2B" backgroundColor="#459FB2">
                  <mx:Button label="Broadcast video" click="onJoinConfBtClick()" id="bt_joinConf" alpha="1.0" fillAlphas="[1.0, 1.0, 1.0, 1.0]"/>
                  <mx:Button label="Broadcast audio and video" click="startav()" id="bt_joinConf2" fillAlphas="[1.0, 1.0, 1.0, 1.0]" alpha="1.0"/>
                  <mx:Button label="Stop broadcasting" click="onLeaveConfBtClick()" id="bt_leaveConf" enabled="false" fillAlphas="[1.0, 1.0, 1.0, 1.0]" alpha="1.0"/>
                  <sfb:RoomList errorsDisplayTime="3" groupByRoomType="false" showChatRooms="true" showGameRooms="true" showIcons="false" showHiddenRooms="false" showPrivateRooms="true" sortOrder="ASC" width="418" height="36" defaultRoom="test" roomGroups="default" id="rl_rooms" minHeight="20"/>
                  
               </mx:HBox>
               <mx:Tile width="865" id="videoContainer" horizontalScrollPolicy="off" verticalScrollPolicy="auto" direction="horizontal" borderColor="#2B2B2B" backgroundColor="#459FB2" height="284">
                  <components:VideoConferenceItem id="myVCItem"  width="166" height="122"/>
               </mx:Tile>
               <mx:Tile width="100%" id="videoContainer0" horizontalScrollPolicy="off" verticalScrollPolicy="auto" direction="vertical" borderColor="#2B2B2B" backgroundColor="#459FB2" height="221">
                  <sfb:ChatBox showColorPicker="true"  roomJoinAlert="#user has joined the chatroom." height="214" showClearButton="true" groupMessages="false" width="637" messageHeader="[#time] #user: "  systemAlertsColor="#000000" styleName="chat"/>
                  <sfb:UserList  sortOrder="ASC"  width="218" height="215" id="ul_users1" minHeight="20" enablePrivateChat="true" alpha="1.0">
                     <sfb:kickMessage>You have been kicked. Please check our Terms of Service to avoid a ban.</sfb:kickMessage>
                     <sfb:banMessage>You have been banned. Please check our Terms of Service.</sfb:banMessage>
                  </sfb:UserList>
               </mx:Tile>
               <mx:ControlBar horizontalGap="0" width="100%" height="27">
                  <mx:Label text="You are known as:" color="#FFFFFF"/>
                  <mx:Label id="lb_myUserName" fontWeight="bold" width="75%" color="#FF7E00"/>
                  <mx:Button label="Mute all audio" click="muteaudio();" id="mute" color="#000000" alpha="0.5" fillAlphas="[1.0, 0.73, 0.73, 0.73]"/>
                  <mx:Button label="Unmute all audio" click="unmuteaudio();" id="unmute" color="#000000" alpha="0.5" fillAlphas="[1.0, 1.0, 1.0, 1.0]"/>
               </mx:ControlBar>
            </mx:Panel>
         </mx:HBox>
         
      </mx:ViewStack>
      
      <!-- Footer -->
   </mx:VBox>
         
         <!-- Connection Lost View -->
         <mx:VBox id="view_disconnected" width="100%" height="100%" verticalAlign="middle" horizontalAlign="center">
            <mx:Panel title="Ooops! Disconnected..." height="300" width="600" styleName="largeText">
               <mx:Canvas width="100%" height="100%">
                  <mx:Label x="180.5" y="69" text="A disconnection occurred!"
                          textAlign="center"/>
                  <mx:Label id="tf_discReason" x="22" y="104" width="533" color="#CC0000"
                          fontSize="14" textAlign="center"/>
                  <mx:Button id="bt_goBack" x="243.5" y="169" label="Go Back"/>
                  
               </mx:Canvas>
            </mx:Panel>
      <!-- Footer -->
   </mx:VBox>
</mx:Application>


Now I don't get the error as described above anymore, but a new one. Something SmartFoxBits related, I guess:
"Could not resolve <sfb:RoomList> to a component implementation." and "Could not resolve <sfb:UserListt> to a component implementation."

[Bax]

Are you sure the SmartFoxBits SWC file is referenced in your Flex project?
From the error it seems Flash Builder is not able to find the components.

[RiccardoNL]

Hi Bax,

Yes, I have placed the SmartFoxBits files in the libs folder of my project. Flex is able to load SmartFoxBits in several other projects. I don't really understand why it doesn't load now. Should I have to refer to that file, or should xmlns:sfb="http://www.smartfoxserver.com/bits just work?

[Bax]

Quite strange. Not sure why it doesn't "see" the components anymore.
What if you create a new project from scratch?