Expand my Community achievements bar.

Radically easy to access on brand approved content for distribution and omnichannel performant delivery. AEM Assets Content Hub and Dynamic Media with OpenAPI capabilities is now GA.
SOLVED

Personalizzare il componente simpleChat

Avatar

Former Community Member

Ciao a tutti, sono nuovo e vorrei sapere come posso fare a personalizzare il componente SimpleChat.Utilizzo Flash Builder 4.5 e in design mode non mi fa vedere il componente. Come potrei fare ?

1 Accepted Solution

Avatar

Correct answer by
Former Community Member

Hi There,

The first time you run the app, you should use your developer credentials -

this "unlocks" the features such as chat that you want to use.

See the 2nd VideoTutorial in the SDK Navigator application - "Managing

Roles and Permissions" - it explains why this works the way it does.

nigel

View solution in original post

4 Replies

Avatar

Former Community Member

Buongiorno,

(I have no idea how this arrived in my Inbox in english!)

I don't think design mode would really help you here anyhow. What are you trying to customize?

  One easy option is to build your own UI that sits on top of SimpleChatModel. Here's a quick example. You could build your own component that uses SimpleChatModel to show whatever you'd like for the UI - we encourage it, since we know our default UI isn't that exciting.

Nota bene : This example is at least 10 times easier in MX, since for whatever reason, the Spark folks decided displaying HTMLText in a textArea was too useful, and removed that functionality.

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
                  xmlns:s="library://ns.adobe.com/flex/spark"
                  xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" xmlns:session="com.adobe.rtc.session.*" xmlns:authentication="com.adobe.rtc.authentication.*">
     <fx:Script>
          <![CDATA[
               import com.adobe.rtc.sharedModel.descriptors.ChatMessageDescriptor;
              
               import spark.utils.TextFlowUtil;
          ]]>
     </fx:Script>
     <fx:Declarations>
          <!-- Place non-visual elements (e.g., services, value objects) here -->
     </fx:Declarations>
     <fx:Script>
          <![CDATA[
               import com.adobe.rtc.events.ChatEvent;
               import com.adobe.rtc.sharedModel.SimpleChatModel;
               [Bindable]
               protected var m_chatModel:SimpleChatModel = new SimpleChatModel();
              
               protected function init():void
               {
                    m_chatModel.sharedID = "myChat";
                    m_chatModel.subscribe();
                    m_chatModel.addEventListener(ChatEvent.HISTORY_CHANGE, onHistoryChange);
               }
              
               protected function onHistoryChange(p_evt:ChatEvent):void
               {
                    chatOutput.text += p_evt.message.displayName + ": " + p_evt.message.msg + "\n";
               }
              
               protected function sendMessage():void
               {
                    var chatMsg:ChatMessageDescriptor = new ChatMessageDescriptor();
                    chatMsg.msg = chatInput.text;
                    m_chatModel.sendMessage(chatMsg);
                    chatInput.text = "";
               }
          ]]>
     </fx:Script>


     <session:ConnectSessionContainer roomURL="https://collaboration.adobelivecycle.com/<account>/<room>" synchronizationChange="init()" width="100%" height="100%">
          <session:authenticator>
               <authentication:AdobeHSAuthenticator userName="<username>" password="<pass>"/>
          </session:authenticator>
          <s:TextArea id="chatOutput" width="300" height="400" editable="false"/>
          <s:TextInput id="chatInput" width="300" y="425" enter="sendMessage()"/>
     </session:ConnectSessionContainer>
    
</s:Application>

Grazie,

  nigel

Avatar

Former Community Member

    Hi, I found your answer really successfully i used it but i have one problem with that code. I used this code ( i only delete the password, because i want make a chat for my site)

    flex return me this error "Main Thread (Suspended: Error: Error - insufficient permissions to create a new CollectionNode. You must be an OWNER of the room to add new multi-user features to it. Log in with developer credentials in order to do so.) "
    I have checked "Auto-Promote User" in the manage tab in the LCCS program. But this don't work because it return again the error.

    Sorry for my english
    If you have question about my english tell me.

    This is the code i used:

    i used this code

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


    <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"


                      xmlns:s="library://ns.adobe.com/flex/spark"


                      xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" xmlns:session="com.adobe.rtc.session.*" xmlns:authentication="com.adobe.rtc.authentication.*">


         <fx:Script>


              <![CDATA[


                   import com.adobe.rtc.sharedModel.descriptors.ChatMessageDescriptor;


                   


                   import spark.utils.TextFlowUtil;


              ]]>


         </fx:Script>


         <fx:Declarations>


              <!-- Place non-visual elements (e.g., services, value objects) here -->


         </fx:Declarations>


         <fx:Script>


              <![CDATA[


                   import com.adobe.rtc.events.ChatEvent;


                   import com.adobe.rtc.sharedModel.SimpleChatModel;


                   [Bindable]


                   protected var m_chatModel:SimpleChatModel = new SimpleChatModel();


                   


                   protected function init():void


                   {


                        m_chatModel.sharedID = "myChat";


                        m_chatModel.subscribe();


                        m_chatModel.addEventListener(ChatEvent.HISTORY_CHANGE, onHistoryChange);


                   }


                   


                   protected function onHistoryChange(p_evt:ChatEvent):void


                   {


                        chatOutput.text += p_evt.message.displayName + ": " + p_evt.message.msg + "\n";


                   }


                   


                   protected function sendMessage():void


                   {


                        var chatMsg:ChatMessageDescriptor = new ChatMessageDescriptor();


                        chatMsg.msg = chatInput.text;


                        m_chatModel.sendMessage(chatMsg);


                        chatInput.text = "";


                   }


              ]]>


         </fx:Script>


         


         


         <session:ConnectSessionContainer roomURL="https://collaboration.adobelivecycle.com/<myaccount>/<myroom>
    " synchronizationChange="init()" width="100%" height="100%">

    <session:authenticator>

    <authentication:AdobeHSAuthenticator userName="Guest" />

    </session:authenticator>

    <s:TextArea id="chatOutput" width="300" height="400" editable="false"/>

    <s:TextInput id="chatInput" width="300" y="425" enter="sendMessage()"/>

    </session:ConnectSessionContainer>


    </s:Application>

    Avatar

    Correct answer by
    Former Community Member

    Hi There,

    The first time you run the app, you should use your developer credentials -

    this "unlocks" the features such as chat that you want to use.

    See the 2nd VideoTutorial in the SDK Navigator application - "Managing

    Roles and Permissions" - it explains why this works the way it does.

    nigel

    Avatar

    Former Community Member

    Ty a lot for the answer. Now i see al video tutorial and i have resolved my problems ty again

    The following has evaluated to null or missing: ==> liqladmin("SELECT id, value FROM metrics WHERE id = 'net_accepted_solutions' and user.id = '${acceptedAnswer.author.id}'").data.items [in template "analytics-container" at line 83, column 41] ---- Tip: It's the step after the last dot that caused this error, not those before it. ---- Tip: If the failing expression is known to be legally refer to something that's sometimes null or missing, either specify a default value like myOptionalVar!myDefault, or use <#if myOptionalVar??>when-present<#else>when-missing. (These only cover the last step of the expression; to cover the whole expression, use parenthesis: (myOptionalVar.foo)!myDefault, (myOptionalVar.foo)?? ---- ---- FTL stack trace ("~" means nesting-related): - Failed at: #assign answerAuthorNetSolutions = li... [in template "analytics-container" at line 83, column 5] ----