edgework/vimeoFacebook.html

## vimeoFacebook.html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
<head>
	<META HTTP-EQUIV="content-type" CONTENT="text/html; charset=UTF-8">
	<title>Facebook !<3 Vimeo</title>
	<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.js"></script>
	<script type="text/javascript" src="https://player.vimeo.com/api/player.js"></script>
	<script type="text/javascript" src="//connect.facebook.net/en_US/sdk.js"></script>
	<script type='text/javascript'>

		window.fbAsyncInit = function ()
		{
			FB.init({
				appId: '103866496748657',
				xfbml: true,
				version: 'v2.7'
			});
		};

		FB.Event.subscribe('xfbml.ready', function (msg)
		{
			if (msg.type == 'video') {
				$('#f_Console').append('<p>facebook video loaded</p>');
			}
		});

		$(document).ready(function()
		{
			var options = {
				id:     59777392,
				width:  640
			};

			$('#f_Container').append($('<div id="vimeoPlayer1" class="hidden"></div>'));
			var player = new Vimeo.Player(vimeoPlayer1, options);
			player.on('loaded', vimeoLoaded);

			$('#f_Container').append($('<div id="facebookPlayer1" class="hidden"><div id="fbPlayer" class="fb-video" data-href="https://www.facebook.com/GameSpotUniverse/videos/1781581218766040" data-width="640" data-show-text="false"></div></div>'));
		});

		function vimeoLoaded()
		{
			$('#f_Console').append('<p>vimeo video loaded</p>');
		}

	</script>

	<style>

		/* Comment/Remove this style for both players to work */
		.hidden
		{
			display: none;
		}

	</style>
</head>

<body>
	<header>
		<h1>Facebook ! <3 Vimeo</h1>
	</header>
	<div id="fb-root"></div>
	<div id='f_Container'></div>
	<div id='f_Console' style='margin-top: 30px; height: 100px; overflow: auto; border: 1px solid black;'></div>
</body>

</html>
	<!DOCTYPE html>
	<html xmlns="http://www.w3.org/1999/html">
	<head>
	<META HTTP-EQUIV="content-type" CONTENT="text/html; charset=UTF-8">
	<title>Facebook !<3 Vimeo</title>
	<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.js"></script>
	<script type="text/javascript" src="https://player.vimeo.com/api/player.js"></script>
	<script type="text/javascript" src="//connect.facebook.net/en_US/sdk.js"></script>
	<script type='text/javascript'>

	window.fbAsyncInit = function ()
	{
	FB.init({
	appId: '103866496748657',
	xfbml: true,
	version: 'v2.7'
	});
	};

	FB.Event.subscribe('xfbml.ready', function (msg)
	{
	if (msg.type == 'video') {
	$('#f_Console').append('<p>facebook video loaded</p>');
	}
	});

	$(document).ready(function()
	{
	var options = {
	id: 59777392,
	width: 640
	};

	$('#f_Container').append($('<div id="vimeoPlayer1" class="hidden"></div>'));
	var player = new Vimeo.Player(vimeoPlayer1, options);
	player.on('loaded', vimeoLoaded);

	$('#f_Container').append($('<div id="facebookPlayer1" class="hidden"><div id="fbPlayer" class="fb-video" data-href="https://www.facebook.com/GameSpotUniverse/videos/1781581218766040" data-width="640" data-show-text="false"></div></div>'));
	});

	function vimeoLoaded()
	{
	$('#f_Console').append('<p>vimeo video loaded</p>');
	}

	</script>

	<style>

	/* Comment/Remove this style for both players to work */
	.hidden
	{
	display: none;
	}

	</style>
	</head>

	<body>
	<header>
	<h1>Facebook ! <3 Vimeo</h1>
	</header>
	<div id="fb-root"></div>
	<div id='f_Container'></div>
	<div id='f_Console' style='margin-top: 30px; height: 100px; overflow: auto; border: 1px solid black;'></div>
	</body>

	</html>