added texts and images in player

master
Angeliki 5 years ago
parent 4b40dcf3e5
commit 92a796c1bc

@ -1,70 +0,0 @@
1
00:00:11,740 --> 00:00:18,060
Em... I hear... It sounds like walking and it's quite windy outside
2
00:00:18,620 --> 00:00:25,460
But it sounds like... It's... The microphone is inside or something
3
00:00:26,980 --> 00:00:29,340
It's probably music
4
00:00:30,320 --> 00:00:35,700
From a car maybe or from some radio?
5
00:00:37,600 --> 00:00:42,400
It's outside on the street. I hear some cars in the background
6
00:00:48,700 --> 00:00:53,600
Mmmm... It sounds like gardening sounds
7
00:00:54,820 --> 00:00:59,040
There are people in the background or maybe it's bikes
8
00:01:05,840 --> 00:01:08,500
Oh I hear a bird in the background
9
00:01:12,120 --> 00:01:16,440
A very monotone sound
10
00:01:16,740 --> 00:01:21,180
It's like driving, maybe driving in a car
11
00:01:35,120 --> 00:01:36,580
And some wind around
It seems like outside but there is some noise in the background
12
00:01:36,580 --> 00:01:36,600
It seems like outside but there is some noise in the background
13
00:01:46,340 --> 00:01:48,460
It's outside
14
00:02:04,920 --> 00:02:04,940
Oh, I hear children in the background crying
15
00:02:04,940 --> 00:02:08,360
There is some weird sound in the foreground, which I... It's hard to describe [chuckling]
Oh, I hear children in the background crying
16
00:02:08,360 --> 00:02:08,440
There is some weird sound in the foreground, which I... It's hard to describe [chuckling]
17
00:02:14,900 --> 00:02:19,580
Again it sounds like there is a kindergarten or school nearby

Before

Width:  |  Height:  |  Size: 557 KiB

After

Width:  |  Height:  |  Size: 557 KiB

Before

Width:  |  Height:  |  Size: 1.2 MiB

After

Width:  |  Height:  |  Size: 1.2 MiB

Before

Width:  |  Height:  |  Size: 1.1 MiB

After

Width:  |  Height:  |  Size: 1.1 MiB

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

@ -20,7 +20,7 @@
<div class="tooltip-wrap">
<audio ontimeupdate="playTranscript()" style="width: 100%; background: #222;" id="a2" controls src="audio/description-lidia-CUT.mp3"></audio>
<div class="tooltip-content">
<div class="tooltip-content-down">
<div id="transcriptWrapper" class='sub'>
<h3>Lidia</h3>
<div id="transcript">

@ -47,8 +47,10 @@
<audio controls src="audio/leeszaal-meetings-choir.mp3"></audio>singing vowels @Leeszaal
<div class="tooltip-content-down">
<div class="row">
<div class="column"><img src="images/vowels-20190328-leeszaal.jpg" width="500px" />
<div class="column"><img src="images/vowels-20190328-leeszaal.jpg" width="500px">
</div>
<!-- <div class="column"><img src="images/meeting-20190328-leeszaal-5.JPG" width="500px">
</div> -->
</div>
</div>
@ -58,27 +60,58 @@
<div style="position:absolute; top:20%; left:63%;">
<audio controls src="audio/description-alex2.mp3"></audio>describing/annotating
</div>
<div style="position:absolute; top:30%; left:70%;">
<audio controls src="audio/finearts-meeting-discussion.mp3"></audio>discussing about voice in public @Fine Arts
</div>
<div style="position:absolute; top:42%; left:75%;">
<audio controls src="audio/leeszaal-meetings-transcribing.mp3"></audio>transcribing vowels @Leeszaal
</div>
<div class="tooltip-wrap" style="position:absolute; top:55%; left:69%;">
<audio controls src="audio/finearts-meeting-choir.mp3"></audio>singing vowels @Fine Arts
<div class="tooltip-content-up">
<div class="row">
<div class="column"><img src="images/vowels-20190329-finearts.jpg" width="500px" />
</div>
</div>
<div class="tooltip-wrap" style="position:absolute; top:30%; left:70%;">
<audio controls src="audio/finearts-meeting-discussion.mp3"></audio>discussing about voice in public @Fine Arts
<div class="tooltip-content-down">
<table>
<tr>
<td><img src="images/meeting-20190329-finearts-1.JPG" width="500px" />
</td>
</tr>
</table>
</div>
</div>
<div class="tooltip-wrap" style="position:absolute; top:42%; left:75%;">
<audio controls src="audio/leeszaal-meetings-transcribing.mp3"></audio>transcribing vowels @Leeszaal
<div class="tooltip-content-down">
<div class="row">
<div class="column"><img src="images/meeting-20190328-leeszaal-1.JPG" width="500px" />
</div>
</div>
</div>
</div>
<div style="position:absolute; top:65%; left:63%;">
<audio controls src="audio/selectionB.mp3"></audio>city sounds
</div>
<div class="tooltip-wrap" style="position:absolute; top:55%; left:69%;">
<audio controls src="audio/finearts-meeting-choir.mp3"></audio>singing vowels @Fine Arts
<div class="tooltip-content-down">
<div class="row">
<div class="column"><img src="images/vowels-20190329-finearts.jpg" width="500px" />
</div>
</div>
</div>
</div>
<div class="tooltip-wrap" style="position:absolute; top:65%; left:63%;">
<audio controls src="audio/selectionB.mp3"></audio>city sounds
<div class="tooltip-content-up">
<table>
<tr>
<td><img src="images/soundwalk-photo1.jpg" width="300px" />
</td>
<td><img src="images/soundwalk-photo3.jpg" width="300px" />
</td>
</tr>
</table>
</div>
</div>
<div style="position:absolute; top:70%; left:53%;">
<audio controls src="audio/description-eugenie-CUT-SHORT.mp3"></audio>describing/annotating
</div>
@ -90,19 +123,50 @@
</div>
<div style="position:absolute; top:46%; left:28%;;">
<audio controls src="audio/leeszaal-meetings-discussion.mp3"></audio>discussing about voice in public @Leeszaal
</div>
<div class="tooltip-wrap" style="position:absolute; top:46%; left:28%;">
<audio controls src="audio/leeszaal-meetings-discussion.mp3"></audio>discussing about voice in public @Leeszaal
<div class="tooltip-content-up">
<table>
<tr>
<td><img src="images/meeting-20190328-leeszaal-2.JPG" width="500px" />
</td>
</tr>
</table>
</div>
</div>
<div style="position:absolute; top:66%; left:41%;;">
<audio controls src="audio/finearts-meeting-warming.mp3"></audio>warming up @Fine Arts
</div>
<div style="position:absolute; top:23%; left:32%;">
<audio controls src="audio/finearts-meeting-transcribing.mp3"></audio>transcribing vowels @Fine Arts
</div>
<div class="tooltip-wrap" style="position:absolute; top:23%; left:32%;">
<audio controls src="audio/finearts-meeting-transcribing.mp3"></audio>transcribing vowels @Fine Arts
<div class="tooltip-content-down">
<table>
<tr>
<td><img src="images/meeting-20190329-finearts-2.JPG" width="500px" />
</td>
</tr>
</table>
</div>
</div>
<div style="position:absolute; top:27%; left:29%;">
<audio controls src="audio/finearts-meeting-extracts.mp3"></audio>reading extracts @Fine Arts
</div>
<div class="tooltip-wrap" style="position:absolute; top:27%; left:29%;">
<audio controls src="audio/finearts-meeting-extracts.mp3"></audio>reading extracts @Fine Arts
<div class="tooltip-content-down">
<table>
<tr>
<td><img src="images/carson-extract.jpg" width="500px" />
</td>
<td><img src="images/fresh1.jpg" width="500px" />
</td>
<td><img src="images/fresh2.jpg" width="500px" />
</td>
</tr>
</table>
</div>
</div>
</section>

@ -271,12 +271,13 @@ cursor: pointer;
/*bottom: 100%;*/
left: 2%;
/*right: 100%;*/
padding: .5em;
padding: .2em;
background-color: rgba(255, 255, 255, 0.9) ;
border:1px;
border-style:solid;
border-color:black;
}
.tooltip-wrap .tooltip-content-up {
display: none;
@ -286,7 +287,7 @@ cursor: pointer;
bottom: 100%;
left: 2%;
/*right: 100%;*/
padding: .5em;
padding: .2em;
background-color: rgba(255, 255, 255, 0.9) ;
border:1px;
border-style:solid;

Loading…
Cancel
Save