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

add titles

master
nglk 4 years ago
parent
e5385cfa0d
commit
474100070b
4 changed files with 48 additions and 18 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 11
      static/css/style.css
  2. 23
      templates/perspectiveA.html
  3. 31
      templates/perspectiveB.html
  4. 1
      templates/perspectiveC.html

11
static/css/style.css
View File

@ -56,3 +56,14 @@ img {
background-image: url("../images/test2_opacity.jpeg"); 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> </head>
<body id="background_a"> <body id="background_a">
<div> <div>
<h1>Perspective A</h1>
<div id="audio1"> <div id="audio1">
<audio controls src="../static/audio/turkish_march.ogg" type="audio/ogg"></audio> <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> <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> </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%"> <div class="draggable" style="top: 260%; left:0.2%">
<button id="but"><h3>listen</h3></button> <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"> <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"> <link href="../static/css/style.css" rel="stylesheet" type="text/css">
<head> <head>
<title>PerspectiveB</title> <title>PerspectiveB</title>
<h1>VVVW - PerspectiveB</h1>
</head> </head>
<body> <body>
<div class="draggable" style="top:120px;left:40px"> <div class="draggable" id="scan1">
<img src="../static/images/TheStreamRunsBlurry_scan.png" width='500px' onClick="EvalSound('song1'); return true;" alt="test"> <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;" <audio id="song1" style="display: none; width: 0px; height: 0px;"
src="../static/audio/feldenkrais_mai" controls preload="auto" autobuffer> src="../static/audio/feldenkrais_mai" controls preload="auto" autobuffer>
</div> </div>
<div class="draggable" style="top:130px;left:50px"> <div class="draggable" style="top:130px;left:250px">
<img src="../static/images/ShallPass_scan.png" width='500px' onClick="EvalSound('song2'); return true;" alt="test"> <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;" <audio id="song2" style="display: none; width: 0px; height: 0px;"
src="../static/audio/Clip26" controls preload="auto" autobuffer> src="../static/audio/Clip26" controls preload="auto" autobuffer>
</div> </div>
<div class="draggable" style="top:140px;left:60px"> <div class="draggable" style="top:140px;left:260px">
<img src="../static/images/NilgünMarmara_scan.png" width='500px' onClick="EvalSound('song3'); return true;" alt="test"> <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;" <audio id="song3" style="display: none; width: 0px; height: 0px;"
src="../static/audio/FreshMythsDifferentTimes_performance_podcast.mp3" controls preload="auto" autobuffer> src="../static/audio/FreshMythsDifferentTimes_performance_podcast.mp3" controls preload="auto" autobuffer>
</div> </div>
<div class="draggable" style="top:150px;left:70px"> <div class="draggable" style="top:150px;left:270px">
<img src="../static/images/fist_Scan.png" width='500px' onClick="EvalSound('song1'); return true;" alt="test"> <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;" <audio id="song1" style="display: none; width: 0px; height: 0px;"
src="../static/audio/feldenkrais_mai" controls preload="auto" autobuffer> src="../static/audio/feldenkrais_mai" controls preload="auto" autobuffer>
</div> </div>
<div class="draggable" style="top:160px;left:80px"> <div class="draggable" style="top:160px;left:280px">
<img src="../static/images/Coveredfigure_scan.png" width='500px' onClick="EvalSound('song2'); return true;" alt="test"> <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;" <audio id="song2" style="display: none; width: 0px; height: 0px;"
src="../static/audio/Clip26" controls preload="auto" autobuffer> src="../static/audio/Clip26" controls preload="auto" autobuffer>
</div> </div>
<div class="draggable" style="top:170px;left:90px"> <div class="draggable" style="top:170px;left:290px">
<img src="../static/images/AşıkVeysel_Scan.png" width='500px' onClick="EvalSound('song3'); return true;" alt="test"> <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;" <audio id="song3" style="display: none; width: 0px; height: 0px;"
src="../static/audio/FreshMythsDifferentTimes_performance_podcast.mp3" controls preload="auto" autobuffer> src="../static/audio/FreshMythsDifferentTimes_performance_podcast.mp3" controls preload="auto" autobuffer>
</div> </div>
@ -79,13 +78,13 @@ src="../static/audio/FreshMythsDifferentTimes_performance_podcast.mp3" controls
<!-- <div class="draggable"> <!-- <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>
<div class="draggable"> <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>
<div class="draggable"> <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> --> </div> -->

1
templates/perspectiveC.html
View File

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

Write Preview
Loading…
Cancel
Save