added flask app

raju2592 · Oct 8, 2020 · a86fe9c · a86fe9c
1 parent bb8d93b
commit a86fe9c
Show file tree

Hide file tree

Showing 6 changed files with 216 additions and 1 deletion.
diff --git a/Pipfile b/Pipfile
@@ -7,6 +7,8 @@ verify_ssl = true
 
 [packages]
 pytest = "*"
+flask = "*"
+gunicorn = "*"
 
 [requires]
 python_version = "3.7"
diff --git a/Pipfile.lock b/Pipfile.lock
diff --git a/Procfile b/Procfile
@@ -0,0 +1 @@
+web: gunicorn app:app
diff --git a/app.py b/app.py
@@ -0,0 +1,26 @@
+import random
+from urllib.parse import unquote
+from flask import Flask, render_template, request, jsonify
+from lib.differentiator import differentiate
+
+app = Flask(__name__)
+
+@app.route('/', methods = ['get'])
+def hello_world():
+  random.seed()
+  input = [
+    '(1 + sin(x)) ^ 3',
+    'ln(sqrt(x) + 1)',
+    '10 * (x + tan(x))'
+  ][(random.randint(0, 2))]
+  return render_template("main.html", input=input)
+
+
+@app.route('/getDerivative', methods = ['get'])
+def get_derivative():
+  input = unquote(request.args.get('function'))
+  result = differentiate(input)
+  return jsonify(result.__dict__)
+
+if __name__ == "__main__":
+  app.run()
diff --git a/static/js/index.js b/static/js/index.js
@@ -0,0 +1,43 @@
+$ = window.$;
+MathJax = window.MathJax;
+
+function handleInput(inputFunction) {
+    $('#function').attr('disabled', 'disabled');
+    $('#derivativeOutput').empty()
+    $.ajax({
+        url: '/getDerivative',
+        type: 'GET',
+        data: {function: inputFunction},
+        success: function(response) {
+            if(response.success) {
+                var html = '';
+                html += 'I claim that, ' + response.answer;
+                html += '<br>';
+                for(var i = 0; i < response.story.length; i++) {
+                    html += response.story[i] + '<br>';
+                }
+                $('#derivativeOutput').append(html);
+                $("#derivativeOutput").css("font-size","95%");
+                $("#derivativeOutput").css("color","black");
+                MathJax.Hub.Typeset();
+            } else {
+                $('#derivativeOutput').append('Can\'t understand, sorry :( :(');
+                $("#derivativeOutput").css("font-size","100%");
+                $("#derivativeOutput").css("color","red");
+            }
+            $('#function').removeAttr('disabled');
+        },
+        error: function(){
+            alert('Something Went Wrong!');
+        },
+    });
+}
+
+$(document).ready(function() {
+    $('#inputForm').submit(function(e) {
+        e.preventDefault();
+        var inputFunction = $('#function').val();
+        handleInput(inputFunction);
+    });
+    $('#inputForm').submit();
+});
diff --git a/templates/main.html b/templates/main.html
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8">
+        <title>Derivative Calculator</title>
+
+        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
+
+        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
+
+        <script type="text/javascript"
+            src="https://code.jquery.com/jquery-3.2.1.min.js"
+            integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
+            crossorigin="anonymous">
+        </script>
+
+        <script type="text/javascript"
+            src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" 
+            integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
+            crossorigin="anonymous">
+        </script>
+
+        <script type="text/javascript"
+            src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=AM_HTMLorMML-full">
+        </script>
+
+        <script src="{{ url_for('static', filename='js/index.js') }}"></script>
+    </head>
+    <body>
+        <div class="row">
+            <div class="col-sm-2">
+            </div>
+            <div class="col-sm-8">
+                <div class="row text-center">
+                <h3> Simple Derivative Calculator </h3>
+                <form class="form" id="inputForm">
+                    <div class="form-group">
+                        <input type="text" class="form-control" id="function" value="{{input}}" placeholder="your function">
+                    </div>
+                </form>
+                </div>
+                <br>
+                <div class="row" id="derivativeOutput">
+                </div>
+            </div>
+        </div>
+        <div class="row footer">
+            <hr>
+            <p class="text-center">
+                <a">readme and source code @ github</a>
+            </p>
+        </div>
+        <div class = "row" style="height: 30px">
+        </div>
+    </body>
+</html>