Added checkbox option for wrapping with align, and a spinner indicator

static/latex2image-client.js

@@ -1,6 +1,8 @@
 var sampleEquation = '\\frac{\\pi}{2} = \\int_{-1}^{1} \\sqrt{1-x^2}\\ dx';
 var hasShownBefore = false;
 
+var ENDPOINT = '/convert';
+
 $(document).ready(function() {
   function show(resultData) {
     function afterSlideUp() {
@@ -30,38 +32,45 @@ $(document).ready(function() {
   }
 
   $('#convertButton').click(function() {
-    if (!$('#latexInputTextArea').val()) {
-      show(JSON.stringify({
-        error: 'No LaTeX input provided'
-      }));
+    var latexInput = $('#latexInputTextArea').val();
+
+    if (!latexInput) {
+      show({ error: 'No LaTeX input provided.' });
       return;
     }
 
+    if ($('#autoAlignCheckbox').prop('checked')) {
+      latexInput = '\\begin{align*}\n' + latexInput + '\\end{align*}\n';
+    }
+
     $('#result').slideUp(hasShownBefore ? 330 : 0, function() {
       $('#resultImage').attr('src', '');
     });
 
     $('#convertButton').prop('disabled', true);
     $('#exampleButton').prop('disabled', true);
-    $('#convertButton').prop('value', 'Converting...');
+    $('#convertButtonText').html('Converting...');
+    $('#convertSpinner').removeClass('d-none');
     $.ajax({
-      url: '/convert',
+      url: ENDPOINT,
       type: 'POST',
       data: {
-        latexInput: $('#latexInputTextArea').val(),
+        latexInput: latexInput,
         outputFormat: $('#outputFormatSelect').val(),
         outputScale: $('#outputScaleSelect').val()
       },
       success: function(data) {
         $('#convertButton').prop('disabled', false);
         $('#exampleButton').prop('disabled', false);
-        $('#convertButton').prop('value', 'Convert');
+        $('#convertButtonText').html('Convert');
+        $('#convertSpinner').addClass('d-none');
         show(data);
       },
       error: function() {
         $('#convertButton').prop('disabled', false);
         $('#exampleButton').prop('disabled', false);
-        $('#convertButton').prop('value', 'Convert');
+        $('#convertButtonText').html('Convert');
+        $('#convertSpinner').addClass('d-none');
         alert('Error communicating with server');
       }
     });
@@ -70,6 +79,7 @@ $(document).ready(function() {
   // Show and convert a sample equation
   $('#exampleButton').click(function() {
     $('#latexInputTextArea').val(sampleEquation);
+    $('#autoAlignCheckbox').prop('checked', true);
     $('#convertButton').click();
   });
 });