com: improve news page

Signed-off-by: Skia <skia@libskia.so>
This commit is contained in:
Skia 2017-09-25 20:14:20 +02:00
parent a2dc00f4e5
commit cda89d66cd
5 changed files with 284 additions and 91 deletions

View File

@ -6,85 +6,121 @@
{% block content %} {% block content %}
<div id="news"> <div id="news">
<h3>{% trans %}News{% endtrans %}</h3>
{% if user.is_in_group(settings.SITH_GROUP_COM_ADMIN_ID) %} {% if user.is_in_group(settings.SITH_GROUP_COM_ADMIN_ID) %}
<a href="{{ url('com:news_admin_list') }}">{% trans %}Administrate news{% endtrans %}</a> <div id="news_admin">
<a href="{{ url('com:news_admin_list') }}">{% trans %}Administrate news{% endtrans %}</a>
</div>
{% endif %} {% endif %}
<div id="agenda"> <div id="right_column" class="news_column">
<div id="agenda_title">{% trans %}Agenda{% endtrans %}</div> <div id="agenda">
<div id="agenda_content"> <div id="agenda_title">{% trans %}Agenda{% endtrans %}</div>
{% for d in NewsDate.objects.filter(end_date__gte=timezone.now(), <div id="agenda_content">
news__is_moderated=True, news__type__in=["WEEKLY", {% for d in NewsDate.objects.filter(end_date__gte=timezone.now(),
"EVENT"]).order_by('start_date', 'end_date') %} news__is_moderated=True, news__type__in=["WEEKLY",
<div class="agenda_item"> "EVENT"]).order_by('start_date', 'end_date') %}
<div class="agenda_date"> <div class="agenda_item">
<strong>{{ d.start_date|localtime|date('D d M Y') }}</strong> <div class="agenda_date">
</div> <strong>{{ d.start_date|localtime|date('D d M Y') }}</strong>
<div class="agenda_time"> </div>
<span>{{ d.start_date|localtime|time(DATETIME_FORMAT) }}</span> - <div class="agenda_time">
<span>{{ d.end_date|localtime|time(DATETIME_FORMAT) }}</span> <span>{{ d.start_date|localtime|time(DATETIME_FORMAT) }}</span> -
</div> <span>{{ d.end_date|localtime|time(DATETIME_FORMAT) }}</span>
<div> </div>
<strong><a href="{{ url('com:news_detail', news_id=d.news.id) }}">{{ d.news.title }}</a></strong> <div>
<a href="{{ d.news.club.get_absolute_url() }}">{{ d.news.club }}</a> <strong><a href="{{ url('com:news_detail', news_id=d.news.id) }}">{{ d.news.title }}</a></strong>
</div> <a href="{{ d.news.club.get_absolute_url() }}">{{ d.news.club }}</a>
<div class="agenda_item_content">{{ d.news.summary|markdown }}</div> </div>
</div> <div class="agenda_item_content">{{ d.news.summary|markdown }}</div>
{% endfor %} </div>
</div> {% endfor %}
</div>
</div>
</div> </div>
{% for news in object_list.filter(type="NOTICE") %}
<section class="news_notice"> <div id="left_column" class="news_column">
<h4> <a href="{{ url('com:news_detail', news_id=news.id) }}">{{ news.title }}</a></h4>
<p>{{ news.summary|markdown }}</p> {% for news in object_list.filter(type="NOTICE") %}
</section> <section class="news_notice">
{% endfor %} <h4><a href="{{ url('com:news_detail', news_id=news.id) }}">{{ news.title }}</a></h4>
{% for news in object_list.filter(dates__start_date__lte=timezone.now(), dates__end_date__gte=timezone.now(), type="CALL") %} <div class="news_content">{{ news.summary|markdown }}</div>
<section class="news_call"> </section>
<h4> <a href="{{ url('com:news_detail', news_id=news.id) }}">{{ news.title }}</a></h4> {% endfor %}
<p class="news_date">
<span>{{ news.dates.first().start_date|localtime|date(DATETIME_FORMAT) }} {% for news in object_list.filter(dates__start_date__lte=timezone.now(),
{{ news.dates.first().start_date|localtime|time(DATETIME_FORMAT) }}</span> - dates__end_date__gte=timezone.now(), type="CALL") %}
<span>{{ news.dates.first().end_date|localtime|date(DATETIME_FORMAT) }} <section class="news_call">
{{ news.dates.first().end_date|localtime|time(DATETIME_FORMAT) }}</span> <h4> <a href="{{ url('com:news_detail', news_id=news.id) }}">{{ news.title }}</a></h4>
</p> <div class="news_date">
<p>{{ news.summary|markdown }}</p> <span>{{ news.dates.first().start_date|localtime|date(DATETIME_FORMAT) }}
</section> {{ news.dates.first().start_date|localtime|time(DATETIME_FORMAT) }}</span> -
{% endfor %} <span>{{ news.dates.first().end_date|localtime|date(DATETIME_FORMAT) }}
<hr> {{ news.dates.first().end_date|localtime|time(DATETIME_FORMAT) }}</span>
<h4>{% trans %}Events today and the next few days{% endtrans %}</h4> </div>
{% for d in NewsDate.objects.filter(end_date__gte=timezone.now(), start_date__lte=timezone.now()+timedelta(days=5), <div class="news_content">{{ news.summary|markdown }}</div>
news__type="EVENT", news__is_moderated=True).datetimes('start_date', 'day') %} </section>
<h5 class="news_date">{{ d|localtime|date(DATETIME_FORMAT) }}</h5> {% endfor %}
{% for news in object_list.filter(dates__start_date__gte=d, dates__start_date__lte=d+timedelta(days=1),
type="EVENT").exclude(dates__end_date__lt=timezone.now()) %} {% set events_dates = NewsDate.objects.filter(end_date__gte=timezone.now(), start_date__lte=timezone.now()+timedelta(days=5),
<section class="news_event"> news__type="EVENT", news__is_moderated=True).datetimes('start_date', 'day') %}
<h4> <a href="{{ url('com:news_detail', news_id=news.id) }}">{{ news.title }}</a></h4> <h3>{% trans %}Events today and the next few days{% endtrans %}</h3>
<p class="news_date"> {% if events_dates %}
<span>{{ news.dates.first().start_date|localtime|date(DATETIME_FORMAT) }} {% for d in events_dates %}
{{ news.dates.first().start_date|localtime|time(DATETIME_FORMAT) }}</span> - <div class="news_events_group">
<span>{{ news.dates.first().end_date|localtime|date(DATETIME_FORMAT) }} <div class="news_events_group_date">
{{ news.dates.first().end_date|localtime|time(DATETIME_FORMAT) }}</span> <div>
</p> <div>{{ d|localtime|date('D') }}</div>
<p><a href="{{ news.club.get_absolute_url() }}">{{ news.club }}</a></p> <div class="day">{{ d|localtime|date('d') }}</div>
<p>{{ news.summary|markdown }}</p> <div>{{ d|localtime|date('b') }}</div>
</section> </div>
{% endfor %} </div>
<hr> <div class="news_events_group_items">
{% endfor %} {% for news in object_list.filter(dates__start_date__gte=d,
<h4>{% trans %}Coming soon... don't miss!{% endtrans %}</h4> dates__start_date__lte=d+timedelta(days=1),
{% for news in object_list.filter(dates__start_date__gte=timezone.now()+timedelta(days=5), type="EVENT", is_moderated=True) %} type="EVENT").exclude(dates__end_date__lt=timezone.now())
<section> .order_by('dates__start_date') %}
<h4> <a href="{{ url('com:news_detail', news_id=news.id) }}">{{ news.title }}</a> <section class="news_event">
<span class="news_date">{{ news.dates.first().start_date|localtime|date(DATETIME_FORMAT) }} <div class="club_logo">
{{ news.dates.first().start_date|localtime|time(DATETIME_FORMAT) }} - {% if news.club.logo %}
{{ news.dates.first().end_date|localtime|date(DATETIME_FORMAT) }} <img src="{{ news.club.logo.url }}" alt="{{ news.club }}" />
{{ news.dates.first().end_date|localtime|time(DATETIME_FORMAT) }}</span> {% else %}
</h4> <img src="{{ static("com/img/news.png") }}" alt="{{ news.club }}" />
</section> {% endif %}
{% endfor %} </div>
<h4> <a href="{{ url('com:news_detail', news_id=news.id) }}">{{ news.title }}</a></h4>
<div><a href="{{ news.club.get_absolute_url() }}">{{ news.club }}</a></div>
<div class="news_date">
<span>{{ news.dates.first().start_date|localtime|time(DATETIME_FORMAT) }}</span> -
<span>{{ news.dates.first().end_date|localtime|time(DATETIME_FORMAT) }}</span>
</div>
<div class="news_content">{{ news.summary|markdown }}</div>
</section>
{% endfor %}
</div>
</div>
{% endfor %}
{% else %}
<div class="news_empty">
<em>{% trans %}Nothing to come...{% endtrans %}</em>
</div>
{% endif %}
{% set coming_soon = object_list.filter(dates__start_date__gte=timezone.now()+timedelta(days=5),
type="EVENT").order_by('dates__start_date') %}
{% if coming_soon %}
<h3>{% trans %}Coming soon... don't miss!{% endtrans %}</h3>
{% for news in coming_soon %}
<section class="news_coming_soon">
<a href="{{ url('com:news_detail', news_id=news.id) }}">{{ news.title }}</a>
<span class="news_date">{{ news.dates.first().start_date|localtime|date(DATETIME_FORMAT) }}
{{ news.dates.first().start_date|localtime|time(DATETIME_FORMAT) }} -
{{ news.dates.first().end_date|localtime|date(DATETIME_FORMAT) }}
{{ news.dates.first().end_date|localtime|time(DATETIME_FORMAT) }}</span>
</section>
{% endfor %}
{% endif %}
</div>
</div> </div>
{% endblock %} {% endblock %}

View File

@ -43,7 +43,7 @@ from datetime import timedelta
from com.models import Sith, News, NewsDate, Weekmail, WeekmailArticle from com.models import Sith, News, NewsDate, Weekmail, WeekmailArticle
from core.views import CanViewMixin, CanEditMixin, CanEditPropMixin, TabedViewMixin, CanCreateMixin, QuickNotifMixin from core.views import CanViewMixin, CanEditMixin, CanEditPropMixin, TabedViewMixin, CanCreateMixin, QuickNotifMixin
from core.views.forms import SelectDateTime from core.views.forms import SelectDateTime
from core.models import Notification, RealGroup from core.models import Notification, RealGroup, User
from club.models import Club, Mailing from club.models import Club, Mailing
@ -277,6 +277,7 @@ class NewsAdminListView(CanEditMixin, ListView):
class NewsListView(CanViewMixin, ListView): class NewsListView(CanViewMixin, ListView):
model = News model = News
template_name = 'com/news_list.jinja' template_name = 'com/news_list.jinja'
queryset = News.objects.filter(is_moderated=True)
def get_context_data(self, **kwargs): def get_context_data(self, **kwargs):
kwargs = super(NewsListView, self).get_context_data(**kwargs) kwargs = super(NewsListView, self).get_context_data(**kwargs)

View File

@ -542,6 +542,12 @@ Welcome to the wiki page!
friday += timedelta(hours=6) friday += timedelta(hours=6)
friday.replace(hour=20, minute=0, second=0) friday.replace(hour=20, minute=0, second=0)
# Event # Event
n = News(title="Apero barman", summary="Viens boire un coup avec les barmans",
content="Glou glou glou glou glou glou glou" , type="EVENT",
club=bar_club, author=subscriber, is_moderated=True, moderator=skia)
n.save()
NewsDate(news=n, start_date=timezone.now()+timedelta(hours=70),
end_date=timezone.now()+timedelta(hours=72)).save()
n = News(title="Repas barman", summary="Enjoy la fin du semestre!", n = News(title="Repas barman", summary="Enjoy la fin du semestre!",
content="Viens donc t'enjailler avec les autres barmans aux " content="Viens donc t'enjailler avec les autres barmans aux "
"frais du BdF! \o/", type="EVENT", club=bar_club, "frais du BdF! \o/", type="EVENT", club=bar_club,
@ -549,6 +555,13 @@ Welcome to the wiki page!
n.save() n.save()
NewsDate(news=n, start_date=timezone.now()+timedelta(hours=72), NewsDate(news=n, start_date=timezone.now()+timedelta(hours=72),
end_date=timezone.now()+timedelta(hours=84)).save() end_date=timezone.now()+timedelta(hours=84)).save()
n = News(title="Repas fromager", summary="Wien manger du l'bon fromeug'",
content="Fô viendre mangey d'la bonne fondue!",
type="EVENT", club=bar_club, author=subscriber,
is_moderated=True, moderator=skia)
n.save()
NewsDate(news=n, start_date=timezone.now()+timedelta(hours=96),
end_date=timezone.now()+timedelta(hours=100)).save()
n = News(title="SdF", summary="Enjoy la fin des finaux!", n = News(title="SdF", summary="Enjoy la fin des finaux!",
content="Viens faire la fête avec tout plein de gens!", content="Viens faire la fête avec tout plein de gens!",
type="EVENT", club=bar_club, author=subscriber, type="EVENT", club=bar_club, author=subscriber,

BIN
core/static/com/img/news.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -339,23 +339,42 @@ header {
} }
} }
} }
/*---------------------------------NEWS--------------------------------*/ /*---------------------------------NEWS--------------------------------*/
#news { #news {
section { .news_column {
padding: 5px; display: inline-block;
margin: 0px;
vertical-align: top;
} }
section.news_call, section.news_notice { #news_admin {
background: lightgrey; margin-bottom: 1em;
margin: 2px;
} }
section.news_event:nth-of-type(even) { #right_column {
background: lightblue;
}
#agenda {
box-shadow: $black-color 2px 2px 2px;
display: block;
width: 20%; width: 20%;
float: right; float: right;
}
#left_column {
width: 79%;
h3 {
background: $second-color;
box-shadow: grey 2px 2px 2px;
padding: 0.4em;
margin: 0em 0em 0.5em 0em;
text-transform: uppercase;
font-size: 1.1em;
border: solid 1px black;
&:last-of-type {
margin: 2em 0em 1em 0em;
}
}
}
/* AGENDA */
#agenda {
box-shadow: grey 2px 2px 2px;
display: block;
width: 100%;
background: white; background: white;
font-size: 70%; font-size: 70%;
border: solid 1px $black-color; border: solid 1px $black-color;
@ -368,7 +387,6 @@ header {
text-transform: uppercase; text-transform: uppercase;
border-bottom: solid 1px $black-color; border-bottom: solid 1px $black-color;
background: $second-color; background: $second-color;
} }
#agenda_content { #agenda_content {
overflow: auto; overflow: auto;
@ -391,11 +409,136 @@ header {
} }
} }
} }
.news_weekly p { /* END AGENDA */
margin: 0.2em;
/* EVENTS TODAY AND NEXT FEW DAYS */
.news_events_group {
border: solid 1px black;
box-shadow: grey 2px 2px 2px;
margin-left: 1em;
margin-bottom: 0.5em;
.news_events_group_date {
display: table-cell;
padding: 0.6em;
vertical-align: middle;
background: $primary-dark-color;
color: $white-color;
text-transform: uppercase;
text-align: center;
font-weight: bold;
font-family: monospace;
font-size: 1.4em;
div {
margin: 0px auto;
.day {
font-size: 1.5em;
}
}
}
.news_events_group_items {
display: table-cell;
width: 100%;
border-left: solid 1px black;
.news_event:nth-of-type(odd) {
background: white;
}
.news_event:nth-of-type(even) {
background: $primary-neutral-light-color;
}
.news_event {
display: block;
padding: 0.4em;
&:not(:last-child) {
border-bottom: 1px solid grey;
}
div {
margin: 0.2em;
}
h4 {
margin-top: 1em;
text-transform: uppercase;
}
.club_logo {
float: left;
width: 7em;
margin: 0em;
margin-right: 1em;
margin-bottom: 0.8em;
img {
max-height: 6em;
display: block;
margin: 0em auto;
}
}
.news_date {
font-size: 100%;
}
.news_content {
clear: left;
}
}
}
}
/* END EVENTS TODAY AND NEXT FEW DAYS */
/* COMING SOON */
.news_coming_soon {
display: list-item;
list-style-type: square;
list-style-position: inside;
margin-left: 1em;
padding-left: 0em;
a {
font-weight: bold;
text-transform: uppercase;
}
.news_date {
font-size: 0.9em;
}
}
/* END COMING SOON */
/* NOTICES */
.news_notice {
margin: 0em 0em 1em 1em;
padding: 0.4em;
padding-left: 1em;
background: lightgrey;
border: 1px solid grey;
box-shadow: grey 2px 2px 2px;
h4 {
margin: 0em;
}
.news_content {
margin-left: 1em;
}
}
/* END NOTICES */
/* CALLS */
.news_call {
margin: 0em 0em 1em 1em;
padding: 0.4em;
padding-left: 1em;
background: $secondary-neutral-light-color;
border: 1px solid grey;
box-shadow: grey 2px 2px 2px;
h4 {
margin: 0em;
}
.news_date {
font-size: 0.9em;
}
.news_content {
margin-left: 1em;
}
}
/* END CALLS */
.news_empty {
margin-left: 1em;
} }
.news_date { .news_date {
font-size: small;
color: grey; color: grey;
} }
} }
@ -473,7 +616,7 @@ h6 {
} }
p, pre { p, pre {
margin-top: 1em; margin-top: 0.8em;
margin-left: 0px; margin-left: 0px;
} }