From 53e143339400c9d15fd43996d66d0aaf6ac26f26 Mon Sep 17 00:00:00 2001
From: Markus Rosenstihl <markus.rosenstihl@pkm.tu-darmstadt.de>
Date: Wed, 23 Apr 2025 21:40:33 +0200
Subject: [PATCH] * added gradient calculation * added magnet selection *
 calculate probe position

---
 isotables/isotopapp/templates/base.html     | 15 +++++++++++++--
 isotables/isotopapp/templates/posiiton.html | 19 ++++++++++++-------
 isotables/isotopapp/views.py                | 15 +++++++++------
 3 files changed, 34 insertions(+), 15 deletions(-)

diff --git a/isotables/isotopapp/templates/base.html b/isotables/isotopapp/templates/base.html
index 2a88141..d968b0d 100644
--- a/isotables/isotopapp/templates/base.html
+++ b/isotables/isotopapp/templates/base.html
@@ -6,6 +6,9 @@
 
     <link href=”https://cdn.pydata.org/bokeh/release/bokeh-3.7.1.min.css" rel=”stylesheet” type=”text/css”>
     <link href=”https://cdn.pydata.org/bokeh/release/bokeh-widgets-3.7.1.min.css" rel=”stylesheet” type=”text/css”>
+    <link href=”https://cdn.pydata.org/bokeh/release/bokeh-tables-3.7.1.min.css" rel=”stylesheet” type=”text/css”>
+    <link href=”https://cdn.pydata.org/bokeh/release/bokeh-gl-3.7.1.min.css" rel=”stylesheet” type=”text/css”>
+    <link href=”https://cdn.pydata.org/bokeh/release/bokeh-mathjax-3.7.1.min.css" rel=”stylesheet” type=”text/css”>
 </head>
 
 <nav class="navbar navbar-expand-lg navbar-light bg-light">
@@ -58,6 +61,14 @@
 {% block content %}
 {% endblock %}
 
-<script src="https://cdn.bokeh.org/bokeh/release/bokeh-3.7.1.min.js"></script>
-<script src="https://cdn.bokeh.org/bokeh/release/bokeh-widgets-3.7.1.min.js"></script>
+<script src="https://cdn.bokeh.org/bokeh/release/bokeh-3.7.1.min.js"
+        crossorigin="anonymous"></script>
+<script src="https://cdn.bokeh.org/bokeh/release/bokeh-widgets-3.7.1.min.js"
+        crossorigin="anonymous"></script>
+<script src="https://cdn.bokeh.org/bokeh/release/bokeh-tables-3.7.1.min.js"
+        crossorigin="anonymous"></script>
+<script src="https://cdn.bokeh.org/bokeh/release/bokeh-gl-3.7.1.min.js"
+        crossorigin="anonymous"></script>
+<script src="https://cdn.bokeh.org/bokeh/release/bokeh-mathjax-3.7.1.min.js"
+        crossorigin="anonymous"></script>
 </body>
diff --git a/isotables/isotopapp/templates/posiiton.html b/isotables/isotopapp/templates/posiiton.html
index 849dc07..c5b319a 100644
--- a/isotables/isotopapp/templates/posiiton.html
+++ b/isotables/isotopapp/templates/posiiton.html
@@ -1,7 +1,7 @@
 {% extends 'base.html' %}
 {% block content %}
 
-<div class="center">
+<div class="container">
     <h1>Isotopes</h1>
     <table class="table w-auto table-responsive-sm table-striped table-hover table-bordered">
         <caption>
@@ -32,15 +32,20 @@
 
         </tbody>
     </table>
-    {{ div| safe }}
+        <div class="row justify-content-left">
+    {{ div_plot | safe }}
+    </div>
+    <div class="row justify-content-left ">
+    {{ div_table | safe }}
+    </div>
 
-<div>s
-    {{ script| safe }}
+<div>
+    {{ script_plot| safe }}
+    {{ script_table| safe }}
 </div>
 
-<a href="{% url 'home' %}">Go Back</a>
+<a href="{% url 'home' %}">Go Home</a>
 
 </div>
-</body>
 
-{% endblock %}
+    {% endblock %}
diff --git a/isotables/isotopapp/views.py b/isotables/isotopapp/views.py
index 71a0c07..3231908 100644
--- a/isotables/isotopapp/views.py
+++ b/isotables/isotopapp/views.py
@@ -267,12 +267,15 @@ def position(request):
     ]
     data_table = DataTable(source=source, columns=columns, width=400, height=280)
 
-    #show(data_table)
-    # boke plot
-    #plot.add_layout(data_table)
-    script, div = components(plot)
+    script_plot, div_plot = components(plot)
+
+    script_table, div_table = components(data_table)
     ans = sorted(close_isotopes, key=lambda x: float(x[3]))
-
-    return render(request, 'posiiton.html', {'ans': ans, 'script': script, 'div': div})
+    print(div_plot)
+    return render(request, 'posiiton.html', {'ans': ans,
+                                             'script_plot': script_plot,
+                                             'div_plot': div_plot,
+                                             "script_table": script_table,
+                                             "div_table": div_table})