8 changed files with 272 additions and 76 deletions
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,152 @@ |
|||
<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