Streaming a Silverlight Media Application from Silverlight Live
page 5 of 6
by Jesudas Chinnathampi (Das)
Average Rating: This article has not yet been rated.
Views (Total / Last 10 Days): 39506/ 94

Invoke multiple video files from a single web page

Now that you have seen how to host a video file at Silverlight streaming account, I will show you an example of how to have a common web page which will have hyperlinks to all video files hosted in your Silverlight streaming account. This way, you can share all your video files using one common web page. Let me assume you have hosted 5 video files using the techniques that you have seen so far in this article.

Your main html / asp / aspx page should look as follows.

Listing 4

<html xmlns="" >
<head runat="server">
    <title>My Videos</title>
<script type="text/javascript" src=""></script>
<script type="text/javascript" src="CreateSilverlight.js"></script>    
    <form id="form1" runat="server">
    <table width="95%" align="center" ID="Table1">
      <td width="20%"><a href="javascript:showVideo(1);">
        <font face="verdana" size="2"><b>Birthday Party</b></font></a></td>
      <td width="20%"><a href="javascript:showVideo(2);"> 
        <font face="verdana" size="2"><b>Graduation Party</b></font></a></td>
      <td width="20%"><a href="javascript:showVideo(3);"> 
        <font face="verdana" size="2"><b>Bachelors Party</b></font></a></td>
      <td width="20%"><a href="javascript:showVideo(4);"> 
        <font face="verdana" size="2"><b>Wedding Day</b></font></a></td>
      <td width="20%"><a href="javascript:showVideo(5);"> 
        <font face="verdana" size="2"><b>Babyshower</b></font></a></td> 
      <div id="videoWrapper" style="width:800px; height:700px; 

In the above code I have used a custom JavaScript function named, "showVideo." You guessed it right; the function is defined inside the "CreateSilverlight.js" file. The content of the Create Silverlight file will look like Listing 5.

Listing 5

function showVideo (intCtr)
      var varWrapper = document.getElementById("videoWrapper");
function CreateSilverlight(intID)
      if (intID == 1)
              {source: "streaming:/99999/Birthday",parentElement: videoWrapper});
      if (intID == 2)
              {source: "streaming:/99999/Graduation",
                parentElement: videoWrapper});        
      if (intID == 3)
              {source: "streaming:/99999/Bachelors",parentElement: videoWrapper});        
      if (intID == 4)
              {source: "streaming:/99999/Wedding",parentElement: videoWrapper});          
      if (intID == 5)
              {source: "streaming:/99999/BabyShower",
                parentElement: videoWrapper});                    

What I have done above is a very simple tweak from the code that we got after we uploaded the zip file. I created an argument for the method, CreteSilverlight called intID. The value of intID is passed by the showVideo function. Again, the argument for the showVideo function is being passed by the webpage which shows the video names with hyperlinks. So, if you want to add a new video, all you have to do is add another row in the web page with a different argument to the ShowVideo function.  Also, you will have to add another if statement inside the CreateSilverlight function which actually initiates the video streaming.

View Entire Article

User Comments

Title: real-time broadcasting   
Name: Jassim
Date: 2007-09-09 3:01:41 PM
what about real-time broadcasting?

Community Advice: ASP | SQL | XML | Regular Expressions | Windows

©Copyright 1998-2018  |  Page Processed at 2018-04-20 3:48:11 PM  AspAlliance Recent Articles RSS Feed
About ASPAlliance | Newsgroups | Advertise | Authors | Email Lists | Feedback | Link To Us | Privacy | Search