Fully implement database cleanup button, ajax side

webapp/titanembeds/static/js/admin_index.js

@@ -0,0 +1,30 @@
+/* global $ */
+/* global Materialize */
+
+(function () {
+    function cleanup_database() {
+        var funct = $.ajax({
+            method: "DELETE",
+            url: "/api/cleanup-db",
+        });
+        return funct.promise();
+    }
+    
+    $(function(){
+        $("#db_cleanup_btn").click(run_cleanup_db);
+    });
+    
+    function run_cleanup_db() {
+        $("#db_cleanup_btn").attr("disabled",true);
+        Materialize.toast('Please wait for the cleanup database task to finish...', 10000);
+        var cleanupdb = cleanup_database();
+        cleanupdb.done(function () {
+            $("#db_cleanup_btn").attr("disabled",false);
+            Materialize.toast('Successfully cleaned up the database!', 10000);
+        });
+        cleanupdb.fail(function () {
+            $("#db_cleanup_btn").attr("disabled",false);
+            Materialize.toast('Database cleanup failiure.', 10000);
+        });
+    }
+})();

webapp/titanembeds/templates/admin_index.html.j2

@@ -22,10 +22,13 @@
   </div>
   <div class="col s12">
     <div class="card-panel indigo lighten-5 z-depth-3 hoverable black-text">
-      <h4>Cleanup DB</h4>
-      <p class="flow-text">Clean up the database</p>
-      SoonTM
+      <h4>Run a Database Cleanup</h4>
+      <p class="flow-text">Clears the keyval caches and purges the old messages. (Hit once, and wait a minute)</p>
+      <a class="waves-effect waves-light btn" id="db_cleanup_btn">Run DB Cleanup Task</a>
     </div>
   </div>
 </div>
 {% endblock %}
+{% block script %}
+<script type="text/javascript" src="{{ url_for('static', filename='js/admin_index.js') }}"></script>
+{% endblock %}