CTFd RFC on notification pop ups

notfications.patch

diff --git a/CTFd/api/v1/notifications.py b/CTFd/api/v1/notifications.py
index 6dd78f6..697a06f 100644
--- a/CTFd/api/v1/notifications.py
+++ b/CTFd/api/v1/notifications.py
@@ -31,6 +31,12 @@ class NotificantionList(Resource):
     def post(self):
         req = request.get_json()
 
+        pop_up = req.get('pop_up')
+
+        if pop_up:
+            pop_up = True
+            del req["pop_up"]
+
         schema = NotificationSchema()
         result = schema.load(req)
 
@@ -44,6 +50,7 @@ class NotificantionList(Resource):
         db.session.commit()
 
         response = schema.dump(result.data)
+        response.data["pop_up"] = pop_up
         socketio.emit('notification', response.data, broadcast=True)
 
         return {
diff --git a/CTFd/themes/admin/templates/notifications.html b/CTFd/themes/admin/templates/notifications.html
index a2e9af5..1f7fa70 100644
--- a/CTFd/themes/admin/templates/notifications.html
+++ b/CTFd/themes/admin/templates/notifications.html
@@ -21,6 +21,12 @@
 					</div>
 					<div class="form-group">
 						<label>
+							<input name="pop_up" type="checkbox">
+							Pop-up
+						</label>
+					</div>
+					<div class="form-group">
+						<label>
 							Content
 							<small class="form-text text-muted">
 								Notification contents can be made up of HTML
diff --git a/CTFd/themes/core/static/css/swampctf.css b/CTFd/themes/core/static/css/swampctf.css
index 2bc0f9c..3835654 100644
--- a/CTFd/themes/core/static/css/swampctf.css
+++ b/CTFd/themes/core/static/css/swampctf.css
@@ -30,3 +30,13 @@
     cursor: pointer;
     font-size: 1.25em;
 }
+
+#notification-count {
+    background: #bd2828;
+    color: white;
+    border-radius: 100%;
+    padding: 0 4px;
+    font-size: 0.8em;
+    vertical-align: top;
+    display: none;
+}
diff --git a/CTFd/themes/core/static/js/events.js b/CTFd/themes/core/static/js/events.js
index da39b9a..aefcc32 100644
--- a/CTFd/themes/core/static/js/events.js
+++ b/CTFd/themes/core/static/js/events.js
@@ -5,10 +5,18 @@ var socket = io.connect(
     }
 );
 
+var notification_count = 0;
+
 socket.on('notification', function (data) {
-    ezal({
-        title: data.title,
-        body: data.content,
-        button: "Got it!"
-    });
-});
\ No newline at end of file
+	notification_count += 1;
+	$('#notification-count').css('display', 'inline');
+	$('#notification-count').text(notification_count);
+
+	if (data.pop_up) {
+		ezal({
+			title: data.title,
+			body: data.content,
+			button: "Got it!"
+		});
+	}
+});
diff --git a/CTFd/themes/core/templates/base.html b/CTFd/themes/core/templates/base.html
index 966b726..17ea659 100644
--- a/CTFd/themes/core/templates/base.html
+++ b/CTFd/themes/core/templates/base.html
@@ -69,7 +69,7 @@
 					{% endfor %}
 
 					<li class="nav-item">
-						<a class="nav-link" href="{{ url_for('views.notifications') }}">Notifications</a>
+						<a class="nav-link" href="{{ url_for('views.notifications') }}">Notifications <span id="notification-count"></span></a>
 					</li>
 					{% if get_config('account_visibility') != 'admins' %}
 						<li class="nav-item">