{"id":20902,"date":"2020-02-24T19:25:22","date_gmt":"2020-02-25T00:25:22","guid":{"rendered":"https:\/\/codebangers.com\/?p=20902"},"modified":"2020-02-24T19:30:22","modified_gmt":"2020-02-25T00:30:22","slug":"speech-recognition-with-javascript","status":"publish","type":"post","link":"https:\/\/codebangers.com\/speech-recognition-with-javascript\/","title":{"rendered":"Speech Recognition With Javascript"},"content":{"rendered":"<p>&nbsp;<\/p>\n<div class=\"wp-block-codemirror-blocks code-block \">\n<pre class=\"CodeMirror\" data-setting=\"{&quot;mode&quot;:&quot;javascript&quot;,&quot;mime&quot;:&quot;text\/javascript&quot;,&quot;theme&quot;:&quot;blackboard&quot;,&quot;lineNumbers&quot;:true,&quot;lineWrapping&quot;:false,&quot;styleActiveLine&quot;:false,&quot;readOnly&quot;:true,&quot;align&quot;:&quot;&quot;}\">var grammar = '#JSGF V1.0; grammar colors; public &lt;color&gt; = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;'\r\nvar recognition = new SpeechRecognition();\r\nvar speechRecognitionList = new SpeechGrammarList();\r\nspeechRecognitionList.addFromString(grammar, 1);\r\nrecognition.grammars = speechRecognitionList;\r\n\/\/recognition.continuous = false;\r\nrecognition.lang = 'en-US';\r\nrecognition.interimResults = false;\r\nrecognition.maxAlternatives = 1;\r\n\r\nvar diagnostic = document.querySelector('.output');\r\nvar bg = document.querySelector('html');\r\n\r\ndocument.body.onclick = function() {\r\n  recognition.start();\r\n  console.log('Ready to receive a color command.');\r\n}\r\n\r\nrecognition.onresult = function(event) {\r\n  var color = event.results[0][0].transcript;\r\n  diagnostic.textContent = 'Result received: ' + color;\r\n  bg.style.backgroundColor = color;\r\n}<\/pre>\n<\/div>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>&nbsp; var grammar = &#8216;#JSGF V1.0; grammar colors; public &lt;color&gt; = aqua | azure | beige | bisque | black | blue [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":16314,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[30,51],"tags":[],"class_list":["post-20902","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-howto","category-javascript"],"_links":{"self":[{"href":"https:\/\/codebangers.com\/wp-json\/wp\/v2\/posts\/20902","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/codebangers.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/codebangers.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/codebangers.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/codebangers.com\/wp-json\/wp\/v2\/comments?post=20902"}],"version-history":[{"count":4,"href":"https:\/\/codebangers.com\/wp-json\/wp\/v2\/posts\/20902\/revisions"}],"predecessor-version":[{"id":20906,"href":"https:\/\/codebangers.com\/wp-json\/wp\/v2\/posts\/20902\/revisions\/20906"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/codebangers.com\/wp-json\/wp\/v2\/media\/16314"}],"wp:attachment":[{"href":"https:\/\/codebangers.com\/wp-json\/wp\/v2\/media?parent=20902"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codebangers.com\/wp-json\/wp\/v2\/categories?post=20902"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/codebangers.com\/wp-json\/wp\/v2\/tags?post=20902"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}