|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<title>Select Video - Sign Language Boundary Annotation Tool</title> |
|
<style> |
|
body { |
|
background: #0e1117; |
|
color: white; |
|
font-family: sans-serif; |
|
margin: 0; |
|
padding: 20px; |
|
} |
|
.container { |
|
max-width: 800px; |
|
margin: 0 auto; |
|
text-align: center; |
|
} |
|
.video-list { |
|
list-style: none; |
|
padding: 0; |
|
} |
|
.video-list li { |
|
margin: 10px 0; |
|
} |
|
.video-link { |
|
text-decoration: none; |
|
color: #4CAF50; |
|
font-size: 1.2em; |
|
} |
|
.video-link:hover { |
|
color: #81c784; |
|
} |
|
.user-info { |
|
background: #262730; |
|
padding: 10px; |
|
border-radius: 5px; |
|
margin: 10px 0; |
|
text-align: right; |
|
} |
|
.logout-button { |
|
background: #f44336; |
|
color: white; |
|
border: none; |
|
padding: 5px 10px; |
|
border-radius: 3px; |
|
cursor: pointer; |
|
margin-left: 10px; |
|
} |
|
</style> |
|
</head> |
|
<body> |
|
<div class="container"> |
|
{% if user %} |
|
<div class="user-info"> |
|
Logged in as: {{ user.name }} |
|
<a href="{{ url_for('logout') }}"><button class="logout-button">Logout</button></a> |
|
</div> |
|
{% endif %} |
|
<h1>Select a Video</h1> |
|
<ul class="video-list"> |
|
{% for vid in video_ids %} |
|
<li><a class="video-link" href="{{ url_for('player', video_id=vid) }}">{{ vid }}</a></li> |
|
{% endfor %} |
|
</ul> |
|
</div> |
|
</body> |
|
</html> |