Team:Hong Kong-CUHK/team.html

From 2014.igem.org

Latest revision as of 10:39, 8 March 2015

<style type="text/css">

1. board {

   background-image: url('images/board.png');
   background-size: 100% 100%;
   width: 700px;
   height: 700px;

} .chess {

   background-size: 100% 100%;
   width: 40px;
   height: 40px;
   position: absolute;
   cursor: pointer;

} .carousel-inner>.item>img {

   height:500px;

} .profile-pic {

   background-size: 100% 100%;
   width: 100px;
   height: 100px;
   position: absolute;
   cursor: pointer;

} .profile-dialog {

   width: 300px;
   height: 300px;
   position: absolute;
   display: none;

} .member-wrapper:hover > .profile-dialog {

   display: block;

} .photo {

   width: 83px;
   height: 250px;
   background-position: center;
   background-size: auto 100%;
   background-repeat: no-repeat;
   -webkit-filter: grayscale(80%);
   margin: 0;

} .photo:hover {

   -webkit-filter: grayscale(0%);

} .photo.show {

   width: 250px;
   height: 250px;
   -webkit-filter: grayscale(0%);

} .member-name {

   text-transform: uppercase;
   margin: 0;

} .member-role {

   font-style: italic;

} .member-about {

   text-align: justify;
   text-justify: distribute;

} </style> <style type="text/css"> .profile {

   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
   display: inline-block;
   visibility: hidden;
   width: 180px;
   height: 180px;
   border-radius: 20%;
   position: absolute;
   cursor: default;
   box-shadow: inset 0 0 0 0 rgba(200, 95, 66, 0.4), inset 0 0 0 16px rgba(255, 255, 255, 0.6), 0 1px 2px rgba(0, 0, 0, 0.1);
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;

} .profile:hover {

   box-shadow: inset 0 0 0 110px rgba(200, 95, 66, 0.4), inset 0 0 0 16px rgba(255, 255, 255, 0.8), 0 1px 2px rgba(0, 0, 0, 0.1);

} .profile:hover .boxAbout {

   opacity: 1;
   -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);

} .description-background { width:400px; } .row-alt .description-background { margin-left: 500px; } .teamline-separator { margin-top: 20px; margin-left: 40px; vertical-align:top; } .row-alt .teamline-separator {

   margin-left: -460px;

} .teamline-cross { margin-top: 45px; margin-left: 120px; vertical-align:top; width:300px; } .row-alt .teamline-cross {

   margin-left: -380px;

} .description {

   display: block;
   position: absolute;
   top: 27px;
   left: 0px;
   width: 420px;
   height: 330px;
   background: rgba(255, 255, 255, 0.701961);
   padding: 10px;

} .row-alt .description { margin-left: 500px; } .row-alt .profile {

   margin-left: -500px;

} .row-0-col-0 {

   top: 7px;
   left: 520px;

} .row-0-col-1 {

   top: 7px;
   left: 750px;

} .row-1-col-0 {

   top: 207px;
   left: 520px;

} .row-1-col-1 {

   top: 207px;
   left: 750px;

} </style> <style type="text/css"> .boxAbout {

   position: absolute;
   width: 100%;
   height: 100%;
   text-align: center center;
   border-radius: 50%;
   opacity: 0;
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   -webkit-backface-visibility: hidden;

} .boxAbout h3 {

   color: #fff;
   text-align: center;
   text-transform: uppercase;
   position: relative;
   letter-spacing: 2px;
   font-size: 18px;
   padding-top: 22px 0 0 0;
   font-family: 'Open Sans', Arial, sans-serif;
   text-shadow: 0 0 1px #fff, 0 1px 2px rgba(0, 0, 0, 0.3);

} </style>

               <img src="" alt="Our Team Photo">

               <img src="" alt="CUHK x Bordeaux">

               <img src="" alt="Our Poster">

               <img src="" alt="CUHK A.V. Revolution">

               <img src="" alt="Dinner at Great Jamboree">

       <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
           <img src="" style="
   position: inherit;    
   display: inline-block;    
   top: 50%;    
   width: auto;    height:1em;    
   margin-left: -25px;
   background:transparent;">
       </a>
       <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
           <img src="" style="
   position: inherit;    
   display: inline-block;    
   top: 50%;    
   width: auto;    height:1em;    
   margin-left: 0;
   background:transparent;

       </a>

           <img src="" class="description-background">
           <img src="" class="teamline-separator">
           <img src="" class="teamline-cross">

<script type="text/javascript"> var content = {

   "containerId": "team-container",
   "data": [{
       "members": [{
           "name": "Leo",
           "about": "I am Leo Stone (Seak Chi U), a Macau student studying in Cell and Molecular Biology Program. I am the team leader this year. I live on the Earth Since 1994. I love the Earth. Please contact me if you are newcomer to the Earth. ##All reality is a phantom, and all phantoms are real. That is why I am the King of the World.##",
           "profilePicUrl": ""
       }, {
           "name": "Ricky",
           "about": "Hey, this  is Ricky =]  I am a year three undergraduate student studying in CUHK. Having fun is my hobby,  I am so glad to be in IGEM that offers me so much fun, oportunities and experiences. The best part of IGEM is that  we, undergraduate students are able to make our own decisions to develop the whole project and share it with teams from around the world.",
           "profilePicUrl": ""
       }, {
           "name": "Joe",
           "about": "Hi, I am Joe, a student who study Mathematics.I am so glad to participate in IGEM jamboree.Particpating in IGEM is a great memory in my university life, since we are doing what we like,synthestic biology.In leisure time, I play American pool and table tennis with my friends.Also, I like reading books, especially some scientific fiction or philosophy related books.",
           "profilePicUrl": ""
       }, {
           "name": "Elaine",
           "about": "Hey guys, this is Elaine. I've been one of the team member of iGEM Hong_Kong-CUHK team this year. I'm corresponding to part of the wet lab and part of the human practice. Being an engineering student, I could rarely have an opportunity to reach cloning stuff so I really treasure this opportunity. I've learnt some new things in iGEM and enjoy this summer with myself immersed in lab. Exhausting but fun.",
           "profilePicUrl": ""
       }]
   }, {
       "members": [{
           "name": "Terence",
           "about": "Hello, I am Terence from Biomedical Engineering programme. I’m glad to join iGEM team because it can definitely enhance my biological and engineering knowledge like reading academic papers help to understand the great ideas from different scientists and we base on theirs to develop our project direction. It has been a fruitful journey and the things learnt from iGEM will benefit me for my future.",
           "profilePicUrl": ""
       }, {
           "name": "Michelle",
           "about": "I am Michelle from biomedical engineering. I have never thought of representing CUHK to join any competition. It is really my pleasure to be one of the CUHK iGEM team member. Through this summer, we finally decided our project and built bio bricks. Although there are failures and obstacles, I indeed received a lots through brainstorming ideas and doing lab work. It has been an unforgettable experience in summer. Looking forward to seeing you all in Jamboree.",
           "profilePicUrl": ""
       }, {
           "name": "Lily",
           "about": "Hi! I'm Lily majoring in Computer Science. It is lucky that I have a chance to work as a team in iGEM. I enjoy creating new things with knowledge. That's why I love computer-related work as well as synthetic biology in the same time. Hope you like the wiki.",
           "profilePicUrl": ""
       }, {
           "name": "Terry",
           "about": "Hello, I am Terry, a year two student of Biomedical Engineering. I am interested in science since I was a child. I am glad that I have a chance to participate in iGem competition. Experience being a sciencetist. I enjoy working with my teammates. We build up our friendship. I am looking forward to having more fun in the Jamboree.",
           "profilePicUrl": ""
       }]
   }, {
       "members": [{
           "name": "Tim",
           "about": "I am KWOK Wai Ho. I am studying Mathematics and Information Engineering. Before joining the iGEM team, I have nearly zero knowledge in biology. Now, I am quite confident with the basic knowlegde in Synthetic Biology and the lab technique. Also, I learnt a lot from the modeling part of the project. Of course, one of the most important things was that I have made friends from different backgrounds. This was a really great experience.",
           "profilePicUrl": ""
       }, {
           "name": "Justin",
           "about": "This is Justin. I am majoring in Mathematic and Information Engineering. iGEM has given me a great opportunity to put my knowledge into practice. I am one of the wet lab team members though I interested in bioinformatics. I have found that web lab is more interesting than I thought it would. All in all, I really enjoyed it.",
           "profilePicUrl": ""
       }, {
           "name": "Tina",
           "about": "Tianlin He, year-three student of Department of Molecular Biotechnology at CUHK, currently study as an exchange student in FU Berlin. Crazily enjoy everything in a cloning lab, except the time spent on waiting for the PCR machine. For me, life can´t be without literature, language learning and of course life sciences!",
           "profilePicUrl": ""
       }]
   },{
       "members": [{
           "name": "Jennifer",
           "about": "Hello, I am Jennifer, a junior Taiwanese girl studying at CUHK. I participated in iGEM last year and I am glad to continue the exciting iGEM journey! In the past few months, I have spent a great time with a group of enthusiastic and bright students. It is thrilling to see how they have been working hard to carry out their innovative project. I am eager to see more interesting ideas from iGEMer around the world in the upcoming Giant Jamboree.",
           "profilePicUrl": ""
       }, {
           "name": "Stephen",
           "about": "Hi! I'm Stephen, currently a graduate student focusing on plant cell biology research. Apart from having a taste of synthetic biology, which constantly surprises me with fascinating ideas, I'm honoured to guide a team of enthusiastic students with great perseverance. I hope the team can enjoy themselves and I'm looking forward to seeing other new ideas in the coming competition!",
           "profilePicUrl": ""
       }, {
           "name": "Jacky",
           "about": "Jacky is a third-year PhD student in School of Life Science at CUHK. His research focus is aptamer technology and its integration on bio-sensors development for downstream applications. He also studies the mechanism of multi-drug resistant cancer, focusing on the organelle-specific targeted drug action.",
           "profilePicUrl": ""
       }, {
           "name": "Kaiyin",
           "about": "This is Karin (Kaiyin Feng), a senior undergraduate in Electronic Engineering. I was there (https://2012.igem.org/Team:Hong_Kong-CUHK/TEAM_MEMBERS) in the team two years ago, and the enchantment of iGEM and some team-spirit bring me back as a student instructor of our team 2014. Greetings, iGEMers! Well, my current research interests focus mostly on theoretical and experimental analysis of nonlinear optics, nano-photonics and nanoelectronics.",
           "profilePicUrl": ""
       }]
   }, {
       "members": [{
           "name": "ZHU Lin",
           "about": "Hi, I am a graduate student studying Bioinformatics at CUHK. My research interests focus on cancer genetics and genomics, next generation sequencing analysis, and computational biology. I am very glad to join this team. I appreciate the opportunity to participate in the iGEM competition, which is an icon of innovation. In my spare time, I enjoy reading, travelling, playing badminton, dancing and hiking.",
           "profilePicUrl": ""
       }, {
           "name": "Dr. Douglas Yung",
           "about": "Dr. Douglas Yung is an Assistant Professor in the CUHK Biomedical Engineering Program. He has been intrigued by biosensing and electronic interfacing of living cells since graduate school. On the biosensing side, his research group is developing technologies for rapid viability assessment of superbugs using a combination of electrochemical, optical techniques and MEMS devices. His team is also developing methods to interface living microbes with electronics at a micro- and nano-scale. As for this year’s iGEM, he primarily provides support on the device and engineering side.",
           "profilePicUrl": ""
       }, {
           "name": "Dr. KM Chan",
           "about": "Dr. King Ming Chan is an Associate Professor of School of Life Sciences and Director of Environmental Science Program, Faculty of Science, Chinese University. His research focuses on Aquatic Toxicology and Molecular Endocrinology using fish models. Recent studies are mainly on transgenic fish over-expressing somatolactin hormone for functional study and use of biomarkers of exposures to study the risk of environmental contaminants including pesticides, trace organics, nanoparticles, and metal ions in waters. Dr. Chan also studies the regulation of eukaryotic gene expression and transcription, focusing on understanding how metal-regulatory-element-binding transcription factors (MTFs) control metallothionein genes and how Pit-1s control pituitary polypeptide hormone genes.",
           "profilePicUrl": ""
       }, {
           "name": "Dr. TF Chan",
           "about": "Dr. Ting-Fung Chan is an Assistant Professor in the School of Life Sciences, and the Deputy Director of the Centre for Microbial Genomics and Proteomics at the Chinese University of Hong Kong. He is the Coordinator of the CUHK iGEM team. His researches mainly focus on genomics and bioinformatics of microbial pathogens and complex human phenotypes. He enjoys talking about science, but even more so for toys: Mindstorms NXT, RX-178, 5D Mk-II, LX200-ACF, YAS-875EX, and iGEM. He wishes his students would comprehend the fun and excitement of all aforementioned, but if that is not possible then at the very least, iGEM.",
           "profilePicUrl": ""
       }]
   }, {
       "members": [{
           "name": "Dr. Kevin Yip",
           "about": "Dr. Kevin Yio is an assistant professor in the Deprtment of Computer Science and Engineering of the Chinese University of Hong Kong. He has been researching in the field of bioinformatics for 9 years, since he was a graduate student first in Hong Kong and later at Yale University. He is particularly interested in modeling and studying the interactions of biological objects in large-scale networks, such as protein-protein interaction, gene regulatory and metabolic networks. His major role in the CUHK iGEM team is to introduce the competition to engineering students, recruit interested and committed individuals, and help them to enrich the engineering aspects of the project.",
           "profilePicUrl": ""
       }, {
           "name": "Prof. SK Kong",
           "about": "Prof. KONG's laboratory studies the process of apoptosis. In particular, he is interested in elucidating how mitochondria regulate the apoptosis in 'normal' and drug-resistant cancer cells. He wonders how the resistance of mitochondria to MMP can explain the resistance of cancer cells to apoptosis induction, and he hopes to develop strategies for overcoming chemotherapy resistance by targeting tumor mitochondria. He believes that pharmacological interventions on mitochondria are good strategies to promote cell death in tumor cells. This research topic on apoptosis is therefore relevant to disease treatment with socioeconomic impacts.",
           "profilePicUrl": ""
       }]
   }]

};

function fillMemberContent(model, boxProfile, boxAbout) {

   // $.each(model['members'], function(index, value) {
   //     var row = Math.floor((index + 0.5) / 2);
   //     var col = index % 2;
   //     var classToFind = '#' + model['tableId'] + ' .row .' + 'row-' + row + '-col-' + col;
   //     console.log(classToFind + ', ' + value['name']);
   //     $(classToFind).text(value['name']);
   //     $(classToFind).mouseenter(function() {
   //         '#' + model['tableId'] + 
   //     });
   // });
   boxProfile.find('.boxAbout h3').text(model['name']);
   boxProfile.css('background-image', "url('" + model['profilePicUrl'] + "')");
   boxProfile.click(function() {
       boxAbout.text(model['about']);
   });
   boxProfile.hover(function() {
       boxAbout.text(model['about']);
   });
   boxProfile.css('visibility', 'visible');

}

$(document).ready(function() {

   $(function() {
       $('.carousel').carousel({
           interval: 3000
       });
   });

   var contentContainer = $('#' + content.containerId);
   $.each(content.data, function(rowIndex, data) {
       //var viewRow = $('#' + content.containerId + ' .row:nth-of-type(' + (rowIndex + 1) + ')');
       var viewRow = contentContainer.find('div:first').clone();
       console.log(viewRow);
       var boxAbout = viewRow.find('.description');
       $.each(data.members, function(position, member) {
           var row = Math.floor((position + 0.5) / 2);
           var col = position % 2;
           var boxProfile = viewRow.find(' .' + 'row-' + row + '-col-' + col);
           fillMemberContent(member, boxProfile, boxAbout);
       });

       if(rowIndex % 2) {
       	viewRow.addClass('row-alt');
       }
       viewRow.show();
       contentContainer.append(viewRow);
   });

   //fillTeamContent(content.webLab);

   // $.each(content.members, function(index, value) {

   //         .addClass('member-wrapper')
   //         .css('position', 'relative')
   //         .offset(value.offset);

   //         .addClass('profile-dialog')
   //         .css('font-size', '18')
   //         .css('background', value.dialog.background)
   //         .text(value.info.about)
   //         .offset(value.dialog.offset);

   //         .addClass('profile-pic')
   //         .data("index", index)
   //         .css('background', value.profilePic.background)
   //         .offset(value.profilePic.offset);

   //         .addClass('chess')
   //         .data("index", index)
   //         .css('background-image', 'url(images/chess/chess_' + value.info.chessColor + '.png)');

   //     wrapper.append(chess);
   //     wrapper.append(profile_pic);
   //     wrapper.append(dialog);
   //     $("#board").append(wrapper);
   // });

}); </script>