|
|
| Line 1: |
Line 1: |
| − | <!--
| |
| − | <html lang="kr">
| |
| − | <!doctype html>
| |
| − |
| |
| − | <head>
| |
| − | <meta charset="utf-8">
| |
| − | <meta name="viewport" content="width=device-width, initial-scale=1.0">
| |
| − | <title>Central Memorial iGEM</title>
| |
| − |
| |
| − | <link href='https://fonts.googleapis.com/css?family=Ubuntu:500' rel='stylesheet' type='text/css'>
| |
| − | <link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
| |
| − | <link href="https://2015.igem.org/Team:Central_Calgary/header-footer?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
| |
| − | <link href="https://2015.igem.org/Team:Central_Calgary/main-content?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
| |
| − | <link href="https://2015.igem.org/Team:Central_Calgary/teampage?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
| |
| − | <link href="https://2015.igem.org/Team:Central_Calgary/loader?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
| |
| − | <link href="https://2015.igem.org/Team:Central_Calgary/outreach?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
| |
| − |
| |
| − | </head>
| |
| − |
| |
| − | <body>
| |
| − |
| |
| − | <div id="loader-wrapper">
| |
| − | <div id="loader"></div>
| |
| − | <div id="loader1"></div>
| |
| − |
| |
| − | <div class="loader-section section-top"></div>
| |
| − | <div class="loader-section section-bot"><h4>This website supports IE 11+, Microsoft Edge, Firefox 40+, Google Chrome 45+, Safari 8+, Opera 31+, iOS 8.4+, and Android Chrome. <br>The wiki will not load if you are not using a supported browser. </h4></div>
| |
| − | </div>
| |
| − |
| |
| − | <div id="fade" class="black_overlay"></div>
| |
| − |
| |
| − | <div id="header">
| |
| − | <div id="logoDiv"><img id="logo" src ="https://static.igem.org/mediawiki/2015/8/86/CentralLogo.png" alt="logo"></div>
| |
| − | <div id="homeText"><h10> Central iGEM </h10></div>
| |
| − | <div id="headerLeft"></div>
| |
| − | <ul id="headerMenu">
| |
| − | <li class="headerMenuItem"><a class="menuItem" id="bPolicy" href="#" data-target="policy1" align="middle">Outreach</a></li>
| |
| − | <li class="headerMenuItem"><a class="menuItem" id="bLogbook" href="#" data-target="logbook1" align="middle">Logbook</a></li>
| |
| − | <li class="headerMenuItem"><a class="menuItem" id="bEthics" href="#" data-target="ethics1" align="middle">Ethics</a></li>
| |
| − | <li class="headerMenuItem"><a class="menuItem" id="bSafety" href="#" data-target="safety1" align="middle">Safety</a></li>
| |
| − | <li class="headerMenuItem"><a class="menuItem" id="bLab" href="#" data-target="lab1" align="middle">Lab</a></li>
| |
| − | <li class="headerMenuItem"><a class="menuItem" id="bProject" href="#" data-target="project1" align="middle">Project</a></li>
| |
| − | <li class="headerMenuItem"><a class="menuItem" id="bWhy" href="#" data-target="why1" align="middle">Why Synthetic Biology</a></li>
| |
| − | <li class="headerMenuItem"><a class="menuItem" id="bTeam" href="#" data-target="team1" align="middle">The Team</a></li>
| |
| − | <li class="headerMenuItem"><a class="menuItem" id="bHome" href="#" data-target="home1" align="middle">Home</a></li>
| |
| − |
| |
| − | </ul>
| |
| − |
| |
| − | </div>
| |
| − |
| |
| − | <div id="contentBg" style="width:110vw; height:100vh;"></div>
| |
| − |
| |
| − | <div id="content">
| |
| − |
| |
| − | <div id="home1" class="panel">
| |
| − | <video style="width:100%; height:100%;" controls>
| |
| − | <source src="https://static.igem.org/mediawiki/2015/b/b1/WikiVidCentral.mp4" type="video/mp4">
| |
| − | Your browser does not support HTML5 video.
| |
| − | </video>
| |
| − | </div>
| |
| − | <div id="home2" class="panel"> <h1>Homepage</h1>
| |
| − | <p style="width:70%">
| |
| − | Cancer is the second leading cause of death in today’s society. Due to the high fatality rates of cancer, this disease has become a top priority for many organizations. There are many research facilities dedicated solely to curing cancer. The Central iGem project is presenting a unique spin on cancer treatment and research.
| |
| − | </p>
| |
| − | <div id="imageContainer">
| |
| − | <img src="https://static.igem.org/mediawiki/2015/2/21/CentralFiller1.jpeg" alt="1" style="height:auto; width:20%;">
| |
| − | <img src="https://static.igem.org/mediawiki/2015/8/8f/CentralFiller2.jpeg" alt="2" style="height:auto; width:20%;">
| |
| − | <img src="https://static.igem.org/mediawiki/2015/5/5f/CentralFiller3.jpeg" alt="3" style="height:auto; width:20%;">
| |
| − | <img src="https://static.igem.org/mediawiki/2015/c/cd/CentralFiller4.jpeg" alt="4" style="height:auto; width:20%;">
| |
| − | </div>
| |
| − | </div>
| |
| − |
| |
| − | <div id="team1" class="panel"> <h1>Meet The Team</h1>
| |
| − |
| |
| − | <div style="position:relative; top:100px; left:100px;">
| |
| − | <div class="bJP rad"></div>
| |
| − | <div class="bJP line"></div>
| |
| − | <div class="bJP box"><img src="https://static.igem.org/mediawiki/2015/7/76/CentralCalgaryJaredPortrait.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Jared </h2> <p class="bioPara">Jared was once a no life, that is, until he joined IGEM -- of which then, he became a no life that does science. If he isn't in the lab, then in all likelihood, he would be attempting to learn idioms, reading papers, doing math, memorizing the quadratic formula, and devouring ice cream.</p></div>
| |
| − | </div>
| |
| − |
| |
| − | <div style="position:relative; top:100px; left:200px;">
| |
| − | <div class="bFR rad"></div>
| |
| − | <div class="bFR line"></div>
| |
| − | <div class="bFR box"><img src="https://static.igem.org/mediawiki/2015/3/38/CentralCalgaryJessica.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Jessica </h2> <p class="bioPara">Jessica Skall is a grade 12 student at Central Memorial Highschool. She recently moved to Calgary from Toronto, and she felt that iGem would be a good place to make friends with common interests in science. Long team plans of hers include becoming an international ESL teacher. That is all</p></div>
| |
| − | </div>
| |
| − |
| |
| − | <div style="position:relative; top:100px; left:300px;">
| |
| − | <div class="bAG rad"></div>
| |
| − | <div class="bAG line"></div>
| |
| − | <div class="bAG box"><img src="https://static.igem.org/mediawiki/2015/b/b0/CentralCalgaryFrancis.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Francis </h2> <p class="bioPara">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In vestibulum magna eget nulla blandit, at faucibus enim fermentum. Sed malesuada, metus in lobortis rhoncus, nisi orci tempus leo, in finibus justo ligula ac lectus. Sed eu pharetra est. Vestibulum tincidunt nisl ex, placerat placerat dui sagittis at. Suspendisse vel neque non quam porttitor pharetra. Vivamus ac mauris id enim auctor bibendum. Vestibulum vel augue in risus faucibus luctus at ac libero. Sed et faucibus orci, sit amet tincidunt lacus. Pellentesque mattis quis lacus at fringilla. Curabitur ipsum nibh, fermentum at metus et, venenatis ullamcorper lorem.
| |
| − |
| |
| − | Pellentesque congue sit amet enim eu bibendum. Pellentesque tincidunt consequat magna. Ut eleifend arcu vel massa laoreet, at rutrum lacus dictum. Sed ut lorem ornare, sodales sem quis, imperdiet risus. Integer vitae eros vel dui dapibus gravida nec vel dui. Fusce at nisl interdum, dictum nisi sit amet, aliquam elit. Maecenas efficitur purus nunc, faucibus feugiat nulla vulputate et. Quisque a porttitor velit, nec dictum neque. Integer pretium egestas arcu, nec tempus ligula pharetra fermentum. Nam dapibus leo nec dui iaculis hendrerit. Sed in enim egestas, placerat felis vitae, luctus diam. Praesent non lobortis diam. Mauris pretium maximus enim, et ullamcorper eros suscipit sed. Integer. </p></div>
| |
| − | </div>
| |
| − |
| |
| − | <div style="position:relative; top:100px; left:400px;">
| |
| − | <div class="bZC rad"></div>
| |
| − | <div class="bZC line"></div>
| |
| − | <div class="bZC box"><img src="https://static.igem.org/mediawiki/2015/d/d8/CentralCalgaryNatalie.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Natalie </h2> <p class="bioPara">Natalie is a grade twelve student in Central's Performing and Visual Arts program in the dramatic arts discipline. She has always had a passion for the arts, having done private voice lessons from ages 8-16 as well as being involved in several choirs including Central Memorial's concert choir. Natalie, although always very academic, became extremely fascinated with human biology throughout high school. She worked as a research assistant in the lab of Dr. Marie Fraser at the University of Calgary during summer of 2015, work in on a biomedical research project with future application in dislipodemia and cancer treatment. Her future aspirations are to study Life Sciences or Health Sciences and one day become a perfusionist.</p></div>
| |
| − | </div>
| |
| − |
| |
| − | <div style="position:relative; top:100px; left:500px;">
| |
| − | <div class="bVT rad"></div>
| |
| − | <div class="bVT lineL"></div>
| |
| − | <div class="bVT boxL"><img src="https://static.igem.org/mediawiki/2015/2/21/CentralCalgaryDanielle.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Danielle </h2> <p class="bioPara">My name is Danielle and I am currently a grade 12 student at Central Memorial High School. At central, I am a part of the Performing Visual Arts program for dance. I do many genres of dance such as jazz, tap, ballet, lyrical, hip hop, and more. It takes up most of my free time. I am also a co-captain of the cheerleading team, and a member of the iGem team. Being a part of iGem is a great experience! In the future, I aspire to be a doctor, and this is why I am a member of the iGem team. IGem has broadened my knowledge and will potentially help me in fulfilling my career goals.</p></div>
| |
| − | </div>
| |
| − | <div style="position:relative; top:100px; left:600px;">
| |
| − | <div class="bNA rad"></div>
| |
| − | <div class="bNA lineL"></div>
| |
| − | <div class="bNA boxL"><img src="https://static.igem.org/mediawiki/2015/d/d3/CentralCalgaryAlexia.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Alexia </h2> <p class="bioPara">Alexia Gendron is a simple 12th grader who spends her spare time perfecting recipes and playing piano. She enjoys reading, volunteering, good soup, Italian, and having insightful conversations. Although born in Calgary, Alberta, she was brought up in French, and attended a francophone school until her 10th grade. This has given her exposure to French-Canadian culture and taught her where to find it even if she finds herself a few provinces away from its origin. For five years she took karate and developed quite a fondness for martial arts. Despite having had to stop karate this year, she plans on starting to practice judo as soon as possible. After discovering Ronda Rousey, she found the very first person ever to move her so strongly, and she considers Rousey to be an inspiration. Right now, Alexia is focusing on the present, and is trying to enjoy her final year of high school before she graduates. Although she plans on attending university next year, she has yet to figure out exactly what she wants to study. She has always loved to learn all there is to learn and do all there is to do; she hopes to travel the world someday, meet fantastical people, and have a great collection of jaw-dropping stories to tell.</p></div>
| |
| − | </div>
| |
| − | <div style="position:relative; top:100px; left:700px;">
| |
| − | <div class="bNB rad"></div>
| |
| − | <div class="bNB lineL"></div>
| |
| − | <div class="bNB boxL"><img src="https://static.igem.org/mediawiki/2015/f/f7/CentralCalgaryZenab.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Zenab </h2> <p class="bioPara">Zenab Bhamgerwala is a grade 12 student at Central Memorial High School. She joined the iGEM team because of the vast amount of opportunities it offered. Through central iGEM, Zenab was able to perform various procedures in the lab and gain a great amount of experience in the world of synthetic biology. Outside of school she enjoys being the programming lead of her Robotics team, sketching, reading, and running long distance. In the future, Zenab hopes to pursue her passion of biomedical studies in post secondary. Joining this team has helped develop essential life skills and reaffirm her career decisions.</p></div>
| |
| − | </div>
| |
| − |
| |
| − | <div style="position:relative; top:100px; left:800px;">
| |
| − | <div class="bNC rad"></div>
| |
| − | <div class="bNC lineL"></div>
| |
| − | <div class="bNC boxL"><img src="https://static.igem.org/mediawiki/2015/2/21/ReplaceWithVlad.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Vlad </h2> <p class="bioPara">Vladimir has been living in Calgary since day one. Growing up, he has experienced and explored everything from the bike paths in Fish Creek to the top of the Bow. At the age of eight, Vladimir developed a passion of photography and filmmaking, and carries it with him to this day. If he is not capturing photos, or studying, you can most likely find him zipping around from city to city on his bike. His passion for iGEM developed within the first weeks of grade ten, and carries into many aspects of his life. From lab work to media, Vladimir does it all.</p></div>
| |
| − | </div>
| |
| − | </div>
| |
| − |
| |
| − |
| |
| − | <div id="team2" class="panel"> <h1>Attributions</h1> <p >Thank you for you generous sponsorship<img src="https://static.igem.org/mediawiki/2015/9/92/AlbertaInnovatesLogo.png" alt="Alberta Innovates" style="width:100px;"></p><p>For giving us an opportunity and something worth my spare time<img src="https://static.igem.org/mediawiki/2015/6/64/SchoolLogo.png" alt="Central Memorial Highschool" style="width:100px;"></p><p>Special Thanks to: David Lloyd, our mentor</p> <p>Iain George our other mentor</p><p>Ms.Wyshinski, who is practically a biologist and kept us on track</p><p>Mr.Klemmer for his great support</p></div>
| |
| − |
| |
| − | <div id="why1" class="panel"> <h1>Why Synthetic Biology</h1>
| |
| − | <p>
| |
| − | Of the numerous treatments for cancer available today, not one has the ability to dependably cure cancer. In fact, not only is there no treatment guaranteed to reverse cancer, but there is also no treatment out there that doesn’t entail undesirable side effects. Notably, chemotherapy, surgery, and radiation therapy, the most common treatments for cancer, have grave effects. Chemotherapy is not an effective cure and rarely works without additional, complementary treatments. It is known for its aggressive side effects such as bone marrow suppression, hair loss, vomiting, damage to the nervous system and vital organs. People rendered weak by their cancer, often will not survive surgical procedures. <br>
| |
| − | In a search for a treatment with a greater effectiveness or much less severe side effects, we’ve considered taking a different approach. Some preliminary work similar to our concept has already been done by biotech companies, such as Aduro BioTech Inc., who have engineered Listeria to elicit an immune response. However, it’s not to say that synthetic biology is by any means widely available or well-researched - no company or research team has made it beyond clinical trials, which are still revealing much on the subject and it remains a very controversial method. There is still much room for theories and experiments, for great pharmaceutical companies and tiny high school iGEM teams alike.<br>
| |
| − | Antiangiogenic therapy is what many doctors are referring to as the future of cancer treatment. Through numerous trials, doctors have found that with antiangiogenic therapy tumours may be left dormant without need for further treatment. Currently, there are some antiangiogenic drugs being prescribed to cancer patients alongside their chemotherapy treatments. Our approach to antiangiogenic therapy, through our bacterial system of delivery, could one day potentially eliminate chemotherapy as the primary cancer treatment. <br>
| |
| − | </p>
| |
| − | </div>
| |
| − |
| |
| − | <div id="project1" class="panel"> <h1>The Project; The Dream</h1> <p style="width:70%">This project is based on the idea of using antiangiogenesis to potentially kill cancerous growths. Angiogenesis is the growth of new blood vessels via cell-signalling pathways. These blood vessels supply tumors with nutrients, which fuel the ability of cancerous cells to further proliferate. Vascular endothelial growth factors (VEGF) are potent stimulators of tumour growth and endothelial cell proliferation. It also increases tumour permeability (thus allowing leakage of proangiogenic proteins into the tumour microenvironment). VEGF is caused by hypoxia and the resulting anaerobic proliferation. This project is based upon the idea that through antiangiogenic therapy, the growth and development of tumors is inhibited and the tumour will cease to proliferate. With extensive research, the Central iGem team was able to conclude that the cancer most suitable for antiangiogenic treatment was Colorectal Cancer. This cancer was the most viable option because Colorectal tumours are generally localized.Localization allows antiangiogenesis to not spread to healthy vasculature but rather become more potent to the tumour itself. <br>
| |
| − |
| |
| − | In order to introduce antiangiogenesis to the malignant tumours, the Central iGem team has developed a few constructs.
| |
| − | </p></div>
| |
| − |
| |
| − | <div id="project2" class="panel"> <h1>Construct: pLac Angiostatin</h1> <p>The angiostatin is needed for the antiangiogenic treatments. Angiostatin is a highly potent anti-angiogenic inhibitor which blocks tumour vasculature. Angiostatin is derived from plasminogen and is a proteolytic inhibitor of angiogenesis. Unlike the parent protein, the angiostatin kringle domain does inhibit angiogenic activity. pLac is already secreted by tumours on a constant basis.pLac is a lactic acid promoter that is generated due to the Warburg Effect (anaerobic respiration).
| |
| − | </p></div>
| |
| − | <div id="project3" class="panel"> <h1>Construct: pLac RFP</h1> <p> This construct is comprised of pLac and red fluorescent protein, or RFP. This construct is designed to characterize and better define the pLac promoter, through the use of visual measurement. When the plac promoter is working, one can measure the RFP secreted, in red fluorescent units, or RFU, depicting the amount of RFP secreted, creating a better visual understanding of how well the promoter works.
| |
| − | </p></div>
| |
| − | <div id="project4" class="panel"> <h1>The Project: The Bio-Brick</h1> <p> The Bio-brick that the Central iGem team has been designed with the Colorectal tumour environment in mind.The promoter is Lactic Acid, an acid produced in mass amounts due to the Warburg Effect. Most cancer cells, rely on aerobic glycolysis which is transformation of glucose to pyruvate when limited amounts of oxygen are available. One of the products of aerobic glycolysis is lactic acid. That is the Warburg Effect. Normal or healthy differentiated cells rely primarily on mitochondrial oxidative phosphorylation to generate the energy they need for cellular processes.
| |
| − | <br>
| |
| − | Once the bacteria is in an Lactic Acid environment there is a ribosome binding site which allows for protein synthesis. Angiostatin protein is later released which blocks the growth of new malignant vasculature. The secretion tag is then what forces this protein out of the bacteria. A stopper will be in effect that will signal the termination of the synthesis of the protein.
| |
| − | <br>
| |
| − | Antiangiogenesis is a practical concept for cancer patients. Ingestion, our method of delivery has a very limited degree of danger because it is one of the least invasive treatment options. It ensures that the bacteria will safely and simply pass through your system, without risk of any remaining in the body. Lactobacillus and bifidobacterium are possible bacteria to be used in the future, as E. Coli could be potentially harmful when introduced to the human digestive system. These bacteria are proven in clinical trials to be safe for ingestion.
| |
| − | </p></div>
| |
| − |
| |
| − | <div id="lab1" class="panel"> <h1>Lab Protocol 1: Making LB Broth</h1> <p>
| |
| − | This protocol is used to make LB Broth. This like every protocol has been adapted from the Synthetic Biology Guidebook for iGEM High School. Important note for all protocols: <i>Everything must be sterile, and kept as aseptic as possible, throughout all procedures.</i>
| |
| − | <table class="tableClear" style="width:100%">
| |
| − | <tr>
| |
| − | <th>Materials: </th>
| |
| − | <th>Procedure: </th>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td style="vertical-align:top; width:30%;">
| |
| − | <ol class="materialList">
| |
| − | <li>Tryptone</li>
| |
| − | <li>Yeast Extract; Bacteriological</li>
| |
| − | <li>NaCl (Molec Biol Grade)</li>
| |
| − | <li>Distilled Water</li>
| |
| − | <li>1L Beaker</li>
| |
| − | <li>Micropipette + Tips</li>
| |
| − | <li>Parafilm</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | <td width="70%">
| |
| − | <ol class="procedureList">
| |
| − | <li>Weigh out, and add the following into the 1L container.
| |
| − | <ol class="materialList">
| |
| − | <li>5g Tryptone</li>
| |
| − | <li>2.5g Yeast Extract</li>
| |
| − | <li>5g NaCl</li>
| |
| − | </ol>
| |
| − | </li>
| |
| − | <li><p>Add 500ml of distilled water into the 1L container. The glass container must remain half empty to prevent the liquid from boiling over in the autoclave.</p> </li>
| |
| − | <li><p>Mix by swirling. Some powder may not dissolve. Make sure that none gets stuck to the sides.</p></li>
| |
| − | <li><p>Cover the top with aluminum foil. Ensure the foil is loose enough to allow pressure to escape in the autoclave.</p></li>
| |
| − | <li><p>Place/stick a strip of autoclave tape on top.</p></li>
| |
| − | <li><p>Autoclave at about 15psi for 20min.</p></li>
| |
| − | <li><p>Remove from autoclave and cool.</p></li>
| |
| − | <li><p>The autoclaved liquid is now to be stored at 4°C in a fridge.</p></li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </p>
| |
| − | </div>
| |
| − |
| |
| − | <div id="lab2" class="panel"> <h1>Lab Protocol 1.5: Making LB Plates </h1> <p>
| |
| − | This protocol is used to make LB Plates. Note how this protocol makes 500ml of LB Agar for 20-25 plates. It can be scaled up and down as required.
| |
| − | <table class="tableClear" style="width:100%">
| |
| − | <tr>
| |
| − | <th>Materials: </th>
| |
| − | <th>Procedure: </th>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td style="vertical-align:top; width:30%;">
| |
| − | <ol class="materialList">
| |
| − | <li>Tryptone</li>
| |
| − | <li>Yeast Extract; Bacteriological</li>
| |
| − | <li>Agar; Bacteriological</li>
| |
| − | <li>NaCl (Molec Biol Grade)</li>
| |
| − | <li>Distilled Water</li>
| |
| − | <li>Sterile Antibiotic Stock Solution - If needed</li>
| |
| − | <li>Autoclave + Autoclave Tape</li>
| |
| − | <li>Scale</li>
| |
| − | <li>1L Glass Bottle/Erlenmeyer Flask</li>
| |
| − | <li>Sterile Petri Dishes</li>
| |
| − | <li>Aluminium Foil</li>
| |
| − | <li>Micropipette + Tips</li>
| |
| − | <li>Parafilm</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | <td width="70%">
| |
| − | <ol class="procedureList">
| |
| − | <li>Weigh out, and add the following into the 1L container.</li>
| |
| − | <ol class="materialList">
| |
| − | <li>5g Tryptone</li>
| |
| − | <li>2.5g Yeast Extract</li>
| |
| − | <li>5g NaCl</li>
| |
| − | <li>7.5g Agar</li>
| |
| − | </ol>
| |
| − | <li>Add 500ml of distilled water into the 1L container. *The glass container must remain half empty to prevent the liquid from boiling over in the autoclave.* </li>
| |
| − | <li>Mix by swirling. *Some powder may not dissolve. Make sure that none gets stuck to the sides.*</li>
| |
| − | <li>Cover the top with aluminum foil, loose enough so pressure can escape in the autoclave. Place/stick a strip of autoclave tape on top.</li>
| |
| − | <li>Autoclave at about 15psi for 20min.</li>
| |
| − | <li>Remove from autoclave and cool to 55°C.</li>
| |
| − | <li>If you require antibiotic, swirl in a quantity of antibiotic in based upon the table below. The liquid must be cooled or else the hot liquid will degrade the antibiotic.
| |
| − | <table>
| |
| − | <tr>
| |
| − | <th>Antibiotic</th>
| |
| − | <th>Concentration of Prepared Stock</th>
| |
| − | <th>Final Concentration in LB Agar</th>
| |
| − | <th>Dillution Factor</th>
| |
| − | <th>Volume Added to 500ml LB Agar</th>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>Ampicillin</td>
| |
| − | <td>100mg/ml</td>
| |
| − | <td>100µg/ml</td>
| |
| − | <td>1:1000</td>
| |
| − | <td>500µl</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>Kanamycin</td>
| |
| − | <td>50mg/ml</td>
| |
| − | <td>50µg/ml</td>
| |
| − | <td>1:1000</td>
| |
| − | <td>500µl</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>Chloramphenicol</td>
| |
| − | <td>50mg/ml</td>
| |
| − | <td>25µg/ml</td>
| |
| − | <td>1:2000</td>
| |
| − | <td>250µl</td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </li>
| |
| − |
| |
| − | <li>Label plates with date, plate number, and antibiotic used. </li>
| |
| − | <li>Pour, or pipette, around 20ml LB Agar into each petri dish.This must be done aseptically. Pouring slowly, and steadily to avoid bubbles and lumps.</li>
| |
| − | <li>Cover with lid, and place to cool/harden. This should take 30min - 1hr.</li>
| |
| − | <li>Invert plates so agar is on top, to prevent from unnecessary moisture on the plates.</li>
| |
| − | <li>Seal edges with parafilm, and store in 4°C fridge.</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </p>
| |
| − | </div>
| |
| − |
| |
| − | <div id="lab3" class="panel"> <h1>Lab Protocol 2: Using the DNA Plate - Rehydrating </h1> <p>
| |
| − | <table class="tableClear" style="width:100%">
| |
| − | <tr>
| |
| − | <th>Materials: </th>
| |
| − | <th>Procedure: </th>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td style="vertical-align:top; width:30%;">
| |
| − | <ol class="materialList">
| |
| − | <li>DNA Kit Plate</li>
| |
| − | <li>Sterile Distilled Water</li>
| |
| − | <li>Micropipette + Tips</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | <td width="70%">
| |
| − | <ol class="procedureList">
| |
| − | <li>Locate well (double, triple check, location).</li>
| |
| − | <li>Draw 10µl of distilled water into pipette.</li>
| |
| − | <li>Puncture foil and release water into the well. </li>
| |
| − | <li>Wait for 10-15 minutes for DNA to rehydrate. </li>
| |
| − | <li>Store the re-hydrated in the freezer (-20°C), leave it on the plate, or transfer into a separate tube. *As little as 1µl can be used to for a successful transformation* </li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </p>
| |
| − | </div>
| |
| − |
| |
| − | <div id="lab4" class="panel"> <h1>Lab Protocol 3: Making Competent Cells </h1> <p>
| |
| − | <table class="tableClear" style="width:100%">
| |
| − | <tr>
| |
| − | <th>Materials: </th>
| |
| − | <th>Procedure: </th>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td style="vertical-align:top; width:30%;">
| |
| − | <ol class="materialList">
| |
| − | <li>DH5alpha E. Coli Cells</li>
| |
| − | <li>50mM CaCl2 Solution (filter sterile)</li>
| |
| − | <li>LB Broth</li>
| |
| − | <li>Incubator and Shaker set at 37°C</li>
| |
| − | <li>Ice</li>
| |
| − | <li>15ml Tubes</li>
| |
| − | <li>Microcentrifuge</li>
| |
| − | <li>Microcentrifuge Tubes</li>
| |
| − | <li>Micropipettes + Tips</li>
| |
| − | <li>Spectrophotometer (optional)</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | <td width="70%">
| |
| − | <ol class="procedureList">
| |
| − | <li>Transfer 100µl overnight culture (E. Coli) into 10ml of LB Broth (inside 15ml tube).</li>
| |
| − | <li>Grow at 37°C with shaking for at least 3 hours. Optimally until broth is cloudy,and has an OD600 (optical density) of 0.4-0.6.</li>
| |
| − | <li>Transfer 500µl into microcentrifuge tubes, and spin down all four at 7000rpm for 2min. </li>
| |
| − | <li>Discard supernatant, being very careful to not disturb the pellet.</li>
| |
| − | <li>Resuspend the pellet in 500µl CaCl2 solution. </li>
| |
| − | <li>Spin down again at 7000rpm for 2min and remove supernatant.</li>
| |
| − | <li>Resuspend the pellet in 100µl of CaCl2 and place on ice. Cells are now ready for transformation.</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </p>
| |
| − | </div>
| |
| − |
| |
| − | <div id="lab5" class="panel"> <h1>Lab Protocol 4: Restriction Digestion </h1> <p>
| |
| − | <table class="tableClear" style="width:100%">
| |
| − | <tr>
| |
| − | <th>Materials: </th>
| |
| − | <th>Procedure: </th>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td style="vertical-align:top; width:30%;">
| |
| − | <ol class="materialList">
| |
| − | <li>Plasmid DNA</li>
| |
| − | <li>10x Restriction Buffer</li>
| |
| − | <li>Restriction Enzymes (ExoRI, SpeI, XbaI, PsI)</li>
| |
| − | <li>Sterile Distilled Water</li>
| |
| − | <li>Thermocycler</li>
| |
| − | <li>Water Bath set at 37°C</li>
| |
| − | <li>Sterile Microcentrifuge Tubes</li>
| |
| − | <li>Microcentrifuge</li>
| |
| − | <li>Micropipette + Tips</li>
| |
| − | <li>Ice</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | <td width="70%">
| |
| − | <ol class="procedureList">
| |
| − | <li>Thaw all solutions and buffers, flick (homogenize). *Restriction enzymes DO NOT need thawing and should be kept on ice at all times*</li>
| |
| − | <li>Label a sterile tube clearly for use with the restriction enzyme. </li>
| |
| − | <li>Pipette the following into the microcentrifuge tube in the order listed. </li>
| |
| − | <ol class="inlineList">
| |
| − | <li>10µl Plasmid DNA (500ng)</li>
| |
| − | <li>1µl Restriction Enzyme #1</li>
| |
| − | <li>1µl Restriction Enzyme #2</li>
| |
| − | <li>5µl 10x Restriction Buffer</li>
| |
| − | <li>Up to 50µl sterile distilled water</li>
| |
| − | </ol>
| |
| − | <li>Mix gently by pipetting up and down. *You can briefly spin in the centrifuge to bring contents to the bottom*</li>
| |
| − | <li>Incubate at 37°C in waterbath for 30min to an hour. </li>
| |
| − | <li>Incubate (heat-shock) at 80°C for 20min.</li>
| |
| − | <li>Store the restriction digest at 20°C or proceed immediately with ligation, or agarose gel electrophoresis.</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </p>
| |
| − | </div>
| |
| − |
| |
| − | <div id="lab6" class="panel"> <h1>Lab Protocol 5: Ligation</h1> <p>
| |
| − | A few notes about the ligation: There should be a 3:1, insert DNA (the segment being added) to the vector DNA (the now linear plasmid backbone). Also, the amount of DNA in the ligation should be low, around 100ng.
| |
| − | <br>
| |
| − | The DNA concentration is assumed to be the same for both the insert and vector restriction digests, and it equals 25ng/µl, as set up by the previous protocol. Assuming the insert is about half the size of the vector, to get a molar ratio of 3 insert : 1 Vector, the volume ratio must 1.5 insert :1 vector.
| |
| − | <br>
| |
| − | Ligation buffers are usually 10 fold, (10x) more concentrated than needed. Therefore, they need to be diluted 10 times, i.e. 1µl in a total volume in 10µl.
| |
| − | <br>
| |
| − | *A general formula for determining the volume ratio of insert to vector.*
| |
| − | <br>
| |
| − | Vi / Vv = 3 x (Cv / Ci) x (Mi / Mv)
| |
| − | <br>
| |
| − | Vi = Volume Insert
| |
| − | <br>
| |
| − | Vv = Volume Vector
| |
| − | <br>
| |
| − | Cv = DNA conc. of vector restriction digest
| |
| − | <br>
| |
| − | Ci = DNA conc. of insert restriction digest
| |
| − | <br>
| |
| − | Mi = Molecular weight i.e. approximate size of insert
| |
| − | <br>
| |
| − | Mv = Molecular weight i.e. approximate size of vector
| |
| − | <br>
| |
| − | <table class="tableClear" style="width:100%">
| |
| − | <tr>
| |
| − | <th>Materials: </th>
| |
| − | <th>Procedure: </th>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td style="vertical-align:top; width:30%;">
| |
| − | <ol class="materialList">
| |
| − | <li>nsert Restriction Digest Mix</li>
| |
| − | <li>Vector Restriction Digest Mix</li>
| |
| − | <li>10x Ligation Buffer</li>
| |
| − | <li>T4 DNA Ligase</li>
| |
| − | <li>Sterile Distilled Water </li>
| |
| − | <li>Thermocycler</li>
| |
| − | <li>Sterile Microcentrifuge Tubes</li>
| |
| − | <li>Micropipette + Tips</li>
| |
| − | <li>Ice</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | <td width="70%">
| |
| − | <ol class="procedureList">
| |
| − | <li>Thaw all solutions and buffers, flick (homogenize). *Ligation enzymes DO NOT need thawing and should be kept on ice at all times*</li>
| |
| − | <li>Label a sterile tube clearly for use with the ligation enzyme. </li>
| |
| − | <li>Pipette the following in order (adding up to a total volume of 10µl).</li>
| |
| − | <ol class="materialList">
| |
| − | <li>3µl Sterile Distilled Water</li>
| |
| − | <li>3µl Insert Restriction Digest</li>
| |
| − | <li>2µl Vector Restriction Digest</li>
| |
| − | <li>1µl 10x Ligation Buffer</li>
| |
| − | </ol>
| |
| − | <li>Pipette up and down to mix. Briefly centrifuge to collect all liquid at the the bottom of the tube.</li>
| |
| − | <li>Incubate at room temperature for about an hour.</li>
| |
| − | <li>Incubate at 80°C for 20 minutes, to denature the ligase (heat-shock).</li>
| |
| − | <li>Store ligation mix at 20°C in a freezer, or proceed immediately with a transformation.</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </p>
| |
| − | </div>
| |
| − |
| |
| − | <div id="lab7" class="panel"> <h1>Lab Protocol 6: Transformation</h1> <p>
| |
| − | <table class="tableClear" style="width:100%">
| |
| − | <tr>
| |
| − | <th>Materials: </th>
| |
| − | <th>Procedure: </th>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td style="vertical-align:top; width:30%;">
| |
| − | <ol class="materialList">
| |
| − | <li>100µl Aliquots of Competent Cells (Protocol 1).</li>
| |
| − | <li>DNA Ligation Mix</li>
| |
| − | <li>Control Plasmid DNA</li>
| |
| − | <li>LB Broth</li>
| |
| − | <li>LB Agar Plates (with desired antibiotic)</li>
| |
| − | <li>Water bath at 42°C</li>
| |
| − | <li>Incubator at 37°C</li>
| |
| − | <li>Spreader</li>
| |
| − | <li>Bunsen Burner</li>
| |
| − | <li>Ice</li>
| |
| − | <li>Micropipettes + Tips</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | <td width="70%">
| |
| − | <ol class="procedureList">
| |
| − | <li>Obtain fresh, or frozen, competent cells. Thaw and keep on ice.</li>
| |
| − | <li>Label the tube.</li>
| |
| − | <li>Pipette in 2-5µl of ligation mix into the competent cells. *The rest of the ligation mix can be stored in the freezer at -20°C*</li>
| |
| − | <li>Incubate on ice for 30min.</li>
| |
| − | <li>Incubate at 42°C for 60sec.</li>
| |
| − | <li>Place on ice immediately for 5min.</li>
| |
| − | <li>Add 200µl of LB Broth and mix gently.</li>
| |
| − | <li>Incubate at 37°C for 2hrs.</li>
| |
| − | <li>Warm up plates to room temperature, and label.</li>
| |
| − | <li>Plate out 200µl and 20µl of transformed cells onto two separate plates, spreading the cells evenly onto the surface.</li>
| |
| − | <li>Incubate cells at 37°C for 12-14hrs (overnight) or at room temp. for 24hrs.</li>
| |
| − | <li>Plates with culture can be stored in fridge afterwards, and used for weeks.</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </p>
| |
| − | </div>
| |
| − |
| |
| − | <div id="lab8" class="panel"> <h1>Lab Protocol: Miniprep</h1> <p>
| |
| − | <table class="tableClear" style="width:100%">
| |
| − | <tr>
| |
| − | <th>Materials: </th>
| |
| − | <th>Procedure: </th>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td style="vertical-align:top; width:30%;">
| |
| − | <ol class="materialList">
| |
| − | <li>DNA Mini Kit(Preferred Kit: E.Z.N.A Plasmid DNA Mini Kit) </li>
| |
| − | <li>Microipette + Tips</li>
| |
| − | <li>1.5ml Centrifuge Tubes.</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | <td width="70%">
| |
| − | <ol class="procedureList">
| |
| − | <li>Grab and label 3 microcentrifuge tubes.</li>
| |
| − | <li> Pipette 1.5mL (use a P1000 set at 750ul twice) of the corresponding culture in a glass tube into the corresponding microcentrifuge tube (e.g. The plac in the glass tube goes to the plac in the microcentrifuge tube).</li>
| |
| − | <li>Spin at max speed (151*100g) for 1 minute.</li>
| |
| − | <li>Discard the supernatant .</li>
| |
| − | <li>Repeat steps 2-4 to gain a bigger pellet 6 times.</li>
| |
| − | <li>Add 250ul of Solution 1 to each of the microcentrifuge tubes (stored in the fridge) and resuspend the pellet. Remember to put Solution 1 back in the fridge.</li>
| |
| − | <li>Add 250ul of Solution 2 to each of the microcentrifuge tubes and gently invert several times, and let it sit for 2 minutes.</li>
| |
| − | <li>Add 350ul of Solution 3 to each of the microcentrifuge tubes and immediately invert. A white flocculent protein should form.</li>
| |
| − | <li>Centrifuge the tubes at max speed for 10min.</li>
| |
| − | <li>Grab HiBind DNA mini columns and label them accordingly.</li>
| |
| − | <li>Transfer the supernatant and do not disturb the pellet of the microcentrifuge tubes to the top of the of the corresponding HiBind DNA mini columns (e.g. the supernatant of plac should be transferred to the HiBind DNA mini column labelled plac.)</li>
| |
| − | <li>Centrifuge at max speed for 1min.</li>
| |
| − | <li>Discard the filtrate in the collection tube and reuse the collection tube. Pipette 500ul of HBC buffer to the top of the DNA HiBind mini column.</li>
| |
| − | <li>Centrifuge at max speed for 1min.</li>
| |
| − | <li>Discard the filtrate in the collection tube and reuse the collection tube. Pipette 700ul of DNA wash buffer to the top of the DNA HiBind mini column.</li>
| |
| − | <li>Centrifuge at max speed for 1min. Discard the filtrate in the collection tube and reuse the collection tube.</li>
| |
| − | <li>Centrifuge at max speed for 2min to dry the column.</li>
| |
| − | <li>Label 3 microcentrifuge tubes accordingly.</li>
| |
| − | <li>Transfer the top of the DNA HiBind mini column to the corresponding microcentrifuge tube (e.g. the plac DNA HiBind mini-column would be transferred to the “plac DNA date plasmid” microcentrifuge tube).</li>
| |
| − | <li>Add 30ul of elution buffer to the DNA HiBind mini column. Ensure the elution buffer lands on the middle of the the DNA filter.</li>
| |
| − | <li>Centrifuge at max speed for 1min.</li>
| |
| − | <li>The DNA is now in the microcentrifuge tube. Store in the freezer.</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </p>
| |
| − | </div>
| |
| − |
| |
| − | <div id="lab9" class="panel"> <h1>Lab Protocol 8: Making 10X TAE Buffer</h1> <p>
| |
| − | To prepare 10x TAE Buffer you must first prepare a solution of 0.5M EDTA (pH 8.0).
| |
| − |
| |
| − | <table class="tableClear" style="width:100%">
| |
| − | <tr>
| |
| − | <th>Materials: </th>
| |
| − | <th>Procedure: </th>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td style="vertical-align:top; width:30%;">
| |
| − | <ol class="materialList">
| |
| − | <li>EDTA Di-Sodium Salt</li>
| |
| − | <li>Distilled Water</li>
| |
| − | <li>NaOH sodium hydroxide (solid or concentrate)</li>
| |
| − | <li>Tris Base</li>
| |
| − | <li>Glacial Acetic Acid</li>
| |
| − | <li>Weigh-boats</li>
| |
| − | <li>Scale</li>
| |
| − | <li>Beakers</li>
| |
| − | <li> Graduated Cylinders</li>
| |
| − | <li>Stir Rod or Magnetic Stirrer</li>
| |
| − | <li>pH Meter or Paper</li>
| |
| − | <li>Clean Bottles</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | <td width="70%">
| |
| − | <ol class="procedureList">
| |
| − | <li>Weigh out 93.05g EDTA di-sodium salt.</li>
| |
| − | <li>Add the EDTA to a beaker containing 400ml of distilled water.</li>
| |
| − | <li>Mix with stir-rod, or magnetic stirrer.</li>
| |
| − | <li>Adjust the pH of the solution to 8.0 by adding NaOH. EDTA will completely dissolve at a pH of 8.</li>
| |
| − | <li> Add distilled water to total 500ml and mix. </li>
| |
| − | <li>Pour into a clean bottle and label “0.5M EDTA pH8”.</li>
| |
| − | <li>Weigh out 48.5g Tris Base and add to a beaker containing 800ml of distilled water.</li>
| |
| − | <li>Mix to dissolve. </li>
| |
| − | <li>Measure out 11.4ml of glacial acetic acid and add it to the Tris solution.</li>
| |
| − | <li>Measure out 20ml 0.5M EDTA (pH 8) and add to the Tris solution. </li>
| |
| − | <li>Add distilled water to a total volume of 1L.</li>
| |
| − | <li>Stir to mix.</li>
| |
| − | <li>Pour into a clean bottle for long term storage, label “10x TAE”.</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </p>
| |
| − | </div>
| |
| − |
| |
| − | <div id="lab10" class="panel"> <h1>Lab Protocol: Agarose Gel Electrophoresis</h1> <p>
| |
| − | <table class="tableClear" style="width:100%">
| |
| − | <tr>
| |
| − | <th>Materials: </th>
| |
| − | <th>Procedure: </th>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td style="vertical-align:top; width:30%;">
| |
| − | <ol class="materialList">
| |
| − | <li>10x TAE Buffer</li>
| |
| − | <li>Distilled Water</li>
| |
| − | <li>Agarose</li>
| |
| − | <li>Syber Safe (DNA Stain)</li>
| |
| − | <li>DNA Loading Buffer 6x</li>
| |
| − | <li>DNA Restriction Digest</li>
| |
| − | <li>DNA Ladder (Prefered = Invitrogen E-GEL 1 Kb Plus)</li>
| |
| − | <li>Agarose Gel Electrophoresis Apparatus (Tank, Gel Tray, Comb, Power Supply, Etc.)</li>
| |
| − | <li>Graduated Cylinder</li>
| |
| − | <li>Stir Rod</li>
| |
| − | <li>Erlenmeyer Flask</li>
| |
| − | <li>Micropipettes + Tips</li>
| |
| − | <li>Scale</li>
| |
| − | <li>Microwave</li>
| |
| − | <li>Tape</li>
| |
| − | </ol>
| |
| − | </td>
| |
| − | <td width="70%">
| |
| − | <ol class="procedureList">
| |
| − | <li>Prepare 100ml 1x TAE Buffer by adding 10ml 10x TAE Buffer to a cylinder containing 90ml distilled water. </li>
| |
| − | <li>Mix well with a clean stir rod.</li>
| |
| − | <li>Pour the 100ml of 1x TAE into a beaker or flask, allotting space for bubbles, so it does not bubble over.</li>
| |
| − | <li>Weigh out 1g of agarose poweder and add to the 100ml of 1x TAE.</li>
| |
| − | <li>Place the beaker/flask into the microwave and set the time to 60sec carefully watching for it to start bubbling. Once bubbling open, take out of microwave, stir, place into microwave, and repeat until solids are completely dissolved.</li>
| |
| − | <li>Cool gel until warm to touch.</li>
| |
| − | <li>Assemble gel cassette by taping off ends, and inserting comb (thin side).</li>
| |
| − | <li>Pour the agarose solution carefully, and slowly, into the gel cassette, to avoid air bubbles.</li>
| |
| − | <li>Let gel cassette cool at room temperature for 30min.</li>
| |
| − | <li>Wrap into ceran-wrap and move into 4°C fridge and let cool for 30min, it may sit in fridge for up to 3hrs prior to use.</li>
| |
| − | <li>While waiting for gel to solidify, prepare the DNA samples by mixing the following into microcentrifuge tubes.</li>
| |
| − | <ol class="materialList">
| |
| − | <li>2µl 6x Loading Buffer</li>
| |
| − | <li>4µl DNA Restriction Digest</li>
| |
| − | <li>6µl Distilled Water</li>
| |
| − | </ol>
| |
| − | <li>Very carefully pull off tape and remove comb.</li>
| |
| − | <li>Place cassette into tray making sure wells are on the negative end.</li>
| |
| − | <li>Fill the tank with 1x TAE Buffer covering the gel with 3-5mm of TAE. If air bubbles are trapped inside wells, carefully remove them with a pipette.</li>
| |
| − | <li>Load DNA samples into wells, starting with the ladder, on both end wells.</li>
| |
| − | <li>Place cover over the gel box, making sure the attached wires are black on black, and red on red.</li>
| |
| − | <li>Turn on gel box, at the 15V setting, and run for 30mins.</li>
| |
| − | <li>After 30mins have surpassed switch to the 75V setting and run for 40mins.</li>
| |
| − | <li>At the 40min mark, switch off, remove gel and place into solution of 10ul Cybersafe and 50ml 10x TAE.</li>
| |
| − | <li>Stir, and move gel around in solution.</li>
| |
| − | <li>Place on gel reader, and view outcomes. </li>
| |
| − | <li>If colour is faint repeat soaking in CyberSafe solution, until desired color is availble.</li>
| |
| − | </ol>
| |
| − | <p>
| |
| − | <br>
| |
| − | </p>
| |
| − | </td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </p>
| |
| − | </div>
| |
| − |
| |
| − | <div id="safety1" class="panel"> <h1>Safety </h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.
| |
| − |
| |
| − | </p></div>
| |
| − |
| |
| − | <div id="ethics1" class="panel"> <h1>Ethics </h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.
| |
| − | </p></div>
| |
| − | <div id="logbook1" class="panel"> <h1> Logbook </h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.
| |
| − |
| |
| − | </p></div>
| |
| − |
| |
| − | <div id="policy1" class="panel">
| |
| − | <h1> Outreach </h1>
| |
| − | <p> Please click the images to see the explanation of the event</p>
| |
| − | <p> Using synthetic biology is not a firmly established practiced in the medical field. The central iGem team participated in several outreach opportunities, where they have explained this concept to different members of the public. These experiences have benefitted the project, increased every member’s awareness, and of great variety were, each in their own way, strongly impacting.</p>
| |
| − | <div style="float:left; margin:0px 0 0 0; width:30vw">
| |
| − | <a href = "javascript:void(0)" onclick = "document.getElementById('inspire').style.display='block';document.getElementById('fade').style.display='block'" class="o_Mega" id="inspirationStage"><span><h1>Telus Spark: Inspiration Stage</h1></span></a></div>
| |
| − |
| |
| − | <div style="position:relative; top:0px; margin: 0 auto; width:30vw">
| |
| − | <a href = "javascript:void(0)" onclick = "document.getElementById('scarf').style.display='block';document.getElementById('fade').style.display='block'" class="o_Mega" id="scarfMaking"><span><h1> Cancer Support Group</h1></span></a></div>
| |
| − |
| |
| − | <div style="float:right; margin:0 0 0 0; width:30vw">
| |
| − | <a href = "javascript:void(0)" onclick = "document.getElementById('run').style.display='block';document.getElementById('fade').style.display='block'" class="o_Mega" id="cancerRun"><span><h1>Colorectal Cancer Run</h1></span></a></div>
| |
| − | </div>
| |
| − |
| |
| − | </div>
| |
| − |
| |
| − | <!---- LIGHT BOXES DIVS --->
| |
| − |
| |
| − |
| |
| − | <div id="inspire" class="white_content"><img src="https://static.igem.org/mediawiki/2015/6/68/ScienceCenter.jpg" alt="ScienceCenter.jpg" style="width:35%; float:left; padding:10px;"> <a class="boxclose" href = "javascript:void(0)" onclick = "document.getElementById('inspire').style.display='none';document.getElementById('fade').style.display='none'"></a><div style="width:95%; padding:10px">A few of the team members presented synthetic biology to children at the Telus Spark science centre. They explained our project to the greater public, and received some stunning feedback from visitors of all ages. Surveys given show that the majority of the individuals of the greater public would be willing to use a bacterium to cure cancer,taking into account the the risks of mutation. The majority believe as well that this form of treatment is ethical for human use.</div> </div>
| |
| − |
| |
| − | <div id="scarf" class="white_content"><img src="https://static.igem.org/mediawiki/2015/6/68/ScienceCenter.jpg" alt="ScienceCenter.jpg" style="width:35%; float:left; padding:10px;"> <a class="boxclose" href = "javascript:void(0)" onclick = "document.getElementById('scarf').style.display='none';document.getElementById('fade').style.display='none'"></a><div style="width:95%; padding:10px"> The team spent time knitting scarves for the BEST Cancer Support group from Calgary, and learned of different views that the patients had on chemotherapy. Many of them strongly indicated that they would rather die of cancer than undergo their chemotherapy treatment once more. This led to concerns about the effectiveness of this treatment. Questions arose such as; is the outcome of this form of treatment worth the effects? They also shared their cancer stories, which led to a very heartfelt experience.</div> </div>
| |
| − |
| |
| − | <div id="run" class="white_content"><img src="https://static.igem.org/mediawiki/2015/6/68/ScienceCenter.jpg" alt="ScienceCenter.jpg" style="width:35%; float:left; padding:10px;"> <a class="boxclose" href = "javascript:void(0)" onclick = "document.getElementById('run').style.display='none';document.getElementById('fade').style.display='none'"></a><div style="width:95%; padding:10px">Water was handed out by the team for the Father’s Day run for colorectal cancer.
| |
| − | Several of the people in charge of the run voiced their opinions on chemotherapy as well. Similarly to the cancer support group, a common opinion was that this treatment is not worth the risks and its severe side effects.</div> </div>
| |
| − |
| |
| − |
| |
| − |
| |
| − | <!---- END OF LIGHT BOX DIVS --->
| |
| − |
| |
| − |
| |
| − | <div id="footerBar">
| |
| − | <a id="back" href="#" data-target="back">Back</a>
| |
| − | <a id="next" href="#" data-target="next">Next</a>
| |
| − | <div id="navBar">
| |
| − | <ul id="home" class="disableFooter">
| |
| − | <li class="footerButton activePage" id="fho1"><a data-target="home1" data-group="#home">Video</a></li>
| |
| − | <li class="footerButton activePage" id="fho2"><a data-target="home2" data-group="#home">Home</a></li>
| |
| − | </ul>
| |
| − |
| |
| − | <ul id="team" class="disableFooter">
| |
| − | <li class="footerButton" id="fte1"><a data-target="team1" data-group="#team">The Team</a></li>
| |
| − | <li class="footerButton" id="fte2"><a data-target="team2" data-group="#team">Attributions</a></li>
| |
| − | </ul>
| |
| − | <ul id="why" class="disableFooter">
| |
| − | <li class="footerButton activePage" id="fwh1" style="width:auto; padding: 0 1.5625vw;"><a data-target="why1" data-group="#why" style="width:auto; padding: 0 1.5625vw;">Why Synthetic Biology</a></li>
| |
| − | </ul>
| |
| − |
| |
| − | <ul id="project" class="disableFooter ">
| |
| − | <li class="footerButton" id="fpr1"><a href="#" data-target="project1" data-group="#project">The Project</a></li>
| |
| − | <li class="footerButton" id="fpr2"><a href="#" data-target="project2" data-group="#project">pLac Angiostatin</a></li>
| |
| − | <li class="footerButton" id="fpr3"><a href="#" data-target="project3" data-group="#project">pLac RFP</a></li>
| |
| − | <li class="footerButton" id="fpr4"><a href="#" data-target="project4" data-group="#project">Bio-Brick</a></li>
| |
| − |
| |
| − | </ul>
| |
| − |
| |
| − | <ul id="lab" class="disableFooter">
| |
| − | <li class="footerButton" id="flb1"><a href="#" data-target="lab1" data-group="#lab">Protocol1</a></li>
| |
| − | <li class="footerButton" id="flb2"><a href="#" data-target="lab2" data-group="#lab">Protocol1.5</a></li>
| |
| − | <li class="footerButton" id="flb3"><a href="#" data-target="lab3" data-group="#lab">Protocol2</a></li>
| |
| − | <li class="footerButton" id="flb4"><a href="#" data-target="lab4" data-group="#lab">Protocol3</a></li>
| |
| − | <li class="footerButton" id="flb5"><a href="#" data-target="lab5" data-group="#lab">Protocol4</a></li>
| |
| − | <li class="footerButton" id="flb6"><a href="#" data-target="lab6" data-group="#lab">Protocol5</a></li>
| |
| − | <li class="footerButton" id="flb7"><a href="#" data-target="lab7" data-group="#lab">Protocol6</a></li>
| |
| − | <li class="footerButton" id="flb8"><a href="#" data-target="lab8" data-group="#lab">Protocol7</a></li>
| |
| − | <li class="footerButton" id="flb9"><a href="#" data-target="lab9" data-group="#lab">Protocol8</a></li>
| |
| − | <li class="footerButton" id="flb10"><a href="#" data-target="lab10" data-group="#lab">Protocol9</a></li>
| |
| − | </ul>
| |
| − |
| |
| − | </div>
| |
| − | </div>
| |
| − |
| |
| − |
| |
| − | <div id="canvas"></div>
| |
| − |
| |
| − |
| |
| − | <script src="https://2015.igem.org/Team:Central_Calgary/js/jquery?action=raw&ctype=text/javascript"></script>
| |
| − | <script src="https://2015.igem.org/Team:Central_Calgary/js/mousewheel?action=raw&ctype=text/javascript"></script>
| |
| − | <script src="https://2015.igem.org/Team:Central_Calgary/js/teampagejs?action=raw&ctype=text/javascript"></script>
| |
| − | <script src="https://2015.igem.org/Team:Central_Calgary/three?action=raw&ctype=text/javascript"></script>
| |
| − | <!-- <script src="https://2015.igem.org/Team:Central_Calgary/js/CanvasRenderer?action=raw&ctype=text/javascript"></script>
| |
| − | <script src="https://2015.igem.org/Team:Central_Calgary/js/Projector?action=raw&ctype=text/javascript"></script> -->
| |
| − |
| |
| − | <script src="https://2015.igem.org/Team:Central_Calgary/postprocessing/EffectComposer?action=raw&ctype=text/javascript"></script>
| |
| − | <script src="https://2015.igem.org/Team:Central_Calgary/postprocessing/RenderPass?action=raw&ctype=text/javascript"></script>
| |
| − | <script src="https://2015.igem.org/Team:Central_Calgary/postprocessing/MaskPass?action=raw&ctype=text/javascript"></script>
| |
| − | <script src="https://2015.igem.org/Team:Central_Calgary/postprocessing/ShaderPass?action=raw&ctype=text/javascript"></script>
| |
| − |
| |
| − | <script src="https://2015.igem.org/Team:Central_Calgary/shaders/CopyShader?action=raw&ctype=text/javascript"></script>
| |
| − | <script src="https://2015.igem.org/Team:Central_Calgary/shaders/HorizontalBlurShader?action=raw&ctype=text/javascript"></script>
| |
| − | <script src="https://2015.igem.org/Team:Central_Calgary/shaders/RGBShiftShader?action=raw&ctype=text/javascript"></script>
| |
| − |
| |
| − | <script>
| |
| − | var panels = new Array("#home1","#home2","#team1","#team2","#why1","#project1","#project2","#project3","#project4","#lab1","#lab2","#lab3","#lab4","#lab5","#lab6","#lab7","#lab8","#lab9","#lab10","#safety1","#ethics1","#logbook1","#policy1");
| |
| − | var panelButtons = new Array("#fho1","#fho2","#fte1","#fte2","#fwh1","#fpr1","#fpr2","#fpr3","#fpr4","#flb1","#flb2","#flb3","#flb4","#flb5","#flb6","#flb7","#flb8","#flb9","#flb10");
| |
| − |
| |
| − | var buttons = new Array("#bHome","#bTeam","#bWhy","#bProject","#bLab","#bSafety","#bEthics","#bLogbook","#bPolicy","#bPractices");
| |
| − | var footerMenus = new Array("#home","#team","#why","#project","#lab");
| |
| − | var prevMenu = 0, activeMenu = 0;
| |
| − | var currentPanel = 0;
| |
| − |
| |
| − | function update() {
| |
| − |
| |
| − | prevMenu = activeMenu;
| |
| − |
| |
| − | for(var i = 0; i <= buttons.length; i++)
| |
| − | {
| |
| − | $(buttons[i]).attr("class","menuItem");
| |
| − |
| |
| − | }
| |
| − |
| |
| − | if(currentPanel === 0 || currentPanel === 1) {
| |
| − | $("#bHome").attr("class","currentLink");
| |
| − | $("#home").addClass("activeFooter");
| |
| − | activeMenu = 0;
| |
| − |
| |
| − | } else if(currentPanel === 2 || currentPanel === 3) {
| |
| − | $("#bTeam").attr("class","currentLink");
| |
| − | $("#team").addClass("activeFooter");
| |
| − | activeMenu = 1;
| |
| − |
| |
| − | } else if (currentPanel===4)
| |
| − | {
| |
| − | $("#bWhy").attr("class","currentLink");
| |
| − | $("#why").addClass("activeFooter");
| |
| − | activeMenu = 2;
| |
| − |
| |
| − |
| |
| − | } else if(currentPanel <= 8) {
| |
| − | $("#bProject").attr("class","currentLink");
| |
| − | $("#project").addClass("activeFooter");
| |
| − | activeMenu = 3;
| |
| − |
| |
| − | } else if(currentPanel <= 18) {
| |
| − | $("#bLab").attr("class","currentLink");
| |
| − | $("#lab").addClass("activeFooter");
| |
| − | activeMenu = 4;
| |
| − | } else if(currentPanel === 11) {
| |
| − | $("#bSafety").attr("class","currentLink");
| |
| − | } else if(currentPanel === 12) {
| |
| − | $("#bEthics").attr("class","currentLink");
| |
| − | } else if(currentPanel === 13) {
| |
| − | $("#bLogbook").attr("class","currentLink");
| |
| − | } else if(currentPanel === 14) {
| |
| − | $("#bPolicy").attr("class","currentLink");
| |
| − | } else if(currentPanel === 15) {
| |
| − | $("#bPractices").attr("class","currentLink");
| |
| − | }
| |
| − |
| |
| − |
| |
| − | for(var i = 0; i < panelButtons.length; i++)
| |
| − | {
| |
| − | $(panelButtons[i]).removeClass('activePage');
| |
| − | }
| |
| − |
| |
| − | $(panelButtons[currentPanel]).addClass('activePage');
| |
| − |
| |
| − |
| |
| − | for(var i = 0; i<footerMenus.length; i++)
| |
| − | {
| |
| − | if(i === activeMenu)
| |
| − | {
| |
| − | if(prevMenu != activeMenu)
| |
| − | {
| |
| − | $(footerMenus[i]).fadeIn("fast","linear");
| |
| − | }
| |
| − | }
| |
| − | else
| |
| − | {
| |
| − | $(footerMenus[i]).fadeOut("fast","linear");
| |
| − | $(footerMenus[i]).addClass("disableFooter").removeClass("activeFooter");
| |
| − | }
| |
| − | }
| |
| − |
| |
| − |
| |
| − | if(currentPanel===1)
| |
| − | {
| |
| − | $("#contentBg").fadeOut(0);
| |
| − | $("#contentBg").css("background","url(img/teamPhoto.png)");
| |
| − | $("#contentBg").stop().fadeIn(500);
| |
| − | }
| |
| − | else
| |
| − | {
| |
| − | $("#contentBg").stop().fadeOut(500);
| |
| − | }
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − | }
| |
| − |
| |
| − |
| |
| − | window.addEventListener("keydown", function(e) {
| |
| − | if([32, 37, 38, 39, 40].indexOf(e.keyCode) > -1) {
| |
| − | e.preventDefault();
| |
| − | }
| |
| − | }, false);
| |
| − |
| |
| − | (function($) {
| |
| − | $('#header a').on('click', function(e) {
| |
| − | e.preventDefault();
| |
| − | var target = '#'+$(this).data('target');
| |
| − | var left = $(target).position().left;
| |
| − |
| |
| − | if(panels[currentPanel] != target)
| |
| − | {
| |
| − | for(var i = 0; i < panels.length; i++)
| |
| − | {
| |
| − |
| |
| − | if(panels[i] === target)
| |
| − | {
| |
| − | currentPanel=i;
| |
| − | break;
| |
| − | }
| |
| − | }
| |
| − | update();
| |
| − |
| |
| − | $('html, body').stop().animate({scrollLeft:left, scrollTop:"0px"}, 1000);
| |
| − | }
| |
| − | });
| |
| − |
| |
| − | $('#footerBar a').on('click', function(e) {
| |
| − | e.preventDefault();
| |
| − |
| |
| − | var target = '#'+$(this).data('target');
| |
| − |
| |
| − | if(target == "#next")
| |
| − | {
| |
| − | if(currentPanel + 1 < panels.length)
| |
| − | {
| |
| − | currentPanel++;
| |
| − | var left = $(panels[currentPanel]).position().left;
| |
| − | update();
| |
| − | $('html, body').stop().animate({scrollLeft:left, scrollTop:"0px"}, 500);
| |
| − |
| |
| − |
| |
| − | }
| |
| − | } else if(target == "#back") {
| |
| − | if(currentPanel - 1 >= 0)
| |
| − | {
| |
| − | currentPanel--;
| |
| − | var left = $(panels[currentPanel]).position().left;
| |
| − | update();
| |
| − | $('html, body').stop().animate({scrollLeft:left, scrollTop:"0px"}, 500);
| |
| − |
| |
| − |
| |
| − | }
| |
| − | } else {
| |
| − | var left = $(target).position().left;
| |
| − |
| |
| − | if($(this).data('group') == footerMenus[activeMenu])
| |
| − | {
| |
| − | if(panels[currentPanel] != target)
| |
| − | {
| |
| − | for(var i = 0; i < panels.length; i++)
| |
| − | {
| |
| − | if(panels[i] === target)
| |
| − | {
| |
| − | currentPanel=i;
| |
| − | break;
| |
| − | }
| |
| − | }
| |
| − | update();
| |
| − | $('html, body').stop().animate({scrollLeft:left, scrollTop:"0px"}, 1000);
| |
| − | }
| |
| − | }
| |
| − | }
| |
| − |
| |
| − |
| |
| − |
| |
| − | });
| |
| − |
| |
| − | /*$("body").mousewheel(function(event,delta) {
| |
| − |
| |
| − |
| |
| − | event.preventDefault();
| |
| − |
| |
| − |
| |
| − | if(currentPanel-delta < panels.length)
| |
| − | {
| |
| − | if(currentPanel-delta>=0)
| |
| − | {
| |
| − | currentPanel-=delta;
| |
| − | var left = $(panels[currentPanel]).position().left;
| |
| − |
| |
| − | $("html,body").stop().animate({scrollLeft:left, scrollTop:"0px"}, 500);
| |
| − | event.preventDefault();
| |
| − | }
| |
| − | }
| |
| − | update();
| |
| − |
| |
| − | });*/
| |
| − |
| |
| − | update();
| |
| − |
| |
| − |
| |
| − | }(jQuery));
| |
| − |
| |
| − | var camera, scene, renderer, mesh, loader, material,texture,composer;
| |
| − | var container;
| |
| − | var sFinal;
| |
| − | var json;
| |
| − |
| |
| − | $.ajaxSetup({ async: false });
| |
| − |
| |
| − | sFinal = $.ajax({
| |
| − | url: "https://static.igem.org/mediawiki/2015/c/ce/Dna.txt",
| |
| − | }).responseText;
| |
| − |
| |
| − | json = JSON.parse(sFinal);
| |
| − |
| |
| − | container = document.getElementById('canvas');
| |
| − | document.body.appendChild(container);
| |
| − |
| |
| − | renderer = new THREE.WebGLRenderer();
| |
| − | renderer.setSize(1920,1080);
| |
| − | renderer.setClearColor( 0x90D8F0,0);
| |
| − | container.appendChild(renderer.domElement);
| |
| − |
| |
| − | scene = new THREE.Scene();
| |
| − | var ambientLight = new THREE.AmbientLight(0x404040);
| |
| − | scene.add(ambientLight);
| |
| − |
| |
| − | var directionalLight = new THREE.DirectionalLight(0xFFFFFF,1);
| |
| − | var directionalLight2 = new THREE.DirectionalLight(0xFFFFFF,1);
| |
| − | directionalLight.position.set(10, 1, 3);
| |
| − | directionalLight2.position.set(0, 3, 10);
| |
| − | scene.add(directionalLight);
| |
| − | scene.add(directionalLight2);
| |
| − |
| |
| − | camera = new THREE.PerspectiveCamera( 75, 1920 / 1080, 1, 10000 );
| |
| − | camera.position.x = 10;
| |
| − | camera.position.y = 0;
| |
| − | camera.position.z = 25;
| |
| − |
| |
| − | /*
| |
| − |
| |
| − | composer = new THREE.EffectComposer( renderer );
| |
| − | composer.addPass(new THREE.RenderPass(scene,camera));
| |
| − |
| |
| − | var RGBShift = new THREE.ShaderPass(THREE.RGBShiftShader);
| |
| − | RGBShift.uniforms[ 'amount' ].value = 0.0;
| |
| − | composer.addPass (RGBShift);
| |
| − |
| |
| − | var effect = new THREE.ShaderPass( THREE.HorizontalBlurShader );
| |
| − | effect.renderToScreen = true;
| |
| − | composer.addPass( effect );
| |
| − |
| |
| − | */
| |
| − | // LOAD AND CREATE STRAND
| |
| − | loader = new THREE.JSONLoader();
| |
| − |
| |
| − | var strand = loader.parse(json, null);
| |
| − | material = new THREE.MeshLambertMaterial( {color: 0x63D8FF });
| |
| − | mesh = new THREE.Mesh( strand.geometry, material );
| |
| − | mesh.rotation.y +=Math.PI / 2 + 0.3;
| |
| − | mesh.rotation.x +=Math.PI / 6;
| |
| − | mesh.position.x = 0;
| |
| − | mesh.position.z = 3;
| |
| − | mesh.position.y = 0;
| |
| − | scene.add( mesh );
| |
| − |
| |
| − |
| |
| − | var imgTexture = THREE.ImageUtils.loadTexture( "https://static.igem.org/mediawiki/2015/d/d7/Background0.jpg" );
| |
| − | var imgMaterial = new THREE.MeshBasicMaterial( {
| |
| − | map : imgTexture
| |
| − | } );
| |
| − | var geometry = new THREE.PlaneBufferGeometry(1920*2, 1080*2,1,1);
| |
| − | var plane = new THREE.Mesh(geometry, imgMaterial);
| |
| − | scene.add(plane);
| |
| − | plane.position.x = 0;
| |
| − | plane.position.y = 0;
| |
| − | plane.position.z = -1000;
| |
| − |
| |
| − |
| |
| − | window.addEventListener('resize', function() {
| |
| − | var WIDTH = window.innerWidth,
| |
| − | HEIGHT = window.innerHeight;
| |
| − | renderer.setSize(WIDTH, HEIGHT);
| |
| − | camera.aspect = WIDTH / HEIGHT;
| |
| − | camera.updateProjectionMatrix();
| |
| − | });
| |
| − |
| |
| − | function render() {
| |
| − |
| |
| − | mesh.rotation.z -= 0.001;
| |
| − | renderer.render(scene,camera);
| |
| − |
| |
| − |
| |
| − | }
| |
| − |
| |
| − | (function animate() {
| |
| − |
| |
| − | requestAnimationFrame( animate );
| |
| − |
| |
| − | render();
| |
| − |
| |
| − | })();
| |
| − |
| |
| − | $(document).ready(function() {
| |
| − | setTimeout(function(){
| |
| − | $('body').addClass('loaded');
| |
| − | }, 3000);
| |
| − | });
| |
| − | </script>
| |
| − | </body>
| |
| − | </html>
| |
| − | -->
| |
| − |
| |
| − |
| |
| − |
| |
| | <!DOCTYPE html> | | <!DOCTYPE html> |
| | <html lang="en"> | | <html lang="en"> |