raphigaziano/punkriffgen.html

## punkriffgen.html
<html>
    <head>
        <meta charset='utf-8'/>
        <title>PUNK RIFF GENERATOR</title>
        <style>
            .riffgenbox input {
                width: 25px;
            }
            .riffgenbox pre {
                width: 600px;
                height: 100px;
                border: solid black 1px;
            }
        </style>
    </head>
    <body>
      <div class="riffgenbox">
        <h1>AWESOME PUNK RIFFS GENERATOR YAY \o/</h1>
        <label for="numChords">N° Chords: </label>
            <input id="numChords" name="numChords" placeholder="3"
             type="text"/>
        <label for="minFret">Min Fret: </label>
            <input id="minFret" name="minFret" placeholder="0"
             ype="text"/>
        <label for="maxFret">Max Fret: </label>
            <input id="maxFret" name=maxFret" placeholder="12"
             ype="text"/>
        <pre id="tab"></pre>
        <button id="btnGenTab">Generer!</button>
      </div>
        <script type="text/javascript">
            var NUM_CHORDS = 3,
                MIN_FRET   = 0;
                MAX_FRET   = 12;

            var p = document.getElementById('tab');

            // Helper
            function randInt(min, max) {
                var r = // gnn
                    Math.floor(Math.random() * (max - min + 1)) + min;
                return r;
            }

            // Draw a tab of the passed chords
            function draw(chrds) {
                var beats = 0,
                    lines = [6];
                for (i=0; i < 6; i++) {
                    lines[i] = ['-'];
                }
                // Draw an individual chord
                function draw_chord(c) {
                    var bass_i = c.str - 1,
                        fret  = c.fret,
                        fifth = fret + 2;
                    for (var i =0; i < 6; i++) {
                        if (i == bass_i) {
                            lines[i].push(fret);
                            if (fifth > 9 && fret < 10) {
                                lines[i].push('-')
                            }
                        } else if (i == bass_i - 1 || i == bass_i - 2) {
                            lines[i].push(fifth);
                        } else {
                            lines[i].push('-');
                            if (fret > 9 || fifth > 9) {
                                lines[i].push('-')
                            }
                        }
                    }
                }
                chrds.map(function(c) {
                    var num_beats = [4, 8][randInt(0, 1)];
                    for (var i = 0; i < num_beats; i++) {
                        draw_chord(c);
                        beats++;
                        for (var l in lines) {
                            lines[l].push('-');
                            if (beats % 8 == 0) {
                                lines[l].push('|');
                                lines[l].push('-');
                            }
                        }
                    }
                });

                for (var l in lines) {
                    lines[l] = ' ' + lines[l].join('');
                }
                var txtnode = document.createTextNode(lines.join('\n'));
                p.appendChild(txtnode);
            }

            // Main function
            function genTab() {
                // Clear any generated tab
                p.innerHTML = '';
                var num_chords, min_fret, max_fret

                // Update settings
                function updateParams() {
                    num_chords  = parseInt(
                        document.getElementById('numChords').value || NUM_CHORDS
                    );
                    min_fret    = parseInt(
                        document.getElementById('minFret').value || MIN_FRET
                    );
                    max_fret    = parseInt(
                        document.getElementById('maxFret').value || MAX_FRET
                    );
                }
                updateParams();

                // Generate a single, random chord
                function genChord() {
                    var str  = randInt(5, 6),
                        fret = randInt(min_fret, max_fret);
                    return {
                        'str'  : str,
                        'fret' : fret
                    }
                }

                // Gen the riff (num_chords power chords \o/)
                var chords = [];
                for (i=0; i < num_chords; i++) {
                    chords.push( genChord() );
                }
                draw(chords);
            }

            // Event handling
            document.getElementById('btnGenTab').onclick = genTab;
        </script>
    </body>
</html>
	<html>
	<head>
	<meta charset='utf-8'/>
	<title>PUNK RIFF GENERATOR</title>
	<style>
	.riffgenbox input {
	width: 25px;
	}
	.riffgenbox pre {
	width: 600px;
	height: 100px;
	border: solid black 1px;
	}
	</style>
	</head>
	<body>
	<div class="riffgenbox">
	<h1>AWESOME PUNK RIFFS GENERATOR YAY \o/</h1>
	<label for="numChords">N° Chords: </label>
	<input id="numChords" name="numChords" placeholder="3"
	type="text"/>
	<label for="minFret">Min Fret: </label>
	<input id="minFret" name="minFret" placeholder="0"
	ype="text"/>
	<label for="maxFret">Max Fret: </label>
	<input id="maxFret" name=maxFret" placeholder="12"
	ype="text"/>
	<pre id="tab"></pre>
	<button id="btnGenTab">Generer!</button>
	</div>
	<script type="text/javascript">
	var NUM_CHORDS = 3,
	MIN_FRET = 0;
	MAX_FRET = 12;

	var p = document.getElementById('tab');

	// Helper
	function randInt(min, max) {
	var r = // gnn
	Math.floor(Math.random() * (max - min + 1)) + min;
	return r;
	}

	// Draw a tab of the passed chords
	function draw(chrds) {
	var beats = 0,
	lines = [6];
	for (i=0; i < 6; i++) {
	lines[i] = ['-'];
	}
	// Draw an individual chord
	function draw_chord(c) {
	var bass_i = c.str - 1,
	fret = c.fret,
	fifth = fret + 2;
	for (var i =0; i < 6; i++) {
	if (i == bass_i) {
	lines[i].push(fret);
	if (fifth > 9 && fret < 10) {
	lines[i].push('-')
	}
	} else if (i == bass_i - 1 \|\| i == bass_i - 2) {
	lines[i].push(fifth);
	} else {
	lines[i].push('-');
	if (fret > 9 \|\| fifth > 9) {
	lines[i].push('-')
	}
	}
	}
	}
	chrds.map(function(c) {
	var num_beats = [4, 8][randInt(0, 1)];
	for (var i = 0; i < num_beats; i++) {
	draw_chord(c);
	beats++;
	for (var l in lines) {
	lines[l].push('-');
	if (beats % 8 == 0) {
	lines[l].push('\|');
	lines[l].push('-');
	}
	}
	}
	});

	for (var l in lines) {
	lines[l] = ' ' + lines[l].join('');
	}
	var txtnode = document.createTextNode(lines.join('\n'));
	p.appendChild(txtnode);
	}

	// Main function
	function genTab() {
	// Clear any generated tab
	p.innerHTML = '';
	var num_chords, min_fret, max_fret

	// Update settings
	function updateParams() {
	num_chords = parseInt(
	document.getElementById('numChords').value \|\| NUM_CHORDS
	);
	min_fret = parseInt(
	document.getElementById('minFret').value \|\| MIN_FRET
	);
	max_fret = parseInt(
	document.getElementById('maxFret').value \|\| MAX_FRET
	);
	}
	updateParams();

	// Generate a single, random chord
	function genChord() {
	var str = randInt(5, 6),
	fret = randInt(min_fret, max_fret);
	return {
	'str' : str,
	'fret' : fret
	}
	}

	// Gen the riff (num_chords power chords \o/)
	var chords = [];
	for (i=0; i < num_chords; i++) {
	chords.push( genChord() );
	}
	draw(chords);
	}

	// Event handling
	document.getElementById('btnGenTab').onclick = genTab;
	</script>
	</body>
	</html>