選択できるのは25トピックまでです。
トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。
68 行
1.8 KiB
68 行
1.8 KiB
<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 private}
|
|
<div class="col-md-3 videoElement p-2">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h4>{video.name}</h4>
|
|
</div>
|
|
<div class="card-body w-100">
|
|
<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}
|
|
{for video in public}
|
|
<div class="col-md-3 videoElement">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h4>{video.name}</h4>
|
|
</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>
|