Add template, form and view for Volunteer create.

pyconbalkan/core/static/css/components/datepicker.css

@@ -0,0 +1,10 @@
+.ui-datepicker {
+	background-color: #32383A;
+	border: 1px solid #66AFE9;
+	border-radius: 4px;
+	box-shadow: 0 0 8px rgba(102,175,233,.6);
+	display: none;
+	margin-top: 4px;
+	padding: 10px;
+	width: 240px;
+}

pyconbalkan/core/static/js/volunteer.js

@@ -0,0 +1,5 @@
+$( ".datepicker" ).datepicker({
+  changeMonth: true,
+  changeYear: true,
+  yearRange: "1900:2018"
+});

pyconbalkan/core/templates/base.html

@@ -24,6 +24,7 @@
     <link rel="stylesheet" href="{% static 'css/_fonts.css' %}">
     <link rel="stylesheet" href="{% static 'css/components/event-sidebar.css' %}">
     <link rel="stylesheet" href="{% static 'css/components/page.css' %}">
+    <link rel="stylesheet" href="{% static 'css/components/datepicker.css' %}">
     <link rel="stylesheet" href="{% static 'css/components/post.css' %}">
     <link rel="stylesheet" href="{% static 'css/components/title.css' %}">
     <link rel="stylesheet" href="{% static 'css/components/button.css' %}">

pyconbalkan/core/templates/includes/event_sidebar.html

@@ -21,6 +21,7 @@ <h1>#1</h1>
     </p>
     <div class="event-button__wrapper">
         <a class="button button--yellow mb-xs-40 event-button" href="https://www.eventbrite.com/e/pycon-balkan-tickets-46608685834" target="_blank" role="button">Join Us!</a>
+        <a class="button button--yellow mb-xs-40 event-button" href="{% url 'volunteer_create' %}">Volunteer!</a>
     </div>
     <div class="social__links mb-xs-20">
 	<a href="https://www.facebook.com/pyconblkn/" class="facebook" target="_blank"></a>

pyconbalkan/organizers/forms.py

@@ -0,0 +1,22 @@
+from django import forms
+
+from pyconbalkan.organizers.models import Volunteer
+
+
+class VolunteerCreateForm(forms.ModelForm):
+
+    def __init__(self, **kwargs):
+        super().__init__(**kwargs)
+
+        # delete labels, add form-control class to all fields
+        for f in self.fields.values():
+            old_classes = f.widget.attrs['class'] if 'class' in f.widget.attrs else ''
+            f.widget.attrs.update({'placeholder': f.label, 'class': f'{old_classes} form-control'})
+            f.label = ''
+
+    class Meta:
+        model = Volunteer
+        exclude = ('active', 'user', 'weight', 'type', 'slug', 'description', )
+        widgets = {
+            'date_of_birth': forms.DateInput(attrs={'class': 'datepicker'}),
+        }

pyconbalkan/organizers/templates/volunteers_create.html

@@ -0,0 +1,32 @@
+{% extends 'base.html' %}
+{% load static %}
+
+{% block main_content %}
+    <h1 class="title title--yellow mb-xs-40">Sign up as a Volunteer!</h1>
+    <hr class="line line--blue line--short line--spaced">
+
+    {% if success %}
+        <h2 class="success-message">
+            {{ success }}
+        </h2>
+    {% endif %}
+
+    <form class="form" action="{% url 'volunteer_create' %}" method="POST"
+          enctype="multipart/form-data" novalidate>
+        <div class="form-group">
+            {% csrf_token %}
+            {{ form.as_p }}
+            <input class="button button--blue button--push button--fullwidth " type="submit"
+                   value="Submit"/>
+        </div>
+    </form>
+
+{% endblock main_content %}
+
+
+{% block scripts %}
+    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"
+            integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU="
+            crossorigin="anonymous"></script>
+    <script src="{% static 'js/volunteer.js' %}" type="text/javascript"></script>
+{% endblock %}

pyconbalkan/organizers/views.py

@@ -2,6 +2,7 @@
 from rest_framework import viewsets
 
 from pyconbalkan.conference.models import Conference
+from pyconbalkan.organizers.forms import VolunteerCreateForm
 from pyconbalkan.organizers.models import Volunteer
 from pyconbalkan.organizers.serializers import VolunteerSerializer
 
@@ -28,4 +29,21 @@ def organizers_listview(request):
         'organizers': organizers,
         'conference': conference.first() if conference else None,
     }
-    return render(request, 'organizers.html', context)
+    return render(request, 'organizers.html', context)
+
+
+def volunteer_createview(request):
+    context = {}
+
+    if request.method == 'POST':
+        form = VolunteerCreateForm(data=request.POST)
+        if form.is_valid():
+            volunteer = form.save()
+            context['success'] = f'{volunteer.full_name}, you have been successfully signed up ' \
+                                 f'as a volunteer! Thank you!'
+            form = VolunteerCreateForm()
+    else:
+        form = VolunteerCreateForm()
+
+    context['form'] = form
+    return render(request, 'volunteers_create.html', context)

pyconbalkan/urls.py

@@ -10,7 +10,7 @@
 from pyconbalkan.contact.views import contact_view
 from pyconbalkan.news.views import *
 from pyconbalkan.speaker.views import *
-from pyconbalkan.organizers.views import organizer_view, organizers_listview
+from pyconbalkan.organizers.views import organizer_view, organizers_listview, volunteer_createview
 from pyconbalkan.coc.views import coc_view, response_guide
 from pyconbalkan.sponsors.views import sponsor_view
 from pyconbalkan.organizers.api_urls import router as organizers
@@ -44,6 +44,7 @@
     path('robots.txt', TemplateView.as_view(template_name='robots.txt', content_type='text/plain')),
     path('organizers/<slug:slug>/', organizer_view, name='organizer_detail'),
     path('organizers', organizers_listview, name='organizers'),
+    path('volunteer/create/', volunteer_createview, name='volunteer_create'),
     path('about', about_view, name='about'),
     path('contact', contact_view, name='contact'),
     path('cfp', cfp_view, name='cfp'),