Skip to content

Commit 988a028

Browse files
author
name
committed
Music.
1 parent 696caac commit 988a028

File tree

5 files changed

+66
-120
lines changed

5 files changed

+66
-120
lines changed

‎bundle/example-dial.html

Lines changed: 0 additions & 37 deletions
This file was deleted.

‎bundle/example-dial.js

Lines changed: 0 additions & 20 deletions
This file was deleted.

‎bundle/example-piano.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
document.getElementById('play_button').onclick = () => examplePlayMusic('number_input');
1212
document.getElementById('number_input').oninput = () => exampleDrawMusic('number_input', 'staff_output');
1313
document.getElementById('number_input').onselectionchange = () => exampleDrawMusic('number_input', 'staff_output');
14+
document.getElementById('number_input').value = notesFuElise;
1415
exampleDrawMusic('number_input', 'staff_output');
1516
}
1617
</script>

‎bundle/example-piano.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,18 +4,19 @@ var examplePlayMusic = function (id) {
44
if (!simpleConsole)
55
simpleConsole = new WebTones.JavascriptConsole();
66
if (!piano)
7-
piano = new WebTones.GrandPiano(simpleConsole);
7+
piano = new WebTones.Piano(simpleConsole);
88
var input = document.getElementById(id);
99
if (input) {
1010
var staffPlayer = new WebTones.StaffStringPlayer(piano);
1111
staffPlayer.setCarret(input.selectionStart);
12-
staffPlayer.processMusicString(input.value);
12+
staffPlayer.process(input.value);
1313
}
1414
};
1515
var exampleDrawMusic = function (inputId, outputId) {
1616
var input = document.getElementById(inputId);
1717
var output = document.getElementById(outputId);
1818
var staffPainter = new WebTones.StaffStringPainter(output);
1919
staffPainter.setCarret(input.selectionStart);
20-
staffPainter.processMusicString(input.value);
20+
staffPainter.process(input.value);
2121
};
22+
var notesFuElise = "e5/16,d#5/16 |\ne5/16,d#5/16,e5/16,b4/16,d5/16,c5/16 |\na4/8:a2/16,e3/16,a3/16 c4/16,e4/16,h4/16 |\nb4/8:e2/16,e3/16,g#3/16 e4/16,g#4/16,b4/16 |\nc5/8:a2/16,e3/16,a3/16 e4/16,e5/16,d#5/16 |\ne5/16,d#5/16,e5/16,b4/16,d5/16,c5/16 |\na4/8:a2/16,e3/16,a3/16 c4/16,e4/16,a4/16 ||\n\nb4/8:e2/16,e3/16,g3/16 d4/16,c5/16,b4/16 |\na4/4:a2/16,e3/16,a3/16 | |\na4/8:a2/16,e3/16,a3/16 b4/16,c5/16,d5/16 |\ne5/8:c3/16,g3/16,c4/16 g4/16,f5/16,e5/16 |\nd5/8:g2/16,g3/16,b3/16 f4/16,e5/16,d5/16 |\nc5/8:a2/16,e3/16,a3/16 e4/16,d5/16,c5/16 |\nb4/8:e2/16,e4/16,e4/16 e4/16,e5/16 g2/16 ||\n\ng3/16 e5/16,e6/16 f3/16,g3/16 d#5/16 |\ne5/16 f3/16,g3/16 d#5/16,e5/16,d5/16 |\ne25/16,d#5/16,e5/16,b4/16,d5/16,c5/16 |\na4/8:a2/16,e3/16,a3/16 c4/16,e4/16,a4/16 |\nb4/8:e2/16,e3/16,g3/16 e4/16,g4/16,b4/16 |\nc5/8:a2/16,e3/16,a3/16 e4/16,e5/16,d5/16 ||\n\ne25/16,d#5/16,e5/16,b4/16,d5/16,c5/16 |\na4/8:a2/16,e3/16,a3/16 c4/16,e4/16,a4/16 |\nb4/8:e2/16,e3/16,g3/16 d4/16,c5/16,b4/16 |\na4/8:a2/16,e3/16,a3/16 b4/16,c5/16,d5/16 | |\n\na4/8:a2/16,e3/16,a3/16 e4/16:c5/16:b3/16:c4/16 f4/16:c5/16:c4/16:a3/16 e4/16:g4/16:c5/16 todo |\nf4/16,a4/16 c5/4:f3/16,a3/16,c4/16,a3/16,c4/16,a3/16 ||\n\ne5/8,d5/8:f3/16,b3/16,d4/16,b3/16,d4/16,b3/16 |\na5/16,g5/16,f5/16,e5/16,d5/16,c5/16:f3/16,e4/16,b3/16,c4/16,b3/16,c4/16 |\nb4/8,a4/8,b4/8,a4/32,g4/32,a4/32,b4/32:f3/16,a3/16,c4/16,a3/16,c4/16,a3/16 |\nc5/4 d5/8,d5/8 |\ne5/8 e5/16,f5/8,a4/8 |\nc5/4 d5/16,b4/32 ||";

‎bundle/web-tones.js

Lines changed: 61 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,7 @@ var WebTones;
5050
};
5151
AudioPlayer.prototype.muteNow = function (durationSec) {
5252
var timeSec = this.audioContext.currentTime;
53+
// todo should freq be changed
5354
this.audioOscilatorSecs = new Array(0);
5455
var currentFrequency = this.audioOscilator.frequency.value;
5556
this.audioOscilator.frequency.cancelScheduledValues(timeSec);
@@ -265,46 +266,39 @@ var __extends = (this && this.__extends) || (function () {
265266
})();
266267
var WebTones;
267268
(function (WebTones) {
268-
var GrandPiano = /** @class */ (function (_super) {
269-
__extends(GrandPiano, _super);
270-
function GrandPiano(console) {
271-
var _this = _super.call(this, GrandPiano.playersCount, console) || this;
272-
_this.playerIndex = 0;
269+
var DialPad = /** @class */ (function (_super) {
270+
__extends(DialPad, _super);
271+
function DialPad(console) {
272+
var _this = _super.call(this, 2, console) || this;
273+
_this.keyDurationSec = 0.3;
273274
return _this;
274275
}
275-
GrandPiano.prototype.playNote = function (timeSec, note, durationSec) {
276-
var playerIndex = this.chooseNextPlayerIndex();
277-
var frequency = GrandPiano.frequencies[note];
278-
var rampUpSec = GrandPiano.rampUpSec;
279-
var rampDownSec = Math.max(rampUpSec, durationSec - rampUpSec);
280-
if (frequency && durationSec) {
281-
this.playTone(playerIndex, timeSec, frequency, rampUpSec, rampDownSec);
282-
return rampUpSec + rampDownSec;
276+
DialPad.prototype.playPhoneNumber = function (phoneNumber) {
277+
this.muteNow(this.keyDurationSec / 2);
278+
var timeSec = this.getMaxTimeSec();
279+
for (var i = 0; i < phoneNumber.length; i++) {
280+
var digit = phoneNumber.charAt(i);
281+
timeSec += this.playNote(timeSec, digit, this.keyDurationSec);
283282
}
284-
else
285-
return 0;
286283
};
287-
GrandPiano.prototype.chooseNextPlayerIndex = function () {
288-
var result = this.playerIndex;
289-
this.playerIndex = (this.playerIndex + 1) % GrandPiano.playersCount;
290-
return result;
284+
DialPad.prototype.playNote = function (timeSec, note, durationSec) {
285+
var freqs = DialPad.frequencies[note];
286+
if (freqs) {
287+
var rampSec = durationSec / 2;
288+
this.playTone(0, timeSec, freqs[0], rampSec, rampSec);
289+
this.playTone(1, timeSec, freqs[1], rampSec, rampSec);
290+
}
291+
return this.keyDurationSec;
291292
};
292-
GrandPiano.rampUpSec = 0.05;
293-
GrandPiano.playersCount = 16;
294-
GrandPiano.frequencies = {
295-
"a0": 27.50, "a#0": 29.14, "b0": 30.87,
296-
"c1": 32.70, "c#1": 34.65, "d1": 36.71, "d#1": 38.89, "e1": 41.20, "f1": 43.65, "f#1": 46.25, "g1": 49.00, "g#1": 51.91, "a1": 55.00, "a#1": 58.27, "b1": 61.74,
297-
"c2": 65.41, "c#2": 69.30, "d2": 73.42, "d#2": 77.78, "e2": 82.41, "f2": 87.31, "f#2": 92.50, "g2": 98.00, "g#2": 103.83, "a2": 110.00, "a#2": 116.54, "b2": 123.47,
298-
"c3": 130.81, "c#3": 138.59, "d3": 146.83, "d#3": 155.56, "e3": 164.81, "f3": 174.61, "f#3": 185.00, "g3": 196.00, "g#3": 207.65, "a3": 220.00, "a#3": 233.08, "b3": 246.94,
299-
"c4": 261.63, "c#4": 277.18, "d4": 293.66, "d#4": 311.13, "e4": 329.63, "f4": 349.23, "f#4": 369.99, "g4": 392.00, "g#4": 415.30, "a4": 440.00, "a#4": 466.16, "b4": 493.88,
300-
"c5": 523.25, "c#5": 554.37, "d5": 587.33, "d#5": 622.25, "e5": 659.25, "f5": 698.46, "f#5": 739.99, "g5": 783.99, "g#5": 830.61, "a5": 880.00, "a#5": 932.33, "b5": 987.77,
301-
"c6": 1046.50, "c#6": 1108.73, "d6": 1174.66, "d#6": 1244.51, "e6": 1318.51, "f6": 1396.91, "f#6": 1479.98, "g6": 1567.98, "g#6": 1661.22, "a6": 1760.00, "a#6": 1864.66, "b6": 1975.53,
302-
"c7": 2093.00, "c#7": 2217.46, "d7": 2349.32, "d#7": 2489.02, "e7": 2637.02, "f7": 2793.83, "f#7": 2959.96, "g7": 3135.96, "g#7": 3322.44, "a7": 3520.00, "a#7": 3729.31, "b7": 3951.07,
303-
"c8": 4186.09,
293+
DialPad.frequencies = {
294+
'1': [697, 1209], '2': [697, 1336], '3': [697, 1477],
295+
'4': [770, 1209], '5': [770, 1336], '6': [770, 1477],
296+
'7': [852, 1209], '8': [852, 1336], '9': [852, 1477],
297+
'*': [941, 1209], '0': [941, 1336], '#': [941, 1477]
304298
};
305-
return GrandPiano;
299+
return DialPad;
306300
}(WebTones.Instrument));
307-
WebTones.GrandPiano = GrandPiano;
301+
WebTones.DialPad = DialPad;
308302
})(WebTones || (WebTones = {}));
309303
var __extends = (this && this.__extends) || (function () {
310304
var extendStatics = function (d, b) {
@@ -321,39 +315,46 @@ var __extends = (this && this.__extends) || (function () {
321315
})();
322316
var WebTones;
323317
(function (WebTones) {
324-
var PhoneDialPad = /** @class */ (function (_super) {
325-
__extends(PhoneDialPad, _super);
326-
function PhoneDialPad(console) {
327-
var _this = _super.call(this, 2, console) || this;
328-
_this.keyDurationSec = 0.3;
318+
var Piano = /** @class */ (function (_super) {
319+
__extends(Piano, _super);
320+
function Piano(console) {
321+
var _this = _super.call(this, Piano.playersCount, console) || this;
322+
_this.playerIndex = 0;
329323
return _this;
330324
}
331-
PhoneDialPad.prototype.playPhoneNumber = function (phoneNumber) {
332-
this.muteNow(this.keyDurationSec / 2);
333-
var timeSec = this.getMaxTimeSec();
334-
for (var i = 0; i < phoneNumber.length; i++) {
335-
var digit = phoneNumber.charAt(i);
336-
timeSec += this.playNote(timeSec, digit, this.keyDurationSec);
325+
Piano.prototype.playNote = function (timeSec, note, durationSec) {
326+
var playerIndex = this.chooseNextPlayerIndex();
327+
var frequency = Piano.frequencies[note];
328+
var rampUpSec = Piano.rampUpSec;
329+
var rampDownSec = Math.max(rampUpSec, durationSec - rampUpSec);
330+
if (frequency && durationSec) {
331+
this.playTone(playerIndex, timeSec, frequency, rampUpSec, rampDownSec);
332+
return rampUpSec + rampDownSec;
337333
}
334+
else
335+
return 0;
338336
};
339-
PhoneDialPad.prototype.playNote = function (timeSec, note, durationSec) {
340-
var freqs = PhoneDialPad.frequencies[note];
341-
if (freqs) {
342-
var rampSec = durationSec / 2;
343-
this.playTone(0, timeSec, freqs[0], rampSec, rampSec);
344-
this.playTone(1, timeSec, freqs[1], rampSec, rampSec);
345-
}
346-
return this.keyDurationSec;
337+
Piano.prototype.chooseNextPlayerIndex = function () {
338+
var result = this.playerIndex;
339+
this.playerIndex = (this.playerIndex + 1) % Piano.playersCount;
340+
return result;
347341
};
348-
PhoneDialPad.frequencies = {
349-
'1': [697, 1209], '2': [697, 1336], '3': [697, 1477],
350-
'4': [770, 1209], '5': [770, 1336], '6': [770, 1477],
351-
'7': [852, 1209], '8': [852, 1336], '9': [852, 1477],
352-
'*': [941, 1209], '0': [941, 1336], '#': [941, 1477]
342+
Piano.rampUpSec = 0.05;
343+
Piano.playersCount = 16;
344+
Piano.frequencies = {
345+
"a0": 27.50, "a#0": 29.14, "b0": 30.87,
346+
"c1": 32.70, "c#1": 34.65, "d1": 36.71, "d#1": 38.89, "e1": 41.20, "f1": 43.65, "f#1": 46.25, "g1": 49.00, "g#1": 51.91, "a1": 55.00, "a#1": 58.27, "b1": 61.74,
347+
"c2": 65.41, "c#2": 69.30, "d2": 73.42, "d#2": 77.78, "e2": 82.41, "f2": 87.31, "f#2": 92.50, "g2": 98.00, "g#2": 103.83, "a2": 110.00, "a#2": 116.54, "b2": 123.47,
348+
"c3": 130.81, "c#3": 138.59, "d3": 146.83, "d#3": 155.56, "e3": 164.81, "f3": 174.61, "f#3": 185.00, "g3": 196.00, "g#3": 207.65, "a3": 220.00, "a#3": 233.08, "b3": 246.94,
349+
"c4": 261.63, "c#4": 277.18, "d4": 293.66, "d#4": 311.13, "e4": 329.63, "f4": 349.23, "f#4": 369.99, "g4": 392.00, "g#4": 415.30, "a4": 440.00, "a#4": 466.16, "b4": 493.88,
350+
"c5": 523.25, "c#5": 554.37, "d5": 587.33, "d#5": 622.25, "e5": 659.25, "f5": 698.46, "f#5": 739.99, "g5": 783.99, "g#5": 830.61, "a5": 880.00, "a#5": 932.33, "b5": 987.77,
351+
"c6": 1046.50, "c#6": 1108.73, "d6": 1174.66, "d#6": 1244.51, "e6": 1318.51, "f6": 1396.91, "f#6": 1479.98, "g6": 1567.98, "g#6": 1661.22, "a6": 1760.00, "a#6": 1864.66, "b6": 1975.53,
352+
"c7": 2093.00, "c#7": 2217.46, "d7": 2349.32, "d#7": 2489.02, "e7": 2637.02, "f7": 2793.83, "f#7": 2959.96, "g7": 3135.96, "g#7": 3322.44, "a7": 3520.00, "a#7": 3729.31, "b7": 3951.07,
353+
"c8": 4186.09,
353354
};
354-
return PhoneDialPad;
355+
return Piano;
355356
}(WebTones.Instrument));
356-
WebTones.PhoneDialPad = PhoneDialPad;
357+
WebTones.Piano = Piano;
357358
})(WebTones || (WebTones = {}));
358359
var __extends = (this && this.__extends) || (function () {
359360
var extendStatics = function (d, b) {
@@ -390,7 +391,7 @@ var WebTones;
390391
StaffString.prototype.setCarret = function (carret) {
391392
this.carret = carret;
392393
};
393-
StaffString.prototype.processMusicString = function (music) {
394+
StaffString.prototype.process = function (music) {
394395
var totalChars = 0;
395396
var totalDurationSec = 0;
396397
var chords = music.split(/\s/);

0 commit comments

Comments
 (0)