4 changed files with 46 additions and 175 deletions
@ -1,152 +0,0 @@ |
|||
<html> |
|||
<head> |
|||
<meta content="text/html;charset=utf-8" http-equiv="Content-Type"> |
|||
<meta content="utf-8" http-equiv="encoding"> |
|||
<meta http-equiv="Access-Control-Allow-Origin" content="*"> |
|||
<title>VVVW</title> |
|||
<link rel="stylesheet" href="static/css/style.css"> |
|||
<link rel="stylesheet" href="static/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> |
|||
<script src="static/js/jquery.min.js"></script> |
|||
<script type="text/javascript" src="static/js/p5/p5.min.js"></script> |
|||
<script src="static/js/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> |
|||
<script src="static/js/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> |
|||
<script src="static/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> |
|||
<script src="static/js/jquery-1.12.4.js"></script> |
|||
<script src="static/js/jquery-ui.js"></script> |
|||
<script src="static/js/d3.v3.min.js"></script> |
|||
</head> |
|||
<body> |
|||
<div class="container-fluid p-0"> |
|||
<div class="bg"> |
|||
<div class="row"> |
|||
<div class="col-md-7"> |
|||
<div class="map_area"> |
|||
<script src="static/js/d3_map.js"></script> |
|||
</div> |
|||
<div class="row"> |
|||
<div class="col-md-12"> |
|||
<p id="legend_title">Map legend</p> |
|||
|
|||
<div class="map_legend"> |
|||
<div class="box1"></div> <p>Folklore literature</p> |
|||
<div class="box2"></div> <p>Islamic Mysticism</p> |
|||
<div class="box3"></div> <p>Contemporary poets</p> |
|||
<div class="box4"></div> <p>Contemporary musicians</p> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="col-md-5"> |
|||
<div class="scrollable"> |
|||
<div class="row"> |
|||
<div class="col-md-12"> |
|||
<div w3-include-html="thesis.html" class="thesis"> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="row"> |
|||
<div class="col-md-10"> |
|||
<div class="media_area"> |
|||
<!-- <p>Related media</p> --> |
|||
<div id="showdadaloglu"><div class='text_audio'>Bio</div> |
|||
<!-- <audio id="audiodadaloglu" controls> |
|||
<source src="static/audio/HNI_Soundinstall_3tracks_together1.mp3" type="audio/mpeg"> |
|||
Your browser does not support the audio tag. |
|||
</audio> --> |
|||
<img src="static/images/poem.png"> |
|||
</div> |
|||
|
|||
<div id="showasikA"><div class='text_audio'>Bio Aşık Ali İzzet</div><iframe width="560" height="280" src="https://www.youtube.com/embed/AnsVY_gjJns" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div> |
|||
|
|||
<div id="showasikV"><div class='text_audio'>Bio</div><iframe width="560" height="280" src="https://www.youtube.com/embed/5_9PAugYb4s" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> |
|||
|
|||
<iframe width="560" height="280" src="https://www.youtube.com/embed/t64yH04XWs8" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> |
|||
</div> |
|||
|
|||
<div id="showmuharrem"><div class='text_audio'></div><iframe width="560" height="280" src="https://www.youtube.com/embed/Ffa2CONoW5Q" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div> |
|||
|
|||
<div id="shownazim"><div class='text_audio'></div><iframe width="560" height="280" src="https://www.youtube.com/embed/11XRG-cz3lY" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div> |
|||
|
|||
<div id="showneyzen"><div class='text_audio'></div><iframe width="560" height="280" src="https://www.youtube.com/embed/CD-CEeaLGdk" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div> |
|||
|
|||
<div id="showruhisu"><div class='text_audio'></div><iframe width="560" height="280" src="https://www.youtube.com/embed/fKOKxuFyEdg" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div> |
|||
|
|||
<div id="showasu"><div class='text_audio'></div><iframe width="560" height="280" src="https://www.youtube.com/embed/mETzamzufh4" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div> |
|||
|
|||
<!-- <img src="static/images/test_small.jpeg" alt="poem"> --> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="row"> |
|||
<div class="col-md-12"> |
|||
<div class="play-stop"> |
|||
<div id="tracktime">0:0 / 22:39</div> |
|||
<a id="mBtn" onclick="PSFunction()">(Play)</a> |
|||
<button class="audio-button" onclick="document.getElementById('audioBG').volume -= 0.1">-</button> |
|||
<button class="audio-button" onclick="document.getElementById('audioBG').volume += 0.1">+</button> |
|||
</div> |
|||
<div class="main_audio"> |
|||
<audio id='audioBG' ontimeupdate="document.getElementById('tracktime').innerHTML = Math.floor(this.currentTime/60) + ':' + (Math.floor(this.currentTime) - Math.floor(this.currentTime/60)*60) + ' / ' + Math.floor(this.duration/60)+ ':' + (Math.floor(this.duration) - Math.floor(this.duration/60)*60);"> |
|||
<source src="static/audio/FreshMythsDifferentTimes_performance_podcast1.mp3" type="audio/mpeg"> |
|||
Your browser does not support the audio tag. |
|||
</audio> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
</div> |
|||
<!-- scripts for mouse events --> |
|||
<script> |
|||
var audio = document.getElementById("audioBG"); |
|||
var btn = document.getElementById("mBtn"); |
|||
|
|||
function PSFunction() { |
|||
if (audio.paused) { |
|||
audio.play(); |
|||
btn.innerHTML = "(Pause)"; |
|||
} else { |
|||
audio.pause(); |
|||
btn.innerHTML = "(Play)"; |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<script> |
|||
function includeHTML() { |
|||
var z, i, elmnt, file, xhttp; |
|||
/* Loop through a collection of all HTML elements: */ |
|||
z = document.getElementsByTagName("*"); |
|||
for (i = 0; i < z.length; i++) { |
|||
elmnt = z[i]; |
|||
/*search for elements with a certain atrribute:*/ |
|||
file = elmnt.getAttribute("w3-include-html"); |
|||
if (file) { |
|||
/* Make an HTTP request using the attribute value as the file name: */ |
|||
xhttp = new XMLHttpRequest(); |
|||
xhttp.onreadystatechange = function() { |
|||
if (this.readyState == 4) { |
|||
if (this.status == 200) {elmnt.innerHTML = this.responseText;} |
|||
if (this.status == 404) {elmnt.innerHTML = "Page not found.";} |
|||
/* Remove the attribute, and call this function once more: */ |
|||
elmnt.removeAttribute("w3-include-html"); |
|||
includeHTML(); |
|||
} |
|||
} |
|||
xhttp.open("GET", file, true); |
|||
xhttp.send(); |
|||
/* Exit the function: */ |
|||
return; |
|||
} |
|||
} |
|||
} |
|||
|
|||
includeHTML(); |
|||
</script> |
|||
</div> |
|||
</body> |
|||
</html> |
|||
Loading…
Reference in new issue