how to create your own musical instrument



Simplified method

  1. - Create a directory (a folder), In which we will create the musical instrument
  2. - Download files, By clicking in the left column on : Download Lecjoa
  3. -Unzipped the downloaded directory, and retrieve the PianoBaul.html file and the PianoBaul directory Which we place in the working directory.
  4. -To play the instrument, just click on PianoBaul.html
  5. - The downloaded instrument allows to play 47 different acoustic bricks.
    An acoustic brick is composed of 75 values driving acoustic dimensions.
    To generate its own tones (music notes), It is necessary to open with its text editor the file adn1.js and create its own acoustic brick.
    Each brick is in the form of the letter m with an index, we can create linked bricks as in the example, Or create totally different sounds, indicating 75 values behind the letter m on a specific index.
  6. - To create your own firefox extension, take in the downloaded directory, the file manifest.json
  7. - Open the manifest.json file with its text editor, change the name and version number, delete all unused files. Then the application is ready to be installed as a firefox extension

Intermediate method

  1. -The intermediate method takes the beginning of the simplified method And adds a personalized musical instrument.
  2. - The drawing of the musical instrument is done using the css itself called by the HTML. To the attention of those who want to familiarize themselves with drawing in css, I have placed many examples of drawings of musical instruments in my PianoBaul web pages. I strongly advise to modify them to personalize, these have only a role of learning
  3. - To draw his musical instrument, one has to forget all the conventions to switch to a multidirectional reasoning with order of construction that it is the last one who speaks that is right. Each shape we draw is the result of several dimensions. There is no square, circle, triangle, there is the resultant of all the dimensions which can give either a square, a circle, or a triangle. In the end the logic used says that there is only one form and according to the values that we place in the different dimensions, this form appears to us like a circle, like a trapezium ...
    The file to open to draw shapes is called address.css
    We give a different name to each form so that we can call it more easily. Naming in css is written by placing a point in front of the name and placing acolades at the end of the defined dimensions. Each of the defined dimensions is separated by a semicolon.
  4. -The main dimensions are, position, width, height, color, opacity, coefficients of openings. I recommend reading the w3c documentation
  5. -Once the various useful shapes are drawn, we open, with our text editor, the file PianoBaul.html to call the different forms in the page. We call a form with the term class = in a tag. If two forms occupy the same space, it is the last form called that will appear on it, we can mix shapes with opacity, see with a little practice create gradients, or actions of movements.
  6. -The musical notes of the instrument are identified by a name. By placing this name in a tag, the action is delimited by the tag. In example (div id = "b7v" class = "place7") indicates that the acoustic brick b7v is played when we click on the drawing generated by place7
  7. -The number of acoustic bricks possible is unlimited, but the management of it requires to modify several files.
    As we have seen in the simplified method, the acoustic bricks are created in the file adn1.js. In adn1.js we have two parts, one that indicates the 75 values for each indexed form of m, and one that starts the generation of each acoustic brick. In the downloaded file, we generate only 36 acoustic bricks, although the instrument has 47 possible keys. To correct, it is first necessary to have the 47 bricks acoustic (47 m indexed) and then replace the values in the generator loops for the 48, instead of 37 and 47 the place of the value 36.

Professional method

For practical reasons, the musical instrument is generated as a firefox extension, the examples I have created are called PianoBaul. Piano because I first designed a piano and Baul for Linux Universal Audio Library because the basis of the sounds of the musical instrument is generated with audio format abadie.adn
Like all the multidirectional language here, there is only understanding, no algebra, no imitation, even for drawing the same base can become a circle, a rectangle or a heart, all Is dimension and dimensional equilibrium

To create your own musical instrument in the form of an extension, you have to take the beginning of the previous tutorial to create its own manifest.json which will open its own PianoBaul.html page which can even be named otherwise.

1- We find in the page PianoBaul.html a header file which indicates that it is HTML, and that it is necessary to display the musical instrument on the complete page.


2- As indicated in the image above we also indicate the address of a javascript file, and also the address of a css file that will allow us to create the musical instrument. We draw in css because this practice is adapted to multidirectional language, this practice is adapted to the understanding. We find with the css, a visual effect part, used by prehistoric men when they rotated a bone around its center.

3- Then we give identities (id =) to locations (class =). The locations are determined by css drawings, and the identities will allow the javascript to create events (like playing a sound) when we are going to either fly over, or click finger or keyboard or ...


4- At the end of the file we indicate the locations of the various javascript files useful. It is quite possible to group them in a single file or to insert them in the HTML code, but since I planned that each one can create his own musical instrument, I preferred to separate them so that each one can modify them easier.


5- Added files are:
adresse.js : Which is used to track an event on an location with

document.addEventListener('DOMContentLoaded', function() {
document.getElementById('b1v').addEventListener("click", function() {
touche1Press();
});


Or to track the keystrokes by allowing the same sound to overlap (read several times before the first play is finished) with

case "a":
mua1 = mua1 + 1;
if(mua1>3){
mua1 =0;
}
multitouchea(mua1);
break;

This file is mainly composed of addressing to indicate when the sound should be played and what sound should be played. The technique that allows you to play the same sound repeatedly is to create multiple file names containing the same sound

adresse.css : Which serves to draw
We use css to draw, I have created for several years tutorials techniques, as an example behind this link : https://www.letime.net/alpha/5.html

adn1.js : adn1.js


Which serves as acoustic brick. The concept is to generate a basic acoustic form in audio format abadie.adn, then create tables of variations of a part of this brick according to the keys, of the musical instrument, called.

adapt1.js : adapt1.js

This file is only used to create a header for the audio file to be compatible with today's audio players. Explanations, practices of the moment want that at the beginning of file, we write what contains the file, which reader to use, the name of the file, ... It is not only the extension which indicates which tool to use to read The file, it is especially this data placed at the beginning of file.

adapt.js : adapt.js


This file is a table containing all the possible results, these are used according to the duration which is at most 128 by playing on the symmetry and a number of key points based on a byte. The results are given on 2 bytes and as it is modeling, the quality is far superior to the acoustic capacities of the human ear. We use this technique of imitation, because if computers are excellent imitators, on the other hand, they do not know how to count quickly without making mistakes.

joa.js : joa.js

This file is used to read the contents of the acoustic brick, to generate the acoustic shape. We must understand in the concept that here for sounds, as for videos, we do not use algebra, no frequency, no wave. We use shapes that put several dimensions in balance. This is multidirectional language, as used by prehistoric men or closer to us Celts, even closer to us the convention of 1789 that laid the foundations of our Republic.
act1.js: act1.js qui sert à transformer le format audio abadie.joa en format audio compatible avec la technologie audio actuelle
back1.js back1.js

This file is used to determine how many sounds will contain the musical instrument, here in the example there are 36 sounds so as to have the 26 letters of the keyboard plus the 10 keys of the numeric keypad, 36. But nothing prevents Modify to create a tactile pad containing much more sound, even acoustic bricks composed of several acoustic bricks.

In the example for 36 sounds this is written :

document.addEventListener("DOMContentLoaded", function(event) {
var pour = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10,
11, 12, 13, 14, 15, 16, 17, 18, 19, 20,
21, 22, 23, 24, 25, 26, 27, 28, 29, 30,
31, 32, 33, 34, 35, 36];
for(var pour1= 0; pour1 < 36; pour1++)
{
lance(pour[pour1]);
}
});