Angeliki
/
eaiaiaiaoi
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

finalized reshuffle

Browse Source
master
Angeliki 6 years ago
parent 444ca52221
commit d5ea7d3378
3 changed files with 136 additions and 82 deletions
Show Stats Download Patch File Download Diff File

202
amplification.php
Unescape Escape View File

@ -17,102 +17,143 @@
<button onclick="piles()">piles</button> <button onclick="piles()">piles</button>
<button onclick="groups()">groups</button> <button onclick="groups()">groups</button>
<!-- <h2 style="border: 1px solid; background-color: white; padding: 10px; width: 500px; position:absolute;top: 0; left: 45%;" >Amplification of female voices</h2>
-->
<!-- draggable archive --> <!-- draggable archive -->
<!-- metadata for each workshop -->
<div class="draggable scaleable-wrapper box_metadata">
<li>Actions:<li>
<ul>
<li>Reading extracts</li>
<li>Discussion on public voice</li>
<li>Transcribing vowels</li>
</ul>
<li>Outcome: Score of vowels<li>
<li>Date: 23/5/2019<li>
<li>Location: Leeszaal<li>
</div>
<!-- div vowels --> <!-- div vowels -->
<div id="resize" class="draggable ui-draggable-handle" style="top: 6px; left: 1038px; line-height: 0 !important;"><a href="images/vowels-leeszaal-test.jpg"><img src="images/vowels-leeszaal-test.jpg" width="400px"></img></a></div> <div id="resize" class="draggable ui-draggable-handle group_vowels pile1"><a href="images/vowels-leeszaal-test.jpg"><img src="images/vowels-leeszaal-test.jpg" width="400px"></img></a></div>
<div id="resize" class="draggable ui-draggable-handle" style="top: 47px; left: 1083px;line-height: 0 !important;"><a href="images/vowels-20190322-leeszaal.jpg"><img src="images/vowels-20190322-leeszaal.jpg" width="400px"></img></a></div>
<div id="resize" class="draggable ui-draggable-handle" style="top: 81px; left: 1137px; line-height: 0 !important;"><a href="images/vowels-20190328-leeszaal.jpg"><img src="images/vowels-20190328-leeszaal.jpg" width="400px"></img></a></div> <div id="resize" class="draggable ui-draggable-handle group_vowels pile1"><a href="images/vowels-20190328-leeszaal.jpg"><img src="images/vowels-20190328-leeszaal.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 116px; left: 1176px;"><a href="images/vowels-20190329-finearts.jpg" target="_blank"><img src="images/vowels-20190329-finearts.jpg" width="400px"></img></a></div> <div id="img" class="draggable ui-draggable-handle group_vowels pile2"><a href="images/vowels-20190329-finearts.jpg" target="_blank"><img src="images/vowels-20190329-finearts.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 156px; left: 1216px;"><a href="images/vowels-20190508-leeszaal-1.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-1.jpg" width="400px"></img></a></div> <div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-1.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-1.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 196px; left: 1256px;"><a href="images/vowels-20190508-leeszaal-2.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-2.jpg" width="400px"></img></a></div> <div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-2.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-2.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 236px; left: 1296px;"><a href="images/vowels-20190508-leeszaal-3.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-3.jpg" width="400px"></img></a></div> <div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-3.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-3.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 276px; left: 1336px;"><a href="images/vowels-20190508-leeszaal-4.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-4.jpg" width="400px"></img></a></div> <div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-4.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-4.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 316px; left: 1376px;"><a href="images/vowels-20190508-leeszaal-5.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-5.jpg" width="400px"></img></a></div> <div id="img" class="draggable ui-draggable-handle group_vowels pile3"><a href="images/vowels-20190508-leeszaal-5.jpg" target="_blank"><img src="images/vowels-20190508-leeszaal-5.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 356px; left: 1416px;"><a href="images/vowels-20190523-leeszaal-1.jpg" target="_blank"><img src="images/vowels-20190523-leeszaal-1.jpg" width="400px"></img></a></div> <div id="img" class="draggable ui-draggable-handle group_vowels pile4"><a href="images/vowels-20190523-leeszaal-1.jpg" target="_blank"><img src="images/vowels-20190523-leeszaal-1.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 396px; left: 1456px;"><a href="images/vowels-20190523-leeszaal-2.jpg" target="_blank"><img src="images/vowels-20190523-leeszaal-2.jpg" width="400px"></img></a></div> <div id="img" class="draggable ui-draggable-handle group_vowels pile4"><a href="images/vowels-20190523-leeszaal-2.jpg" target="_blank"><img src="images/vowels-20190523-leeszaal-2.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 436px; left: 1496px;"><a href="images/vowels-20190530-leeszaal.jpg" target="_blank"><img src="images/vowels-20190530-leeszaal.jpg" width="400px"></img></a></div> <div id="img" class="draggable ui-draggable-handle group_vowels pile5"><a href="images/vowels-20190530-leeszaal.jpg" target="_blank"><img src="images/vowels-20190530-leeszaal.jpg" width="400px"></img></a></div>
<!-- div extracts --> <!-- div extracts -->
<div> <div>
<div class="draggable ui-draggable-handle" style="top: 1300px; left: 900px; line-height: 0 !important;"><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/carson-extract.jpg" target="_blank"><img src="images/carson-extract.jpg" width="550px" /></a></div>
<div class="draggable ui-draggable-handle" style="top: 1400px; left: 1000px; line-height: 0 !important;"><a href="images/fresh1.jpg" target="_blank"><img src="images/fresh1.jpg" width="600px" /></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" style="top: 1500px; left: 1100px; line-height: 0 !important;"><a href="images/fresh2.jpg" target="_blank"><img src="images/fresh2.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>
<!-- div images --> <!-- div images -->
<div id="img" class="draggable ui-draggable-handle" style="top: 637px; left: 406px;"><img src="images/meeting-20190508_leeszaal.jpg" width="400px"></img></div> <div id="img" class="draggable ui-draggable-handle group_photos pile3"><img src="images/meeting-20190508_leeszaal.jpg" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 637px; left: 306px;"><img src="images/meeting-20190328-leeszaal-5.JPG" width="400px"></img></div> <div id="img" class="draggable ui-draggable-handle group_photos pile1"><img src="images/meeting-20190328-leeszaal-5.JPG" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 189px; left: 264px;"><img src="images/meeting-20190329-finearts-2.JPG" width="400px"></img></div> <div id="img" class="draggable ui-draggable-handle group_photos pile2" ><img src="images/meeting-20190329-finearts-2.JPG" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 574px; left: 100px;"><img src="images/meeting-20190329-finearts-1.JPG" width="400px"></img></div> <div id="img" class="draggable ui-draggable-handle group_photos pile2"><img src="images/meeting-20190329-finearts-1.JPG" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 570px; left: 125px;"><img src="images/meeting-20190328-leeszaal-3.JPG.jpg" width="400px"></img></div> <div id="img" class="draggable ui-draggable-handle group_photos pile1"><img src="images/meeting-20190328-leeszaal-3.JPG.jpg" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 838px; left: 385px;"><img src="images/meeting-20190328-leeszaal-1.JPG" width="400px"></img></div> <div id="img" class="draggable ui-draggable-handle group_photos pile1"><img src="images/meeting-20190328-leeszaal-1.JPG" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 384px; left: 16px;"><img src="images/meeting-20190328-leeszaal-2.JPG" width="400px"></img></div> <div id="img" class="draggable ui-draggable-handle group_photos pile1"><img src="images/meeting-20190328-leeszaal-2.JPG" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 225px; left: 228px;z-index: -1;"><img class="draggable" style="width: 200px !important" src="http://pzwiki.wdka.nl/mw-mediadesign/images/6/69/Poster_unpacking.png"></img></div> <div id="img" class="draggable ui-draggable-handle group_photos pile2"><img class="draggable" style="width: 200px !important" src="http://pzwiki.wdka.nl/mw-mediadesign/images/6/69/Poster_unpacking.png"></img></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 337px; left: 506px;"><img src="images/meeting-20190523-leeszaal-1.jpg" width="400px"></img></div> <div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-1.jpg" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 140px; left: 206px;"><img src="images/meeting-20190523-leeszaal-2.jpg" width="400px"></img></div> <div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-2.jpg" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 237px; left: 306px;"><img src="images/meeting-20190523-leeszaal-3.jpg" width="400px"></img></div> <div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-3.jpg" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 310px; left: 560px;"><a href="images/meeting-20190530-leeszaal-1.jpg" target="_blank"><img src="images/meeting-20190530-leeszaal-1.jpg" width="400px"></img></a></div> <div id="img" class="draggable ui-draggable-handle group_photos pile4" ><a href="images/meeting-20190530-leeszaal-1.jpg" target="_blank"><img src="images/meeting-20190530-leeszaal-1.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 200px; left: 446px;"><img src="images/meeting-20190523-leeszaal-4.jpg" width="400px"></img></div> <div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-4.jpg" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 600px; left: 520px;"><img src="images/meeting-20190523-leeszaal-5.jpg" width="400px"></img></div> <div id="img" class="draggable ui-draggable-handle group_photos pile4"><img src="images/meeting-20190523-leeszaal-5.jpg" width="400px"></img></div>
<div id="img" class="draggable ui-draggable-handle group_photos pile5"><a href="images/meeting-20190530-leeszaal-2.jpg" target="_blank"><img src="images/meeting-20190530-leeszaal-2.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 410px; left: 430px;"><a href="images/meeting-20190508_leeszaal.jpg" target="_blank"><img src="images/meeting-20190508_leeszaal.jpg" width="400px"></img></a></div>
<div id="img" class="draggable ui-draggable-handle" style="top: 440px; left: 200px;"><a href="images/meeting-20190530-leeszaal-2.jpg" target="_blank"><img src="images/meeting-20190530-leeszaal-2.jpg" width="400px"></img></a></div> <!-- metadata for each workshop -->
<div class="draggable scaleable-wrapper box_metadata group_metadata pile1">
<li>Actions:<li>
<ul>
<li>Reading extracts</li>
<li>Discussion on public voice</li>
<li>Transcribing vowels</li>
</ul>
<li>Outcome: Score of vowels<li>
<li>Date: 28/3/2019<li>
<li>Location: Leeszaal<li>
</div>
<div class="draggable scaleable-wrapper box_metadata group_metadata pile2">
<li>Actions:<li>
<ul>
<li>Reading extracts</li>
<li>Discussion on public voice</li>
<li>Transcribing vowels</li>
</ul>
<li>Outcome: Score of vowels<li>
<li>Date: 29/3/2019<li>
<li>Location: Fine Arts<li>
</div>
<div class="draggable scaleable-wrapper box_metadata group_metadata pile3">
<li>Actions:<li>
<ul>
<li>Reading extracts</li>
<li>Discussion on public voice</li>
<li>Transcribing vowels</li>
</ul>
<li>Outcome: Score of vowels<li>
<li>Date: 08/5/2019<li>
<li>Location: Leeszaal<li>
</div>
<div class="draggable scaleable-wrapper box_metadata group_metadata pile4">
<li>Actions:<li>
<ul>
<li>Reading extracts</li>
<li>Discussion on public voice</li>
<li>Transcribing vowels</li>
</ul>
<li>Outcome: Score of vowels<li>
<li>Date: 23/5/2019<li>
<li>Location: Leeszaal<li>
</div>
<div class="draggable scaleable-wrapper box_metadata group_metadata pile5">
<li>Actions:<li>
<ul>
<li>Reading extracts</li>
<li>Discussion on public voice</li>
<li>Transcribing vowels</li>
</ul>
<li>Outcome: Score of vowels<li>
<li>Date: 30/5/2019<li>
<li>Location: Leeszaal<li>
</div>
<!-- draggable menu--> <!-- draggable menu-->
@ -135,24 +176,24 @@
(audio archive) (audio archive)
</div> </div>
</div> </div>
<div class="draggable scaleable-wrapper" style="top: 860px; right: 335px;"> <div class="draggable scaleable-wrapper" style="top: 100%; right: 335px;">
<h2 ><a href="index.php">About</a></h2> <h2 ><a href="index.php">About</a></h2>
<div class="drag-content"> <div class="drag-content">
(main page) (main page)
</div> </div>
</div> </div>
<div class="draggable scaleable-wrapper" style="top: 1270px; left: 100px;z-index: 1;"> <div class="draggable scaleable-wrapper" style="top: 80%; left: 70%;">
<h2 ><a href="podcast4.php">Podcast4</a></h2> <h2 ><a href="podcast4.php">Podcast4</a></h2>
</div> </div>
<div class="draggable scaleable-wrapper" style="top: 920px; left: 10px;"> <div class="draggable scaleable-wrapper" style="top: 85%; left: 81%;">
<h2 ><a href="podcast1.php">Podcast1</a></h2> <h2 ><a href="podcast1.php">Podcast1</a></h2>
</div> </div>
<div class="draggable scaleable-wrapper" style="top: 1420px; left: 150px;"> <div class="draggable scaleable-wrapper" style="top: 90%; left: 80%;">
<h2 ><a href="podcast2.php">Podcast2</a></h2> <h2 ><a href="podcast2.php">Podcast2</a></h2>
</div> </div>
<div class="draggable scaleable-wrapper" style="top: 1320px; left: 380px;"> <div class="draggable scaleable-wrapper" style="top: 75%; left: 79%;">
<h2 ><a href="podcast3.php">Podcast3</a></h2> <h2 ><a href="podcast3.php">Podcast3</a></h2>
</div> </div>
@ -168,47 +209,68 @@
<!-- reshuffle --> <!-- reshuffle -->
<script> <script>
var distance=100 var distance=20
groups() groups()
piles()
function piles(){ function piles(){
var pile1_position=[20,100]
$(".pile1").each(function(i){
$(this).css({"top":i*distance+pile1_position[1],"left":i*distance+pile1_position[0]})
})
var pile2_position=[600,200] var pile1_position=[300,300]
$(".pile2").each(function(i){ $(".pile1").each(function(i){
$(this).css({"top":i*distance+pile2_position[1],"left":i*distance+pile2_position[0]}) $(this).css({"top":i*distance+pile1_position[1],"left":i*distance+pile1_position[0]})
}) })
var pile2_position=[300,1800]
$(".pile2").each(function(i){
$(this).css({"top":i*distance+pile2_position[1],"left":i*distance+pile2_position[0]})
})
var pile3_position=[1000,1250]
$(".pile3").each(function(i){
$(this).css({"top":i*distance+pile3_position[1],"left":i*distance+pile3_position[0]})
})
var pile4_position=[1900,2300]
$(".pile4").each(function(i){
$(this).css({"top":i*distance+pile4_position[1],"left":i*distance+pile4_position[0]})
})
var pile5_position=[1300,300]
$(".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]})
})
var pile3_position=[300,300]
$(".pile3").each(function(i){
$(this).css({"top":i*distance+pile3_position[1],"left":i*distance+pile3_position[0]})
})
} }
function groups(){ function groups(){
var group_vowels_position=[20,100] var group_vowels_position=[1000,100]
$(".group_vowels").each(function(i){ $(".group_vowels").each(function(i){
$(this).css({"top":i*distance+group_vowels_position[1],"left":i*distance+group_vowels_position[0]}) $(this).css({"top":i*distance+group_vowels_position[1],"left":i*distance+group_vowels_position[0]})
}) })
var group_photos_position=[300,100] var group_photos_position=[20,100]
$(".group_photos").each(function(i){ $(".group_photos").each(function(i){
$(this).css({"top":i*distance+group_photos_position[1],"left":i*distance+group_photos_position[0]}) $(this).css({"top":i*distance+group_photos_position[1],"left":i*distance+group_photos_position[0]})
}) })
var group_extracts_position=[300,100] var group_extracts_position=[50,1000]
$(".group_extracts").each(function(i){ $(".group_extracts").each(function(i){
$(this).css({"top":i*distance+group_extracts_position[1],"left":i*distance+group_extracts_position[0]}) $(this).css({"top":i*distance+group_extracts_position[1],"left":i*distance+group_extracts_position[0]})
}) })
var group_metadata_position=[300,100] var group_metadata_position=[800,1000]
$(".group_metadata").each(function(i){ $(".group_metadata").each(function(i){
$(this).css({"top":i*distance+group_metadata_position[1],"left":i*distance+group_metadata_position[0]}) $(this).css({"top":i*distance+group_metadata_position[1],"left":i*distance+group_metadata_position[0]})
}) })

4
diary.php
Unescape Escape View File

@ -54,6 +54,10 @@
<!-- end draggable menu--> <!-- end draggable menu-->
<div id="resize" class="draggable ui-draggable-handle"><a href="images/vowels-20190322-leeszaal.jpg"><img src="images/vowels-20190322-leeszaal.jpg" width="400px"></img></a></div>
<div class="draggable" style="position:absolute; top:6%; left:5%;width:1800px;"> <div class="draggable" style="position:absolute; top:6%; left:5%;width:1800px;">
<audio controls > <audio controls >
<source src="audio/20190122-track-extracts.mp3" type="audio/mpeg"> <source src="audio/20190122-track-extracts.mp3" type="audio/mpeg">

12
styles/stylesheet.css
Unescape Escape View File

@ -643,30 +643,18 @@ li, #angela, #judith, #laurie, #dana, #katalin {
/*reshuffle piles*/ /*reshuffle piles*/
.group_vowels { .group_vowels {
width:200px;
height:400px;
border-style:solid;
position:absolute; position:absolute;
} }
.group_photos { .group_photos {
width:200px;
height:400px;
border-style:solid;
position:absolute; position:absolute;
} }
.group_extracts { .group_extracts {
width:200px;
height:400px;
border-style:solid;
position:absolute; position:absolute;
} }
.group_metadata { .group_metadata {
width:200px;
height:400px;
border-style:solid;
position:absolute; position:absolute;
} }
Write Preview
Loading…
Cancel
Save