123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869 |
- <!DOCTYPE html>
-
- <script type="text/javascript">
- (function() {
- var myvoice = 0;
- var voices;
- RED.nodes.registerType('ui_audio',{
- category: RED._("node-red-dashboard/ui_base:ui_base.label.category"),
- paletteLabel: 'audio out',
- color: 'rgb(119, 198, 204)',
- defaults: {
- name: {value:""},
- group: {type: 'ui_group', required: true},
- voice: {value:""},
- always: {value:""}
- },
- inputs:1,
- outputs:0,
- icon: "feed.png",
- align: "right",
- label: function() { return this.name||"audio out"; },
- labelStyle: function() { return this.name?"node_label_italic":""; },
- onpaletteadd: function() {
- if ('speechSynthesis' in window) { voices = window.speechSynthesis.getVoices(); }
- },
- oneditprepare: function() {
- if ('speechSynthesis' in window) {
- voices = window.speechSynthesis.getVoices();
- for (i = 0; i < voices.length ; i++) {
- //console.log(i,voices[i].name,voices[i].lang,voices[i].voiceURI,voices[i].default);
- var option = document.createElement('option');
- option.textContent = i + " : " + voices[i].name + ' (' + voices[i].lang + ')';
- if (voices[i].default) { option.textContent += ' -- DEFAULT'; }
- option.setAttribute('value', voices[i].voiceURI);
- document.getElementById("node-input-voice").appendChild(option);
- }
- $('#node-input-voice').val(this.voice || 0);
- }
- else {
- $('#voice-input-row').hide();
- }
-
- $("#node-input-voice").on("change", function() {
- myvoice = this.voice = $("#node-input-voice").val();
- });
- }
- });
- })();
- </script>
-
- <script type="text/html" data-template-name="ui_audio">
- <div class="form-row">
- <label for="node-input-group"><i class="fa fa-table"></i> Group</label>
- <input type="text" id="node-input-group">
- </div>
- <div class="form-row" id="voice-input-row">
- <label for="node-input-voice"><i class="fa fa-language"></i> TTS Voice</label>
- <select id="node-input-voice" style="width:70%"></select>
- </div>
- <div class="form-row">
- <label for="node-input-always"></label>
- <input type="checkbox" checked id="node-input-always" style="display:inline-block; width:auto; vertical-align:top;">
- Play audio when window not in focus.
- </div>
- <div class="form-row">
- <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
- <input type="text" id="node-input-name" placeholder="Name">
- </div>
- </script>
|