☰

Change ChatGPT Image And Text To Speach Function

ChatGPT

Versión del día 17/01/2023. Echa un vistazo a la versión más reciente.

  1. // ==UserScript==
  2. // @name         Change ChatGPT Image And Text To Speach Function
  3. // @namespace    Change ChatGPT Image And Text To Speach Function
  4. // @version      0.1
  5. // @description  ChatGPT
  6. // @author       kaes-u-paya for text to speach and mei for the image change
  7. // @match        https://chat.openai.com/chat
  8. // @grant        none
  9. // @license MIT
  10. // ==/UserScript==
  11.  
  12. //var link = "https://s3.bmp.ovh/imgs/2022/12/18/f2294e4eb27e9161.jpg";
  13. var link = "https://cdn4.iconfinder.com/data/icons/artificial-intelligence-35/64/artificial-intelligence-ai-avatar-robot-512.png";
  14. var circle = false;
  15. var shadow = false;
  16.  
  17. //var textinput = "Hi how are you?";
  18.  
  19. document.addEventListener("DOMNodeInserted", function(event) {
  20.  
  21.   let tar = event.target.nodeName;
  22.   let rel = event.relatedNode.nodeName;
  23.  
  24. /*
  25.  * alert('inserted ' + event.target.childNodes[0].childNodes[0].childNodes[0].childNodes[0].getElementsByTagName('img')[1].alt);// new node -- extract your name from google account avatar logo alt text
  26.  */
  27.  
  28. /*
  29. try {
  30.   let AiLogo = event.target.childNodes[0].childNodes[0].childNodes[0].getElementsByTagName('svg')[0].getAttribute("class"); // find the event when the AI logo will be inserted - class -> 'h-6 w-6'
  31. } catch (event) {
  32.   if (event.name === 'TypeError') { //element doesnt exist yet (undefined) - wait for the element to be created
  33.   } else {
  34.     throw event; // re-throw the error
  35.   }
  36. }
  37. */
  38. let AiLogo = event.target.childNodes[0].childNodes[0].childNodes[0].getElementsByTagName('svg')[0].getAttribute("class"); // find the event when the AI logo will be inserted - class -> 'h-6 w-6'
  39. if (AiLogo === 'h-6 w-6'){ //now swap the logo with the custom logo
  40.  
  41.     let elementsSVG = document.querySelectorAll('.flex.flex-col.relative.items-end svg');
  42.     elementsSVG.forEach(function(elementSVG) {
  43.         var imgElement = document.createElement("img");
  44.         imgElement.src = link;
  45.         if(circle){imgElement.style.borderRadius = "14px";}
  46.         if(shadow){imgElement.style.boxShadow = "0 2px 4px rgba(0,0,0,6)";}
  47.  
  48.         elementSVG.parentNode.replaceChild(imgElement, elementSVG);
  49.     });
  50.  
  51.     let elementsRound = document.querySelectorAll('.relative.p-1.rounded-sm.text-white.flex.items-center.justify-center');
  52.     elementsRound.forEach(function(elementRound) {
  53.         elementRound.style.padding = '0';
  54.         if(circle){elementRound.style.borderRadius = "14px";}
  55.     });
  56.  
  57. }
  58.  
  59. /*
  60. try {
  61.   let AiAnswer = event.target.childNodes[0].childNodes[1].childNodes[0].getElementsByTagName('div')[0].getAttribute("class"); //find the event when the AI gives an answer
  62. } catch (event) {
  63.   if (event.name === 'TypeError') { //element doesnt exist yet (undefined) - wait for the element to be created
  64.   } else {
  65.     throw event; // re-throw the error
  66.   }
  67. }
  68. */
  69.  
  70. let AiAnswer = event.target.childNodes[0].childNodes[1].childNodes[0].getElementsByTagName('div')[0].getAttribute("class"); //find the event when the AI gives an answer
  71. if (AiAnswer === 'min-h-[20px] flex flex-col items-start gap-4 whitespace-pre-wrap'){
  72.  
  73. //alert (event.relatedNode.innerHTML);
  74.  
  75. let collectionA = document.getElementsByClassName('w-full border-b border-black/10 dark:border-gray-900/50 text-gray-800 dark:text-gray-100 group bg-gray-50 dark:bg-[#444654]'); //maybe that tag is different if you don't unse the dark theme!
  76. var cLL = collectionA.length;
  77.  
  78.  
  79.      if (cLL > 0){
  80.  
  81. var readcounter = 0;
  82. var countnochange = 0;
  83. var delay = 6000; //Delay for one loop = 6 seconds
  84. var cutstart = 0;
  85. var cutend = 0;
  86. var cut1 = 0;
  87. var cut2 = 0;
  88. var speakstring = '';
  89. var oldlenght = 0;
  90.  
  91.  
  92.   var myLoop = setInterval(function() {
  93.  
  94.   var currentLL = collectionA[cLL-1].childNodes[0].childNodes[1].childNodes[0].childNodes[0].childNodes[0].innerHTML;
  95.       currentLL = currentLL.substr(3,currentLL.length-2);
  96.  
  97.     if (currentLL.length > oldlenght){
  98.        oldlenght = currentLL.length;
  99.        countnochange = 0;
  100.     }
  101.  
  102.  
  103.      readcounter++;
  104.  
  105.  
  106.       var posd = currentLL.lastIndexOf('.')+1;
  107.       var posp = currentLL.lastIndexOf(':')+1;
  108.       var pose = currentLL.lastIndexOf('!')+1;
  109.       var posq = currentLL.lastIndexOf('?')+1;
  110.       var posb = currentLL.lastIndexOf(',')+1;
  111.       var posX = currentLL.lastIndexOf(' ')+1;
  112.  
  113.     console.log ('posd: '+posd+' posp: '+posp+' pose: '+pose+' posq: '+posq+' posb: '+posb+' posX: '+posX);
  114.  
  115.    if (posd > cut1) {cut1 = posd;}
  116.    if (posp > cut1) {cut1 = posp;}
  117.    if (pose > cut1) {cut1 = pose;}
  118.    if (posq > cut1) {cut1 = posq;}
  119.  
  120.    if (posb > cut2) {cut2 = posb;}
  121.    if (posX > cut2) {cut2 = posX;}
  122.  
  123.    if (posX-posb<20){cut2 = posb;}else{cut2 = posX;} //prefer cutting at ',' instead of the ' ' if the the ',' is less than 20 chars away.. for fluent speaking
  124.    if (cut2>cut1){cutend = cut2;}else{cutend = cut1;} //prefer .:!?
  125.  
  126. console.log ('----------------------------------------------------------');
  127. console.log ('start: '+cutstart);
  128. console.log ('stop: '+cutend);
  129.  
  130. var diff = oldlenght - cutend;
  131. console.log ('lenght: '+oldlenght);
  132. console.log ('diff: '+diff);
  133.  
  134. if (readcounter === 1){
  135.     speakstring = currentLL.substr(cutstart, cutend);
  136.     speakstring = speakstring.replaceAll(/(<([^>]+)>)/ig,' '); //replace all tags with ' '
  137. }else{
  138.    var fixend = cutend - diff;
  139.     console.log ('fixing end to: '+fixend);
  140.     speakstring = currentLL.substr(cutstart, fixend); //WTF!!!!
  141.     speakstring = speakstring.substr(0, (speakstring.length - diff));
  142.     speakstring = speakstring.replaceAll(/(<([^>]+)>)/ig,' ');
  143. }
  144.  
  145.     console.log ('readcounter:'+readcounter);
  146.     console.log ('speakstring:'+speakstring);
  147.     console.log ('----------------------------------------------------------');
  148.     const synth = window.speechSynthesis;
  149.     const voices = window.speechSynthesis.getVoices();
  150.     //console.log ('voices:'+voices.length);
  151.     const lastVoice = voices[voices.length - 1];//change voice - https://codersblock.com/blog/javascript-text-to-speech-and-its-many-quirks/
  152.     const utterThis2 = new SpeechSynthesisUtterance(speakstring);
  153.     utterThis2.voice = lastVoice;
  154.     synth.speak(utterThis2);
  155.     cutstart = cutend; //for next loop cycle
  156.  
  157.  
  158.     if (currentLL.length === oldlenght){ // no change in text AI finisched writeing
  159.         countnochange++;
  160.         console.log ('count answer no change: '+countnochange);
  161.           if (countnochange > 7){ //aftere 7 loops stop checking for changed answer
  162.            clearInterval(myLoop);
  163.             console.log ('count answer no change: '+countnochange);
  164.             console.log ('stoped checking for answerchange');
  165.             countnochange = 0;
  166.           }
  167.     }
  168.  
  169.   }, delay);
  170.  
  171. }
  172.  
  173. } //end answer
  174.  
  175. });
  176.  
  177. /*
  178.  
  179. let textelements = document.querySelectorAll('.flex.flex-col.w-full.py-2');
  180. let element = textelements[0];
  181. let textarea = element.querySelector('textarea');
  182. textarea.value = textinput;
  183.  
  184. */
  185.  
  186.  
  187. /*
  188. document.addEventListener('DOMContentLoaded', function() {
  189.  
  190. });
  191. */
  192.  
  193.