|
|
|
@ -14,8 +14,9 @@
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
|
|
|
|
|
<button onclick="piles()">piles</button>
|
|
|
|
|
<button onclick="groups()">groups</button>
|
|
|
|
|
Filter by:
|
|
|
|
|
<button onclick="piles()">workshop</button>
|
|
|
|
|
<button onclick="groups()">type</button>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- draggable archive -->
|
|
|
|
@ -54,13 +55,26 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- div extracts -->
|
|
|
|
|
<div>
|
|
|
|
|
<div class="draggable ui-draggable-handle group_extracts pile1"><a href="images/carson-extract.jpg" target="_blank"><img src="images/carson-extract.jpg" width="550px" /></a></div>
|
|
|
|
|
|
|
|
|
|
<div class="draggable ui-draggable-handle group_extracts pile1"><a href="images/fresh1.jpg" target="_blank"><img src="images/fresh1.jpg" width="600px" /></a></div>
|
|
|
|
|
<div class="draggable ui-draggable-handle group_extracts pile0"><a href="images/carson-extract.jpg" target="_blank"><img src="images/carson-extract.jpg" width="550px" /></a></div>
|
|
|
|
|
|
|
|
|
|
<div class="draggable ui-draggable-handle group_extracts pile0"><a href="images/fresh1.jpg" target="_blank"><img src="images/fresh1.jpg" width="600px" /></a></div>
|
|
|
|
|
|
|
|
|
|
<div class="draggable ui-draggable-handle group_extracts pile0"><a href="images/fresh2.jpg" target="_blank"><img src="images/fresh2.jpg" width="600px" /></a></div>
|
|
|
|
|
|
|
|
|
|
<div class="draggable ui-draggable-handle group_extracts pile0"><a href="images/volkskrant-00.jpg" target="_blank"><img src="images/volkskrant-00.jpg" width="600px" /></a></div>
|
|
|
|
|
|
|
|
|
|
<div class="draggable ui-draggable-handle group_extracts pile0"><a href="images/volkskrant-01.jpg" target="_blank"><img src="images/volkskrant-01.jpg" width="600px" /></a></div>
|
|
|
|
|
|
|
|
|
|
<div class="draggable ui-draggable-handle group_extracts pile0"><a href="images/volkskrant-02.jpg" target="_blank"><img src="images/volkskrant-02.jpg" width="600px" /></a></div>
|
|
|
|
|
|
|
|
|
|
<div class="draggable ui-draggable-handle group_extracts pile0"><a href="images/volkskrant-03.jpg" target="_blank"><img src="images/volkskrant-03.jpg" width="600px" /></a></div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="draggable ui-draggable-handle group_extracts pile1"><a href="images/fresh2.jpg" target="_blank"><img src="images/fresh2.jpg" width="600px" /></a></div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- div images -->
|
|
|
|
|
<div id="img" class="draggable ui-draggable-handle group_photos pile3"><img src="images/meeting-20190508_leeszaal.jpg" width="400px"></img></div>
|
|
|
|
@ -96,6 +110,7 @@
|
|
|
|
|
|
|
|
|
|
<!-- metadata for each workshop -->
|
|
|
|
|
<div class="draggable scaleable-wrapper box_metadata group_metadata pile1">
|
|
|
|
|
<h2>Workshop 1</h2>
|
|
|
|
|
<li>Actions:<li>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Reading extracts</li>
|
|
|
|
@ -107,7 +122,7 @@
|
|
|
|
|
<li>Location: Leeszaal<li>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="draggable scaleable-wrapper box_metadata group_metadata pile2">
|
|
|
|
|
<div class="draggable scaleable-wrapper box_metadata group_metadata pile2"><h2>Workshop 2</h2>
|
|
|
|
|
<li>Actions:<li>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Reading extracts</li>
|
|
|
|
@ -119,7 +134,7 @@
|
|
|
|
|
<li>Location: Fine Arts<li>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="draggable scaleable-wrapper box_metadata group_metadata pile3">
|
|
|
|
|
<div class="draggable scaleable-wrapper box_metadata group_metadata pile3"><h2>Workshop 3</h2>
|
|
|
|
|
<li>Actions:<li>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Reading extracts</li>
|
|
|
|
@ -131,7 +146,7 @@
|
|
|
|
|
<li>Location: Leeszaal<li>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="draggable scaleable-wrapper box_metadata group_metadata pile4">
|
|
|
|
|
<div class="draggable scaleable-wrapper box_metadata group_metadata pile4"><h2>Workshop 4</h2>
|
|
|
|
|
<li>Actions:<li>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Reading extracts</li>
|
|
|
|
@ -143,7 +158,7 @@
|
|
|
|
|
<li>Location: Leeszaal<li>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="draggable scaleable-wrapper box_metadata group_metadata pile5">
|
|
|
|
|
<div class="draggable scaleable-wrapper box_metadata group_metadata pile5"><h2>Workshop 5</h2>
|
|
|
|
|
<li>Actions:<li>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Reading extracts</li>
|
|
|
|
@ -164,41 +179,41 @@
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="draggable scaleable-wrapper" style="top: 1270px; right: 200px;">
|
|
|
|
|
<div class="draggable scaleable-wrapper group_menu pileM">
|
|
|
|
|
<h2 ><a href="diary.php">Diary of West Rotterdam</a></h2>
|
|
|
|
|
<div class="drag-content">
|
|
|
|
|
(first experiments)
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="draggable scaleable-wrapper" style="top: 1200px; right: 10px;">
|
|
|
|
|
<h2 ><a href="player.php">Player</a></h2>
|
|
|
|
|
<div class="draggable scaleable-wrapper group_menu pileM">
|
|
|
|
|
<h2 ><a href="player.php group_menu pileM">Player</a></h2>
|
|
|
|
|
<div class="drag-content">
|
|
|
|
|
(audio archive)
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="draggable scaleable-wrapper" style="top: 100%; right: 335px;">
|
|
|
|
|
<div class="draggable scaleable-wrapper group_menu pileM">
|
|
|
|
|
<h2 ><a href="index.php">About</a></h2>
|
|
|
|
|
<div class="drag-content">
|
|
|
|
|
(main page)
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="draggable scaleable-wrapper" style="top: 80%; left: 70%;">
|
|
|
|
|
<div class="draggable scaleable-wrapper group_menu pileM">
|
|
|
|
|
<h2 ><a href="podcast4.php">Podcast4</a></h2>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="draggable scaleable-wrapper" style="top: 85%; left: 81%;">
|
|
|
|
|
<div class="draggable scaleable-wrapper group_menu pileM">
|
|
|
|
|
<h2 ><a href="podcast1.php">Podcast1</a></h2>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="draggable scaleable-wrapper" style="top: 90%; left: 80%;">
|
|
|
|
|
<div class="draggable scaleable-wrapper group_menu pileM">
|
|
|
|
|
<h2 ><a href="podcast2.php">Podcast2</a></h2>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="draggable scaleable-wrapper" style="top: 75%; left: 79%;">
|
|
|
|
|
<div class="draggable scaleable-wrapper group_menu pileM">
|
|
|
|
|
<h2 ><a href="podcast3.php">Podcast3</a></h2>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="draggable scaleable-wrapper" style="top: 960px; right: 430px; z-index: 9;">
|
|
|
|
|
<div class="draggable scaleable-wrapper group_menu pileM">
|
|
|
|
|
<h2 ><a href="thesis-angeliki.php">"Let' s Talk About Unspeakable Things"</a></h2>
|
|
|
|
|
<div class="drag-content">
|
|
|
|
|
(thesis)
|
|
|
|
@ -216,36 +231,43 @@ groups()
|
|
|
|
|
|
|
|
|
|
function piles(){
|
|
|
|
|
|
|
|
|
|
var pile1_position=[300,300]
|
|
|
|
|
var pileM_position=[1800,900]
|
|
|
|
|
$(".pileM").each(function(i){
|
|
|
|
|
$(this).css({"top":i*60+pileM_position[1],"left":i*20+pileM_position[0]})
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
var pile0_position=[30,2500]
|
|
|
|
|
$(".pile0").each(function(i){
|
|
|
|
|
$(this).css({"top":pile0_position[1],"left":i*300+pile0_position[0]})
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
var pile1_position=[30,300]
|
|
|
|
|
$(".pile1").each(function(i){
|
|
|
|
|
$(this).css({"top":i*distance+pile1_position[1],"left":i*distance+pile1_position[0]})
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
var pile2_position=[300,1800]
|
|
|
|
|
var pile2_position=[100,1400]
|
|
|
|
|
$(".pile2").each(function(i){
|
|
|
|
|
$(this).css({"top":i*distance+pile2_position[1],"left":i*distance+pile2_position[0]})
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
var pile3_position=[1000,1250]
|
|
|
|
|
var pile3_position=[900,850]
|
|
|
|
|
$(".pile3").each(function(i){
|
|
|
|
|
$(this).css({"top":i*distance+pile3_position[1],"left":i*distance+pile3_position[0]})
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
var pile4_position=[1900,2300]
|
|
|
|
|
var pile4_position=[1600,1600]
|
|
|
|
|
$(".pile4").each(function(i){
|
|
|
|
|
$(this).css({"top":i*distance+pile4_position[1],"left":i*distance+pile4_position[0]})
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var pile5_position=[1300,300]
|
|
|
|
|
var pile5_position=[1000,100]
|
|
|
|
|
$(".pile5").each(function(i){
|
|
|
|
|
$(this).css({"top":i*distance+pile5_position[1],"left":i*distance+pile5_position[0]})
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
var pile6_position=[1600,1800]
|
|
|
|
|
$(".pile6").each(function(i){
|
|
|
|
|
$(this).css({"top":i*distance+pile6_position[1],"left":i*distance+pile6_position[0]})
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -255,7 +277,7 @@ function piles(){
|
|
|
|
|
|
|
|
|
|
function groups(){
|
|
|
|
|
|
|
|
|
|
var group_vowels_position=[1000,100]
|
|
|
|
|
var group_vowels_position=[800,100]
|
|
|
|
|
$(".group_vowels").each(function(i){
|
|
|
|
|
$(this).css({"top":i*distance+group_vowels_position[1],"left":i*distance+group_vowels_position[0]})
|
|
|
|
|
})
|
|
|
|
@ -270,11 +292,16 @@ function groups(){
|
|
|
|
|
$(this).css({"top":i*distance+group_extracts_position[1],"left":i*distance+group_extracts_position[0]})
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
var group_metadata_position=[800,1000]
|
|
|
|
|
var group_metadata_position=[1000,1000]
|
|
|
|
|
$(".group_metadata").each(function(i){
|
|
|
|
|
$(this).css({"top":i*distance+group_metadata_position[1],"left":i*distance+group_metadata_position[0]})
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
var group_menu_position=[1800,900]
|
|
|
|
|
$(".group_menu").each(function(i){
|
|
|
|
|
$(this).css({"top":i*60+group_menu_position[1],"left":i*20+group_menu_position[0]})
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|