Finish migration

parent e72c1da9
...@@ -87,6 +87,9 @@ class EventCalenderJSSerializer(CalenderJSSerializer): ...@@ -87,6 +87,9 @@ class EventCalenderJSSerializer(CalenderJSSerializer):
pass pass
return "#616161" return "#616161"
def _text_color(self, instance):
return "#FFFFFF"
class UnpublishedEventSerializer(CalenderJSSerializer): class UnpublishedEventSerializer(CalenderJSSerializer):
""" """
......
...@@ -81,14 +81,15 @@ ...@@ -81,14 +81,15 @@
border-radius: 0; border-radius: 0;
border: none; border: none;
overflow: hidden; overflow: hidden;
transition-property: opacity;
.fc-content { .fc-content {
padding: 5px; padding: 5px;
transition: opacity 300ms ease-in-out 0s; transition: all 300ms ease-in-out 0s;
-moz-transition: opacity 300ms ease-in-out 0s; -moz-transition: all 300ms ease-in-out 0s;
-webkit-transition: opacity 300ms ease-in-out 0s; -webkit-transition: all 300ms ease-in-out 0s;
-o-transition: opacity 300ms ease-in-out 0s; -o-transition: all 300ms ease-in-out 0s;
} }
.fc-bg { .fc-bg {
......
var FC = $.fullCalendar; // a reference to FullCalendar's root namespace
var View = FC.View; // the class that all views must inherit from
var ListView; // our subclass
ListView = View.extend({
title: gettext("Upcoming Events"),
initialize: function () {
this.title = gettext("Upcoming Events");
}
computeTitle: function (d) {
return this.title;
},
fetchInitialEvents: function (dateProfile) {
var calendar = this.calendar;
var today = new Date();
return calendar.requestEvents(
calendar.msToMoment(Date.UTC(today.getFullYear(), today.getMonth(), today.getDate(), 0, 0, 0), false),
calendar.msToMoment(Date.UTC(today.getFullYear() + 2, today.getMonth(), today.getDate(), 0, 0, 0), false)
);
},
renderEvents: function (events) {
var root = $("<div>").addClass("accordion bordered");
events.sort(function (a, b) {
return a.start < b.start ? -1 : a.start > b.start ? 1 : 0;
});
if (events.length === 0) {
this.el.html('<div class="alert alert-info">' + gettext('No events planned in the selected period.') +'</div>');
}
for (var i = 0; i < events.length; i++) {
var e = events[i];
if (e.is_birthday) {
break;
}
var date = e.start.format('LLLL');
var eventCard = $("<div>").addClass("card mb-0");
var eventIndicator = $("<div>")
.addClass("event-indication")
.attr("style", "background-color: " + e.backgroundColor);
var cardHead = $("<div>").addClass("card-header collapsed")
.attr("data-toggle", "collapse")
.attr("data-target", "#event-content-" + i);
cardHead.append(eventIndicator);
cardHead.append("<div class=\"title\">" + e.title + " " +
"(<span class=\"date\">" + date + "</span>)</div>");
var cardContent = $("<div>")
.addClass("collapse")
.attr("id", "event-content-" + i);
var url = $("<a>")
.addClass("btn btn-primary")
.attr("href", e.url)
.attr("target", e.blank ? "_blank" : "_self")
.html(gettext("Go to event"));
var cardBody = $("<div>")
.addClass("card-body")
.html("<p>" + e.description + "</p>");
cardBody.append(url);
cardContent.append(cardBody);
eventCard.append(cardHead);
eventCard.append(cardContent);
root.append(eventCard);
this.el.html(root);
}
},
});
FC.views.list = ListView; // register our class with the view system
class ListView extends FullCalendar.View { class ListView extends FullCalendar.View {
renderSkeleton() {
// responsible for displaying the skeleton of the view within the already-defined
// this.el, an HTML element
console.log(this);
}
unrenderSkeleton() {
// should undo what renderSkeleton did
}
renderDates(dateProfile) {
// responsible for rendering the given dates
}
unrenderDates() {
// should undo whatever renderDates does
}
renderEvents(eventStore, eventUiHash) { renderEvents(eventStore, eventUiHash) {
const events = Object.values(eventStore.instances); const skeleton = document.createElement('div');
skeleton.id = 'fc-listview';
skeleton.classList.add('accordion', 'bordered');
var root = $("<div>").addClass("accordion bordered"); const locale = this.dateEnv.locale.codeArg;
const events = Object.values(eventStore.instances);
events.sort(function (a, b) { events.sort(function (a, b) {
return a.range.start < b.range.start ? -1 : return a.range.start < b.range.start ? -1 :
...@@ -31,70 +16,88 @@ class ListView extends FullCalendar.View { ...@@ -31,70 +16,88 @@ class ListView extends FullCalendar.View {
var alertEl = document.createElement('div'); var alertEl = document.createElement('div');
alertEl.id = 'fc-no-events'; alertEl.id = 'fc-no-events';
alertEl.classList.add('alert', 'alert-info'); alertEl.classList.add('alert', 'alert-info');
var text = document.createTextNode(gettext('No events planned in the selected period.')); alertEl.append(gettext('No events planned in the selected period.'));
alertEl.appendChild(text); this.el.append(alertEl);
this.el.appendChild(alertEl);
} }
for (let i = 0; i < events.length; i++) { for (let i = 0; i < events.length; i++) {
const instance = events[i]; const instance = events[i];
const def = eventStore.defs[instance.defId]; const def = eventStore.defs[instance.defId];
console.log(instance, def);
console.log(def.extendedProps);
if (def.extendedProps.isBirthday) { if (def.extendedProps.isBirthday) {
break; break;
} }
// var date = def.range.start.toLocaleString(); var date = instance.range.start.toLocaleDateString(locale, {
// console.log(def.range.start); hour: '2-digit',
minute: '2-digit',
// var eventCard = $("<div>").addClass("card mb-0"); day: 'numeric',
// month: 'long',
// var eventIndicator = $("<div>") weekday: 'long',
// .addClass("event-indication") year: 'numeric',
// .attr("style", "background-color: " + e.backgroundColor); hour12: false,
// var cardHead = $("<div>").addClass("card-header collapsed") });
// .attr("data-toggle", "collapse")
// .attr("data-target", "#event-content-" + i); const eventCard = document.createElement('div');
// eventCard.classList.add('card', 'mb-0');
// cardHead.append(eventIndicator);
// cardHead.append("<div class=\"title\">" + e.title + " " + const eventIndicator = document.createElement('div');
// "(<span class=\"date\">" + date + "</span>)</div>"); eventIndicator.classList.add('event-indication');
// eventIndicator.style = 'background-color: ' + def.ui.backgroundColor;
// var cardContent = $("<div>")
// .addClass("collapse") const cardHead = document.createElement('div');
// .attr("id", "event-content-" + i); cardHead.classList.add('card-header', 'collapsed');
// cardHead.dataset.toggle = 'collapse';
// var url = $("<a>") cardHead.dataset.target = '#event-content-' + i;
// .addClass("btn btn-primary")
// .attr("href", e.url) const cardTitle = document.createElement('div');
// .attr("target", e.blank ? "_blank" : "_self") cardTitle.classList.add('title');
// .html(gettext("Go to event")); const cardDate = document.createElement('span');
// cardDate.append(date);
// var cardBody = $("<div>") cardTitle.append(def.title + ' (');
// .addClass("card-body") cardTitle.append(cardDate);
// .html("<p>" + e.description + "</p>"); cardTitle.append(')');
// cardBody.append(url);
// cardHead.append(eventIndicator);
// cardContent.append(cardBody); cardHead.append(cardTitle);
// eventCard.append(cardHead);
// eventCard.append(cardContent); const cardContent = document.createElement('div');
// cardContent.classList.add('collapse');
// root.append(eventCard); cardContent.id = 'event-content-' + i;
// this.el.appendChild(root);
const url = document.createElement('a');
url.classList.add('btn', 'btn-primary');
url.href = def.url;
url.target = def.extendedProps.blank ? '_blank' : '_self';
url.append(gettext("Go to event"));
const cardBody = document.createElement('div');
cardBody.classList.add('card-body');
const cardBodyText = document.createElement('p');
cardBodyText.append(def.extendedProps.description);
cardBody.append(cardBodyText);
cardBody.append(url);
cardContent.append(cardBody);
eventCard.append(cardHead);
eventCard.append(cardContent);
skeleton.append(eventCard);
} }
this.el.append(skeleton);
} }
unrenderEvents() { unrenderEvents() {
const noEventsEl = document.getElementById('fc-no-events'); const noEventsEl = this.el.querySelector('#fc-no-events');
if (noEventsEl) { if (noEventsEl) {
noEventsEl.remove(); noEventsEl.remove();
} }
// should undo whatever renderEvents does
}
const listView = this.el.querySelector('#fc-listview');
if (listView) {
listView.remove();
}
}
} }
const listViewPlugin = FullCalendar.createPlugin({ const listViewPlugin = FullCalendar.createPlugin({
......
This diff is collapsed.
const BIRTHDAYS_COOKIE = 'showbirthdays';
const VIEW_COOKIE = 'calendarview';
const SOURCES = {
events: {
id: 'event',
url: '/api/v1/events/calendarjs/',
},
birthdays: {
id: 'birthdays',
url: '/api/v1/members/birthdays/',
},
partners: {
id: 'partners',
url: '/api/v1/partners/calendarjs/',
},
unpublished: {
id: 'unpublished',
url: '/api/v1/events/unpublished/',
},
};
function checkResponsiveState(calendar, windowWidth, view) {
var buttonText = gettext('show birthdays');
if (calendar.getEventSourceById(SOURCES.birthdays.id)) {
calendar.getEventSourceById(SOURCES.birthdays.id).remove();
}
if (windowWidth <= 768) {
calendar.setOption('header', {
right: ''
});
} else {
if (view.type === 'list') {
calendar.setOption('header', {
right: 'list,timeGridWeek,dayGridMonth'
});
} else {
if (Cookies.get(BIRTHDAYS_COOKIE)) {
calendar.addEventSource(SOURCES.birthdays);
buttonText = gettext('hide birthdays');
}
calendar.setOption('header', {
right: 'showBirthdays, list,timeGridWeek,dayGridMonth prev,next today'
});
}
}
$('.fc-showBirthdays-button').html(buttonText);
}
document.addEventListener('DOMContentLoaded', function () {
const calendarEl = document.getElementById('calendar');
const showUnpublished = calendarEl.dataset['show-unpublished'];
let defaultDate = calendarEl.dataset['default-date'];
const isAuthenticated = calendarEl.dataset.authenticated;
const language = calendarEl.dataset.language;
const eventSources = [SOURCES.events, SOURCES.partners];
if (showUnpublished) {
eventSources.push(SOURCES.unpublished);
}
if (Cookies.get(BIRTHDAYS_COOKIE)) {
eventSources.push(SOURCES.birthdays);
}
let tmpView = ($(window).width() < 979) ? 'list' : 'timeGridWeek';
if (Cookies.get(VIEW_COOKIE) !== undefined) {
tmpView = Cookies.get(VIEW_COOKIE);
}
if (window.location.hash.indexOf('date') > -1) {
defaultDate = window.location.hash.substr(window.location.hash.indexOf('date') + 5, 24);
}
const calendar = new FullCalendar.Calendar(calendarEl, {
plugins: ['timeGrid', 'dayGrid', 'bootstrap', listViewPlugin],
aspectRatio: 1.8,
themeSystem: 'bootstrap',
defaultView: tmpView,
defaultDate: defaultDate,
eventSources: eventSources,
firstDay: 1,
scrollTime: '14:00:00',
eventTimeFormat: {
hour: '2-digit',
minute: '2-digit',
hour12: false,
},
eventLimit: true,
locale: language,
nowIndicator: true,
views: {
list: {
buttonText: gettext('list'),
duration: { years: 5 },
type: 'list',
titleFormat: function() { return gettext("Upcoming Events") },
}
},
customButtons:
isAuthenticated ? {
showBirthdays: {
text: Cookies.get(BIRTHDAYS_COOKIE) ? gettext('hide birthdays') : gettext('show birthdays'),
click: function (e) {
if (Cookies.get(BIRTHDAYS_COOKIE)) {
e.target.innerHTML = gettext('show birthdays');
Cookies.remove(BIRTHDAYS_COOKIE);
calendar.getEventSourceById(SOURCES.birthdays.id).remove();
} else {
e.target.innerHTML = gettext('hide birthdays');
Cookies.set(BIRTHDAYS_COOKIE, 1);
calendar.addEventSource(SOURCES.birthdays);
}
}
}
} : {},
header: {
right: 'showBirthdays, list,timeGridWeek,dayGridMonth prev,next today'
},
eventClick: function (info) {
console.log(info);
// if (event.url && event.blank) {
// // window.open(event.url, '_blank');
// return false;
// } else if (event.url) {
// // window.replace(event.url);
// return false;
// }
},
eventRender: function (info) {
info.el.setAttribute(
'title', info.event.extendedProps.description);
},
viewSkeletonRender: function (info) {
const view = info.view;
const prevView = Cookies.get(VIEW_COOKIE);
const date = calendar.getDate();
window.location.hash = 'date=' + date.toISOString() + '&view=' + view.type;
if (view.type !== prevView) {
const windowWidth = $(window).width();
Cookies.set(VIEW_COOKIE, view.type);
checkResponsiveState(calendar, windowWidth, view);
}
},
datesRender: function (info) {
const date = calendar.getDate();
window.location.hash = 'date=' + date.toISOString() + '&view=' + info.view.type;
},
windowResize: function () {
const windowWidth = $(window).width();
const view = (windowWidth <= 768) ? 'list' : Cookies.get(VIEW_COOKIE);
const currentView = calendar.view;
if (view !== currentView.type) {
calendar.changeView(view);
} else {
checkResponsiveState(calendar, windowWidth, currentView);
}
}
});
calendar.render();
if (calendar.view.type !== tmpView) {
calendar.changeView(tmpView);
} else {
var windowWidth = $(window).width();
checkResponsiveState(calendar, windowWidth, calendar.view);
}
});
...@@ -78,6 +78,6 @@ ...@@ -78,6 +78,6 @@
<script type="text/javascript" <script type="text/javascript"
src="{% static "events/js/listview.js" %}"></script> src="{% static "events/js/listview.js" %}"></script>
<script type="text/javascript" <script type="text/javascript"
src="{% static "events/js/new.js" %}"></script> src="{% static "events/js/main.js" %}"></script>
{% endcompress %} {% endcompress %}
{% endblock js_body %} {% endblock js_body %}
...@@ -2,12 +2,10 @@ ...@@ -2,12 +2,10 @@
import hmac import hmac
from _sha1 import sha1 from _sha1 import sha1
from base64 import urlsafe_b64decode, urlsafe_b64encode from base64 import urlsafe_b64decode, urlsafe_b64encode
from datetime import datetime
from django.conf import settings from django.conf import settings
from django.template.defaultfilters import urlencode from django.template.defaultfilters import urlencode
from django.utils import timezone, dateparse from django.utils import timezone, dateparse
from pytz import InvalidTimeError
from rest_framework.exceptions import ParseError from rest_framework.exceptions import ParseError
...@@ -73,7 +71,6 @@ def extract_date_range(request, allow_empty=False): ...@@ -73,7 +71,6 @@ def extract_date_range(request, allow_empty=False):
default_value = None default_value = None
start = request.query_params.get('start', default_value) start = request.query_params.get('start', default_value)
print(start)
start = dateparse.parse_datetime(start) start = dateparse.parse_datetime(start)
if not timezone.is_aware(start): if not timezone.is_aware(start):
start = timezone.make_aware(start) start = timezone.make_aware(start)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment