added information

master
Angeliki 6 years ago
parent e552613abf
commit 10307c3a42

@ -3,7 +3,8 @@
<html>
<head>
<link href="styles/stylesheet.css" rel="stylesheet" type="text/css">
<link href="styles/widescreen.css" rel="stylesheet" type="text/css">
<!-- <link href="styles/smallscreen.css" rel="stylesheet" type="text/css"> -->
<link href="styles/jquery-ui.css" rel="stylesheet" type="text/css">
<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>
@ -22,35 +23,32 @@ Filter by:
<!-- draggable archive -->
<!-- div vowels -->
<div id="resize" class="draggable ui-draggable-handle group_vowels pile1"><a href="images/vowels-leeszaal-test.jpg"><img src="images/vowels-leeszaal-test.jpg" width="400px"></img></a></div>
<div id="resize" class="draggable ui-draggable-handle group_vowels pile1"><a href="images/vowels-20190328-leeszaal.jpg"><img src="images/vowels-20190328-leeszaal.jpg" width="400px"></img></a></div>
<div id="resize" class="draggable ui-draggable-handle group_vowels pile1"><a href="images/vowels-20190328-leeszaal.jpg"><img src="images/vowels-20190328-leeszaal.jpg" width="100%"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile2"><a href="images/vowels-20190329-finearts.jpg" target="_blank"><img src="images/vowels-20190329-finearts.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile2"><a href="images/vowels-20190329-finearts.jpg" target="_blank"><img src="images/vowels-20190329-finearts.jpg" width="100%"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-1.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-1.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-1.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-1.jpg" width="100%"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-2.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-2.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-2.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-2.jpg" width="100%"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-3.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-3.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-3.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-3.jpg" width="100%"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-4.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-4.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-4.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-4.jpg" width="100%"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-5.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-5.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-5.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-5.jpg" width="100%"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile4"><a href="images/vowels-20190523-leeszaal-1.jpg" target="_blank"><img src="images/vowels-20190523-leeszaal-1.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile4"><a href="images/vowels-20190523-leeszaal-1.jpg" target="_blank"><img src="images/vowels-20190523-leeszaal-1.jpg" width="100%"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile4"><a href="images/vowels-20190523-leeszaal-2.jpg" target="_blank"><img src="images/vowels-20190523-leeszaal-2.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile4"><a href="images/vowels-20190523-leeszaal-2.jpg" target="_blank"><img src="images/vowels-20190523-leeszaal-2.jpg" width="100%"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile5"><a href="images/vowels-20190530-leeszaal.jpg" target="_blank"><img src="images/vowels-20190530-leeszaal.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_vowels pile5"><a href="images/vowels-20190530-leeszaal.jpg" target="_blank"><img src="images/vowels-20190530-leeszaal.jpg" width="100%"></img></a></div>
@ -70,6 +68,8 @@ Filter by:
<div class="draggable ui-draggable-handle group_extracts pile0"><a href="images/volkskrant-03.jpg" target="_blank"><img src="images/volkskrant-03.jpg" width="600px" /></a></div>
<div class="draggable ui-draggable-handle group_extracts pile0"><a href="images/extracts-leeszaal-20190606.jpg" target="_blank"><img src="images/extracts-leeszaal-20190606.jpg" width="600px" /></a></div>
@ -77,102 +77,223 @@ Filter by:
<!-- div images -->
<div id="img" class="draggable ui-draggable-handle group_photos pile3"><img src="images/meeting-20190508_leeszaal.jpg" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile3"><img src="images/meeting-20190508_leeszaal.jpg" width="100%"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile1"><img src="images/meeting-20190328-leeszaal-5.JPG" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile1"><img src="images/meeting-20190328-leeszaal-5.JPG" width="100%"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile2" ><img src="images/meeting-20190329-finearts-2.JPG" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile2" ><img src="images/meeting-20190329-finearts-2.JPG" width="100%"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile2"><img src="images/meeting-20190329-finearts-1.JPG" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile2"><img src="images/meeting-20190329-finearts-1.JPG" width="100%"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile1"><img src="images/meeting-20190328-leeszaal-3.JPG.jpg" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile1"><img src="images/meeting-20190328-leeszaal-3.JPG.jpg" width="100%"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile1"><img src="images/meeting-20190328-leeszaal-1.JPG" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile1"><img src="images/meeting-20190328-leeszaal-1.JPG" width="100%"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile1"><img src="images/meeting-20190328-leeszaal-2.JPG" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile1"><img src="images/meeting-20190328-leeszaal-2.JPG" width="100%"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile2"><img class="draggable" style="width: 200px !important" src="http://pzwiki.wdka.nl/mw-mediadesign/images/6/69/Poster_unpacking.png"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-1.jpg" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-1.jpg" width="100%"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-2.jpg" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-2.jpg" width="100%"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-3.jpg" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-3.jpg" width="100%"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile4" ><a href="images/meeting-20190530-leeszaal-1.jpg" target="_blank"><img src="images/meeting-20190530-leeszaal-1.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile4" ><a href="images/meeting-20190530-leeszaal-1.jpg" target="_blank"><img src="images/meeting-20190530-leeszaal-1.jpg" width="100%"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-4.jpg" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-4.jpg" width="100%"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-5.jpg" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-5.jpg" width="100%"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile5"><a href="images/meeting-20190530-leeszaal-2.jpg" target="_blank"><img src="images/meeting-20190530-leeszaal-2.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile5"><a href="images/meeting-20190530-leeszaal-2.jpg" target="_blank"><img src="images/meeting-20190530-leeszaal-2.jpg" width="100%"></img></a></div>
<!-- metadata for each workshop -->
<div class="draggable scaleable-wrapper box_metadata group_metadata pile1">
<h2>Workshop 1</h2>
<li>Actions:<li>
<li>Actions:</li>
<ul>
<li>Reading extracts</li>
<li>Reading <span class="tooltip-wrap">extracts <span class="tooltip-content-right">
1. Ballout, D. (2019) Good Morning, Kafranbel, This American Life: Wartime Radio.<br />
2. Carson, A. (1996) The Gender of Sound, in Glass, Irony and God. First Edition edition. New York: New Directions, pp. 119142.</span></span>in random order
</li>
<li>Discussion on public voice</li>
<li>Transcribing vowels</li>
<li>Transcribing the vowels of each other's sentences</li>
<li>Reading back the vowels</li>
<li>Reading outloud all together the score of vowels</li>
</ul>
<li>Equipment: </li>
<ul>
<li>Printed extracts</li>
<li>Audio recorder</li>
<li>Paper + pens</li>
</ul>
<li>Outcome: Score of vowels<li>
<li>Date: 28/3/2019<li>
<li>Location: Leeszaal<li>
<li>Outcome:</li>
<ul>
<li>Audio recordings of the actions</li>
<li>Handwritten score of vowels</li>
</ul>
<li>Date: 28/3/2019</li>
<li>Location: Leeszaal, Rotterdam</li>
</div>
<div class="draggable scaleable-wrapper box_metadata group_metadata pile2"><h2>Workshop 2</h2>
<li>Actions:<li>
<li>Actions:</li>
<ul>
<li>Reading extracts</li>
<li>Reading <span class="tooltip-wrap">extracts <span class="tooltip-content-right">
1. Ballout, D. (2019) Good Morning, Kafranbel, This American Life: Wartime Radio.<br />
2. Carson, A. (1996) The Gender of Sound, in Glass, Irony and God. First Edition edition. New York: New Directions, pp. 119142.</span></span>in random order
</li>
<li>Discussion on public voice</li>
<li>Transcribing vowels</li>
<li>Transcribing the vowels of each other's sentences</li>
<li>Reading back the vowels</li>
<li>Reading outloud all together the score of vowels</li>
<li>Reading outloud all together the score of vowels in high-pitch</li>
</ul>
<li>Equipment: </li>
<ul>
<li>Printed extracts</li>
<li>Audio recorder</li>
<li>Paper + pens</li>
</ul>
<li>Outcome:</li>
<ul>
<li>Audio recordings of the actions</li>
<li>Handwritten score of vowels</li>
</ul>
<li>Outcome: Score of vowels<li>
<li>Date: 29/3/2019<li>
<li>Location: Fine Arts<li>
<li>Date: 29/3/2019</li>
<li>Location: Fine Arts/KDH, Rotterdam</li>
</div>
<div class="draggable scaleable-wrapper box_metadata group_metadata pile3"><h2>Workshop 3</h2>
<li>Actions:<li>
<li>Actions:</li>
<ul>
<li>Reading extracts</li>
<li>Reading <span class="tooltip-wrap">extracts <span class="tooltip-content-right">
1. Ballout, D. (2019) Good Morning, Kafranbel, This American Life: Wartime Radio.<br />
2. Carson, A. (1996) The Gender of Sound, in Glass, Irony and God. First Edition edition. New York: New Directions, pp. 119142.</span></span>in random order
</li>
<li>Discussion on public voice</li>
<li>Transcribing vowels</li>
<li>Transcribing the vowels of each other's sentences</li>
<li>Reading outloud all together back the vowels for each person</li>
</ul>
<li>Equipment: </li>
<ul>
<li>Printed extracts</li>
<li>Audio recorder</li>
<li>Paper + pens</li>
</ul>
<li>Outcome:</li>
<ul>
<li>Audio recordings of the actions</li>
<li>Handwritten scores of vowels</li>
</ul>
<li>Outcome: Score of vowels<li>
<li>Date: 08/5/2019<li>
<li>Location: Leeszaal<li>
<li>Date: 8/5/2019</li>
<li>Location: Leeszaal, Rotterdam</li>
</div>
<div class="draggable scaleable-wrapper box_metadata group_metadata pile4"><h2>Workshop 4</h2>
<li>Actions:<li>
<li>Actions:</li>
<ul>
<li>Reading extracts</li>
<li>Reading <span class="tooltip-wrap">extracts <span class="tooltip-content-right">
1. Ballout, D. (2019) Good Morning, Kafranbel, This American Life: Wartime Radio.<br />
2. Carson, A. (1996) The Gender of Sound, in Glass, Irony and God. First Edition edition. New York: New Directions, pp. 119142.</span></span>in random order
</li>
<li>Discussion on public voice</li>
<li>Transcribing vowels</li>
<li>Transcribing the vowels of each other's sentences</li>
<li>Reading back the vowels</li>
<li>Reading outloud all together the score of vowels</li>
<li>Speaking about personal experiences</li>
<li>Listen back our <span class="tooltip-wrap">distorted voices<span class="tooltip-content-right">The voices were electronically distorted from female to male (high-pitch to low-pitch) with a bash script<br />
<pre>
#!/bin/bash
today=$(date +%Y%m%d-%H%M);
output=${1:-distort}
arecord -Dpulse -f cd normal_$today.wav
rubberband -t 1.5 -p -5.5 normal_$today.wav ${output}_$today.wav
mkdir -p "normal"
mv -v normal_$today.wav normal/normal_$today.wav;
</pre>
</span></span>
</li>
</ul>
<li>Outcome: Score of vowels<li>
<li>Date: 23/5/2019<li>
<li>Location: Leeszaal<li>
<li>Equipment: </li>
<ul>
<li>Printed extracts</li>
<li>Audio recorder</li>
<li>Paper + pens</li>
<li>Microphone</li>
<li>Small speaker</li>
</ul>
<li>Outcome:</li>
<ul>
<li>Audio recordings of the actions</li>
<li>Videp recordings of the actions</li>
<li>Handwritten score of vowels</li>
</ul>
<li>Date: 23/5/2019</li>
<li>Location: outside of Leeszaal, Rotterdam</li>
</div>
<div class="draggable scaleable-wrapper box_metadata group_metadata pile5"><h2>Workshop 5</h2>
<li>Actions:<li>
<li>Actions:</li>
<ul>
<li>Reading extracts</li>
<li>Reading <span class="tooltip-wrap">extracts <span class="tooltip-content-right">
1. Ballout, D. (2019) Good Morning, Kafranbel, This American Life: Wartime Radio.<br />
2. Carson, A. (1996) The Gender of Sound, in Glass, Irony and God. First Edition edition. New York: New Directions, pp. 119142.</span></span>in random order
</li>
<li>Discussion on public voice</li>
<li>Transcribing vowels</li>
<li>Transcribing the vowels of each other's sentences</li>
<li>Reading back the vowels</li>
<li>Reading outloud all together the score of vowels</li>
<li>Speaking like "men"</li>
<li>Listen back our <span class="tooltip-wrap">distorted voices<span class="tooltip-content-right">The voices were electronically distorted from female to male (high-pitch to low-pitch) with a bash script and vice versa<br />
<pre>
#!/bin/bash
today=$(date +%Y%m%d-%H%M);
output=${1:-distort}
arecord -Dpulse -f cd normal_$today.wav
rubberband -t 1.5 -p -5.5 normal_$today.wav ${output}_$today.wav
mkdir -p "normal"
mv -v normal_$today.wav normal/normal_$today.wav;
</pre><br />
<pre>
#!/bin/bash
today=$(date +%Y%m%d-%H%M)
output=${1:-distort}
arecord -Dpulse -f cd normal_$today.wav
rubberband -t 1.5 -p 3.0 normal_$today.wav ${output}_$today.wav
mkdir -p "storage"
mv -v normal_$today.wav storage/
ffmpeg -i ${output}_$today.wav -vn -ar 44100 -ac 2 -ab 192k -f mp3 ${output}_$today.mp3
mv -v ${output}_$today.wav storage/
</pre>
</span></span>
</li>
</ul>
<li>Outcome: Score of vowels<li>
<li>Date: 30/5/2019<li>
<li>Location: Leeszaal<li>
<li>Equipment: </li>
<ul>
<li>Printed extracts</li>
<li>Audio recorder</li>
<li>Paper + pens</li>
<li>Microphone</li>
<li>Small speaker</li>
<li>Food</li>
</ul>
<li>Outcome:</li>
<ul>
<li>Audio recordings of the actions</li>
<li>Videp recordings of the actions</li>
<li>Handwritten score of vowels</li>
</ul>
<li>Date: 30/5/2019</li>
<li>Location: Leeszaal, Rotterdam</li>
<li>Other: Part of <span class="tooltip-wrap">Women@Art<span class="tooltip-content-right">A series of workshops dedicated to 'wereldvrouwen', a group of women around the world. They meet every Wednesday at Leeszaal</span></span><li>
</div>
<!-- draggable menu-->
<div class="draggable scaleable-wrapper active-draggable" style="width: 500px; top: 20px; right: 0px;">
<div class="draggable scaleable-wrapper active-draggable" style="top:1%; right:0.5%;">
<h2><a class="active" href="amplification.php">Amplification of female voices</a></h2>
<div class="drag-content">
<?php include 'texts/amplification.txt'; ?>
@ -186,7 +307,7 @@ Filter by:
</div>
</div>
<div class="draggable scaleable-wrapper group_menu pileM">
<h2 ><a href="player.php group_menu pileM">Player</a></h2>
<h2 ><a href="player.php">Player</a></h2>
<div class="drag-content">
(audio archive)
</div>
@ -231,14 +352,14 @@ groups()
function piles(){
var pileM_position=[1800,900]
var pileM_position=[1300,900]
$(".pileM").each(function(i){
$(this).css({"top":i*60+pileM_position[1],"left":i*20+pileM_position[0]})
})
var pile0_position=[30,2500]
$(".pile0").each(function(i){
$(this).css({"top":pile0_position[1],"left":i*300+pile0_position[0]})
$(this).css({"top":pile0_position[1],"left":i*80+pile0_position[0]})
})
var pile1_position=[30,300]
@ -251,18 +372,18 @@ function piles(){
$(this).css({"top":i*distance+pile2_position[1],"left":i*distance+pile2_position[0]})
})
var pile3_position=[900,850]
var pile3_position=[700,750]
$(".pile3").each(function(i){
$(this).css({"top":i*distance+pile3_position[1],"left":i*distance+pile3_position[0]})
})
var pile4_position=[1600,1600]
var pile4_position=[1200,1600]
$(".pile4").each(function(i){
$(this).css({"top":i*distance+pile4_position[1],"left":i*distance+pile4_position[0]})
})
var pile5_position=[1000,100]
var pile5_position=[800,100]
$(".pile5").each(function(i){
$(this).css({"top":i*distance+pile5_position[1],"left":i*distance+pile5_position[0]})
})
@ -277,7 +398,7 @@ function piles(){
function groups(){
var group_vowels_position=[800,100]
var group_vowels_position=[700,100]
$(".group_vowels").each(function(i){
$(this).css({"top":i*distance+group_vowels_position[1],"left":i*distance+group_vowels_position[0]})
})
@ -292,12 +413,12 @@ function groups(){
$(this).css({"top":i*distance+group_extracts_position[1],"left":i*distance+group_extracts_position[0]})
})
var group_metadata_position=[1000,1000]
var group_metadata_position=[800,1000]
$(".group_metadata").each(function(i){
$(this).css({"top":i*distance+group_metadata_position[1],"left":i*distance+group_metadata_position[0]})
})
var group_menu_position=[1800,900]
var group_menu_position=[1300,900]
$(".group_menu").each(function(i){
$(this).css({"top":i*60+group_menu_position[1],"left":i*20+group_menu_position[0]})
})

@ -3,68 +3,33 @@
<head>
<meta charset="utf-8">
<link href="styles/stylesheet.css" rel="stylesheet" type="text/css">
<link href="styles/jquery-ui.css" rel="stylesheet" type="text/css">
<link href="styles/widescreen.css" rel="stylesheet" type="text/css">
<!-- <link href="styles/smallscreen.css" rel="stylesheet" type="text/css"> -->
<script type="text/javascript" src="js/jquery.min.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/jquery.ui.touch-punch.min.js"></script>
<script src="js/draggable.js"></script>
<title>Diary of West Rotterdam</title>
<h2>Diary of West Rotterdam</h2><p><iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d9843.857515609021!2d4.4669618!3d51.916361!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c434a28540a933%3A0xd4069914bf04d83c!2sReading+Rotterdam+West!5e0!3m2!1sen!2snl!4v1554025281791!5m2!1sen!2snl" align="right" width="300" height="1300px" frameborder="0" style="border:0" allowfullscreen></iframe></p>
<p><iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d9843.857515609021!2d4.4669618!3d51.916361!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c434a28540a933%3A0xd4069914bf04d83c!2sReading+Rotterdam+West!5e0!3m2!1sen!2snl!4v1554025281791!5m2!1sen!2snl" align="right" width="300" height="1300px" frameborder="0" style="border:0" allowfullscreen></iframe></p>
</head>
<body>
<!-- draggable menu-->
<div class="draggable scaleable-wrapper" style="width: 500px; top: 20px; right: 0px;">
<h2><a href="amplification.php">Amplification of female voices</a></h2>
</div>
<div class="draggable scaleable-wrapper active-draggable" style="top: 1270px; right: 200px;">
<h2 ><a class="active" href="diary.php">Diary of West Rotterdam</a></h2>
<div class="drag-content">
<?php include 'texts/diary.txt'; ?>
</div>
</div>
<div class="draggable scaleable-wrapper" style="top: 1200px; right: 10px;">
<h2 ><a href="player.php">Player</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 860px; right: 335px;">
<h2 ><a href="index.php">About</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 1270px; left: 100px;z-index: 1;">
<h2 ><a href="podcast4.php">Podcast4</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 920px; left: 10px;">
<h2 ><a href="podcast1.php">Podcast1</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 1420px; left: 150px;">
<h2 ><a href="podcast2.php">Podcast2</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 1320px; left: 380px;">
<h2 ><a href="podcast3.php">Podcast3</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 960px; right: 430px; z-index: 9;">
<h2 ><a href="thesis-angeliki.php">"Let' s Talk About Unspeakable Things"</a></h2>
</div>
<!-- end draggable menu-->
<div id="resize" class="draggable ui-draggable-handle"><a href="images/vowels-20190322-leeszaal.jpg"><img src="images/vowels-20190322-leeszaal.jpg" width="400px"></img></a></div>
<div id="resize" class="draggable ui-draggable-handle"><a href="images/vowels-leeszaal-test.jpg"><img src="images/vowels-leeszaal-test.jpg" width="100%"></img></a></div>
<div id="resize" class="draggable ui-draggable-handle"><a href="images/vowels-20190322-leeszaal.jpg"><img src="images/vowels-20190322-leeszaal.jpg" width="400px"></img></a></div>
<div class="draggable" style="position:absolute; top:6%; left:5%;width:1800px;">
<div class="draggable" style="position:absolute; top:6%; left:5%;width:80%;">
<audio controls >
<source src="audio/20190122-track-extracts.mp3" type="audio/mpeg">
</audio>
<div class="tooltip-wrap" style="display: inline;text-decoration:underline;">
<a href="images/20190122-track-annotated-2.png" alt="annotated_track" target="_blank">
<img src="images/20190122-track-annotated-2.png" alt="annotated_track" style="width:1800px;">
<img src="images/20190122-track-annotated-2.png" alt="annotated_track" style="width:100%;">
</a>
<div class="tooltip-content-right" >22-1-2019<object height="250px" width="400px" data="texts/20190122_Label_Track.txt"></object>
</div>
@ -72,26 +37,26 @@
</div>
<div class="draggable" style="position:absolute; top:40%; left:5%;width:1800px;">
<div class="draggable" style="position:absolute; top:40%; left:5%;width:80%;">
<audio controls >
<source src="audio/20190123-track-extracts.mp3" type="audio/mpeg">
</audio>
<div class="tooltip-wrap" style="display: inline;text-decoration:underline;">
<a href="images/20190123-track-annotated.png" alt="annotated_track" target="_blank">
<img src="images/20190123-track-annotated.png" alt="annotated_track" style="width:1800px;">
<img src="images/20190123-track-annotated.png" alt="annotated_track" style="width:100%;">
</a>
<div class="tooltip-content-right" >23-1-2019<object height="250px" width="400px" data="texts/20190123_Label_Track.txt"></object>
</div>
</div>
</div>
<div class="draggable" style="position:absolute; top:60%; left:5%;width:1800px;">
<div class="draggable" style="position:absolute; top:60%; left:5%;width:80%;">
<audio controls >
<source src="audio/20190128-track-extracts.mp3" type="audio/mpeg">
</audio>
<div class="tooltip-wrap" style="display: inline;text-decoration:underline;">
<a href="images/20190128-track-annotated.png" alt="annotated_track" target="_blank">
<img src="images/20190128-track-annotated.png" alt="annotated_track" style="width:1800px;">
<img src="images/20190128-track-annotated.png" alt="annotated_track" style="width:100%;">
</a>
<div class="tooltip-content-right" >28-1-2019<object height="250px" width="400px" data="texts/20190128_Label_Track.txt"></object>
</div>
@ -99,7 +64,7 @@
</div>
<div class="draggable" style="position:absolute; top:80%; left:5%;width:800px;">
<div class="draggable" style="position:absolute; top:80%; left:5%;width:20%;">
<audio controls >
<source src="audio/20190130_171657 WiFi scanning.mp3" type="audio/mpeg">
</audio>
@ -111,13 +76,52 @@
<p>Tracking private places. Relations of street names, sounds of that time and wifi names around</p>
</div>
<div class="draggable" style="position:absolute; top:90%; left:5%;width:800px;">
<div class="draggable" style="position:absolute; top:90%; left:5%;width:20%">
<audio controls >
<source src="audio/20190205-track-extracts.wav" type="audio/mpeg">
</audio>
5-2-2019
</div>
<!-- draggable menu-->
<div class="draggable scaleable-wrapper" style="top: 20px; right: 0px;">
<h2><a href="amplification.php">Amplification of female voices</a></h2>
</div>
<div class="draggable scaleable-wrapper active-draggable" style="top: 1270px; right: 200px;">
<h2 ><a class="active" href="diary.php">Diary of West Rotterdam</a></h2>
<div class="drag-content">
<?php include 'texts/diary.txt'; ?>
</div>
</div>
<div class="draggable scaleable-wrapper" style="top: 1200px; right: 10px;">
<h2 ><a href="player.php">Player</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 860px; right: 335px;">
<h2 ><a href="index.php">About</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 1270px; left: 100px;z-index: 1;">
<h2 ><a href="podcast4.php">Podcast4</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 920px; left: 10px;">
<h2 ><a href="podcast1.php">Podcast1</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 1420px; left: 150px;">
<h2 ><a href="podcast2.php">Podcast2</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 1320px; left: 380px;">
<h2 ><a href="podcast3.php">Podcast3</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 960px; right: 430px; z-index: 9;">
<h2 ><a href="thesis-angeliki.php">"Let' s Talk About Unspeakable Things"</a></h2>
</div>
<!-- end draggable menu-->
</body>
</html>

@ -4,7 +4,8 @@
<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/widescreen.css" rel="stylesheet" type="text/css">
<!-- <link href="styles/smallscreen.css" rel="stylesheet" type="text/css"> -->
<link href="styles/jquery-ui.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
@ -21,7 +22,7 @@
<div style="top: 50%; left:50%;margin-top: -50px;margin-left: -50px;width: 700px; position: absolute;">
<img src="images/speaker_logo3.png" width="130px">
<h1 style="color: #A19696;">Let's <span style="font-style: italic;color:black !important;">amplify</span> unspeakable things <p style="font-size: 25px !important;">overlayered utterances</p></h1>
<h1 style="color: #A19696;">Let's <span style="font-style: italic;color:black !important;">amplify</span> unspeakable things</h1>
</div>
<!-- (the unfolding/overlayering of) -->
@ -30,44 +31,44 @@
<div class="draggable scaleable-wrapper" style="top:12%;left:55%;width: 500px;">
<div class="tooltip-wrap" style="text-decoration:underline;"> <img src="images/carson-list.jpg" style="width: 100%"></img><div class="tooltip-content-right" ><div>this is how female/high-pitched voices have been described since acient times as Anne Carson observes</div></div></div>
<div class="draggable scaleable-wrapper" style="top:8%;left:58%;width: 23%;">
<div class="tooltip-wrap" style="text-decoration:underline;"> <img src="images/carson-list.jpg" style="width: 100%;"></img><div class="tooltip-content-right" style="min-width: 40% !important;" ><div>this is how female/high-pitched voices have been described since acient times as Anne Carson observes</div></div></div>
</div>
<div class="draggable scaleable-wrapper"style="top: 0%; right: 67%;width: 300px; font-size: 20px;">
<h2 style="font-size: 26px;"><a href="podcast1.php" >Podcast1</a></h2>
<div class="draggable scaleable-wrapper"style="top: 0%; right: 67%;width: 10%;">
<h2 style="font-size: 110%;"><a href="podcast1.php" >Podcast1</a></h2>
<div class="drag-content">
<?php include 'texts/podcast1.txt'; ?>
</div>
</div>
<div class="draggable scaleable-wrapper"style="top:3%;left:72%; width: 500px; font-size: 20px">
<h2 style="font-size: 36px;"><a href="amplification.php" >Amplification of female voices</a></h2>
<div class="draggable scaleable-wrapper"style="top:3%;left:72%; width: 25%; font-size: 100%">
<h2 style="font-size: 120%;"><a href="amplification.php" >Amplification of female voices</a></h2>
<div class="drag-content">
<?php include 'texts/amplification.txt'; ?>
</div>
</div>
<div class="draggable scaleable-wrapper"style="top: 70%; right: 10%;width: 300px; font-size: 20px;">
<h2 style="font-size: 26px;"><a href="podcast2.php" >Podcast2</a></h2>
<div class="draggable scaleable-wrapper"style="top: 70%; right: 10%;width: 10%;">
<h2 style="font-size: 110%;"><a href="podcast2.php" >Podcast2</a></h2>
<div class="drag-content">
<?php include 'texts/podcast2.txt'; ?>
</div>
</div>
<div class="draggable scaleable-wrapper"style="top: 80%; right: 30%;width: 300px; font-size: 20px;">
<h2 style="font-size: 26px;"><a href="podcast3.php" >Podcast3</a></h2>
<div class="draggable scaleable-wrapper"style="top: 80%; right: 30%;width: 10%;">
<h2 style="font-size: 110%;"><a href="podcast3.php" >Podcast3</a></h2>
<div class="drag-content">
<?php include 'texts/podcast3.txt'; ?>
</div>
</div>
<div class="draggable scaleable-wrapper"style="top: 85%; right: 23%;width: 300px; font-size: 20px;">
<h2 style="font-size: 26px;"><a href="podcast4.php" >Podcast4</a></h2>
<div class="draggable scaleable-wrapper"style="top: 85%; right: 23%;width: 10%;">
<h2 style="font-size: 110%;"><a href="podcast4.php" >Podcast4</a></h2>
<div class="drag-content">
<?php include 'texts/podcast4.txt'; ?>
</div>
</div>
<div class="draggable scaleable-wrapper"style="top:75%;left:41%;width: 200px; font-size: 14px;">
<h2 style="font-size: 20px;"><a href="diary.php" >Diary of West Rotterdam</a></h2>
<div class="draggable scaleable-wrapper"style="top:75%;left:41%;width: 12%; font-size: 80%;">
<h2 style=";"><a href="diary.php" >Diary of West Rotterdam</a></h2>
<div class="drag-content">
<?php include 'texts/diary.txt'; ?>
</div></div>
@ -75,7 +76,7 @@
<div class="draggable scaleable-wrapper"style="top:8%;left:35%">
<div class="draggable scaleable-wrapper"style="top:5%;left:35%">
<h2 ><a href="player.php" >Player</a></h2>
<div class="drag-content">
<?php include 'texts/player.txt'; ?>
@ -83,14 +84,14 @@
</div>
<div class="draggable scaleable-wrapper active-draggable" style="top:18%;left:6%;" >
<h2 style="font-size: 44px"><a class="active" href="index.php" >About</a></h2>
<h2><a class="active" href="index.php" >About</a></h2>
<div class="drag-content">
<?php include 'texts/about.txt'; ?>
</div>
</div>
<!-- colophon -->
<div class="draggable scaleable-wrapper box_metadata" style="top:81%;left:5%;" >
<div class="draggable scaleable-wrapper box_metadata" style="top:81%;left:3%;" >
<h2>Colophon</h2>
<li>This work has been produced in the context of the graduation research of Angeliki Diakrousi from the Experimental Publishing (XPUB) Master course at the Piet Zwart Institute, Willem de Kooning Academy, Rotterdam University of Applied Sciences.</li>
<li>XPUB is a two year Master of Arts in Fine Art and Design that focuses on the intents, means and consequences of making things public and creating publics in the age of post-digital networks.</li>

@ -1,7 +1,8 @@
<html lang="en">
<head>
<meta charset="utf-8">
<link href="styles/stylesheet.css" rel="stylesheet" type="text/css">
<link href="styles/widescreen.css" rel="stylesheet" type="text/css">
<!-- <link href="styles/smallscreen.css" rel="stylesheet" type="text/css"> -->
<link href="styles/jquery-ui.css" rel="stylesheet" type="text/css">
<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>
@ -26,7 +27,7 @@
<!-- links -->
<div class="draggable box_metadata" style="width: 500px !important">
<div class="draggable box_metadata" style="top: 110%; left:40%; width: 500px !important">
<h2>Online Sources</h2>
<li id="angela">
<a href="#" >Angela Davis @Occupy Wall Street</a>
@ -82,186 +83,186 @@ $("#katalin").click(function(){
<section>
<div class="draggable" style="position:absolute; top:6%; left:51%;width: 270px">
<audio controls src="audio/leeszaal-meetings-warming.mp3"></audio>
<div class="draggable" style="position:absolute; top:6%; left:51%;width: 13%">
<audio controls src="audio/leeszaal-meetings-warming.mp3" class="audio-tag"></audio>
<a href="images/meeting-20190328-leeszaal-6.jpg" target="_blank">
<img src="images/meeting-20190328-leeszaal-6.jpg" width="270px">
<img src="images/meeting-20190328-leeszaal-6.jpg" style="width:100%">
</a>
<p>warming up @Leeszaal 28/3</p>
</div>
<div class="draggable" style="position:absolute; top:10%; left:48%;width: 270px">
<audio controls src="audio/leeszaal-discussing-20190530.mp3"></audio>
<div class="draggable" style="position:absolute; top:10%; left:48%;width: 13%">
<audio controls src="audio/leeszaal-discussing-20190530.mp3" class="audio-tag"></audio>
<a href="images/meeting-20190530-leeszaal-4.jpg" target="_blank">
<img src="images/meeting-20190530-leeszaal-4.jpg" width="270px">
<img src="images/meeting-20190530-leeszaal-4.jpg" style="width:100%">
</a>
<p>discussing about voice in public @Leeszaal 30/5</p>
</div>
<div class="draggable" style="position:absolute; top:16%; left:55%;width: 270px">
<audio controls src="audio/leeszaal-meeting-transcribing-20190508.mp3"></audio>
<div class="draggable" style="position:absolute; top:16%; left:55%;width: 13%">
<audio controls src="audio/leeszaal-meeting-transcribing-20190508.mp3" class="audio-tag"></audio>
<a href="images/vowels-20190508-leeszaal-3.jpg" target="_blank">
<img src="images/vowels-20190508-leeszaal-3.jpg" width="270px">
<img src="images/vowels-20190508-leeszaal-3.jpg" style="width:100%">
</a>
<p>trascribing+singing vowels @Leeszaal 3/5</p>
</div>
<div class="draggable" style="position:absolute; top:15%; left:41%; width: 270px">
<audio controls src="audio/leeszaal-meeting-extracts-20190523.mp3"></audio>
<div class="draggable" style="position:absolute; top:15%; left:41%; width: 13%">
<audio controls src="audio/leeszaal-meeting-extracts-20190523.mp3" class="audio-tag"></audio>
<a href="images/meeting-20190523-leeszaal-6.jpg" target="_blank">
<img src="images/meeting-20190523-leeszaal-6.jpg" width="270px">
<img src="images/meeting-20190523-leeszaal-6.jpg" style="width:100%">
</a>
<p>reading extracts @outside Leeszaal 23/5</p>
</div>
<div class="draggable" style="position:absolute; top:18%; left:37%; width: 270px">
<audio controls src="audio/leeszaal-meetings-choir.mp3"></audio>
<div class="draggable" style="position:absolute; top:18%; left:37%; width: 13%">
<audio controls src="audio/leeszaal-meetings-choir.mp3" class="audio-tag"></audio>
<a href="images/vowels-20190328-leeszaal.jpg" target="_blank">
<img src="images/vowels-20190328-leeszaal.jpg" width="270px">
<img src="images/vowels-20190328-leeszaal.jpg" style="width:100%">
</a>
<p>singing vowels @outside Leeszaal 28/3</p>
</div>
<div class="draggable" style="position:absolute; top:20%; left:63%;width: 270px">
<audio controls src="audio/leeszaal-meeting-warming-20190523.mp3"></audio>
<div class="draggable" style="position:absolute; top:20%; left:63%;width: 13%">
<audio controls src="audio/leeszaal-meeting-warming-20190523.mp3" class="audio-tag"></audio>
<a href="images/meeting-20190523-leeszaal-7.jpg" target="_blank">
<img src="images/meeting-20190523-leeszaal-7.jpg" width="270px">
<img src="images/meeting-20190523-leeszaal-7.jpg" style="width:100%">
</a>
<p>warming up @outside Leeszaal 23/5</p>
</div>
<div class="draggable" style="position:absolute; top:23%; left:66%;width: 270px">
<audio controls src="audio/distort_leeszaal_20190523-1341.mp3" ></audio>
<div class="draggable" style="position:absolute; top:23%; left:66%;width: 13%">
<audio controls src="audio/distort_leeszaal_20190523-1341.mp3" class="audio-tag"></audio>
<a href="" target="_blank">
<img src="images/meeting-20190523-leeszaal-2.jpg" width="270px">
<img src="images/meeting-20190523-leeszaal-2.jpg" style="width:100%">
</a>
<p>personal experiences-distorted voice @outside Leeszaal 23/5</p>
</div>
<div class="draggable" style="position:absolute; top:27%; left:68%;width: 270px">
<audio controls src="audio/leeszaal-extracts-20190530.mp3" ></audio>
<div class="draggable" style="position:absolute; top:27%; left:68%;width: 13%">
<audio controls src="audio/leeszaal-extracts-20190530.mp3" class="audio-tag"></audio>
<a href="images/fresh1.jpg" target="_blank">
<img src="images/fresh1.jpg" width="270px">
<img src="images/fresh1.jpg" style="width:100%">
</a>
<p>reading extracts @Leeszaal 30/5</p>
</div>
<div class="draggable" style="position:absolute; top:32%; left:70%;width: 270px">
<audio controls src="audio/finearts-meeting-discussion.mp3"></audio>
<a href="" target="_blank"><img src="images/meeting-20190329-finearts-1.JPG" width="270px" /></a>
<div class="draggable" style="position:absolute; top:32%; left:70%;width: 13%">
<audio controls src="audio/finearts-meeting-discussion.mp3" class="audio-tag"></audio>
<a href="" target="_blank"><img src="images/meeting-20190329-finearts-1.JPG" style="width:100%" /></a>
<p>discussing about voice in public @Fine Arts 29/3</p>
</div>
<div class="draggable" style="position:absolute; top:36%; left:73%;width: 270px">
<audio controls src="audio/leeszaal-meeting-warming-20190508.mp3"></audio>
<a href="" target="_blank"><img src="images/meeting-20190508_leeszaal.jpg" width="270px" /></a>
<div class="draggable" style="position:absolute; top:36%; left:73%;width: 13%">
<audio controls src="audio/leeszaal-meeting-warming-20190508.mp3" class="audio-tag"></audio>
<a href="" target="_blank"><img src="images/meeting-20190508_leeszaal.jpg" style="width:100%" /></a>
<p>warming up @Leeszaal 8/5</p>
</div>
<div class="draggable" style="position:absolute; top:42%; left:75%;width: 270px">
<audio controls src="audio/leeszaal-meetings-transcribing.mp3"></audio>
<a href="" target="_blank"><img src="images/meeting-20190328-leeszaal-1.JPG" width="270px" /></a>
<div class="draggable" style="position:absolute; top:42%; left:75%;width: 13%">
<audio controls src="audio/leeszaal-meetings-transcribing.mp3" class="audio-tag"></audio>
<a href="" target="_blank"><img src="images/meeting-20190328-leeszaal-1.JPG" style="width:100%" /></a>
<p>transcribing vowels @Leeszaal 28/3</p>
</div>
<div class="draggable" style="position:absolute; top:47%; left:74%;width: 270px">
<audio controls src="audio/leeszaal-warming-20190530.mp3"></audio>
<a href="images/meeting-20190530-leeszaal-2.jpg" target="_blank"><img src="images/meeting-20190530-leeszaal-2.jpg" width="270px" /></a>
<div class="draggable" style="position:absolute; top:47%; left:74%;width: 13%">
<audio controls src="audio/leeszaal-warming-20190530.mp3" class="audio-tag"></audio>
<a href="images/meeting-20190530-leeszaal-2.jpg" target="_blank"><img src="images/meeting-20190530-leeszaal-2.jpg" style="width:100%" /></a>
<p>warming up @Leeszaal 30/5</p>
</div>
<div class="draggable" style="position:absolute; top:55%; left:73%;width: 270px">
<audio controls src="audio/finearts-meeting-choir.mp3"></audio>
<a href="" target="_blank"><img src="images/vowels-20190329-finearts.jpg" width="270px" /></a>
<div class="draggable" style="position:absolute; top:55%; left:73%;width: 13%">
<audio controls src="audio/finearts-meeting-choir.mp3" class="audio-tag"></audio>
<a href="" target="_blank"><img src="images/vowels-20190329-finearts.jpg" style="width:100%" /></a>
<p>singing vowels @Fine Arts 29/3</p>
</div>
<div class="draggable" style="position:absolute; top:59%; left:71%;width: 270px">
<audio controls src="audio/leeszaal-coffee-20190530.mp3"></audio>
<a href="images/meeting-20190530-leeszaal-3.jpg" target="_blank"><img src="images/meeting-20190530-leeszaal-3.jpg" width="270px" /></a>
<div class="draggable" style="position:absolute; top:59%; left:71%;width: 13%">
<audio controls src="audio/leeszaal-coffee-20190530.mp3" class="audio-tag"></audio>
<a href="images/meeting-20190530-leeszaal-3.jpg" target="_blank"><img src="images/meeting-20190530-leeszaal-3.jpg" style="width:100%" /></a>
<p>coffee time @Leeszaal 30/5</p>
</div>
<div class="draggable" style="position:absolute; top:65%; left:70%;width: 270px">
<audio controls src="audio/distort_leeszaal_20190523-1336.mp3" ></audio>
<div class="draggable" style="position:absolute; top:65%; left:70%;width: 13%">
<audio controls src="audio/distort_leeszaal_20190523-1336.mp3" class="audio-tag"></audio>
<a href="" target="_blank">
<img src="images/meeting-20190523-leeszaal-1.jpg" width="270px">
<img src="images/meeting-20190523-leeszaal-1.jpg" style="width:100%">
</a>
<p>singing vowels-distorted voice @outside Leeszaal 23/5</p>
</div>
<div class="draggable" style="position:absolute; top:23%; left:32%;width: 270px">
<audio controls src="audio/finearts-meeting-transcribing.mp3"></audio>
<div class="draggable" style="position:absolute; top:23%; left:32%;width: 13%">
<audio controls src="audio/finearts-meeting-transcribing.mp3" class="audio-tag"></audio>
<a href="" target="_blank">
<img src="images/meeting-20190329-finearts-2.JPG" width="270px" />
<img src="images/meeting-20190329-finearts-2.JPG" style="width:100%" />
</a>
<p>transcribing vowels @Fine Arts 29/3</p>
</div>
<div class="draggable" style="position:absolute; top:27%; left:29%; width: 270px">
<audio controls src="audio/finearts-meeting-extracts.mp3"></audio>
<div class="draggable" style="position:absolute; top:27%; left:29%; width: 13%">
<audio controls src="audio/finearts-meeting-extracts.mp3" class="audio-tag"></audio>
<a href="images/carson-extract.jpg" target="_blank">
<img src="images/carson-extract.jpg" width="270px" />
<img src="images/carson-extract.jpg" style="width:100%" />
</a>
<p>reading extracts @Fine Arts 29/3</p>
</div>
<div class="draggable" style="position:absolute; top:33%; left:26%;width: 270px;">
<audio controls src="audio/leeszaal-meeting-transcribing-20190523.mp3"></audio>
<div class="draggable" style="position:absolute; top:33%; left:26%;width: 13%;">
<audio controls src="audio/leeszaal-meeting-transcribing-20190523.mp3" class="audio-tag"></audio>
<a href="images/meeting-20190523-leeszaal-4.jpg" target="_blank">
<img src="images/meeting-20190523-leeszaal-4.jpg" width="270px">
<img src="images/meeting-20190523-leeszaal-4.jpg" style="width:100%">
</a>
<p>transcribing vowels @outside Leeszaal 23/5</p>
</div>
<div class="draggable" style="position:absolute; top:38%; left:27%;width: 270px;">
<audio controls src="audio/leeszaal-sentenses-distorted-20190530.mp3"></audio>
<div class="draggable" style="position:absolute; top:38%; left:27%;width: 13%;">
<audio controls src="audio/leeszaal-sentenses-distorted-20190530.mp3" class="audio-tag"></audio>
<a href="images/meeting-20190530-leeszaal-1.jpg" target="_blank">
<img src="images/meeting-20190530-leeszaal-1.jpg" width="270px">
<img src="images/meeting-20190530-leeszaal-1.jpg" style="width:100%">
</a>
<p>statements- distorted voice @Leeszaal 30/5</p>
</div>
<div class="draggable" style="position:absolute; top:46%; left:28%; width: 270px">
<audio controls src="audio/leeszaal-meetings-discussion.mp3"></audio>
<div class="draggable" style="position:absolute; top:46%; left:28%; width: 13%">
<audio controls src="audio/leeszaal-meetings-discussion.mp3" class="audio-tag"></audio>
<a href="" target="_blank">
<img src="images/meeting-20190328-leeszaal-2.JPG" width="270px" /></a>
<img src="images/meeting-20190328-leeszaal-2.JPG" style="width:100%" /></a>
<p>discussing about voice in public @Leeszaal 28/3</p>
</div>
<div class="draggable" style="position:absolute; top:51%; left:29%; width: 270px">
<audio controls src="audio/leeszaal-singing-distorted-20190530.mp3"></audio>
<div class="draggable" style="position:absolute; top:51%; left:29%; width: 13%">
<audio controls src="audio/leeszaal-singing-distorted-20190530.mp3" class="audio-tag"></audio>
<a href="images/vowels-20190508-leeszaal-1.jpg" target="_blank">
<img src="images/vowels-20190508-leeszaal-1.jpg" width="270px" /></a>
<img src="images/vowels-20190508-leeszaal-1.jpg" style="width:100%" /></a>
<p>singing vowels- distorted voice @Leeszaal 30/5</p>
</div>
<div class="draggable" style="position:absolute; top:57%; left:30%;width: 270px;">
<audio controls src="audio/finearts-meeting-choirhigh.mp3"></audio>
<a href="images/meeting-20190329-finearts-5.JPG" target="_blank"><img src="images/meeting-20190329-finearts-5.JPG" width="270px" /></a>
<div class="draggable" style="position:absolute; top:57%; left:30%;width: 13%;">
<audio controls src="audio/finearts-meeting-choirhigh.mp3" class="audio-tag"></audio>
<a href="images/meeting-20190329-finearts-5.JPG" target="_blank"><img src="images/meeting-20190329-finearts-5.JPG" style="width:100%" /></a>
<p>singing vowels (high) @Fine Arts 29/3</p>
</div>
<div class="draggable" style="position:absolute; top:61%; left:32%;width: 270px;">
<audio controls src="audio/leeszaal-meeting-extracts-20190508.mp3"></audio>
<a href="images/meeting-20190328-leeszaal-4.jpg" target="_blank"><img src="images/meeting-20190328-leeszaal-4.jpg" width="270px" /></a>
<div class="draggable" style="position:absolute; top:61%; left:32%;width: 13%;">
<audio controls src="audio/leeszaal-meeting-extracts-20190508.mp3" class="audio-tag"></audio>
<a href="images/meeting-20190328-leeszaal-4.jpg" target="_blank"><img src="images/meeting-20190328-leeszaal-4.jpg" style="width:100%" /></a>
<p>reading extracts @Leeszaal 8/5</p>
</div>
<div class="draggable" style="position:absolute; top:66%; left:35%;width: 270px;">
<audio controls src="audio/finearts-meeting-warming.mp3"></audio>
<a href="images/meeting-20190329-finearts-4.JPG" target="_blank"><img src="images/meeting-20190329-finearts-4.JPG" width="270px" /></a>
<div class="draggable" style="position:absolute; top:66%; left:35%;width: 13%;">
<audio controls src="audio/finearts-meeting-warming.mp3" class="audio-tag"></audio>
<a href="images/meeting-20190329-finearts-4.JPG" target="_blank"><img src="images/meeting-20190329-finearts-4.JPG" style="width:100%" /></a>
<p>warming up @Fine Arts 29/3</p>
</div>
@ -274,10 +275,10 @@ $("#katalin").click(function(){
<!-- soundwalk player -->
<section style="margin-top: 1300px !important;">
<section style="margin-top: 60% !important;">
<div class="tooltip-wrap">
<audio style="width: 100%;" id="a1" controls src="audio/selection-track-extracts-1.mp3"></audio><a href="" target="_blank">
<audio style="width: 100%;" id="a1" controls src="audio/selection-track-extracts-1.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<!-- have to add id="transcriptWrapper..." -->
<div>selection of recordings while wandering around Leeszaal</div>
@ -285,7 +286,7 @@ $("#katalin").click(function(){
</div>
<div class="tooltip-wrap">
<audio ontimeupdate="playTranscript()" style="width: 100%; background: #222;" id="a2" controls src="audio/description-lidia-CUT.mp3"></audio><a href="" target="_blank">
<audio ontimeupdate="playTranscript()" style="width: 100%; background: #222;" id="a2" controls src="audio/description-lidia-CUT.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<div id="transcriptWrapper" class='sub'>
<h3>Lidia</h3>
@ -304,7 +305,7 @@ $("#katalin").click(function(){
<div class="tooltip-wrap">
<audio ontimeupdate="playTranscript3()" style="width: 100%; background: #222;" id="a3" controls src="audio/description-eugenie-CUT-SHORT.mp3"></audio><a href="" target="_blank">
<audio ontimeupdate="playTranscript3()" style="width: 100%; background: #222;" id="a3" controls src="audio/description-eugenie-CUT-SHORT.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<div id="transcriptWrapper3" class='sub'>
<h3>Eugenie</h3>
@ -327,7 +328,7 @@ $("#katalin").click(function(){
<div class="tooltip-wrap">
<!-- have to add ontimeupdate="playTranscript3()" -->
<audio style="width: 100%; background: #222;" id="a4" controls src="audio/description-alex1.mp3"></audio><a href="" target="_blank">
<audio style="width: 100%; background: #222;" id="a4" controls src="audio/description-alex1.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<!-- have to add id="transcriptWrapper..." -->
<div class='sub'>
@ -359,7 +360,7 @@ Oh, I hear children in the background crying</div>
<!-- second sounwalk player -->
<div class="tooltip-wrap">
<audio style="width: 100%; background: #FFFFFF;" id="b1" controls src="audio/selectionB.mp3"></audio><a href="" target="_blank">
<audio style="width: 100%; background: #FFFFFF;" id="b1" controls src="audio/selectionB.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<!-- have to add id="transcriptWrapper..." -->
</div>
@ -367,7 +368,7 @@ Oh, I hear children in the background crying</div>
<div class="tooltip-wrap">
<!-- have to add ontimeupdate="playTranscript3()" -->
<audio style="width: 100%; background: #222;" id="b2" controls src="audio/description-tommi.mp3"></audio><a href="" target="_blank">
<audio style="width: 100%; background: #222;" id="b2" controls src="audio/description-tommi.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<!-- have to add id="transcriptWrapper..." -->
<div class='subB'>
@ -395,7 +396,7 @@ Oh, I hear children in the background crying</div>
<div class="tooltip-wrap">
<!-- have to add ontimeupdate="playTranscript3()" -->
<audio style="width: 100%; background: #222;" id="b3" controls src="audio/description-alex2.mp3"></audio><a href="" target="_blank">
<audio style="width: 100%; background: #222;" id="b3" controls src="audio/description-alex2.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<!-- have to add id="transcriptWrapper..." -->
<div class='subB'>
@ -435,14 +436,14 @@ Oh, I hear children in the background crying</div>
<!-- draggable menu-->
<div class="draggable scaleable-wrapper" style="top:70%;left: 5; width: 300px; font-size: 20px">
<div class="draggable scaleable-wrapper" style="top:110%;left: 5; width: 300px; font-size: 20px">
<h2 ><a href="diary.php">Diary of West Rotterdam</a></h2>
<div class="drag-content">
(first experiments)
</div>
</div>
<div class="draggable scaleable-wrapper" style="top:700px; right: 5px;width: 250px; font-size: 16px">
<div class="draggable scaleable-wrapper" style="top:45%; left: 1%;width: 250px; font-size: 16px">
<h2><a href="amplification.php">Amplification of female voices</a></h2>
<div class="drag-content">
(workshops)
@ -458,28 +459,28 @@ Oh, I hear children in the background crying</div>
</div>
<div class="draggable scaleable-wrapper" style="top: 400px; right: 0px; z-index: 9;width: 250px; font-size: 16px">
<div class="draggable scaleable-wrapper" style="top: 5%; right: 1%; z-index: 9;width: 250px; font-size: 16px">
<h2 ><a href="thesis-angeliki.php">"Let' s Talk About Unspeakable Things"</a></h2>
<div class="drag-content">
(thesis)
</div>
</div>
<div class="draggable scaleable-wrapper" style="top: 970px; left: 100px;z-index: 1;">
<div class="draggable scaleable-wrapper" style="top: 65%; left: 2%;">
<h2 ><a href="podcast4.php">Podcast4</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 260px; left: 120px;">
<div class="draggable scaleable-wrapper" style="top: 75%; left: 2%;">
<h2 ><a href="podcast1.php">Podcast1</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 920px; left: 150px;">
<div class="draggable scaleable-wrapper" style="top: 85%; left: 3%;">
<h2 ><a href="podcast2.php">Podcast2</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 820px; left: 80px;">
<div class="draggable scaleable-wrapper" style="top: 95%; left: 1%;">
<h2 ><a href="podcast3.php">Podcast3</a></h2>
</div>
<div class="draggable scaleable-wrapper active-draggable" style="top: 316.833px; left: 10;">
<div class="draggable scaleable-wrapper active-draggable" style="top: 1%; left: 1%;">
<h2 ><a class="active" href="player.php">Player</a></h2>
<div class="drag-content">
<?php include 'texts/player.txt'; ?>

@ -3,7 +3,8 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="styles/jquery-ui.css" rel="stylesheet" type="text/css">
<link href="styles/stylesheet.css" rel="stylesheet" type="text/css">
<link href="styles/widescreen.css" rel="stylesheet" type="text/css">
<!-- <link href="styles/smallscreen.css" rel="stylesheet" type="text/css"> -->
<title>Podcast1</title>
<link rel="shortcut icon" href="images/headphones_logo.png" />
</head>

@ -3,7 +3,8 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="styles/jquery-ui.css" rel="stylesheet" type="text/css">
<link href="styles/stylesheet.css" rel="stylesheet" type="text/css">
<link href="styles/widescreen.css" rel="stylesheet" type="text/css">
<!-- <link href="styles/smallscreen.css" rel="stylesheet" type="text/css"> -->
<title>Podcast2</title>
<link rel="shortcut icon" href="images/headphones_logo.png" />
</head>

@ -3,7 +3,8 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="styles/jquery-ui.css" rel="stylesheet" type="text/css">
<link href="styles/stylesheet.css" rel="stylesheet" type="text/css">
<link href="styles/widescreen.css" rel="stylesheet" type="text/css">
<!-- <link href="styles/smallscreen.css" rel="stylesheet" type="text/css"> -->
<title>Podcast3</title>
<link rel="shortcut icon" href="images/headphones_logo.png" />
</head>

@ -3,7 +3,8 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="styles/jquery-ui.css" rel="stylesheet" type="text/css">
<link href="styles/stylesheet.css" rel="stylesheet" type="text/css">
<link href="styles/widescreen.css" rel="stylesheet" type="text/css">
<!-- <link href="styles/smallscreen.css" rel="stylesheet" type="text/css"> -->
<title>Podcast4</title>
<link rel="shortcut icon" href="images/headphones_logo.png" />
</head>

@ -0,0 +1,663 @@
@media only screen and (max-width: 600px) {
body {
background: #F6F5F5;
font-family: "Old Standard TT";
font-size: 0.8rem;
line-height: 1.3;
letter-spacing: 1px;
padding: 20px;
/*transform: scale(1.0);*/
}
section {
margin-bottom: 50px;
margin-top: 20px;
}
a {
/*font-weight: normal;*/
text-decoration: none;
color: #A19696;
}
.active {
color: red;
font-size: 30px ;
}
.active-draggable{
width: 800px !important;
font-size: 14px;
}
a img {
line-height: 0px;
}
.navbar {
letter-spacing: 4px;
text-align: center;
}
.navbar a:hover {
background-color: #ddd;
color: black;
font-weight: thin;
}
.navbar a.active {
font-size: 40px;
font-weight: bold;
}
h2 {
text-align: center;
letter-spacing: 4px;
font-size: 16px;
margin: 5px;
margin-bottom: 10px;
color: red;
}
h3 {
font-size: 10px;
}
table, th, td {
vertical-align: top;
text-align: left;
border-collapse: separate;
padding:20px;
}
button {
width: 100px;
}
.short-description {
margin-left: 40%;
margin-right: 40%;
text-align: center;
}
.internet {
font-weight: regular;
font-size: 8px;
text-decoration: none;
}
.list a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}
.list {
padding-top: 10px;
padding-bottom: 10px;
padding-left: 0;
list-style: none;
border-top: 1px solid #47505e;
}
/* .mini-player {
background-size: 100% 100%;
background-image: url(/project/images/player.png);
cursor: pointer;
}*/
.audio-mini {
width: 50px;
}
.dropbtn {
font-family: "Old Standard TT";
font-weight: bold;
font-size: 24px;
color: black;
padding: 16px;
border: none;
cursor: pointer;
}
.dropbtn:hover, .dropbtn:focus {
background-color: pink;
}
.dropdown {
position: relative;
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
background-color: white;
min-width: 1900px;
overflow: auto;
z-index: 1;
}
.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}
.dropdown a:hover {
background-color: none;
}
.show {
display: block;
}
/*style internet sources*/
.dropbtn2 {
font-family: "Old Standard TT";
font-weight: regular;
font-size: 14px;
color: black;
padding: 16px;
cursor: pointer;
background-color: rgba(255, 255, 255, 0.9);
border: 1px;
border-style: solid;
border-color: black;
}
.dropbtn2:hover, .dropbtn2:focus {
background-color: pink;
}
.dropdown2 {
position: absolute;
display: inline-block;
}
.dropdown-content2 {
display: none;
position: absolute;
background-color: white;
min-width: 1000px;
overflow: auto;
z-index: 1;
border: 1px;
border-style: solid;
border-color: black;
right: 5px;
}
.dropdown-content2 a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}
.dropdown2 a:hover {
background-color: none;
}
.show2 {
display: block;
}
/*style list of podcasts*/
.dropbtn3 {
font-family: "Old Standard TT";
font-weight: regular;
font-size: 14px;
color: black;
padding: 16px;
border: none;
cursor: pointer;
}
.dropbtn3:hover, .dropbtn3:focus {
background-color: pink;
}
.dropdown3 {
position: relative;
display: inline-block;
}
.dropdown-content3 {
display: none;
position: absolute;
background-color: white;
min-width: 1000px;
overflow: auto;
z-index: 1;
}
.dropdown-content3 a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}
.dropdown3 a:hover {
background-color: none;
}
.show3 {
display: block;
}
/* Make the clips use as much space as possible, and
* also show a scrollbar when there are too many clips to show
* in the available space */
.sound-clips {
flex: 1;
overflow: auto;
}
/*section, article {
display: block;
}*/
.clip {
padding-bottom: 1rem;
}
/*audio {
width: 100%;
display: block;
margin: 1rem auto 0.5rem;
}*/
.clip p {
display: inline-block;
font-size: 0.7rem;
}
.clip button {
font-size: 0.7rem;
}
button.delete {
background: #f00;
padding: 0.5rem 0.75rem;
font-size: 0.5rem;
}
/* Checkbox hack to control information box display */
/*label {
font-size: 3rem;
position: absolute;
top: 2px;
right: 3px;
z-index: 5;
cursor: pointer;
}*/
input[type=checkbox] {
position: absolute;
top: -100px;
}
/*aside {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
transition: 0.3s all ease-out;
background-color: #efefef;
padding: 1rem;
}
aside p {
font-size: 1.2rem;
margin: 0.5rem 0;
}
aside a {
color: #666;
}
*/
/* Toggled State of information box */
input[type=checkbox]:checked ~ aside {
transform: translateX(0);
}
/* Cursor when clip name is clicked over */
.clip p {
cursor: pointer;
}
/*hover of images and transcriptions style*/
.tooltip-wrap {
position: relative;
}
.tooltip-wrap .tooltip-content-down {
display: none;
position: absolute;
z-index: 1;
top: 50px;
/*bottom: 100%;*/
left: 50px;
/*right: 100%;*/
padding: 0.2em;
background-color: white;
/*background-color: rgba(255, 255, 255, 0.8);*/
border: 1px;
border-style: solid;
border-color: black;
text-align: left;
min-width:600px;
}
.tooltip-wrap .tooltip-content-right {
display: none;
position: absolute;
z-index: 1;
top: 100%;
/*bottom: 100%;*/
left: 2%;
/*right: 100%;*/
padding: 0.2em;
background-color: pink;
border: none;
text-align: left;
min-width: 400px;
font-size: 20px;
}
.tooltip-wrap .tooltip-content-up {
display: none;
position: absolute;
z-index: 1;
/*top: 100%;*/
bottom: 100%;
left: 2%;
/*right: 100%;*/
padding: 0.2em;
background-color: rgba(255, 255, 255, 0.93);
border: 1px;
border-style: solid;
border-color: black;
text-align: left;
}
.tooltip-wrap:hover .tooltip-content-down {
display: block;
}
.tooltip-wrap:hover .tooltip-content-up {
display: block;
}
.tooltip-wrap:hover .tooltip-content-right {
display: block;
}
/*.tooltip-wrap:hover {
background-color: pink;
}
*/
/*transcript wrapper,text following audio style*/
#transcriptWrapper {
overflow: hidden;
}
#transcript > div {
transition: all 0.8s ease;
list-style-type: disc;
}
.speaking {
font-weight: bold;
}
#transcriptWrapper3 {
overflow: hidden;
}
#transcript3 > div {
transition: all 0.8s ease;
list-style-type: disc;
}
.speaking3 {
font-weight: bold;
}
/*one image next to the other*/
.column {
float: left;
width: 30%;
}
/* Clear floats after image containers */
.row::after {
content: "";
clear: both;
display: table;
}
/* Style the tab */
.tab {
overflow: hidden;
width: 100px;
}
/* Style the buttons inside the tab */
.tab button {
background-color: inherit;
border: 1px solid black;
outline: none;
cursor: pointer;
padding: 12px;
transition: 0.3s;
font-size: 10px;
width: 150px;
}
/* Change background color of buttons on hover */
.tab button:hover {
background-color: #ddd;
}
/* Create an active/current tablink class */
.tab button.active {
background-color: #ccc;
}
.tabpink {
overflow: hidden;
width: 100px;
}
.tabpink button {
background-color: inherit;
border: 1px solid black;
outline: none;
cursor: pointer;
padding: 12px;
transition: 0.3s;
font-size: 10px;
width: 150px;
}
.tabpink button:hover {
background-color: pink;
}
/* Create an active/current tablink class */
.tabpink button.active {
background-color: pink;
}
/* Style the tab content */
.tabcontent {
display: none;
padding: 6px 12px;
border: 1px solid black;
float: left;
position: absolute;
width: 800px;
z-index: 1;
background-color: white;
top: 5px;
}
/* Style the close button */
.topleft {
float: right;
cursor: pointer;
font-size: 18px;
}
.container .rowcircle {
margin: 25px;
text-align: center;
}
.container .rowcircle span {
margin: 0 200px;
/*margin-right: 90px;*/
}
.draggable {
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
background-color: white;
/* border:1px;
border-style:solid;
border-color:black;*/
cursor: all-scroll;
position: absolute !important;
width: 400px;
display: inline;
/* transform: scale(20);*/
/*min-height: 100px;*/
}
#img {
line-height: 0 !important;
}
.drag-content {
/*float: right;*/
font-weight: normal !important;
padding: 5px;
padding-bottom: 20px;
text-align: center;
/*font-size: 20px;*/
}
.scaleable-wrapper {
padding: 20px;
padding-bottom: 20px;
resize: both;
position: relative;
/*height: 400px;*/
/*min-height: 100px; */
}
.ui-resizable-se {
width: 10px;
height: 10px;
background: pink;
position: absolute;
bottom: 0;
right: 0;
}
#show1, #show2, #show3, #show4 {
display: none;
left: 20%;
width: 550px !important;
}
#box-title {
border: 1px solid;
background-color: white;
padding: 10px;
position: absolute;
}
/*for thesis html*/
#maintext {
margin-left: 400px;
margin-right: 400px;
margin-top: 5px;
}
.toc_title {
font-weight: 700;
text-align: center;
}
#toc_container li, #toc_container ul, #toc_container ul li {
list-style: outside none none !important;
}
li, #angela, #judith, #laurie, #dana, #katalin {
border-bottom: 1px dashed;
list-style: none;
color: #A19696;
}
.box_metadata {
background: white none repeat scroll 0 0;
border: 1px solid #aaa;
display: table;
font-size: 95%;
margin-bottom: 1em;
padding: 20px;
/*width: 1000px;*/
left: 0px;
position: absolute;
}
#metadata-thesis {
width:1000px;
}
/*# sourceMappingURL=stylesheet.css.map */
.status {
color: red;
}
/*#button_upload {
background-color: pink;
padding: 10px;
font-size: 20px;
}*/
#saved_msg {
color: red;
font-size: 20px;
}
/*reshuffle piles*/
.group_vowels {
position:absolute;
}
.group_photos {
position:absolute;
}
.group_extracts {
position:absolute;
}
.group_metadata {
position:absolute;
}
}

@ -1,3 +1,4 @@
/*@media only screen and (min-width: 900px) {*/
body {
background: #F6F5F5;
font-family: "Old Standard TT";
@ -21,12 +22,12 @@ a {
.active {
color: red;
font-size: 40px ;
font-size: 95% ;
}
.active-draggable{
width: 800px !important;
font-size: 24px;
width: 70% !important;
font-size: 100%;
}
a img {
@ -52,7 +53,7 @@ a img {
h2 {
text-align: center;
letter-spacing: 4px;
font-size: 26px;
font-size: 100%;
margin: 5px;
margin-bottom: 10px;
color: red;
@ -60,7 +61,7 @@ h2 {
}
h3 {
font-size: 20px;
font-size: 95%;
}
table, th, td {
@ -657,4 +658,6 @@ li, #angela, #judith, #laurie, #dana, #katalin {
.group_metadata {
position:absolute;
}
}
/*}*/

@ -0,0 +1,676 @@
/*@media only screen and (min-width: 900px) {*/
body {
background: #F6F5F5;
font-family: "Old Standard TT";
font-size: 95%;
line-height: 1.3;
letter-spacing: 1px;
padding: 20px;
/*transform: scale(1.0);*/
}
section {
margin-bottom: 50px;
margin-top: 20px;
}
a {
/*font-weight: normal;*/
text-decoration: none;
color: #A19696;
}
.active {
color: red;
font-size: 120% ;
}
.active-draggable{
width: 30% !important;
font-size: 110%;
}
a img {
line-height: 0px;
}
.navbar {
letter-spacing: 4px;
text-align: center;
}
.navbar a:hover {
background-color: #ddd;
color: black;
font-weight: thin;
}
.navbar a.active {
font-size: 50px;
font-weight: bold;
}
h1 {
font-size: 180%;
}
h2 {
text-align: center;
letter-spacing: 4px;
font-size: 120%;
margin: 5px;
margin-bottom: 10px;
color: red;
}
h3 {
font-size: 95%;
text-align: center;
}
table, th, td {
vertical-align: top;
text-align: left;
border-collapse: separate;
padding:20px;
}
button {
width: 100px;
}
.short-description {
margin-left: 40%;
margin-right: 40%;
text-align: center;
}
.internet {
font-weight: regular;
font-size: 70%;
text-decoration: none;
}
.list a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}
.list {
padding-top: 10px;
padding-bottom: 10px;
padding-left: 0;
list-style: none;
border-top: 1px solid #47505e;
}
/* .mini-player {
background-size: 100% 100%;
background-image: url(/project/images/player.png);
cursor: pointer;
}*/
.audio-mini {
width: 50px;
}
.dropbtn {
font-family: "Old Standard TT";
font-weight: bold;
font-size: 24px;
color: black;
padding: 16px;
border: none;
cursor: pointer;
}
.dropbtn:hover, .dropbtn:focus {
background-color: pink;
}
.dropdown {
position: relative;
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
background-color: white;
min-width: 1900px;
overflow: auto;
z-index: 1;
}
.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}
.dropdown a:hover {
background-color: none;
}
.show {
display: block;
}
/*style internet sources*/
.dropbtn2 {
font-family: "Old Standard TT";
font-weight: regular;
font-size: 24px;
color: black;
padding: 16px;
cursor: pointer;
background-color: rgba(255, 255, 255, 0.9);
border: 1px;
border-style: solid;
border-color: black;
}
.dropbtn2:hover, .dropbtn2:focus {
background-color: pink;
}
.dropdown2 {
position: absolute;
display: inline-block;
}
.dropdown-content2 {
display: none;
position: absolute;
background-color: white;
min-width: 1000px;
overflow: auto;
z-index: 1;
border: 1px;
border-style: solid;
border-color: black;
right: 5px;
}
.dropdown-content2 a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}
.dropdown2 a:hover {
background-color: none;
}
.show2 {
display: block;
}
/*style list of podcasts*/
.dropbtn3 {
font-family: "Old Standard TT";
font-weight: regular;
font-size: 24px;
color: black;
padding: 16px;
border: none;
cursor: pointer;
}
.dropbtn3:hover, .dropbtn3:focus {
background-color: pink;
}
.dropdown3 {
position: relative;
display: inline-block;
}
.dropdown-content3 {
display: none;
position: absolute;
background-color: white;
min-width: 1000px;
overflow: auto;
z-index: 1;
}
.dropdown-content3 a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}
.dropdown3 a:hover {
background-color: none;
}
.show3 {
display: block;
}
/* Make the clips use as much space as possible, and
* also show a scrollbar when there are too many clips to show
* in the available space */
.sound-clips {
flex: 1;
overflow: auto;
}
/*section, article {
display: block;
}*/
.clip {
padding-bottom: 1rem;
}
/*audio {
width: 100%;
display: block;
margin: 1rem auto 0.5rem;
}*/
.clip p {
display: inline-block;
font-size: 1rem;
}
.clip button {
font-size: 1rem;
}
button.delete {
background: #f00;
padding: 0.5rem 0.75rem;
font-size: 0.8rem;
}
/* Checkbox hack to control information box display */
/*label {
font-size: 3rem;
position: absolute;
top: 2px;
right: 3px;
z-index: 5;
cursor: pointer;
}*/
input[type=checkbox] {
position: absolute;
top: -100px;
}
/*aside {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: translateX(100%);
transition: 0.3s all ease-out;
background-color: #efefef;
padding: 1rem;
}
aside p {
font-size: 1.2rem;
margin: 0.5rem 0;
}
aside a {
color: #666;
}
*/
/* Toggled State of information box */
input[type=checkbox]:checked ~ aside {
transform: translateX(0);
}
/* Cursor when clip name is clicked over */
.clip p {
cursor: pointer;
}
/*hover of images and transcriptions style*/
.tooltip-wrap {
position: relative;
text-decoration: underline;
}
.tooltip-wrap .tooltip-content-down {
display: none;
position: absolute;
z-index: 1;
top: 50%;
/*bottom: 100%;*/
left: 50%;
/*right: 100%;*/
padding: 0.2em;
background-color: white;
/*background-color: rgba(255, 255, 255, 0.8);*/
border: 1px;
border-style: solid;
border-color: black;
text-align: left;
min-width:200%;
}
.tooltip-wrap .tooltip-content-right {
display: none;
position: absolute;
z-index: 1;
top: 100%;
/*bottom: 100%;*/
left: 2%;
/*right: 100%;*/
padding: 0.2em;
background-color: pink;
border: none;
text-align: left;
min-width: 400%;
font-size: 90%;
}
.tooltip-wrap .tooltip-content-up {
display: none;
position: absolute;
z-index: 1;
/*top: 100%;*/
bottom: 100%;
left: 2%;
/*right: 100%;*/
padding: 0.2em;
background-color: rgba(255, 255, 255, 0.93);
border: 1px;
border-style: solid;
border-color: black;
text-align: left;
}
.tooltip-wrap:hover .tooltip-content-down {
display: block;
}
.tooltip-wrap:hover .tooltip-content-up {
display: block;
}
.tooltip-wrap:hover .tooltip-content-right {
display: block;
}
/*.tooltip-wrap:hover {
background-color: pink;
}
*/
/*transcript wrapper,text following audio style*/
#transcriptWrapper {
overflow: hidden;
}
#transcript > div {
transition: all 0.8s ease;
list-style-type: disc;
}
.speaking {
font-weight: bold;
}
#transcriptWrapper3 {
overflow: hidden;
}
#transcript3 > div {
transition: all 0.8s ease;
list-style-type: disc;
}
.speaking3 {
font-weight: bold;
}
/*one image next to the other*/
.column {
float: left;
width: 30%;
}
/* Clear floats after image containers */
.row::after {
content: "";
clear: both;
display: table;
}
/* Style the tab */
.tab {
overflow: hidden;
width: 20%;
}
/* Style the buttons inside the tab */
.tab button {
background-color: inherit;
border: 1px solid black;
outline: none;
cursor: pointer;
padding: 12px;
transition: 0.3s;
font-size: 80%;
width: 30%;
}
/* Change background color of buttons on hover */
.tab button:hover {
background-color: #ddd;
}
/* Create an active/current tablink class */
.tab button.active {
background-color: #ccc;
}
.tabpink {
overflow: hidden;
width: 50%;
}
.tabpink button {
background-color: inherit;
border: 1px solid black;
outline: none;
cursor: pointer;
padding: 12px;
transition: 0.3s;
font-size: 10%;
width: 50%;
}
.tabpink button:hover {
background-color: pink;
}
/* Create an active/current tablink class */
.tabpink button.active {
background-color: pink;
}
/* Style the tab content */
.tabcontent {
display: none;
padding: 6px 12px;
border: 1px solid black;
float: left;
position: absolute;
width: 40%;
z-index: 1;
background-color: white;
top: 5px;
}
/* Style the close button */
.topleft {
float: right;
cursor: pointer;
font-size: 100%;
}
.container .rowcircle {
margin: 25px;
text-align: center;
}
.container .rowcircle span {
margin: 0 200px;
/*margin-right: 90px;*/
}
.draggable {
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
background-color: white;
/* border:1px;
border-style:solid;
border-color:black;*/
cursor: all-scroll;
position: absolute !important;
width: 20%;
display: inline;
/* transform: scale(20);*/
/*min-height: 100px;*/
}
.draggable p {
text-align: center;
color: #A19696;
}
#img {
line-height: 0 !important;
}
.drag-content {
/*float: right;*/
font-weight: normal !important;
padding: 0.8%;
padding-bottom: 0.8%;
text-align: center;
}
.scaleable-wrapper {
padding: 0.8%;
padding-bottom: 0.8%;
resize: both;
position: relative;
/*height: 400px;*/
/*min-height: 100px; */
}
.ui-resizable-se {
width: 10px;
height: 10px;
background: pink;
position: absolute;
bottom: 0;
right: 0;
}
#show1, #show2, #show3, #show4 {
display: none;
left: 20%;
width: 23% !important;
}
#box-title {
border: 1px solid;
background-color: white;
padding: 10px;
position: absolute;
}
/*for thesis html*/
#maintext {
width: 120%;
margin-top: 2%;
}
.toc_title {
font-weight: 700;
text-align: center;
}
#toc_container li, #toc_container ul, #toc_container ul li {
list-style: outside none none !important;
}
li, #angela, #judith, #laurie, #dana, #katalin {
border-bottom: 1px dashed;
list-style: none;
color: #A19696;
}
.box_metadata {
background: white none repeat scroll 0 0;
border: 1px solid #aaa;
display: table;
font-size: 95%;
margin-bottom: 1em;
padding: 20px;
/*width: 1000px;*/
left: 0px;
position: absolute;
}
#metadata-thesis {
width:50%;
}
/*# sourceMappingURL=stylesheet.css.map */
.status {
color: red;
}
/*#button_upload {
background-color: pink;
padding: 10px;
font-size: 20px;
}*/
#saved_msg {
color: red;
font-size: 100%;
}
/*reshuffle piles*/
.group_vowels {
position:absolute;
}
.group_photos {
position:absolute;
}
.group_extracts {
position:absolute;
}
.group_metadata {
position:absolute;
}
.audio-tag {
width: 100%;
}
/*}*/

@ -3,7 +3,8 @@
<head>
<title>Let' s Talk About Unspeakable Things</title>
</head>
<link href="styles/stylesheet.css" rel="stylesheet" type="text/css">
<link href="styles/widescreen.css" rel="stylesheet" type="text/css">
<!-- <link href="styles/smallscreen.css" rel="stylesheet" type="text/css"> -->
<link href="styles/jquery-ui.css" rel="stylesheet" type="text/css">
<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>
@ -14,150 +15,164 @@
h1,h2 {
text-align: center !important;
}
h2 {
color: black;
}
.draggable {
padding:0 !important;
}
.tooltip-content-right {
min-width: 40% !important;
}
</style>
<body>
<div align="center"><br><br><span style="font-size: 30px;" ><b>Let' s Talk About Unspeakable Things</b></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:pink;">by Angeliki Diakrousi</span></div><br><br>
<div style="width:1800px; margin:0 auto;">
<div class="draggable scaleable-wrapper" style="width: 700px !important;right: 100px;top: 200px;">
<div>
<p class="toc_title">Contents</p>
<ul class="toc_list">
<li><a href="#introduction">Introduction</a>
</li>
<li><a href="#the-monstrosity-of-female-voices">1. The Monstrosity of the female voices</a></li>
<ul>
<li><a href="#what-modes-the-annoying-noise">What modes: the annoying noise</a></li>
<li><a href="#mechanisms-of-marginalization">Mechanisms of marginalization</a></li>
<li><a href="#shut-out-of-the-public-opposition-of-public-and-private-space">Shut out of the public: Separation of public and private space</a></li>
<li><a href="#the-roots-of-collective-voice">The Roots of Collective Voice</a></li>
</ul>
<li><a href="#multiplication-vis-a-vis-amplification">2. Multiplication Vis a Vis Amplification</a></li>
<ul>
<li><a href="#the-mediation-of-voice-through-multiplication">The mediation of voice through multiplication</a></li>
<li><a href="#the-mediation-of-voice-through-amplification">The mediation of voice through amplification</a></li>
</ul>
<li><a href="#transmitting-ugly-things">3. Transmitting Ugly Things</a></li>
<ul>
<li><a href="#what-ugly-things-and-the-medium">What ugly things, and the medium</a></li>
<li><a href="#streaming-media-in-relation-to-female-continuity">Streaming media in relation to female continuity</a></li>
<li><a href="#for-an-agonistic-streaming">For an agonistic streaming</a></li>
</ul>
<li><a href="#general-conclusion">General conclusion</a></li>
</ul>
</div>
</div>
<!-- draggable menu-->
<div class="draggable scaleable-wrapper" style="top: 740px; right: 300px;">
<div class="draggable scaleable-wrapper" style="top: 135%; right: 2%;">
<h2><a href="amplification.php">Amplification of female voices</a></h2>
<div class="drag-content">
(workshops)
</div>
</div>
<div class="draggable scaleable-wrapper" style="top: 948.6px; right: 30px;">
<div class="draggable scaleable-wrapper" style="top: 120%; right: 3%;">
<h2 ><a href="diary.php">Diary of West Rotterdam</a></h2>
<div class="drag-content">
(first experiments)
</div>
</div>
<div class="draggable scaleable-wrapper" style="top: 848.533px; right: 5px;">
<div class="draggable scaleable-wrapper" style="top: 130%; left: 1%;">
<h2 ><a href="player.php">Player</a></h2>
<div class="drag-content">
(audio archive)
</div>
</div>
<div class="draggable scaleable-wrapper" style="top: 540px; right: 1900px;">
<div class="draggable scaleable-wrapper" style="top: 110%; left: 2%;">
<h2 ><a href="index.php">About</a></h2>
<div class="drag-content">
(main page)
</div>
</div>
<div class="draggable scaleable-wrapper" style="top: 270px; right: 1300px;z-index: 1;">
<div class="draggable scaleable-wrapper" style="top: 80%; right: 4%;">
<h2 ><a href="podcast4.php">Podcast4</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 220px; right: 10px;">
<div class="draggable scaleable-wrapper" style="top: 100%; right: 3%;">
<h2 ><a href="podcast1.php">Podcast1</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 320px; right: 100px;">
<div class="draggable scaleable-wrapper" style="top: 90%; right: 5%;">
<h2 ><a href="podcast2.php">Podcast2</a></h2>
</div>
<div class="draggable scaleable-wrapper" style="top: 420px; right: 80px;">
<div class="draggable scaleable-wrapper" style="top: 110%; right: 3%;">
<h2 ><a href="podcast3.php">Podcast3</a></h2>
</div>
<div class="draggable scaleable-wrapper active-draggable" style="top: 30%; left: 5%; z-index: 9;">
<div class="draggable scaleable-wrapper active-draggable" style="top: 30%; left: 2%; z-index: 9;">
<h2 ><a class="active" href="thesis-angeliki.php">"Let' s Talk About Unspeakable Things"</a></h2>
<div class="drag-content">
<?php include 'texts/thesis-summary.txt'; ?>
</div>
</div>
<div style="width:30%; margin:0 auto;">
<div class="draggable scaleable-wrapper active-draggable" style="width: 30% !important;right: 2%;top: 2%;">
<div>
<h3 class="active">Contents</h3>
<ul class="toc_list">
<li><a href="#introduction">Introduction</a>
</li>
<li><a href="#the-monstrosity-of-female-voices">1. The Monstrosity of the female voices</a></li>
<ul>
<li><a href="#what-modes-the-annoying-noise">What modes: the annoying noise</a></li>
<li><a href="#mechanisms-of-marginalization">Mechanisms of marginalization</a></li>
<li><a href="#shut-out-of-the-public-opposition-of-public-and-private-space">Shut out of the public: Separation of public and private space</a></li>
<li><a href="#the-roots-of-collective-voice">The Roots of Collective Voice</a></li>
</ul>
<li><a href="#multiplication-vis-a-vis-amplification">2. Multiplication Vis a Vis Amplification</a></li>
<ul>
<li><a href="#the-mediation-of-voice-through-multiplication">The mediation of voice through multiplication</a></li>
<li><a href="#the-mediation-of-voice-through-amplification">The mediation of voice through amplification</a></li>
</ul>
<li><a href="#transmitting-ugly-things">3. Transmitting Ugly Things</a></li>
<ul>
<li><a href="#what-ugly-things-and-the-medium">What ugly things, and the medium</a></li>
<li><a href="#streaming-media-in-relation-to-female-continuity">Streaming media in relation to female continuity</a></li>
<li><a href="#for-an-agonistic-streaming">For an agonistic streaming</a></li>
</ul>
<li><a href="#general-conclusion">General conclusion</a></li>
</ul>
</div>
</div>
<!-- draggable images -->
<div class="draggable scaleable-wrapper" style="top: 2713px;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 scaleable-wrapper" style="top: 2713px;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="100%"></a><div class="tooltip-content-right"><div>Figure 1: Describing how female voices sound like
</div></div></div></div>
<div class="draggable scaleable-wrapper" style="top: 3000px;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></div></div></div>
<div class="draggable scaleable-wrapper" style="top: 3000px;left: 1247px;"><div class="tooltip-wrap" style="text-decoration:underline;"><iframe width="91%" height="200px" src="https://www.youtube.com/embed/TY96Ma6YdtQ" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe><div class="tooltip-content-right">Figure 2: Vocal performance of Katalin Ladik</div></div></div>
<div class="draggable scaleable-wrapper" style="top: 3468px; 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="100%"></a><div class="tooltip-content-right"><div>Figure 3: Cartoon from Riana Dunkan
</div></div></div></div>
<div class="draggable scaleable-wrapper" style="top: 3980px; 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="100%"></a><div class="tooltip-content-right"><div>Figure 4: Cartoon from Gonzalo Rocha
</div></div></div></div>
<div class="draggable scaleable-wrapper" style="top: 4150px;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></div></div></div>
<div class="draggable scaleable-wrapper" style="top: 4150px;left: 1482px;"><div class="tooltip-wrap" style="text-decoration:underline;"><iframe width="91%" height="200px" src="https://www.youtube.com/embed/SirOxIeuNDE" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe><div class="tooltip-content-right">Figure 5: Performance from Laurie Anderson</div></div></div>
<div class="draggable scaleable-wrapper" style="top: 5836px; 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></div></div></div>
<div class="draggable scaleable-wrapper" style="top: 6463px; 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="100%"></a><div class="tooltip-content-right"><div>Figure 7: 'Mikrophoniki' demonstration in Athens
</div></div></div></div>
<div class="draggable scaleable-wrapper" style="top: 6721px; 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="100%"></a><div class="tooltip-content-right"><div>Figure 8: Speech Matters: Violence and the Feminist Voice
</div></div></div></div>
<div class="draggable scaleable-wrapper" style="top: 7805px; 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="100%"></a><div class="tooltip-content-right"><div>Figure 9: 'The Broadcast Cart' of Miranda Zúñiga transmitting
</div></div></div></div>
<div class="draggable scaleable-wrapper" style="top: 9343px;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="100%"></a><div class="tooltip-content-right"><div>Figure 10: A sculpture of Baubo, goddess of sacred and sexual humor
</div></div></div></div>
<div class="draggable scaleable-wrapper" 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="100%"></a><div class="tooltip-content-right"><div>Figure 11: Live streaming from Occupy Wall Street
</div></div></div></div>
<!-- end of draggable images -->
<div class="draggable scaleable-wrapper box_metadata" id="metadata-thesis" >
<p></p><p></p><p>Name: Angeliki Diakrousi<br />
</p><p>Title: Let's Talk About Unspeakable Things<br />
</p><p>Student number: 0956090<br />
</p><p>Thesis, in partial fulfillment of the requirements for the final examination for Master of Arts in Fine Art and Design: Experimental Publishing. Piet Zwart Institute, Willem de Kooning Academy.<br />
</p><p>Adviser: Steve Rushton<br />
</p><p>Second Reader: Kate Briggs</p><p>Word count: 8380</p><p> </p><p></p><p> </p>
<li>Author: Angeliki Diakrousi</li>
<li>Title: Let's Talk About Unspeakable Things</li>
<li>Student number: 0956090</li>
<li>Thesis, in partial fulfillment of the requirements for the final examination for Master of Arts in Fine Art and Design: Experimental Publishing. Piet Zwart Institute, Willem de Kooning Academy.</li>
<li>Adviser: Steve Rushton</li>
<li>Second Reader: Kate Briggs</li>
<li>Word count: 8380</li>
</div>
<div id="maintext">

Loading…
Cancel
Save