Skip to content

My gchord changes #1026

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 14 commits into
base: main
Choose a base branch
from
Open

My gchord changes #1026

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
14 commits
Select commit Hold shift + click to select a range
8e4d9c3
Gchord changes
seisiuneer Jun 26, 2024
bd330d4
Fix for %%MIDI vol 0 not working
seisiuneer Jun 26, 2024
c8e1b39
Moved bass and chord octave shift to midiOptions
seisiuneer Jun 26, 2024
70597eb
Parsing and handling of bassprog and chordprog optional octave shifts
seisiuneer Jun 26, 2024
4d00729
Defaulting octave shift to zero if not specified on an inline MIDI ch…
seisiuneer Jun 26, 2024
3a7a6de
add example
Jun 30, 2024
a4127af
update package version
Jun 30, 2024
20de330
Improve selection of tunes for the example
Jun 30, 2024
2298719
Delete .DS_Store
paulrosen Jun 30, 2024
c3fafca
Delete src/.DS_Store
paulrosen Jun 30, 2024
c0dd64c
Delete src/write/.DS_Store
paulrosen Jun 30, 2024
933b252
remove gchord second parameter and gVoiceTuning
Jun 30, 2024
bfe124d
Merge branch 'gchord_26jun2024' of https://github.com/seisiuneer/abcj…
Jun 30, 2024
eafd369
change gchorddurationscale to gchordduration
Jun 30, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
237 changes: 237 additions & 0 deletions examples/accompaniment.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,237 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="examples-styles.css" />

<title>abcjs: Accompaniment Demo</title>

<link rel="stylesheet" type="text/css" href="../abcjs-audio.css">
<style>
label {
font-weight: bold;
}
.options {
margin-bottom: 10px;
}
h2 {
display: inline;
font-size: 1em;
}
.code {
color: white;
background-color: black;
padding: 10px;
display: inline-block;
border-radius: 4px;
}
</style>

<script src="../dist/abcjs-basic.js" type="text/javascript"></script>
<script type="text/javascript">
var abcCooley = "T: Cooley's\n" +
"M: 4/4\n" +
"L: 1/8\n" +
"R: reel\n" +
"K: Emin\n" +
"|:D2|EB{c}BA B2 EB|~B2 AB dBAG|FDAD BDAD|FDAD dAFD|\n" +
"EBBA B2 EB|B2 AB defg|afe^c dBAF|DEFD E2:|\n" +
"|:gf|eB B2 efge|eB B2 gedB|A2 FA DAFA|A2 FA defg|\n" +
"eB B2 eBgB|eB B2 defg|afe^c dBAF|DEFD E2:|";

var abcArpeggio =
'X:9\n' +
'T:Nocturne \n' +
'C:Avetik Topchyan\n' +
'C:upd 11 June 2024\n' +
'M:4/4\n' +
'L:1/16\n' +
'Q:1/4=80\n' +
'K:Em\n' +
'P:A\n' +
'"Em" B8 g3e3B2 | \\n' +
'"Am" c8 f3e3c2 | \\n' +
'"Em" B8 "C" c4 A2G2 | \\n' +
'"Am" F4A2G2 "B7" G2^F2G2A2 :| \n'

var abcJazz =
'X:1\n' +
'T:At the Jazz Band Ball\n' +
'C:1918 Original Dixieland Jazz Band\n' +
'M:4/4\n' +
'L:1/8\n' +
'Q:1/4=160\n' +
'K:Bb\n' +
'P:Verse\n' +
'"Gm"GG2D GG2G|GBG2G4|z2^c2d3=c|BGB2G4|\n' +
'"F7"z2FFG2AB-|"Bb"BBA2"G7"G3F|"C7"=E2G2B2dc-|"F7"c4z=EF^F|\n' +
'"Gm"GG2D GG2G|GBG2G4|z2d^c d=cBG|BG2G-G4|\n' +
'"C7"z2cd cBG2|z2cd cBG2|c2^c2dc2=c-|"F7"c4z=EF^F||\n' +
'P:Chorus\n' +
'"G7"G2=B2dB2G-|G4zG_GF|"C7"=E2G2BG2d-|d8|\n' +
'"F7"z2d2dcAF|cdc2AFGF|"Bb"B2DF A2GF-|F4z=EF^F|\n' +
'"G7"GG=B2d2BG-|G4zG_GF|"C7"=EEG2BG2d-|d4zB2G|\n' +
'"Eb"B2BB "E°7"AG2G|"Bb"FF^F2"G7"G4|"C7"GB2G"F7"A2dB-|"Bb"B6z2|]\n'

var abcFleur =
'X: 1\n' +
'T: Petite Fleur\n' +
'M: 4/4\n' +
'L: 1/4\n' +
'Q: 1/4=120\n' +
'C: Sidney Bechet 1959\n' +
'K: Bb\n' +
'E3/2E/|: [P:A]"D7"D4-|D^F/A/ (3ced|"Gm"B4-|BD/G/ A/B/A/G/|\n' +
'"A7"A4-|"D7"A =E/^F/ (3GAF|"Gm"D4-|D"^break"zE3/2E/|\n'

var synthControl;
var accompanimentStyle = 'boom-chick'
var stressStyle = 'even'
var durationStyle = 'even'
var mute = false
var swing = false

var tunes = {
'boom-chick': abcCooley,
jazz: abcJazz,
arpeggio: abcArpeggio,
tango: abcFleur,
}

var accompaniments = {
'boom-chick': '',
jazz: '%%MIDI gchord bzczbzcz\n',
arpeggio: '%%MIDI gchord GHIJghij\n',
tango: '%%MIDI gchord bzzcbzbz\n',
}

var stresses = {
'even': '',
bass: '%%MIDI gchordstress 2 1 0.25 1 2 1 0.25 1\n',
chord: '%%MIDI gchordstress 0.25 1 2 1 0.25 1 2 1\n',
}

var durations = {
'even': '',
bass: '%%MIDI gchordduration 2 1 0.5 1 2 1 0.5 1\n',
chord: '%%MIDI gchordduration 0.5 1 2 1 0.5 1 2 1\n',
overlap: '%%MIDI gchordduration 3\n',
}

function addDirectives() {
var directives = accompaniments[accompanimentStyle] +
stresses[stressStyle] + durations[durationStyle]

var el = document.querySelector(".code")
el.innerHTML = directives ? directives : "% nothing selected"
return directives + tunes[accompanimentStyle]
}
function recreateAudio() {
var abcString = addDirectives()
if (ABCJS.synth.supportsAudio()) {
var visualObj = ABCJS.renderAbc("paper", abcString)[0];

const options = {
swing: swing ? 75 : 50,
bassprog: 58,
bassvol: 80,
chordprog: 25,
chordvol: 40,
program: 24,
pan: [ -0.5, 0.5 ],
voicesOff: mute
}

if (!synthControl) {
synthControl = new ABCJS.synth.SynthController();
synthControl.load("#audio", null, {displayLoop: true, displayRestart: true, displayPlay: true, displayProgress: true, displayWarp: true});
}
synthControl.setTune(visualObj, true, options).then(function (response) {
console.log("Audio successfully loaded.")
}).catch(function (error) {
console.warn("Audio problem:", error);
});
} else {
document.querySelector(".error").innerHTML = "<div class='audio-error'>Audio is not supported in this browser.</div>";
}
}

function load() {
recreateAudio()
}

function styleChange(newStyle) {
accompanimentStyle = newStyle
recreateAudio()
}

function stressChange(newStyle) {
stressStyle = newStyle
recreateAudio()
}

function durationChange(newStyle) {
durationStyle = newStyle
recreateAudio()
}

function muteMelody(a) {
var el = document.querySelector('input[name="melody"]')
mute = el.checked
recreateAudio()
}

function swingRhythm(a) {
var el = document.querySelector('input[name="swing"]')
swing = el.checked
recreateAudio()
}

</script>
</head>

<body onload="load()">
<header>
<img src="https://paulrosen.github.io/abcjs/img/abcjs_comp_extended_08.svg" alt="abcjs logo">
<h1>Accompaniment</h1>
</header>
<main>
<p>This shows different options for tweaking the sound of the accompaniment.</p>
<div class="options">
<h2>Pattern:</h2>
<label><input type="radio" name="gchord" value="boom-chick" onclick="styleChange('boom-chick')" checked>Boom Chick (default)</label>
<label><input type="radio" name="gchord" value="jazz" onclick="styleChange('jazz')">Jazz</label>
<label><input type="radio" name="gchord" value="arpeggio" onclick="styleChange('arpeggio')">Arpeggio</label>
<label><input type="radio" name="gchord" value="tango" onclick="styleChange('tango')">Tango</label>
</div>
<div class="options">
<h2>Stress:</h2>
<label><input type="radio" name="stress" value="even" onclick="stressChange('even')" checked>Even (default)</label>
<label><input type="radio" name="stress" value="bass" onclick="stressChange('bass')">Bass heavy</label>
<label><input type="radio" name="stress" value="chord" onclick="stressChange('chord')">Chord heavy</label>
</div>
<div class="options">
<h2>Duration:</h2>
<label><input type="radio" name="duration" value="even" onclick="durationChange('even')" checked>Even (default)</label>
<label><input type="radio" name="duration" value="bass" onclick="durationChange('bass')">Long Bass</label>
<label><input type="radio" name="duration" value="chord" onclick="durationChange('chord')">Long Chord</label>
<label><input type="radio" name="duration" value="overlap" onclick="durationChange('overlap')">Overlapping</label>
</div>
<div class="options">
<h2>Melody:</h2>
<label><input type="checkbox" name="melody" onclick="muteMelody()">Mute Melody</label>
<label><input type="checkbox" name="swing" onclick="swingRhythm()">Swing Rhythm</label>
</div>
<div id="audio" class="abcjs-large"></div>
<div class="error"></div>
<p>Add this to your code:</p>
<pre class="code"></pre>
<div id="paper"></div>
</main>
</body>

</html>
Loading