Initial commit

static/latex2image-client.js

@@ -0,0 +1,72 @@
+var hasShownBefore = false;
+
+$(document).ready(function() {
+    function show(resultData) {
+        function afterSlideUp() {
+            var resultDataJSON;
+            if ((resultDataJSON = JSON.parse(resultData)) && !resultDataJSON.error) {
+                $('#resultImage').attr('src', resultDataJSON.imageURL);
+                $('#downloadButton').attr('href', resultDataJSON.imageURL);
+                $('#resultCard').show();
+                $('#errorAlert').hide();
+            } else {
+                $('#errorAlert').text(resultDataJSON.error);
+                $('#errorAlert').show();
+                $('#resultCard').hide();
+
+            }
+            $('#result').slideDown(330);
+
+            // Scroll window to bottom
+            $("html, body").animate({
+                scrollTop: $(document).height()
+            }, 1000);
+
+            hasShownBefore = true;
+        }
+
+        $('#result').slideUp(hasShownBefore ? 330 : 0, afterSlideUp);
+    }
+
+    $('#convertButton').click(function() {
+        if (!$('#latexInputTextArea').val()) {
+            show(JSON.stringify({
+                error: 'No LaTeX input provided'
+            }));
+            return;
+        }
+        
+        $('#result').slideUp(hasShownBefore ? 330 : 0);
+        
+        $('#convertButton').prop('disabled', true);
+        $('#exampleButton').prop('disabled', true);
+        $('#convertButton').prop('value', 'Converting...');
+        $.ajax({
+            url: '/convert',
+            type: 'POST',
+            data: {
+                latexInput: $('#latexInputTextArea').val(),
+                outputFormat: $('#outputFormatSelect').val(),
+                outputScale: $('#outputScaleSelect').val()
+            },
+            success: function(data) {
+                $('#convertButton').prop('disabled', false);
+                $('#exampleButton').prop('disabled', false);
+                $('#convertButton').prop('value', 'Convert');
+                show(data);
+            },
+            error: function() {
+                $('#convertButton').prop('disabled', false);
+                $('#exampleButton').prop('disabled', false);
+                $('#convertButton').prop('value', 'Convert');
+                alert('Error communicating with server');
+            }
+        });
+    });
+
+    // Show and convert a sample equation
+    $('#exampleButton').click(function() {
+        $('#latexInputTextArea').val('\\vec{F}=m \\frac{d \\vec{v}}{dt} + \\vec{v}\\frac{dm}{dt}');
+        $('#convertButton').click();
+    });
+});