using multiple variables to open different links

时光总嘲笑我的痴心妄想 提交于 2019-12-08 05:02:36

问题


Edit, Updated

see my main goal is first to let the user request a specific (book_name) by the voice (speech to text) then the book open to read it loudly (text to speech) and the last step is to print this book to braille, my stuck points is I didn't found a way to open the book as pdf so I just left him as a text area, and I don't know how to convert the text to braille letters with this code https://gist.github.com/meh/141520


My goal is to open different pages when calling different variables but the code doesn't respond, only one variable open one page

 if (speechresult ) {

    //here I added speechrecognizer.stop for the commands to not get interrupted
    speechRecognizer.stop();
    var yourValue = 'Book 1';
      window.open("http://localhost/introductiontonetworking.html");
    responsiveVoice.speak(bookstart, "UK English Female", {
        //The pitch property of the SpeechSynthesisUtterance interface gets and sets the pitch at which the utterance will be spoken at. by default 1
        pitch: 1
    }, {
        //rate by default 1
        rate: 1
    });

}


else if (speechresult == book2) {

    speechRecognizer.stop();
            var yourValue = 'Book 2';
      window.open("http://localhost/ethicalhacking.html");
    responsiveVoice.speak(bookstart, "UK English Female", {

        pitch: 1
    }, {

        rate: 1
    });

}

I plan to use multiple books, so when said = book1 open the first book and book2 = open the second and so on?what is the problem of my code


回答1:


You can try associate array to store book name & link as

link_arr['book1']='linkforbook1'; link_arr['book2']='linkforbook2'; . . .

Get link for respective book by

link=link_arr[bookVal];




回答2:


SpeechSynthesis.speak() expects either a string or a SpeechSynthesisUtterance object, not a plain object


You can use Array.prototype.map() to convert the text of chapters of book to Braille.

Use data-* attribute at HTML to set JSON representation of chapters expected to be recognized by the service, for example both "chapter one" and "chapter 1" and "chapter two" and "chapter 2" respectively.

At result event of SpeechSynthesisUtterance filter <textarea> elements to select the corresponding chapter of the book as text. Restart the recognition service, e.g., webkitSpeechRecognition at end event of SpeechReconitionUtterance instance.

<!DOCTYPE html>
<html>

<head>
  <title>Ethical Hacking book</title>
  <style type="text/css">
    body {
      font-family: verdana;
    }

    .button {
      display: inline-block;
      background: #f6f6f6;
      padding: 10px 20px;
      color: #000;
      border: 1px solid #ccc;
      cursor: pointer;
      margin-top: 20px;
    }

    .button:hover {
      box-shadow: 4px 4px 10px 0 #ccc;
    }

    .container textarea,
    .container .brailleResult {
      width: 1333px;
      height: 1000px;
      resize: none;
      outline: none;
      border: 1px solid #ccc;
      box-shadow: 0 0 10px 0 #ddd;
      font-size: 14px;
    }
  </style>
</head>

<body>

  <div class="container">
    <h3>Ethical Hacking</h3>
    <textarea class="myText" data-chapter='["chapter one", "chapter 1"]'>Chapter 1. Introduction to Hacking. There are many definitions for hacker. Ask this question from a phalanx, and you will get a new answer every time, because more mouths will have more talks, and this is the reason behind the different definitions
      of hackers, which in my opinion is quite justified for everyone has a right to think differently. In the early 1990s, the word hacker was used to describe a great programmer, someone who was able to build complex logics.
    </textarea>
    <div class="brailleResult"></div>
    <textarea class="myText" data-chapter='["chapter two", "chapter 2"]'>Chapter 2. Linux Basics. In order to become a good ethical hacker or penetration tester, you need to be conversant with Linux, which is by far one of the most powerful operating systems. Linux is really good for ethical hacking and penetration testing
      because it is compatible with a wide variety of related tools and software, whereas other operating systems such as Mac and Windows support fewer of these software and tools. In this chapter, I will teach you some of the very basics of operating
      a Linux OS. If you are already familiar with Linux basics, you can skip this chapter.</textarea>
    <div class="brailleResult"></div>
  </div>
  <script type="text/javascript">
    var braille = [
      ['1', '⠼⠁'],
      ['2', '⠼⠃'],
      ['3', '⠼⠉'],
      ['4', '⠼⠙'],
      ['5', '⠼⠑'],
      ['6', '⠼⠋'],
      ['7', '⠼⠛'],
      ['8', '⠼⠓'],
      ['9', '⠼⠊'],
      ['0', '⠼⠚'],

      ['A', '⠠⠁'],
      ['B', '⠠⠃'],
      ['C', '⠠⠉'],
      ['D', '⠠⠙'],
      ['E', '⠠⠑'],
      ['F', '⠠⠋'],
      ['G', '⠠⠛'],
      ['H', '⠠⠓'],
      ['I', '⠠⠊'],
      ['J', '⠠⠚'],
      ['K', '⠠⠅'],
      ['L', '⠠⠇'],
      ['M', '⠠⠍'],
      ['N', '⠠⠝'],
      ['O', '⠠⠕'],
      ['P', '⠠⠏'],
      ['Q', '⠠⠟'],
      ['R', '⠠⠗'],
      ['S', '⠠⠎'],
      ['T', '⠠⠞'],
      ['U', '⠠⠥'],
      ['V', '⠠⠧'],
      ['W', '⠠⠺'],
      ['X', '⠠⠭'],
      ['Y', '⠠⠽'],
      ['Z', '⠠⠵'],

      ['a', '⠁'],
      ['b', '⠃'],
      ['c', '⠉'],
      ['d', '⠙'],
      ['e', '⠑'],
      ['f', '⠋'],
      ['g', '⠛'],
      ['h', '⠓'],
      ['i', '⠊'],
      ['j', '⠚'],
      ['k', '⠅'],
      ['l', '⠇'],
      ['m', '⠍'],
      ['n', '⠝'],
      ['o', '⠕'],
      ['p', '⠏'],
      ['q', '⠟'],
      ['r', '⠗'],
      ['s', '⠎'],
      ['t', '⠞'],
      ['u', '⠥'],
      ['v', '⠧'],
      ['w', '⠺'],
      ['x', '⠭'],
      ['y', '⠽'],
      ['z', '⠵'],

      ['\\.', '⠲'],
      [',', '⠂'],
      ['\\?', '⠦'],
      [';', '⠆'],
      ['!', '⠖'],
      ['<', '⠦'],
      ['>', '⠴'],
      ['\\[', '⠶'],
      ['-', '⠤'],
      ["'", '⠄'],
    ];

    function checkCompatibilty() {
      if (!('speechSynthesis' in window)) {
        alert('Your browser is not supported. If google chrome, please upgrade!');
      }
    };
    checkCompatibilty();

    var chapters = document.querySelectorAll('.myText');
    var brailleResult = document.querySelectorAll(".brailleResult");
    var recognition = new webkitSpeechRecognition();
    recognition.continuous = true;
    recognition.interimResults = false;
    recognition.maxAlternatives = 1;
    recognition.onresult = handleRecognition;
    recognition.start();
    var book = new SpeechSynthesisUtterance();
    book.onend = resetRecognition;
    book.default = false;
    var voiceselect = window.speechSynthesis.getVoices();
    book.voice = voiceselect.filter(function(voice) {
      return voice.name == 'Google UK English Male';
    })[0];
    book.lang = 'en-EN';
    book.volume = 1;
    book.rate = 1;
    book.pitch = 1;

    function textToBraille(chapter) {
      return Array.prototype.map.call(chapter, function(text) {
        var result = braille.find(([key, prop]) => text === key);
        return result && result[1] || text
      }).join("")

    }

    function handleRecognition(event) {
      recognition.stop();
      var chapter = event.results[event.results.length - 1][0].transcript.trim();
      console.log(chapter);
      for (var i = 0; i < chapters.length; i++) {
        if (JSON.parse(chapters[i].dataset.chapter).some(function(ch) {
            return ch === chapter
          })) {
          speak(chapters[i].value);
          brailleResult[i].innerHTML = textToBraille(chapters[i].value)
        }
      }
    }

    function resetRecognition() {
      recognition.start();
    }

    function speak(chapter) {
      book.text = chapter;
      window.speechSynthesis.speak(book);
    };
  </script>


</body>

</html>

plnkr https://plnkr.co/edit/Xwc5iFtgbTnz13DDKC3z?p=preview



来源:https://stackoverflow.com/questions/47113870/using-multiple-variables-to-open-different-links

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!