Gr1/husstanden
5
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge branch 'master' of http://git.osufx.com/Gr1/husstanden

Browse Source
This commit is contained in:
Glenn Petter Pettersen 2019-04-26 01:53:53 +02:00
commit 58df1c2dcb
25 changed files with 547 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
credits.md Normal file
View File

@ -0,0 +1 @@
https://github.com/kylestetz/CLNDR (MIT License)

8
filters.py Normal file
View File

@ -0,0 +1,8 @@
from flask import render_template
from objects import glob
"""
@glob.app.template_filter('load_module')
def load_module(module_name):
return render_template("modules/%s.html" % module_name)
"""

1
main.py
View File

@ -5,6 +5,7 @@ from objects import glob # Global sharing of python objects in a manageable way
glob.app = Flask(__name__)
import routes # All flask app routes
import filters # All flask app filters
if glob.config["git"]["auto_pull_and_restart"]: # Only used on the VPS (Do not enable in config)
@glob.app.route(glob.config["git"]["webhook_endpoint"], methods = ["POST"])

18
routes.py
View File

@ -3,8 +3,9 @@ from objects import glob # Global sharing of python objects in a manageable way
@glob.app.route("/")
@glob.app.route("/home")
@glob.app.route("/dashboard")
def home():
return render_template("home.html")
return render_template("pages/dashboard.html")
@glob.app.route("/login", methods = ["GET", "POST"])
def serve_login():
@ -12,19 +13,4 @@ def serve_login():
return "TODO: Login handle", 501
return render_template("login.html")
@glob.app.route("/testing")
def we_are_testing():
return render_template("testing.html")
@glob.app.route("/bill")
def serve_bill():
return render_template("bill.html")
@glob.app.route("/regninger")
def serve_regninger():
return render_template("regninger.html")
@glob.app.route("/kvittering")
def serve_kvittering():
return render_template("kvittering.html")

15
static/const/img/flags/gb.svg Normal file
View File

@ -0,0 +1,15 @@
<svg xmlns="http://www.w3.org/2000/svg" id="flag-icon-css-gb" viewBox="0 0 640 480">
<defs>
<clipPath id="a">
<path fill-opacity=".7" d="M-85.3 0h682.6v512H-85.3z"/>
</clipPath>
</defs>
<g clip-path="url(#a)" transform="translate(80) scale(.94)">
<g stroke-width="1pt">
<path fill="#012169" d="M-256 0H768v512H-256z"/>
<path fill="#fff" d="M-256 0v57.2L653.5 512H768v-57.2L-141.5 0H-256zM768 0v57.2L-141.5 512H-256v-57.2L653.5 0H768z"/>
<path fill="#fff" d="M170.7 0v512h170.6V0H170.7zM-256 170.7v170.6H768V170.7H-256z"/>
<path fill="#c8102e" d="M-256 204.8v102.4H768V204.8H-256zM204.8 0v512h102.4V0H204.8zM-256 512L85.3 341.3h76.4L-179.7 512H-256zm0-512L85.3 170.7H9L-256 38.2V0zm606.4 170.7L691.7 0H768L426.7 170.7h-76.3zM768 512L426.7 341.3H503l265 132.5V512z"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 837 B

7
static/const/img/flags/no.svg Normal file
View File

@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" id="flag-icon-css-no" viewBox="0 0 640 480">
<path fill="#ed2939" d="M0 0h640v480H0z"/>
<path fill="#fff" d="M180 0h120v480H180z"/>
<path fill="#fff" d="M0 180h640v120H0z"/>
<path fill="#002664" d="M210 0h60v480h-60z"/>
<path fill="#002664" d="M0 210h640v60H0z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 321 B

230
static/css/calendar.css Normal file
View File

@ -0,0 +1,230 @@
.clearfix:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
.clearfix {
display: inline-block;
}
html[xmlns] .clearfix {
display: block;
}
* html .clearfix {
height: 1%;
}
.noselect {
-webkit-user-select: none;
/* Chrome/Safari */
-moz-user-select: none;
/* Firefox */
-ms-user-select: none;
/* IE10+ */
}
.calendar h4 {
width: 75%;
text-align: center;
font-weight: normal;
color: white;
font-size: 14px;
margin: 0 auto 1em auto;
padding: 1em;
background: #b63642;
}
.calendar h5 {
font-size: 1em;
font-weight: bold;
}
.calendar p {
text-align: center;
margin: 3em auto 1em auto;
padding-top: 0.5em;
padding-bottom: 0.5em;
border-bottom: 2px solid #414141;
background: #f4f4f4;
}
.left-align {
text-align: left;
}
.right-align {
text-align: right;
}
.calendar {
margin: 30px auto;
max-width: 600px;
font-size: 14px;
}
.calendar .clndr .clndr-controls {
display: inline-block;
width: 100%;
position: relative;
margin-bottom: 10px;
}
.calendar .clndr .clndr-controls .month {
float: left;
width: 33%;
text-align: center;
}
.calendar .clndr .clndr-controls .clndr-control-button {
float: left;
width: 33%;
}
.calendar .clndr .clndr-controls .clndr-control-button.rightalign {
text-align: right;
width: 34%;
}
.calendar .clndr .clndr-controls .clndr-control-button .clndr-next-button {
cursor: pointer;
-webkit-user-select: none;
/* Chrome/Safari */
-moz-user-select: none;
/* Firefox */
-ms-user-select: none;
/* IE10+ */
}
.calendar .clndr .clndr-controls .clndr-control-button .clndr-next-button:hover {
background: #ddd;
}
.calendar .clndr .clndr-controls .clndr-control-button .clndr-next-button.inactive {
opacity: 0.5;
}
.calendar .clndr .clndr-controls .clndr-control-button .clndr-next-button.inactive:hover {
background: none;
cursor: default;
}
.calendar .clndr .clndr-controls .clndr-control-button .clndr-previous-button {
cursor: pointer;
-webkit-user-select: none;
/* Chrome/Safari */
-moz-user-select: none;
/* Firefox */
-ms-user-select: none;
/* IE10+ */
}
.calendar .clndr .clndr-controls .clndr-control-button .clndr-previous-button:hover {
background: #ddd;
}
.calendar .clndr .clndr-controls .clndr-control-button .clndr-previous-button.inactive {
opacity: 0.5;
}
.calendar .clndr .clndr-controls .clndr-control-button .clndr-previous-button.inactive:hover {
background: none;
cursor: default;
}
.calendar .clndr .clndr-table {
table-layout: fixed;
width: 100%;
}
.calendar .clndr .clndr-table .header-days {
height: 30px;
font-size: 10px;
background: #0D70A6;
}
.calendar .clndr .clndr-table .header-days .header-day {
vertical-align: middle;
text-align: center;
border-left: 1px solid #000000;
border-top: 1px solid #000000;
color: #fff;
}
.calendar .clndr .clndr-table .header-days .header-day:last-child {
border-right: 1px solid #000000;
}
.calendar .clndr .clndr-table tr {
height: 85px;
}
.calendar .clndr .clndr-table tr td {
vertical-align: top;
}
.calendar .clndr .clndr-table tr .day {
border-left: 1px solid #000000;
border-top: 1px solid #000000;
width: 100%;
height: inherit;
}
.calendar .clndr .clndr-table tr .day:hover {
background: #eee;
}
.calendar .clndr .clndr-table tr .day.today,
.calendar .clndr .clndr-table tr .day.my-today {
background: #9AD6E3;
}
.calendar .clndr .clndr-table tr .day.today:hover,
.calendar .clndr .clndr-table tr .day.my-today:hover {
background: #72c6d8;
}
.calendar .clndr .clndr-table tr .day.today.event,
.calendar .clndr .clndr-table tr .day.my-today.event {
background: #a7dbc1;
}
.calendar .clndr .clndr-table tr .day.event,
.calendar .clndr .clndr-table tr .day.my-event {
background: #B4E09F;
}
.calendar .clndr .clndr-table tr .day.event:hover,
.calendar .clndr .clndr-table tr .day.my-event:hover {
background: #96d478;
}
.calendar .clndr .clndr-table tr .day.inactive,
.calendar .clndr .clndr-table tr .day.my-inactive {
background: #ddd;
}
.calendar .clndr .clndr-table tr .day:last-child {
border-right: 1px solid #000000;
}
.calendar .clndr .clndr-table tr .day .day-contents {
box-sizing: border-box;
padding: 8px;
font-size: 12px;
text-align: right;
}
.calendar .clndr .clndr-table tr .empty,
.calendar .clndr .clndr-table tr .adjacent-month,
.calendar .clndr .clndr-table tr .my-empty,
.calendar .clndr .clndr-table tr .my-adjacent-month {
border-left: 1px solid #000000;
border-top: 1px solid #000000;
width: 100%;
height: inherit;
background: #eee;
}
.calendar .clndr .clndr-table tr .empty:hover,
.calendar .clndr .clndr-table tr .adjacent-month:hover,
.calendar .clndr .clndr-table tr .my-empty:hover,
.calendar .clndr .clndr-table tr .my-adjacent-month:hover {
background: #ddd;
}
.calendar .clndr .clndr-table tr .empty:last-child,
.calendar .clndr .clndr-table tr .adjacent-month:last-child,
.calendar .clndr .clndr-table tr .my-empty:last-child,
.calendar .clndr .clndr-table tr .my-adjacent-month:last-child {
border-right: 1px solid #000000;
}
.calendar .clndr .clndr-table tr:last-child .day,
.calendar .clndr .clndr-table tr:last-child .my-day {
border-bottom: 1px solid #000000;
}
.calendar .clndr .clndr-table tr:last-child .empty,
.calendar .clndr .clndr-table tr:last-child .my-empty {
border-bottom: 1px solid #000000;
}
.clndr-next-button,
.clndr-previous-button,
.clndr-next-year-button,
.clndr-previous-year-button {
-webkit-user-select: none;
/* Chrome/Safari */
-moz-user-select: none;
/* Firefox */
-ms-user-select: none;
/* IE10+ */
}
.clndr-next-button.inactive,
.clndr-previous-button.inactive,
.clndr-next-year-button.inactive,
.clndr-previous-year-button.inactive {
opacity: 0.5;
cursor: default;
}

7
static/css/custom.css Normal file
View File

@ -0,0 +1,7 @@
@import url('https://fonts.googleapis.com/css?family=Poppins');
html, body {
height: 100%;
background-color: #eee;
font-family: "Poppins", sans-serif;
}

6
static/img/logo.svg Normal file
View File

@ -0,0 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" height="230" width="300">
<path d="M150 0 L0 130 L55 130 L150 50 L240 130 L300 130 Z" fill="#fff"/>
<line x1="70" y1="92" x2="70" y2="250" style="stroke:#fff;stroke-width:45" />
<line x1="230" y1="30" x2="230" y2="250" style="stroke:#fff;stroke-width:45" />
<line x1="70" y1="150" x2="230" y2="150" style="stroke:#fff;stroke-width:45" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 389 B

25
static/js/interact.js Normal file
View File

@ -0,0 +1,25 @@
function openCategory(DOM) {
DOM.parentNode.children[1].classList.remove("hidden");
}
function closeCategory(DOM) {
DOM.parentNode.children[1].classList.add("hidden");
}
function toggleCategory(DOM) {
let classes = DOM.parentNode.children[1].classList;
classes[classes.contains("hidden") ? "remove" : "add"]("hidden");
}
/*
function postPageLoad() {
let ent = document.getElementById("sidenav").children[1].children[0].children[0].children;
for (let i = 0; i < ent.length; i++) {
if (!ent[i].children[0].classList.contains("item"))
continue;
ent[i].children[0].onclick = toggleCategory(ent[i].children[0]);
}
}
*/

7
static/js/moment.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

6
static/js/underscore.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

2
static/modules/clndr.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

10
templates/home.html
View File

@ -1,10 +0,0 @@
{% set title = "Home" %}
{% extends "layout/dash.html" %}
{% block content %}
<p>Template usage</p>
<i class="fas fa-user"></i> <!-- uses solid style -->
<i class="far fa-user"></i> <!-- uses regular style -->
<i class="fab fa-github-square"></i> <!-- uses brands style -->
{% endblock %}

8
templates/layout/dash.html
View File

@ -2,15 +2,16 @@
<html lang="en">
<head>
{% include 'layout/includes/boot-head.html' %}
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/custom.css') }}">
{% if title %}
<title>Husstanden - {{ title }}</title>
{% else %}
<title>Husstanden</title>
{% endif %}
</head>
<body>
<div class="p-2">
<div class="d-flex">
<body style="height:100%">
<div class="p-2" style="height:100%">
<div class="d-flex" style="height:100%">
<div class="col p-2" style="flex:0 0 320px;">
{% include 'layout/includes/side_nav.html' %}
</div>
@ -21,5 +22,6 @@
</div>
</div>
{% include 'layout/includes/boot-body.html' %}
<script src="{{ url_for('static', filename='js/interact.js') }}"></script>
</body>
</html>

1
templates/layout/includes/boot-body.html
View File

@ -1,3 +1,2 @@
<script src="{{ url_for('static', filename='const/js/jquery-3.3.1.slim.min.js') }}"></script>
<script src="{{ url_for('static', filename='const/js/popper.min.js') }}"></script>
<script src="{{ url_for('static', filename='const/js/bootstrap.min.js') }}"></script>

1
templates/layout/includes/boot-head.html
View File

@ -2,3 +2,4 @@
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='const/css/bootstrap.min.css') }}">
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='const/css/fontawesome.min.css') }}">
<script src="{{ url_for('static', filename='const/js/jquery-3.3.1.slim.min.js') }}"></script>

146
templates/layout/includes/side_nav.html
View File

@ -1,4 +1,11 @@
<style>
#sidenav-parent {
display: flex;
flex-direction: column;
height:100%;
min-height: 100%;
}
#sidenav {
background-color: #B507DB;
border-radius: 4px;
@ -9,95 +16,146 @@
flex-direction: column;
max-width: 100%;
height: 100%;
height: 100%;
}
#sidenav ul > li {
#sidenav div {
display: flex;
flex-direction: column;
}
#sidenav a, #sidenav h4 {
#sidenav h4 {
margin-top: 20px;
color: white;
}
.navlist ul > li, .navlist ul > li > a {
#sidenav a {
color: #e9d9fc;
line-height: 1;
}
#sidenav a:hover {
color: white;
}
.navlist div, .navlist div > a {
display: flex;
flex-grow: 1;
text-decoration: none;
}
.navlist ul > li > a > span {
.navlist div > a > span {
flex-grow: 1;
}
.navlist ul > li > a > i:last-child {
.navlist div > a > i:last-child {
justify-content: flex-end;
}
.navlist div > a > * {
margin-left: 10px;
margin-right: 10px;
}
.navlist .item {
cursor: pointer;
padding-top: 3px;
padding-bottom: 3px;
}
#sidenav .flex-column .flex-column {
margin-left: 30px;
margin-right: 30px;
}
#sidenav .flex-column .flex-column > div {
padding-top: 5px;
padding-bottom: 5px;
padding-right: 30px;
padding-left: 30px;
}
#sidenav .flex-column .flex-column > div > a {
display: list-item;
list-style-type: disc;
}
.page.selected {
background-color: #9F07C1;
border-radius: 100px;
}
.downtab {
}
.hidden {
display: none;
display: none !important;
overflow: hidden !important;
}
</style>
<div class="d-flex flex-row" id="sidenav">
<div id="sidenav-parent">
<div class="d-flex flex-column" id="sidenav">
<div class="top">
<!-- Here be logo area -->
<!-- <img alt="Logo" src="{{ url_for('static', filename='img/logo.svg') }}" height="40px"/> -->
</div>
<div class="navlist">
<!-- Here be dropdown menus -->
<div class="p-2"> <!-- Padding -->
<ul>
<li> <!-- Collection -->
<a href="#dash">
<div class="flex-column">
<div> <!-- Collection -->
<a class="item" onclick="toggleCategory(this)">
<i class="fa fa-chart-bar"></i><span>Dashboard</span>
<i class="fas fa-chevron-right"></i>
</a>
<div class="hidden"> <!-- Hidden until clicked #dash -->
<ul>
<li>
<a href="#dash-test">Test</a> <!-- TODO: Add dot prefix -->
</li>
<li>
<div class="downtab hidden">
<div class="flex-column">
<div class="page">
<a href="#dash-test">Test</a>
</div>
<div class="page">
<a href="#dash-demo">Demo</a>
</li>
</ul>
</div>
</div>
</div>
</li>
<li>
<h4>Title card</h4> <!-- TODO: Padding and such -->
</li>
<li>
<a href="#bills">
</div>
<div>
<h4>Title card</h4>
</div>
<div>
<a class="item" onclick="toggleCategory(this)">
<i class="fa fa-chart-bar"></i><span>Bills</span>
<i class="fas fa-chevron-right"></i>
</a>
<div class="hidden">
<ul>
<li>
<div class="downtab hidden">
<div class="flex-column">
<div class="page">
<a href="#bills-bills">Bills</a>
</li>
<li>
</div>
<div class="page">
<a href="#bills-log">Log</a>
</li>
</ul>
</div>
</div>
</div>
</li>
<li>
<a href="#recieps">
</div>
<div>
<a class="item" onclick="toggleCategory(this)">
<i class="fa fa-chart-bar"></i><span>Recieps</span>
<i class="fas fa-chevron-right"></i>
</a>
<div class="hidden">
<ul>
<li>
<div class="downtab hidden">
<div class="flex-column">
<div class="page">
<a href="#recieps-recieps">Recieps</a>
</li>
<li>
</div>
<div class="page">
<a href="#recieps-log">Log</a>
</li>
</ul>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>

20
templates/layout/includes/top_nav.html
View File

@ -2,6 +2,7 @@
.rndblock {
border-radius: 100%;
background: #B507DB;
background-position: center;
width: 40px;
height: 40px;
@ -13,17 +14,26 @@
}
.languk {
background: url("{{ url_for('static', filename='const/img/flags/uk.png') }}");
background-image: url("{{ url_for('static', filename='const/img/flags/gb.svg') }}");
}
.langno {
background: url("{{ url_for('static', filename='const/img/flags/no.png') }}");
background-image: url("{{ url_for('static', filename='const/img/flags/no.svg') }}");
}
.icon-buttons > .col {
padding-right: 6px;
padding-left: 6px;
}
.topnav a {
color: black;
}
</style>
<nav class="navbar navbar-dark bg-dark" style="margin-bottom: 10px;">
<a class="navbar-brand" href="#">Dashboard</a>
<div class="my-2 my-lg-0 d-flex">
<nav class="navbar topnav" style="margin-bottom: 10px;">
<h3>{{ title }}</h3>
<div class="my-2 my-lg-0 d-flex icon-buttons">
<div class="col">
<div class="rndblock languk"></div>
</div>

98
templates/modules/calendar.html Normal file
View File

@ -0,0 +1,98 @@
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/calendar.css') }}">
<div class="calendar"></div>
<script src="{{ url_for('static', filename='js/moment.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/underscore.min.js') }}"></script>
<script src="{{ url_for('static', filename='modules/clndr.min.js') }}"></script>
<script>
var calendars = {};
$(document).ready( function() {
// Assuming you've got the appropriate language files,
// clndr will respect whatever moment's language is set to.
// moment.locale('ru');
// Here's some magic to make sure the dates are happening this month.
var thisMonth = moment().format('YYYY-MM');
// Events to load into calendar
var eventArray = [ // TODO: Get events from database
{
title: 'Multi-Day Event',
endDate: thisMonth + '-14',
startDate: thisMonth + '-10'
}, {
endDate: thisMonth + '-23',
startDate: thisMonth + '-21',
title: 'Another Multi-Day Event'
}, {
date: thisMonth + '-27',
title: 'Single Day Event'
}
];
// The order of the click handlers is predictable. Direct click action
// callbacks come first: click, nextMonth, previousMonth, nextYear,
// previousYear, nextInterval, previousInterval, or today. Then
// onMonthChange (if the month changed), inIntervalChange if the interval
// has changed, and finally onYearChange (if the year changed).
calendars.clndr = $('.calendar').clndr({
events: eventArray,
clickEvents: {
click: function (target) {
console.log('Cal-1 clicked: ', target);
},
today: function () {
console.log('Cal-1 today');
},
nextMonth: function () {
console.log('Cal-1 next month');
},
previousMonth: function () {
console.log('Cal-1 previous month');
},
onMonthChange: function () {
console.log('Cal-1 month changed');
},
nextYear: function () {
console.log('Cal-1 next year');
},
previousYear: function () {
console.log('Cal-1 previous year');
},
onYearChange: function () {
console.log('Cal-1 year changed');
},
nextInterval: function () {
console.log('Cal-1 next interval');
},
previousInterval: function () {
console.log('Cal-1 previous interval');
},
onIntervalChange: function () {
console.log('Cal-1 interval changed');
}
},
multiDayEvents: {
singleDay: 'date',
endDate: 'endDate',
startDate: 'startDate'
},
showAdjacentMonths: true,
adjacentDaysChangeMonth: false
});
// Bind all clndrs to the left and right arrow keys
$(document).keydown( function(e) {
// Left arrow
if (e.keyCode == 37) {
calendars.clndr.back();
}
// Right arrow
if (e.keyCode == 39) {
calendars.clndr.forward();
}
});
});
</script>

0
templates/bill.html → templates/pages/bill.html
View File

9
templates/pages/dashboard.html Normal file
View File

@ -0,0 +1,9 @@
{% set title = "Dashboard" %}
{% extends "layout/dash.html" %}
{% block content %}
{% include "modules/calendar.html" %}
{% endblock %}

0
templates/kvittering.html → templates/pages/kvittering.html
View File

0
templates/regninger.html → templates/pages/regninger.html
View File

0
templates/testing.html → templates/pages/testing.html
View File