Node-Red configuration
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

ui_audio.html 2.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. <!DOCTYPE html>
  2. <script type="text/javascript">
  3. (function() {
  4. var myvoice = 0;
  5. var voices;
  6. RED.nodes.registerType('ui_audio',{
  7. category: RED._("node-red-dashboard/ui_base:ui_base.label.category"),
  8. paletteLabel: 'audio out',
  9. color: 'rgb(119, 198, 204)',
  10. defaults: {
  11. name: {value:""},
  12. group: {type: 'ui_group', required: true},
  13. voice: {value:""},
  14. always: {value:""}
  15. },
  16. inputs:1,
  17. outputs:0,
  18. icon: "feed.png",
  19. align: "right",
  20. label: function() { return this.name||"audio out"; },
  21. labelStyle: function() { return this.name?"node_label_italic":""; },
  22. onpaletteadd: function() {
  23. if ('speechSynthesis' in window) { voices = window.speechSynthesis.getVoices(); }
  24. },
  25. oneditprepare: function() {
  26. if ('speechSynthesis' in window) {
  27. voices = window.speechSynthesis.getVoices();
  28. for (i = 0; i < voices.length ; i++) {
  29. //console.log(i,voices[i].name,voices[i].lang,voices[i].voiceURI,voices[i].default);
  30. var option = document.createElement('option');
  31. option.textContent = i + " : " + voices[i].name + ' (' + voices[i].lang + ')';
  32. if (voices[i].default) { option.textContent += ' -- DEFAULT'; }
  33. option.setAttribute('value', voices[i].voiceURI);
  34. document.getElementById("node-input-voice").appendChild(option);
  35. }
  36. $('#node-input-voice').val(this.voice || 0);
  37. }
  38. else {
  39. $('#voice-input-row').hide();
  40. }
  41. $("#node-input-voice").on("change", function() {
  42. myvoice = this.voice = $("#node-input-voice").val();
  43. });
  44. }
  45. });
  46. })();
  47. </script>
  48. <script type="text/html" data-template-name="ui_audio">
  49. <div class="form-row">
  50. <label for="node-input-group"><i class="fa fa-table"></i> Group</label>
  51. <input type="text" id="node-input-group">
  52. </div>
  53. <div class="form-row" id="voice-input-row">
  54. <label for="node-input-voice"><i class="fa fa-language"></i> TTS Voice</label>
  55. <select id="node-input-voice" style="width:70%"></select>
  56. </div>
  57. <div class="form-row">
  58. <label for="node-input-always"></label>
  59. <input type="checkbox" checked id="node-input-always" style="display:inline-block; width:auto; vertical-align:top;">
  60. Play audio when window not in focus.
  61. </div>
  62. <div class="form-row">
  63. <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
  64. <input type="text" id="node-input-name" placeholder="Name">
  65. </div>
  66. </script>