add sounds in feedback composition

project/README.md

@@ -3,3 +3,6 @@ This is about writing my thesis with git so to keep track of my writing and expe
 Here is where me and others meet in the text. Here is others people proof readings on my texts.
 
 https://pad.xpub.nl/p/thesis-angeliki
+
+# Srttojs
+python3 srttojs.py description-alex1-A.srt 

project/description-alex1-A.srt

@@ -0,0 +1,70 @@
+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
+

project/description-alex2-B.srt

@@ -0,0 +1,84 @@
+1
+00:00:07,820 --> 00:00:11,560
+There is teenagers nearby and it's walking
+
+2
+00:00:11,700 --> 00:00:13,700
+Oh, there is water
+
+3
+00:00:15,240 --> 00:00:17,700
+That's running
+
+4
+00:00:20,660 --> 00:00:22,520
+Outside probably
+
+5
+00:00:28,880 --> 00:00:36,180
+Oh, that's... It sounds like there is something clapping or like hitting against a surface
+
+6
+00:00:38,520 --> 00:00:42,180
+And it's very repetitive sound
+
+7
+00:00:46,600 --> 00:00:51,400
+Oh, I can hear some, some radio or some music or broadcast
+
+8
+00:01:00,200 --> 00:01:03,100
+That was too short. I don't know [chuckling]
+
+9
+00:01:04,440 --> 00:01:11,560
+Oh, it's quite loud. It's... Maybe it's in some kind of transport
+
+10
+00:01:16,220 --> 00:01:19,540
+Oh, there is a child speaking
+
+11
+00:01:25,740 --> 00:01:32,320
+There are people talking outside... In a foreign language
+
+12
+00:01:36,280 --> 00:01:40,540
+It's not Dutch and there is some wind
+
+13
+00:01:42,320 --> 00:01:44,800
+There are more people talking
+
+14
+00:01:52,760 --> 00:01:55,520
+Oh, there is sounds like there are construction works
+
+15
+00:01:56,720 --> 00:01:58,400
+Or hammering
+
+16
+00:02:00,920 --> 00:02:07,080
+Oh, it's very loud. Oh [chuckling], it's applause or... a crowd of people.  I don't know [chuckling]
+
+17
+00:02:12,060 --> 00:02:17,640
+It's inside. It sounds like a hallway... I don't know. Like inside
+
+18
+00:02:18,260 --> 00:02:20,040
+Because I hear some echoing
+
+19
+00:02:22,560 --> 00:02:26,800
+Ot it's inside a tunnel, where people are passing by
+
+20
+00:02:38,200 --> 00:02:44,760
+It sounds like near some street outside and I hear some kids in the background
+
+21
+00:02:46,600 --> 00:02:50,000
+Again, there is a child screaming or crying
+

project/description-tommi-B.srt

@@ -0,0 +1,73 @@
+1
+00:00:12,980 --> 00:00:17,680
+This is some water ** maybe from a fountain
+
+
+2
+00:01:01,480 --> 00:01:02,500
+Plates
+
+3
+00:01:04,440 --> 00:01:09,780
+A bus at stand by at a bus stop
+
+4
+00:01:10,020 --> 00:01:11,840
+Some people are chatting
+
+5
+00:01:16,940 --> 00:01:21,480
+Some kids talking talking while they are playing in the sand or something
+
+6
+00:01:27,940 --> 00:01:31,740
+Two people having a conversation on a street
+
+7
+00:01:36,280 --> 00:01:38,840
+One of them is walking away [chuckling]
+
+8
+00:01:42,100 --> 00:01:44,540
+And now a car is passing
+
+9
+00:01:50,600 --> 00:01:52,980
+It's a construction site
+
+10
+00:01:53,300 --> 00:01:55,140
+Something is being hammered
+
+11
+00:02:01,200 --> 00:02:04,160
+Some sports match or something
+
+12
+00:02:04,160 --> 00:02:05,820
+Everyone is **
+
+13
+00:02:12,540 --> 00:02:15,680
+Someone is speaking Arabic
+
+14
+00:02:18,760 --> 00:02:21,280
+To a group of people
+
+15
+00:02:22,760 --> 00:02:27,340
+It's like a very large voluminous space [chuckling] cause it's echoing a lot
+
+16
+00:02:36,760 --> 00:02:40,180
+Some people are shouting at something at a distance
+
+17
+00:02:43,760 --> 00:02:45,440
+ It sounds like in a courtyard
+
+18
+00:02:46,540 --> 00:02:48,040
+A baby crying
+

project/overlapping-interface.html

@@ -16,12 +16,27 @@
 Experiment: I listen and record carefully sounds from the area that are coming from different spaces and voices. Exploring the private and public. Asking inhabitants to describe these sounds.</em>
 </section> -->
 
+<section>
 <div>
-<audio style="width: 100%; background: #222;" id="a1" controls src="description-lidia-CUT.mp3"></audio>
-<audio style="width: 100%; background: #222;" id="a2" controls src="selection-track-extracts-1.mp3"></audio>
+<audio style="width: 100%; background: #FFFFFF;" id="a1" controls src="selection-track-extracts-1.mp3"></audio>
+<audio style="width: 100%; background: #222;" id="a2" controls src="description-lidia-CUT.mp3"></audio>
 <audio style="width: 100%; background: #222;" id="a3" controls src="description-eugenie-CUT-SHORT.mp3"></audio>
-<button id="b">listen</button>
+<audio style="width: 100%; background: #222;" id="a4" controls src="description-alex1.mp3"></audio>
+<button id="but">listen</button>
 </div>
+</section>
+
+<section>
+<div>
+<audio style="width: 100%; background: #FFFFFF;" id="b1" controls src="selectionB.mp3"></audio>
+<audio style="width: 100%; background: #222;" id="b2" controls src="description-tommi.mp3"></audio>
+<audio style="width: 100%; background: #222;" id="b3" controls src="description-alex2.mp3"></audio>
+<button id="butB">listen</button>
+</div>
+</section>
+
+
+
 <table>  <tr>
     <td>
       <div class='sub'>
@@ -38,8 +53,8 @@ Experiment: I listen and record carefully sounds from the area that are coming f
 </div>
     </td>
     <td>
-      <div class='sub'>
-  <h3>Eugenie</h3>
+<div class='sub'>
+<h3>Eugenie</h3>
 <div><a data-start="1.8" href="#">00:00:01,800</a> Children outside</div>
 <div><a data-start="10.76" href="#">00:00:10,760</a> I think it's outside</div>
 <div><a data-start="13.7" href="#">00:00:13,700</a> Shoes, walking people</div>
@@ -52,13 +67,90 @@ Experiment: I listen and record carefully sounds from the area that are coming f
 <div><a data-start="90.9" href="#">00:01:30,900</a> People in a room. Inside. They are moving, close</div>
 <div><a data-start="114.62" href="#">00:01:54,620</a> It's inside somewhere, somewhere...</div>
 <div><a data-start="135.4" href="#">00:02:15,400</a> Children in a swimming pool</div>
+</div>
+    </td>
+    <td>
+<div class='sub'>
+  <h3>Alex</h3>
+<div><a data-start="11.74" href="#">00:00:11,740</a> Em... I hear... It sounds like walking and it's quite windy outside</div>
+<div><a data-start="18.62" href="#">00:00:18,620</a> But it sounds like... It's... The microphone is inside or something</div>
+<div><a data-start="26.98" href="#">00:00:26,980</a> It's probably music</div>
+<div><a data-start="30.32" href="#">00:00:30,320</a> From a car maybe or from some radio?</div>
+<div><a data-start="37.6" href="#">00:00:37,600</a> It's outside on the street. I hear some cars in the background</div>
+<div><a data-start="48.7" href="#">00:00:48,700</a> Mmmm... It sounds like gardening sounds</div>
+<div><a data-start="54.82" href="#">00:00:54,820</a> There are people in the background or maybe it's bikes</div>
+<div><a data-start="65.84" href="#">00:01:05,840</a> Oh I hear a bird in the background</div>
+<div><a data-start="72.12" href="#">00:01:12,120</a> A very monotone sound</div>
+<div><a data-start="76.74" href="#">00:01:16,740</a> It's like driving, maybe driving in a car</div>
+<div><a data-start="95.12" href="#">00:01:35,120</a> And some wind around
+It seems like outside but there is some noise in the background</div>
+<div><a data-start="96.58" href="#">00:01:36,580</a> It seems like outside but there is some noise in the background</div>
+<div><a data-start="106.34" href="#">00:01:46,340</a> It's outside</div>
+<div><a data-start="124.92" href="#">00:02:04,920</a> Oh, I hear children in the background crying</div>
+<div><a data-start="124.94" href="#">00:02:04,940</a> There is some weird sound in the foreground, which I... It's hard to describe [chuckling]
+Oh, I hear children in the background crying</div>
+<div><a data-start="128.36" href="#">00:02:08,360</a> There is some weird sound in the foreground, which I... It's hard to describe [chuckling]</div>
+<div><a data-start="134.9" href="#">00:02:14,900</a> Again it sounds like there is a kindergarten or school nearby</div>
 </div>
     </td>
   </tr>
 </table>
 
-<img src="images/soundwalk-photo1.jpg" width="500px"></img>
-<img src="images/soundwalk-photo3.jpg" width="500px"></img>
+<table>  <tr>
+    <td>
+<div class='subB'>
+  <h3>Tommi</h3>
+<div><a data-start="12.98" href="#">00:00:12,980</a> This is some water ** maybe from a fountain</div>
+<div><a data-start="61.48" href="#">00:01:01,480</a> Plates</div>
+<div><a data-start="64.44" href="#">00:01:04,440</a> A bus at stand by at a bus stop</div>
+<div><a data-start="70.02" href="#">00:01:10,020</a> Some people are chatting</div>
+<div><a data-start="76.94" href="#">00:01:16,940</a> Some kids talking talking while they are playing in the sand or something</div>
+<div><a data-start="87.94" href="#">00:01:27,940</a> Two people having a conversation on a street</div>
+<div><a data-start="96.28" href="#">00:01:36,280</a> One of them is walking away [chuckling]</div>
+<div><a data-start="102.1" href="#">00:01:42,100</a> And now a car is passing</div>
+<div><a data-start="110.6" href="#">00:01:50,600</a> It's a construction site</div>
+<div><a data-start="113.3" href="#">00:01:53,300</a> Something is being hammered</div>
+<div><a data-start="121.2" href="#">00:02:01,200</a> Some sports match or something</div>
+<div><a data-start="124.16" href="#">00:02:04,160</a> Everyone is **</div>
+<div><a data-start="132.54" href="#">00:02:12,540</a> Someone is speaking Arabic</div>
+<div><a data-start="138.76" href="#">00:02:18,760</a> To a group of people</div>
+<div><a data-start="142.76" href="#">00:02:22,760</a> It's like a very large voluminous space [chuckling] cause it's echoing a lot</div>
+<div><a data-start="156.76" href="#">00:02:36,760</a> Some people are shouting at something at a distance</div>
+<div><a data-start="163.76" href="#">00:02:43,760</a>  It sounds like in a courtyard</div>
+<div><a data-start="166.54" href="#">00:02:46,540</a> A baby crying</div>
+</div>
+    </td>
+    <td>
+<div class='subB'>
+  <h3>Alex</h3>
+<div><a data-start="7.82" href="#">00:00:07,820</a> There is teenagers nearby and it's walking</div>
+<div><a data-start="11.7" href="#">00:00:11,700</a> Oh, there is water</div>
+<div><a data-start="15.24" href="#">00:00:15,240</a> That's running</div>
+<div><a data-start="20.66" href="#">00:00:20,660</a> Outside probably</div>
+<div><a data-start="28.88" href="#">00:00:28,880</a> Oh, that's... It sounds like there is something clapping or like hitting against a surface</div>
+<div><a data-start="38.52" href="#">00:00:38,520</a> And it's very repetitive sound</div>
+<div><a data-start="46.6" href="#">00:00:46,600</a> Oh, I can hear some, some radio or some music or broadcast</div>
+<div><a data-start="60.2" href="#">00:01:00,200</a> That was too short. I don't know [chuckling]</div>
+<div><a data-start="64.44" href="#">00:01:04,440</a> Oh, it's quite loud. It's... Maybe it's in some kind of transport</div>
+<div><a data-start="76.22" href="#">00:01:16,220</a> Oh, there is a child speaking</div>
+<div><a data-start="85.74" href="#">00:01:25,740</a> There are people talking outside... In a foreign language</div>
+<div><a data-start="96.28" href="#">00:01:36,280</a> It's not Dutch and there is some wind</div>
+<div><a data-start="102.32" href="#">00:01:42,320</a> There are more people talking</div>
+<div><a data-start="112.76" href="#">00:01:52,760</a> Oh, there is sounds like there are construction works</div>
+<div><a data-start="116.72" href="#">00:01:56,720</a> Or hammering</div>
+<div><a data-start="120.92" href="#">00:02:00,920</a> Oh, it's very loud. Oh [chuckling], it's applause or... a crowd of people.  I don't know [chuckling]</div>
+<div><a data-start="132.06" href="#">00:02:12,060</a> It's inside. It sounds like a hallway... I don't know. Like inside</div>
+<div><a data-start="138.26" href="#">00:02:18,260</a> Because I hear some echoing</div>
+<div><a data-start="142.56" href="#">00:02:22,560</a> Ot it's inside a tunnel, where people are passing by</div>
+<div><a data-start="158.2" href="#">00:02:38,200</a> It sounds like near some street outside and I hear some kids in the background</div>
+<div><a data-start="166.6" href="#">00:02:46,600</a> Again, there is a child screaming or crying</div>
+</div>
+
+    </td>
+    </tr>
+  </table>
+
+
 
 
 
@@ -66,26 +158,28 @@ Experiment: I listen and record carefully sounds from the area that are coming f
 <script>
 var a1 = document.getElementById("a1"),
   a2 = document.getElementById("a2"),
-  b = document.getElementById("b");
-b.addEventListener("click", function () {
+  but = document.getElementById("but");
+but.addEventListener("click", function () {
   if (a1.paused) {
     a1.play();
     a2.play();
     a3.play();
+    a4.play();
 
   } else {
     a1.pause();
     a2.pause();
     a3.pause();
+    a4.pause();
   }
 
 })
 a1.addEventListener("play", function(){
-  b.innerHTML="pause"
+  but.innerHTML="pause"
 })
 
 a1.addEventListener("pause", function(){
-  b.innerHTML="play"
+  but.innerHTML="play"
 })
 
 var links=document.querySelectorAll("div.sub a")
@@ -97,14 +191,64 @@ for (var i=0, l=links.length; i<l; i++) {
     a1.currentTime=t
     a2.currentTime=t
     a3.currentTime=t
+    a4.currentTime=t
     e.preventDefault()
     a1.play();
     a2.play();
     a3.play();
+    a4.play();
   })
 
 }
 
 </script>
 
+<script>
+var b1 = document.getElementById("b1"),
+  b2 = document.getElementById("b2"),
+  butB = document.getElementById("butB");
+butB.addEventListener("click", function () {
+  if (b1.paused) {
+    b1.play();
+    b2.play();
+    b3.play();
+
+  } else {
+    b1.pause();
+    b2.pause();
+    b3.pause();
+  }
+
+})
+b1.addEventListener("play", function(){
+  butB.innerHTML="pause"
+})
+
+b1.addEventListener("pause", function(){
+  butB.innerHTML="play"
+})
+
+var links=document.querySelectorAll("div.subB a")
+for (var i=0, l=links.length; i<l; i++) {
+  var b = links[i];
+  b.addEventListener("click", function(e) {
+    console.log("CLICK", this);
+    var t=parseFloat(this.getAttribute("data-start"))
+    b1.currentTime=t
+    b2.currentTime=t
+    b3.currentTime=t
+    e.preventDefault()
+    b1.play();
+    b2.play();
+    b3.play();
+  })
+
+}
+
+</script>
+
+<img src="images/soundwalk-photo1.jpg" style="float:right;" width="200px"></img>
+<img src="images/soundwalk-photo3.jpg" style="float:right;" width="200px"></img>
+
+
 </body>

thesis/DRAFT.md

@@ -9,6 +9,9 @@ https://tex.stackexchange.com/questions/179926/pandoc-markdown-to-pdf-without-cu
 https://rosannavanhespenresearch.wordpress.com/2016/03/30/writing-your-thesis-with-r-markdown-5-the-thesis-layout/
 https://bookdown.org/yihui/rmarkdown/pdf-document.html
 
+convert to docx
+pandoc -o output.docx -f markdown -t docx thesis-angeliki.md 
+
 # Structure and web development
 https://kabk.github.io/go-theses-19/
 https://kabk.github.io/go-theses-19-samantha-van-roosenbeek/