Directory Structure and Useful Files

Euterpe is built using the front-end framework Vue.js, and it adheres to the standard Vue project directory structure.

Dependencies

The package.json file is where we specify the packages and libraries our app relies on.

Static Files

• The public/ directory contains static assets:
  • /img: This folder stores logos and icons used in the application's user interface.
  • /audio: It contains audio samples used by our sampler instruments.

Source Code

• The /src directory contains the core source code of Euterpe as well as your agent's code
  • /components: This directory houses the implementations of various visual components such as the PianoRoll, Keyboard, and Score.
  • /views/Euterpe.vue: This is the central file in Euterpe. It acts as the glue that connects components, manages user input, and handles the application's main functionality.
  • /utils: This directory contains helpful utilities and type definitions used throughout Euterpe.
  • /agents: This directory houses files that you'll need to edit when creating your musical agents. You can organize multiple agents in separate folders here but only one of them can be used each time. The active agent is determined by the agentName variable inside /views/Euterpe.vue.

Agent Files

Agent-specific files are located in src/agents/{agentName}/:

• agent.js: This is the main agent script that Euterpe calls to initialize the agent. It includes boilerplate code for the basic audio and MIDI functionalities of the agent and determines which hook to invoke based on messages received from Euterpe.

• initAgent_hook.js: This file contains hook functions, such as loadAlgorithm(), and loadExternalFiles(). These hooks are invoked only at the beginning of the agent's lifecycle.

• processAudioBuffer_hook.js: This file houses a single hook function to process an audio buffer. It's invoked every time a new audio buffer is received from Euterpe.

• processNoteEvent_hook.js: In this file, you'll find a single hook function to process a note event. It's invoked whenever a new note event is received by the user.

• processClockEvent_hook.js: This file contains a single hook function to process a clock event, which is triggered each time a new clock event is received from Euterpe in the grid-based interaction mode.

• config.yaml: A configuration file for the agent, including the agent's name, description, and a list of the agent's characteristics in terms of its interaction mode paradigm (e.g. audio, note, event-based, grid-based etc).

• config_widgets.yaml: This file handles the agent's widgets and their configurations, specifying which widgets to use and how they should be displayed.

• config_players.yaml: This file defines the players, instruments, and samplers available to each of them. Note that we also include the 'metronome' as a separate player.

Throughout this session, we'll be developing simple musical agents with various interaction modes. You'll mostly be working on specific agent files mentioned above. The only time you'll need to edit the Euterpe.vue file is when you want to switch to a different agent.