Browse Source

Changement du style des formulaires. Le form de login est ajouté automatiquement au rendu.

master
Dark-Storm 8 months ago
parent
commit
2f848501fe
Signed by: Dark-Storm <l.gatin@neuf.fr> GPG Key ID: F61F10FA138E797C

+ 2
- 1
app/forms.py View File

@@ -1,6 +1,6 @@
from flask_login import current_user
from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, BooleanField, TextAreaField, SubmitField
from wtforms import StringField, PasswordField, BooleanField, TextAreaField, SubmitField, FileField
from wtforms.fields.html5 import DateField
from wtforms.validators import ValidationError, DataRequired, Optional, Email, EqualTo
from app.models.users import Member
@@ -48,6 +48,7 @@ class RegistrationForm(FlaskForm):
submit = SubmitField('S\'enregistrer')

class UpdateAccountForm(FlaskForm):
avatar = FileField('Avatar :', validators=[])
email = StringField('Adresse Email :', validators=[Optional(), Email(), validate_email])
password = PasswordField('Mot de passe :', validators=[Optional(), validate_password])
password2 = PasswordField('Répéter le mot de passe', validators=[Optional(), EqualTo('password')])

+ 29
- 22
app/routes.py View File

@@ -5,23 +5,33 @@ from app import app, db
from app.forms import LoginForm, RegistrationForm, UpdateAccountForm
from app.models.users import Member

# Ce truc c'est la vie !
def _render_template(*args, **kwargs):
# TODO: debugguer cette merde : au logout, ça foire
# if current_user.is_authenticated:
# login_form = LoginForm()
# return render_template(*args, **kwargs, login_form=login_form)
# return render_template(*args, **kwargs)
login_form = LoginForm()
return render_template(*args, **kwargs, login_form=login_form)


@app.route('/')
def index():
login_form = LoginForm()
return render_template('index.html', login_form=login_form)
return _render_template('index.html')

@app.route('/login', methods=['GET', 'POST'])
def login():
if request.method == 'GET':
return redirect(url_for('index'))
login_form = LoginForm()
if form.validate_on_submit():
member = Member.query.filter_by(username=form.username.data).first()
if member is None or not member.check_password(form.password.data):
if login_form.validate_on_submit():
member = Member.query.filter_by(username=login_form.username.data).first()
if member is None or not member.check_password(login_form.password.data):
flash('Pseudo ou mot de passe invalide', 'error')
return redirect(request.referrer)
login_user(member, remember=form.remember_me.data)
login_user(member, remember=login_form.remember_me.data)
flash('Connexion réussie', 'info')
return redirect(request.referrer)

@@ -37,43 +47,40 @@ def account():
if not current_user.is_authenticated:
flash('Veuillez vous authentifier', 'warning')
return redirect(url_for('index'))
login_form = LoginForm()
form2 = UpdateAccountForm()
form = UpdateAccountForm()
if request.method == "POST":
if form2.validate_on_submit():
if form.validate_on_submit():
current_user.update(
email = form2.email.data,
password = form2.password.data,
signature = form2.signature.data,
biography = form2.biography.data,
birthday = form2.birthday.data,
receive_newsletter = form2.newsletter.data)
email = form.email.data,
password = form.password.data,
signature = form.signature.data,
biography = form.biography.data,
birthday = form.birthday.data,
receive_newsletter = form.newsletter.data)
db.session.add(current_user)
db.session.commit()
flash('Modifications effectuées', 'ok')
else:
flash('Erreur lors de la modification', 'error')
return render_template('account.html', login_form=login_form, form2=form2)
return _render_template('account.html', form=form)

@app.route('/register', methods=['GET', 'POST'])
def register():
if current_user.is_authenticated:
return redirect(url_for('index'))
login_form = LoginForm()
form2 = RegistrationForm()
if form2.validate_on_submit():
member = Member(form2.username.data, form2.email.data, form2.password.data)
form = RegistrationForm()
if form.validate_on_submit():
member = Member(form.username.data, form.email.data, form.password.data)
member.biography = ""
member.signature = ""
db.session.add(member)
db.session.commit()
flash('Inscription réussie', 'ok')
return redirect(url_for('validation'))
return render_template('register.html', title='Register', login_form=login_form, form2=form2)
return _render_template('register.html', title='Register', form=form)

@app.route('/register/validation/')
def validation():
if current_user.is_authenticated :
return redirect(url_for('index'))
login_form = LoginForm()
return render_template('validation.html', login_form=login_form)
return _render_template('validation.html')

+ 1
- 2
app/static/css/container.css View File

@@ -7,6 +7,7 @@ section {
}

section h1 {
margin-top: 0;
border-bottom: 1px solid #a0a0a0;
font-family: Raleway; font-size: 32px;
font-weight: 200; color: #242424;
@@ -23,5 +24,3 @@ section h1 {
font-family: Raleway; font-size: 20px;
font-weight: 200; color: #242424;
} */



+ 61
- 0
app/static/css/form.css View File

@@ -0,0 +1,61 @@
.form {
min-width: 350px;
margin: 20px auto 0; padding: 20px;
background: #ffffff;
border: 1px solid #dddddd; border-radius: 5px;
}

.form .avatar {
display: inline-block; vertical-align: middle;
border-radius: 100%;
width: 150px; height: 150px;
}
.form input[type="file"] {
display: inline-block; margin-left: 20px;
vertical-align: middle;
}

.form form > div:not(:last-child) {
margin-bottom: 15px;
}

.form form label {
display: inline-block;
margin-bottom: 5px;
}

.form input[type='text'],
.form input[type='email'],
.form input[type='date'],
.form input[type='password'],
.form textarea {
display: block;
width: 100%; padding: 6px 2.5%;
border: 1px solid #abcdef;
}
.form input[type='text']:focus,
.form input[type='email']:focus,
.form input[type='date']:focus,
.form input[type='password']:focus,
.form textarea:focus {
box-shadow: 0 0 4px rgba(0, 102, 255, .9);
}

.form input[type="submit"] {
width: 100%;
background-color: #149641;
border-color: #0e692d;
color: #ffffff;
}
.form input[type="submit"]:hover,
.form input[type="submit"]:focus,
.form input[type="submit"]:active {
background-color: #0f7331;
border-color: #073617;
}

.form form .msgerror {
color: red;
font-weight: 400;
margin-top: 5px;
}

+ 69
- 63
app/templates/account.html View File

@@ -1,71 +1,77 @@
{% extends "base/container.html" %}

{% block content %}
<section class="home-pinned-content flex">
<div id="register">
<h1>Gestion du compte :</h1>
<section class="form" style="width:80%;">
<h1>Gestion du compte :</h1>

<form action="" method="post">
{{ form2.hidden_tag() }}
<form action="" method="post">
{{ form.hidden_tag() }}
<div>
{{ form.avatar.label }}
<div>
{{ form2.email.label }}
{{ form2.email(placeholder=current_user.email) }}
{% for error in form2.email.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
<img class="avatar" src="{{ url_for('static', filename= 'images/3864.png') }}" />
{{ form.avatar }}
</div>
<div>
{{ form2.password.label }}
{{ form2.password(placeholder='************') }}
{% for error in form2.password.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.password2.label }}
{{ form2.password2(placeholder='************') }}
{% for error in form2.password2.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.birthday.label }}
{{ form2.birthday(value=current_user.birthday) }}
{% for error in form2.birthday.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.signature.label }}
<textarea id="{{ form2.signature.name }}" name="{{ form2.signature.name }}">{{ current_user.signature }}</textarea>
{% for error in form2.signature.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.biography.label }}
<textarea id="{{ form2.biography.name }}" name="{{ form2.biography.name }}">{{ current_user.biography }}</textarea>
{% for error in form2.biography.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.newsletter.label }}
{{ form2.newsletter() }}
<div style="font-size:80%;color:rgba(0,0,0,.5)">{{ form2.newsletter.description }}</div>
{% for error in form2.newsletter.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.old_password.label }}
{{ form2.old_password(placeholder='************') }}
{% for error in form2.old_password.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>{{ form2.submit(class_="bg-green") }}</div>
</form>
</div>
</div>
<div>
{{ form.email.label }}
{{ form.email(placeholder=current_user.email) }}
{% for error in form.email.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.password.label }}
{{ form.password(placeholder='************') }}
{% for error in form.password.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.password2.label }}
{{ form.password2(placeholder='************') }}
{% for error in form.password2.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.birthday.label }}
{{ form.birthday(value=current_user.birthday) }}
{% for error in form.birthday.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.signature.label }}
<textarea id="{{ form.signature.name }}" name="{{ form.signature.name }}">{{ current_user.signature }}</textarea>
{% for error in form.signature.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.biography.label }}
<textarea id="{{ form.biography.name }}" name="{{ form.biography.name }}">{{ current_user.biography }}</textarea>
{% for error in form.biography.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.newsletter.label }}
{{ form.newsletter() }}
<div style="font-size:80%;color:rgba(0,0,0,.5)">{{ form.newsletter.description }}</div>
{% for error in form.newsletter.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.old_password.label }}
{{ form.old_password(placeholder='************') }}
{% for error in form.old_password.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>{{ form.submit(class_="bg-green") }}</div>
</form>
</section>
{% endblock %}

+ 1
- 0
app/templates/base/head.html View File

@@ -8,6 +8,7 @@
<link rel="stylesheet" media="all and (min-width: 700px)" type="text/css" href={{url_for('static', filename = 'css/navbar.css')}}>
<link rel="stylesheet" media="all and (min-width: 700px)" type="text/css" href={{url_for('static', filename = 'css/header.css')}}>
<link rel="stylesheet" media="all and (min-width: 700px)" type="text/css" href={{url_for('static', filename = 'css/container.css')}}>
<link rel="stylesheet" media="all and (min-width: 700px)" type="text/css" href={{url_for('static', filename = 'css/form.css')}}>
<link rel="stylesheet" media="all and (min-width: 700px)" type="text/css" href={{url_for('static', filename = 'css/footer.css')}}>
<link rel="stylesheet" media="all and (min-width: 700px)" type="text/css" href={{url_for('static', filename = 'css/flash.css')}}>
<link rel="stylesheet" media="all and (min-width: 700px)" type="text/css" href={{url_for('static', filename = 'css/responsive.css')}}>

+ 9
- 9
app/templates/login.html View File

@@ -3,23 +3,23 @@
{% block content %}
<h1>Sign In</h1>
<form action="" method="post">
{{ form.hidden_tag() }}
{{ login_form.hidden_tag() }}
<p>
{{ form.username.label }}<br>
{{ form.username(size=32) }}<br>
{% for error in form.username.errors %}
{{ login_form.username.label }}<br>
{{ login_form.username(size=32) }}<br>
{% for error in login_form.username.errors %}
<span style="color: red;">[{{ error }}]</span>
{% endfor %}
</p>
<p>
{{ form.password.label }}<br>
{{ form.password(size=32) }}<br>
{% for error in form.password.errors %}
{{ login_form.password.label }}<br>
{{ login_form.password(size=32) }}<br>
{% for error in login_form.password.errors %}
<span style="color: red;">[{{ error }}]</span>
{% endfor %}
</p>
<p>{{ form.remember_me() }} {{ form.remember_me.label }}</p>
<p>{{ form.submit() }}</p>
<p>{{ login_form.remember_me() }} {{ login_form.remember_me.label }}</p>
<p>{{ login_form.submit() }}</p>
</form>
<p>New User? <a href="{{ url_for('register') }}">Click to Register!</a></p>
{% endblock %}

+ 50
- 51
app/templates/register.html View File

@@ -1,57 +1,56 @@
{% extends "base/container.html" %}

{% block content %}
<section class="home-pinned-content flex">
<div id="register">
<h1>Inscription :</h1>
<section class="form" style="width:40%;">
<h1>Inscription :</h1>

<form action="" method="post">
{{ form2.hidden_tag() }}
<div>
{{ form2.username.label }}
{{ form2.username() }}
{% for error in form2.username.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.email.label }}
{{ form2.email() }}
{% for error in form2.email.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.password.label }}
{{ form2.password() }}
{% for error in form2.password.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.password2.label }}
{{ form2.password2() }}
{% for error in form2.password2.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.guidelines.label }}
{{ form2.guidelines() }}
{% for error in form2.guidelines.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form2.newsletter.label }}
{{ form2.newsletter() }}
<div style="font-size:80%;color:rgba(0,0,0,.5)">{{ form2.newsletter.description }}</div>
{% for error in form2.newsletter.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>{{ form2.submit(class_="bg-green") }}</div>
</form>
</div>
<form action="" method="post">
{{ form.hidden_tag() }}
<div>
{{ form.username.label }}
{{ form.username() }}
{% for error in form.username.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.email.label }}
{{ form.email() }}
{% for error in form.email.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.password.label }}
{{ form.password() }}
{% for error in form.password.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.password2.label }}
{{ form.password2() }}
{% for error in form.password2.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.guidelines.label }}
{{ form.guidelines() }}
{% for error in form.guidelines.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>
{{ form.newsletter.label }}
{{ form.newsletter() }}
<div style="font-size:80%;color:rgba(0,0,0,.5)">{{ form.newsletter.description }}</div>
{% for error in form.newsletter.errors %}
<span class="msgerror">{{ error }}</span>
{% endfor %}
</div>
<div>{{ form.submit(class_="bg-green") }}</div>
</form>
</div>
</section>
{% endblock %}

Loading…
Cancel
Save