Friday, March 4, 2011

Confirming before page unloading

For confirming before page unloading we want to add the following code snippet to the html file in the bin-debug folder.

function getFlexApp(appName) {                  
                        if (navigator.appName.indexOf ("Microsoft") !=-1) {                                     
                        return window[appName];
                        } else {                                    
                        return document[appName];
                        }
            }

window.onbeforeunload = function () {
                        if (true/false) {            
                                    getFlexApp(FLASH ID).CALL BACK FUNCTION();
                                    setTimeout('', 3000);  
                                    var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
                                    if(is_chrome)
                                                return "Are you sure you want to navigate away from this page?";
                                    return "";                                             
                        }          
            }






An Example.

Web side

<%@taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<script language="JavaScript" type="text/javascript">
    function getFlexApp(appName) {       
          if (navigator.appName.indexOf ("Microsoft") !=-1) {               
            return window[appName];
          } else {               
            return document[appName];
          }
    } 
    window.onbeforeunload = function () {       
        if (getFlexApp('mySwf').cancloseornot()) {             
            getFlexApp('mySwf').onFocusChange();
            setTimeout('', 3000);   
            var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
            if(is_chrome)
                return "Are you sure you want to navigate away from this page?";
            return "";               
           }       
    }   
</script>
<script type="text/javascript" src="oosMee/flex/swfobject.js" >                          
                            var swfVersionStr = "10.0.0";                          
                            var xiSwfUrlStr = "playerProductInstall.swf";
                            var flashvars = {};
                           flashvars.meetingRoomId = ${meetingRoomId};
                           var params = {};
                          params.quality = "high";
                          params.bgcolor = "#b5d9e9";
                          params.allowscriptaccess = "sameDomain";
                          params.allowfullscreen = "true";
                          var attributes = {};
                          attributes.id = "oosMee";
                          attributes.name = "oosMee";
                          attributes.align = "middle";
                          swfobject.embedSWF("oosMee.swf", "flashContent","500", "1000",swfVersionStr,
                                                                xiSwfUrlStr, flashvars, params, attributes);                   
                          swfobject.createCSS("#flashContent", "display:block;text-align:left;");
                   </script>
<table width="100%" height="100%">
    <tr>
        <td valign="top">
            <object id='mySwf' classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' width="1200"
                         height="500">
                <param name='src' value='flex/oosMee.swf' />
                <param name='flashVars' value='meetingRoomId=${meetingRoomId}' />
                <embed name='mySwf' src='flex/oosMee.swf' width="1000" height="500"
                             flashVars='meetingRoomId=${meetingRoomId}' />
            </object>
        </td>
    </tr>
   
</table>



Flex Side.

<?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"
               xmlns:components="com.oosmee.components.*"
               xmlns:local="*"
               xmlns:rtc="http://ns.adobe.com/rtc"
               backgroundColor="#b5d9e9"
               applicationComplete="loadJavaScriptCallBack()"
               width="100%"
               height="100%">

    <fx:Script>
        <![CDATA[           
            import mx.controls.Alert;
            import mx.core.Application;
            import mx.core.FlexGlobals;     

            [Bindable]
            private var anonymousClick:Boolean=true;
            [Bindable]
            private var disconnectBtnClick:Boolean=false;
           
            /**
             * @private
             * Adding the javascript callbavk functions.
             *
             */
            private function loadJavaScriptCallBack():void
            {
                ExternalInterface.addCallback("cancloseornot", cancloseornot);
                ExternalInterface.addCallback("onFocusChange", onFocusChange);
            }

            /**
             * @private
             * A javascript callback function to identify the anonymous click.
             *
             */
            public function cancloseornot():Boolean
            {
                return anonymousClick;
            }

            /**
             * @private
             * A javascript callback funtion to handle the focus change situation.
             * here we also set the flag to identify the disconnect/complete button click.
             *
             */
            public function onFocusChange():void
            {
                disconnectBtnClick=false;
            }           
        ]]>
    </fx:Script>   
</s:Application>


also refer :

Tuesday, March 1, 2011

Calling a javascript function

Main File


 <?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/03/09/calling-javascript-functions-from-your-flex-applications-using-the-externalinterface-api/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
                layout="vertical"
                verticalAlign="middle"
                backgroundColor="white"
                viewSourceURL="srcview/index.html">

    <mx:Script>
        <![CDATA[
            private function callJavaScript():void
            {
                ExternalInterface.call("sayHelloWorld");
            }
        ]]>
    </mx:Script>

    <mx:Button label="Say 'Hello World'"
               click="callJavaScript();"/>

</mx:Application>


Add the javascript code to the html file in the output folder

<script language="JavaScript" type="text/javascript">
    function sayHelloWorld() {
        alert("Hello World, from JavaScript");
    }
</script>




also refer :