Skip to content

Commit

Permalink
Add ability to play a provided hash.
Browse files Browse the repository at this point in the history
  • Loading branch information
@Garrett-Bodley
Garrett-Bodley committed Apr 2, 2024
1 parent 96313fd commit 21e610e
Show file tree
Hide file tree
Showing 2 changed files with 91 additions and 60 deletions.
49 changes: 31 additions & 18 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,29 +37,20 @@ <h1>SHAlala</h1>
<h2>Turn Your SHA1 into Music If You Want to Do That For Some Reason</h2>

<form id="form">
<h3>Provide a Hash</h3>
<div>
Text and File inputs are concatenated when generating the SHA1
</div>
<div>
<label for="formInput">Text Input:</label>
<input id="formInput" type="text" placeholder="enter text here" />
</div>
<div>
<label for="fileInput">Upload a file (Does not get sent to a server):</label>
<input id="fileInput" type="file" style="padding-top: 5px"/>
<button type="button" id="clearFile">X</button>
<label for="hashInput">Hash input:</label>
<input id="hashInput" placeholder="enter SHA1 here" type="text">
<button type="button" id="hashInputClear">X</button>
<br>
<p style="margin: 0; font-size: .8em;">(All other inputs are ignored when this is used)</p>
<div id="hashInputError" style="color:red"></div>
</div>
<div>
tempo:<br/>
<input id="range-input" value="200" type="range" min="60" max="240" />
<span id="range-value">180 BPM</span>
</div>
<hr/>
<div>
<h2>Load a Github Repo</h2>
<h3>Load a Github Repo</h3>
<div>
<p style="margin:0">Grabs the most recent commit of the Github Repo</p>
<p style="margin:0">Text/File input are ignored if a repo has been specified</p>
<p style="margin: 0; font-size: .8em">(Text/File input are ignored if a repo has been specified)</p>
<div>
<label for="githubInput">Github URL: </label>
<input id="githubInput" type="text" placeholder="https://github.com/UserName/Repository" style="width:50%">
Expand All @@ -70,7 +61,23 @@ <h2>Load a Github Repo</h2>
<div id="githubResults"></div>
</div>
<hr/>
<h3>Generate a Hash</h3>
<p style="margin: 0px">
Text and File inputs are concatenated when generating the SHA1
</p>
<div>
<label for="formInput">Text Input:</label>
<input id="formInput" type="text" placeholder="enter text here" />
</div>
<div>
<label for="fileInput">Upload a file (Does not get sent to a server):</label>
<input id="fileInput" type="file" style="padding-top: 5px"/>
<button type="button" id="clearFile">X</button>
</div>
<hr/>

<div style="margin-top:10px;">
<h3>Configure</h3>
<label for="scaleSelect">Select a scale:</label>
<select id="scaleSelect">
<option value="ionian">Ionian</option>
Expand All @@ -88,7 +95,13 @@ <h2>Load a Github Repo</h2>
</select>
<input type="checkbox" checked="true" id="playShortHashCheckbox" />
<label for="playShortHashCheckbox">play the short hash</label>
<div>
tempo:<br/>
<input id="range-input" value="200" type="range" min="60" max="240" />
<span id="range-value">180 BPM</span>
</div>
</div>
<h3>Play</h3>
<button type="submit" style="margin-top: 10px">SHAlala</button>
<button id="stop">stop</button>
<div id="sha"></div>
Expand Down
102 changes: 60 additions & 42 deletions index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -124,7 +124,7 @@ const AEOLIAN = {
8: "Bb4",
9: "Cb4",
a: "Db5",
b: "Gb5",
b: "Eb5",
c: "Fb5",
d: "Gb5",
e: "Ab5",
Expand Down Expand Up @@ -266,13 +266,15 @@ document.addEventListener("DOMContentLoaded", (_e) => {
document.getElementById('githubInput').addEventListener('keydown', handleGithubSubmit)
document.getElementById('githubInputButton').addEventListener('click', handleGithubClick)
document.getElementById('githubClearButton').addEventListener('click', handleGithubClearClick)
document.getElementById('hashInput').addEventListener('keydown', handleHashInputKeydown)
document.getElementById('hashInputClear').addEventListener('click', handleHashInputClear)
});

async function initTone() {
toneStart = true;
await Tone.start();
Tone.Destination.volume.value = parseFloat(-3);
Tone.Transport.bpm.value = 180;
Tone.Transport.bpm.value = 180;.5
}

async function handleRangeOnInput(e) {
Expand All @@ -293,46 +295,21 @@ async function handleOnSubmit(e) {
const inputText = document.getElementById("formInput").value;
const inputFile = document.getElementById("fileInput").files[0]
let hash;
if(gitSHA){
if(checkHashInput()){
console.log('hashInput')
hash = document.getElementById('hashInput').value
}else if(gitSHA){
console.log('gitSHA')
hash = gitSHA.getAttribute('data-SHA')
}else{
console.log('computeSHA')
hash = await computeSHA1(inputText, inputFile)
}

console.log({ hash });
document.getElementById("sha").textContent = "SHA1 Hash: " + hash;

// const synth = new Tone.Synth().toDestination();

const playShortHash = document.getElementById("playShortHashCheckbox").checked;
const scaleToPlay = document.getElementById("scaleSelect").value

const hashToPlay = playShortHash ? hash.slice(0, 8) : hash;
// const notes = hashToNotes(hashToPlay, scaleToPlay)
const notes = hashToNotesWithTempo(hashToPlay, scaleToPlay)

playNotePart(notes)
// const notes = [...hashToPlay].map((char, charIdx) => {
// let timing;
// if (charIdx === 0) {
// timing = 0;
// } else if(charIdx === hashToPlay.length - 1) {
// timing = 0.05
// } else {
// // use a floor so that values are never 0
// timing = Math.max(0.001, Number(`0x${hashToPlay[charIdx+1]}`) / 48);
// }
// return { pitch: DORIAN[char], timing }
// });

// function play() {
// let delay = Tone.now();
// for(let i = 0; i < notes.length; i++) {
// delay += notes[i].timing;
// synth.triggerAttackRelease(notes[i].pitch, '8n', delay);
// }
// }
// play();
playHash(hash)
}

async function computeSHA1(text, file) {
Expand Down Expand Up @@ -519,7 +496,7 @@ async function handleGithubSubmit(e){
await getCommits()
}

async function handleGithubClick(e){
async function handleGithubClick(){
document.getElementById('formInput').value = ''
document.getElementById('fileInput').value = ''
await getCommits()
Expand Down Expand Up @@ -639,10 +616,51 @@ function handleGithubClearClick(e){
// githubResults.innerText
}

// // Maybe deprecating? Idk if this is good for anything
// function playChords(time, chords, synth) {
// chords.forEach((chord, index) => {
// const startTime = time + index * Tone.Time("4n").toSeconds();
// synth.triggerAttackRelease(chord, "4n", startTime);
// });
// }
function handleHashInputKeydown(e){
if(e.key != 'Enter') return
e.preventDefault();
if(checkHashInput()){
if(e.target.value.length != 40){
document.getElementById('sha').innerText = `You found the Easter Egg!\n Hex Sequence: ${e.target.value}`
}else{
document.getElementById('sha').innerText = `SHA1 Hash: ${e.target.value}`
}
playHash(e.target.value)
}
}

function checkHashInput(){
document.getElementById('hashInputError').innerText = '' // clear error div
const hashInput = document.getElementById('hashInput').value
if(hashInput.length == 0) return false
// was originally going to enforce 40 || 7 char strings, but maybe any hex val is okay?
if(!isHex(hashInput)){
displayHashInputError(hashInput);
return false;
}
return true
}

function isHex(string){
const hexRegex = /^[0-9a-fA-F]+$/
return hexRegex.test(string)
}

function displayHashInputError(inputString){
const errorDiv = document.getElementById('hashInputError')
errorDiv.innerText = `"${inputString}" is not a valid hash`
}

function playHash(hash){
const playShortHash = document.getElementById("playShortHashCheckbox").checked;
const scaleToPlay = document.getElementById("scaleSelect").value
const hashToPlay = playShortHash ? hash.slice(0, 8) : hash;
const notes = hashToNotesWithTempo(hashToPlay, scaleToPlay)

playNotePart(notes)
}

function handleHashInputClear(e){
e.preventDefault();
document.getElementById('hashInput').value = ''
}

0 comments on commit 21e610e

Please sign in to comment.