eaiaiaiaoi/index.php

<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="styles/stylesheet.css" rel="stylesheet" type="text/css">
<!-- <link href="styles/app.css" rel="stylesheet" type="text/css">
 -->
  </head>
<body>
  <h4 align="right">...a space for Angeliki Diakrousi to unpack thoughts and sounds on amplification and  collective voices</h4>

<!-- menu -->
<table>
  <tr>
    <td>
      <!-- menu dropdown -->
      <div class="dropdown">
      <button onclick="myFunction()" class="dropbtn">?</button>
      <div id="myDropdown" class="dropdown-content">
        <li class="list">
        <a href="about.html" target="_blank">About <div class="description">WHAT?</div></a>
      </li>
      <li class="list">
        <a href="texts/thesis/thesis-angeliki.html" target="_blank">Let' s Talk About Unspeakable Things <div class="description">THESIS, ANNOTATIONS</div></a>
        
      </li>
      <li class="list">
        <a href="amplification.html" target="_blank">Amplification of female voices <div class="description">VOCAL EXERCISES, MEETINGS</div></a>
      </li>
      <li class="list">
        <a href="../Grad_project proposal/1902_describe-soundwalks/West Rotterdam/leeszaal_repetition.html" target="_blank">Diary of West Rotterdam <div class="description">PROCESS, ARCHIVE</div></a>
        
      </li>
      <li class="list">
        <a href="overlapping-interface.html" target="_blank">Feedback Composition <div class="description">SOUNDWALKS, ANNOTATIVE RECORDINGS</div></a>
      </li>
     <li class="list">
        <a href="player.html" target="_blank">Player <div class="description">ARCHIVE</div></a>
      </li>
      </div>
    </div>
    </td>
    <td width="100%">
      <div class="tooltip-wrap">
          <h2>About</h2>
          <div class="tooltip-content-down" style="font-size: 28px;max-width: 1000px;">
                    'Revisiting podcasts' questions the establishment of authoritative/male voices that create exclusive speech platforms, along the assumption that voices have to be rational, authoritative (voice of expertise) etc. The intervention that changes the paradigm becomes a set of podcasts that revisit the sound material produced in situated amplification meetings and soundwalks. Every podcast includes the previous one, on a way that creates repetetive layers of the same material. Creating presence by repetetion.'Revisiting podcasts' are upsetting binaries such as male/female, expert/amateur, rational/irrational
            </div>
      </div>
    </td>
  </tr>
</table>
 

<br>
<div align="center">This is an<span style="font-size:50"> audio zine</span> on amplification of female and collective voices</div>


<!-- latest podcast -->
<section style="float:right;">

<div class="tooltip-wrap">
      Listen to the latest podcast:
      <div class="tooltip-content-down">
          <div id="transcriptWrapper" class='sub'>
<div id="transcript">
<div><a data-start="10.56" href="#">00:00:10,560</a> A woman speaks in Indonesian</div>
<div><a data-start="24.38" href="#">00:00:24,380</a> Another woman responds back to her</div>
<div><a data-start="28.36" href="#">00:00:28,360</a> By repeating only the vowels of what the previous woman said</div>
<div><a data-start="58.4" href="#">00:00:58,400</a> This process continues to more people that are gathered together in a circle at Leeszaal</div>
<div><a data-start="115.26" href="#">00:01:55,260</a> A woman once told me</div>
<div><a data-start="120.62" href="#">00:02:00,620</a> That when she was a child</div>
<div><a data-start="124.98" href="#">00:02:04,980</a> She would speak to her mother in Dutch and her mother would reply back to her in Surinamese</div>
<div><a data-start="134.7" href="#">00:02:14,700</a> Their communication would go on like that</div>
<div><a data-start="138.94" href="#">00:02:18,940</a> The child was like a channel</div>
<div><a data-start="142.72" href="#">00:02:22,720</a> Like also her mother. The one would refuse to talk in one common language to the other.</div>
<div><a data-start="152.62" href="#">00:02:32,620</a> But this process of translation happening inside their head...</div>
<div><a data-start="160.1" href="#">00:02:40,100</a> is mediating and filtrating their speech through each others bodies</div>
<div><a data-start="188.24" href="#">00:03:08,240</a> In ancient  medical and anatomical theory women have two mouths, the upper and the lower, connected through neck</div>
<div><a data-start="209.72" href="#">00:03:29,720</a> The lips of both these mouths guarded a hollow cavity and they had to remain closed</div>
<div><a data-start="218.52" href="#">00:03:38,520</a> Having two mouths that speak simultaneously is confusing and embarrassing and this creates cacophony</div>
<div><a data-start="229.32" href="#">00:03:49,320</a> Females were expressing something directly when it should have been said indirectly</div>
<div><a data-start="294.9" href="#">00:04:54,900</a> In the end of this process this group of people sang together all the vowels they had transcribed</div>
<div><a data-start="309.46" href="#">00:05:09,460</a> With a small delay of synchronization they tried to sing at the same time</div>
<div><a data-start="337.58" href="#">00:05:37,580</a> In Ancient Greece there was a high-pitch utterance of women , called ololyga...</div>
<div><a data-start="347.56" href="#">00:05:47,560</a> which was a ritual practice dedicated to important events in life...</div>
<div><a data-start="355.02" href="#">00:05:55,020</a> such as like the birth of a child or the death of a person...</div>
<div><a data-start="360.7" href="#">00:06:00,700</a> and this was considered a pollution for civic space</div>
<div><a data-start="393.46" href="#">00:06:33,460</a> If expressed in public they would create chaos and provoke madness</div>
<div><a data-start="427.46" href="#">00:07:07,460</a> Here you listen Angela Davis speak in Occupy Wall Street</div>
<div><a data-start="452.4" href="#">00:07:32,400</a> People here act like a human microphone. They repeat all together what Angela Davis says...</div>
<div><a data-start="462.88" href="#">00:07:42,880</a> in order she could be heard more far away in the square...</div>
<div><a data-start="473.26" href="#">00:07:53,260</a> in order to amplify her voice, because amplification devices were not permitted</div>
<div><a data-start="481.82" href="#">00:08:01,820</a> Vowels allow us to occupy space</div>
<div><a data-start="483.82" href="#">00:08:03,820</a> Vowels vibrate us</div>
<div><a data-start="485.82" href="#">00:08:05,820</a> Vowels is the common space between our languages</div>
<div><a data-start="486.68" href="#">00:08:06,680</a> A similar example with Judith Butler speaking in Occupy Wall Street
Vowels is the common space between our languages</div>
<div><a data-start="487.82" href="#">00:08:07,820</a> Vowels make us louder and bigger
A similar example with Judith Butler speaking in Occupy Wall Street</div>
<div><a data-start="489.16" href="#">00:08:09,160</a> Vowels make us louder and bigger</div>
        </div>
  </div></div>
  </div>


<?php
//insert the folder HERE
$files = scandir("podcasts", SCANDIR_SORT_DESCENDING);
$newest_file = $files[0];
echo "<audio id='a2' controls ontimeupdate='playTranscript()' src='podcasts/$newest_file'></audio>";
?>
<br><div style="font-size:12px;"><b>sample_rate</b>: 44100<br><b>duration</b>: 534.857143<br><b>title</b>: transformation for presence<br><b>narrator</b>: angeliki<br><b>topic</b>: female voice to male</li></ul><br><b>filename</b>: podcasts/podcast.20190501-1223-femalemale.mp3<br><b>format_name</b>: mp3<br><b>size</b>: 8558073</div>

<!-- links from all the podcasts from the directory -->
<!-- <div class="dropdown3">
  <button onclick="myFunction3()" class="dropbtn3">Internet sources</button>
  <div id="myDropdown3" class="dropdown-content3">

<?php 
$files = glob("podcasts/*.*"); 
for ($i=1; $i<count($files); $i++) 
  { $num = $files[$i]; 
    $var1 = $_GET["files"]["name"];
    echo '<li style="list-style: none;"><a class="internet" href='.$num.'>'.$num.'</a></li>';
}?>
</div>
</div> -->
<br>
<label for="selection">Listen:</label>
<br>
<select id="selection">
  <option value="">- Select podcast -</option>

<?php 
$files = glob("podcasts/*.*"); 
for ($i=1; $i<count($files); $i++) 
  { $num = $files[$i]; 
    $var1 = $_GET["files"]["name"];
    echo '<option id="playlist" value="'.$num.'">'.$num.'</option>';
}?>
</select>

<br>


</section>

<div style="position:absolute; top:20%; left:26%;">
  <img src="texts/thesis/carson-list.jpg"></img>
  </div> 
  
<!-- https://github.com/mdn/web-dictaphone/  -->
    <div class="wrapper">
      <section class="main-controls">
        <canvas class="visualizer" height="60px"></canvas>
        <div id="buttons">
          <button class="record">Record</button>
          <button class="stop">Stop</button>
        </div>
      </section>
      <section class="sound-clips">
      </section>
    </div>

<?php
if(!is_dir("recordings")){
    $res = mkdir("recordings",0777); 
}

// pull the raw binary data from the POST array
$data = substr($_POST['data'], strpos($_POST['data'], ",") + 1);
$filename = urldecode($_POST['fname']);

// write the data out to the file
$fp = fopen('recordings/'.$filename, 'wb');
fwrite($fp, $decodedData);
fclose($fp);
?>


<script>
	function uploadAudio(mp3Data){
    var reader = new FileReader();
    reader.onload = function(event){
        var fd = new FormData();
        var mp3Name = encodeURIComponent('audio_recording_' + new Date().getTime() + '.mp3');
        console.log("mp3name = " + mp3Name);
        fd.append('fname', mp3Name);
        fd.append('data', event.target.result);
        $.ajax({
            type: 'POST',
            url: 'upload.php',
            data: fd,
            processData: false,
            contentType: false
        }).done(function(data) {
            //console.log(data);
            log.innerHTML += "\n" + data;
        });
    };      
    reader.readAsDataURL(mp3Data);
}
</script>


<!-- <audio controls autoplay></audio>
<script type="text/javascript" src="recorder.js"> </script>
        <fieldset><legend>RECORD AUDIO</legend>
<input onclick="startRecording()" type="button" value="start recording" />
<input onclick="stopRecording()" type="button" value="stop recording and play" />
        </fieldset>
<script>
	var onFail = function(e) {
		console.log('Rejected!', e);
	};

	var onSuccess = function(s) {
		var context = new webkitAudioContext();
		var mediaStreamSource = context.createMediaStreamSource(s);
		recorder = new Recorder(mediaStreamSource);
		recorder.record();

		// audio loopback
		// mediaStreamSource.connect(context.destination);
	}

	window.URL = window.URL || window.webkitURL;
	navigator.getUserMedia  = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;

	var recorder;
	var audio = document.querySelector('audio');

	function startRecording() {
		if (navigator.getUserMedia) {
			navigator.getUserMedia({audio: true}, onSuccess, onFail);
		} else {
			console.log('navigator.getUserMedia not present');
		}
	}

	function stopRecording() {
		recorder.stop();
		recorder.exportWAV(function(s) {
                    
                     	audio.src = window.URL.createObjectURL(s);
		});
	}
</script> -->


<script>
/* When the user clicks on the button, 
toggle between hiding and showing the dropdown content */
function myFunction() {
  document.getElementById("myDropdown").classList.toggle("show");
}

// Close the dropdown if the user clicks outside of it
window.onclick = function(event) {
  if (!event.target.matches('.dropbtn')) {
    var dropdowns = document.getElementsByClassName("dropdown-content");
    var i;
    for (i = 0; i < dropdowns.length; i++) {
      var openDropdown = dropdowns[i];
      if (openDropdown.classList.contains('show')) {
        openDropdown.classList.remove('show');
      }
    }
  }
}
</script>

<script>
/* When the user clicks on the button, 
toggle between hiding and showing the dropdown content */
function myFunction2() {
  document.getElementById("myDropdown2").classList.toggle("show2");
}

// Close the dropdown if the user clicks outside of it
window.onclick2 = function(event) {
  if (!event.target.matches('.dropbtn2')) {
    var dropdowns = document.getElementsByClassName("dropdown-content2");
    var i;
    for (i = 0; i < dropdowns.length; i++) {
      var openDropdown = dropdowns[i];
      if (openDropdown.classList.contains('show2')) {
        openDropdown.classList.remove('show2');
      }
    }
  }
}
</script>

<!-- scripts for dictaphone -->
<script src="scripts/mediaDevices-getUserMedia-polyfill.js"></script>

    <!-- Below is your custom application script -->
    <script src="scripts/app.js"></script>

<script>
	function saveAudio(){
var req = null;
var url = "savefile.php";
var data = document.getElementById("save").href.toString();// document.getElementById("save").innerHTML;// = xhttp.responseText;;   // you have to check how to get the data from your saveAudio() method
window.alert(data);

(window.XMLHttpRequest) ? req = new XMLHttpRequest() : (window.ActiveXObject) ? req = new ActiveXObject("Microsoft.XMLHTTP") : req = false; 
req.open("POST", url, true);
req.setRequestHeader("Content-Type", "multipart/form-data");

if(data != null) //&& data != "")
{
  req.setRequestHeader("Content-length", data.length);
  req.send(data);
}}

</script>

<!-- script for subs and sound -->
<script>
	var dialogueTimings = [10,24,28,58,115,120,124,134,138,142,152,160],
        dialogues = document.querySelectorAll('#transcript>div'),
        transcriptWrapper = document.querySelector('#transcriptWrapper'),
        audio = document.querySelector('#a2'),
        previousDialogueTime = -1;   

     function playTranscript() {

        var currentDialogueTime = Math.max.apply(Math, dialogueTimings.filter(function(v){return v <= audio.currentTime}));

        if(previousDialogueTime !== currentDialogueTime) {
            previousDialogueTime = currentDialogueTime;
            var currentDialogue = dialogues[dialogueTimings.indexOf(currentDialogueTime)];
            transcriptWrapper.scrollTop  = currentDialogue.offsetTop - 50;  
            var previousDialogue = document.getElementsByClassName('speaking')[0];
            if(previousDialogue !== undefined)
                previousDialogue.className = previousDialogue.className.replace('speaking','');
            currentDialogue.className +=' speaking';
        }
    }
;
</script>

<?php

$save_folder = dirname(__FILE__) ."/js";
if(! file_exists($save_folder)) {
    if(! mkdir($save_folder)) {
        die("failed to create save folder $save_folder");
    }
}

$key = 'filename';
$tmp_name = $_FILES["audiofile"]["tmp_name"];
$upload_name = $_FILES["audiofile"]["name"];
$type = $_FILES["audiofile"]["type"];
$filename = "$save_folder/$upload_name";
$saved = 0;
if(($type == 'audio/x-wav' || $type == 'application/octet-stream') && preg_match('/^[a-zA-Z0-9_\-]+\.wav$/', $upload_name) ) {

    $saved = move_uploaded_file($tmp_name, $filename) ? 1 : 0;
}

//name is needed to send in the php file

?>


</body>

</html>
made index.html 6 years ago			`<html lang="en">`
add dropdown menu and simplified the index 6 years ago			`<head>`
added javascript/record mic audio 6 years ago			`<meta charset="utf-8">`
add dropdown menu and simplified the index 6 years ago			`<meta name="viewport" content="width=device-width, initial-scale=1">`
moved stuff around and renamed main folder 6 years ago			`<link href="styles/stylesheet.css" rel="stylesheet" type="text/css">`
			`<!-- <link href="styles/app.css" rel="stylesheet" type="text/css">`
edit html pages focused on web audio players 6 years ago			`-->`
added javascript/record mic audio 6 years ago			`</head>`
edit index 6 years ago			`<body>`
edit html pages focused on web audio players 6 years ago			`<h4 align="right">...a space for Angeliki Diakrousi to unpack thoughts and sounds on amplification and collective voices</h4>`
add dropdown menu and simplified the index 6 years ago
added texts and images in player 6 years ago			`<!-- menu -->`
			`<table>`
			`<tr>`
			`<td>`
			`<!-- menu dropdown -->`
			`<div class="dropdown">`
			`<button onclick="myFunction()" class="dropbtn">?</button>`
			`<div id="myDropdown" class="dropdown-content">`
			`<li class="list">`
			`<a href="about.html" target="_blank">About <div class="description">WHAT?</div></a>`
			`</li>`
			`<li class="list">`
			`<a href="texts/thesis/thesis-angeliki.html" target="_blank">Let' s Talk About Unspeakable Things <div class="description">THESIS, ANNOTATIONS</div></a>`

			`</li>`
			`<li class="list">`
			`<a href="amplification.html" target="_blank">Amplification of female voices <div class="description">VOCAL EXERCISES, MEETINGS</div></a>`
			`</li>`
			`<li class="list">`
			`<a href="../Grad_project proposal/1902_describe-soundwalks/West Rotterdam/leeszaal_repetition.html" target="_blank">Diary of West Rotterdam <div class="description">PROCESS, ARCHIVE</div></a>`

			`</li>`
			`<li class="list">`
			`<a href="overlapping-interface.html" target="_blank">Feedback Composition <div class="description">SOUNDWALKS, ANNOTATIVE RECORDINGS</div></a>`
			`</li>`
			`<li class="list">`
			`<a href="player.html" target="_blank">Player <div class="description">ARCHIVE</div></a>`
			`</li>`
			`</div>`
			`</div>`
			`</td>`
			`<td width="100%">`
			`<div class="tooltip-wrap">`
			`<h2>About</h2>`
			`<div class="tooltip-content-down" style="font-size: 28px;max-width: 1000px;">`
			'Revisiting podcasts' questions the establishment of authoritative/male voices that create exclusive speech platforms, along the assumption that voices have to be rational, authoritative (voice of expertise) etc. The intervention that changes the paradigm becomes a set of podcasts that revisit the sound material produced in situated amplification meetings and soundwalks. Every podcast includes the previous one, on a way that creates repetetive layers of the same material. Creating presence by repetetion.'Revisiting podcasts' are upsetting binaries such as male/female, expert/amateur, rational/irrational
			`</div>`
			`</div>`
			`</td>`
			`</tr>`
			`</table>`



add content at index.php 6 years ago
before the details/thesis 6 years ago
edit html pages focused on web audio players 6 years ago			`<br>`
			`<div align="center">This is an<span style="font-size:50"> audio zine</span> on amplification of female and collective voices</div>`


added texts and images in player 6 years ago			`<!-- latest podcast -->`
edit html pages focused on web audio players 6 years ago			`<section style="float:right;">`

			`<div class="tooltip-wrap">`
			`Listen to the latest podcast:`
edit player 6 years ago			`<div class="tooltip-content-down">`
edit html pages focused on web audio players 6 years ago			`<div id="transcriptWrapper" class='sub'>`
			`<div id="transcript">`
			`<div><a data-start="10.56" href="#">00:00:10,560</a> A woman speaks in Indonesian</div>`
			`<div><a data-start="24.38" href="#">00:00:24,380</a> Another woman responds back to her</div>`
			`<div><a data-start="28.36" href="#">00:00:28,360</a> By repeating only the vowels of what the previous woman said</div>`
			`<div><a data-start="58.4" href="#">00:00:58,400</a> This process continues to more people that are gathered together in a circle at Leeszaal</div>`
			`<div><a data-start="115.26" href="#">00:01:55,260</a> A woman once told me</div>`
			`<div><a data-start="120.62" href="#">00:02:00,620</a> That when she was a child</div>`
			`<div><a data-start="124.98" href="#">00:02:04,980</a> She would speak to her mother in Dutch and her mother would reply back to her in Surinamese</div>`
			`<div><a data-start="134.7" href="#">00:02:14,700</a> Their communication would go on like that</div>`
			`<div><a data-start="138.94" href="#">00:02:18,940</a> The child was like a channel</div>`
			`<div><a data-start="142.72" href="#">00:02:22,720</a> Like also her mother. The one would refuse to talk in one common language to the other.</div>`
			`<div><a data-start="152.62" href="#">00:02:32,620</a> But this process of translation happening inside their head...</div>`
			`<div><a data-start="160.1" href="#">00:02:40,100</a> is mediating and filtrating their speech through each others bodies</div>`
			`<div><a data-start="188.24" href="#">00:03:08,240</a> In ancient medical and anatomical theory women have two mouths, the upper and the lower, connected through neck</div>`
			`<div><a data-start="209.72" href="#">00:03:29,720</a> The lips of both these mouths guarded a hollow cavity and they had to remain closed</div>`
			`<div><a data-start="218.52" href="#">00:03:38,520</a> Having two mouths that speak simultaneously is confusing and embarrassing and this creates cacophony</div>`
			`<div><a data-start="229.32" href="#">00:03:49,320</a> Females were expressing something directly when it should have been said indirectly</div>`
			`<div><a data-start="294.9" href="#">00:04:54,900</a> In the end of this process this group of people sang together all the vowels they had transcribed</div>`
			`<div><a data-start="309.46" href="#">00:05:09,460</a> With a small delay of synchronization they tried to sing at the same time</div>`
			`<div><a data-start="337.58" href="#">00:05:37,580</a> In Ancient Greece there was a high-pitch utterance of women , called ololyga...</div>`
			`<div><a data-start="347.56" href="#">00:05:47,560</a> which was a ritual practice dedicated to important events in life...</div>`
			`<div><a data-start="355.02" href="#">00:05:55,020</a> such as like the birth of a child or the death of a person...</div>`
			`<div><a data-start="360.7" href="#">00:06:00,700</a> and this was considered a pollution for civic space</div>`
			`<div><a data-start="393.46" href="#">00:06:33,460</a> If expressed in public they would create chaos and provoke madness</div>`
			`<div><a data-start="427.46" href="#">00:07:07,460</a> Here you listen Angela Davis speak in Occupy Wall Street</div>`
			`<div><a data-start="452.4" href="#">00:07:32,400</a> People here act like a human microphone. They repeat all together what Angela Davis says...</div>`
			`<div><a data-start="462.88" href="#">00:07:42,880</a> in order she could be heard more far away in the square...</div>`
			`<div><a data-start="473.26" href="#">00:07:53,260</a> in order to amplify her voice, because amplification devices were not permitted</div>`
			`<div><a data-start="481.82" href="#">00:08:01,820</a> Vowels allow us to occupy space</div>`
			`<div><a data-start="483.82" href="#">00:08:03,820</a> Vowels vibrate us</div>`
			`<div><a data-start="485.82" href="#">00:08:05,820</a> Vowels is the common space between our languages</div>`
			`<div><a data-start="486.68" href="#">00:08:06,680</a> A similar example with Judith Butler speaking in Occupy Wall Street`
			`Vowels is the common space between our languages</div>`
			`<div><a data-start="487.82" href="#">00:08:07,820</a> Vowels make us louder and bigger`
			`A similar example with Judith Butler speaking in Occupy Wall Street</div>`
			`<div><a data-start="489.16" href="#">00:08:09,160</a> Vowels make us louder and bigger</div>`
added javascript/record mic audio 6 years ago			`</div>`
edit html pages focused on web audio players 6 years ago			`</div></div>`
			`</div>`
added javascript/record mic audio 6 years ago

added player and other 6 years ago			`<?php`
			`//insert the folder HERE`
moved stuff around and renamed main folder 6 years ago			`$files = scandir("podcasts", SCANDIR_SORT_DESCENDING);`
added player and other 6 years ago			`$newest_file = $files[0];`
moved stuff around and renamed main folder 6 years ago			`echo "<audio id='a2' controls ontimeupdate='playTranscript()' src='podcasts/$newest_file'></audio>";`
added player and other 6 years ago			`?>`
edit texts 6 years ago			`<br><div style="font-size:12px;"><b>sample_rate</b>: 44100<br><b>duration</b>: 534.857143<br><b>title</b>: transformation for presence<br><b>narrator</b>: angeliki<br><b>topic</b>: female voice to male</li></ul><br><b>filename</b>: podcasts/podcast.20190501-1223-femalemale.mp3<br><b>format_name</b>: mp3<br><b>size</b>: 8558073</div>`

			`<!-- links from all the podcasts from the directory -->`
			`<!-- <div class="dropdown3">`
			`<button onclick="myFunction3()" class="dropbtn3">Internet sources</button>`
			`<div id="myDropdown3" class="dropdown-content3">`

			`<?php`
moved stuff around and renamed main folder 6 years ago			`$files = glob("podcasts/.");`
edit texts 6 years ago			`for ($i=1; $i<count($files); $i++)`
			`{ $num = $files[$i];`
			`$var1 = $_GET["files"]["name"];`
			`echo '<li style="list-style: none;"><a class="internet" href='.$num.'>'.$num.'</a></li>';`
			`}?>`
			`</div>`
			`</div> -->`
			`<br>`
			`<label for="selection">Listen:</label>`
			`<br>`
			`<select id="selection">`
moved stuff around and renamed main folder 6 years ago			`<option value="">- Select podcast -</option>`
edit texts 6 years ago
			`<?php`
moved stuff around and renamed main folder 6 years ago			`$files = glob("podcasts/.");`
edit texts 6 years ago			`for ($i=1; $i<count($files); $i++)`
			`{ $num = $files[$i];`
			`$var1 = $_GET["files"]["name"];`
			`echo '<option id="playlist" value="'.$num.'">'.$num.'</option>';`
			`}?>`
			`</select>`

			`<br>`
added player and other 6 years ago
added pop up windows in index 6 years ago

add dropdown menu and simplified the index 6 years ago			`</section>`

edit html pages focused on web audio players 6 years ago			`<div style="position:absolute; top:20%; left:26%;">`
moved stuff around and renamed main folder 6 years ago			`<img src="texts/thesis/carson-list.jpg"></img>`
edit html pages focused on web audio players 6 years ago			`</div>`

			`<!-- https://github.com/mdn/web-dictaphone/ -->`
			`<div class="wrapper">`
			`<section class="main-controls">`
			`<canvas class="visualizer" height="60px"></canvas>`
			`<div id="buttons">`
			`<button class="record">Record</button>`
			`<button class="stop">Stop</button>`
			`</div>`
			`</section>`
			`<section class="sound-clips">`
			`</section>`
			`</div>`
add dropdown menu and simplified the index 6 years ago
			`<?php`
			`if(!is_dir("recordings")){`
			`$res = mkdir("recordings",0777);`
			`}`

			`// pull the raw binary data from the POST array`
			`$data = substr($_POST['data'], strpos($_POST['data'], ",") + 1);`
			`$filename = urldecode($_POST['fname']);`

			`// write the data out to the file`
			`$fp = fopen('recordings/'.$filename, 'wb');`
			`fwrite($fp, $decodedData);`
			`fclose($fp);`
			`?>`

added pop up windows in index 6 years ago
add dropdown menu and simplified the index 6 years ago			`<script>`
			`function uploadAudio(mp3Data){`
			`var reader = new FileReader();`
			`reader.onload = function(event){`
			`var fd = new FormData();`
			`var mp3Name = encodeURIComponent('audio_recording_' + new Date().getTime() + '.mp3');`
			`console.log("mp3name = " + mp3Name);`
			`fd.append('fname', mp3Name);`
			`fd.append('data', event.target.result);`
			`$.ajax({`
			`type: 'POST',`
			`url: 'upload.php',`
			`data: fd,`
			`processData: false,`
			`contentType: false`
			`}).done(function(data) {`
			`//console.log(data);`
			`log.innerHTML += "\n" + data;`
			`});`
			`};`
			`reader.readAsDataURL(mp3Data);`
			`}`
			`</script>`



			`<!-- <audio controls autoplay></audio>`
			`<script type="text/javascript" src="recorder.js"> </script>`
			`<fieldset><legend>RECORD AUDIO</legend>`
			`<input onclick="startRecording()" type="button" value="start recording" />`
			`<input onclick="stopRecording()" type="button" value="stop recording and play" />`
			`</fieldset>`
			`<script>`
			`var onFail = function(e) {`
			`console.log('Rejected!', e);`
			`};`

			`var onSuccess = function(s) {`
			`var context = new webkitAudioContext();`
			`var mediaStreamSource = context.createMediaStreamSource(s);`
			`recorder = new Recorder(mediaStreamSource);`
			`recorder.record();`

			`// audio loopback`
			`// mediaStreamSource.connect(context.destination);`
			`}`

			`window.URL = window.URL \|\| window.webkitURL;`
			`navigator.getUserMedia = navigator.getUserMedia \|\| navigator.webkitGetUserMedia \|\| navigator.mozGetUserMedia \|\| navigator.msGetUserMedia;`

			`var recorder;`
			`var audio = document.querySelector('audio');`

			`function startRecording() {`
			`if (navigator.getUserMedia) {`
			`navigator.getUserMedia({audio: true}, onSuccess, onFail);`
			`} else {`
			`console.log('navigator.getUserMedia not present');`
			`}`
			`}`

			`function stopRecording() {`
			`recorder.stop();`
			`recorder.exportWAV(function(s) {`

			`audio.src = window.URL.createObjectURL(s);`
			`});`
			`}`
			`</script> -->`
edit html pages focused on web audio players 6 years ago

add dropdown menu and simplified the index 6 years ago			`<script>`
			`/* When the user clicks on the button,`
			`toggle between hiding and showing the dropdown content */`
			`function myFunction() {`
			`document.getElementById("myDropdown").classList.toggle("show");`
			`}`

			`// Close the dropdown if the user clicks outside of it`
			`window.onclick = function(event) {`
			`if (!event.target.matches('.dropbtn')) {`
			`var dropdowns = document.getElementsByClassName("dropdown-content");`
			`var i;`
			`for (i = 0; i < dropdowns.length; i++) {`
			`var openDropdown = dropdowns[i];`
			`if (openDropdown.classList.contains('show')) {`
			`openDropdown.classList.remove('show');`
			`}`
			`}`
			`}`
			`}`
			`</script>`

add content at index.php 6 years ago			`<script>`
			`/* When the user clicks on the button,`
			`toggle between hiding and showing the dropdown content */`
			`function myFunction2() {`
			`document.getElementById("myDropdown2").classList.toggle("show2");`
			`}`

			`// Close the dropdown if the user clicks outside of it`
			`window.onclick2 = function(event) {`
			`if (!event.target.matches('.dropbtn2')) {`
			`var dropdowns = document.getElementsByClassName("dropdown-content2");`
			`var i;`
			`for (i = 0; i < dropdowns.length; i++) {`
			`var openDropdown = dropdowns[i];`
			`if (openDropdown.classList.contains('show2')) {`
			`openDropdown.classList.remove('show2');`
			`}`
			`}`
			`}`
			`}`
edit html pages focused on web audio players 6 years ago			`</script>`

			`<!-- scripts for dictaphone -->`
moved stuff around and renamed main folder 6 years ago			`<script src="scripts/mediaDevices-getUserMedia-polyfill.js"></script>`
changes in index/kept the circle utterances 6 years ago
added javascript/record mic audio 6 years ago			`<!-- Below is your custom application script -->`
moved stuff around and renamed main folder 6 years ago			`<script src="scripts/app.js"></script>`
changes in index/kept the circle utterances 6 years ago
edit html pages focused on web audio players 6 years ago			`<script>`
			`function saveAudio(){`
			`var req = null;`
			`var url = "savefile.php";`
			`var data = document.getElementById("save").href.toString();// document.getElementById("save").innerHTML;// = xhttp.responseText;; // you have to check how to get the data from your saveAudio() method`
			`window.alert(data);`

			`(window.XMLHttpRequest) ? req = new XMLHttpRequest() : (window.ActiveXObject) ? req = new ActiveXObject("Microsoft.XMLHTTP") : req = false;`
			`req.open("POST", url, true);`
			`req.setRequestHeader("Content-Type", "multipart/form-data");`

			`if(data != null) //&& data != "")`
			`{`
			`req.setRequestHeader("Content-length", data.length);`
			`req.send(data);`
			`}}`

			`</script>`

			`<!-- script for subs and sound -->`
			`<script>`
			`var dialogueTimings = [10,24,28,58,115,120,124,134,138,142,152,160],`
			`dialogues = document.querySelectorAll('#transcript>div'),`
			`transcriptWrapper = document.querySelector('#transcriptWrapper'),`
			`audio = document.querySelector('#a2'),`
			`previousDialogueTime = -1;`

			`function playTranscript() {`

			`var currentDialogueTime = Math.max.apply(Math, dialogueTimings.filter(function(v){return v <= audio.currentTime}));`

			`if(previousDialogueTime !== currentDialogueTime) {`
			`previousDialogueTime = currentDialogueTime;`
			`var currentDialogue = dialogues[dialogueTimings.indexOf(currentDialogueTime)];`
			`transcriptWrapper.scrollTop = currentDialogue.offsetTop - 50;`
			`var previousDialogue = document.getElementsByClassName('speaking')[0];`
			`if(previousDialogue !== undefined)`
			`previousDialogue.className = previousDialogue.className.replace('speaking','');`
			`currentDialogue.className +=' speaking';`
			`}`
			`}`
			`;`
			`</script>`

			`<?php`

			`$save_folder = dirname(__FILE__) ."/js";`
			`if(! file_exists($save_folder)) {`
			`if(! mkdir($save_folder)) {`
			`die("failed to create save folder $save_folder");`
			`}`
			`}`

			`$key = 'filename';`
			`$tmp_name = $_FILES["audiofile"]["tmp_name"];`
			`$upload_name = $_FILES["audiofile"]["name"];`
			`$type = $_FILES["audiofile"]["type"];`
			`$filename = "$save_folder/$upload_name";`
			`$saved = 0;`
			`if(($type == 'audio/x-wav' \|\| $type == 'application/octet-stream') && preg_match('/^[a-zA-Z0-9_\-]+\.wav$/', $upload_name) ) {`

			`$saved = move_uploaded_file($tmp_name, $filename) ? 1 : 0;`
			`}`

			`//name is needed to send in the php file`

			`?>`


edit thesis and presentation of April 6 years ago
edit index 6 years ago			`</body>`
edit proposal 6 years ago
made index.html 6 years ago			`</html>`