Add dark mode

This commit is contained in:
Stephan Porada 2019-10-09 16:10:30 +02:00
parent 7ad9a61e24
commit 88042dfd8e
8 changed files with 2908 additions and 5 deletions

View File

@ -120,6 +120,7 @@ class User(UserMixin, db.Model):
cascade='save-update, merge, delete') cascade='save-update, merge, delete')
jobs = db.relationship('Job', backref='creator', lazy='dynamic', jobs = db.relationship('Job', backref='creator', lazy='dynamic',
cascade='save-update, merge, delete') cascade='save-update, merge, delete')
is_dark = db.Column(db.Boolean, default=False)
def __repr__(self): def __repr__(self):
""" """

View File

@ -1,8 +1,9 @@
from flask_wtf import FlaskForm from flask_wtf import FlaskForm
from wtforms import PasswordField, StringField, SubmitField, ValidationError from wtforms import (PasswordField, StringField, SubmitField,
ValidationError, BooleanField)
from wtforms.validators import DataRequired, EqualTo, Length from wtforms.validators import DataRequired, EqualTo, Length
from ..models import User from ..models import User
import logging
class ChangePasswordForm(FlaskForm): class ChangePasswordForm(FlaskForm):
""" """
@ -36,3 +37,8 @@ class EditProfileForm(FlaskForm):
if field.data != self.user.email and \ if field.data != self.user.email and \
User.query.filter_by(email=field.data).first(): User.query.filter_by(email=field.data).first():
raise ValidationError('Email already registered!') raise ValidationError('Email already registered!')
class EditUserSettingsForm(FlaskForm):
is_dark = BooleanField('Dark Mode')
submit = SubmitField('Save Settings')

View File

@ -2,9 +2,12 @@ from app.utils import background_delete_user
from flask import current_app, flash, redirect, render_template, url_for from flask import current_app, flash, redirect, render_template, url_for
from flask_login import current_user, login_required, logout_user from flask_login import current_user, login_required, logout_user
from . import profile from . import profile
from .forms import ChangePasswordForm, EditProfileForm from .forms import ChangePasswordForm, EditProfileForm, EditUserSettingsForm
from .. import db from .. import db
import threading import threading
import logging
logger = logging.getLogger(__name__)
@profile.route('/', methods=['GET', 'POST']) @profile.route('/', methods=['GET', 'POST'])
@ -23,6 +26,7 @@ def index():
return redirect(url_for('profile.index')) return redirect(url_for('profile.index'))
else: else:
flash('Invalid password.') flash('Invalid password.')
change_profile_form = EditProfileForm(user=current_user) change_profile_form = EditProfileForm(user=current_user)
if change_profile_form.validate_on_submit(): if change_profile_form.validate_on_submit():
current_user.email = change_profile_form.email.data current_user.email = change_profile_form.email.data
@ -30,15 +34,27 @@ def index():
db.session.commit() db.session.commit()
flash('Your email has been updated.') flash('Your email has been updated.')
change_profile_form.email.data = current_user.email change_profile_form.email.data = current_user.email
edit_user_settings_form = EditUserSettingsForm()
if edit_user_settings_form.validate_on_submit():
current_user.is_dark = edit_user_settings_form.is_dark.data
logger.warning('Form data: {}'.format(current_user.is_dark))
db.session.add(current_user)
db.session.commit()
return render_template('profile/index.html.j2', return render_template('profile/index.html.j2',
change_password_form=change_password_form, change_password_form=change_password_form,
change_profile_form=change_profile_form, change_profile_form=change_profile_form,
edit_user_settings_form=edit_user_settings_form,
title='Profile') title='Profile')
@profile.route('/delete_self', methods=['GET', 'POST']) @profile.route('/delete_self', methods=['GET', 'POST'])
@login_required @login_required
def delete_self(): def delete_self():
"""
Vie to delete yourslef and all associated data.
"""
delete_thread = threading.Thread( delete_thread = threading.Thread(
target=background_delete_user, target=background_delete_user,
args=(current_app._get_current_object(), current_user.id) args=(current_app._get_current_object(), current_user.id)

2802
app/static/js/darkreader.js Normal file

File diff suppressed because it is too large Load Diff

View File

@ -19,6 +19,18 @@
<script src="{{ url_for('static', filename='js/list.utils.js') }}"></script> <script src="{{ url_for('static', filename='js/list.utils.js') }}"></script>
<script src="{{ url_for('static', filename='js/CorpusList.js') }}"></script> <script src="{{ url_for('static', filename='js/CorpusList.js') }}"></script>
<script src="{{ url_for('static', filename='js/JobList.js') }}"></script> <script src="{{ url_for('static', filename='js/JobList.js') }}"></script>
<script src="{{ url_for('static', filename='js/darkreader.js') }}"></script>
<script>
{% if current_user.is_dark == True %}
DarkReader.enable({
brightness: 100,
contrast: 90,
sepia: 10
});
{% else %}
DarkReader.disable();
{% endif %}
</script>
<script> <script>
var corpora; var corpora;
var corporaSubscribers = []; var corporaSubscribers = [];

View File

@ -1,11 +1,41 @@
{% extends "base.html.j2" %} {% extends "base.html.j2" %}
{% block page_content %} {% block page_content %}
<div class="col s12 m4">
<h3>Dark Mode</h3>
<p>Activate Dark Mode to ease your eyes!</p>
</div>
<div class="col s12 m8">
<div class="card">
<div class="card-content">
<form method="POST">
{{ edit_user_settings_form.hidden_tag() }}
<div class="switch">
<i class="material-icons prefix">brightness_3</i>
Dark Mode:
<label class="active" for="{{edit_user_settings_form.is_dark.name}}">
Off
{% if current_user.is_dark == True %}
<input type="checkbox" id="{{edit_user_settings_form.is_dark.name}}" name="{{edit_user_settings_form.is_dark.name}}" checked="checked">
{% else %}
<input type="checkbox" id="{{edit_user_settings_form.is_dark.name}}" name="{{edit_user_settings_form.is_dark.name}}">
{% endif %}
<span class="lever"></span>
On
</label>
</div>
</div>
<div class="card-action right-align">
{{ edit_user_settings_form.submit(class='btn') }}
</div>
</form>
</div>
</div>
<div class="col s12"></div>
<div class="col s12 m4"> <div class="col s12 m4">
<h3>Change password</h3> <h3>Change password</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren,</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren,</p>
</div> </div>
<div class="col s12 m8"> <div class="col s12 m8">
<div class="card"> <div class="card">
<form method="POST"> <form method="POST">
@ -42,6 +72,7 @@
</form> </form>
</div> </div>
</div> </div>
<div class="col s12"></div>
<div class="col s12 m4"> <div class="col s12 m4">
<h3>Change email</h3> <h3>Change email</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren,</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren,</p>
@ -66,6 +97,7 @@
</form> </form>
</div> </div>
</div> </div>
<div class="col s12"></div>
<div class="col s12 m4"> <div class="col s12 m4">
<h3>Delete Account</h3> <h3>Delete Account</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren,</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren,</p>

View File

@ -1,11 +1,17 @@
#!/bin/sh #!/bin/sh
if [ $# -eq 0 ] if [[ $# -eq 0 ]]
then then
venv/bin/python -u opaque.py venv/bin/python -u opaque.py
elif [[ $1 == "--migrate" ]]
then
echo Migrating changes.
venv/bin/python -m flask db migrate
venv/bin/python -m flask db upgrade
else else
if [[ $1 == "--setup-database" ]] if [[ $1 == "--setup-database" ]]
then then
echo Initial setup of database.
venv/bin/python -m flask db init venv/bin/python -m flask db init
venv/bin/python -m flask db upgrade venv/bin/python -m flask db upgrade
venv/bin/python -m flask insert-initial-database-entries venv/bin/python -m flask insert-initial-database-entries

View File

@ -0,0 +1,28 @@
"""empty message
Revision ID: f16b80c57038
Revises: 685dff1cc01b
Create Date: 2019-10-09 09:34:37.616747
"""
from alembic import op
import sqlalchemy as sa
# revision identifiers, used by Alembic.
revision = 'f16b80c57038'
down_revision = '685dff1cc01b'
branch_labels = None
depends_on = None
def upgrade():
# ### commands auto generated by Alembic - please adjust! ###
op.add_column('users', sa.Column('is_dark', sa.Boolean(), nullable=True))
# ### end Alembic commands ###
def downgrade():
# ### commands auto generated by Alembic - please adjust! ###
op.drop_column('users', 'is_dark')
# ### end Alembic commands ###