<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML Strict//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Cross Domain Demo Parent Page</title>
        <meta http-equiv="Pragma" content="no-cache"/>
        <script type="text/javascript">
            // Ensure all iFrames are working in a common domain
            document.domain = "shouldersofgiants.co.uk";
        </script>
    </head>
    <body>

        <p>The following iFrame is hosted on another domain from this parent page. </p>
        
        <div>
            <input onclick="JavaScript: TurnFrameRed(); return false;" type="submit" value="Turn Frame Red" />
            <input onclick="JavaScript: TurnFrameYellow(); return false;" type="submit" value="Turn Frame Yellow" />
        </div>
        
        <p>Click a button to communicate with the child frame</p>

        <iframe id="hostFrame" name="hostFrame" width="100%" height="100px" frameborder="0" src="http://www.pierslawson.plus.com/Examples/CrossDomain/InnerFrame.html" scrolling="no"></iframe>

        <iframe id="innerFrameProxy" width="10px" height="10px" frameborder="0" src="http://www.pierslawson.plus.com/Examples/CrossDomain/InnerFrameProxy.html" style=" position: absolute; left: -150px; top: 0px;"></iframe>

    </body>
    <script type="text/javascript">

        function OnMessageFromChild(message) {

            if (message.length > 0) {

                var parameters = parseParameters(message);

                if (parameters["height"] != null) {
                    document.getElementById('hostFrame').height = parseInt(parameters["height"]);
                }
                
                if (parameters["color"] != null) {
                    document.body.bgColor = parameters["color"];
                }
            }
        }

        function parseParameters(message) {

            var dictionary = new Array();
            var pairs = message.split(/&/);
            
            for (var keyValuePairIndex in pairs) {

                var nameVal = pairs[keyValuePairIndex].split(/=/);
                dictionary[nameVal[0]] = nameVal[1];
            }
         
            return dictionary;
        }
	
        function TurnFrameRed() {
            SendMessageToFrame("color=red");
        }

        function TurnFrameYellow() {
            SendMessageToFrame("color=yellow");
        }

        // Send a message to the iFrame via the proxy, toggling the iFrame's
        // size to indicate there is a message ready to be read
        function SendMessageToFrame(message) {
        
            var elem = document.getElementById('innerFrameProxy');
            elem.contentWindow.location = 'http://www.pierslawson.plus.com/Examples/CrossDomain/InnerFrameProxy.html#' + message;
            elem.width = elem.width > 50 ? 50 : 100;
        }

    </script>
</html>