Add custom prompt to the frontend (FujiwaraChoki#179)

Backend/gpt.py

@@ -65,7 +65,7 @@ def generate_response(prompt: str, ai_model: str) -> str:
 
     return response
 
-def generate_script(video_subject: str, paragraph_number: int, ai_model: str, voice: str) -> str:
+def generate_script(video_subject: str, paragraph_number: int, ai_model: str, voice: str, customPrompt: str) -> str:
 
     """
     Generate a script for a video, depending on the subject of the video, the number of paragraphs, and the AI model.
@@ -89,26 +89,36 @@ def generate_script(video_subject: str, paragraph_number: int, ai_model: str, vo
     """
 
     # Build prompt
-    prompt = f"""
-    Generate a script for a video, depending on the subject of the video.
-    Subject: {video_subject}
-    Number of paragraphs: {paragraph_number}
-    Language: {voice}
+
+    if customPrompt:
+        prompt = customPrompt
+    else:
+        prompt = """
+            Generate a script for a video, depending on the subject of the video.
 
-    The script is to be returned as a string with the specified number of paragraphs.
+            The script is to be returned as a string with the specified number of paragraphs.
 
-    Here is an example of a string:
-    "This is an example string."
+            Here is an example of a string:
+            "This is an example string."
 
-    Do not under any circumstance reference this prompt in your response.
+            Do not under any circumstance reference this prompt in your response.
 
-    Get straight to the point, don't start with unnecessary things like, "welcome to this video".
+            Get straight to the point, don't start with unnecessary things like, "welcome to this video".
 
-    Obviously, the script should be related to the subject of the video.
+            Obviously, the script should be related to the subject of the video.
+
+            YOU MUST NOT INCLUDE ANY TYPE OF MARKDOWN OR FORMATTING IN THE SCRIPT, NEVER USE A TITLE.
+            YOU MUST WRITE THE SCRIPT IN THE LANGUAGE SPECIFIED IN [LANGUAGE].
+            ONLY RETURN THE RAW CONTENT OF THE SCRIPT. DO NOT INCLUDE "VOICEOVER", "NARRATOR" OR SIMILAR INDICATORS OF WHAT SHOULD BE SPOKEN AT THE BEGINNING OF EACH PARAGRAPH OR LINE. YOU MUST NOT MENTION THE PROMPT, OR ANYTHING ABOUT THE SCRIPT ITSELF. ALSO, NEVER TALK ABOUT THE AMOUNT OF PARAGRAPHS OR LINES. JUST WRITE THE SCRIPT.
+
+        """
+
+    prompt += f"""
+    
+    Subject: {video_subject}
+    Number of paragraphs: {paragraph_number}
+    Language: {voice}
 
-    YOU MUST NOT INCLUDE ANY TYPE OF MARKDOWN OR FORMATTING IN THE SCRIPT, NEVER USE A TITLE.
-    YOU MUST WRITE THE SCRIPT IN THE LANGUAGE SPECIFIED IN [LANGUAGE].
-    ONLY RETURN THE RAW CONTENT OF THE SCRIPT. DO NOT INCLUDE "VOICEOVER", "NARRATOR" OR SIMILAR INDICATORS OF WHAT SHOULD BE SPOKEN AT THE BEGINNING OF EACH PARAGRAPH OR LINE. YOU MUST NOT MENTION THE PROMPT, OR ANYTHING ABOUT THE SCRIPT ITSELF. ALSO, NEVER TALK ABOUT THE AMOUNT OF PARAGRAPHS OR LINES. JUST WRITE THE SCRIPT.
     """
 
     # Generate script

Backend/main.py

@@ -76,6 +76,8 @@ def generate():
         print(colored("[Video to be generated]", "blue"))
         print(colored("   Subject: " + data["videoSubject"], "blue"))
         print(colored("   AI Model: " + ai_model, "blue"))  # Print the AI model being used
+        print(colored("   Custom Prompt: " + data["customPrompt"], "blue"))  # Print the AI model being used
+
 
 
         if not GENERATING:
@@ -98,7 +100,7 @@ def generate():
 
 
         # Generate a script
-        script = generate_script(data["videoSubject"], paragraph_number, ai_model, voice)  # Pass the AI model to the script generation
+        script = generate_script(data["videoSubject"], paragraph_number, ai_model, voice, data["customPrompt"])  # Pass the AI model to the script generation
 
         # Generate search terms
         search_terms = get_search_terms(

Frontend/app.js

@@ -5,6 +5,7 @@ const zipUrl = document.querySelector("#zipUrl");
 const paragraphNumber = document.querySelector("#paragraphNumber");
 const youtubeToggle = document.querySelector("#youtubeUploadToggle");
 const useMusicToggle = document.querySelector("#useMusicToggle");
+const customPrompt = document.querySelector("#customPrompt");
 const generateButton = document.querySelector("#generateButton");
 const cancelButton = document.querySelector("#cancelButton");
 
@@ -20,6 +21,7 @@ advancedOptionsToggle.addEventListener("click", () => {
   advancedOptions.classList.toggle("hidden");
 });
 
+
 const cancelGeneration = () => {
   console.log("Canceling generation...");
   // Send request to /cancel
@@ -66,6 +68,7 @@ const generateVideo = () => {
   const useMusicToggleState = useMusicToggle.checked;
   const threads = document.querySelector("#threads").value;
   const zipUrlValue = zipUrl.value;
+  const customPromptValue = customPrompt.value;
   const subtitlesPosition = document.querySelector("#subtitlesPosition").value;
 
   const url = "http://localhost:8080/api/generate";
@@ -81,6 +84,7 @@ const generateVideo = () => {
     zipUrl: zipUrlValue,
     threads: threads,
     subtitlesPosition: subtitlesPosition,
+    customPrompt: customPromptValue,
   };
 
   // Send the actual request to the server

Frontend/index.html

@@ -25,13 +25,13 @@ <h1 class="text-4xl text-center mb-4">MoneyPrinter</h1>
     <div class="flex justify-center mt-8">
       <div class="max-w-xl flex flex-col space-y-4 w-full">
         <label for="videoSubject" class="text-blue-600">Subject</label>
-        <textarea
-          rows="3"
-          type="text"
-          name="videoSubject"
-          id="videoSubject"
-          class="border-2 border-blue-300 p-2 rounded-md focus:outline-none focus:border-blue-500"
-        ></textarea>
+          <textarea
+              rows="3"
+              type="text"
+              name="videoSubject"
+              id="videoSubject"
+              class="border-2 border-blue-300 p-2 rounded-md focus:outline-none focus:border-blue-500"
+          ></textarea>
         <button id="advancedOptionsToggle" class="text-blue-600">
           Show Advanced Options ▼
         </button>
@@ -146,6 +146,15 @@ <h1 class="text-4xl text-center mb-4">MoneyPrinter</h1>
             min="1"
             max="100"
           />
+          <label for="customPrompt" class="text-blue-600">Custom Prompt:</label>
+            <textarea
+              rows="3"
+              type="text"
+              name="customPrompt"
+              id="customPrompt"
+              class="border-2 border-blue-300 p-2 rounded-md focus:outline-none focus:border-blue-500"
+              placeholder="only use it if you want to replace the default prompt"
+            ></textarea>
           <label
             for="youtubeUploadToggle"
             class="flex items-center text-blue-600"