locked
using a property or and an event of a html control as audio html in c# RRS feed

  • Question

  • User-458598543 posted

    hello,

    for my project, i want to used html audio and i would used the property-event "ended" or "onended" html audio in a codebehind page c#.

    thanks for your contribution,

    marc-antoine

    Tuesday, August 4, 2020 4:15 PM

Answers

  • User-1330468790 posted

    Hi Rednuts72,

     

    How would you like using audio with the property-event "onended"? 

     

    I have previously constructed a webforms demo for this topic. The demo will run for automatically playing the next song when the current song is ended.

    You might want to refer to this:  Onended Event in <Audio> control

    The key is to manually trigger the postback and you might need to pass values to server side for your problem if it is necessary.

    However, the codes in above link are written in VB.

    The C# version codes is as below: 

    .aspx

    <form id="form1" runat="server">
            <div>
                <asp:DropDownList ID="lbAllSongs" runat="server" AutoPostBack="true"></asp:DropDownList> <asp:Label ID="lblSelectedSong" runat="server"></asp:Label>
    
                <br />
                <audio id="audioPlayer" autoplay="true" src="<%=SongToPlay %>" controls="true" onended="audioPlayerOnEnded()">Your browser does not support the
                <code>audio</code> element.</audio>
                <input type="button" id="activeAutoPlayBtn" value="Start Auto Play" onclick="autoPlay()" />
                <br />
                
    
            </div>
        </form>

    Javascript:

    <script type="text/javascript">
            function audioPlayerOnEnded() {
                javascript: __doPostBack('audioPlayer', '');
            }
    
            function autoPlay() {
                var audio = document.getElementById("audioPlayer");
                console.log(audio);
                audio.play();
            }
    
        </script>

    Code behind:

    public string SongToPlay;
    
            protected void Page_Load(object sender, System.EventArgs e)
            {
                if (!IsPostBack)
                {
                    string pathLocal;
                    string pathSongs;
    
                    // Get current path
                    pathLocal = HttpContext.Current.Server.MapPath(HttpContext.Current.Request.ServerVariables["PATH"]);
                    pathSongs = pathLocal + @"\Songs";
    
                    string MyFile, MyPath;
                    MyPath = pathSongs;   // Set Folder location for songs
                    MyFile = FileSystem.Dir(pathSongs + @"\*.mp3");
    
                    while (!(MyFile is null))   // Start the loop.
                    {
                        // Use bitwise comparison to make sure MyName is a directory.
                        lbAllSongs.Items.Add(MyFile);
                        MyFile = FileSystem.Dir();   // Get next entry.
                    }
    
                    lbAllSongs.SelectedIndex = 0; // Sets first song as default 
    
                    SongToPlay = "Songs/" + lbAllSongs.SelectedItem.Text;
                    
                }
                else
                {
                    if(Request.Form["__EVENTTARGET"] == "audioPlayer")
                    {
                        audioPlayerOnEnded();
                    }
                    else
                    {
                        lblSelectedSong.Text = lbAllSongs.SelectedItem.Text;
                        SongToPlay = "Songs/" + lbAllSongs.SelectedItem.Text;
                    }
                   
                }
    
                
            } 
    
            protected void btnSelectSong_Click(object Source, EventArgs E)
            {
            }
    
            protected void audioPlayerOnEnded()
            {
                int nextIndex = findNextIndex();
                
                lbAllSongs.SelectedIndex = nextIndex;
                lblSelectedSong.Text = lbAllSongs.SelectedItem.Text;
                SongToPlay = "Songs/" + lbAllSongs.SelectedItem.Text;
    
    
    
    
            }
    
            
    
    
            private int findNextIndex()
            {
                int current = lbAllSongs.SelectedIndex;
                int nextIndex;
                if(current+1 > lbAllSongs.Items.Count - 1)
                {
                    nextIndex = 0;
                }
                else
                {
                    nextIndex = current + 1;
                }
    
                return nextIndex;
            }
    

     The result is the same:

     

    Hope this can help you.

    Best regards,

    Sean

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, August 5, 2020 5:44 AM

All replies

  • User-1330468790 posted

    Hi Rednuts72,

     

    How would you like using audio with the property-event "onended"? 

     

    I have previously constructed a webforms demo for this topic. The demo will run for automatically playing the next song when the current song is ended.

    You might want to refer to this:  Onended Event in <Audio> control

    The key is to manually trigger the postback and you might need to pass values to server side for your problem if it is necessary.

    However, the codes in above link are written in VB.

    The C# version codes is as below: 

    .aspx

    <form id="form1" runat="server">
            <div>
                <asp:DropDownList ID="lbAllSongs" runat="server" AutoPostBack="true"></asp:DropDownList> <asp:Label ID="lblSelectedSong" runat="server"></asp:Label>
    
                <br />
                <audio id="audioPlayer" autoplay="true" src="<%=SongToPlay %>" controls="true" onended="audioPlayerOnEnded()">Your browser does not support the
                <code>audio</code> element.</audio>
                <input type="button" id="activeAutoPlayBtn" value="Start Auto Play" onclick="autoPlay()" />
                <br />
                
    
            </div>
        </form>

    Javascript:

    <script type="text/javascript">
            function audioPlayerOnEnded() {
                javascript: __doPostBack('audioPlayer', '');
            }
    
            function autoPlay() {
                var audio = document.getElementById("audioPlayer");
                console.log(audio);
                audio.play();
            }
    
        </script>

    Code behind:

    public string SongToPlay;
    
            protected void Page_Load(object sender, System.EventArgs e)
            {
                if (!IsPostBack)
                {
                    string pathLocal;
                    string pathSongs;
    
                    // Get current path
                    pathLocal = HttpContext.Current.Server.MapPath(HttpContext.Current.Request.ServerVariables["PATH"]);
                    pathSongs = pathLocal + @"\Songs";
    
                    string MyFile, MyPath;
                    MyPath = pathSongs;   // Set Folder location for songs
                    MyFile = FileSystem.Dir(pathSongs + @"\*.mp3");
    
                    while (!(MyFile is null))   // Start the loop.
                    {
                        // Use bitwise comparison to make sure MyName is a directory.
                        lbAllSongs.Items.Add(MyFile);
                        MyFile = FileSystem.Dir();   // Get next entry.
                    }
    
                    lbAllSongs.SelectedIndex = 0; // Sets first song as default 
    
                    SongToPlay = "Songs/" + lbAllSongs.SelectedItem.Text;
                    
                }
                else
                {
                    if(Request.Form["__EVENTTARGET"] == "audioPlayer")
                    {
                        audioPlayerOnEnded();
                    }
                    else
                    {
                        lblSelectedSong.Text = lbAllSongs.SelectedItem.Text;
                        SongToPlay = "Songs/" + lbAllSongs.SelectedItem.Text;
                    }
                   
                }
    
                
            } 
    
            protected void btnSelectSong_Click(object Source, EventArgs E)
            {
            }
    
            protected void audioPlayerOnEnded()
            {
                int nextIndex = findNextIndex();
                
                lbAllSongs.SelectedIndex = nextIndex;
                lblSelectedSong.Text = lbAllSongs.SelectedItem.Text;
                SongToPlay = "Songs/" + lbAllSongs.SelectedItem.Text;
    
    
    
    
            }
    
            
    
    
            private int findNextIndex()
            {
                int current = lbAllSongs.SelectedIndex;
                int nextIndex;
                if(current+1 > lbAllSongs.Items.Count - 1)
                {
                    nextIndex = 0;
                }
                else
                {
                    nextIndex = current + 1;
                }
    
                return nextIndex;
            }
    

     The result is the same:

     

    Hope this can help you.

    Best regards,

    Sean

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, August 5, 2020 5:44 AM
  • User-458598543 posted

    hello, finally i used the basis of your program and i develop the audio playlist player with the two langages as javascript and c#.

    Thursday, August 6, 2020 9:06 AM