{"name":"Dictation (Cloud)","key":"dictationcloud","version":"1.0.0","instructions":"Add an html list (bullets) of statements/words to be read, between the dictation tags. Users must listen to the audio and type what they hear. (Uses Cloud Poodll)  ","showatto":"1","showplayers":"0","requirecss":"","requirejs":"","shim":"","defaults":"language=\"English(US)|English(GB)|English(AU)|English(In)|English(Welsh)|Danish|Dutch|French(FR)|French(CA)|German|Icelandic|Italian|Japanese|Korean|Norwegian|Polish|Portugese(BR)|Portugese(PT)|Romanian|Russian|Spanish(ES)|Spanish(US)|Swedish|Turkish|Welsh\",\nspeaker=\"Male|Female\"","amd":"1","body":"<div id=\"@@AUTOID@@_container\" class=\"container\"></div>\n<audio id=\"@@AUTOID@@_player\"></audio>\n<!-- @@CLOUDPOODLLTOKEN@@ -->\n<div id=\"@@AUTOID@@\" class=\"poodll-dictation hide\">\n","bodyend":"</div>","script":"//FUNCTION fetch polly url\n var fetch_polly_url = function(speaktext, voice, callback) {\n\n                //The REST API we are calling\n                var functionname = 'local_cpapi_fetch_polly_url';\n\n                //fetch the Posturl. We need this.\n                //set up our ajax request\n                var xhr = new XMLHttpRequest();\n                var that = this;\n\n                //set up our handler for the response\n                xhr.onreadystatechange = function (e) {\n                    if (this.readyState === 4) {\n                        if (xhr.status == 200) {\n\n                            //get a yes or forgetit or tryagain\n                            var payload = xhr.responseText;\n                            var payloadobject = JSON.parse(payload);\n                            if (payloadobject) {\n                                //returnCode > 0  indicates an error\n                                if (payloadobject.returnCode > 0) {\n                                    console.log(payloadobject.returnMessage);\n                                    return false;\n                                    //if all good, then lets do the embed\n                                } else if (payloadobject.returnCode === 0){\n                                    var pollyurl = payloadobject.returnMessage;\n                                    callback(pollyurl);\n                                } else {\n                                    console.log('Polly Signed URL Request failed:');\n                                    console.log(payloadobject);\n                                }\n                            } else {\n                                console.log('Polly Signed URL Request something bad happened');\n                            }\n                        } else {\n                            console.log('Polly Signed URL Request Not 200 response:' + xhr.status);\n                        }\n                    }\n                };\n\n                //make our request\n                var xhrparams = \"wstoken=\" + @@CLOUDPOODLLTOKEN@@\n                + \"&wsfunction=\" + functionname\n                + \"&moodlewsrestformat=\" + 'json'\n                + \"&text=\" + encodeURIComponent(speaktext)\n                + '&texttype=text'\n                + '&voice=' + voice\n                + '&appid=' + 'filter_poodll'\n                + '&owner=poodll'\n                + '&region=useast1';\n\n                var serverurl = 'https://cloud.poodll.com' + \"/webservice/rest/server.php\";\n                xhr.open(\"POST\", serverurl, true);\n                xhr.setRequestHeader(\"Cache-Control\", \"no-cache\");\n                xhr.setRequestHeader(\"Content-Type\", \"application/x-www-form-urlencoded\");\n                xhr.send(xhrparams);\n        };\n\n//remove any HTML editor artifacts\n$('#' + @@AUTOID@@ + ' p').remove();\n$('#' + @@AUTOID@@ + ' span').remove();\n\n//fetch the controls we inserted in \"body\"\nvar theplayer = $('#' + @@AUTOID@@ + '_player');\nvar theulcontainer = $('#' + @@AUTOID@@); \nvar theitemscontainer = $('#' + @@AUTOID@@ + '_container'); \n\ntheitemscontainer.on('click','.dictationtrigger', function(e){\n   theplayer.attr('src',$(this).attr('data-src'));\n   theplayer[0].play();\n});\n\n\n//determine voice\nvar mf=@@speaker@@\nswitch(@@language@@){\ncase \"English(US)\": voice = mf=='Male'?'Joey':'Kendra';break;\ncase \"English(GB)\": voice = mf=='Male'?'Brian':'Amy';break;\ncase \"English(AU)\": voice = mf=='Male'?'Russell':'Nicole';break;\ncase \"English(IN)\": voice = mf=='Male'?'Aditi':'Raveena';break;\ncase \"English(WELSH)\": voice = mf=='Male'? 'Geraint':'Geraint';break;\ncase \"Danish\": voice = mf=='Male'?'Mads':'Naja';break;\ncase \"Dutch\": voice = mf=='Male'?'Ruben':'Lotte';break;\ncase \"French(FR)\": voice = mf=='Male'?'Mathieu':'Celine';break;\ncase \"French(CA)\": voice = mf=='Male'?'Chantal':'Chantal';break;\ncase \"German\": voice = mf=='Male'?'Hans':'Marlene';break;\ncase \"Icelandic\": voice = mf=='Male'?'Karl':'Dora';break;\ncase \"Italian\": voice = mf=='Male'?'Carla':'Giorgio';break;\ncase \"Japanese\": voice = mf=='Male'?'Takumi':'Mizuki';break;\ncase \"Korean\": voice = mf=='Male'?'Seoyan':'Seoyan';break;\ncase \"Norwegian\": voice = mf=='Male'?'Liv':'Liv';break;\ncase \"Polish\": voice = mf=='Male'?'Jacek':'Ewa';break;\ncase \"Portugese(BR)\": voice = mf=='Male'?'Ricardo':'Vitoria';break;\ncase \"Portugese(PT)\": voice = mf=='Male'?'Cristiano':'Ines';break;\ncase \"Romanian\": voice = mf=='Male'?'Carmen':'Carmen';break;\ncase \"Russian\": voice = mf=='Male'?'Maxim':'Tatyana';break;\ncase \"Spanish(ES)\": voice = mf=='Male'?'Enrique':'Conchita';break;\ncase \"Spanish(US)\": voice = mf=='Male'?'Miguel':'Penelope';break;\ncase \"Swedish\": voice = mf=='Male'?'Astrid':'Astrid';break;\ncase \"Turkish\": voice = mf=='Male'?'Filiz':'Filiz';break;\ncase \"Welsh\": voice = mf=='Male'?'Gwyneth':'Gwyneth';break;\ndefault: voice = mf=='Male'?'Brian':'Amy';\n}\n\n\n\n//build template for one dictation item\nvar template ='<div class=\"row dictationrow\">';\ntemplate += '<div id=\"dictationplayer_@ID@\" class=\"col-md-1 poodlldictationplayer\">';\ntemplate += '<a class=\"dictationtrigger\" data-src=\"@AUDIO@\"><i class=\"fa fa-play\"></i></a></div>';\ntemplate += '<div id=\"dictationinput_@ID@\" class=\"col-md-10 poodlldictationinput\"><input type=\"text\"></input></div>';\ntemplate +=  '<div class=\"col-md-1\" ><div  id=\"dictationstatus_@ID@\" class=\"poodlldictationstatus\"><i class=\"fa fa-check\"></i></div></div>';\ntemplate +='</div>';\n\nvar container = \n\n$('#' + @@AUTOID@@ + \" li\" ).each(function(index) {\n    var usetext = $(this).text();\n    fetch_polly_url(usetext,voice,\n    function(bulletindex){return function(pollyurl){\n\n        //create the item and get the TTS audio\n        var usetemplate = template.replace('@AUDIO@',pollyurl); \n        usetemplate = usetemplate.replace(/@ID@/g, bulletindex);\n        theitemscontainer.append(usetemplate);\n\n       //add events\n       var theinput=  $('#dictationinput_' + bulletindex + ' input');\n       var thestatus=  $('#dictationstatus_' + bulletindex);\n       var theaudio=  $('#dictationplayer_' + bulletindex + ' audio');\n       theinput.on('keyup',function(){\n        if($(this).val()==usetext){\n            thestatus.addClass('dictationcorrect');\n        }else{\n            thestatus.removeClass('dictationcorrect');\n        }\n   });//end of change event\n    //we use function inside function so that: index = bullet index.  (index value changing before callback called)\n      }}(index)\n   );\n\n  });//end of each loop","style":"div.poodlldictationstatus {\n    padding: 3px;\n    border: black 1px solid;\n    border-width: 2px;\n    border-radius: 10px;\n    width: 30px;\n    text-align: center;\n}\ndiv.dictationcorrect{\n color: white;\nbackground-color: green;\n}\ndiv.row.dictationrow{\n max-width: 600px;\n min-height: 50px;\ndisplay: flex;\n}\ndiv.dictationrow input {\n    width: 100%;\n}","dataset":"","datasetvars":"","alternate":"","alternateend":""}