Play youTube Video in asp.net

on

One day one of my colleagues (friend) asked me how to play YouTube video in website, I gave him my old code reference to my blog to read it, but he was looking for something new. He want to play his video in the same page with popup window html.
I helped him by giving the below code, I hope the same will you out.
.aspx code:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="videoPlayer.aspx.cs" Inherits="videoPlayer" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
     <style type="text/css">
        .myVideoPlayer
        {
            background-color: transparent;
            width:560px;
            height:315px;
            padding: 5px;
            text-align: center;
            z-index: 5;
        }
       .videoBackground
        {
            background-color: Gray;
            filter: alpha(opacity=70);
            opacity: 0.7;
        }
    </style>
    <script type="text/javascript">
        function PlayVideo(myEmbedCode) {
            document.getElementById("myPlayerBG").style.display = "block";
            document.getElementById("myPlayer").innerHTML = "";
        }
        function CloseVideo() {
            document.getElementById("myPlayerBG").style.display = "none";
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
   
    <fieldset style="width:450px; height:100px;">
    <legend>Upload Video</legend>
    <table>
    <tr><td>Name</td><td><asp:TextBox ID="txtName" runat="server"></asp:TextBox></td></tr>
    <tr><td>URL</td><td><asp:TextBox ID="txtyouTubeURL" runat="server"></asp:TextBox></td></tr>
    <tr><td>Image</td><td><asp:FileUpload ID="fuImage" runat="server" /></td></tr>
    <tr><td> </td><td><asp:Button ID="bntnUpload" runat="server" Text="Upload" OnClick="UploadVideo" /></td></tr>
    </table>
    <asp:LinkButton ID="lnkViewVideo" runat="server" Text="View Video" OnClick="ViewVideo"></asp:LinkButton>
    </fieldset>

    <asp:DataList ID="dlVideoList" runat="server" RepeatColumns="2" RepeatDirection="Horizontal">
    <ItemTemplate><%#Eval("VideoName")%>
    <a href="#" id="aVideo" onclick="javascript:PlayVideo('<%#Eval("EmbedCode") %>');">
    <img src='<%#Eval("VideoImage") %>' width="50" alt='<%#Eval("VideoName") %>' height="50" />
    </a>
    </ItemTemplate>
    </asp:DataList>
    <asp:Literal ID="ltMessage" runat="server"></asp:Literal>
    </div>
    <div class="videoBackground" id="myPlayerBG" style="display:none;width:570px; height:325px; ">
    <div id="myPlayer" class="myVideoPlayer"></div>
    <div style="text-align:center;height:10px;">
    <a href="#" onclick="javascript:CloseVideo();">Close</a>
    </div>
    </div>
    </form>
</body>
</html>

.aspx.cs code:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;

public partial class videoPlayer : System.Web.UI.Page
{
    SqlConnection dbCon = new SqlConnection(System.Configuration.ConfigurationManager.ConnectionStrings["myConnectionString"].ToString());
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {

        }
    }

    protected void UploadVideo(object sender, EventArgs e)
    {
        string query = "INSERT INTO VideoPlayer (EmbedCode, videoURL, videoName, videoImage) VALUES (@EmbedCode, @videoURL, @videoName, @videoImage)";
        SqlCommand cmd = new SqlCommand(query, dbCon);

        string embedCode = SplitYouTubeURL(txtyouTubeURL.Text.Trim());
        string imgFileName = fuImage.FileName;
        fuImage.SaveAs(Server.MapPath("~/upload/MyVideo/" + imgFileName));

        cmd.Parameters.AddWithValue("@EmbedCode", embedCode);
        cmd.Parameters.AddWithValue("@videoURL", txtyouTubeURL.Text.Trim());
        cmd.Parameters.AddWithValue("@videoName", txtName.Text.Trim());
        cmd.Parameters.AddWithValue("@videoImage", imgFileName);
        dbCon.Open();
        cmd.ExecuteNonQuery();
        cmd.Dispose();
        dbCon.Close();
        ltMessage.Text = "video uploaded successfully!";
    }

    protected void ViewVideo(object sender, EventArgs e)
    {
        dlVideoList.DataSource = BindVideo();
        dlVideoList.DataBind();
    }

    protected DataTable BindVideo()
    {
        string query = "SELECT videoName, EmbedCode, './Upload/MyVideo/'+videoImage as videoImage FROM VideoPlayer";
        SqlCommand cmd = new SqlCommand(query, dbCon);
        dbCon.Open();
        SqlDataAdapter da = new SqlDataAdapter(cmd);
        DataTable dt = new DataTable();
        da.Fill(dt);

        return dt;
    }

    protected string SplitYouTubeURL(string videoURL)
    {
        string embedCode = string.Empty;

        //string splitURL = videoURL;
        if (videoURL.Contains("embed"))
        {
            String[] splitURL = videoURL.Split('/');
            if (splitURL.Length == 3)
            {
                embedCode = splitURL[2].ToString();
            }
        }
        if (videoURL.Contains("watch"))
        {
            String[] splitURL = videoURL.Split('=');
            if (splitURL.Length == 2)
            {
                embedCode = splitURL[1].ToString();
            }
        }
        return embedCode;
    }
}

Here is Table Script:
CREATE TABLE VideoPlayer (vId int identity(1,1), EmbedCode varchar(50), videoURL varchar(100),videoName varchar(100),videoImage varchar(100), uploadDate Date DEFAULT GETDATE())

Cheers,

Ved Pathak

Comments

Post a Comment