<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>elearninglive.com &#187; JavaScript</title>
	<atom:link href="http://elearninglive.com/wordpress/category/javascript/feed/" rel="self" type="application/rss+xml" />
	<link>http://elearninglive.com/wordpress</link>
	<description>Quality web solutions.</description>
	<lastBuildDate>Wed, 28 Jul 2010 18:38:03 +0000</lastBuildDate>
	
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>How to enable Fullscreen Mode for a SWF and Does ExternalInterface Work In It?</title>
		<link>http://elearninglive.com/wordpress/2008/12/how-to-enable-fullscreen-mode-for-a-swf-and-does-externalinterface-work-in-it/</link>
		<comments>http://elearninglive.com/wordpress/2008/12/how-to-enable-fullscreen-mode-for-a-swf-and-does-externalinterface-work-in-it/#comments</comments>
		<pubDate>Tue, 30 Dec 2008 03:51:34 +0000</pubDate>
		<dc:creator>Mark</dc:creator>
				<category><![CDATA[Elearning General]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[elearning]]></category>
		<category><![CDATA[fullscreen flash]]></category>
		<category><![CDATA[fullscreen swf]]></category>

		<guid isPermaLink="false">http://elearninglive.com/wordpress/?p=200</guid>
		<description><![CDATA[At my day job I&#8217;ve been working recently on a project in which I needed to design and code a brand new elearning user interface/content player. It&#8217;s turned out great from a design standpoint and now I&#8217;m slowly adding features to it as I have time. Today, I got the idea to add a fullscreen [...]]]></description>
			<content:encoded><![CDATA[<p>At my day job I&#8217;ve been working recently on a project in which I needed to design and code a brand new elearning user interface/content player. It&#8217;s turned out great from a design standpoint and now I&#8217;m slowly adding features to it as I have time. Today, I got the idea to add a fullscreen toggle button so that the user can make the course player go to fullscreen mode. This is all the rage for viewing flash videos, but I&#8217;ve never seen it done for non-video work. My custom user interface/content player was developed completely in Flash &#8211; so it&#8217;s all vector graphics, text, etc. So scaling does not cause pixelization. The content is all swf too, with an occasional gif/png thrown in, so there is distortion in those images but giving the user the fullscreen feature is well worth that minor blemish.</p>
<p>After implementing the fullscreen feature, I&#8217;m thrilled. I&#8217;m convinced that every elearning app like this should include it as a feature. And I wondered why I hadn&#8217;t seen it used before&#8230;so I thought, &#8220;Perhaps SCORM/AICC calls can&#8217;t be made when it is in fullscreen mode?&#8221; While I haven&#8217;t taken the time to actually test that theory, I did put together a quick html/swf to test whether the ExternalInterface class is usable when the swf is in fullscreen mode. And it works! <a href="http://elearninglive.com/temp/ExternalInterfaceAS3/" target="_blank">Here is the example (warning &#8211; it opens in a new window)</a>. To test for yourself, first put it in fullscreen by clicking the button (it&#8217;s a toggle). Then, click the &#8216;Call ExternalInterface&#8217; button to call a simple function in the html page named &#8217;showAlert&#8217;, which shows an alert box.</p>
<p style="text-align: center;"><a href="http://elearninglive.com/wordpress/wp-content/uploads/2008/12/12-29-2008-10-49-57-pm.gif"><img class="alignnone size-full wp-image-201" title="ExternalInterface and Fullscreen Flash Testing" src="http://elearninglive.com/wordpress/wp-content/uploads/2008/12/12-29-2008-10-49-57-pm.gif" alt="" width="479" height="295" /></a></p>
<p>So, here&#8217;s the code:</p>
<p>In Flash:</p>
<p>/*************************<br />
* External Interface &#8211; work in fullscreen mode? YES!<br />
*************************/<br />
function checkInterface(e:MouseEvent):void<br />
{<br />
if (ExternalInterface.available)<br />
{<br />
status_txt.text=&#8221;ExternalInterface available!&#8221;;<br />
ExternalInterface.call(&#8221;showAlert&#8221;, &#8220;It works!&#8221;);<br />
}<br />
else<br />
{<br />
status_txt.text=&#8221;ExternalInterface Unavailable!&#8221;;<br />
}<br />
}<br />
myButton.addEventListener(MouseEvent.CLICK, checkInterface);</p>
<p>// fullscreen<br />
function goFullScreen():void<br />
{<br />
if (stage.displayState==StageDisplayState.NORMAL)<br />
{<br />
stage.displayState=StageDisplayState.FULL_SCREEN;<br />
}<br />
else<br />
{<br />
stage.displayState=StageDisplayState.NORMAL;<br />
}<br />
}<br />
fullscreenBtn.addEventListener(MouseEvent.CLICK, _handleClick);</p>
<p>function _handleClick(event:MouseEvent):void<br />
{<br />
goFullScreen();<br />
}</p>
<p>&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8211;</p>
<p>Function I added to the html page published from Flash (with &#8216;allowFullscreen&#8217; param set to true):</p>
<p>function showAlert(text)<br />
{<br />
alert(text);<br />
}</p>
<p>So, theoretically, going fullscreen shouldn&#8217;t cause any issues with communications with an LMS. As you noticed if you tried the example, calling the showAlert function in the html page forces the swf out of fullscreen mode. I&#8217;m assuming (too many assumptions here?) that this won&#8217;t happen for behind-the-scenes calls.</p>
<p>Have you tried this? What has your experience with using fullscreen flash for your elearning?</p>
]]></content:encoded>
			<wfw:commentRss>http://elearninglive.com/wordpress/2008/12/how-to-enable-fullscreen-mode-for-a-swf-and-does-externalinterface-work-in-it/feed/</wfw:commentRss>
		<slash:comments>9</slash:comments>
		</item>
		<item>
		<title>Resize Adobe Connect Content Window</title>
		<link>http://elearninglive.com/wordpress/2008/12/resize-adobe-connect-content-window/</link>
		<comments>http://elearninglive.com/wordpress/2008/12/resize-adobe-connect-content-window/#comments</comments>
		<pubDate>Tue, 16 Dec 2008 14:31:07 +0000</pubDate>
		<dc:creator>Mark</dc:creator>
				<category><![CDATA[Adobe Connect]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>

		<guid isPermaLink="false">http://elearninglive.com/wordpress/?p=161</guid>
		<description><![CDATA[Trying to use Adobe Connect Training for something it wasn&#8217;t intended for is really a pain. Little things (that are big things) just drive me nuts about it. Anyways, here (mainly for me for future reference) is a script to force the content window to be fullsized. It goes in the BODY and not the [...]]]></description>
			<content:encoded><![CDATA[<p>Trying to use Adobe Connect Training for something it wasn&#8217;t intended for is really a pain. Little things (that are big things) just drive me nuts about it. Anyways, here (mainly for me for future reference) is a script to force the content window to be fullsized. It goes in the BODY and not the HEAD (which, for some reason, wasn&#8217;t working as it would get ignored).</p>
<p>&lt;!&#8211; Fullsize the browser window (Adobe Connect makes it too small to start!) &#8211;&gt;<br />
&lt;script language=&#8221;Javascript1.1&#8243; type=&#8221;text/javascript&#8221;&gt;<br />
if (top.frames.length!=0)<br />
top.location=self.document.location;<br />
self.moveTo(0,0);<br />
self.resizeTo(screen.availWidth,screen.availHeight);<br />
self.focus();<br />
&lt;/script&gt;</p>
<p>If anyone reading this has had any success getting 3rd-party (ie, not packaged by Captivate or Adobe Presenter) AICC content to track properly in Adobe Connect Training, *please* email me a working sample as I&#8217;d love to see it work.</p>
]]></content:encoded>
			<wfw:commentRss>http://elearninglive.com/wordpress/2008/12/resize-adobe-connect-content-window/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
