.

rapids/templates/rapids/mark.html

@@ -83,7 +83,7 @@
                             <ul id="new-answer-list" class="answer-list rapid">
                                 {% for answer, mark in review_user_answers %}
                                     <li>
-                                        <pre><span class="answer not-marked" data-mark="{{mark}}">{{ answer }}</span></pre>
+                                        <pre><span class="answer not-marked" data-mark="{{mark}}" title="{{answer}}">{{ answer }}</span></pre>
                                     </li>
                                 {% endfor %}
                             </ul>
@@ -94,6 +94,7 @@
                 {% endif %}
                 {% if review and not question.normal %}
                     <button type="button" name="check-review" class="check-review">Check review answers</button><br/>
+                    <div id="review-text"></div>
                 {% endif %}
                 <span class="save-buttons">
                     {% if question_details.current > 1 %}
@@ -122,13 +123,14 @@
             $(document).ready(() => {
                 {% if review and not question.normal %}
                 $("button.check-review").click(() =>{
+                    $(".review-details").remove();
                     $(".marking-list .answer").each((n, el) => {
                         console.log(n, el, el.dataset);
                         if (el.dataset.mark != el.dataset.newmark) {
-                            $(el).after(`<span class="current-mark"> saved [${el.dataset.mark}]</span>`)
+                            $(el).after(`<span class="current-mark review-details"> saved [${el.dataset.mark}]</span>`)
                         }
                     })
-                    $("button.check-review").after("Discreptant answers are show above. Clickinc next / save will overwrite saved scores with your current scoring.").hide()
+                    $("#review-text").html("Discrepant answers are show above. Clicking next / save will overwrite saved scores with your current scoring.")
                     $(".save-buttons").show();
                 })
 
@@ -147,11 +149,80 @@
 
 {% endblock %}
 
+{% block js %}
+
+    <script type="text/javascript">
+        $(document).ready(function ()  {
+            console.log("loads")
+            $(".answer").each(function(n, el) {
+                console.log(n)
+                console.log(el)
+                uri = encodeURI(el.title)
+                button = $(`<a tabindex="0" class='popover-button' role="button" data-toggle="popover" data-trigger="focus" title='${el.title}'>+</a>`)
+                popover = $(`
+    <div id="popover-content-${n}" class="hide popoverdiv">
+      <ul class="popovermenu">
+        <li><a href="https://www.google.com/search?q=${uri}" target="_blank">Google answer</a></li>
+        <span class="copy-to-clipboard" data-text="${el.title}">Copy to clipboard</span>
+      </ul>
+    </div>`)
+                $(el).before(popover)
+                $(el).before(button)
+
+
+                // This is horrible
+                $(button).popover({
+                    html: true,
+                    trigger: "focus",
+                    content: function () {
+                        return $(`#popover-content-${n}`).html();
+                    }
+                }).on('shown.bs.popover', function(e, n
+                ) {
+                    text = el.title
+                    $(`.copy-to-clipboard`).on("click", function(e) {
+                        navigator.clipboard.writeText(text);
+                    });
+                });
+            })
+
+        }
+
+        )
+    </script>
+
+{% endblock %}
+
 {% block css %}
-<style>
-    #primary-answer {
-        font-weight: strong;
-        color: white;
-    }
-</style>
+    <style>
+        #primary-answer {
+            font-weight: strong;
+            color: white;
+        }
+        .popover-button {
+            padding-right: 5px;
+            cursor: help;
+            text-decoration: none;
+            color: purple;
+        }
+        .popover, .popover-header {
+        }
+
+        .popovermenu {
+            list-style: none;
+            padding: 0px;
+            margin: 0px;
+        }
+        .popovermenu li {
+        }
+        .popovermenu li a {
+            color: blue;
+        }
+
+        .answer-list{
+            list-style: none;
+            padding-left: 0px;
+
+        }
+    </style>
 {% endblock css %}