Create a basic month view

This commit is contained in:
Gergely Polonkai 2018-06-25 09:01:13 +02:00
parent 448ae1bce0
commit 6c4eb97c01
5 changed files with 153 additions and 1 deletions

View File

@ -14,6 +14,7 @@
# You should have received a copy of the GNU Affero General Public License # You should have received a copy of the GNU Affero General Public License
# along with this program. If not, see <https://www.gnu.org/licenses/>. # along with this program. If not, see <https://www.gnu.org/licenses/>.
from datetime import datetime
import os import os
from flask import Flask, current_app, redirect, render_template, url_for from flask import Flask, current_app, redirect, render_template, url_for
@ -69,10 +70,14 @@ app = CalendarSocialApp(__name__)
@app.route('/') @app.route('/')
def hello(): def hello():
from app.calendar_system.gregorian import GregorianCalendar
if not current_user.is_authenticated: if not current_user.is_authenticated:
return render_template('welcome.html') return render_template('welcome.html')
return render_template('index.html') calendar = GregorianCalendar(datetime.utcnow().timestamp())
return render_template('index.html', calendar=calendar)
@app.route('/register', methods=['POST', 'GET']) @app.route('/register', methods=['POST', 'GET'])

View File

@ -0,0 +1,15 @@
class CalendarSystem:
__has_months__ = False
__has_weeks__ = False
@property
def day_names(self):
raise NotImplementedError()
@property
def month(self):
raise NotImplementedError()
@property
def days(self):
raise NotImplementedError()

View File

@ -0,0 +1,48 @@
from datetime import datetime, timedelta
from flask_babel import lazy_gettext as _
from . import CalendarSystem
class GregorianCalendar(CalendarSystem):
__name__ = _('Gregorian')
__has_months__ = True
START_DAY = 0
END_DAY = 7
day_names = (
_('Monday'),
_('Tuesday'),
_('Wednesday'),
_('Thursday'),
_('Friday'),
_('Saturday'),
_('Sunday'),
)
def __init__(self, timestamp):
self.timestamp = datetime.utcfromtimestamp(timestamp)
@property
def month(self):
return self.timestamp.strftime("%B, %Y")
@property
def days(self):
day_list = []
start_day = self.timestamp.replace(day=1)
while start_day.weekday() > self.START_DAY:
start_day -= timedelta(days=1)
day_list.append(start_day)
current_day = start_day
while current_day.weekday() < self.END_DAY and current_day.month <= self.timestamp.month:
current_day += timedelta(days=1)
day_list.append(current_day)
return day_list

View File

@ -2,4 +2,6 @@
{% block content %} {% block content %}
{{ _('Welcome to Calendar.social, %(username)s!', username=current_user.username) }} {{ _('Welcome to Calendar.social, %(username)s!', username=current_user.username) }}
{% include 'month-view.html' %}
{% endblock content %} {% endblock content %}

View File

@ -0,0 +1,82 @@
<style>
table.calendar > * {
font-family: sans;
}
table.calendar {
width: 100%;
border-collapse: collapse;
}
tr.month > td {
text-align: center;
font-weight: bold;
border-bottom: 2px solid black;
padding-bottom: .5em;
}
tr.days > td {
text-align: center;
border-bottom: 2px solid black;
}
tr.week > td {
height: 3em;
}
tr.week > td > span.day-num {
font-weight: bold;
}
tr.week > td.other-month > span.day-num {
font-weight: normal;
color: #909090;
}
tr.week > td.today {
background-color: #d8d8d8;
}
td > div.event {
border: 1px solid green;
background-color: white;
border-radius: 2px;
}
</style>
<table class="calendar">
<thead>
<tr class="month">
<td colspan="7">{{ calendar.month }}</td>
</tr>
<tr class="days">
{% for day in calendar.day_names %}
<td>
{{ day }}
</td>
{% endfor %}
</tr>
</thead>
<tbody>
{% set markers = namespace() -%}
{% set markers.first = true -%}
{% for day in calendar.days -%}
{% if loop.index0 % (calendar.day_names) | length == 0 -%}
{% if not markers.first %}
</tr>
{%- else %}
{%- set markers.first = false %}
{%- endif %}
<tr class="week">
{%- endif %}
<td class="{% if day.month != calendar.timestamp.month %} other-month{% endif %}{% if day.date() == calendar.timestamp.date() %} today{% endif %}">
<span class="day-num">{{ day.day }}</span>
{% if day.date() == calendar.timestamp.date() %}
<div class="event">
This is a task
</div>
{% endif %}
</td>
{% endfor %}
</tr>
</tbody>
</table>