Overview
"Lyra" is a open source JavaScript library with the Silverlight Application for playing Windows Media Contents on the Firefox over the Silverlight.
Currently, video file (video window) is not supported!
Design
Lyra has a simple wrapper System.Windows.Controls.MediaElement in Javascript.
Demo
- mRadio
- Simple Example
- Rich UI Example by using Ext JS
How to use
1. In this case, lyra files are to:
- /js/lyra.js
- /bin/lyra.xap
And, you have to install the Silverlight2.
2. include these Javascript files in header.
<script type="text/javascript" src="/js/lyra.js"></script>
3. Lyra Silverlight application tag in body.
<div id="silverlightControlHost">
<object id="lyraSilverlightControlHost" data="data:application/x-silverlight-2," type="application/x-silverlight-2">
<param name="source" value="/bin/lyra.xap"/>
<param name="onerror" value="onSilverlightError" />
<param name="background" value="white" />
<param name="minRuntimeVersion" value="2.0.31005.0" />
<param name="autoUpgrade" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=124807" style="text-decoration: none;">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/>
</a>
</object>
<iframe style='visibility:hidden;height:0;width:0;border:0px'></iframe>
</div>
4. Initialize Lyra in javascript. (You may need to call Lyra.init after window.onload.)
<script type="text/javascript">
<!--
Lyra.init("lyraSilverlightControlHost");
//-->
</script>
is an id of the Silverlight object in Step 3.
5. Create the Media Element and call open. (You have to call Lyra.createMediaElement after window.onload)
<script type="text/javascript">
<!--
var media = Lyra.createMediaElement("mediaid");
media.open("http://....");
//-->
</script>
"mediaid" is an indentifer of media in Lyra. "mediaid" will be used when you use multiple media.
Currently, Lyra can't manage multiple media yet.
delay initializing
The silverlight Lyra object was not available at that particular time. You may need to delay the call Lyra.init like below:
<body onload='setTimeout(function(){Lyra.init("lyraSilverlightControlHost");},0);'>
See also:
http://silverlight.net/forums/p/7332/22747.aspx
hide the Silverlight application
For playing the audio file, the Silverlight application have to be not displayed.
You can hide the Silverlight application when the width and the height are seted zero on object element.
The Silverlight application may be not work when display sets "none" or visibillity sets "hidden" as style.
<div id="silverlightControlHost">
<object width="0" height="0" id="lyraSilverlightControlHost" data="data:application/x-silverlight-2," type="application/x-silverlight-2">
<param name="source" value="/bin/lyra.xap"/>
<param name="onerror" value="onSilverlightError" />
<param name="background" value="white" />
<param name="minRuntimeVersion" value="2.0.31005.0" />
<param name="autoUpgrade" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=124807" style="text-decoration: none;">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/>
</a>
</object>
<iframe style='visibility:hidden;height:0;width:0;border:0px'></iframe>
</div>
Document
Sorry, Lyla is not documented.
Please see lyla.js...
Design
Lyra has a simple wrapper System.Windows.Controls.MediaElement in Javascript.
System Requirement
Actually, Lyra depends on the Microsoft Silverlight. Please see also
Silverlight siteThe Silverlight runtime supports rich media capabilities and enables fast, cost-effective delivery of high-quality audio and video to all major browsers including Internet Explorer, Firefox, and Safari running on the Mac or on Windows.