Skip to content Skip to navigation

OpenStax-CNX

You are here: Home » Content » sagartesting

Navigation

Recently Viewed

This feature requires Javascript to be enabled.
 

sagartesting

Module by: sagar markal. E-mail the author

Summary: testing

Developing a site such as the YouTube

asp.net

Table 1
this article examines: this article uses the following technologies:
       registering video files in the database;       administration and authentication of users;       working with ajax;       visualization of videos in the web;       creation of web user control. visual studio 2005, asp.net 2.0, asp.net ajax and c#.

what you think about publishing videos in the web? this is a very interesting idea and that has been achieving great success, or have you never speak of the youtube? if you have never seen it, take a look at www.youtube.com. the youtube is a site where we can publish videos and watch any video that is published there. since it is a site visited in the entire world, the amount of videos is enormous.

is it too difficult to create a site the same as this one? the answer is no! with asp.net 2.0 and sql server 2005 (version 2000 and express will also manage) we will implement, step by step, a site for the publication and the exhibition of videos.

where to store the videos of the site?

since we are talking about a gallery, where several people will be able to publish their videos and also watch them, it will be necessary to store the information about the videos (name of the video, description, author, etc.) in a database.

this is not a problem, but the question that arises following that is: “where we will store the videos that shall be published?” we have two possible alternatives:

         file system: we can store the videos in a folder of the web server where the web site will be published. when the user publishes a video, he will be performing an upload to this folder. and, in the database table, we will store the information of the video and create a field which points to the video stored in the disk;

         data base:a video, as well as an image or a document, is a set of binary data. the modern databases allow the storage of binary data in their tables. in the sql server 2000 we use the image field type and, in the sql server 2005, we use varbinary(max) for the fields where we store binary data.

but and then? which of the two kinds is best? generally, in my articles, i begin already with a practical example, but, before starting, to get hands on, i found it important to raise some advantages and disadvantages of these two kinds of storage so that then we are able to decide which of the two to use.

 

advantages of storing binary files in file system

         it demands less work: through the traditional means, storing and recovering binary data in databases involves a little more work than doing the same in  file system;

         it is easier to generate urls:so that we may gain access to binary data of a database, we need to create another page to recover the data. to this page we transfer the id of the record where the file is, and so the file is recovered from the database. we would have a url similar to this one:

 

http://localhost/webvideos/showvideo.aspx?id=1515.

 

now if we are storing the files in file system, we will have a much simpler url:

 

 http://localhost/webvideos/imagefolder/video.avi.

 

         performance: since the data is being stored in file system of the web server, instead of being stored in the database, the application is gaining access to less data, reducing the demand and avoiding network congestion between the web server and the database.

advantages of storing binary files in the database

         better data management: once the binary data are stored in the database, alongside its metadata (file name, author, description, etc.), the management of this data becomes much easier, mainly in tasks such as: backup; transfer from a server database to another; replication, etc.;

         it strengthens the concept of referential integrity: when we store a binary file in file system and we create a field in the table that points to the path where this file is, we do not have any referential integrity between the file and the record of the table (any user with rights can erase the file). when storing the file in the database, we have this integrity assured;

         greater security: when storing binary data in the database, we do not need to give recording rights to the web user account in the folder where the files would be stored in file system;

         version:when storing binary files in the database, we can create version systems, in which, when we upload a new version of the document, the old version is preserved in a different record.  software such as the sharepoint performs version of the files since they store these in the database.

our option is...

watch that the advantages and disadvantages of each of the options are several. it is necessary to evaluate the scenario before making this decision. in our case, we will decide for storing the videos in the database, since the site will be open to any person and we cannot release the access to these users in a folder of the web server.

we are also making this decision so that we can demonstrate how simple it is to work with binary data in the database when we are using the asp.net 2.0 and sql server 2005. anyway, if you do not want to decide for storing binary data in the database, with a few modifications, you will be able to implement the examples of the article by recording the files in file system.

creating the database

in this example, we will use the sql server 2005, but you can use the sql server 2000 or the express version if you wish. open your sql server and create a new database called “webvideos”. include a new table called“videos”, which shall have the same structure demonstrated in figure 1.

 

Figure 1
Figure 1 (graphics1.jpg)

figure 1. structure of the table videos

 

see that we have a field called videodata of the type varbinary(max). it is in this field that we will store the binary data referring to the video which the user will publish. also, we have a field called mimetype, which will store the type of the video which was published.

as we know, there exist various video formats; we will see how to handle this ahead. as for the field videoid, it was created as identity(1,1). you can check the complete script of creation of the table in listing 1.

 

listing 1. script for the creation of the table videos

use [webvideos]

go

/****** object:  table [dbo].[videos]   

******/

set ansi_nulls on

go

set quoted_identifier on

go

set ansi_padding on

go

create table [dbo].[videos](

  [videoid] [int] identity(1,1) not null,

  [title] [varchar](50)

    collate latin1_general_ci_as not null,

  [filename] [varchar](256)

    collate latin1_general_ci_as not null,

  [description] [varchar](500)

    collate latin1_general_ci_as not null,

  [author] [varchar](50)

    collate latin1_general_ci_as not null,

  [mimetype] [varchar](50)

    collate latin1_general_ci_as not null,

  [videodata] [varbinary](max) not null,

  [dateupload] [datetime] not null,

constraint [pk_videos] primary key clustered

(

  [videoid] asc

)with (ignore_dup_key = off) on [primary]

) on [primary]

 

go

set ansi_padding off

preparing the database to use the asp.net membership

before we begin the web site in the visual studio, we need to decide how we will put the authentication of the users into practice. this is always a delicate decision and that needs to be made at the beginning of the development.

we will decide for using the login controls of the asp.net and, in order to do this, we need to prepare our database so that it contains the tables necessary for the entire control of the membership of the asp.net. for this, execute the aspnet_regsql.exe file, which is in the c:\windows\microsoft.net\framework\v2.0 .50727 directory.

in the second screen of the wizard, select the option configure sql server for application services. in the following screen, point to the webvideos database of the sql server and proceed with the assistant. when finishing, verify the tables created in the webvideos (figure 2).

 

Figure 2
Figure 2 (graphics2.jpg)

figure 2. tables of the application services of the asp.net

 

see that several tables with the aspnet prefix have been created in the database. these tables will be used by the asp.net to perform tasks such as control of the users, roles, access rules, profile etc. we will use these mainly for the process of login of the users thus we will not need to develop anything very complicated. the entire set of features that the asp.net provides through these tables is called application services.

creating the website with ajax

one of the new features for the next articles, starting by this one, is that we will develop the examples using the asp.net ajax. in order to do so, in case it is not yet installed it, it is necessary that you install the ajax in its development environment.

we will not have time to detail the whole installation of the ajax, therefore, i ask you to access the site ajax.asp.net, where you will find the instructions and downloads.

in case you do not wish to use the ajax in the examples, it is enough not to include the ajax controls during the development of the application; everything shall function properly. open the visual studio 2005 and choose the option file>new>website. as figure 3 shows, select the asp.net ajax-enabled web site item; modify the name to “webvideos” and click upon ok.

 

Figure 3
Figure 3 (graphics3.jpg)

figure 3. creating a website with asp.net ajax

 

web.config

done! now that we already have the web site created, we only need to make one small adjustment in the web.config so that the login controls of the asp.net point to the webvideos database. through the solutionexplorer, open the file web.config.

observe that the file is much more extensive than normally; this is due to the ajax which includes several lines of the web.config. therefore, it is very important to not modify any of these configurations; we will only include the necessary configurations for the application services of the asp.net.

with the web.config opened, search for the tag . open a line before this tag and include the configurations of listing 2.

 

listing 2. configuring connectionstring for access to the webvideos

...

<connectionstrings>

  <clear/>

    <add

      name="webvideosconnectionstring"

      connectionstring="data source=(local);

     initial catalog=webvideos;

      integrated security=true"/>

connectionstrings>

...

 

watch that we are simply creating a new connectionstring that points to the database of the application. after that, open a new line, now just below the tag and add the code of listing 3.

 

listing 3. configuring the membershipprovider of the asp.net

...

<authentication mode="forms"/>

<membership

  defaultprovider="aspnetsqlmembershipprovider">

  <providers>

    <clear/>

    <add

      name="aspnetsqlmembershipprovider"

      type="system.web.security.sqlmembershipprovider"

         connectionstringname="webvideosconnectionstring"/>

  providers>

membership>

...

 

in this second part, we are configuring the authentication mode as forms, so that we may use the login controls. and, following, we are configuring aspnetsqlmembershipprovider, which is the provider responsible for the membership of the asp.net.

see that we are pointing to the connectionstring created previously, in order to assure that the data of the membership are stored in webvideos. you may also configure additional information of the membership or configure other functionalities such as roles, webparts or profiles.

size of the file

the asp.net possesses a standard limit in the size of files for upload, which is 4 mb. to modify this limit, modify the value in the web.config, adding the following code after the tag :

 

<httpruntime maxrequestlength="30000" />

 

in the previous code, we are limiting the size of the archive in 30 mb. for our application, these configurations are already enough to assure the creation and the authentication of the users.

creation and authentication of the users

now, we are ready to create the pages responsible for recording new users and authenticating them it the site. right click upon the project and choose the option add new item. choose webform; modify the name to “newuser.aspx” and click upon add.

on the design of this new page we have just created, through the toolbox, section login, drag a createuserwizard. in the smart tag of the control and through the option autoformat, modify the layout to professional.

after that, access the property canceldestinationpageurl and type “~/default.aspx”. still, in the properties, inform “~/videos.aspx” in continuedestinationpageurl. your page shall have to be similar as the one in figure 4.

 

Figure 4
Figure 4 (graphics4.jpg)

figure 4. creating the page newuser.aspx

 

return to the page default.aspx and add a login control. modify the layout to professional and change the property destinationpageurl to “~/videos.aspx”. and, in the properties createusertext and createuserurl, respectively inform “new user” and “~/newuser.aspx”. your page default.aspx shall be like the one in figure 5.

 

Figure 5
Figure 5 (graphics5.jpg)

figure 5. configuring the page default.aspx

 

in order for us to be able to perform a test, create a new page called “videos.aspx” and place any message in it for the time being. with this done, define the page default.aspx as startup page, save, compile and execute your project.

see that the first page that appears is that of login. since we do not have any user in our system, we will create a new one by clicking upon new user. as figure 6 shows, we were redirected to the page of creation of users.

 

Figure 6
Figure 6 (graphics6.jpg)

figure 6. creating a new user

 

inform the data of a new user and click upon create user. a message saying that the account was created successfully will appear; just click upon continue and the page videos.aspx will be opened.

if you to want to check if the user was correctly created in the database webvideos, just open the aspnet_users table. with this, we have ready a system of creation and authentication of users, we can, thus, continue with the development of our application.

 

observation: the creation of the password for the provider of the membership validates some characteristics, such as: size of the password (minimum of seven characters) and must consist of letters, numbers and non alpha-numeric characters.

typed dataset

several techniques exist to create the routines of access and persistence of data. we will decide for the typed dataset of the ado.net, since with it we will gain time and see that the dataset is widely compatible with tables of the database, which contain fields of the type varbinary(max).

right click on the project and choose the option add new item. choose dataset; in name, type “webvideos.xsd” and click upon add. in the message that appears, click upon yes so that the folder app_code is created in the project, being there where the dataset will be created.

cancel the assistant which was initialized. in the server explorer, create a new connection with the webvideos. expand the connection which you have just created and, in the folder tables, drag the table videos to the design of the dataset. observe that the datatable was created with all the fields that we defined (figure 7).

 

Figure 7
Figure 7 (graphics7.jpg)

figure 7. creating dataset webvideos with datatable videos

 

click upon the field videodata and see in the properties that the type of the field is system.byte[]. this is the type corresponding to the varbinary(max) of the sql server 2005. there, that is enough for us to be able to proceed.

publishing a video

let us now create one of the main functions of the website, the publication of the videos. open the page videos.aspx and draw an interface like the one demonstrated in the figure 8.

 

Figure 8
Figure 8 (graphics8.jpg)

figure 8. interface for the publication of videos

 

before i begin to talk about this interface, see that, in figure 8, we have a subtitle for you to better identify the controls which were used and their respective properties. observe that the first control we have is a scriptmanager. this is a control of the ajax and is necessary in all the pages where we will implement ajax. next, we use a loginname which is used simply to display the name of the user logged into the application.

below, we include the most important control of the ajax, the updatepanel. the updatepanel allows asynchronous calls to the server, avoiding the postback of the page. watch that the updatepanel is a container, where we may include other controls.

inside the updatepanel, we include a panel in yellow called “pnlnewvideo”.inside the panel a table was added where we set up a form for the publication of the videos. in the form, we used two textboxes and one fileupload, which will be used for the uploading of the video. still, inside the panel, a button was added, called “btnpublish”.

an important observation is that the fileupload, obligatorily, needs a postback so that the selected file may be sent to the server. therefore, we need to make it so as for the button, although in the updatepanel, performs the postback.

for this, click upon the updatepanel1 and access the property triggers. watch, as figure 9 shows, that in the window of triggers we may configure controls to perform asynchronous calls (asyncpostbacktrigger) or postbacks (postbacktrigger).

 

Figure 9
Figure 9 (graphics9.jpg)

figure 9. creating a postbacktrigger in the updatepanel

 

in our case, we will create a postback trigger for the btnpublish, so that the file selected in the fileupload is sent to the server when we click on the button. apart from the controls we have just seen, the rest is tables and text. configure the properties indicated in the figure and save your page.

we will now include the code needed to perform the publication of the videos. first, in the code of the page videos.aspx, we shall include, in the namespaces region, the following line:

 

using webvideostableadapters;

 

this is the namespace where we have the tableadapter which contains the methods of persistence and access to the data of the table videos. next, return to the interface of the page, double click on the button and add the code in listing 4.

 

listing 4. code for the publication of the videos

protected void btnpublish_click(object sender,

  eventargs e)

{

   if (txttitle.text.trim() == string.empty)

   {

      response.write("

Figure 10
Figure 10 ()
");

  }

   else if (!fileupload1.hasfile)

   {

      response.write("

Figure 11
Figure 11 (graphics11.png)
");

   }

   else

   {

      string extension = system.io.path.getextension(

        fileupload1.filename).tolower();

     string mimetype = "";

     switch (extension)

     {

         case ".avi":

           mimetype = "video/avi";

           break;

         case ".wmv":

           mimetype = "video/x-ms-wmv";

           break;

         default:

           response.write("

Figure 12
Figure 12 (graphics12.png)
");

           break;

      }

      if (mimetype.trim() != string.empty)

      {

         try

         {

            videostableadapter adapter = new

              videostableadapter();

            adapter.insert(txttitle.text,

              fileupload1.filename,

              txtdescription.text, user.identity.name,

              mimetype, fileupload1.filebytes,

              datetime.now);

            response.write("

Figure 13
Figure 13 (graphics13.png)
");

         }

         catch (exception ex)

         {

            response.write("

Figure 14
Figure 14 (graphics14.png)
");

         }

         txttitle.text = "";

         txtdescription.text = "";

   }

 }

}

 

we will now see what this code does. first, observe that we are checking if the title of the video was informed. in case it has not, we are informing (through javascript) in a messagebox, a warning to the user. watch that we are making a very simple validation of the form; you can implement the validation in the manner you think is the best.

after that, through the property hasfile of the fileupload, we can identify if the user has selected a file. in case he has not selected, we are, again, printing a warning message.

in case the user has informed the title and chosen the file, our next step is to identify and to validate the type of this file, using the mimetype. mimetype or internet measured type is a standard of the internet used to classify types and subtypes of files. greater details and a list of the most common types, you may find in the wikipedia: en.wikipedia.org/wiki/mime_type.

mimetype, although not obligatory,is important for a correct classification, and the posterior rendering of the videos, therefore, we must store the correct mimetype of the videos which will be published. the easiest way to identify the mimetype is through the file extension.

through the getextension of the class path, we can recover the extension of a file. in our case, we are doing this with the filename property which loads the name of the selected file in the fileupload.

following, through a switch structure, we validate the possible mimetypes. in this example, we are only checking the video/avi (avi) and video/x-ms-wmv (wmv) types. this means that the application will only accept videos with these extensions. in case you want to include other types of videos, it is enough to include the verification of that extension and to store the correspondent mimetype.

proceeding with the code, in case the user has selected one of the file types supported by the application, we are creating a new instance of the class videotableadapter and calling the insert for the inclusion of the record in the table videos. see that the second last parameter of the method is an array of bytes (bytes[]), where we are passing the property filebytes of the fileupload, which has  the complete binary of the file selected by the user.

and there you are, with this we have the publication routine of the videos ready, remembering that the video will be stored in the table videos, alongside with its additional data. shall we run a test? save, compile and run the application.

in the login screen, inform the user and password that we have registered previously and click upon login. as is shown by figure 10, fill the data of the video and select a video file with an avi or wmv extension.

next, click upon publish. after the conclusion of the publication, you will receive a confirmation message. in order to verify that, take a look at the table videos in the sql server, notice that the video was correctly included.

 

Figure 15
Figure 15 (graphics15.jpg)

figure 10. testing the publication of videos

 

creating a query for the videos

the next step is simple, just list the videos published in a gridview. we will include the new controls in the page videos.aspx itself. for this, take a look at figure 11.

 

Figure 16
Figure 16 (graphics16.jpg)

figure 11. interface for the consultation of the videos in gridview

 

first, add an updatepanel to the cell below of the one in which we have drawn the publication interface. inside the updatepanel, includes an objectdatasource, which you can find in the section data of the toolbox. click upon the task configure data source, in the first screen of the wizard, select the videotableadapter and click upon next. after that, it is enough to click upon finish.

drag a gridview below the objectdatasource. in the tasks of the gridview, in choose data source, choose objectdatasource1. still in the tasks of the gridview, select the option enable selection and click upon edit columns. in the selected fields area, you shall exclude the filename and description columns. in order to complete the configurations of the gridview, through the option autoformat,choose simple.

now we only need to include one code line to update the gridview every time that a new video is published. for this, in the click event of the publish, just below the line txtdescription.text = “”; include the following code line:

 

gridview1.databind();

 

let us run a test? save, compile and run the project. make the login and see, as figure 12 shows, that the description of all the published videos is already appearing. publish a new video and see that it is automatically included in the gridview.

 

Figure 17
Figure 17 (graphics17.jpg)

figure 12. testing the query of the videos

 

customizing tableadapter to recover the video

as we have seen in the beginning of the article, you cannot access a file which is inside the database, as if it was inside the file system. in order to do that, we need to create a page which will receive the video id as parameter and then recapture the file. thus, we will be able to access the video through a url.

first, we need to have a method in the tableadapter which, through the id, returns only the binary file; for that, we must customize the tableadapter for the inclusion of this new method. in the folder app_code, open the dataset webvideos.xsd and, as figure 13 shows, right click over the videostableadapter and choose the option addquery.

 

Figure 18
Figure 18 (graphics18.jpg)

figure 13. including a new query in the tableadapter

 

in the first screen of the wizard, choose the use sql statements option and click upon next. in the following screen, choose select which returns a single value, for we will return only the binaries of the video. in the next screen, type the following select command:

 

select videodata from videos where videoid = @videoid

 

after that, click upon next. in the following screen, inform “selectvideodata” as the name of the method which will be created. click upon next and upon finish. see that in the tableadapter a new method has been created and will be used to recover the binaries of the video from the table videos.

creating the page to return the video

now we need to create a page which will receive the id of the video as a parameter and recover the binaries from the database. right click upon the project and choose the option add new item. select the item web form, type “showvideo.aspx” in name and click upon add.

we do not need to include anything in the interface of this page. go to the page code and modify it so that it becomes like the one demonstrated in listing 5.

 

listing 5. code of the page showvideo.aspx

...

using webvideostableadapters;

 

public partial class showvideo : system.web.ui.page

{

    protected void page_load(object sender,

      eventargs e)

    {

        int videoid = int.parse(

          request.querystring["videoid"]);

        string mimetype = request.querystring[

          "mimetype"];

        videostableadapter adapter = new

          videostableadapter();

        byte[] videodata =

          (byte[])adapter.selectvideodata(videoid);

        if (videodata.length > 0)

        {

            response.contenttype = mimetype;

            response.binarywrite(videodata);

        }

    }

}

 

first, you will have to include a reference to the webvideostableadapters namespace. after that, see that we are using only the page_load, where, through a querystring, we are recovering the two parameters which will be informed in the url: the videoid and the mimetype.

after that, through the selectvideodata which we created in the tableadapter, we are recovering the database file, which will be stored in an object byte[]. to finish, in case the videodata is not empty, through the page.response, we are configuring mimetype and “displaying” the file through the binarywrite.

this page enables access to the videos of the database, through a url. like, for example, the url to access the video which number is 1, would be like this:

 

http://localhost/webvideos/showvideo.aspx?videoid=1&mimetype=video/x-ms-wmv

 

if you wish to run a test, type that url in your browser (in case you have published the video which number is 1, with the wmv extension). what happened? the browser called the windows media player and executed the video.

displaying the videos inside the page

this is a way of recovering the videos of the database, but not the ideal one. the ideal would be to display the videos inside our page videos.aspx, like it is done in the youtube site. unfortunately, the asp.net does not have a control that performs this task; for that, the html itself has some solutions. one of them, and the most used, is the tag <object>.

we will run a simple test. open the page videos.aspx and, in the cell on the right side, which is empty, include a new updatepanel. go to the source of the page and search for the updatepanel3, which we have just finished including. inside it, you will have to insert the code of listing 6.

 

listing 6. displaying video through the object command

...

<asp:updatepanel id="updatepanel3" runat="server">

<contenttemplate>

<object id="player"

  classid="clsid:6bf52a52-394a-11d3-b153-00c04f79faa6">

 <param name="autostart" value="true"> 

  <param name="url"

   value="showvideo.aspx?videoid=1&mimetype=video/x-ms-wmv">

 <param name="rate" value="1">

  <param name="balance" value="0">

  <param name="enabled" value="true">

  <param name="enabledcontextmenu" value="true">

  <param name="fullscreen" value="false">

  <param name="playcount" value="1">

  <param name="volume" value="100">

object>

contenttemplate>

asp:updatepanel>

...

 

see that the tag will use the windows media player itself to display the video inside the page, in the space where we included the updatepanel. observe that we have several parameters which can be configured.

amongst them, the most important one is the parameter url, where we are pointing to the showvideo.aspx page, passing the videoid=1 as parameter. run a test, save, compile and run the project. see that now the video will be displayed inside the page.

creating a webusercontrol to display the video

very well, but how to get the video selected in the gridview to be displayed? customizing a little bit the previous code, we may be able to set up and recover the url according to the record selected in the grid. however, i do not know what you think, but i do not like to have an html code inside an asp.net page. apart from being hard to give maintenance to, it is not a solution which is easily reusable.

a much more graceful solution would be the creation of a webusercontrol, which would be responsible for rendering the html code necessary for the displaying of the video. shall we try? right click over the project and choose the option add new item. choose the item web user control;inform “videoplayer.ascx” in name and click upon add.

we will not include anything in the interface of the control, therefore, just press f7 to go to the code. after that, modify the code so that it becomes just like the one demonstrated in listing 7.

 

listing 7. code of the control videoplayer.ascx

...

using system.text;

 

public partial class videoplayer :

  system.web.ui.usercontrol

{

    private string _url = "";

    public string url

    {

        get { return _url; }

        set { _url = value; }

    }

 

    protected override void render(

      htmltextwriter output)

    {

        stringbuilder sb = new stringbuilder(

          "

          "classid='clsid:6bf52a52-394a-11d3-b153-00c04f79faa6'" +

          "height=300 width=300>");

 

        sb.append(

          "");

        sb.append(

          "");

        sb.append(

          "");

        sb.append(

          "");

        sb.append(

          "");

        sb.append(

          "");

        sb.append(

          "");

        sb.append(

          "");             

        sb.append(

          "");

        sb.append("");             

        output.write(sb.tostring());

    }

}

 

watch that the system.text namespacewas imported, so that the use of the stringbuilder is possible. after that, we are creating an attribute called _url and its respective property called url. observe that we do not need the page_load and we are overloading the render, which is responsible for rendering the control in the page.

inside the render,through a stringbuilder we are setting up a string which corresponds to the html code that we have used previously to display the video. the difference is that, here, the parameter url is not fixed; it will be recovered from the property url. at the end, the output.write needs to be called so that the html is rendered.

save the control and return to the page videos.aspx. erase the html code which was inserted in the previous example, and return to the design of the page. through the solution explorer itself, drag the videoplayer.ascx inside the updatepanel3 (figure 14).

 

Figure 19
Figure 19 (graphics19.jpg)

figure 14. including the videoplayer.ascx in the page videos.aspx

 

having done this, we have to include the code necessary to change the url of the control according to the video which is selected in the gridview. click upon the gridview and access the event selectedindexchanging. now, it is enough to include the code in listing 8.

 

listing 8. event selectedindexchanging of the gridview

protected void gridview1_selectedindexchanging(

  object sender, gridviewselecteventargs e)

{

int videoid = int.parse(gridview1.rows[

  e.newselectedindex].cells[1].text);

      string mimetype = gridview1.rows[

        e.newselectedindex].cells[4].text;

      videoplayer1.url = "showvideo.aspx?videoid=" +

        videoid.tostring() + "&mimetype=" +

        mimetype.trim();

}

 

in this code, we are recovering the id and the mimetype of the video which was selected and, following, setting up the url to access the video, already storing it in the very own property url of the videoplayer1. much better to work like this than with html, don’t you think?

let us run a test. save, compile and run the project. see, as figure 15 shows, that it is enough to click upon the link select of any video, so that it will be displayed in the right side. conduct the test with several videos. another thing you can observe is that, since we are using ajax, there is no postback when we select the video.

 

Figure 20
Figure 20 (graphics20.jpg)

figure 15. testing the displaying of videos with the videoplayer.ascx

 

conclusion

as we have been able to see, it is very simple to create an application to store and visualize videos in the web. we have seen that there is no great difficulty in storing files in the database, especially when we are working with typed datasets and tableadapters.

with the use of the ajax and the web user control, we have also seen how simple it is to create an interface for publication and displaying of videos in the web. however, our application is very far from being a youtube.

i will now list a few functionalities which you may include in this application so that it heeds other needs of a video gallery:

         options of search:our example, lists all the published videos in one gridview, which would be impracticable in a real application, where many videos would be published. we would have that to make available search options so that the user can look for the videos which he desires, by name, date, description, etc. and, also, create queries such as, for example: the ten most seen videos. customizing some methods of the tableadapter, we can easily implement these and other functionalities of search;

         categorization of the videos:a very important option that the site must have is the categorization of the videos. it would be enough to create a table of categories, relate it with the table of videos and request this information at the moment of the publication of the video. a more advanced option would be a process of automatic categorization of the videos, but this would involve complex routines of analysis of the texts title and description, to categorize the videos automatically;

         administrative interface: it would be interesting that the site had an administrative area, where administrator users of the site can log in and modify information to which the final users do not have permission;

         more properties of the videoplayer.ascx:as we have seen, we use the webusercontrol to be able to abstract the use of html in a user control. with this, we gain the possibility of determining the url of the control through a property. we could extend this functionality to other properties of the control such as, for example: width, height, autostart,volume, etc.;

         to not depend on the windows media player: despite us displaying the video in the web, the tag uses the windows media player itself to display the video. this means that the final user needs to have the windows media player installed in his computer. obviously, you can use any other player that you wish, just reference the correspondent classid. a more advanced solution for this problem would be the creation of your own video player, but then, that is another talk.

i hope that this article may have helped you understand all the techniques involved in the development of an application which stores videos in a database and displays them in the web. cheers to all and see you next time.

Content actions

Download module as:

Add module to:

My Favorites (?)

'My Favorites' is a special kind of lens which you can use to bookmark modules and collections. 'My Favorites' can only be seen by you, and collections saved in 'My Favorites' can remember the last module you were on. You need an account to use 'My Favorites'.

| A lens I own (?)

Definition of a lens

Lenses

A lens is a custom view of the content in the repository. You can think of it as a fancy kind of list that will let you see content through the eyes of organizations and people you trust.

What is in a lens?

Lens makers point to materials (modules and collections), creating a guide that includes their own comments and descriptive tags about the content.

Who can create a lens?

Any individual member, a community, or a respected organization.

What are tags? tag icon

Tags are descriptors added by lens makers to help label content, attaching a vocabulary that is meaningful in the context of the lens.

| External bookmarks