Browse Source

Generate C++ compatible IDs in the GUI

dds
PaulStoffregen 11 years ago
parent
commit
7df1b21b20
6 changed files with 254 additions and 376 deletions
  1. +1
    -0
      analyze_peakdetect.h
  2. +188
    -358
      gui/list.html
  3. +3
    -0
      gui/red/main.js
  4. +39
    -2
      gui/red/nodes.js
  5. +5
    -3
      gui/red/ui/palette.js
  6. +18
    -13
      gui/red/ui/view.js

+ 1
- 0
analyze_peakdetect.h View File



#include "AudioStream.h" #include "AudioStream.h"


// TODO: this needs to be renamed to AudioAnalyzePeak
class AudioPeak : public AudioStream class AudioPeak : public AudioStream
{ {
public: public:

+ 188
- 358
gui/list.html View File





<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('input_i2s',{
category: 'input-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AnalogInputI2S',{
shortName: "i2s",
inputs:0, inputs:0,
outputs:2, outputs:2,
icon: "arrow-in.png",
label: function() {
return this.name||"I2S";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'input-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="input_i2s">
<script type="text/x-red" data-help-name="AnalogInputI2S">
<p>Stereo audio input from the audio shield or other I2S device</p> <p>Stereo audio input from the audio shield or other I2S device</p>
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="input_i2s">
<script type="text/x-red" data-template-name="AnalogInputI2S">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('input_adc',{
category: 'input-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AnalogInputADC',{
shortName: "adc",
inputs:0, inputs:0,
outputs:1, outputs:1,
icon: "arrow-in.png",
label: function() {
return this.name||"ADC";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'input-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="input_adc">
<script type="text/x-red" data-help-name="AnalogInputADC">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="input_adc">
<script type="text/x-red" data-template-name="AnalogInputADC">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('output_i2s',{
category: 'output-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AnalogOutputI2S',{
shortName: "i2s",
inputs:2, inputs:2,
outputs:0, outputs:0,
icon: "arrow-in.png",
label: function() {
return this.name||"I2S";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'output-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="output_i2s">
<script type="text/x-red" data-help-name="AnalogOutputI2S">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="output_i2s">
<script type="text/x-red" data-template-name="AnalogOutputI2S">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('output_dac',{
category: 'output-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AnalogOutputAnalog',{
shortName: "dac",
inputs:1, inputs:1,
outputs:0, outputs:0,
icon: "arrow-in.png",
label: function() {
return this.name||"DAC";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'output-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="output_dac">
<script type="text/x-red" data-help-name="AnalogOutputAnalog">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="output_dac">
<script type="text/x-red" data-template-name="AnalogOutputAnalog">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('output_pwm',{
category: 'output-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AnalogOutputPWM',{
shortName: "pwm",
inputs:1, inputs:1,
outputs:0, outputs:0,
icon: "arrow-in.png",
label: function() {
return this.name||"PWM";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'output-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="output_pwm">
<script type="text/x-red" data-help-name="AnalogOutputPWM">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="output_pwm">
<script type="text/x-red" data-template-name="AnalogOutputPWM">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('mixer4',{
category: 'mixer-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioMixer4',{
shortName: "mixer",
inputs:4, inputs:4,
outputs:1, outputs:1,
icon: "arrow-in.png",
label: function() {
return this.name||"Mixer";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'mixer-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="mixer4">
<script type="text/x-red" data-help-name="AudioMixer4">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="mixer4">
<script type="text/x-red" data-template-name="AudioMixer4">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('play_memory',{
category: 'play-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioPlayMemory',{
shortName: "playMem",
inputs:0, inputs:0,
outputs:1, outputs:1,
icon: "arrow-in.png",
label: function() {
return this.name||"Memory";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'play-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="play_memory">
<script type="text/x-red" data-help-name="AudioPlayMemory">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="play_memory">
<script type="text/x-red" data-template-name="AudioPlayMemory">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('play_sd_wav',{
category: 'play-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioPlaySdWav',{
shortName: "playWav",
inputs:0, inputs:0,
outputs:2, outputs:2,
icon: "arrow-in.png",
label: function() {
return this.name||"SD .WAV File";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'play-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="play_sd_wav">
<script type="text/x-red" data-help-name="AudioPlaySdWav">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="play_sd_wav">
<script type="text/x-red" data-template-name="AudioPlaySdWav">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('play_sd_raw',{
category: 'play-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioPlaySdRaw',{
shortName: "playRaw",
inputs:0, inputs:0,
outputs:1, outputs:1,
icon: "arrow-in.png",
label: function() {
return this.name||"SD .RAW File";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'play-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="play_sd_raw">
<script type="text/x-red" data-help-name="AudioPlaySdRaw">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="play_sd_raw">
<script type="text/x-red" data-template-name="AudioPlaySdRaw">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('play_queue',{
category: 'play-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioPlayQueue',{
shortName: "queue",
inputs:0, inputs:0,
outputs:1, outputs:1,
icon: "arrow-in.png",
label: function() {
return this.name||"Queue";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'play-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="play_queue">
<script type="text/x-red" data-help-name="AudioPlayQueue">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="play_queue">
<script type="text/x-red" data-template-name="AudioPlayQueue">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('synth_sine',{
category: 'synth-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioSynthWaveformSine',{
shortName: "sine",
inputs:0, inputs:0,
outputs:1, outputs:1,
icon: "arrow-in.png",
label: function() {
return this.name||"Sine Wave";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'synth-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="synth_sine">
<script type="text/x-red" data-help-name="AudioSynthWaveformSine">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="synth_sine">
<script type="text/x-red" data-template-name="AudioSynthWaveformSine">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('synth_waveform',{
RED.nodes.registerType('AudioSynthWaveformSineModulated',{
shortName: "sine_fm",
inputs:1,
outputs:1,
category: 'synth-function', category: 'synth-function',
color:"#E6E0F8", color:"#E6E0F8",
defaults: {
name: {value:""},
},
inputs:0,
outputs:1,
icon: "arrow-in.png",
label: function() {
return this.name||"Waveform";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="synth_waveform">
<script type="text/x-red" data-help-name="AudioSynthWaveformSineModulated">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="synth_waveform">
<script type="text/x-red" data-template-name="AudioSynthWaveformSineModulated">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('synth_tonesweep',{
RED.nodes.registerType('AudioSynthWaveform',{
shortName: "waveform",
inputs:0,
outputs:1,
category: 'synth-function', category: 'synth-function',
color:"#E6E0F8", color:"#E6E0F8",
defaults: {
name: {value:""},
},
icon: "arrow-in.png"
});
</script>
<script type="text/x-red" data-help-name="AudioSynthWaveform">
<p><b>TODO</b> Add object documetation here</b>.</p>
</script>
<script type="text/x-red" data-template-name="AudioSynthWaveform">
<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>



<script type="text/javascript">
RED.nodes.registerType('AudioSynthToneSweep',{
shortName: "tonesweep",
inputs:0, inputs:0,
outputs:1, outputs:1,
icon: "arrow-in.png",
label: function() {
return this.name||"Tonesweep";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'synth-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="synth_tonesweep">
<script type="text/x-red" data-help-name="AudioSynthToneSweep">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="synth_tonesweep">
<script type="text/x-red" data-template-name="AudioSynthToneSweep">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('effect_fade',{
category: 'effect-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioEffectFade',{
shortName: "fade",
inputs:1, inputs:1,
outputs:1, outputs:1,
icon: "arrow-in.png",
label: function() {
return this.name||"Fade";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'effect-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="effect_fade">
<script type="text/x-red" data-help-name="AudioEffectFade">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="effect_fade">
<script type="text/x-red" data-template-name="AudioEffectFade">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('effect_chorus',{
category: 'effect-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioEffectChorus',{
shortName: "chorus",
inputs:2, inputs:2,
outputs:2, outputs:2,
icon: "arrow-in.png",
label: function() {
return this.name||"Chorus";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'effect-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="effect_chorus">
<script type="text/x-red" data-help-name="AudioEffectChorus">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="effect_chorus">
<script type="text/x-red" data-template-name="AudioEffectChorus">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('effect_flange',{
category: 'effect-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioEffectFlange',{
shortName: "flange",
inputs:2, inputs:2,
outputs:2, outputs:2,
icon: "arrow-in.png",
label: function() {
return this.name||"Flange";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'effect-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="effect_flange">
<script type="text/x-red" data-help-name="AudioEffectFlange">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="effect_flange">
<script type="text/x-red" data-template-name="AudioEffectFlange">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('filter_biquad',{
category: 'filter-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioFilterBiquad',{
shortName: "biquad",
inputs:1, inputs:1,
outputs:1, outputs:1,
icon: "arrow-in.png",
label: function() {
return this.name||"BiQuad";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'filter-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="filter_biquad">
<script type="text/x-red" data-help-name="AudioFilterBiquad">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="filter_biquad">
<script type="text/x-red" data-template-name="AudioFilterBiquad">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('filter_fir',{
category: 'filter-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioFilterFIR',{
shortName: "fir",
inputs:1, inputs:1,
outputs:1, outputs:1,
icon: "arrow-in.png",
label: function() {
return this.name||"FIR";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'filter-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="filter_fir">
<script type="text/x-red" data-help-name="AudioFilterFIR">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="filter_fir">
<script type="text/x-red" data-template-name="AudioFilterFIR">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('analyze_peak',{
category: 'analyze-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioPeak',{
shortName: "peak",
inputs:1, inputs:1,
outputs:0, outputs:0,
icon: "arrow-in.png",
label: function() {
return this.name||"Peak";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'analyze-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="analyze_peak">
<script type="text/x-red" data-help-name="AudioPeak">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="analyze_peak">
<script type="text/x-red" data-template-name="AudioPeak">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('analyze_fft256',{
category: 'analyze-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioAnalyzeFFT256',{
shortName: "fft256",
inputs:1, inputs:1,
outputs:0, outputs:0,
icon: "arrow-in.png",
label: function() {
return this.name||"FFT256";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'analyze-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="analyze_fft256">
<script type="text/x-red" data-help-name="AudioAnalyzeFFT256">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="analyze_fft256">
<script type="text/x-red" data-template-name="AudioAnalyzeFFT256">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('analyze_fft1024',{
category: 'analyze-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioAnalyzeFFT1024',{
shortName: "fft1024",
inputs:1, inputs:1,
outputs:0, outputs:0,
icon: "arrow-in.png",
label: function() {
return this.name||"FFT1024";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'analyze-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="analyze_fft1024">
<script type="text/x-red" data-help-name="AudioAnalyzeFFT1024">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="analyze_fft1024">
<script type="text/x-red" data-template-name="AudioAnalyzeFFT1024">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('analyze_print',{
category: 'analyze-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioAnalyzePrint',{
shortName: "print",
inputs:1, inputs:1,
outputs:0, outputs:0,
icon: "arrow-in.png",
label: function() {
return this.name||"Print";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'analyze-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="analyze_print">
<script type="text/x-red" data-help-name="AudioAnalyzePrint">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="analyze_print">
<script type="text/x-red" data-template-name="AudioAnalyzePrint">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('control_sgtl5000',{
category: 'control-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioControlSGTL5000',{
shortName: "sgtl5000",
inputs:0, inputs:0,
outputs:0, outputs:0,
icon: "arrow-in.png",
label: function() {
return this.name||"SGTL5000";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'control-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="control_sgtl5000">
<script type="text/x-red" data-help-name="AudioControlSGTL5000">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="control_sgtl5000">
<script type="text/x-red" data-template-name="AudioControlSGTL5000">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">




<script type="text/javascript"> <script type="text/javascript">
RED.nodes.registerType('control_wm8731',{
category: 'control-function',
color:"#E6E0F8",
defaults: {
name: {value:""},
},
RED.nodes.registerType('AudioControlWM8731',{
shortName: "wm8731",
inputs:0, inputs:0,
outputs:0, outputs:0,
icon: "arrow-in.png",
label: function() {
return this.name||"WM8731";
},
labelStyle: function() {
return this.name?"node_label_italic":"";
}
category: 'control-function',
color:"#E6E0F8",
icon: "arrow-in.png"
}); });
</script> </script>
<script type="text/x-red" data-help-name="control_wm8731">
<script type="text/x-red" data-help-name="AudioControlWM8731">
<p><b>TODO</b> Add object documetation here</b>.</p> <p><b>TODO</b> Add object documetation here</b>.</p>
</script> </script>
<script type="text/x-red" data-template-name="control_wm8731">
<script type="text/x-red" data-template-name="AudioControlWM8731">
<div class="form-row"> <div class="form-row">
<label for="node-input-name"><i class="fa fa-tag"></i> Name</label> <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Name"> <input type="text" id="node-input-name" placeholder="Name">

+ 3
- 0
gui/red/main.js View File

$("#btn-icn-deploy").removeClass('icon-upload'); $("#btn-icn-deploy").removeClass('icon-upload');
$("#btn-icn-deploy").addClass('spinner'); $("#btn-icn-deploy").addClass('spinner');
RED.view.dirty(false); RED.view.dirty(false);

console.log(JSON.stringify(nns));
$.ajax({ $.ajax({
url:"flows", url:"flows",


$('#btn-deploy').click(function() { save(); }); $('#btn-deploy').click(function() { save(); });



$( "#node-dialog-confirm-deploy" ).dialog({ $( "#node-dialog-confirm-deploy" ).dialog({
title: "Confirm deploy", title: "Confirm deploy",
modal: true, modal: true,

+ 39
- 2
gui/red/nodes.js View File

/**
/** Modified from original Node-Red source, for audio system visualization
* vim: set ts=4:
* Copyright 2013 IBM Corp. * Copyright 2013 IBM Corp.
* *
* Licensed under the Apache License, Version 2.0 (the "License"); * Licensed under the Apache License, Version 2.0 (the "License");
} }


function getID() { function getID() {
return (1+Math.random()*4294967295).toString(16);
var str = (1+Math.random()*4294967295).toString(16);
console.log("getID = " + str);
return str;
}

function checkID(name) {
var i;
for (i=0;i<nodes.length;i++) {
console.log("checkID, nodes[i].id = " + nodes[i].id);
if (nodes[i].id == name) return true;
}
/*
for (i in workspaces) {
if (workspaces.hasOwnProperty(i)) { }
}
for (i in configNodes) {
if (configNodes.hasOwnProperty(i)) { }
}
*/
return false;
}

function createUniqueCppName(n) {
console.log("getUniqueCppName, n.type=" + n.type + ", n._def.shortName=" + n._def.shortName);
var basename = (n._def.shortName) ? n._def.shortName : n.type.replace(/^Analog/, "");
console.log("getUniqueCppName, using basename=" + basename);
var count = 1;
var sep = /[0-9]$/.test(basename) ? "_" : "";
var name;
while (1) {
name = basename + sep + count;
if (!checkID(name)) break;
count++;
}
console.log("getUniqueCppName, unique name=" + name);
return name;
} }


function getType(type) { function getType(type) {
createExportableNodeSet: createExportableNodeSet, createExportableNodeSet: createExportableNodeSet,
createCompleteNodeSet: createCompleteNodeSet, createCompleteNodeSet: createCompleteNodeSet,
id: getID, id: getID,
cppName: createUniqueCppName,
nodes: nodes, // TODO: exposed for d3 vis nodes: nodes, // TODO: exposed for d3 vis
links: links // TODO: exposed for d3 vis links: links // TODO: exposed for d3 vis
}; };

+ 5
- 3
gui/red/ui/palette.js View File

/** Modified from original Node-Red source, for audio system visualization /** Modified from original Node-Red source, for audio system visualization
* vim: set ts=4:
* Copyright 2013 IBM Corp. * Copyright 2013 IBM Corp.
* *
* Licensed under the Apache License, Version 2.0 (the "License"); * Licensed under the Apache License, Version 2.0 (the "License");
var d = document.createElement("div"); var d = document.createElement("div");
d.id = "palette_node_"+nt; d.id = "palette_node_"+nt;
d.type = nt; d.type = nt;
var label = /^(.*?)([ -]in|[ -]out)?$/.exec(nt)[1];

//var label = /^(.*?)([ -]in|[ -]out)?$/.exec(nt)[1];
var label = (def.shortName) ? def.shortName : nt;

d.innerHTML = '<div class="palette_label">'+label+"</div>"; d.innerHTML = '<div class="palette_label">'+label+"</div>";
d.className="palette_node"; d.className="palette_node";
if (def.icon) { if (def.icon) {

+ 18
- 13
gui/red/ui/view.js View File

/**
/** Modified from original Node-Red source, for audio system visualization
* vim: set ts=4:
* Copyright 2013, 2014 IBM Corp. * Copyright 2013, 2014 IBM Corp.
* *
* Licensed under the Apache License, Version 2.0 (the "License"); * Licensed under the Apache License, Version 2.0 (the "License");
mousePos[1] /= scaleFactor; mousePos[1] /= scaleFactor;
mousePos[0] /= scaleFactor; mousePos[0] /= scaleFactor;


var nn = { id:(1+Math.random()*4294967295).toString(16),x: mousePos[0],y:mousePos[1],w:node_width,z:activeWorkspace};

var nn = {x: mousePos[0],y:mousePos[1],w:node_width,z:activeWorkspace};
nn.type = selected_tool; nn.type = selected_tool;
nn._def = RED.nodes.getType(nn.type); nn._def = RED.nodes.getType(nn.type);
nn.id = RED.nodes.cppName(nn);
nn.outputs = nn._def.outputs; nn.outputs = nn._def.outputs;
nn.changed = true; nn.changed = true;


RED.history.push({t:'add',links:[link],dirty:dirty}); RED.history.push({t:'add',links:[link],dirty:dirty});
setDirty(true); setDirty(true);
// disallow new links to this destination - each input can have only a single link // disallow new links to this destination - each input can have only a single link
dst.inputlist[dst_port]
dst.inputlist[dst_port]
.classed("port_hovered",false) .classed("port_hovered",false)
.on("mousedown",null)
.on("mousedown",null)
.on("touchstart", null) .on("touchstart", null)
.on("mouseup", null) .on("mouseup", null)
.on("touchend", null) .on("touchend", null)
nodeEnter.each(function(d,i) { nodeEnter.each(function(d,i) {
var node = d3.select(this); var node = d3.select(this);
node.attr("id",d.id); node.attr("id",d.id);
var l = d._def.label;
l = (typeof l === "function" ? l.call(d) : l)||"";
//var l = d._def.label;
//l = (typeof l === "function" ? l.call(d) : l)||"";
var l = d.id;
d.w = Math.max(node_width,calculateTextWidth(l)+(d._def.inputs>0?7:0) ); d.w = Math.max(node_width,calculateTextWidth(l)+(d._def.inputs>0?7:0) );
d.h = Math.max(node_height,(Math.max(d.outputs,d._def.inputs)||0) * 15); d.h = Math.max(node_height,(Math.max(d.outputs,d._def.inputs)||0) * 15);


if (d.dirty) { if (d.dirty) {
//if (d.x < -50) deleteSelection(); // Delete nodes if dragged back to palette //if (d.x < -50) deleteSelection(); // Delete nodes if dragged back to palette
if (d.resize) { if (d.resize) {
var l = d._def.label;
l = (typeof l === "function" ? l.call(d) : l)||"";
//var l = d._def.label;
//l = (typeof l === "function" ? l.call(d) : l)||"";
var l = d.id;
d.w = Math.max(node_width,calculateTextWidth(l)+(d._def.inputs>0?7:0) ); d.w = Math.max(node_width,calculateTextWidth(l)+(d._def.inputs>0?7:0) );
d.h = Math.max(node_height,(Math.max(d.outputs,d._def.inputs)||0) * 15); d.h = Math.max(node_height,(Math.max(d.outputs,d._def.inputs)||0) * 15);
} }
}); });
} }
thisNode.selectAll('text.node_label').text(function(d,i){ thisNode.selectAll('text.node_label').text(function(d,i){
if (d._def.label) {
/* if (d._def.label) {
if (typeof d._def.label == "function") { if (typeof d._def.label == "function") {
return d._def.label.call(d); return d._def.label.call(d);
} else { } else {
return d._def.label; return d._def.label;
} }
} }
return "";
return ""; */
return d.id;
}) })
.attr('y', function(d){return (d.h/2)-1;}) .attr('y', function(d){return (d.h/2)-1;})
.attr('class',function(d){ .attr('class',function(d){


thisNode.selectAll('.node_badge_group').attr("transform",function(d){return "translate("+(d.w-40)+","+(d.h+3)+")";}); thisNode.selectAll('.node_badge_group').attr("transform",function(d){return "translate("+(d.w-40)+","+(d.h+3)+")";});
thisNode.selectAll('text.node_badge_label').text(function(d,i) { thisNode.selectAll('text.node_badge_label').text(function(d,i) {
if (d._def.badge) {
/* if (d._def.badge) {
if (typeof d._def.badge == "function") { if (typeof d._def.badge == "function") {
return d._def.badge.call(d); return d._def.badge.call(d);
} else { } else {
return d._def.badge; return d._def.badge;
} }
} }
return "";
return ""; */
return d.id;
}); });
if (!showStatus || !d.status) { if (!showStatus || !d.status) {
thisNode.selectAll('.node_status_group').style("display","none"); thisNode.selectAll('.node_status_group').style("display","none");

Loading…
Cancel
Save