Input en javascript

Fermé

RaphaelDesinope Messages postés 2 Date d'inscription mercredi 18 mai 2022 Statut Membre Dernière intervention 28 mai 2022 - Modifié le 28 mai 2022 à 19:30
jordane45 Messages postés 38300 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 novembre 2024 - 28 mai 2022 à 19:36

Bonjour,

je souhaite fusionner un input que j'ai codé qui donne une phrase et des commentaires sur une liste de chiffres quand on rentre juste la liste de chiffres, avec une API de synthèse vocale de mozilla qui donne une voix lisant un texte que l'on rentre . I lfaudrait que mon texte de sortie devienne le texte d'entrée automatiquement et directement an français. Je présume que cela se passe dans le txt ou text du second script.

HTML :

  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width">

    <title>Speech synthesiser</title>

    <link rel="stylesheet" href="style.css">
    <!--[if lt IE 9]>
      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
   
  </head>

  <body>
    
    <h1> Number Analyser</h1>
    Please copy-paste this random series of one hundred numbers into the input prompter, then click the red button:</h3></div>
 <br/><br/> <p>1, 32, 34, 18, 34, 30, 35, 19, 19, 21, 28, 31, 32, 9, 29, 31, 11, 19, 36, 17, 25, 19, 0, 34, 1, 21, 26, 17, 36, 27, 29, 22, 27, 18, 15, 0, 16, 31, 30, 34, 2, 18, 10, 35, 33, 13, 3, 25, 1, 4, 13, 19, 21, 0, 29, 7, 26, 6, 32, 23, 11, 21, 22, 12, 32, 17, 32, 11, 4, 14, 2, 19, 25, 15, 14, 1, 23, 21, 16, 16, 21, 26, 1, 6, 22, 34, 2, 14, 20, 28, 27, 7, 7, 3, 25, 14, 11, 29, 34, 15, 1 <br/><br/></center></h>




<br/><h4>
 <center> <input class="txt " type="text"   id="myInput"   value=""   style="width:80%"><br><br/>



  <button onclick ="myFunction()" button class="button"  type="submit" >PRESS AFTER PASTING NUMBERS</button> </center><br/><br/></h4><p>

  I would like to merge the two inputs and code so that on input <b/>I get on one hand the numbers displayed in html and simultaneously automatically the numbers enter read in French or Englisg
</p>

<h4 id="experience0" style="color: blue"><br/>
    <h1>Speech synthesiser</h1>

    <p>Enter some text in the input below and press return  or the "play" button to hear it. change voices using the dropdown menu.</p>
    
    <form>
    <input type="text" class="txt">
    <div>
      <label for="rate">Rate</label><input type="range" min="0.5" max="2" value="1" step="0.1" id="rate">
      <div class="rate-value">1</div>
      <div class="clearfix"></div>
    </div>
    <div>
      <label for="pitch">Pitch</label><input type="range" min="0" max="2" value="1" step="0.1" id="pitch">
      <div class="pitch-value">1</div>
      <div class="clearfix"></div>
    </div>
    <select>

    </select>
    <div class="controls">
      <button id="play" type="submit">Play</button>
    </div>
    </form>




<script>


var array= [] ;

var No ; 
var someStr ;
var n;
function myFunction(){
  var n = document.getElementById("myInput").value;
  
  var someStr = n ;
  
 var No = someStr.split(", ");//.join('');

    var len = No.length ; 
  

  document.getElementById("experience0").innerHTML += "Hello, In experiment n°1, you submitted the following numbers which are primary data that I classified in an array called var No which contains the following"+len+"  numbers " +No+ " ."  ;

}

//---------- speech synthtiser code 

var synth = window.speechSynthesis;

var inputForm = document.querySelector('form');
var inputTxt = document.querySelector('.txt');
var voiceSelect = document.querySelector('select');

var pitch = document.querySelector('#pitch');
var pitchValue = document.querySelector('.pitch-value');
var rate = document.querySelector('#rate');
var rateValue = document.querySelector('.rate-value');

var voices = [];

function populateVoiceList(){
  voices = synth.getVoices().sort(function (a, b) {
      const aname = a.name.toUpperCase(), bname = b.name.toUpperCase();
      if ( aname < bname ) return -1;
      else if ( aname == bname ) return 0;
      else return +1;
  });
  var selectedIndex = voiceSelect.selectedIndex < 0 ? 0 : voiceSelect.selectedIndex;
  voiceSelect.innerHTML = '';
  for(i = 0; i < voices.length ; i++) {
    var option = document.createElement('option');
    option.textContent = voices[i].name + ' (' + voices[i].lang + ')';
    
    if(voices[i].default) {
      option.textContent += ' -- DEFAULT';
    }

    option.setAttribute('data-lang', voices[i].lang);
    option.setAttribute('data-name', voices[i].name);
    voiceSelect.appendChild(option);
  }
  voiceSelect.selectedIndex = selectedIndex;
}

populateVoiceList();
if (speechSynthesis.onvoiceschanged !== undefined) {
  speechSynthesis.onvoiceschanged = populateVoiceList;
}

function speak(){
    if (synth.speaking) {
        console.error('speechSynthesis.speaking');
        return;
    }
    if (inputTxt.value !== '') {
    var utterThis = new SpeechSynthesisUtterance(inputTxt.value);
    utterThis.onend = function (event) {
        console.log('SpeechSynthesisUtterance.onend');
    }
    utterThis.onerror = function (event) {
        console.error('SpeechSynthesisUtterance.onerror');
    }
    var selectedOption = voiceSelect.selectedOptions[0].getAttribute('data-name');
    for(i = 0; i < voices.length ; i++) {
      if(voices[i].name === selectedOption) {
        utterThis.voice = voices[i];
        break;
      }
    }
    utterThis.pitch = pitch.value;
    utterThis.rate = rate.value;
    synth.speak(utterThis);
  }
}

inputForm.onsubmit = function(event) {
  event.preventDefault();

  speak();

  inputTxt.blur();
}

pitch.onchange = function(){
  pitchValue.textContent = pitch.value;
}

rate.onchange = function(){
  rateValue.textContent = rate.value;
}

voiceSelect.onchange = function(){
  speak();
}


</script>

  </body>
</html>

EDIT : Ajout des balises de code

A voir également:

Input en javascript
Telecharger javascript - Télécharger - Langages
Input signal not found ✓ - Forum Matériel & Système
No video input ✓ - Forum Matériel & Système
Input signal out of range change settings to 1600x900-60hz - Forum Windows
A javascript error occurred in the main process - Forum Matériel & Système

1 réponse

Réponse 1 / 1

jordane45 Messages postés 38300 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 novembre 2024 4 704
28 mai 2022 à 19:36

Bonjour,

As tu essayé de comprendre ce que font tes codes au lieu de juste les copier/coller ??

Par exemple, As tu vu, dans le second script, quelle variable est utilisée pour "contenir" le texte à lire ?
Donc, commence par la remplacer par celle dans laquelle tu mets ton texte...

Ensuite, tu te pencheras sur le "déclenchement" automatique...

PS: à l'avenir, pour poster du code sur le forum, pense à utiliser les balises de code ( https://forums.commentcamarche.net/forum/affich-37598670-mise-en-forme-du-forum-et-des-fiches-pratiques-ccm#les-codes-sources )

Discussions similaires

input signal out of range

Javascript Arrondi à 2 chiffres après la virgule

comment désactiver out of range

No video input après mise en veille

2ND ECRAN "Input not supported"