☰

Greasy Fork 支持简体中文。

ChatGPT Enhanced Interface

It enhances the ChatGPT interface and will not send the message unless the button is pushed. This allows the user to type multiple lines in a message without being interrupted when hitting the Enter key. The submit button is colored white until it is selected and turns green. This indicates that it is active and at that point pressing the space bar or enter should activate the button and submit the prompt to ChatGPT.

目前為 2023-12-16 提交的版本，檢視 最新版本。

  1. // ==UserScript==
  2. // @name         ChatGPT Enhanced Interface
  3. // @namespace    https://github.com/lundeen-bryan
  4. // @version      1.0.0
  5. // @description  It enhances the ChatGPT interface and will not send the message unless the button is pushed. This allows the user to type multiple lines in a message without being interrupted when hitting the Enter key. The submit button is colored white until it is selected and turns green. This indicates that it is active and at that point pressing the space bar or enter should activate the button and submit the prompt to ChatGPT.
  6. // @author       lundeen-bryan
  7. // @match        https://chat.openai.com/*
  8. // @noframes     true
  9. // @license      GPL
  10. // ==/UserScript==
  11.  
  12. (function() {
  13.     'use strict';
  14.  
  15.     /**
  16.      * Functionality for Ctrl+Enter and Enter
  17.      * @param {KeyboardEvent} event
  18.      */
  19.     function handleKeyPress(event) {
  20.         const inputBox = document.querySelector('textarea');
  21.         if (event.key === 'Enter' && !event.metaKey && inputBox) {
  22.             event.stopPropagation();
  23.         }
  24.     }
  25.  
  26.     // Override the enter key to allow multiple lines
  27.     function overrideEnterKey() {
  28.         const inputBox = document.querySelector('textarea');
  29.         if (inputBox) {
  30.             inputBox.removeEventListener('keydown', handleKeyPress, true);
  31.             inputBox.addEventListener('keydown', handleKeyPress, true);
  32.         }
  33.     }
  34.  
  35.     // Observer for eky press to override the enter key
  36.     const observerForKeyPress = new MutationObserver(overrideEnterKey);
  37.     observerForKeyPress.observe(document, { childList: true, subtree: true });
  38.  
  39.     // Style for focused button and arrow
  40.     const style = document.createElement('style');
  41.     style.textContent = `
  42.         .focused-gizmo {
  43.             background-color: #19c37d !important; /* New button color */
  44.         }
  45.         .focused-gizmo svg {
  46.             color: white !important; /* New arrow color */
  47.         }
  48.     `;
  49.     document.head.appendChild(style);
  50.  
  51.     /**
  52.      * Functionality for changing button color on focus
  53.      * @param {FocusEvent} event
  54.      */
  55.     function toggleFocusStyle(event) {
  56.         const button = document.querySelector('[data-testid="send-button"]');
  57.         if (event.type === 'focus') {
  58.             button.classList.add('focused-gizmo');
  59.         } else if (event.type === 'blur') {
  60.             button.classList.remove('focused-gizmo');
  61.         }
  62.     }
  63.  
  64.     // Adds listener for button focus to change color
  65.     function addButtonFocusListener() {
  66.         const button = document.querySelector('[data-testid="send-button"]');
  67.         if (button) {
  68.             button.addEventListener('focus', toggleFocusStyle, {once: true});
  69.             button.addEventListener('blur', toggleFocusStyle, {once: true});
  70.         }
  71.     }
  72.  
  73.     // Observer for button focus to change color
  74.     const observerForButtonFocus = new MutationObserver(addButtonFocusListener);
  75.     observerForButtonFocus.observe(document.body, { childList: true, subtree: true });
  76. })();