iot-backend/software/flow/node_modules/node-red-dashboard/nodes/ui_audio.html

70 lines
2.7 KiB
HTML

<!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>