Closed webmaster-exit-1 closed 9 months ago
Translated by Webmaster-exit-1 a.k.a. MrGFY
// ==UserScript== // @name PreChatGPT // @description Automated batch submission of questions from ChatGPT // @version 2.2 // @author zizhanovo // @namespace https://github.com/zizhanovo/Pre-ChatGPT // @supportURL https://github.com/zizhanovo/Pre-ChatGPT // @license GPL-2.0-only // @match https://chat.openai.com/* // @grant GM_addStyle // ==/UserScript== (function () { 'use strict'; // Add CSS style GM_addStyle(` #sidebar { position: fixed; right: 0; top: 50%; transform: translateY(-50%); width: 270px; padding: 20px; background-color: #fafafa; border: 1px solid #ccc; border-radius: 10px; box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); transition: all 0.3s ease-in-out; overflow: hidden; } #toggleSidebar { position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 30px; height: 30px; background: #fafafa; border: 1px solid #ccc; border-radius: 50%; box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); cursor: pointer; transition: left 0.3s, border 0.3s, background 0.3s; display: flex; align-items: center; justify-content: center; } #sidebar.collapsed #sidebarContent { display: none; } #sidebar.collapsed #toggleSidebar { left: 15px; } #sidebarWrapper { position: relative; /* New wrapper */ } #toggleSidebar:hover { border-color: #007BFF; /* Change border color on hover */ background: #e6e6e6; /* Change background color on hover */ } #toggleSidebar svg { height: 15px; width: 15px; transition: all 0.3s ease-in-out; } #sidebar.collapsed { width: 60px; } #sidebar.collapsed #toggleSidebar { left: 15px; /* Position it to the right when sidebar is collapsed */ } #sidebar h2 { text-align: center; color: #333; font-size: 1.4em; padding-bottom: 10px; border-bottom: 1px solid #ccc; margin-bottom: 10px; } #sidebar textarea { width: 100%; height: 100px; margin-bottom: 10px; padding: 10px; border: 1px solid #ccc; border-radius: 5px; transition: border-color 0.3s; resize: none; } #sidebar textarea:focus { border-color: #007BFF; outline: none; } #sidebar button { width: 100%; padding: 10px; margin-bottom: 10px; border: none; border-radius: 5px; color: white; cursor: pointer; transition: background-color 0.3s; } #submitQuestion, #start { padding: 10px 20px; border: none; border-radius: 5px; color: white; font-size: 15px; cursor: pointer; transition: all 0.3s ease; outline: none; box-shadow: 0px 5px 10px rgba(0,0,0,0.2); } #submitQuestion { background-color: #4CAF50; } #submitQuestion:active { box-shadow: 0px 2px 5px rgba(0,0,0,0.2); transform: translateY(3px); } #submitQuestion:hover { background-color: #45a049; } #start { background-color: #008CBA; margin-bottom: 20px; } #start:active { box-shadow: 0px 2px 5px rgba(0,0,0,0.2); transform: translateY(3px); } #start:hover { background-color: #007B99; } #questionList { max-height: 200px; overflow-y: auto; } .questionContainer { display: flex; align-items: center; } .question { margin-bottom: 10px; padding: 10px; border: 1px solid #ccc; border-radius: 5px; background-color: #fff; display: flex; justify-content: space-between; align-items: center; transition: background-color 0.3s; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .question:hover { background-color: #f0f0f0; } .question:before { content: '❓'; margin-right: 4px; } .question.answered { color: #aaa; } .question.answered:before { content: '✅'; } .question button { margin-left: 0px; background: none; border: 1px solid #000; /* Added this trip */ box-sizing: border-box; /* Added this trip */ cursor: pointer; transition: color 0.3s; display: flex; justify-content: center; align-items: center; } .question button:hover { color: #007BFF; } .question .button-container { margin-left: auto; display: flex; gap: 0px; } .button-container button { width: 24px; /* Increase the size of the button */ height: 24px; /* Increase the size of the button */ padding: 0; border: 2px solid red; /* Use a more visible border */ } .question button svg { width: 18px; height: 18px; margin: auto; pointer-events: none; /* Let click events pass through the SVG to the button */ } .button-group { display: flex; justify-content: space-between; } .question-text { flex-grow: 1; flex-shrink: 1; flex-basis: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border: none; outline: none; } #questionSummary { display: flex; justify-content: space-between; margin-top: 20px; padding: 10px; background-color: #f5f5f5; border-radius: 10px; box-shadow: 0px 0px 10px rgba(0,0,0,0.08); transition: all 0.3s ease-in-out; height: 90px; /* Add this line and set a suitable height */ } .summary-item { display: flex; justify-content: space-between; align-items: flex-start; width: 45%; padding: 10px; background-color: #ffffff; border: 1px solid #e8e8e8; border-radius: 10px; box-shadow: 0px 0px 5px rgba(0,0,0,0.05); transition: all 0.3s ease-in-out; } .summary-item:hover { box-shadow: 0px 0px 5px rgba(0,0,0,0.1); transform: scale(1.02); } .icon-count-container { display: flex; flex-direction: column; justify-content: space-around; align-items: center; width: 50%; } .summary-icon { font-size: 18px; margin-right: 10px; color: #333333; } .summary-count { font-size: 18px; margin-right: 10px; color: #333333; } .button-container { display: flex; justify-content: center; align-items: center; width: 50%; padding: 3px; height: 100%; /* Add this line */ } .summary-action { display: flex; justify-content: center; align-items: center; text-decoration: none; border: 1px solid #e8e8e8; /* Border */ color: black; /* Change button text color */ background-color: transparent; /* Remove the background color */ padding: 5px 8px; border-radius: 5px; cursor: pointer; transition: all 0.3s ease-in-out; width: 100%; height: 100%; } .summary-action:hover { background-color: #f0f0f0; /* Modify the background color in the hover state */ } .vertical-text { writing-mode: vertical-rl; text-orientation: upright; font-size: 20px; margin: 0 auto; } #settingSidebar { position: fixed; right: 0; top: 50%; transform: translateY(-50%); width: 270px; padding: 20px; background-color: #fafafa; border: 1px solid #ccc; border-radius: 10px; box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); transition: all 0.3s ease-in-out; overflow: hidden; } #settingSidebar h2 { text-align: center; color: #333; font-size: 1.4em; padding-bottom: 10px; border-bottom: 1px solid #ccc; margin-bottom: 10px; } .input-row { margin-bottom: 10px; } .input-row label { display: block; margin-bottom: 5px; color: #333; font-weight: bold; } .input-row input[type="text"], .input-row input[type="number"] { width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 5px; transition: border-color 0.3s; font-size: 14px; font-family: Arial, sans-serif; } .input-row input[type="text"]:focus, .input-row input[type="number"]:focus { border-color: #007BFF; outline: none; } #runMode { display: flex; justify-content: space-between; gap: 10px; } #runMode input[type="radio"] { margin-right: 10px; } #delayTime { width: 80px; margin-left: 10px; padding: 5px; border: 1px solid #ccc; border-radius: 5px; transition: border-color 0.3s;width: 70px; / * adjust the width to the appropriate size * / text-align: right; / * Align the text right * / } #delayTime:disabled { background-color: #f0f0f0; } .mode-option { display: flex; align-items: center; background-color: #f0f0f0; padding: 10px; border-radius: 5px; } .mode-option input[type="number"] { margin-left: 10px; } .clear-cache-btn { padding: 10px 20px; border: none; border-radius: 5px; background-color: #88c0d0; color: white; font-size: 15px; cursor: pointer; transition: all 0.3s ease; outline: none; box-shadow: 0px 5px 10px rgba(0,0,0,0.2); } .clear-cache-btn:active { box-shadow: 0px 2px 5px rgba(0,0,0,0.2); transform: translateY(3px); } .clear-cache-btn:hover { background-color: #81a1c1; } .button-container1 { display: flex; justify-content: center; align-items: center; height: 30px; } #openSetting{font-size: 24px; / * adjust the font size * / color: #4A4A4A; / * Change the font color * / transition: all 0.3s ease; /* Transition animation */ cursor: pointer; /* Change the mouse landscape style */ } #openSetting:hover { color: #3b3b3b; /* The color of the mouse hovering */ text-shadow: 2px 2px 4px #888; /* The shadow color of the mouse hovering */ } #openSetting:active { transform: scale(0.97); /* Reduce the ratio when clicking */ } #backToMainSidebar{ font-size: 24px; /* Adjust the font size */ color: #4a4a4a; /* Change the font color */ transition: all 0.3s ease; /* Transition animation */ cursor: pointer; /* Change the mouse landscape style */ } #backToMainSidebar:hover { color: #3b3b3b; /* The color of the mouse hovering */ text-shadow: 2px 2px 4px #888; /* The shadow color of the mouse hovering */ } #backToMainSidebar:active { transform: scale(0.97); /* Reduce the ratio when clicking */ } .styled-select { display: block; font-size: 1em; width: 100%; max-width: 600px; box-sizing: border-box; margin: 0; } .dropdown { display: block; width: 100%; box-sizing: border-box; border: 1px solid #aaa; border-radius: 4px; box-shadow: 0 1px 0 1px rgba(0,0,0,.04); background-color: #fff; color: #444; padding: .5em .75em; } .input-flex { display: flex; align-items: center; } .input-flex label { margin-right: 10px; } .input-row { background-color: rgba(255, 255, 255, 0.8); box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); border-radius: 5px; padding: 10px; margin-bottom: 10px; } /* Adjust the border and spacing */ .input-row label { margin-bottom: 5px; color: #333; font-weight: bold; } /* Adjust the font color and size */ .input-row input[type="text"], .input-row input[type="number"], .input-row select { color: #333; font-size: 14px; } .input-row select { padding: 8px; } /* Adjust button style */ .button-container1 button { padding: 10px 20px; border: none; border-radius: 5px; background-color: #88c0d0; color: white; font-size: 15px; cursor: pointer; transition: all 0.3s ease; outline: none; box-shadow: 0px 5px 10px rgba(0,0,0,0.2); } .button-container1 button:active { box-shadow: 0px 2px 5px rgba(0,0,0,0.2); transform: translateY(3px); } .button-container1 button:hover { background-color: #81a1c1; } .dragging { opacity: 0.5; } .my-app-night-mode #sidebar, .my-app-night-mode #settingSidebar { background-color: #1f1f1f; border: 1px solid #444; } .my-app-night-mode #sidebar textarea { background-color: #1f1f1f; color: #fff; } .my-app-night-mode #toggleSidebar { background: #d3d3d3; /* light grey */ border: 1px solid #444; color: #ccc; } .my-app-night-mode #toggleSidebar:hover { border-color: #7eb8ff; background: #bdbdbd; /* light grey */ color: #ccc; } .my-app-night-mode #submitQuestion, .my-app-night-mode #start { background-color: #8CAF85; color: #fff; } .my-app-night-mode #submitQuestion:hover, .my-app-night-mode #start:hover { background-color: #7ba079; } .my-app-night-mode .question { background-color: #3f3f3f; color: #fff; } .my-app-night-mode .question:hover { background-color: #2f2f2f; } .my-app-night-mode .question.answered { color: #aaa; } .my-app-night-mode .button-container button { border: 2px solid #ff4444; color: #fff; } .my-app-night-mode #questionSummary { background-color: #3f3f3f; color: #fff; } .my-app-night-mode .summary-count { color: #aaa; } .my-app-night-mode .summary-item { background-color: #3f3f3f; border: 1px solid #444; color: #fff; } .my-app-night-mode .summary-action { color: #888; } .my-app-night-mode .summary-action svg { fill: #bbb; } .my-app-night-mode .summary-action:hover { background-color: #2f2f2f; } .my-app-night-mode #delayTime { background-color: #333; /* Change the background color of the delay time input box to dark gray */ color: #ccc; /* Change the text color of the delay time input box to light gray */ transition: background-color 0.3s, color 0.3s; } .my-app-night-mode .clear-cache-btn { background-color: #68a0b0; color: #fff; } .my-app-night-mode .clear-cache-btn:hover { background-color: #6189a1; } .my-app-night-mode #openSetting, .my-app-night-mode #backToMainSidebar { color: #ccc; /* Use light gray as text color */ } .my-app-night-mode #openSetting:hover, .my-app-night-mode #backToMainSidebar:hover { color: #ddd; /* Use light gray as text color */ } .my-app-night-mode .dropdown { border: 1px solid #555; } .my-app-night-mode input[type="text"], .my-app-night-mode input[type="number"], .my-app-night-mode select { background-color: #1f1f1f; border: 1px solid #555; color: #fff; } .my-app-night-mode .input-row label, .my-app-night-mode .input-row input[type="text"], .my-app-night-mode .input-row input[type="number"], .my-app-night-mode .input-row select { color: #f5f5f5; /* Set text color to light white */ } .my-app-night-mode input[type="text"]:focus, .my-app-night-mode input[type="number"]:focus, .my-app-night-mode select:focus { border-color: #7eb8ff; outline: none; } .my-app-night-mode .input-row { color: gray; background-color: black; } .my-app-night-mode .button-container1 button { background-color: #88c0d0; color: #fff; } .my-app-night-mode .button-container1 button:active { box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2); transform: translateY(3px); } .my-app-night-mode .button-container1 button:hover { background-color: #81a1c1; } .my-app-night-mode .mode-option { background-color: #1f1f1f; } .my-app-night-mode .vertical-text { color: #fff; } .my-app-night-mode pre { background-color: #1f1f1f; color: #ddd; padding: 10px; border-radius: 5px; overflow-x: auto; } .my-app-night-mode #deleteCompleted, .my-app-night-mode #deletePending { background-color: lightgray; } .my-app-night-mode #runMode label { color: lightgray; } #delayTime:after { content: "Second"; margin-left: 5px; } .button-group { display: flex; flex-direction: row; gap: 5px; /* Add interval between the buttons */ } #start { display: block; margin-top: 5px; /* Move the running button to the next line */ } #stepRun { background-color: #007BFF; color: #fff; font-size: 16px; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; transition: background-color 0.3s, transform 0.3s; /* Add transitions */ } #stepRun:hover { background-color: #0056b3; /* Change background color on hover */ } #stepRun:active { background-color: #00408c; /* Change background color when clicked */ transform: translateY(2px); /* Add a slight vertical shift when clicked */ box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2); /* Add a shadow effect */ } `); // Create the main sidebar function createMainSidebar() { const sidebar = document.createElement('div'); sidebar.id = 'sidebar'; sidebar.innerHTML = ` <div id="toggleSidebar"> <svg viewBox="0 0 24 24" id="icon-expand"> <path d="M10 18h4v-2h-4v2zM3 13h18v-2H3v2zm0 7h12v-2H3v2zm0-14v2h18V6H3z"/> </svg> <svg viewBox="0 0 24 24" id="icon-collapse" style="display: none;"> <path d="M10 20h4V4h-4v16zm0-18H6v20h4V2zm8 0h-4v20h4V2z"/> </svg> </div> <section id="sidebarContent"> <h2 ID = "OpenSetting" style = "cursor: pointer;"> Prechat settings </h2> <textarea ID = "QuestionInput" Placeholder = "Please enter your prompt, you can enter batch input, default + split"> </textarea> <div class = "Button-Group"> <button id = "submitquestion"> Submit </Button> <button id = "stePrun"> single step operation </Button> </div> <div class = "Button-Group"> <button id = "start"> automatic operation </Button> </div> <ul id="questionList"></ul> <div id="questionSummary" class="question-summary"> <div class="summary-item"> <div class="icon-count-container"> <div class="icon-container"> <span class="summary-icon">✅</span> </div> <div class="count-container"> <span class="summary-count" id="completedCount">0</span> </div> </div> <div class="button-container"> <a href="#" class="summary-action" id="deleteCompleted"> <svg t="1685867554988" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2373" width="200" height="200"> <path d="M832 1024H192V288h64v672h512V288h64v736zM128 160h768v64H128z" fill="#2A2A3B" p-id="2374"></path> <path d="M672 224H352V0h320z m-256-64h192V64h-192zM384 384h64v448h-64zM576 384h64v448h-64z" fill="#2A2A3B" p-id="2375"></path> </svg> </a> </div> </div> <div class="summary-item"> <div class="icon-count-container"> <div class="icon-container"> <span class="summary-icon">❓</span> </div> <div class="count-container"> <span class="summary-count" id="pendingCount">0</span> </div> </div> <div class="button-container"> <a href="#" class="summary-action" id="deletePending"> <svg t="1685867554988" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2373" width="200" height="200"> <path d="M832 1024H192V288h64v672h512V288h64v736zM128 160h768v64H128z" fill="#2A2A3B" p-id="2374"></path> <path d="M672 224H352V0h320z m-256-64h192V64h-192zM384 384h64v448h-64zM576 384h64v448h-64z" fill="#2A2A3B" p-id="2375"></path> </svg> </a> </div> </div> </div> </section> `; document.body.appendChild(sidebar); // Apply night mode class if the selected theme is "Night mode " const savedTheme = localStorage.getItem('selectedTheme') || 'light'; // Default to light mode if (savedTheme === 'dark') { document.documentElement.classList.add('my-app-night-mode'); } } // Create setting sidebar function createSettingSidebar() { const settingSidebar = document.createElement('div'); settingSidebar.id = 'settingSidebar'; settingSidebar.style.display = 'none'; // Initially hide the sidebar of the sidebar settingSidebar.innerHTML = ` <section id="sidebarContent"> <h2 id="backToMainSidebar" style="cursor: pointer;">PreChat Save </h2> <div class="input-row"> <Label for = "themeselect"> Topic selection: </label> <select id="themeSelect" class="styled-select dropdown"> <option value="Light "> Daily Model </Option> <option value = "dark"> Night mode </option> </select> </div> <div class="input-row"><Label for = "splitcharinput"> split symbol: </label> <input type = "text" id = "splitcharinput" placeholder = "Leave a short default +" /> </div> <div class="input-row"><Label for = "additionalinput"> Output enhancement: </label> <div class="styled-select"> <div class="input-flex"> <laabel for = "depthSelect"> Deep: </label> <select id = "depthSelect" class = "dropdown" onchange = "Savedropdownsettings ()">> <option value = "None"> None </option> <option value = "Primary School (Grade 1-6)"> Primary School (Grade 1) </option> <option value = "junior high school (grade 7-9)"> junior high school (grade 7-9) </option> <option value = "High School (Grade 10-12)"> High School (Grade 10-12) </option> <option value = "University Foundation"> University Preparatory </Option> <option value = "Undergraduate"> Undergraduate </option> <option value = "Graduate"> Graduate </option> <option value = "Master's"> Master's degree </option> <option value = "doctoral candidate"> Doctor candidate </option> <option value = "post -doctoral"> post -doctoral </option> <option value = "Dr. .d"> Dr. .d </option> </select> </div> <div class="input-flex"> <label for="inferenceSelect">reasoning:</label> <select id="inferenceSelect" class="dropdown" onchange="saveDropdownSettings()"> <option value="None "> None</option> <option value="Expiring Method "> Expiring Method: Conclusion</option> <option value="Inductive law "> induction method: Example push law</option> <option value="Tracing of the Law "> Tracing and Law: Track on the cause of things</option> <option value="Actival method "> analog method: Similar push new situation</option> <option value="Random method "> Random method: No rules play</option> </select> </div> <div class="input-flex"> <label for="styleSelect">style:</label> <select id="styleSelect" class="dropdown" onchange="saveDropdownSettings()"> <option value="none">none</option> <option value="debate">debate</option> <option value="encourage">encourage</option> <option value="neutral">neutral</option> <option value="Information">Information</option> <option value="friendly">friendly</option> </select> </div> <input type="text" id="additionalInput" placeholder="For example, zero sample prompts (please think step by step), less sample prompts (provided output cases), thinking chain (providing thinking process), etc." /> </div> </div> <div class="input-row"> <label for="runMode">Run mode:</label> <div id="runMode"> <div class="mode-option"> <input type="radio" id="instant" name="mode" value="instant" checked> <label for="instant">immediate</label> </div> <div class="mode-option"> <input type="radio" id="delayed" name="mode" value="delayed"> <label for="delayed">Delay</label> <input type="number" id="delayTime" placeholder="432" disabled> </div> </div> </div> <div class="button-container1" style="display: inline-block;"> <button class="clear-cache-btn">Empty the cache</button> </div> <div class="button-container1" style="display: inline-block;"> <button class="clear-cache-btn"> <a href="https://fkaygdsx06.feishu.cn/docx/XcKHdDHNfoqNruxSzlIcSLUWnFd" target="_blank">Use documentation</a> </button> </div> </section> `; document.body.appendChild(settingSidebar); // Add the sidebar to the sidebar to DOM 中 // Add the following code after creating the code setting the sidebar document.getElementById('depthSelect').addEventListener('change', saveDropdownSettings); document.getElementById('inferenceSelect').addEventListener('change', saveDropdownSettings); document.getElementById('styleSelect').addEventListener('change', saveDropdownSettings); const clearCacheBtn = document.querySelector('.clear-cache-btn'); clearCacheBtn.addEventListener('click', clearCache); } // Creating code of the main side border and setting sidebar createMainSidebar(); createSettingSidebar(); function loadDropdownSettings() { const depthSelect = document.getElementById('depthSelect'); const inferenceSelect = document.getElementById('inferenceSelect'); const styleSelect = document.getElementById('styleSelect'); const savedTheme = localStorage.getItem('selectedTheme') || "light"; const savedDepth = localStorage.getItem('selectedDepth') || "Undergraduate"; // Choose undergraduate by default const savedInference = localStorage.getItem('selectedInference') || "deduction"; // Select the deduction method by default const savedStyle = localStorage.getItem('selectedStyle') || "Information"; // The default selection information is rich const themeSelect = document.getElementById('themeSelect'); themeSelect.addEventListener('change', changeTheme); themeSelect.value = savedTheme; depthSelect.value = savedDepth; inferenceSelect.value = savedInference; styleSelect.value = savedStyle; // Apply the selected theme and night mode class applyTheme(savedTheme); } function applyTheme(theme) { if (theme === 'dark') { document.documentElement.classList.add('my-app-night-mode'); } else { document.documentElement.classList.remove('my-app-night-mode'); } } function changeTheme() { const themeSelect = document.getElementById('themeSelect'); const selectedTheme = themeSelect.value; applyTheme(selectedTheme); // Save the selected theme to local storage localStorage.setItem('selectedTheme', selectedTheme); } function saveDropdownSettings() { const themeSelect = document.getElementById('themeSelect'); const depthSelect = document.getElementById('depthSelect'); const inferenceSelect = document.getElementById('inferenceSelect'); const styleSelect = document.getElementById('styleSelect'); const selectedTheme = themeSelect.value; const selectedDepth = depthSelect.value; const selectedInference = inferenceSelect.value; const selectedStyle = styleSelect.value; localStorage.setItem('selectedTheme', selectedTheme); localStorage.setItem('selectedDepth', selectedDepth); localStorage.setItem('selectedInference', selectedInference); localStorage.setItem('selectedStyle', selectedStyle); } document.getElementById('openSetting').addEventListener('click', function () { // Hide the main sidebar document.getElementById('sidebar').style.display = 'none'; // Display setting sidebar document.getElementById('settingSidebar').style.display = ''; // Load the drop -down box settings loadDropdownSettings(); // Local storage loading settings const splitChar = localStorage.getItem('splitChar'); const additional = localStorage.getItem('additional'); const runMode = localStorage.getItem('runMode'); const delayTime = localStorage.getItem('delayTime'); // Update setting the field in the sidebar document.getElementById('splitCharInput').value = splitChar || ''; document.getElementById('additionalInput').value = additional || ''; document.getElementById('delayTime').value = delayTime || ''; if (runMode === 'instant') { document.getElementById('instant').checked = true; } else if (runMode === 'delayed') { document.getElementById('delayed').checked = true; } }); document.getElementById('backToMainSidebar').addEventListener('click', function () { // Get the field value in setting the sidebar const selectedTheme = document.getElementById('themeSelect').value; const splitChar = document.getElementById('splitCharInput').value; const additional = document.getElementById('additionalInput').value; const runMode = document.querySelector('input[name="mode"]:checked').value; const delayTime = document.getElementById('delayTime').value; // Save settings to local storage localStorage.setItem('selectedTheme', selectedTheme); localStorage.setItem('splitChar', splitChar); localStorage.setItem('additional', additional); localStorage.setItem('runMode', runMode); localStorage.setItem('delayTime', delayTime); // Hide setting the sidebar document.getElementById('settingSidebar').style.display = 'none'; // Show the main sidebar document.getElementById('sidebar').style.display = ''; }); // Event listener for run mode radio button inputs const delayedRadio = document.getElementById('delayed'); const delayTimeInput = document.getElementById('delayTime'); delayedRadio.addEventListener('change', function () { delayTimeInput.disabled = false; }); const instantRadio = document.getElementById('instant'); instantRadio.addEventListener('change', function () { delayTimeInput.disabled = true; }); function clearCache() { var btn = document.querySelector('.clear-cache-btn'); if (typeof (Storage) !== "undefined") { if (confirm("Are you sure you want to clear all the cache data??")) { try { localStorage.clear(); console.log("The cache has been empty!"); btn.innerText = "The cache has been empty"; setTimeout(function () { btn.innerText = "Empty the cache"; }, 3000); // Restore the original after 3 seconds } catch (e) { console.log("Cleaning the cache failed, error information: ", e); } } } else { alert("Sorry, your browser does not support Web Storage..."); } } // Toggle logic document.getElementById('toggleSidebar').addEventListener('click', function () { var sidebar = document.getElementById('sidebar'); var iconExpand = document.getElementById('icon-expand'); var iconCollapse = document.getElementById('icon-collapse'); sidebar.classList.toggle('collapsed'); if (sidebar.classList.contains('collapsed')) { iconCollapse.style.display = 'none'; iconExpand.style.display = ''; } else { iconExpand.style.display = 'none'; iconCollapse.style.display = ''; } }); (function () { const questionList = document.getElementById('questionList'); const submitQuestionButton = document.getElementById('submitQuestion'); const questionInput = document.getElementById('questionInput'); const startButton = document.getElementById('start'); // Event listeners submitQuestionButton.addEventListener('click', handleQuestionSubmission); questionList.addEventListener('click', handleQuestionClick); window.addEventListener('load', loadQuestionsFromLocalStorage); startButton.addEventListener('click', startAskingQuestions); // Added one -step execution button event processing function document.getElementById('stepRun').addEventListener('click', function () { startAskingQuestions(true); // Run the function in a single step mode }); let isAutoRunMode = true; // Logic variables, indicating that the current is automatic operation mode // Event listeners startButton.addEventListener('click', function () { isAutoRunMode = true; // Set to automatic running mode startAskingQuestions(); }); document.getElementById('stepRun').addEventListener('click', function () { isAutoRunMode = false; // Set as a single -step running mode startAskingQuestions(); }); function generateUUID() { return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8); return v.toString(16); }); } function handleQuestionSubmission() { const questions = getQuestionsFromInput(); if (questions.some(question => question.trim() === "")) { return; // If any question is empty, return without executing further steps } for (let question of questions) { const uuid = generateUUID(); // Generate a unique ID for the question addQuestionToList(question, false, uuid); // Pass the answered state to addQuestionToList addQuestionToLocalStorage(question, uuid); // Pass the UUID to addQuestionToLocalStorage } clearInput(); makeQuestionListSortable(); updateQuestionCounts(); } function addQuestionToLocalStorage(question, uuid) { try { // Get the current list of questions from local storage let storedQuestions = getQuestionsFromLocalStorage(); // Check if getQuestionsFromLocalStorage returned a valid array if (!Array.isArray(storedQuestions)) { console.error('Failed to retrieve questions from local storage.'); return; } // Add the new question to the list storedQuestions.push({ id: uuid, text: question, answered: false }); // Store the updated list back to local storage localStorage.setItem('questions', JSON.stringify(storedQuestions)); // Update question counts updateQuestionCounts(); console.log(`Question "${question}" with ID "${uuid}" added to local storage.`); } catch (err) { console.error(`Error adding question to local storage: ${err}`); } } function handleQuestionClick(event) { if (event.target.classList.contains('question-text')) { toggleQuestionTextWhiteSpace(event.target); } } // Helper functions function getQuestionsFromInput() { // Obtain the split symbol from local storage, if there is no settings, use the default symbol const splitChar = localStorage.getItem('splitChar') || '+'; return questionInput.value.split(splitChar); } function addQuestionToList(question, answered, uuid) { if (question.trim() === "") { return null; // Return null if question is empty } const questionDiv = createQuestionDiv(question, answered); questionDiv.dataset.id = uuid; // Store the UUID in the DOM element questionList.appendChild(questionDiv); if (answered) { questionDiv.classList.add('answered'); } updateQuestionCounts(); return questionDiv; } function createQuestionDiv(question, answered) { const div = document.createElement('div'); div.className = 'question'; div.draggable = true; const questionContainer = document.createElement('div'); questionContainer.style.display = "flex"; questionContainer.style.justifyContent = "center"; // Add this line to center the content vertically const questionText = document.createElement('textarea'); questionText.className = 'question-text'; questionText.value = question; questionText.readOnly = true; questionText.style.border = 'none'; questionText.style.height = '42px'; questionText.style.resize = 'none'; questionText.style.margin = 'auto'; // Add this line to center the textarea vertically questionContainer.appendChild(questionText); div.appendChild(questionContainer); const buttonContainer = document.createElement('div'); buttonContainer.className = 'button-container'; // const editButton = createButton('edit', handleEditButtonClick); // buttonContainer.appendChild(editButton); const deleteButton = createButton('delete', handleDeleteButtonClick); buttonContainer.appendChild(deleteButton); const sortButton = createButton('sort'); buttonContainer.appendChild(sortButton); div.appendChild(buttonContainer); // Add 'answered' class if the question is answered if (answered) { div.classList.add('answered'); } div.addEventListener('dragstart', function (e) { e.dataTransfer.setData('text/plain', this.outerHTML); // Set the HTML of the element to the dragged data this.classList.add('dragging'); // Add a class to make the element look different when dragging }); div.addEventListener('dragend', function () { this.classList.remove('dragging'); // Remove the class when the drag is over }); return div; } // Suppose the ID of your question list is'questionList' const questionListDiv = document.getElementById('questionList'); questionListDiv.addEventListener('dragover', function (e) { e.preventDefault(); // Allow elements are placed const dragging = document.querySelector('.dragging'); const afterElement = getDragAfterElement(questionListDiv, e.clientY); // Get the element below the mouse if (afterElement == null) { questionListDiv.appendChild(dragging); // If there is no element below the mouse, place it at the end of the list } else { questionListDiv.insertBefore(dragging, afterElement); // Otherwise, put it in front of this element } }); function getDragAfterElement(container, y) { const draggableElements = [...container.querySelectorAll('.question:not(.dragging)')]; // Getting all the elements that can be dragged, except the one that is being dragged // Traversing elements and finding the elements below the mouse return draggableElements.reduce((closest, child) => { const box = child.getBoundingClientRect(); const offset = y - box.top - box.height / 2; if (offset < 0 && offset > closest.offset) { return { offset: offset, element: child }; } else { return closest; } }, { offset: Number.NEGATIVE_INFINITY }).element; } function createButton(type, clickHandler) { const button = document.createElement('button'); button.className = `${type}-button`; switch (type) { // case 'edit': // button.innerHTML = `<svg t="1684557647867" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3766" width="20" height="20"><path d="M862.709333 116.042667a32 32 0 1 1 45.248 45.248L455.445333 613.813333a32 32 0 1 1-45.258666-45.258666L862.709333 116.053333zM853.333333 448a32 32 0 0 1 64 0v352c0 64.8-52.533333 117.333333-117.333333 117.333333H224c-64.8 0-117.333333-52.533333-117.333333-117.333333V224c0-64.8 52.533333-117.333333 117.333333-117.333333h341.333333a32 32 0 0 1 0 64H224a53.333333 53.333333 0 0 0-53.333333 53.333333v576a53.333333 53.333333 0 0 0 53.333333 53.333333h576a53.333333 53.333333 0 0 0 53.333333-53.333333V448z" fill="#000000" p-id="3767"></path></svg>`; // SVG for edit button // break; case 'delete': button.innerHTML = `<svg t="1684556652392" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2423" width="20" height="20"><path d="M202.666667 256h-42.666667a32 32 0 0 1 0-64h704a32 32 0 0 1 0 64H266.666667v565.333333a53.333333 53.333333 0 0 0 53.333333 53.333334h384a53.333333 53.333333 0 0 0 53.333333-53.333334V352a32 32 0 0 1 64 0v469.333333c0 64.8-52.533333 117.333333-117.333333 117.333334H320c-64.8 0-117.333333-52.533333-117.333333-117.333334V256z m224-106.666667a32 32 0 0 1 0-64h170.666666a32 32 0 0 1 0 64H426.666667z m-32 288a32 32 0 0 1 64 0v256a32 32 0 0 1-64 0V437.333333z m170.666666 0a32 32 0 0 1 64 0v256a32 32 0 0 1-64 0V437.333333z" fill="#000000" p-id="2424"></path></svg>`; // SVG for delete button break; case 'sort': button.innerHTML = `<svg t="1684417162772" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6670" width="24" height="24"><path d="M368 706.72l-64 64V576h-64v194.72l-64-64L130.72 752 272 893.28 413.28 752 368 706.72zM272 130.72L130.72 272 176 317.28l64-64V448h64V253.28l64 64L413.28 272 272 130.72zM480 192h416v64H480zM480 384h416v64H480zM480 576h416v64H480zM480 768h416v64H480z" fill="#333333" p-id="6671"></path></svg>`; // SVG for sort button break; } if (clickHandler) { button.addEventListener('click', clickHandler); } return button; } // function handleEditButtonClick(event) { // const questionText = event.target.parentElement.previousElementSibling; // const isEditing = questionText.getAttribute('data-isEditing') === 'true'; // if (!isEditing) { // If it's not in editing state // questionText.setAttribute('contentEditable', 'true'); // questionText.style.border = '1px solid'; // questionText.style.backgroundColor = '#fff'; // questionText.focus(); // questionText.setAttribute('data-isEditing', 'true'); // } else { // If it's in editing state // questionText.setAttribute('contentEditable', 'false'); // questionText.style.border = 'none'; // questionText.style.backgroundColor = 'transparent'; // questionText.removeAttribute('data-isEditing'); // Remove the attribute // // Update the corresponding question in localStorage // const storedQuestions = JSON.parse(localStorage.getItem('questions') || '[]'); // const questionToUpdate = storedQuestions.find(q => q.text === questionText.textContent); // if (questionToUpdate) { // questionToUpdate.text = questionText.textContent; // localStorage.setItem('questions', JSON.stringify(storedQuestions)); // } // } // } function handleDeleteButtonClick(event) { // Use the closest method to get the question div const questionDiv = event.target.closest('.question'); const questionText = questionDiv.querySelector('input.question-text'); const questionUuid = questionDiv.dataset.id; // Get the UUID from the DOM element // Remove the question from the DOM questionDiv.remove(); updateQuestionCounts(); // Remove the question from localStorage let storedQuestions = getQuestionsFromLocalStorage(); // We can use this helper function here storedQuestions = storedQuestions.filter(q => q.id !== questionUuid); // Use the UUID to filter the question localStorage.setItem('questions', JSON.stringify(storedQuestions)); updateQuestionCounts(); } function clearInput() { questionInput.value = ''; } function makeQuestionListSortable() { new Sortable(questionList, { handle: '.sort-button', animation: 150 }); } function toggleQuestionTextWhiteSpace(questionText) { questionText.style.whiteSpace = questionText.style.whiteSpace === 'nowrap' ? 'normal' : 'nowrap'; } function loadQuestionsFromLocalStorage() { try { const storedQuestions = getQuestionsFromLocalStorage(); for (let question of storedQuestions) { let questionDiv = addQuestionToList(question.text, question.answered, question.id); if (question.answered) { questionDiv.classList.add('answered'); } } updateQuestionCounts(); console.log(`Loaded ${storedQuestions.length} questions from local storage.`); } catch (err) { console.error(`Error loading questions from local storage: ${err}`); } } function getQuestionsFromLocalStorage() { try { let storedQuestions = localStorage.getItem('questions'); storedQuestions = storedQuestions ? JSON.parse(storedQuestions) : []; // Map raw objects from local storage to question objects with custom methods storedQuestions = storedQuestions.map((rawQuestion) => ({ id: rawQuestion.id, text: rawQuestion.text, answered: rawQuestion.answered })); console.log(`Retrieved ${storedQuestions.length} questions from local storage.`); return storedQuestions; } catch (err) { console.error(`Error retrieving questions from local storage: ${err}`); return []; // Return an empty array if there was an error } } function updateQuestionCounts() { const counts = getQuestionCounts(); document.getElementById('completedCount').textContent = counts.answeredCount; document.getElementById('pendingCount').textContent = counts.unansweredCount; } async function startAskingQuestions() { try { const questions = Array.from(document.getElementsByClassName('question')); const runMode = localStorage.getItem('runMode'); const delayTime = parseInt(localStorage.getItem('delayTime') || '300'); for (let i = 0; i < questions.length; i++) { const questionDiv = questions[i]; // Check whether the question has been answered if (questionDiv.classList.contains('answered')) { continue; // If you have answered, skip this question } const questionInput = questionDiv.querySelector('textarea.question-text'); const questionUUID = questionDiv.dataset.id; if (!questionDiv.classList.contains('answered')) { let questionText = questionInput.value; // Save question text // Get the value of the drop -down box const depthSelect = document.getElementById('depthSelect'); const inferenceSelect = document.getElementById('inferenceSelect'); const styleSelect = document.getElementById('styleSelect'); const selectedDepth = depthSelect.value; // Get the selected value const selectedInference = inferenceSelect.value; // Get the selected value const selectedStyle = styleSelect.value; // Get the selected value const selectedValues = []; // Check if the selected values are not "none", and add them to the selectedValues array if (selectedDepth !== "none") { selectedValues.push(`Answer depth: ${selectedDepth}`); } if (selectedInference !== "none") { selectedValues.push(`Reasoning framework: ${selectedInference}`); } if (selectedStyle !== "none") { selectedValues.push(`Answer style: ${selectedStyle}`); } // Join the selectedValues array with a space as a separator const selectedText = selectedValues.join(' '); // Append the selectedText to the questionText if it is not empty if (selectedText) { questionText += ` ${selectedText}`; } if (runMode === 'instant') { console.log(`Asking question instantly: ${questionText}`); await askQuestionInstant(questionText); } else if (runMode === 'delayed') { console.log(`Delaying for ${delayTime}ms before asking question: ${questionText}`); await delay(delayTime); await askQuestionDelayed(questionText); } questionDiv.classList.add('answered'); updateQuestionInLocalStorage(questionUUID, true); // Update the question status is to answer console.log(`Question asked and marked as answered: ${questionText}`); await new Promise(resolve => setTimeout(resolve, 500)); } // If you are in a single -step running mode, exit the cycle after dealing with a problem if (!isAutoRunMode) { break; } } await updateQuestionCounts(); } catch (err) { console.error(`Error occurred while asking questions: ${err}`); } } async function askQuestionInstant(question) { return new Promise((resolve, reject) => { try { const additional = localStorage.getItem('additional') || ''; const questionToSend = `${question} ${additional}`.trim(); const inputBox = document.querySelector('textarea'); if (!inputBox) { reject('Could not find textarea for input.'); } inputBox.value = questionToSend; const event = new Event('input', { bubbles: true }); inputBox.dispatchEvent(event); const interval = setInterval(() => { const sendButton = inputBox.nextElementSibling; if (sendButton && !sendButton.disabled) { sendButton.click(); } else { clearInterval(interval); resolve(); } }, 1000); // Check whether the sending button can be clicked once per second } catch (err) { console.error(`Error occurred while asking question: ${err}`); reject(err); } }); } function askQuestionDelayed(question) { return new Promise((resolve, reject) => { try { if (!question) { console.error("No question provided"); reject('No question provided'); return; } const additional = localStorage.getItem('additional') || ''; const questionToSend = `${question} ${additional}`.trim(); const inputBox = document.querySelector('textarea'); if (!inputBox) { console.error("Input box not found"); reject('Input box not found'); return; } inputBox.value = questionToSend; const event = new Event('input', { bubbles: true }); inputBox.dispatchEvent(event); const sendButton = inputBox.nextElementSibling; if (!sendButton) { console.error("Send button not found"); reject('Send button not found'); return; } const delayTime = parseInt(localStorage.getItem('delayTime'), 10); if (isNaN(delayTime)) { console.error("Invalid delayTime"); reject('Invalid delayTime'); return; } // Delay for delayTime (ms) then click the button and resolve setTimeout(() => { console.log(`Question sent after delay of ${delayTime} ms`); sendButton.click(); resolve(); }, delayTime * 1000); } catch (error) { console.error(`Error in askQuestionDelayed: ${error}`); reject(error); } }); } function updateQuestionInLocalStorage(questionUUID, answered) { try { let storedQuestions = getQuestionsFromLocalStorage(); let questionToUpdate = storedQuestions.find(q => q.id === questionUUID); // Check if questionToUpdate is found if (!questionToUpdate) { console.error(`Question with UUID ${questionUUID} not found in local storage.`); return false; } console.log('Updating question:', questionToUpdate); // Update the answered status of the question questionToUpdate.answered = answered; // Update the question list in local storage localStorage.setItem('questions', JSON.stringify(storedQuestions)); console.log(`Question with UUID ${questionUUID} updated successfully.`); // Return true on successful update return true; } catch (error) { console.error(`Error in updateQuestionInLocalStorage: ${error}`); return false; } } function delay(ms) { return new Promise((resolve, reject) => { setTimeout(resolve, ms); }); } function getQuestionCounts() { let storedQuestions = getQuestionsFromLocalStorage(); let answeredCount = 0; let unansweredCount = 0; for (let question of storedQuestions) { if (question.answered) { answeredCount++; } else { unansweredCount++; } } return { answeredCount, unansweredCount }; } async function deleteCompletedQuestions() { let questions = document.querySelectorAll('.question.answered'); for (let question of questions) { let questionUUID = question.dataset.id; question.remove(); await removeFromLocalStorage(questionUUID) .then(questionUUID => console.log(`Question with UUID ${questionUUID} removed from local storage.`)) .catch(error => console.error(`Error removing question from local storage: ${error}`)); } updateQuestionCounts(); } async function deletePendingQuestions() { let confirmation = confirm('Are you sure you want to delete all the unfinished problems?'); if (confirmation) { let questions = document.querySelectorAll('.question:not(.answered)'); for (let question of questions) { let questionUUID = question.dataset.id; question.remove(); await removeFromLocalStorage(questionUUID) .then(questionUUID => console.log(`Question with UUID ${questionUUID} removed from local storage.`)) .catch(error => console.error(`Error removing question from local storage: ${error}`)); } } updateQuestionCounts(); } async function removeFromLocalStorage(questionUUID) { return new Promise((resolve, reject) => { let storedQuestions = localStorage.getItem('questions'); storedQuestions = storedQuestions ? JSON.parse(storedQuestions) : []; storedQuestions = storedQuestions.filter(q => q.id !== questionUUID); localStorage.setItem('questions', JSON.stringify(storedQuestions)); resolve(questionUUID); // Modify here to pass Questionuuid to Resolve }); } document.getElementById('deleteCompleted').addEventListener('click', deleteCompletedQuestions); document.getElementById('deletePending').addEventListener('click', deletePendingQuestions); })(); })(); function toggleInput(radio) { var delayTimeInput = document.getElementById("delayTime"); delayTimeInput.disabled = !radio.checked; if (radio.checked) { delayTimeInput.focus(); delayTimeInput.select(); } }
i just checked, no.
Translated by Webmaster-exit-1 a.k.a. MrGFY