edited podcasts and fixed recording in different upload folders

master
Angeliki 6 years ago
parent 9a75400cdd
commit e5b2fe7ab1

@ -1,61 +0,0 @@
<!DOCTYPE html>
<style type="text/css">
body {font-family: "Old Standard TT"; font-size: 20px; line-height: 1.4; letter-spacing: 1px;}
h2 {
text-align: center;
letter-spacing: 4px;
font-size: 28px;}
section {margin-bottom: 100px; margin-top: 50px;}
table, th, td {vertical-align: top; border-collapse: separate; padding: 6px;}
button {width: 100px;}
.short-description{
margin-left: 30%;
margin-right: 30%;
text-align: center;
}
a {
text-decoration:none;
}
div.gallery {
margin: 1px;
border: 1px solid #ccc;
float: left;
width: 31%;
}
div.gallery:hover {
border: 1px solid #777;
}
div.gallery img {
width: 100%;
height: auto;
}
div.desc {
padding: 15px;
font-size: 14px;
/* text-align: left;*/
font-style: italic;
}
.audio-mini {
width: 50px;
}
</style>
<html>
<head>
<section>
<h2 >What?</h2>
<div class="short-description">
<p>'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 </p>
<p>
<a href="../index.html">Utterance</a>
</p>
</div>
</section>
</head>
<body>
</body>
</html>

@ -102,25 +102,25 @@
<!-- draggable menu--> <!-- draggable menu-->
<div class="draggable" style="width: 500px; top: 20px; right: 0px;"> <div class="draggable" style="width: 500px; top: 20px; right: 0px;">
<h2><a href="amplification.html" target="_blank">Amplification of female voices</a></h2> <h2><a href="amplification.html">Amplification of female voices</a></h2>
<div class="drag-content">How can we engage politically with the exclusion of specific voices from the public sphere? Here I document my attempts to create a safe common space of trying methods and discussing that topic in Leeszaal, an open library that I consider a diverse public space. I am borrowing methods from feminist groups and protest movements and vocal warming up exercises by Pauline Oliveros. For example, protesters would amplify the speaker's voice by repeating collectively their speech to make their presence visible. Feminists would create safe spaces where women could speak about domestic violence and make a dialogue based on listening. Some methods are vocal performances in situ, the "human microphone", speech acts, listening practices, making podcasts, mediating speech, transform our voices, situated experiments. I am doing that together with Christina Karagianni, who is also from Greece and with whom I share similar experiences of silencing. We combine our practices -her practice lies on choreography and dance and mine on social interaction, voice and sound- and try vocal exercises and reading in moments of Leeszaal.<div class="tooltip-wrap" style="display: inline;text-decoration:underline;">We invite <div class="tooltip-content-right" ><div>how we should approch the gender terminology and false association with voice when inviting people? Should it be about femme sounding? Female voice? </div></div></div>people from Leeszaal and our environment, who find themselves related and interested to this topic. Elements from the meetings: discuss previous material, reading extracts in random order, <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">discuss <div class="tooltip-content-right" ><div>what conflicts or frictions the technical aspect provokes? web-audio, recordings</div></div></div>personal associations and experiences with voice in public, warm up, say a sentence of personal experience in any language, transcribe only the vowels, read back the vowels, read outloud all together the score of vowels, repeat sentences with distorted voice, make podcasts.</div> <div class="drag-content">How can we engage politically with the exclusion of specific voices from the public sphere? Here I document my attempts to create a safe common space of trying methods and discussing that topic in Leeszaal, an open library that I consider a diverse public space. I am borrowing methods from feminist groups and protest movements and vocal warming up exercises by Pauline Oliveros. For example, protesters would amplify the speaker's voice by repeating collectively their speech to make their presence visible. Feminists would create safe spaces where women could speak about domestic violence and make a dialogue based on listening. Some methods are vocal performances in situ, the "human microphone", speech acts, listening practices, making podcasts, mediating speech, transform our voices, situated experiments. I am doing that together with Christina Karagianni, who is also from Greece and with whom I share similar experiences of silencing. We combine our practices -her practice lies on choreography and dance and mine on social interaction, voice and sound- and try vocal exercises and reading in moments of Leeszaal.<div class="tooltip-wrap" style="display: inline;text-decoration:underline;">We invite <div class="tooltip-content-right" ><div>how we should approch the gender terminology and false association with voice when inviting people? Should it be about femme sounding? Female voice? </div></div></div>people from Leeszaal and our environment, who find themselves related and interested to this topic. Elements from the meetings: discuss previous material, reading extracts in random order, <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">discuss <div class="tooltip-content-right" ><div>what conflicts or frictions the technical aspect provokes? web-audio, recordings</div></div></div>personal associations and experiences with voice in public, warm up, say a sentence of personal experience in any language, transcribe only the vowels, read back the vowels, read outloud all together the score of vowels, repeat sentences with distorted voice, make podcasts.</div>
</div> </div>
<div class="draggable" style="top: 1070px; right: 0px;"> <div class="draggable" style="top: 1070px; right: 0px;">
<h2 ><a href="" target="_blank">Diary of West Rotterdam</a></h2> <h2 ><a href="">Diary of West Rotterdam</a></h2>
</div> </div>
<div class="draggable" style="top: 1000px; right: 0px;"> <div class="draggable" style="top: 1000px; right: 0px;">
<h2 ><a href="player.html" target="_blank">Player</a></h2> <h2 ><a href="player.html">Player</a></h2>
</div> </div>
<div class="draggable" style="top: 800px; right: 0px;"> <div class="draggable" style="top: 800px; right: 0px;">
<h2 ><a href="podcast1.php" target="_blank">About</a></h2> <h2 ><a href="podcast1.php">About</a></h2>
</div> </div>
<div class="draggable" style="top: 700px; right: 0px;"> <div class="draggable" style="top: 700px; right: 0px;">
<h2 ><a href="podcast1.php" target="_blank">Podcasts</a></h2> <h2 ><a href="podcast1.php">Podcasts</a></h2>
</div> </div>
<div class="draggable" style="top: 900px; right: 0px; z-index: 9;"> <div class="draggable" style="top: 900px; right: 0px; z-index: 9;">
<h2 ><a href="texts/thesis/thesis-angeliki.html" target="_blank">"Let' s Talk About Unspeakable Things"</a></h2> <h2 ><a href="thesis-angeliki.html">"Let' s Talk About Unspeakable Things"</a></h2>
</div> </div>
<!-- end draggable --> <!-- end draggable -->

@ -34,44 +34,44 @@
</div> </div>
<div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top: 4px; right: 1500px;"> <div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top: 4px; right: 1500px;">
<h2 ><a href="podcast1.php" target="_blank">Podcast1</a></h2> <h2 ><a href="podcast1.php" >Podcast1</a></h2>
<div class="drag-content">Podcast1 "Mediating Speech" is about the amplification of one's voice through another person.<br><i> It includes series of episodes of the online audio archive of the player, overlayered and commented by my voice as a narrator.</i> <div class="drag-content">Podcast1 "Mediating Speech" is about the amplification of one's voice through another person.<br><i> It includes series of episodes of the online audio archive of the player, overlayered and commented by my voice as a narrator.</i>
</div> </div>
</div> </div>
<div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top: 220px; right: 10px;"> <div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top: 220px; right: 10px;">
<h2 ><a href="podcast2.php" target="_blank">Podcast2</a></h2> <h2 ><a href="podcast2.php" >Podcast2</a></h2>
</div> </div>
<div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top: 320px; right: 100px;"> <div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top: 320px; right: 100px;">
<h2 ><a href="podcast3.php" target="_blank">Podcast3</a></h2> <h2 ><a href="podcast3.php" >Podcast3</a></h2>
</div> </div>
<div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top: 420px; right: 80px;"> <div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top: 420px; right: 80px;">
<h2 ><a href="podcast4.php" target="_blank">Podcast4</a></h2> <h2 ><a href="podcast4.php" >Podcast4</a></h2>
</div> </div>
</div> </div>
<div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top:4%;left:80%;"> <div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top:4%;left:80%;">
<h2 ><a href="texts/thesis/thesis-angeliki.html" target="_blank">"Let's Talk About Unspeakable Things"</a></h2> <h2 ><a href="thesis-angeliki.html" >"Let's Talk About Unspeakable Things"</a></h2>
<div class="drag-content"> <div class="drag-content">
This thesis is a series of three essays which relate to female and collective voices, and their mediation. They address the voice as a feminist tool for communication; studying how the female voice creates conditions for forms of listening and making space. Historically, some modes of address have been marginalized and shut out of the public domain. Collective voices are marginalized under the realm of patriarchal individualistic society. Even though voice is a medium for collective practice it is situated in a context that tends towards social binary structures and oppositions that restrict its possibilities. These binaries, which favor the 'civilized white male' subjectivities, have held influence on Western thinking since antiquity. Nevertheless, the nature of voice and its mediation overpass oppositions of gender, nationality, culture, space, technology and power relations. My research seeks to unravel these political capabilities of voices, in order to explore democratic ways of communication that embrace excluded forms of address. This thesis is a series of three essays which relate to female and collective voices, and their mediation. They address the voice as a feminist tool for communication; studying how the female voice creates conditions for forms of listening and making space. Historically, some modes of address have been marginalized and shut out of the public domain. Collective voices are marginalized under the realm of patriarchal individualistic society. Even though voice is a medium for collective practice it is situated in a context that tends towards social binary structures and oppositions that restrict its possibilities. These binaries, which favor the 'civilized white male' subjectivities, have held influence on Western thinking since antiquity. Nevertheless, the nature of voice and its mediation overpass oppositions of gender, nationality, culture, space, technology and power relations. My research seeks to unravel these political capabilities of voices, in order to explore democratic ways of communication that embrace excluded forms of address.
</div> </div>
</div> </div>
<div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top:35%;left:25%;"> <div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top:35%;left:25%;">
<h2 ><a href="amplification.html" target="_blank">Amplification of female voices</a></h2> <h2 ><a href="amplification.html" >Amplification of female voices</a></h2>
<div class="drag-content">Part of the project is a series of meetings/workshops I am organising together with Christina Karagianni. Our intentions come from personal experiences and we seek to explore the silencing of excluded voices, and go beyond their barriers. We combine our practices -her practice lies on choreography and dance and mine on social interaction, voice and sound- and try vocal exercises and reading in moments of Leeszaal, an open library that I consider a diverse public space. How can we engage politically with the exclusion of specific voices from the public sphere? Here I have documented our attempts. Here I document my attempts to create a safe common space of trying methods and discussing that topic in Leeszaal, an open library that I consider a diverse public space. I am borrowing methods from feminist groups and protest movements and vocal warming up exercises by Pauline Oliveros. For example, protesters would amplify the speaker's voice by repeating collectively their speech to make their presence visible. Feminists would create safe spaces where women could speak about domestic violence and make a dialogue based on listening. Some methods are vocal performances in situ, the "human microphone", speech acts, listening practices, making podcasts, mediating speech, transform our voices, situated experiments. <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">We invite <div class="tooltip-content-right" ><div>how we should approch the gender terminology and false association with voice when inviting people? Should it be about femme sounding? Female voice? </div></div></div>people from Leeszaal and our environment, who find themselves related and interested to this topic. Elements from the meetings: discuss previous material, reading extracts in random order, <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">discuss <div class="tooltip-content-right" ><div>what conflicts or frictions the technical aspect provokes? web-audio, recordings</div></div></div>personal associations and experiences with voice in public, warm up, say a sentence of personal experience in any language, transcribe only the vowels, read back the vowels, read outloud all together the score of vowels, repeat sentences with distorted voice, make podcasts. The produced material is being included in an audio archive, the player. </div> <div class="drag-content">Part of the project is a series of meetings/workshops I am organising together with Christina Karagianni. Our intentions come from personal experiences and we seek to explore the silencing of excluded voices, and go beyond their barriers. We combine our practices -her practice lies on choreography and dance and mine on social interaction, voice and sound- and try vocal exercises and reading in moments of Leeszaal, an open library that I consider a diverse public space. How can we engage politically with the exclusion of specific voices from the public sphere? Here I have documented our attempts. Here I document my attempts to create a safe common space of trying methods and discussing that topic in Leeszaal, an open library that I consider a diverse public space. I am borrowing methods from feminist groups and protest movements and vocal warming up exercises by Pauline Oliveros. For example, protesters would amplify the speaker's voice by repeating collectively their speech to make their presence visible. Feminists would create safe spaces where women could speak about domestic violence and make a dialogue based on listening. Some methods are vocal performances in situ, the "human microphone", speech acts, listening practices, making podcasts, mediating speech, transform our voices, situated experiments. <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">We invite <div class="tooltip-content-right" ><div>how we should approch the gender terminology and false association with voice when inviting people? Should it be about femme sounding? Female voice? </div></div></div>people from Leeszaal and our environment, who find themselves related and interested to this topic. Elements from the meetings: discuss previous material, reading extracts in random order, <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">discuss <div class="tooltip-content-right" ><div>what conflicts or frictions the technical aspect provokes? web-audio, recordings</div></div></div>personal associations and experiences with voice in public, warm up, say a sentence of personal experience in any language, transcribe only the vowels, read back the vowels, read outloud all together the score of vowels, repeat sentences with distorted voice, make podcasts. The produced material is being included in an audio archive, the player. </div>
</div> </div>
<div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top:75%;left:47%;width: 200px; font-size: 14px;"> <div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top:75%;left:47%;width: 200px; font-size: 14px;">
<h2 style="font-size: 20px;"><a href="player.html" target="_blank">Diary of West Rotterdam</a></h2> <h2 style="font-size: 20px;"><a href="player.html" >Diary of West Rotterdam</a></h2>
<div class="drag-content">I recorded sounds from the West Rotterdam, <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">while walking around the neighborhood of <div class="tooltip-content-down" ><img width="300px" src="images/soundwalk-photo1.jpg" /><br /><br /><img width="300px" src="images/soundwalk-photo3.jpg" /></div></div><a href="http://www.leeszaalrotterdamwest.nl/" target="_blank">Leeszaal</a> for several days. This action was part of my first experiments when I was in attempt to understand how gender binaries regarding voice are reflected in space, especially public space. <div class="drag-content">I recorded sounds from the West Rotterdam, <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">while walking around the neighborhood of <div class="tooltip-content-down" ><img width="300px" src="images/soundwalk-photo1.jpg" /><br /><br /><img width="300px" src="images/soundwalk-photo3.jpg" /></div></div><a href="http://www.leeszaalrotterdamwest.nl/" >Leeszaal</a> for several days. This action was part of my first experiments when I was in attempt to understand how gender binaries regarding voice are reflected in space, especially public space.
</div></div> </div></div>
<div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top:1%;left:36%;"> <div class="draggable scaleable-wrapper" id="scaleable-wrapper"style="top:1%;left:36%;">
<h2 ><a href="player.html" target="_blank">Player</a></h2> <h2 ><a href="player.html" >Player</a></h2>
<div class="drag-content">The player is an audio collection of voices and sounds from the meetings I have co-organised, references from my research, various internet sources, and soundwalks that I have done. It is a digital utterance that intends to be a reminder to the first forms of excluded female vocal expressions. I am using this material in my podcasts by mixing and overlayering them and creating a form of narrative with my own voice. </div> <div class="drag-content">The player is an audio collection of voices and sounds from the meetings I have co-organised, references from my research, various internet sources, and soundwalks that I have done. It is a digital utterance that intends to be a reminder to the first forms of excluded female vocal expressions. I am using this material in my podcasts by mixing and overlayering them and creating a form of narrative with my own voice. </div>
</div> </div>
<div class="draggable scaleable-wrapper" id="scaleable-wrapper" style="top:9%;left:6%;width: 800px; font-size: 28px" > <div class="draggable scaleable-wrapper" id="scaleable-wrapper" style="top:9%;left:6%;width: 800px; font-size: 28px" >
<h2 style="font-size: 36px"><a href="index.php" target="_blank">About</a></h2> <h2 style="font-size: 36px"><a href="index.php" >About</a></h2>
<div class="drag-content"> <div class="drag-content">
'Let's amplify unspeakable things' is an online platform that supports a space for exploration and research, regarding voice in public and its amplification, developed by Angeliki Diakrousi. It consists of a set of experiments that 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 <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">a set of podcasts <div class="tooltip-content-right" ><div>what conflicts or frictions the technical aspect provokes?</div></div></div>that revisit an archive of audio recordings produced in situated meetings and soundwalks. Every podcast exists on a way that creates repetetive layers of the same material. I perceive amplification as a way to create presence through repetition and multiplication. 'Let's amplify unspeakable things' is upsetting binaries such as male/female, expert/amateur, rational/irrational. It is about creating poetic (audio) narratives emerging from the contribution of people. 'Let's amplify unspeakable things' is an online platform that supports a space for exploration and research, regarding voice in public and its amplification, developed by Angeliki Diakrousi. It consists of a set of experiments that 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 <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">a set of podcasts <div class="tooltip-content-right" ><div>what conflicts or frictions the technical aspect provokes?</div></div></div>that revisit an archive of audio recordings produced in situated meetings and soundwalks. Every podcast exists on a way that creates repetetive layers of the same material. I perceive amplification as a way to create presence through repetition and multiplication. 'Let's amplify unspeakable things' is upsetting binaries such as male/female, expert/amateur, rational/irrational. It is about creating poetic (audio) narratives emerging from the contribution of people.
</div></div> </div></div>

@ -330,27 +330,27 @@ Oh, I hear children in the background crying</div>
<!-- draggable menu--> <!-- draggable menu-->
<div class="draggable scaleable-wrapper" id="scaleable-wrapper" style="top:70%;left: 5; width: 300px; font-size: 20px"> <div class="draggable scaleable-wrapper" id="scaleable-wrapper" style="top:70%;left: 5; width: 300px; font-size: 20px">
<h2 ><a href="player.html" target="_blank">Diary of West Rotterdam</a></h2> <h2 ><a href="player.html">Diary of West Rotterdam</a></h2>
</div> </div>
<div class="draggable scaleable-wrapper" id="scaleable-wrapper" style="top:700px; right: 5px;width: 250px; font-size: 16px"> <div class="draggable scaleable-wrapper" id="scaleable-wrapper" style="top:700px; right: 5px;width: 250px; font-size: 16px">
<h2><a href="amplification.html" target="_blank">Amplification of female voices</a></h2> <h2><a href="amplification.html">Amplification of female voices</a></h2>
</div> </div>
<div class="draggable scaleable-wrapper" id="scaleable-wrapper" style="top: 316.833px; left: 10;"> <div class="draggable scaleable-wrapper" id="scaleable-wrapper" style="top: 316.833px; left: 10;">
<h2 ><a href="player.html" target="_blank">Player</a></h2> <h2 ><a href="player.html">Player</a></h2>
<div class="drag-content">The player is an audio collection of voices and sounds from the meetings I have co-organised, references from my research, various internet sources, and soundwalks that I have done. It is a digital utterance that intends to be a reminder to the first forms of excluded female vocal expressions. I am using this material in my podcasts by mixing and overlayering them and creating a form of narrative with my own voice. </div> <div class="drag-content">The player is an audio collection of voices and sounds from the meetings I have co-organised, references from my research, various internet sources, and soundwalks that I have done. It is a digital utterance that intends to be a reminder to the first forms of excluded female vocal expressions. I am using this material in my podcasts by mixing and overlayering them and creating a form of narrative with my own voice. </div>
</div> </div>
<div class="draggable scaleable-wrapper" id="scaleable-wrapper" style="top: 200px; right: 0px;width: 150px; font-size: 16px"> <div class="draggable scaleable-wrapper" id="scaleable-wrapper" style="top: 200px; right: 0px;width: 150px; font-size: 16px">
<h2 ><a href="index.php" target="_blank">About</a></h2> <h2 ><a href="index.php">About</a></h2>
</div> </div>
<div class="draggable scaleable-wrapper" id="scaleable-wrapper" style="top: 100px; right: 5px; width: 150px; font-size: 16px"> <div class="draggable scaleable-wrapper" id="scaleable-wrapper" style="top: 100px; right: 5px; width: 150px; font-size: 16px">
<h2 ><a href="podcast1.php" target="_blank">Podcasts</a></h2> <h2 ><a href="podcast1.php">Podcasts</a></h2>
</div> </div>
<div class="draggable scaleable-wrapper" id="scaleable-wrapper" style="top: 400px; right: 0px; z-index: 9;width: 250px; font-size: 16px"> <div class="draggable scaleable-wrapper" id="scaleable-wrapper" style="top: 400px; right: 0px; z-index: 9;width: 250px; font-size: 16px">
<h2 ><a href="texts/thesis/thesis-angeliki.html" target="_blank">"Let' s Talk About Unspeakable Things"</a></h2> <h2 ><a href="thesis-angeliki.html">"Let' s Talk About Unspeakable Things"</a></h2>
</div> </div>

@ -16,38 +16,38 @@
<!-- draggable menu--> <!-- draggable menu-->
<div class="draggable" style="top: 740px; right: 300px;"> <div class="draggable" style="top: 740px; right: 300px;">
<h2><a href="amplification.html" target="_blank">Amplification of female voices</a></h2> <h2><a href="amplification.html">Amplification of female voices</a></h2>
</div> </div>
<div class="draggable" style="top: 948.6px; right: 30px;"> <div class="draggable" style="top: 948.6px; right: 30px;">
<h2 ><a href="" target="_blank">Diary of West Rotterdam</a></h2> <h2 ><a href="">Diary of West Rotterdam</a></h2>
</div> </div>
<div class="draggable" style="top: 848.533px; right: 5px;"> <div class="draggable" style="top: 848.533px; right: 5px;">
<h2 ><a href="player.html" target="_blank">Player</a></h2> <h2 ><a href="player.html">Player</a></h2>
</div> </div>
<div class="draggable" style="top: 540px; right: 1900px;"> <div class="draggable" style="top: 540px; right: 1900px;">
<h2 ><a href="index.php" target="_blank">About</a></h2> <h2 ><a href="index.php">About</a></h2>
</div> </div>
<div class="draggable" style="top: 4px; right: 1500px;z-index: 1;"> <div class="draggable" style="top: 270px; right: 1300px;z-index: 1;">
<h2 ><a href="podcast1.php" target="_blank">Podcast1</a></h2> <h2 ><a href="podcast1.php">Podcast1</a></h2>
<div class="drag-content">Podcast1 "Mediating Speech" is about the amplification of one's voice through another person.<br><i> It includes series of episodes of the online audio archive of the player, overlayered and commented by my voice as a narrator.</i> <div class="drag-content">Podcast1 "Mediating Speech" is about the amplification of one's voice through another person.<br><i> It includes series of episodes of the online audio archive of the player, overlayered and commented by my voice as a narrator.</i>
</div> </div>
</div> </div>
<div class="draggable" style="top: 220px; right: 10px;"> <div class="draggable" style="top: 220px; right: 10px;">
<h2 ><a href="podcast2.php" target="_blank">Podcast2</a></h2> <h2 ><a href="podcast2.php">Podcast2</a></h2>
</div> </div>
<div class="draggable" style="top: 320px; right: 100px;"> <div class="draggable" style="top: 320px; right: 100px;">
<h2 ><a href="podcast3.php" target="_blank">Podcast3</a></h2> <h2 ><a href="podcast3.php">Podcast3</a></h2>
</div> </div>
<div class="draggable" style="top: 420px; right: 80px;"> <div class="draggable" style="top: 420px; right: 80px;">
<h2 ><a href="podcast4.php" target="_blank">Podcast4</a></h2> <h2 ><a href="podcast4.php">Podcast4</a></h2>
</div> </div>
<div class="draggable" style="top: 640px; right: 2000px; z-index: 9;"> <div class="draggable" style="top: 640px; right: 2000px; z-index: 9;">
<h2 ><a href="texts/thesis/thesis-angeliki.html" target="_blank">"Let' s Talk About Unspeakable Things"</a></h2> <h2 ><a href="thesis-angeliki.html">"Let' s Talk About Unspeakable Things"</a></h2>
</div> </div>
<br><br><br><br><br><br> <br><br><br><br><br><br>
@ -109,7 +109,7 @@ echo '</p></div></td>'; } ?>
<br /> <br />
<?php <?php
$files = glob("uploads/*"); $files = glob("uploads/1/*");
for ($i=0; $i<count($files); $i++) for ($i=0; $i<count($files); $i++)
{$num = $files[$i]; {$num = $files[$i];
$var1 = $_GET["files"]["name"]; $var1 = $_GET["files"]["name"];
@ -218,7 +218,7 @@ echo '<audio src='.$num.' controls></audio><br /><br />'; }
$.ajax({ $.ajax({
type: "POST", type: "POST",
url: "scripts/uploadMp3.php", url: "scripts/uploadMp3_1.php",
data: { data: {
base64: dataURL base64: dataURL
} }

@ -2,54 +2,52 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script> <link href="styles/jquery-ui.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/mp3recorder.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="js/main.js"></script>
<link href="styles/stylesheet.css" rel="stylesheet" type="text/css"> <link href="styles/stylesheet.css" rel="stylesheet" type="text/css">
</head> </head>
<body> <body>
<div class="navbar">
<a href="podcast1.php">Podcast1 </a>
<a href="podcast2.php" class="active">Podcast2 </a>
<a href="podcast3.php">Podcast3 </a>
<a href="podcast4.php">Podcast4 </a>
</div>
<!-- draggable -->
<br><br> <br><br>
<h3 id="box-title" style="width: 200px; left: 45%; position: absolute;"> <h3 id="box-title" style="width: 200px; left: 45%; position: absolute;">
"Voice's Transition" "Voice's Transition"
</h3> </h3>
<!-- draggable menu--> <!-- draggable menu-->
<div class="draggable" style="top: 740px; right: 0px;"> <div class="draggable" style="top: 740px; right: 300px;">
<h2><a href="amplification.html" target="_blank">Amplification of female voices</a></h2> <h2><a href="amplification.html">Amplification of female voices</a></h2>
</div> </div>
<div class="draggable" style="top: 948.6px; right: 0px;"> <div class="draggable" style="top: 948.6px; right: 30px;">
<h2 ><a href="" target="_blank">Diary of West Rotterdam</a></h2> <h2 ><a href="">Diary of West Rotterdam</a></h2>
</div> </div>
<div class="draggable" style="top: 848.533px; right: 0px;"> <div class="draggable" style="top: 848.533px; right: 5px;">
<h2 ><a href="player.html" target="_blank">Player</a></h2> <h2 ><a href="player.html">Player</a></h2>
</div> </div>
<div class="draggable" style="top: 540px; right: 0px;"> <div class="draggable" style="top: 540px; right: 1900px;">
<h2 ><a href="index.php" target="_blank">About</a></h2> <h2 ><a href="index.php">About</a></h2>
</div> </div>
<div class="draggable" style="top: 51.9833px; right: 0px; width: 500px;"> <div class="draggable" style="top: 270px; right: 1300px;z-index: 1;">
<h2 ><a href="podcast1.php" target="_blank">Podcast1</a></h2> <h2 ><a href="podcast2.php">Podcast2</a></h2>
<div class="drag-content"> Podcast1 "Mediating Speech" is about the amplification of one's voice through another person.<br><i> It includes series of episodes of the online audio archive of the player, overlayered and commented by my voice as a narrator.</i> <div class="drag-content">Podcast2 "Voice's Transition" is about the transformation of one's voice into another voice in terms of pitch that responds to another gender.<br><i> It includes series of episodes of the online audio archive of the player, overlayered and commented by my voice as a narrator.</i>
</div> </div>
</div> </div>
<div class="draggable" style="top: 220px; right: 10px;">
<h2 ><a href="podcast1.php">Podcast1</a></h2>
</div>
<div class="draggable" style="top: 320px; right: 100px;">
<h2 ><a href="podcast3.php">Podcast3</a></h2>
</div>
<div class="draggable" style="top: 420px; right: 80px;">
<h2 ><a href="podcast4.php">Podcast4</a></h2>
</div>
<div class="draggable" style="top: 640px; right: 2000px; z-index: 9;">
<div class="draggable" style="top: 640px; right: 0px; z-index: 9;"> <h2 ><a href="thesis-angeliki.html">"Let' s Talk About Unspeakable Things"</a></h2>
<h2 ><a href="texts/thesis/thesis-angeliki.html" target="_blank">"Let' s Talk About Unspeakable Things"</a></h2>
</div> </div>
<br><br><br><br><br><br> <br><br><br><br><br><br>
@ -111,7 +109,7 @@ echo '</p></div></td>'; } ?>
<br /> <br />
<?php <?php
$files = glob("uploads/*.wav"); $files = glob("uploads/2/*");
for ($i=0; $i<count($files); $i++) for ($i=0; $i<count($files); $i++)
{$num = $files[$i]; {$num = $files[$i];
$var1 = $_GET["files"]["name"]; $var1 = $_GET["files"]["name"];
@ -135,38 +133,15 @@ echo '<audio src='.$num.' controls></audio><br /><br />'; }
<!-- <script src="scripts/app.js"></script> --> <!-- <script src="scripts/app.js"></script> -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/mp3recorder.js"></script>
<script src="js/draggable.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="js/main.js"></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>
<!-- scripts for recorder --> <!-- scripts for recorder -->
<script type="text/javascript"> <script type="text/javascript">
var audio_context; var audio_context;
@ -212,8 +187,8 @@ echo '<audio src='.$num.' controls></audio><br /><br />'; }
recorderObject = $recorder.data('recorderObject'); recorderObject = $recorder.data('recorderObject');
recorderObject.stop(); recorderObject.stop();
recorderObject.exportWAV(function(base64_wav_data) { recorderObject.exportMP3(function(base64_data) {
var url = 'data:audio/wav;base64,' + base64_wav_data; var url = 'data:audio/mp3;base64,' + base64_data;
var au = document.createElement('audio'); var au = document.createElement('audio');
document.getElementById("playerContainer").innerHTML = ""; document.getElementById("playerContainer").innerHTML = "";
@ -243,9 +218,9 @@ echo '<audio src='.$num.' controls></audio><br /><br />'; }
$.ajax({ $.ajax({
type: "POST", type: "POST",
url: "scripts/uploadWav.php", url: "scripts/uploadMp3_2.php",
data: { data: {
wavBase64: dataURL base64: dataURL
} }
}).done(function(o) { }).done(function(o) {
console.log('saved'); console.log('saved');
@ -254,7 +229,30 @@ echo '<audio src='.$num.' controls></audio><br /><br />'; }
} }
</script> </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>

@ -2,51 +2,52 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script> <link href="styles/jquery-ui.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/mp3recorder.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="js/main.js"></script>
<link href="styles/stylesheet.css" rel="stylesheet" type="text/css"> <link href="styles/stylesheet.css" rel="stylesheet" type="text/css">
</head> </head>
<body> <body>
<div class="navbar">
<a href="podcast1.php">Podcast1 </a>
<a href="podcast2.php">Podcast2 </a>
<a href="podcast3.php" class="active">Podcast3 </a>
<a href="podcast4.php">Podcast4 </a>
</div>
<!-- draggable -->
<br><br> <br><br>
<h3 id="box-title" style="width: 220px; left: 45%; position: absolute;"> <h3 id="box-title" style="width: 220px; left: 45%; position: absolute;">
"Blocking our Voices" "Blocking our Voices"
</h3> </h3>
<!-- draggable menu--> <!-- draggable menu-->
<div class="draggable" style="top: 740px; right: 0px;"> <div class="draggable" style="top: 740px; right: 300px;">
<h2><a href="amplification.html" target="_blank">Amplification of female voices</a></h2> <h2><a href="amplification.html">Amplification of female voices</a></h2>
</div> </div>
<div class="draggable" style="top: 948.6px; right: 0px;"> <div class="draggable" style="top: 948.6px; right: 30px;">
<h2 ><a href="" target="_blank">Diary of West Rotterdam</a></h2> <h2 ><a href="">Diary of West Rotterdam</a></h2>
</div>
<div class="draggable" style="top: 848.533px; right: 5px;">
<h2 ><a href="player.html">Player</a></h2>
</div>
<div class="draggable" style="top: 540px; right: 1900px;">
<h2 ><a href="index.php">About</a></h2>
</div> </div>
<div class="draggable" style="top: 848.533px; right: 0px;">
<h2 ><a href="player.html" target="_blank">Player</a></h2> <div class="draggable" style="top: 270px; right: 1300px;z-index: 1;">
<h2 ><a href="podcast3.php">Podcast3</a></h2>
<div class="drag-content">Podcast3 "Blocking our Voices" is about the ways we learn tpo self-control and sencor our speech.<br><i> It includes series of episodes of the online audio archive of the player, overlayered and commented by my voice as a narrator.</i>
</div> </div>
<div class="draggable" style="top: 540px; right: 0px;">
<h2 ><a href="index.php" target="_blank">About</a></h2>
</div> </div>
<div class="draggable" style="top: 51.9833px; right: 0px; width: 500px;"> <div class="draggable" style="top: 220px; right: 10px;">
<h2 ><a href="podcast1.php" target="_blank">Podcasts</a></h2> <h2 ><a href="podcast1.php">Podcast1</a></h2>
<div class="drag-content"> These podcasts are separated in different topics. They include series of episodes of the online audio archive of the player, overlayered and commented by my voice as a narrator. </div>
<div class="draggable" style="top: 320px; right: 100px;">
<h2 ><a href="podcast2.php">Podcast2</a></h2>
</div> </div>
<div class="draggable" style="top: 420px; right: 80px;">
<h2 ><a href="podcast4.php">Podcast4</a></h2>
</div> </div>
<div class="draggable" style="top: 640px; right: 0px; z-index: 9;">
<h2 ><a href="texts/thesis/thesis-angeliki.html" target="_blank">"Let' s Talk About Unspeakable Things"</a></h2> <div class="draggable" style="top: 640px; right: 2000px; z-index: 9;">
<h2 ><a href="thesis-angeliki.html">"Let' s Talk About Unspeakable Things"</a></h2>
</div> </div>
<br><br><br><br><br><br> <br><br><br><br><br><br>
@ -108,7 +109,7 @@ echo '</p></div></td>'; } ?>
<br /> <br />
<?php <?php
$files = glob("uploads/*.wav"); $files = glob("uploads/3/*");
for ($i=0; $i<count($files); $i++) for ($i=0; $i<count($files); $i++)
{$num = $files[$i]; {$num = $files[$i];
$var1 = $_GET["files"]["name"]; $var1 = $_GET["files"]["name"];
@ -132,38 +133,15 @@ echo '<audio src='.$num.' controls></audio><br /><br />'; }
<!-- <script src="scripts/app.js"></script> --> <!-- <script src="scripts/app.js"></script> -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/mp3recorder.js"></script>
<script src="js/draggable.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="js/main.js"></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>
<!-- scripts for recorder --> <!-- scripts for recorder -->
<script type="text/javascript"> <script type="text/javascript">
var audio_context; var audio_context;
@ -209,8 +187,8 @@ echo '<audio src='.$num.' controls></audio><br /><br />'; }
recorderObject = $recorder.data('recorderObject'); recorderObject = $recorder.data('recorderObject');
recorderObject.stop(); recorderObject.stop();
recorderObject.exportWAV(function(base64_wav_data) { recorderObject.exportMP3(function(base64_data) {
var url = 'data:audio/wav;base64,' + base64_wav_data; var url = 'data:audio/mp3;base64,' + base64_data;
var au = document.createElement('audio'); var au = document.createElement('audio');
document.getElementById("playerContainer").innerHTML = ""; document.getElementById("playerContainer").innerHTML = "";
@ -240,9 +218,9 @@ echo '<audio src='.$num.' controls></audio><br /><br />'; }
$.ajax({ $.ajax({
type: "POST", type: "POST",
url: "scripts/uploadWav.php", url: "scripts/uploadMp3_3.php",
data: { data: {
wavBase64: dataURL base64: dataURL
} }
}).done(function(o) { }).done(function(o) {
console.log('saved'); console.log('saved');
@ -251,7 +229,30 @@ echo '<audio src='.$num.' controls></audio><br /><br />'; }
} }
</script> </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>

@ -1,52 +1,55 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script> <link href="styles/jquery-ui.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/mp3recorder.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="js/main.js"></script>
<link href="styles/stylesheet.css" rel="stylesheet" type="text/css"> <link href="styles/stylesheet.css" rel="stylesheet" type="text/css">
</head> </head>
<body> <body>
<div class="navbar">
<a href="podcast1.php">Podcast1 </a>
<a href="podcast2.php">Podcast2 </a>
<a href="podcast3.php">Podcast3 </a>
<a href="podcast4.php" class="active">Podcast4 </a>
</div>
<!-- draggable -->
<br><br> <br><br>
<h3 id="box-title" style="width: 360px; left: 42%; position: absolute;"> <h3 id="box-title" style="width: 370px; left: 45%; position: absolute;">
"City Sounds Reveal Voice Binaries" "City Sounds Reveal Voice Binaries"
</h3> </h3>
<!-- draggable menu--> <!-- draggable menu-->
<div class="draggable" style="top: 740px; right: 0px;"> <div class="draggable" style="top: 740px; right: 300px;">
<h2><a href="amplification.html" target="_blank">Amplification of female voices</a></h2> <h2><a href="amplification.html">Amplification of female voices</a></h2>
</div> </div>
<div class="draggable" style="top: 948.6px; right: 0px;"> <div class="draggable" style="top: 948.6px; right: 30px;">
<h2 ><a href="" target="_blank">Diary of West Rotterdam</a></h2> <h2 ><a href="">Diary of West Rotterdam</a></h2>
</div> </div>
<div class="draggable" style="top: 848.533px; right: 0px;"> <div class="draggable" style="top: 848.533px; right: 5px;">
<h2 ><a href="player.html" target="_blank">Player</a></h2> <h2 ><a href="player.html">Player</a></h2>
</div> </div>
<div class="draggable" style="top: 540px; right: 0px;"> <div class="draggable" style="top: 540px; right: 1900px;">
<h2 ><a href="index.php" target="_blank">About</a></h2> <h2 ><a href="index.php">About</a></h2>
</div> </div>
<div class="draggable" style="top: 51.9833px; right: 0px; width: 500px;"> <div class="draggable" style="top: 270px; right: 1300px;z-index: 1;">
<h2 ><a href="podcast1.php" target="_blank">Podcasts</a></h2> <h2 ><a href="podcast4.php">Podcast4</a></h2>
<div class="drag-content"> These podcasts are separated in different topics. They include series of episodes of the online audio archive of the player, overlayered and commented by my voice as a narrator. <div class="drag-content">Podcast4 "City Sounds Reveal Voice Binaries" is about recorded sounds from the city of Rotterdam as an attempt to approach how public spaces reveal binaries and speech exclusion.<br><i> It includes series of episodes of the online audio archive of the player, overlayered and commented by my voice as a narrator.</i>
</div> </div>
</div> </div>
<div class="draggable" style="top: 640px; right: 0px; z-index: 9;"> <div class="draggable" style="top: 220px; right: 10px;">
<h2 ><a href="texts/thesis/thesis-angeliki.html" target="_blank">"Let' s Talk About Unspeakable Things"</a></h2> <h2 ><a href="podcast1.php">Podcast1</a></h2>
</div>
<div class="draggable" style="top: 320px; right: 100px;">
<h2 ><a href="podcast2.php">Podcast2</a></h2>
</div>
<div class="draggable" style="top: 420px; right: 80px;">
<h2 ><a href="podcast3.php">Podcast3</a></h2>
</div>
<div class="draggable" style="top: 640px; right: 2000px; z-index: 9;">
<h2 ><a href="thesis-angeliki.html">"Let' s Talk About Unspeakable Things"</a></h2>
</div> </div>
<br><br><br><br><br><br> <br><br><br><br><br><br>
@ -108,7 +111,7 @@ echo '</p></div></td>'; } ?>
<br /> <br />
<?php <?php
$files = glob("uploads/*.wav"); $files = glob("uploads/4/*");
for ($i=0; $i<count($files); $i++) for ($i=0; $i<count($files); $i++)
{$num = $files[$i]; {$num = $files[$i];
$var1 = $_GET["files"]["name"]; $var1 = $_GET["files"]["name"];
@ -132,38 +135,15 @@ echo '<audio src='.$num.' controls></audio><br /><br />'; }
<!-- <script src="scripts/app.js"></script> --> <!-- <script src="scripts/app.js"></script> -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/mp3recorder.js"></script>
<script src="js/draggable.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="js/main.js"></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>
<!-- scripts for recorder --> <!-- scripts for recorder -->
<script type="text/javascript"> <script type="text/javascript">
var audio_context; var audio_context;
@ -209,8 +189,8 @@ echo '<audio src='.$num.' controls></audio><br /><br />'; }
recorderObject = $recorder.data('recorderObject'); recorderObject = $recorder.data('recorderObject');
recorderObject.stop(); recorderObject.stop();
recorderObject.exportWAV(function(base64_wav_data) { recorderObject.exportMP3(function(base64_data) {
var url = 'data:audio/wav;base64,' + base64_wav_data; var url = 'data:audio/mp3;base64,' + base64_data;
var au = document.createElement('audio'); var au = document.createElement('audio');
document.getElementById("playerContainer").innerHTML = ""; document.getElementById("playerContainer").innerHTML = "";
@ -240,9 +220,9 @@ echo '<audio src='.$num.' controls></audio><br /><br />'; }
$.ajax({ $.ajax({
type: "POST", type: "POST",
url: "scripts/uploadWav.php", url: "scripts/uploadMp3_4.php",
data: { data: {
wavBase64: dataURL base64: dataURL
} }
}).done(function(o) { }).done(function(o) {
console.log('saved'); console.log('saved');
@ -251,7 +231,30 @@ echo '<audio src='.$num.' controls></audio><br /><br />'; }
} }
</script> </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>

@ -2,7 +2,7 @@
error_reporting(-1); error_reporting(-1);
ini_set("display_errors", "On"); ini_set("display_errors", "On");
// requires php5 // requires php5
define('UPLOAD_DIR', '../uploads'); define('UPLOAD_DIR', '../uploads/1/');
$img = $_POST['base64']; $img = $_POST['base64'];
$img = str_replace('data:audio/mp3;base64,', '', $img); $img = str_replace('data:audio/mp3;base64,', '', $img);
$img = str_replace(' ', '+', $img); $img = str_replace(' ', '+', $img);

@ -0,0 +1,13 @@
<?php
error_reporting(-1);
ini_set("display_errors", "On");
// requires php5
define('UPLOAD_DIR', '../uploads/2/');
$img = $_POST['base64'];
$img = str_replace('data:audio/mp3;base64,', '', $img);
$img = str_replace(' ', '+', $img);
$data = base64_decode($img);
$file = UPLOAD_DIR . uniqid() . '.mp3';
$success = file_put_contents($file, $data);
print $success ? $file : 'Unable to save the file.';
?>

@ -0,0 +1,13 @@
<?php
error_reporting(-1);
ini_set("display_errors", "On");
// requires php5
define('UPLOAD_DIR', '../uploads/3/');
$img = $_POST['base64'];
$img = str_replace('data:audio/mp3;base64,', '', $img);
$img = str_replace(' ', '+', $img);
$data = base64_decode($img);
$file = UPLOAD_DIR . uniqid() . '.mp3';
$success = file_put_contents($file, $data);
print $success ? $file : 'Unable to save the file.';
?>

@ -0,0 +1,13 @@
<?php
error_reporting(-1);
ini_set("display_errors", "On");
// requires php5
define('UPLOAD_DIR', '../uploads/4/');
$img = $_POST['base64'];
$img = str_replace('data:audio/mp3;base64,', '', $img);
$img = str_replace(' ', '+', $img);
$data = base64_decode($img);
$file = UPLOAD_DIR . uniqid() . '.mp3';
$success = file_put_contents($file, $data);
print $success ? $file : 'Unable to save the file.';
?>

@ -516,6 +516,7 @@ input[type=checkbox]:checked ~ aside {
width: 400px; width: 400px;
display: inline; display: inline;
/* transform: scale(20);*/ /* transform: scale(20);*/
/*min-height: 100px;*/
} }
#img { #img {
@ -534,6 +535,7 @@ input[type=checkbox]:checked ~ aside {
resize: both; resize: both;
position: relative; position: relative;
/*height: 400px;*/ /*height: 400px;*/
/*min-height: 100px; */
} }
.ui-resizable-se { .ui-resizable-se {

@ -1,9 +1,10 @@
<html> <html>
<link href="../../styles/stylesheet.css" rel="stylesheet" type="text/css"> <link href="styles/stylesheet.css" rel="stylesheet" type="text/css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="../../js/main.js"></script> <script src="js/draggable.js"></script>
<script src="js/main.js"></script>
<style> <style>
h1,h2 { h1,h2 {
text-align: center !important; text-align: center !important;
@ -45,73 +46,89 @@
</div> </div>
<!-- draggable menu--> <!-- draggable menu-->
<div class="draggable" style="top: 200px; right: 15px;"> <div class="draggable" style="top: 740px; right: 300px;">
<h2><a href="../../amplification.html" target="_blank">Amplification of female voices</a></h2> <h2><a href="amplification.html">Amplification of female voices</a></h2>
</div> </div>
<div class="draggable" style="top: 600px; right: 25px;"> <div class="draggable" style="top: 948.6px; right: 30px;">
<h2 ><a href="" target="_blank">Diary of West Rotterdam</a></h2> <h2 ><a href="">Diary of West Rotterdam</a></h2>
</div> </div>
<div class="draggable" style="top: 300px; right: 5px;"> <div class="draggable" style="top: 848.533px; right: 5px;">
<h2 ><a href="../../player.html" target="_blank">Player</a></h2> <h2 ><a href="player.html">Player</a></h2>
</div> </div>
<div class="draggable" style="top: 800px; right: 400px;"> <div class="draggable" style="top: 540px; right: 1900px;">
<h2 ><a href="../../podcast1.php" target="_blank">About</a></h2> <h2 ><a href="index.php">About</a></h2>
</div> </div>
<div class="draggable" style="top: 20px; right: 250px;"> <div class="draggable" style="top: 270px; right: 1300px;z-index: 1;">
<h2 ><a href="../../podcast1.php" target="_blank">Podcasts</a></h2> <h2 ><a href="podcast4.php">Podcast4</a></h2>
</div> </div>
<!-- end draggable --> <div class="draggable" style="top: 220px; right: 10px;">
<h2 ><a href="podcast1.php">Podcast1</a></h2>
</div>
<div class="draggable" style="top: 320px; right: 100px;">
<h2 ><a href="podcast2.php">Podcast2</a></h2>
</div>
<div class="draggable" style="top: 420px; right: 80px;">
<h2 ><a href="podcast3.php">Podcast3</a></h2>
</div>
<div class="draggable" style="top: 640px; right: 2000px; z-index: 9;">
<h2 ><a href="thesis-angeliki.html">"Let' s Talk About Unspeakable Things"</a></h2>
<div class="drag-content">
This thesis is a series of three essays which relate to female and collective voices, and their mediation. They address the voice as a feminist tool for communication; studying how the female voice creates conditions for forms of listening and making space. Historically, some modes of address have been marginalized and shut out of the public domain. Collective voices are marginalized under the realm of patriarchal individualistic society. Even though voice is a medium for collective practice it is situated in a context that tends towards social binary structures and oppositions that restrict its possibilities. These binaries, which favor the 'civilized white male' subjectivities, have held influence on Western thinking since antiquity. Nevertheless, the nature of voice and its mediation overpass oppositions of gender, nationality, culture, space, technology and power relations. My research seeks to unravel these political capabilities of voices, in order to explore democratic ways of communication that embrace excluded forms of address.
</div>
</div>
<!-- draggable images --> <!-- draggable images -->
<div class="draggable" style="top: 1713px;left: 147px;"><div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="../../images/carson-list.jpg"><img src="../../images/carson-list.jpg" width="800px"></a><div class="tooltip-content-right"><div>Figure 1: Describing how female voices sound like <div class="draggable" style="top: 1713px;left: 147px;"><div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="images/carson-list.jpg"><img src="images/carson-list.jpg" width="800px"></a><div class="tooltip-content-right"><div>Figure 1: Describing how female voices sound like
</div></div></div></div> </div></div></div></div>
<div class="draggable" style="top: 2000px;left: 1247px;"> <div class="draggable" style="top: 2000px;left: 1247px;">
<div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="../../images/katalin.jpg"><img src="../../images/katalin.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 2: Vocal performance of Katalin Ladik <div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="images/katalin.jpg"><img src="images/katalin.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 2: Vocal performance of Katalin Ladik
</div></div></div></div> </div></div></div></div>
<div class="draggable" style="top: 2468px; left: -6px;"> <div class="draggable" style="top: 2468px; left: -6px;">
<div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="../../images/miss-triggs.jpg"><img src="../../images/miss-triggs.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 3: Cartoon from Riana Dunkan <div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="images/miss-triggs.jpg"><img src="images/miss-triggs.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 3: Cartoon from Riana Dunkan
</div></div></div></div> </div></div></div></div>
<div class="draggable" style="top: 2980px; left: -33px;"> <div class="draggable" style="top: 2980px; left: -33px;">
<div class="tooltip-wrap" style="text-decoration:underline;"> <a target="_blank" href="../../images/gonzalo.jpg"><img src="../../images/gonzalo.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 4: Cartoon from Gonzalo Rocha <div class="tooltip-wrap" style="text-decoration:underline;"> <a target="_blank" href="images/gonzalo.jpg"><img src="images/gonzalo.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 4: Cartoon from Gonzalo Rocha
</div></div></div></div> </div></div></div></div>
<div class="draggable" style="top: 3150px;left: 1482px;"> <div class="draggable" style="top: 3150px;left: 1482px;">
<div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="../../images/laurie.jpg"><img src="../../images/laurie.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 5: Performance from Laurie Anderson <div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="images/laurie.jpg"><img src="images/laurie.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 5: Performance from Laurie Anderson
</div></div></div></div> </div></div></div></div>
<div class="draggable" style="top: 4836px; left: 32px;"> <div class="draggable" style="top: 4836px; left: 32px;">
<div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="../../images/occupy-davis-butler.jpg"><img src="../../images/occupy-davis-butler.jpg" width="1000px"></a><div class="tooltip-content-right"><div>Figure 6: Speeches of Angela Davis and Judith Butler in Occupy Wall Street <div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="images/occupy-davis-butler.jpg"><img src="images/occupy-davis-butler.jpg" width="1000px"></a><div class="tooltip-content-right"><div>Figure 6: Speeches of Angela Davis and Judith Butler in Occupy Wall Street
</div></div></div></div> </div></div></div></div>
<div class="draggable" style="top: 5463px; left: 1513px;"> <div class="draggable" style="top: 5463px; left: 1513px;">
<div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="../../images/mikrofoniki.jpg"><img src="../../images/mikrofoniki.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 7: 'Mikrophoniki' demonstration in Athens <div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="images/mikrofoniki.jpg"><img src="images/mikrofoniki.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 7: 'Mikrophoniki' demonstration in Athens
</div></div></div></div> </div></div></div></div>
<div class="draggable" style="top: 5721px; left: 40px;"> <div class="draggable" style="top: 5721px; left: 40px;">
<div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="../../images/feminists.JPG"><img src="../../images/feminists.JPG" width="500px"></a><div class="tooltip-content-right"><div>Figure 8: Speech Matters: Violence and the Feminist Voice <div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="images/feminists.JPG"><img src="images/feminists.JPG" width="500px"></a><div class="tooltip-content-right"><div>Figure 8: Speech Matters: Violence and the Feminist Voice
</div></div></div></div> </div></div></div></div>
<div class="draggable" style="top: 6805px; left: 1407px;"> <div class="draggable" style="top: 6805px; left: 1407px;">
<div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="../../images/broadcastcart.jpg"><img src="../../images/broadcastcart.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 9: 'The Broadcast Cart' of Miranda Zúñiga transmitting <div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="images/broadcastcart.jpg"><img src="images/broadcastcart.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 9: 'The Broadcast Cart' of Miranda Zúñiga transmitting
</div></div></div></div> </div></div></div></div>
<div class="draggable" style="top: 8343px;left: -22px;"> <div class="draggable" style="top: 8343px;left: -22px;">
<div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="../../images/twomouths.jpg"><img src="../../images/twomouths.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 10: A sculpture of Baubo, goddess of sacred and sexual humor <div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="images/twomouths.jpg"><img src="images/twomouths.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 10: A sculpture of Baubo, goddess of sacred and sexual humor
</div></div></div></div> </div></div></div></div>
<div class="draggable" style="top: 8565px; left: 1442px;"> <div class="draggable" style="top: 8565px; left: 1442px;">
<div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="../../images/liveoccupy.jpg"><img src="../../images/liveoccupy.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 11: Live streaming from Occupy Wall Street <div class="tooltip-wrap" style="text-decoration:underline;"><a target="_blank" href="images/liveoccupy.jpg"><img src="images/liveoccupy.jpg" width="500px"></a><div class="tooltip-content-right"><div>Figure 11: Live streaming from Occupy Wall Street
</div></div></div></div> </div></div></div></div>
<!-- end of draggable images --> <!-- end of draggable images -->
Loading…
Cancel
Save