Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

CharlieKC/issue3 #19

Merged
merged 5 commits into from
Oct 2, 2023
Merged

CharlieKC/issue3 #19

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
947df8c
Add endpoint to list user conversations
CharlieKC Oct 1, 2023
761146f
add new dev deps
CharlieKC Oct 2, 2023
44db140
Black and flake8
CharlieKC Oct 2, 2023
9f3c858
Delete unused template
CharlieKC Oct 2, 2023
58fbc41
Reformat files
CharlieKC Oct 2, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Reformat files
  • Loading branch information
@CharlieKC
CharlieKC committed Oct 2, 2023
commit 58fbc411c1bcc51b8619851816be07c9ba240e6c
151 changes: 72 additions & 79 deletions flashcards/templates/chat_interface.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,106 +1,99 @@
{% extends "base.html" %}

{% block content %}
<h1>Conversation: {{ request.session.conversation_id }} </h1>

{% for msg in messages %}
<p>{{ msg.text }}</p>
{% endfor %}

<div id="chat-ui" class="mx-auto w-11/12">
<!-- Messages will go here -->
<div id="chat-box" class=""></div>
</div>

<!-- Ensure space at bottom of page -->
<div class="fixed bottom-0 my-10"></div>

<div class="fixed bottom-0 left-0 w-full border-t">
<div class="flex justify-center my-2">
<textarea
id="user-input"
rows="1"
class="textarea textarea-bordered w-11/12 text-xl"
style="resize: none"></textarea>
</div>
<h1>Conversation: {{ request.session.conversation_id }}</h1>
{% for msg in messages %}<p>{{ msg.text }}</p>{% endfor %}
<div id="chat-ui" class="mx-auto w-11/12">
<!-- Messages will go here -->
<div id="chat-box"></div>
</div>
<!-- Ensure space at bottom of page -->
<div class="fixed bottom-0 my-10"></div>
<div class="fixed bottom-0 left-0 w-full border-t">
<div class="flex justify-center my-2">
<textarea id="user-input"
rows="1"
class="textarea textarea-bordered w-11/12 text-xl"
style="resize: none"></textarea>
</div>


<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

Check warning

Code scanning / CodeQL

Inclusion of functionality from an untrusted source Medium

Script loaded from content delivery network with no integrity check.
<script>
// Function to get CSRF token from cookies
function getCookie(name) {
let cookieValue = null;
if (document.cookie && document.cookie !== '') {
const cookies = document.cookie.split(';');
for (let i = 0; i < cookies.length; i++) {
const cookie = cookies[i].trim();
if (cookie.substring(0, name.length + 1) === (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
let cookieValue = null;
if (document.cookie && document.cookie !== '') {
const cookies = document.cookie.split(';');
for (let i = 0; i < cookies.length; i++) {
const cookie = cookies[i].trim();
if (cookie.substring(0, name.length + 1) === (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
return cookieValue;
}
return cookieValue;
}

const csrftoken = getCookie('csrftoken');

function appendMessage(who, text) {
let left_or_right = "end";
let color = "success";
if (who === "user") {
left_or_right = "start";
color = "primary";
}
let left_or_right = "end";
let color = "success";
if (who === "user") {
left_or_right = "start";
color = "primary";
}


// const message = `<div class="chat chat-${left_or_right}"><div class="chat-header mx-1">${who}</div><div class="chat-bubble chat-bubble-${color}">${text}</div></div>`;
const message = `<div class="chat chat-${left_or_right}"><div class="chat-header mx-1">${who}</div><div class="chat-bubble chat-bubble-${color}">${text}</div></div>`;
$("#chat-box").append(message);
// const message = `<div class="chat chat-${left_or_right}"><div class="chat-header mx-1">${who}</div><div class="chat-bubble chat-bubble-${color}">${text}</div></div>`;
const message = `<div class="chat chat-${left_or_right}"><div class="chat-header mx-1">${who}</div><div class="chat-bubble chat-bubble-${color}">${text}</div></div>`;
$("#chat-box").append(message);

Check warning

Code scanning / CodeQL

DOM text reinterpreted as HTML Medium

DOM text
Loading
is reinterpreted as HTML without escaping meta-characters.
}

// const existingMessages = JSON.parse(document.getElementById('hello-data').message-data);
// existingMessages.forEach(element => {
// appendMessage(element.role, element.text);

// });


function sendMessage() {
const userInput = $("#user-input").val();
appendMessage("user", userInput);

$.ajax({
url: "/api/chat/",
method: "POST",
headers: { "X-CSRFToken": csrftoken },
data: { text: userInput },
success: function(response) {
appendMessage("assistant", response.text);
}
});
const userInput = $("#user-input").val();
appendMessage("user", userInput);

$.ajax({
url: "/api/chat/",
method: "POST",
headers: {
"X-CSRFToken": csrftoken
},
data: {
text: userInput
},
success: function(response) {
appendMessage("assistant", response.text);
}
});

$("#user-input").val("");
$("#user-input").val("");
}


const userInput = document.getElementById('user-input');

// Add event listener for the 'keydown' event
userInput.addEventListener('keydown', function(event) {
// Reset rows to 1 to calculate the correct scrollHeight
if (event.key === 'Enter') {
if (event.shiftKey) {
userInput.rows++;
return;
}
event.preventDefault(); // Prevent the default action (new line or form submission)
userInput.rows = 1;
sendMessage();
}
});
const userInput = document.getElementById('user-input');

</script>

{% endblock content %}
// Add event listener for the 'keydown' event
userInput.addEventListener('keydown', function(event) {
// Reset rows to 1 to calculate the correct scrollHeight
if (event.key === 'Enter') {
if (event.shiftKey) {
userInput.rows++;
return;
}
event.preventDefault(); // Prevent the default action (new line or form submission)
userInput.rows = 1;
sendMessage();
}
});
</script>
{% endblock content %}
27 changes: 10 additions & 17 deletions flashcards/templates/conversation_list.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{% extends "base.html" %}

{% block content %}
<article class="prose prose-base mx-auto my-5">
<article class="prose prose-base mx-auto my-5">
<h1>Garlic bread with cheese: What the science tells us</h1>
<p>
For years parents have espoused the health benefits of eating garlic bread with cheese to their
Expand All @@ -13,28 +13,21 @@ <h1>Garlic bread with cheese: What the science tells us</h1>
springing up around the country.
</p>
<code class="code">
<span>Example code</span>
<span>Example code</span>
<span>Example code</span>
<span>Example code</span>
<span>Example code</span>
<span>Example code</span>
<span>Example code</span>
<span>Example code</span>
</code>
<pre class="language-python">
<pre class="language-python">
<code class="language-python">for i in range(10):
print("hello!")</code></pre>
<!-- ... -->


print("hello!")</code></pre>
{% load markdownify %}
{% load static %}
{{ markdowntext |markdownify }}


{{ markdowntext |markdownify }}
<h3>What is your username?</h3>
{% load account %}
{% user_display user %}



{% user_display user %}
</article>

{% endblock content %}
{% endblock content %}
Loading