Sound system beep on error

This procedure shows you how to sound a system beep using a front call.

About this task

The function that sounds the beep is defined in a JavaScript module that implements your GBC custom front call functions. This function can be used to alert the user when an ERROR is thrown by generating a beep sound via a front call to the function.

The function creates nodes for the AudioContext Interface of the Web Audio API specification that processes and synthesizes audio in web applications. These nodes generate the audio and route the output to the system device that produces a signal. For more information on the Web Audio API, see https://www.w3.org/TR/webaudio/.

  1. In the gbc-project-dir/customization/customization-project-dir/js directory, add a js file called myFrontCallModule.js or add the beep function to your existing module:
    // in myFrontCallModule.js
    "use strict";
    
    modulum('FrontCallService.modules.myfcmodule', ['FrontCallService'],
        /**
         * @param {gbc} context
         * @param {classes} cls
         */
        function (context, cls) {
            context.FrontCallService.modules.myfcmodule = {
    
                beep: function (volume, frequency, type, duration) {
    
                    // alert("beep_start");
                    var AudioContext = window.AudioContext || window.webkitAudioContext;
                    var audioCtx = new AudioContext();
    
                    var oscillator = audioCtx.createOscillator();
                    var gainNode = audioCtx.createGain();
    
                    oscillator.connect(gainNode);
                    gainNode.connect(audioCtx.destination);
    
                    gainNode.gain.value = volume;
                    oscillator.frequency.value = frequency;
                    oscillator.type = type;
    
                    oscillator.start();
    
                    setTimeout(
                        function () {
                            oscillator.stop();
                        },
                        duration
                    );
                    // alert("beep_end");
                    return ["0"];
                }
            };
        }
    );

    In this example the customization raises a sound alert. Variables are set for the different AudioContext nodes that create the audio. The oscillator represents an audio source that generates a periodic waveform. It can be set to different waveforms and frequencies that are specified in the front call.

  2. Save your changes and rebuild your customization using gbc build:
    $ gbc build --customization customization-project-dir
  3. View the changes by opening an app with a front call command to call the beep function.
    DEFINE field1 CHAR(20)
    MAIN
      OPEN WINDOW Beep_on_Error WITH FORM "ErrAndBeep"
      INPUT BY NAME field1
        ON ACTION Error1   
          CALL ui.Interface.frontCall("myfcmodule","beep",[0.5,430,"sine",1000],[])
          ERROR "Error1"
        ON ACTION Error2
          CALL ui.Interface.frontCall("myfcmodule","beep",[0.5,440,"sawtooth",500],[])   
          ERROR "Error2"
      END INPUT
    END MAIN
    In this example, the front call to the beep function is made when the ERROR is raised. The front calls specify the volume, frequency, type, and duration of the beep in the third parameter [0.5,430,"sine",1000] of ui.Interface.frontCall(). The default periodic waveform is sine, which corresponds to ringing the bell to alert the user to the error. For other commonly-used waveforms, see https://www.w3.org/TR/webaudio/.