2020-11-10 13:45:35 +01:00
< html >
< head >
2020-11-10 14:15:59 +01:00
< meta content = "text/html;charset=utf-8" http-equiv = "Content-Type" >
< meta content = "utf-8" http-equiv = "encoding" >
2020-11-12 13:27:42 +01:00
< meta http-equiv = "Access-Control-Allow-Origin" content = "*" >
2020-11-10 13:45:35 +01:00
< title > VVVW< / title >
2021-01-06 17:20:53 +01:00
< link rel = "stylesheet" href = "static/css/jquery-ui.min.css" >
< link rel = "stylesheet" href = "static/css/bootstrap.min.css" >
2020-11-10 14:15:59 +01:00
< link rel = "stylesheet" href = "static/css/style.css" >
2021-01-08 14:15:51 +01:00
< link
2021-02-15 16:43:05 +01:00
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.css"
2021-01-08 14:15:51 +01:00
rel="stylesheet" type='text/css'>
2021-01-06 17:20:53 +01:00
< script src = "static/js/jquery-3.5.1.min.js" > < / script >
< script src = "static/js/jquery-ui.min.js" > < / script >
< script src = "static/js/bootstrap.min.js" > < / script >
2020-11-12 13:27:42 +01:00
< script src = "static/js/d3.v3.min.js" > < / script >
2021-01-06 17:20:53 +01:00
2020-11-10 13:45:35 +01:00
< / head >
< body >
2020-11-10 14:15:59 +01:00
< div class = "container-fluid p-0" >
< div class = "bg" >
2021-01-15 18:30:30 +01:00
< div class = "row" >
2021-03-05 17:12:08 +01:00
< div class = "col-md-4" > < div id = "title_website" > < a href = "/" > Wells of Knowledge:< / a > < / div > < span id = "subtitle_website" > Poetry, music and resistance in Turkey< / span > < / div >
2021-03-01 14:52:04 +01:00
< div class = "col-md-3 offset-md-5" id = "menu" >
2021-01-15 18:30:30 +01:00
< span id = "about" >
2021-03-03 19:12:59 +01:00
< a href = "#" > about< / a > |
2021-01-15 18:30:30 +01:00
< / span >
2021-03-03 19:12:59 +01:00
< span id = "colophon" >
< a href = "#" > colophon< / a > |
< / span >
< span id = "how" >
2021-03-04 12:54:42 +01:00
< a href = "#" > how to use< / a >
2021-03-03 19:12:59 +01:00
< / span >
2021-01-15 18:30:30 +01:00
< / div >
2021-03-05 17:17:17 +01:00
< div id = "myModal" class = "modal fade" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
< h5 class = "modal-title" > This website is better viewed on desktop< / h5 >
< button type = "button" class = "close" data-dismiss = "modal" > × < / button >
< / div >
< div class = "modal-body" >
< p > Sorry for that.< / p >
< / div >
< / div >
< / div >
< / div >
2021-01-15 18:30:30 +01:00
< / div >
2020-11-10 14:15:59 +01:00
< div class = "row" >
2020-11-12 13:27:42 +01:00
<!-- background audio -->
2021-01-15 19:10:35 +01:00
< div class = "col-md-9" >
< div class = "row" >
< div class = "col-md-12" >
< br >
< div class = "map_legend" >
2021-03-05 00:07:25 +01:00
< div id = "box1" onclick = "popup_bg(600,86000)" > < i class = "box fa fa-play" > < / i > < / div > < p > Folklore literature< / p >
< div id = "box2" onclick = "popup_bg(1465,30500)" > < i class = "box fa fa-play" aria-hidden = "true" > < / i > < / div > < p > Islamic Mysticism< / p >
< div id = "box3" onclick = "popup_bg(0,60000)" > < i class = "box fa fa-play" aria-hidden = "true" > < / i > < / div > < p > Contemporary poets< / p >
< div id = "box4" onclick = "popup_bg(0,1000)" > < i class = "box fa fa-play" aria-hidden = "true" > < / i > < / div > < p > Contemporary musicians< / p >
2021-01-15 19:10:35 +01:00
< / div >
< / div >
< / div >
2020-11-10 14:15:59 +01:00
< div class = "row" >
2021-01-06 18:38:58 +01:00
2021-01-15 19:10:35 +01:00
< div class = "col-md-5 col-sm-6 col-xs-6" >
2021-01-15 18:30:30 +01:00
< button onclick = "playpause('audioBG')" type = "button" name = "button" > < i class = "audioBG fa fa-play" > < / i > < / button >
2021-01-08 15:19:36 +01:00
< audio id = "audioBG"
preload="metadata" onloadedmetadata="mDur(dur1,audioBG)" ontimeupdate="mPlay(dur1,audioBG)">
2021-03-03 13:23:31 +01:00
< source src = "static/audio/HNI_Soundinstall_3tracks_together.webm" >
2021-01-08 15:19:36 +01:00
< / audio >
2021-01-15 17:31:41 +01:00
< input id = "dur1" type = "range" name = "rng" min = "0" step = "0.25" value = "0" onchange = "mSet(dur1,audioBG)" style = "width: 150px" >
2021-01-08 15:19:36 +01:00
< / div >
< / div >
2021-01-15 19:10:35 +01:00
2020-11-16 15:44:28 +01:00
< / div >
2020-12-17 14:18:09 +01:00
2020-11-16 15:44:28 +01:00
< / div >
<!-- new row should start here -->
2020-12-04 16:54:54 +01:00
<!-- pop up thesis -->
<!-- <div class="scaleable - wrapper draggable" id="scaleable - wrapper"> -->
2020-12-16 15:11:39 +01:00
2020-12-04 16:54:54 +01:00
<!-- </div> -->
2020-11-12 13:27:42 +01:00
<!-- map area -->
2021-01-06 16:48:28 +01:00
< div class = "row" id = "noflex" >
2021-03-01 14:52:04 +01:00
< div class = "col-md-12" >
2020-11-12 13:27:42 +01:00
< div class = "map_area" >
<!-- <p>Related media</p> -->
2020-12-09 16:55:10 +01:00
<!-- <div class="draggable" id="showdadaloglu"><div class='text_audio'>Bio</div> -->
2020-11-12 13:27:42 +01:00
<!-- <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 > -->
2020-12-09 16:55:10 +01:00
<!-- <img src="static/images/poem.png">
< / div > -->
2020-11-12 13:27:42 +01:00
<!-- <img src="static/images/test_small.jpeg" alt="poem"> -->
2020-12-04 13:15:54 +01:00
2020-12-04 14:53:39 +01:00
<!-- popups about and colophon -->
2021-03-05 18:13:06 +01:00
< span id = "closeall" onclick = "closeall()" > CLOSE ALL POP-UPS< / span >
< div id = "showabout" class = "draggable" > < span onclick = "this.parentElement.style.display='none'" class = "topleft" > & times< / span > < div > < h2 > About< / h2 > < p >
< p > This hybrid publication focuses on the transfer of knowledge through cultural production in the oral folkloric traditions of Anatolia. It consists of a poster-zine and online platform. The research was initiated to reflect on the Gezi Park Occupation (Istanbul, 2013) and tries to find the connecting points in history of politics through cultural production. By narrating the history of a specific geography, it invites the reader to question the influence of cultural heritage in the formation of one’ ‘ ’ < / p >
< p > The online platform acts as an active archival space that gives the possibility to revisit the elements in a non-linear historical approach focusing on the transference of oral knowledge through musical and poetic practices of story telling. The names you see on the map represent a wider group of artists, musicians, writers and thinkers that Kı ı ‘ ’ < / p >
< p >
The platform is envisioned as an interactive, growing networked map that can create different narrative paths for the reader to navigate. The creation of this accumulation point is an invitation for a learning process both for the reader and researcher. The physical poster-zine holds a visual fragment of the research with a collage of old photographs and Kı ı ’ < a href = "https://mervekilicer.com/volitional-volutions-of-the-volatile-waters/" target = "_blank" > https://mervekilicer.com/volitional-volutions-of-the-volatile-waters/< / a >
< / p >
< p >
Credits for the sound track< / p >
< p >
< i > Körleşme / Going Blind< / i > < br >
poem by Gülten Akı < br >
Voice - Ulufer Çelik, Merve Kı ı < / p >
< p > < i > Zaman Yer Sonra / Time Place After< / i > < br >
poem by Nilgün Marmara< br >
Voice - Ulufer Çelik< / p >
< p > < i > Anlatamam Derdimi / I can’ < / i > < br >
by Aşı < br >
in his own voice< / p >
< p >
< i > Geçer / Shall Pass< / i > < br >
by Neyzen Tevfik< br >
in his own voice< / p >
< p >
< i > Dere Akar Bulanı < / i > < br >
Ballad< br >
Sung by Sümeyra< / p >
< p > < i > Ömrüm Bitirmiş Viranemiyem /< / i > < br >
by Hz. Aşkî< br >
composed by Abdullah El Ferec English rendition: CISS/Rifai Sufi Order< / p >
< p >
< i > Sufism is Love of God< / i > < br >
Talk by Murat Coşkun< br >
The Canadian Institute of Sufi Studies< / p >
< p >
The voice and music of Sümeyra Çakı < / p >
< p >
Poems and songs are translated with the collective effort of Ulufer Çelik, Merve Kı ı < / p >
2020-12-16 16:44:38 +01:00
2021-01-15 16:25:12 +01:00
< / div >
2020-12-04 14:53:39 +01:00
< / div > < br >
2021-03-01 18:08:33 +01:00
< div id = "showcolophon" class = "draggable" > < span onclick = "this.parentElement.style.display='none'" class = "topleft" > & times< / span > < div > < h2 > Colophon< / h2 >
< p >
Wells of Knowledge: Poetry, Music and Resistance in Turkey
2021-03-05 18:13:06 +01:00
© 2020 < a href = "at.wdka.nl/wellsofknowledge" target = "_blank" > at.wdka.nl/wellsofknowledge< / a > < / p >
2021-03-01 18:08:33 +01:00
< p >
Developed by Hybrid Publishing,
Willem de Kooning Academy< / p >
< p >
Text and images © Merve Kı ı < br >
All rights reserved< / p >
< p > ISBN: 9789492479112< / p >
< p > Author: Merve Kı ı < / p >
< p > Graphic Design & Web Development: Angeliki Diakrousi
2021-03-05 18:13:06 +01:00
(< a href = "https://w- target = "_blank" > https://w- < / a > ) and Alice Strete (< a href = "https://alicestrete.me/" target = "_blank" > https://alicestrete.me/< / a > )< / p >
2021-03-01 18:08:33 +01:00
< p > Editor: Liz Allan< / p >
< p > Coordination: Kimmy Spreeuwenberg< / p >
2021-03-05 18:13:06 +01:00
< p > Details production poster-zine< br >
Printer: De Raddraaier, Amsterdam< br >
2021-03-01 18:08:33 +01:00
Paper: Old Mill/Bianco 100g< br >
Print Run: 300< / p >
< p > Thanks for the generous support of Nihan Somay, Jake Caleb,
Ulufer Çelik and Carmen José< / p >
2021-03-04 12:50:15 +01:00
< p > Hybrid Publishing< br >
2021-03-01 18:08:33 +01:00
This publication was developed by Hybrid Publishing, founded by
the Willem de Kooning Academy as a means of profiling and
disseminating outstanding research conducted by its students and
teaching staff, whether independently or in collaboration with
external partners. Researching and experimenting across a broad
range of processes native to digital and analog media, WdKA
Hybrid Publishing fosters novel approaches to design, authoring,
reading and dissemination made possible through ongoing
developments from the legacies of Gutenberg’
2021-03-05 18:13:06 +01:00
technologies. (< a href = "hybridpublishing.wdka.nl" target = "_blank" > hybridpublishing.wdka.nl< / a > )< / p >
2021-03-01 18:08:33 +01:00
< p > HP Research Awards< br >
The HP Research Awards series showcases the work of recipients
or nominees of the Willem de Kooning Research Award.
Established by the Willem de Kooning Foundation, the awards are
granted to outstanding students whose graduation projects and
research have helped provide new insights to broader audiences. For
a digital version of this and other publications, go to
2021-03-05 18:13:06 +01:00
< a href = "at.wdka.nl/hpresearchawards" target = "_blank" > at.wdka.nl/hpresearchawards< / a > < / p >
2021-03-01 18:08:33 +01:00
< img class = "logo" src = "static/images/HP_Logo.png" > < / img >
< img class = "logo" src = "static/images/wdka_logo.png" > < / img >
< img class = "logo" src = "static/images/pzi_logo.png" > < / img >
< / div >
2020-12-04 14:53:39 +01:00
< / div >
2020-12-16 16:44:38 +01:00
2021-03-03 13:23:31 +01:00
< div id = "showhow" class = "draggable" > < span onclick = "this.parentElement.style.display='none'" class = "topleft" > & times< / span > < div > < h2 > How to use< / h2 >
2021-03-01 14:52:04 +01:00
< p > This website is best displayed on a desktop, using the latest available Firefox version.< / p >
< p >
2021-03-01 14:13:28 +01:00
The map shows connections between various representatives in Turkish culture, be it poets, authors or musicians, traditional or contemporary.< / p > < p > Each name is presented in relation to a song, a poem, an image, or a fragment of text or audio.< / p >
< p > When clickling once on one of the names, various kinds of media appear in connection to that name. The colors represent different categories (Folklore literature, Islamic Mysticism, etc).< / p >
2021-03-05 18:13:06 +01:00
< p > When double clicking, a name is isolated and displayed alongside its closest connections. < / p > < p > All the elements of the map can be rearranged and moved. < / p >
< p > Sections of the map legend double as audio players which allow you to navigate through the audio track. Click and explore.< / p >
< / div >
2020-12-16 16:44:38 +01:00
< / div >
2020-11-12 13:27:42 +01:00
< script src = "static/js/d3_map.js" > < / script >
2021-03-03 13:23:31 +01:00
< / div >
2020-11-12 13:27:42 +01:00
2021-01-15 18:44:27 +01:00
< div id = "nothesis" >
< div w3-include-html = "thesis.html" id = "thesis" class = "draggable thesis" >
2020-12-16 15:11:39 +01:00
< / div >
2020-11-12 13:27:42 +01:00
< / div >
2021-03-03 13:23:31 +01:00
< / div >
2020-12-15 18:51:50 +01:00
2020-12-16 15:11:39 +01:00
< / div >
< / div >
2020-12-04 11:56:43 +01:00
2021-01-15 17:31:32 +01:00
< script type = "text/javascript" >
2021-03-03 19:12:59 +01:00
2021-01-15 17:31:32 +01:00
$(document).ready(function() {
var a = 3;
var dragOpts = {
cursor: "move",
cursor: "grab",
distance: "0",
};
$('.draggable').draggable(
{
start: function(event, ui) { $(this).css('z-index', a++); }
});});
2021-03-01 14:30:21 +01:00
2021-03-05 17:12:08 +01:00
$(".draggable i.remove-elem").off('click').on("click", function(){
$(this).parent('.draggable').remove();
});
2021-03-01 14:30:21 +01:00
2021-03-02 18:12:51 +01:00
2021-01-15 17:31:32 +01:00
< / script >
2020-11-10 14:15:59 +01:00
<!-- scripts for mouse events -->
2020-11-30 17:20:02 +01:00
< script >
2021-03-04 12:47:59 +01:00
// function popup_bg(start,end) {
2021-03-05 17:17:17 +01:00
2021-03-04 12:47:59 +01:00
// var myIcon = document.querySelector(".audioBG");
// var box = document.getElementById("audioBG");
// if (box.paused) {
// box.currentTime = start;
// myIcon.className = "audioBG fa fa-pause";
// setTimeout(function(){
// box.play();
// console.log(box.currentTime);
// }, end);
// }
// // box.currentTime = start;
// // console.log(start);
2021-03-05 17:17:17 +01:00
2021-03-04 12:47:59 +01:00
// }
2021-03-05 00:07:25 +01:00
// function popup_bg(start,end){
// var myIcon = document.querySelector(".audioBG");
// var box = document.getElementById("audioBG");
// box.currentTime = start;
// myIcon.className = "audioBG fa fa-pause";
// box.play();
// console.log(box.currentTime);
// setInterval(function(){
// if(box.currentTime>end){
// myIcon.className = "audioBG fa fa-play";
// box.pause();
// console.log(box.currentTime);
// }
// },1000);
// }
2021-03-04 12:47:59 +01:00
function popup_bg(start,end){
2021-03-02 18:12:51 +01:00
var myIcon = document.querySelector(".audioBG");
2020-11-30 17:20:02 +01:00
var box = document.getElementById("audioBG");
2021-03-04 12:47:59 +01:00
box.currentTime = start;
myIcon.className = "audioBG fa fa-pause";
box.play();
console.log(box.currentTime);
2021-03-05 00:07:25 +01:00
setTimeout(() => { myIcon.className = "audioBG fa fa-play";box.pause(); console.log(box.currentTime);}, end);
2021-03-04 12:47:59 +01:00
}
2021-03-05 00:07:25 +01:00
2021-01-08 15:19:36 +01:00
< / script >
< script >
var aud1= document.getElementById('audioBG');
var dur1= document.getElementById('dur1');
function mDur(dur,aud){dur.max= aud.duration};
function mPlay(dur,aud){dur.value=aud.currentTime};
function mSet(dur,aud){aud.currentTime=dur.value};
function playpause(podcast){
var myAudio = document.getElementById(podcast);
var myIcon = document.querySelector("."+podcast);
if (myAudio.paused) {
myIcon.className = podcast+" fa fa-pause";
myAudio.play();
} else {
myIcon.className = podcast+" fa fa-play";
myAudio.pause();
}
}
2020-11-30 17:20:02 +01:00
< / script >
2020-11-10 14:15:59 +01:00
< 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();
}
2020-11-10 13:45:35 +01:00
}
2020-11-10 14:15:59 +01:00
xhttp.open("GET", file, true);
xhttp.send();
/* Exit the function: */
return;
2020-11-10 13:45:35 +01:00
}
2020-11-10 14:15:59 +01:00
}
}
2020-11-10 19:09:39 +01:00
includeHTML();
< / script >
2020-12-04 11:42:36 +01:00
< script >
2021-01-15 17:00:02 +01:00
2021-01-15 18:44:27 +01:00
function closevideo(){
2021-01-15 17:00:02 +01:00
$("#showvideo").hide()
$('iframe').each(function(index) {
$(this).attr('src', $(this).attr('src'));
return false;
});
}
2021-01-15 18:44:27 +01:00
function closebio(){
$("#showbio").hide()
}
2021-03-01 14:09:14 +01:00
function closethesis(){
$("#nothesis").hide()
}
2021-01-15 18:44:27 +01:00
2021-03-03 17:52:22 +01:00
function closeall(){
$("#showbio").hide()
$("#nothesis").hide()
$("#showvideo").hide()
2021-03-04 12:54:42 +01:00
$('iframe').each(function(index) {
$(this).attr('src', $(this).attr('src'));
return false;
});
2021-03-03 18:36:19 +01:00
$("#closeall").hide()
2021-03-04 12:23:33 +01:00
$("#showabout").hide()
$("#showcolophon").hide()
$("#showhow").hide()
2021-03-03 17:52:22 +01:00
}
2021-01-15 18:44:27 +01:00
2021-03-03 19:12:59 +01:00
function startaudio(){
var box = document.getElementById("audioBG");
2021-03-03 19:14:29 +01:00
box.currentTime=3384;
2021-03-03 19:12:59 +01:00
}
window.onload = startaudio();
2021-01-15 17:00:02 +01:00
2020-12-04 11:42:36 +01:00
$("#about").click(function(){
$("#showabout").fadeIn()
2021-03-04 12:23:33 +01:00
$("#closeall").fadeIn()
2020-12-04 11:42:36 +01:00
console.log("around")
});
2020-12-04 11:42:41 +01:00
$("#colophon").click(function(){
$("#showcolophon").fadeIn()
2021-03-04 12:23:33 +01:00
$("#closeall").fadeIn()
2020-12-04 11:42:41 +01:00
console.log("around")
});
2020-12-16 16:44:38 +01:00
$("#how").click(function(){
$("#showhow").fadeIn()
2021-03-04 12:23:33 +01:00
$("#closeall").fadeIn()
2020-12-16 16:44:38 +01:00
console.log("around")
2021-03-02 18:12:51 +01:00
2020-12-16 16:44:38 +01:00
});
2020-12-15 18:51:50 +01:00
2020-12-04 11:42:36 +01:00
< / script >
2021-03-05 17:17:17 +01:00
< script >
$(document).ready(function(){
if (screen.width < 768 ) {
$("#myModal").modal('show');
}
});
< / script >
2020-12-16 15:11:39 +01:00
2020-12-04 16:54:54 +01:00
2020-11-10 14:15:59 +01:00
< / div >
2020-11-10 13:45:35 +01:00
< / body >
2020-11-10 19:09:39 +01:00
< / html >
