From fcff0061551daa104b0daa39d4965bc2ab7e1126 Mon Sep 17 00:00:00 2001 From: Daniel Muckerman Date: Sat, 12 Dec 2020 22:23:55 -0500 Subject: [PATCH] Overhaul navbar --- app.py | 21 ++++-- config/config.yaml | 2 +- requirements.txt | 3 +- static/icons/feathericons/LICENSE | 21 ++++++ static/icons/feathericons/feather-sprite.svg | 1 + static/icons/lucide-icons/LICENSE | 15 +++++ static/icons/lucide-icons/gamepad-2.svg | 7 ++ static/icons/lucide-icons/snowflake.svg | 12 ++++ static/style.css | 35 ++++++++++ templates/{ => fragments}/card.j2 | 0 templates/{ => fragments}/card_list.j2 | 0 templates/{ => fragments}/countdown.j2 | 0 templates/fragments/navbar.j2 | 55 ++++++++++++++++ templates/{ => fragments}/new_game_modal.j2 | 0 templates/frame.j2 | 67 ++++++++++++++++++++ templates/games.j2 | 42 ++++-------- templates/index.j2 | 36 ++++------- templates/login.j2 | 16 ++++- 18 files changed, 271 insertions(+), 62 deletions(-) create mode 100644 static/icons/feathericons/LICENSE create mode 100644 static/icons/feathericons/feather-sprite.svg create mode 100644 static/icons/lucide-icons/LICENSE create mode 100644 static/icons/lucide-icons/gamepad-2.svg create mode 100644 static/icons/lucide-icons/snowflake.svg rename templates/{ => fragments}/card.j2 (100%) rename templates/{ => fragments}/card_list.j2 (100%) rename templates/{ => fragments}/countdown.j2 (100%) create mode 100644 templates/fragments/navbar.j2 rename templates/{ => fragments}/new_game_modal.j2 (100%) create mode 100644 templates/frame.j2 diff --git a/app.py b/app.py index e9a9e30..9377bf0 100644 --- a/app.py +++ b/app.py @@ -7,6 +7,7 @@ from flask_sqlalchemy import SQLAlchemy from flask_login import LoginManager, login_manager, current_user, login_user, \ logout_user, login_required from flask_wtf import FlaskForm +from flask_cache_buster import CacheBuster from wtforms import StringField, PasswordField, BooleanField, SubmitField from wtforms.validators import DataRequired import yaml @@ -48,6 +49,13 @@ login_manager.login_view = 'login' db.create_all() +config = { + 'extensions': ['.js', '.css', '.csv'], + 'hash_size': 10 +} + +cache_buster = CacheBuster(config=config) +cache_buster.register_cache_buster(app) eastern = pytz.timezone('US/Eastern') @@ -153,6 +161,11 @@ def get_current_user(): g.user = current_user +@app.route('/frame') +def frame(): + return render_template('frame.j2', apps = apps, games = games) + + @app.route('/') def index(): current_time = eastern.localize(dt.datetime.now()) @@ -172,11 +185,11 @@ def game(): return render_template('final_countdown.j2', final_countdown = final_countdown_data) if countdown_data != None: if current_user.is_authenticated: - return render_template('games.j2', apps = games, search = search, account_url = account_url, description = game_description, countdown = countdown_data, game_list = generate_game_list(current_user.username)) - return render_template('games.j2', apps = games, search = search, account_url = account_url, description = game_description, countdown = countdown_data) + return render_template('games.j2', games = games, search = search, account_url = account_url, description = game_description, countdown = countdown_data, game_list = generate_game_list(current_user.username)) + return render_template('games.j2', games = games, search = search, account_url = account_url, description = game_description, countdown = countdown_data) if current_user.is_authenticated: - return render_template('games.j2', apps = games, search = search, account_url = account_url, description = game_description, game_list = generate_game_list(current_user.username)) - return render_template('games.j2', apps = games, search = search, account_url = account_url, description = game_description) + return render_template('games.j2', games = games, search = search, account_url = account_url, description = game_description, game_list = generate_game_list(current_user.username)) + return render_template('games.j2', games = games, search = search, account_url = account_url, description = game_description) @app.route('/login', methods=['GET', 'POST']) diff --git a/config/config.yaml b/config/config.yaml index 2578749..87195ec 100644 --- a/config/config.yaml +++ b/config/config.yaml @@ -73,5 +73,5 @@ games: minecraft: name: "Minecraft" description: "
Remember playing Minecraft in high school? Or that one month on PS4? Or that one Bedrock server we used for a month?

Me neither, but join us in Java Edition at: mc.flamwenco.com" - link: "#" + link: "https://technicalincompetence.club/games" image: "minecraft.png" \ No newline at end of file diff --git a/requirements.txt b/requirements.txt index ffdd0ee..fbf2459 100644 --- a/requirements.txt +++ b/requirements.txt @@ -7,4 +7,5 @@ Flask-SimpleLDAP==1.4.0 python-ldap==3.2.0 ldap3==2.8.1 Flask-SQLAlchemy==2.4.4 -Flask-WTF==0.14.3 \ No newline at end of file +Flask-WTF==0.14.3 +Flask-Cache-Buster==1.0.1 \ No newline at end of file diff --git a/static/icons/feathericons/LICENSE b/static/icons/feathericons/LICENSE new file mode 100644 index 0000000..c2f512f --- /dev/null +++ b/static/icons/feathericons/LICENSE @@ -0,0 +1,21 @@ +The MIT License (MIT) + +Copyright (c) 2013-2017 Cole Bemis + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/static/icons/feathericons/feather-sprite.svg b/static/icons/feathericons/feather-sprite.svg new file mode 100644 index 0000000..327fbbb --- /dev/null +++ b/static/icons/feathericons/feather-sprite.svg @@ -0,0 +1 @@ + diff --git a/static/icons/lucide-icons/LICENSE b/static/icons/lucide-icons/LICENSE new file mode 100644 index 0000000..66cc022 --- /dev/null +++ b/static/icons/lucide-icons/LICENSE @@ -0,0 +1,15 @@ +ISC License + +Copyright (c) 2020, Lucide Contributors + +Permission to use, copy, modify, and/or distribute this software for any +purpose with or without fee is hereby granted, provided that the above +copyright notice and this permission notice appear in all copies. + +THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES +WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF +MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR +ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES +WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN +ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF +OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. diff --git a/static/icons/lucide-icons/gamepad-2.svg b/static/icons/lucide-icons/gamepad-2.svg new file mode 100644 index 0000000..a8268a2 --- /dev/null +++ b/static/icons/lucide-icons/gamepad-2.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/static/icons/lucide-icons/snowflake.svg b/static/icons/lucide-icons/snowflake.svg new file mode 100644 index 0000000..5242809 --- /dev/null +++ b/static/icons/lucide-icons/snowflake.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/static/style.css b/static/style.css index b15e3bf..807916b 100644 --- a/static/style.css +++ b/static/style.css @@ -1,3 +1,7 @@ +body { + background-color: #f5f5f5 !important; +} + @media (max-width: 991.98px) { #userNameRow, #firstNameRow { @@ -37,6 +41,10 @@ color: #eee; } + .shadow-lg { + box-shadow: 0 1rem 3rem rgba(0,0,0,.75) !important; + } + .jumbotron { background-color: #333 !important; } @@ -330,4 +338,31 @@ .colon { font-size: 40px; +} + +.overlay-frame { + z-index: 1050; + position: fixed; + top: 55px; + right: 10px; + border-radius: .25rem; + border: 1px solid #6c757d; +} + +#overlay { + width: 100%; + height: 100%; + z-index: 1040; + background-color: rgba(0, 0, 0, 0); + position: fixed; + top: 0; + left: 0; + overflow: hidden; +} + +@media (max-width: 575.98px) { + .navbar-nav > li { + padding-right: .5rem; + padding-left: .5rem; + } } \ No newline at end of file diff --git a/templates/card.j2 b/templates/fragments/card.j2 similarity index 100% rename from templates/card.j2 rename to templates/fragments/card.j2 diff --git a/templates/card_list.j2 b/templates/fragments/card_list.j2 similarity index 100% rename from templates/card_list.j2 rename to templates/fragments/card_list.j2 diff --git a/templates/countdown.j2 b/templates/fragments/countdown.j2 similarity index 100% rename from templates/countdown.j2 rename to templates/fragments/countdown.j2 diff --git a/templates/fragments/navbar.j2 b/templates/fragments/navbar.j2 new file mode 100644 index 0000000..a2dac12 --- /dev/null +++ b/templates/fragments/navbar.j2 @@ -0,0 +1,55 @@ + \ No newline at end of file diff --git a/templates/new_game_modal.j2 b/templates/fragments/new_game_modal.j2 similarity index 100% rename from templates/new_game_modal.j2 rename to templates/fragments/new_game_modal.j2 diff --git a/templates/frame.j2 b/templates/frame.j2 new file mode 100644 index 0000000..fcb53fb --- /dev/null +++ b/templates/frame.j2 @@ -0,0 +1,67 @@ +{% extends "bootstrap/base.html" %} +{% block title %}Technical Incompetence - Home{% endblock %} + +{% block styles %} +{{super()}} +{# #} + +{% if countdown is defined %} + +{% endif %} + +{% endblock %} + +{% block content %} +
+
Apps
+
+ {% for app in apps %} +
+
+
+ {% if app['image'] is defined %} + + {% endif %} +

{{ app['name'] }}

+
+
+
+ {% endfor %} +
+
Games
+
+ {% for app in games %} +
+
+
+ {% if app['image'] is defined %} + + {% endif %} +

{{ app['name'] }}

+
+
+
+ {% endfor %} +
+
+{% endblock %} + +{% block scripts %} +{{ super () }} + +{% endblock %} \ No newline at end of file diff --git a/templates/games.j2 b/templates/games.j2 index 8f517be..cce7a44 100644 --- a/templates/games.j2 +++ b/templates/games.j2 @@ -3,7 +3,7 @@ {% block styles %} {{super()}} -{# #} + {% if countdown is defined %} @@ -11,31 +11,12 @@ {% endblock %} {% block navbar %} - +{% include "fragments/navbar.j2" %} {% endblock %} {% block content %} + +
{% if search['active'] == True %}
@@ -44,20 +25,20 @@

{% endif %} {% if countdown is defined %} - {% include "countdown.j2" %} + {% include "fragments/countdown.j2" %} {% endif %}

{{ description }}

- {% for app in apps %} - {% include "card.j2" %} + {% for app in games %} + {% include "fragments/card.j2" %} {% endfor %}
- {% include "card_list.j2" %} + {% include "fragments/card_list.j2" %}

- {% include "new_game_modal.j2" %} + {% include "fragments/new_game_modal.j2" %} {% endblock %} {% block scripts %} @@ -91,6 +72,11 @@ function goToLink(link) { window.location = link; } +function showApps () { + $("#apps").toggle(); + $("#overlay").toggle(); +} + function addGame() { game_title = $('#game-title').val(); game_link = $('#game-link').val(); diff --git a/templates/index.j2 b/templates/index.j2 index bf73b0d..55728b0 100644 --- a/templates/index.j2 +++ b/templates/index.j2 @@ -3,7 +3,7 @@ {% block styles %} {{super()}} -{# #} + {% if countdown is defined %} @@ -11,31 +11,12 @@ {% endblock %} {% block navbar %} - +{% include "fragments/navbar.j2" %} {% endblock %} {% block content %} + +
{% if search['active'] == True %}
@@ -44,12 +25,12 @@

{% endif %} {% if countdown is defined %} - {% include "countdown.j2" %} + {% include "fragments/countdown.j2" %} {% endif %}

{{ description }}

{% for app in apps %} - {% include "card.j2" %} + {% include "fragments/card.j2" %} {% endfor %}
@@ -83,5 +64,10 @@ $( ".card" ).hover( function goToLink(link) { window.location = link; } + +function showApps () { + $("#apps").toggle(); + $("#overlay").toggle(); +} {% endblock %} \ No newline at end of file diff --git a/templates/login.j2 b/templates/login.j2 index 293cf96..de5e689 100644 --- a/templates/login.j2 +++ b/templates/login.j2 @@ -8,12 +8,12 @@ {% endblock %} {% block navbar %} - +{% include "fragments/navbar.j2" %} {% endblock %} {% block content %} + +

Sign in for our awesome service

@@ -29,4 +29,14 @@ {{wtf.quick_form(form, novalidate=True)}}
+{% endblock %} + +{% block scripts %} +{{ super () }} + {% endblock %} \ No newline at end of file