Difference between revisions of "Template:Team:TU Eindhoven/Memory Script"
| Line 6: | Line 6: | ||
var inhoud = ['Cas','Cas','Elles','Elles','Esther','Esther','Femke','Femke','Hans','Hans','Jan-Willem','Jan-Willem','Kwankwan','Kwankwan','LauraJ','LauraJ','LauravS','LauravS','Sjoerd','Sjoerd','Yeshi','Yeshi']; | var inhoud = ['Cas','Cas','Elles','Elles','Esther','Esther','Femke','Femke','Hans','Hans','Jan-Willem','Jan-Willem','Kwankwan','Kwankwan','LauraJ','LauraJ','LauravS','LauravS','Sjoerd','Sjoerd','Yeshi','Yeshi']; | ||
var picture = ['5/55/TU_Eindhoven_Cas.png','5/55/TU_Eindhoven_Cas.png','5/57/TU_Eindhoven_Elles.png','5/57/TU_Eindhoven_Elles.png','0/01/TU_Eindhoven_Esther.png','0/01/TU_Eindhoven_Esther.png','5/5b/TU_Eindhoven_Femke.png','5/5b/TU_Eindhoven_Femke.png','c/cd/TU_Eindhoven_Hans.png','c/cd/TU_Eindhoven_Hans.png','d/d1/TU_Eindhoven_Jan-Willem.png','d/d1/TU_Eindhoven_Jan-Willem.png','d/dc/TU_Eindhoven_Kwankwan.png','d/dc/TU_Eindhoven_Kwankwan.png','1/10/TU_Eindhoven_LauraJ.png','1/10/TU_Eindhoven_LauraJ.png','d/d0/TU_Eindhoven_LauravS.png','d/d0/TU_Eindhoven_LauravS.png','b/bb/TU_Eindhoven_Sjoerd.png','b/bb/TU_Eindhoven_Sjoerd.png','2/2a/TU_Eindhoven_Yeshi.png','2/2a/TU_Eindhoven_Yeshi.png'] | var picture = ['5/55/TU_Eindhoven_Cas.png','5/55/TU_Eindhoven_Cas.png','5/57/TU_Eindhoven_Elles.png','5/57/TU_Eindhoven_Elles.png','0/01/TU_Eindhoven_Esther.png','0/01/TU_Eindhoven_Esther.png','5/5b/TU_Eindhoven_Femke.png','5/5b/TU_Eindhoven_Femke.png','c/cd/TU_Eindhoven_Hans.png','c/cd/TU_Eindhoven_Hans.png','d/d1/TU_Eindhoven_Jan-Willem.png','d/d1/TU_Eindhoven_Jan-Willem.png','d/dc/TU_Eindhoven_Kwankwan.png','d/dc/TU_Eindhoven_Kwankwan.png','1/10/TU_Eindhoven_LauraJ.png','1/10/TU_Eindhoven_LauraJ.png','d/d0/TU_Eindhoven_LauravS.png','d/d0/TU_Eindhoven_LauravS.png','b/bb/TU_Eindhoven_Sjoerd.png','b/bb/TU_Eindhoven_Sjoerd.png','2/2a/TU_Eindhoven_Yeshi.png','2/2a/TU_Eindhoven_Yeshi.png'] | ||
| − | var inhoudverhaal = ['Het epische levensverhaal van Cas, BSc','Elles','Esther','Femke','Hans','Jan-Willem','Kwankwan','LauraJ','LauravS','Sjoerd','Yeshi']; | + | var inhoudverhaal = ['Het epische levensverhaal van Cas, BSc', |
| + | '<h2>Elles Elschot – Policy & Practices, Gibson Assembly</h2>', | ||
| + | '<h2>Esther</h2><br />Currently I am in the third year of the bachelor Medical Sciences and Technology at the Eindhoven University of Technology. Together with Laura Jacobs I am responsible for the Policy & Practices part of our project. I am also helping the lab group with the Gibson Assembly. I joined the iGEM team because I am really interested in the field of synthetic biology and want to find out whether to specialize in this area in the future. I also think it is a great opportunity to do our own research project in this early stage of our study and hope to learn a lot from it. ', | ||
| + | '<h2>Femke</h2>', | ||
| + | '<h2>Hans</h2>', | ||
| + | '<h2>Jan-Willem</h2>', | ||
| + | '<h2>Kwankwan</h2>', | ||
| + | '<h2>LauraJ</h2>', | ||
| + | '<h2>LauravS</h2>', | ||
| + | '<h2>Sjoerd</h2>', | ||
| + | '<h2>Yeshi</h2>']; | ||
for (i = 1; i <= (inhoud.length/2); i++){ | for (i = 1; i <= (inhoud.length/2); i++){ | ||
| − | $('<div class="inhoud" id="inhoud' + inhoud[(i-1)*2].toString() + '">' + inhoudverhaal[i-1].toString() + '</div>').appendTo($("#inhoud")).css({'background- | + | $('<div class="inhoud" id="inhoud' + inhoud[(i-1)*2].toString() + '">' + inhoudverhaal[i-1].toString() + '</div>').appendTo($("#inhoud")).css({'background-color':'black','z-index':'-1'}); |
}; | }; | ||
$('<div class="inhoud" id="inhoudfirst">Find the matching cards.</div>').appendTo($("#inhoud")).css({'background-size':'100% 100%','background-color':'black','z-index':'1'}); | $('<div class="inhoud" id="inhoudfirst">Find the matching cards.</div>').appendTo($("#inhoud")).css({'background-size':'100% 100%','background-color':'black','z-index':'1'}); | ||
| Line 112: | Line 122: | ||
cardstat[numb-1] = 'blue'; | cardstat[numb-1] = 'blue'; | ||
$("#card" + numb.toString() ).css({'background-image':'url(https://static.igem.org/mediawiki/2015/' + randpic[numb-1].toString() + ')'}); | $("#card" + numb.toString() ).css({'background-image':'url(https://static.igem.org/mediawiki/2015/' + randpic[numb-1].toString() + ')'}); | ||
| − | |||
if ( b >= 2 ){ | if ( b >= 2 ){ | ||
wait = 1; | wait = 1; | ||
| Line 136: | Line 145: | ||
} else { | } else { | ||
$("#card" + varia.toString() ).css({'background-image':'url(https://static.igem.org/mediawiki/2015/5/54/TU_Eindhoven_card1.png)'}); | $("#card" + varia.toString() ).css({'background-image':'url(https://static.igem.org/mediawiki/2015/5/54/TU_Eindhoven_card1.png)'}); | ||
| − | |||
cardstat[varia-1] = 'yellow'; | cardstat[varia-1] = 'yellow'; | ||
} | } | ||
| Line 146: | Line 154: | ||
cardstat[crd-1] = 'red'; | cardstat[crd-1] = 'red'; | ||
$("#card" + crd.toString() ).css({'background-image':'url(https://static.igem.org/mediawiki/2015/' + randpic[crd-1].toString() + ')'}); | $("#card" + crd.toString() ).css({'background-image':'url(https://static.igem.org/mediawiki/2015/' + randpic[crd-1].toString() + ')'}); | ||
| − | |||
} | } | ||
Revision as of 08:38, 6 August 2015
$(document).ready(function(){ total = 22; var inhoud = ['Cas','Cas','Elles','Elles','Esther','Esther','Femke','Femke','Hans','Hans','Jan-Willem','Jan-Willem','Kwankwan','Kwankwan','LauraJ','LauraJ','LauravS','LauravS','Sjoerd','Sjoerd','Yeshi','Yeshi']; var picture = ['5/55/TU_Eindhoven_Cas.png','5/55/TU_Eindhoven_Cas.png','5/57/TU_Eindhoven_Elles.png','5/57/TU_Eindhoven_Elles.png','0/01/TU_Eindhoven_Esther.png','0/01/TU_Eindhoven_Esther.png','5/5b/TU_Eindhoven_Femke.png','5/5b/TU_Eindhoven_Femke.png','c/cd/TU_Eindhoven_Hans.png','c/cd/TU_Eindhoven_Hans.png','d/d1/TU_Eindhoven_Jan-Willem.png','d/d1/TU_Eindhoven_Jan-Willem.png','d/dc/TU_Eindhoven_Kwankwan.png','d/dc/TU_Eindhoven_Kwankwan.png','1/10/TU_Eindhoven_LauraJ.png','1/10/TU_Eindhoven_LauraJ.png','d/d0/TU_Eindhoven_LauravS.png','d/d0/TU_Eindhoven_LauravS.png','b/bb/TU_Eindhoven_Sjoerd.png','b/bb/TU_Eindhoven_Sjoerd.png','2/2a/TU_Eindhoven_Yeshi.png','2/2a/TU_Eindhoven_Yeshi.png'] var inhoudverhaal = ['Het epische levensverhaal van Cas, BSc', '
Elles Elschot – Policy & Practices, Gibson Assembly
', 'Esther
Currently I am in the third year of the bachelor Medical Sciences and Technology at the Eindhoven University of Technology. Together with Laura Jacobs I am responsible for the Policy & Practices part of our project. I am also helping the lab group with the Gibson Assembly. I joined the iGEM team because I am really interested in the field of synthetic biology and want to find out whether to specialize in this area in the future. I also think it is a great opportunity to do our own research project in this early stage of our study and hope to learn a lot from it. ', '
Femke
', 'Hans
', 'Jan-Willem
', 'Kwankwan
', 'LauraJ
', 'LauravS
', 'Sjoerd
', 'Yeshi
']; for (i = 1; i <= (inhoud.length/2); i++){ $('' + inhoudverhaal[i-1].toString() + '
').appendTo($("#inhoud")).css({'background-color':'black','z-index':'-1'});
};
$('Find the matching cards.
').appendTo($("#inhoud")).css({'background-size':'100% 100%','background-color':'black','z-index':'1'});
$('Hover over someones picture to find out more about him/her.
').appendTo($("#inhoud")).css({'background-size':'100% 100%','background-color':'black','z-index':'0'});
var idnr = 1;
var gekozen = [];
var cardstat = [];
var b = 0;
var wait = 0;
list1=inhoud;
list2=picture;
for (var i = list1.length - 1; i > 0; i--){
var j = Math.floor(Math.random()*(i+1));
var temp1 = list1[i];
list1[i] = list1[j];
list1[j] = temp1;
var temp2 = list2[i];
list2[i] = list2[j];
list2[j] = temp2;
}
rand = list1;
randpic=list2;
for (i = 1; i <= 4; i++){
$('').appendTo($("#memoryWrapper"));
if (i == 1 || i == 4){
for (ii = 1; ii <= 9; ii++){
$('').appendTo($("#row" + i.toString() )).css({'background-image':'url(https://static.igem.org/mediawiki/2015/5/54/TU_Eindhoven_card1.png)'});
cardstat[idnr-1] = 'yellow';
idnr++;
};
} else{
$('').appendTo($("#row" + i.toString() )).css({'float':'left','background-image':'url(https://static.igem.org/mediawiki/2015/5/54/TU_Eindhoven_card1.png)'});
cardstat[idnr-1] = 'yellow';
idnr++;
$('').appendTo($("#row" + i.toString() )).css({'float':'right','background-image':'url(https://static.igem.org/mediawiki/2015/5/54/TU_Eindhoven_card1.png)'});
cardstat[idnr-1] = 'yellow';
idnr++;
};
};
$('If you are feeling lazy.
').appendTo($("#memoryWrapper")).css({
'-moz-box-shadow':'inset 0px 1px 0px 0px #97c4fe',
'-webkit-box-shadow':'inset 0px 1px 0px 0px #97c4fe',
'box-shadow':'inset 0px 1px 0px 0px #97c4fe',
'background':'-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #3d94f6), color-stop(1, #1e62d0))',
'background':'-moz-linear-gradient(top, #3d94f6 5%, #1e62d0 100%);',
'background':'-webkit-linear-gradient(top, #3d94f6 5%, #1e62d0 100%)',
'background':'-o-linear-gradient(top, #3d94f6 5%, #1e62d0 100%)',
'background':'-ms-linear-gradient(top, #3d94f6 5%, #1e62d0 100%)',
'background':'linear-gradient(to bottom, #3d94f6 5%, #1e62d0 100%)',
'filter:progid':'DXImageTransform.Microsoft.gradient(startColorstr="#3d94f6", endColorstr="#1e62d0",GradientType=0)',
'background-color':'#3d94f6',
'-moz-border-radius':'6px',
'-webkit-border-radius':'6px',
'border-radius':'6px',
'border':'1px solid #337fed',
'display':'inline-block',
'cursor':'pointer',
'color':'#ffffff',
'font-family':'Arial',
'font-size':'15px',
'font-weight':'bold',
'padding':'6px 24px',
'text-decoration':'none',
'text-shadow':'0px 1px 0px #1570cd'});
for (cardnr = 1; cardnr <= rand.length; cardnr++){
$("#card" + cardnr.toString()).hover(function(){groen( $(this).attr('id').match(/\d+/) )},function(){geel( $(this).attr('id').match(/\d+/) )});
$("#card" + cardnr.toString()).click(function(){blauw( $(this).attr('id').match(/\d+/) )});
};
$("#revealAll").click(function(){revealAll()});
function groen(numb){
if (cardstat[numb-1] == 'yellow'){
$('#card' + numb.toString() ).css({'background-image':'url(https://static.igem.org/mediawiki/2015/a/a1/TU_Eindhoven_card2.png)'});
cardstat[numb-1] = 'green';
} else if (cardstat[numb-1] == 'red'){
for (inhoud = 1; inhoud <= (rand.length); inhoud++){
$("#inhoud" + rand[inhoud-1].toString() ).css({'z-index':'0'});
}
$("#inhoudsecond").css({'z-index':'0'});
$("#inhoud" + rand[numb-1].toString() ).css({'z-index':'2'});
}
};
function geel(numb){
if (cardstat[numb-1] == 'green'){
cardstat[numb-1] = 'yellow';
$("#card" + numb.toString() ).css({'background-image':'url(https://static.igem.org/mediawiki/2015/5/54/TU_Eindhoven_card1.png)'});
};
};
function blauw(numb){
if ( cardstat[numb-1] == 'green' || cardstat[numb-1] == 'yellow'){
if (wait == 0){
gekozen[b]=numb;
b++;
cardstat[numb-1] = 'blue';
$("#card" + numb.toString() ).css({'background-image':'url(https://static.igem.org/mediawiki/2015/' + randpic[numb-1].toString() + ')'});
if ( b >= 2 ){
wait = 1;
setTimeout(function(){
$(".card").css({'pointer-events':'auto'});
dezelfde (gekozen);
gekozen = [];
b = 0;
wait = 0;
},600);
};
};
};
};
function dezelfde(gekozen){
for (iii = 0; iii <= 1; iii++){
varia = gekozen[iii];
if (rand[gekozen[0]-1] == rand[gekozen[1]-1]){
$("#inhoudfirst").css({'z-index':'-1'});
$("#inhoudsecond").css({'z-index':'1'});
cardstat[varia-1] = 'red';
} else {
$("#card" + varia.toString() ).css({'background-image':'url(https://static.igem.org/mediawiki/2015/5/54/TU_Eindhoven_card1.png)'});
cardstat[varia-1] = 'yellow';
}
};
};
function revealAll(){
for (crd = 1; crd <= rand.length; crd++){
cardstat[crd-1] = 'red';
$("#card" + crd.toString() ).css({'background-image':'url(https://static.igem.org/mediawiki/2015/' + randpic[crd-1].toString() + ')'});
}
$("#inhoudfirst").css({'z-index':'-1'});
$("#inhoudsecond").css({'z-index':'1'});
$("#revealAll").css({'display':'none'});
}
});