fix Create_Game/Change Game Settings timezone issues

app/main/forms.py

@@ -22,6 +22,9 @@ class CreateGameForm(FlaskForm):
 
     def validate_end_time(self, end_time):
         self.date_time_validator(self.end_time_disabled, end_time)
+        if self.start_time.data and end_time.data:
+            if self.start_time.data > end_time.data:
+                raise ValidationError('Start Time must be before End Time.')
 
     def date_time_validator(self, disabled, date_time):
         print(1)

app/main/routes.py

@@ -12,7 +12,7 @@ from sqlalchemy import and_
 
 from app import db
 from app.main import bp
-from app.utils import generate_qr_code, serve_pil_image
+from app.utils import generate_qr_code, serve_pil_image, flash_errors
 from app.models import User, Game, Role, GamePlayer, GameState, Objective, ObjectiveMinimalEncoder,\
                        LocationEncoder, PlayerCaughtPlayer, Review, Location
 from app.main.forms import CreateGameForm, ObjectiveForm, PlayerAddForm, UserCreateForm, \
@@ -48,6 +48,8 @@ def create_game():
         db.session.commit()
         flash(f"'{game.name}' had been created!")
         return redirect(url_for('main.game_dashboard', game_name=game.name))
+    else:
+        flash_errors(form)
     return render_template('create_game.html', title='Create Game', form=form)
 
 @bp.route('/game/<game_name>/change_settings', methods=['GET', 'POST'])
@@ -85,6 +87,8 @@ def change_game_settings(game_name):
         db.session.commit()
         flash(f"'{game.name}' had been updated!")
         return redirect(url_for('main.game_dashboard', game_name=game.name))
+    else:
+        flash_errors(form)
     return render_template('create_game.html', title='Chage Game Settings', form=form)
 
 @bp.route('/game/<game_name>/delete')

app/templates/create_game.html

@@ -55,9 +55,7 @@
 <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>
 <script type="text/javascript">
     $(function () {
-        
-
-        var date = moment()
+        $('#timezone')[0].value = moment.tz.guess();
         $('#datetimepicker_start').datetimepicker({
             //useCurrent: false, //Important! See issue #1075
             locale: 'en-gb',
@@ -67,10 +65,6 @@
             defaultDate: null,
             timeZone: moment.tz.guess()
         });
-        '{% if not form.start_time_disabled.data and not form.start_time %}'
-            $('#datetimepicker_start')[0].value = date.format('DD-MM-YYYY HH:mm');
-            date.add(1, 'hour');
-        '{% endif %}'
         $('#datetimepicker_end').datetimepicker({
             //useCurrent: false, //Important! See issue #1075
             locale: 'en-gb',
@@ -80,9 +74,6 @@
             defaultDate: null,
             timeZone: moment.tz.guess()
         });
-        '{% if not form.end_time_disabled.data and not form.end_time %}'
-            $('#datetimepicker_end')[0].value = date.format('DD-MM-YYYY HH:mm');
-        '{% endif %}'
         
         $("#datetimepicker_start").on("dp.change", function (e) {
             $('#datetimepicker_end').data("DateTimePicker").minDate(e.date);
@@ -102,16 +93,28 @@
             }
             else {
                 $(picker).data("DateTimePicker").enable();
-                console.log('1')
-                if ($(picker).data("DateTimePicker") == null){
-                    console.log('2')
-                    $(picker).data("DateTimePicker") = moment().format('DD-MM-YYYY HH:mm');
+                if ($(picker)[0].value == ''){
+                    $(picker)[0].value = moment().format('DD-MM-YYYY HH:mm');
                 }
             }
         }
+        // On page load
+        var date = moment()
+        '{% if not form.start_time_disabled.data and not form.start_time.data %}'
+            $('#datetimepicker_start')[0].value = date.format('DD-MM-YYYY HH:mm');
+            date.add(1, 'hour');
+        '{% endif %}'
+        '{% if not form.end_time_disabled.data and not form.end_time.data %}'
+            $('#datetimepicker_end')[0].value = date.format('DD-MM-YYYY HH:mm');
+        '{% endif %}'
         updateDateTimePicker('#datetimepicker_start', '#start_time_disabled');
         updateDateTimePicker('#datetimepicker_end', '#end_time_disabled');
-        $('#timezone')[0].value = moment.tz.guess();
+        '{% if form.start_time.data %}'
+            $('#datetimepicker_start')[0].value = moment.utc('{{ form.start_time.data }}').local().format('DD-MM-YYYY HH:mm');
+        '{% endif %}'
+        '{% if form.end_time.data %}'
+            $('#datetimepicker_end')[0].value = moment.utc('{{ form.end_time.data }}').local().format('DD-MM-YYYY HH:mm');
+        '{% endif %}'
     });
 </script>
 {% endblock %}

app/utils.py

@@ -1,6 +1,6 @@
 from io import BytesIO
 import qrcode
-from flask import send_file
+from flask import send_file, flash
 
 def generate_qr_code(url):
     qr = qrcode.QRCode(
@@ -19,3 +19,13 @@ def serve_pil_image(pil_img):
     pil_img.save(img_io, 'PNG', quality=70)
     img_io.seek(0)
     return send_file(img_io, mimetype='image/png')
+
+def flash_errors(form):
+    """Flashes form errors"""
+    print('a')
+    for field, errors in form.errors.items():
+        for error in errors:
+            flash(u"Error in the %s field - %s" % (
+                getattr(form, field).label.text,
+                error
+            ), 'error')