<script src="../server.js"></script><h1 class="text-center">Videos</h1>
							 | 
						|
								
							 | 
						|
								<div class="row">
							 | 
						|
								    <center><h1>Videos</h1></center>
							 | 
						|
								</div>
							 | 
						|
								
							 | 
						|
								<input id="videoFilter" class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
							 | 
						|
								<br>
							 | 
						|
								
							 | 
						|
								<div class="row">
							 | 
						|
								    {for video in videos}
							 | 
						|
								    <div class="col-md-4 videoElement">
							 | 
						|
								        <div class="card">
							 | 
						|
								            <div class="card-header">
							 | 
						|
								                <h2>{video.name}</h2>
							 | 
						|
								            </div>
							 | 
						|
								            <div class="card-body">
							 | 
						|
								                <a href="/watch?v={video.name}" class="" role="button" aria-pressed="true">
							 | 
						|
								                    <img src="/icon?v={video.name}" alt="Icon for {video.name}" width=100%/>
							 | 
						|
								                </a>
							 | 
						|
								            </div>
							 | 
						|
								        </div>
							 | 
						|
								    </div>
							 | 
						|
								    {/for}
							 | 
						|
								</div>
							 | 
						|
								
							 | 
						|
								
							 | 
						|
								<script>
							 | 
						|
								    function filterTable()
							 | 
						|
								    {
							 | 
						|
								        var input = $("input#videoFilter").val().toLowerCase();
							 | 
						|
								
							 | 
						|
								        $(".videoElement").css({"display": "none"});
							 | 
						|
								
							 | 
						|
								        $(".videoElement").each(function(index)
							 | 
						|
								        {
							 | 
						|
								            if($(this).text().toLowerCase().includes(input))
							 | 
						|
								            {
							 | 
						|
								                $(this).toggle(true);
							 | 
						|
								                //$(this).css({"display": "none"});
							 | 
						|
								            }
							 | 
						|
								        });
							 | 
						|
								
							 | 
						|
								        if(input.toString().split(" ").join("") === "")
							 | 
						|
								        {
							 | 
						|
								            $(".videoElement").toggle(true);
							 | 
						|
								        }
							 | 
						|
								    }
							 | 
						|
								
							 | 
						|
								    $(document).ready(function()
							 | 
						|
								    {
							 | 
						|
								        $("input#videoFilter").bind("keyup", filterTable);
							 | 
						|
								    });
							 | 
						|
								</script>
							 |