Added modal for events and Eventform

ourcalendar/models.py

@@ -1,5 +1,7 @@
 from django.utils import timezone
 from django.db import models
+from django.forms import ModelForm
+from django import forms
 
 
 class User(models.Model):
@@ -23,4 +25,25 @@ class Event(models.Model):
     users = models.ManyToManyField(User)
 
 
+class EventForm(ModelForm):
+    title = forms.CharField(max_length=200, help_text="Event title:")
+    start = forms.DateTimeField(help_text="Start time:")
+    end = forms.DateTimeField(required=False, help_text="End time:")
+    location = forms.CharField(max_length=200, required=False, help_text="Location")
+    description = forms.CharField(max_length=600, required=False, help_text="Description")
+    # gives it all calendars for now...
+    calendar = forms.ModelChoiceField(queryset=Calendar.objects.all(), empty_label="Select Calendar:")
+    # not sure if below correct...using queryset=User.objects.all() gave errors.
+    users = forms.MultipleChoiceField(choices=User.objects.all(), required=False)
+
+    class Meta:
+        model = Event
+        fields = '__all__'   # grabs all the fields.
+
+
+class CalendarForm(ModelForm):
+
+    class Meta:
+        model = Calendar
+        fields = '__all__'
 

ourcalendar/static/ourcalendar/js/events.js

@@ -17,6 +17,7 @@
                     $(prevClick).css('background-color', 'white');
                 $(this).css('background-color', 'rgba(204,255,249,0.3)');
                 prevClick = this;
+                $("#myModal").modal('show');
             },
             eventClick: function(event) {
                 alert('Location: ' + event.location + '\nDescription: ' + event.description);

ourcalendar/templates/ourcalendar/calendar.jinja

@@ -6,4 +6,27 @@
 
 {% block content %}
     <div id='calendar'></div>
+    <div id="myModal" class="modal fade">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+                <h4 class="modal-title">Event Creation</h4>
+            </div>
+            <div class="modal-body">
+
+                <!--INSERT THE FORM HERE -->
+
+
+                <p>Do you want to save your event?</p>
+                <p class="text-warning"><small>If you don't save, your changes will be lost.</small></p>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+                <button type="button" class="btn btn-primary">Save changes</button>
+            </div>
+        </div>
+    </div>
+</div>
+
 {% endblock %}