skeleton done
This commit is contained in:
45
src/templates/base.html
Normal file
45
src/templates/base.html
Normal file
@@ -0,0 +1,45 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<!-- Required meta tags -->
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<!-- Bootstrap CSS -->
|
||||
<link rel="stylesheet" href="https://bootswatch.com/4/darkly/bootstrap.min.css">
|
||||
<title>My Store Web App</title>
|
||||
</head>
|
||||
<body>
|
||||
<nav class="navbar navbar-expand-lg navbar-dark bg-primary mb-3">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="{{ url_for('index') }}">UnstableVortex CAFF Store</a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
|
||||
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||
<ul class="navbar-nav mr-auto">
|
||||
<li class="nav-item active">
|
||||
<a class="nav-link" href="{{ url_for('index') }}">Home</a>
|
||||
</li>
|
||||
<li class="nav-item active">
|
||||
<a class="nav-link" href="{{ url_for('profile') }}">Profile</a>
|
||||
</li>
|
||||
<li class="nav-item active">
|
||||
<a class="nav-link" href="{{ url_for('login') }}">Login</a>
|
||||
</li>
|
||||
<li class="nav-item active">
|
||||
<a class="nav-link" href="{{ url_for('register') }}">Register</a>
|
||||
</li>
|
||||
</ul>
|
||||
<form class="form-inline my-2 my-lg-0">
|
||||
<input class="form-control mr-sm-2" type="text" placeholder="Search">
|
||||
<button class="btn btn-secondary my-2 my-sm-0" type="submit">Search</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<div class="container px-2">
|
||||
{% block content %}{% endblock %}
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
25
src/templates/index.html
Normal file
25
src/templates/index.html
Normal file
@@ -0,0 +1,25 @@
|
||||
{% extends 'webapp/base.html' %}
|
||||
{% block content %}
|
||||
{% if images %}
|
||||
<div class="row mx-2">
|
||||
{% for image in images %}
|
||||
<div class="col-12 col-sm-6 col-md-4 px-2 mb-3">
|
||||
<div class="card">
|
||||
<a href="{{ url_for('item', id=image.id) }}">
|
||||
<img src="{{image.preview}}" class="img-fluid" style="padding: 30px" alt="{{image.caption}}">
|
||||
</a>
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">{{image.creator}}</h5>
|
||||
<p class="card-text">
|
||||
{{image.caption}}
|
||||
</p>
|
||||
<a href="{{ url_for('download', id=image.id) }}" class="btn btn-primary" target="_blank">Download Now</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<p>No images available.</p>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
73
src/templates/item.html
Normal file
73
src/templates/item.html
Normal file
@@ -0,0 +1,73 @@
|
||||
{% extends 'webapp/base.html' %}
|
||||
{% block content %}
|
||||
<div class="card mb-3">
|
||||
<h3 class="card-header">Animation by {{ image.creator }}</h3>
|
||||
<!-- <div class="card-body">-->
|
||||
<!-- <h5 class="card-title">Special title treatment</h5>-->
|
||||
<!-- <h6 class="card-subtitle text-muted">Support card subtitle</h6>-->
|
||||
<!-- </div>-->
|
||||
<img src="{{image.preview}}" class="card-img" style="padding: 30px" alt="{{image.caption}}">
|
||||
<div class="card-body">
|
||||
<p class="card-text">{{ image.caption }}</p>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<table class="table table-responsive">
|
||||
<tbody>
|
||||
<tr class="table-active">
|
||||
<th scope="row">Creator</th>
|
||||
<td>{{ image.creator }}</td>
|
||||
</tr>
|
||||
<tr class="table-active">
|
||||
<th scope="row">Number of images</th>
|
||||
<td>{{ image.num_anim }}</td>
|
||||
</tr>
|
||||
<tr class="table-active">
|
||||
<th scope="row">Creation date</th>
|
||||
<td>{{ image.creation_date }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<a href="{{ url_for('download', id=image.id) }}" class="card-link" target="_blank">Download</a>
|
||||
</div>
|
||||
<div class="card-footer text-muted">
|
||||
Uploaded: {{ image.upload_date }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if current_user.is_authenticated %}
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<form>
|
||||
<fieldset>
|
||||
<legend>Write a comment</legend>
|
||||
<div class="form-group">
|
||||
<textarea class="form-control" id="commentTextarea" rows="3" ,
|
||||
placeholder="Type your comment here"></textarea>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary">Submit</button>
|
||||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if comments %}
|
||||
{% for comment in comments %}
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h4 class="card-title">{{ comment.user }}</h4>
|
||||
<h6 class="card-subtitle mb-2 text-muted">{{ comment.date }}</h6>
|
||||
<p class="card-text">{{ comment.text }}</p>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<p>No comments yet.</p>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
17
src/templates/login.html
Normal file
17
src/templates/login.html
Normal file
@@ -0,0 +1,17 @@
|
||||
{% extends 'webapp/base.html' %}
|
||||
|
||||
{% block content %}
|
||||
<div class="jumbotron">
|
||||
<h1 class="display-3">Please sign in</h1>
|
||||
<br>
|
||||
<form action="" method="post">
|
||||
<input size="50" type="text" class="form-control" placeholder="Username" name="username" value="{{request.form.username}}"></br></br>
|
||||
<input type="password" class="form-control" placeholder="Password" name="password" value="{{request.form.password}}"></br></br>
|
||||
<input class="btn btn-primary" type="submit" value="Sign In"></br></br>
|
||||
</form>
|
||||
<p>Dont't have an account? <a class="bottom" href="{{ url_for('register') }}"> Sign Up here</a></p>
|
||||
{% if error %}
|
||||
<p class="error"><strong>Error:</strong> {{ error }}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endblock %}
|
||||
37
src/templates/profile.html
Normal file
37
src/templates/profile.html
Normal file
@@ -0,0 +1,37 @@
|
||||
{% extends 'webapp/base.html' %}
|
||||
|
||||
{% block content %}
|
||||
{% if current_user.is_authenticated %}
|
||||
<div>
|
||||
<h1>Welcome {{ user.username }}</h1>
|
||||
<a href="upload.html" class="btn btn-primary">Upload</a>
|
||||
</div>
|
||||
<br>
|
||||
{% if images %}
|
||||
<div class="row mx-2">
|
||||
{% for image in images %}
|
||||
<div class="col-12 col-sm-6 col-md-4 px-2 mb-3">
|
||||
<div class="card">
|
||||
<a href="{{ url_for('item', id=image.id) }}">
|
||||
<img src="{{image.preview}}" class="img-fluid" style="padding: 30px" alt="{{image.caption}}">
|
||||
</a>
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">{{image.creator}}</h5>
|
||||
<p class="card-text">
|
||||
{{image.caption}}
|
||||
</p>
|
||||
<a href="{{ url_for('download', id=image.id) }}" class="btn btn-primary" target="_blank">Download</a>
|
||||
<a href="{{ url_for('delete', id=image.id) }}" class="btn btn-primary" target="_blank">Delete</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
{% else %}
|
||||
<p>No images available.</p>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<p><a href="{{ url_for('login') }}">Log in</a> to view your profile.</p>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
18
src/templates/register.html
Normal file
18
src/templates/register.html
Normal file
@@ -0,0 +1,18 @@
|
||||
{% extends 'webapp/base.html' %}
|
||||
|
||||
{% block content %}
|
||||
<div class="jumbotron">
|
||||
<h1 class="display-3">Please sign up</h1>
|
||||
<br>
|
||||
<form action="" method="post">
|
||||
<input type="text" class="form-control" placeholder="Username" name="username" value="{{request.form.username}}"></br></br>
|
||||
<input type="password" class="form-control" placeholder="Password" name="password" value="{{request.form.password}}"></br></br>
|
||||
<input type="email" class="form-control" placeholder="Email" name="email" value="{{request.form.email}}"></br></br>
|
||||
<input class="btn btn-primary" type="submit" value="Sign Up"></br></br>
|
||||
</form>
|
||||
<p class="bottom">Already have an account? <a class="bottom" href="{{ url_for('login') }}"> Sign In here</a></p>
|
||||
{% if error %}
|
||||
<p class="error"><strong>Error:</strong> {{ error }}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endblock %}
|
||||
16
src/templates/upload.html
Normal file
16
src/templates/upload.html
Normal file
@@ -0,0 +1,16 @@
|
||||
{% extends 'webapp/base.html' %}
|
||||
|
||||
{% block content %}
|
||||
{% if current_user.is_authenticated %}
|
||||
<div class="jumbotron">
|
||||
<h1 class="display-3">File Upload</h1>
|
||||
<br>
|
||||
<form method="POST" action="" enctype="multipart/form-data">
|
||||
<p><input type="file" name="file" accept=".caff"></p>
|
||||
<p><input type="submit" value="Submit" class="btn btn-primary"></p>
|
||||
</form>
|
||||
</div>
|
||||
{% else %}
|
||||
<p><a href="{{ url_for('login') }}">Log in</a> to upload an animation.</p>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user