alicestrt/vvvw
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

add titles

Browse Source
This commit is contained in:
nglk 2020-09-09 18:21:44 +02:00
parent e5385cfa0d
commit 474100070b
4 changed files with 48 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
static/css/style.css
View File

@ -56,3 +56,14 @@ img {
background-image: url("../images/test2_opacity.jpeg");
}
#scan1 {
width:60%; top:120px;left:240px;
}
/* pop up */
#show1 {
display: none;
left: 20%;
width: 23% !important;
}

23
templates/perspectiveA.html
View File

@ -9,7 +9,6 @@
</head>
<body id="background_a">
<div>
<h1>Perspective A</h1>
<div id="audio1">
<audio controls src="../static/audio/turkish_march.ogg" type="audio/ogg"></audio>
@ -21,6 +20,28 @@
<iframe id="video2" width="120" height="120" src="https://www.youtube.com/embed/5_9PAugYb4s" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<!-- youtube pop up -->
<div id="show1" class="draggable scaleable-wrapper">
<span onclick="this.parentElement.style.display='none'" class="topleft">&times</span>
<iframe id="video1" width="120" height="120" src="https://www.youtube.com/embed/fKOKxuFyEdg" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="draggable" style="font-weight: bold; top: 55%; left:40%; width: 500px !important">
<div id="popup">
<a href="#" >Ruhi Su</a>
</div>
</div>
<script>
// draggable video pop up
$("#popup").click(function(){
$("#show1").fadeIn()
console.log("around")
});
</script>
<!-- audio and image pop up -->
<div class="draggable" style="top: 260%; left:0.2%">
<button id="but"><h3>listen</h3></button>
<audio ontimeupdate="playTranscript()" id="a1" controls src="../static/audio/Clip26" class="audio-tag"></audio><a href="" target="_blank">

31
templates/perspectiveB.html
View File

@ -34,43 +34,42 @@ function EvalSound(soundobj) {
<link href="../static/css/style.css" rel="stylesheet" type="text/css">
<head>
<title>PerspectiveB</title>
<h1>VVVW - PerspectiveB</h1>
</head>
<body>
<div class="draggable" style="top:120px;left:40px">
<img src="../static/images/TheStreamRunsBlurry_scan.png" width='500px' onClick="EvalSound('song1'); return true;" alt="test">
<div class="draggable" id="scan1">
<img src="../static/images/TheStreamRunsBlurry_scan.png" width='40%' onClick="EvalSound('song1'); return true;" alt="test">
<audio id="song1" style="display: none; width: 0px; height: 0px;"
src="../static/audio/feldenkrais_mai" controls preload="auto" autobuffer>
</div>
<div class="draggable" style="top:130px;left:50px">
<img src="../static/images/ShallPass_scan.png" width='500px' onClick="EvalSound('song2'); return true;" alt="test">
<div class="draggable" style="top:130px;left:250px">
<img src="../static/images/ShallPass_scan.png" width='40%' onClick="EvalSound('song2'); return true;" alt="test">
<audio id="song2" style="display: none; width: 0px; height: 0px;"
src="../static/audio/Clip26" controls preload="auto" autobuffer>
</div>
<div class="draggable" style="top:140px;left:60px">
<img src="../static/images/NilgünMarmara_scan.png" width='500px' onClick="EvalSound('song3'); return true;" alt="test">
<div class="draggable" style="top:140px;left:260px">
<img src="../static/images/NilgünMarmara_scan.png" width='40%' onClick="EvalSound('song3'); return true;" alt="test">
<audio id="song3" style="display: none; width: 0px; height: 0px;"
src="../static/audio/FreshMythsDifferentTimes_performance_podcast.mp3" controls preload="auto" autobuffer>
</div>
<div class="draggable" style="top:150px;left:70px">
<img src="../static/images/fist_Scan.png" width='500px' onClick="EvalSound('song1'); return true;" alt="test">
<div class="draggable" style="top:150px;left:270px">
<img src="../static/images/fist_Scan.png" width='40%' onClick="EvalSound('song1'); return true;" alt="test">
<audio id="song1" style="display: none; width: 0px; height: 0px;"
src="../static/audio/feldenkrais_mai" controls preload="auto" autobuffer>
</div>
<div class="draggable" style="top:160px;left:80px">
<img src="../static/images/Coveredfigure_scan.png" width='500px' onClick="EvalSound('song2'); return true;" alt="test">
<div class="draggable" style="top:160px;left:280px">
<img src="../static/images/Coveredfigure_scan.png" width='40%' onClick="EvalSound('song2'); return true;" alt="test">
<audio id="song2" style="display: none; width: 0px; height: 0px;"
src="../static/audio/Clip26" controls preload="auto" autobuffer>
</div>
<div class="draggable" style="top:170px;left:90px">
<img src="../static/images/AşıkVeysel_Scan.png" width='500px' onClick="EvalSound('song3'); return true;" alt="test">
<div class="draggable" style="top:170px;left:290px">
<img src="../static/images/AşıkVeysel_Scan.png" width='40%' onClick="EvalSound('song3'); return true;" alt="test">
<audio id="song3" style="display: none; width: 0px; height: 0px;"
src="../static/audio/FreshMythsDifferentTimes_performance_podcast.mp3" controls preload="auto" autobuffer>
</div>
@ -79,13 +78,13 @@ src="../static/audio/FreshMythsDifferentTimes_performance_podcast.mp3" controls
<!-- <div class="draggable">
<img src="../static/images/test1.jpeg" width='500px' alt="test" onclick="playAudio('../static/audio/FreshMythsDifferentTimes_performance_podcast.mp3')">
<img src="../static/images/test1.jpeg" width='40%' alt="test" onclick="playAudio('../static/audio/FreshMythsDifferentTimes_performance_podcast.mp3')">
</div>
<div class="draggable">
<img src="../static/images/test2.jpeg" width='500px' alt="test" onclick="playAudio('../static/audio/feldenkrais_mai')">
<img src="../static/images/test2.jpeg" width='40%' alt="test" onclick="playAudio('../static/audio/feldenkrais_mai')">
</div>
<div class="draggable">
<img src="../static/images/test3.jpeg" width='500px' alt="test" onclick="playAudio('../static/audio/Clip26')">
<img src="../static/images/test3.jpeg" width='40%' alt="test" onclick="playAudio('../static/audio/Clip26')">
</div> -->

1
templates/perspectiveC.html
View File

@ -9,7 +9,6 @@
</head>
<body id="background_c">
<div>
<h1>Perspective C</h1>
<div class="draggable">
<img id="poem1" src="../static/images/poem.png" alt="poem">
</div>