-
Notifications
You must be signed in to change notification settings - Fork 118
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add course info cards & calendars for runs #259
Changes from 5 commits
1be9fe1
3a8134b
26db395
d0d95e7
a8015ef
4ff0294
1dcc520
aa37852
b7c3db1
90f0820
d2fdef1
5147d58
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,63 @@ | ||
.calendar-card .card-header .year { | ||
color: #868e96; | ||
} | ||
|
||
table.calendar { | ||
border-spacing: 0.25em; | ||
border-collapse: separate; | ||
display: block; | ||
margin: 0.5em auto; | ||
} | ||
|
||
table.calendar tr { | ||
height: 4em; | ||
} | ||
|
||
table.calendar td, | ||
table.calendar th { | ||
width: 14.28%; | ||
min-width: 5em; | ||
height: 100%; | ||
background-color: rgba(0,0,0,.03); | ||
vertical-align: center; | ||
text-align: center; | ||
box-sizing: border-box; | ||
padding: 0; | ||
} | ||
|
||
table.calendar td.foreign-month { | ||
background-color: transparent; | ||
color: rgba(0,0,0,.1); | ||
} | ||
|
||
table.calendar td.no-event { | ||
color: #343a40; | ||
} | ||
|
||
table.calendar td.event { | ||
background-color: #3fb0ac; | ||
color: white; | ||
} | ||
|
||
table.calendar td.event a { | ||
display: flex; | ||
flex-direction: column; | ||
justify-content: center; | ||
width: 100%; | ||
height: 100%; | ||
padding: 0.5em; | ||
color: white; | ||
} | ||
|
||
table.calendar .session-number { | ||
display: block; | ||
} | ||
|
||
table.calendar .session-title { | ||
display: block; | ||
width: 4em; | ||
text-align: center; | ||
text-overflow: '…'; | ||
white-space: nowrap; | ||
overflow: hidden; | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -170,6 +170,11 @@ def __str__(self): | |
} | ||
|
||
|
||
@template_filter() | ||
def format_date(date, relative_to=None): | ||
return '{d.day}. {d.month}. {d.year}'.format(d=date) | ||
|
||
|
||
@template_filter() | ||
def format_date_range(start_and_end): | ||
start, end = start_and_end | ||
|
@@ -182,5 +187,10 @@ def format_date_range(start_and_end): | |
else: | ||
parts += ['{start.day}.'] | ||
parts += [' – '] | ||
parts += ['{end.day}. {end.month}. {end.year}'] | ||
parts += [format_date(end)] | ||
return ''.join(parts).format(start=start, end=end) | ||
|
||
@template_filter() | ||
def monthname(number): | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Any particular reason not to use the standard library? I don't mind hardocding this here, since it's not very likely the month names will change any time soon. However using LC_TIME will make easier to switch the entire website to let's say Slovak, if we ever want to do that. >>> import locale
>>> import calendar
>>> locale.setlocale(locale.LC_TIME, 'cs_CZ.utf-8')
'cs_CZ.utf-8'
>>> calendar.month_name[3].title()
'Březen' There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. That's a reasonable thing to say. But I don't trust locales. In practice I found locales frequently solve either too much or too litle. See for example naucse's function for formatting date ranges – building that on top of a locale "format a date for me" function would probably turn out quite fragile, so anyway you end up with some things based on locale and some hard-coded, which means some explicit and some implicit, and you anyway need to take each language into account separately, and... it's just a mess. Also, it's one more dependency: cs_CZ needs to be available on the target system. How do I ensure that? How do I test it? And, The flip side is that the site can only be translated by programmers (or a team that has a programmer). And I am fine with that, at least for now. There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Makes sense. As I said, I was just curious. |
||
return ('Leden', 'Únor', 'Březen', 'Duben', 'Květen', 'Červen', 'Červenec', | ||
'Srpen', 'Září', 'Říjen', 'Listopad', 'Prosinec')[number-1] |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,76 @@ | ||
{% extends '_base.html' %} | ||
|
||
{% block extra_links %} | ||
<link rel="stylesheet" href="{{url_for('static', filename='css/calendar.css')}}"> | ||
{% endblock extra_links%} | ||
|
||
{% block content %} | ||
|
||
<div class="page"> | ||
<section class="container"> | ||
|
||
|
||
<header class="lesson-header"> | ||
<a href="{{ url_for('index') }}">Nauč se Python </a> | ||
|
||
{% if course.vars['coach-present'] %} | ||
> <a href="{{ url_for('runs') }}">Kurzy</a> | ||
{% else %} | ||
> <a href="{{ url_for('courses') }}">Materiály</a> | ||
{% endif%} | ||
> <a href="{{ course_url(course) }}">{{ course.title }}</a> | ||
> Kalendář | ||
<hr> | ||
</header> | ||
|
||
<h1>{{ course.title }}</h1> | ||
|
||
{% if course.subtitle is defined and course.subtitle != None %} | ||
<h2>{{ course.subtitle }}</h2> | ||
{% endif%} | ||
|
||
{% if course.start_date %} | ||
{% for year, month in months %} | ||
<h3> | ||
{{ month | monthname }} <span class="year">{{ year }}</span> | ||
</h3> | ||
<table class="calendar"> | ||
{% for date in calendar.itermonthdates(year, month) %} | ||
{% if date.weekday() == 0 %}<tr>{% endif %} | ||
{% if date.month == month %} | ||
{% set session = sessions_by_date.get(date, None) %} | ||
{% if session %} | ||
<td class="event"> | ||
<a href="{{ url_for('session_coverpage', course=course, session=session.slug) }}" | ||
title="#{{ session.index+1 }} – {{ session.title }}"> | ||
<span class="session-number"> | ||
{{ date.day }}. {{ date.month }}. | ||
</span> | ||
<span class="session-title"> | ||
{{ session.title }} | ||
</span> | ||
</a> | ||
</td> | ||
{% else %} | ||
<td class="no-event"> | ||
{{ date.day }} | ||
</td> | ||
{% endif %} | ||
{% else %} | ||
<td class="foreign-month"> | ||
| ||
</td> | ||
{% endif %} | ||
{% if date.weekday() == 6 %}</tr>{% endif %} | ||
{% endfor %} | ||
</tr> | ||
</table> | ||
{% endfor %} | ||
{% else %} | ||
Tento kurz nemá kalendář. | ||
{% endif %} | ||
|
||
</section> | ||
</div> | ||
|
||
{% endblock content %} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I am wondering, if there possibly isn't already a function, that does this?
Now I don't know if this would be any better, faster or more readable (probably not). However when dealing with dates, I'd probably prefer to stick with the date type. (I know, those are in fact months...)
Anyway: please make it a function (regardless of the implementation). That would make it:
months_range(start_date, end_date)
)There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think
(year, month)
tuples are a natural representation here. Datetime objects don't offer much functionality for using them as months.I went with
list_months
; I didn't use “range” as the end date is included.