|
|
Line 3: |
Line 3: |
| <head> | | <head> |
| <title>Notebook</title> | | <title>Notebook</title> |
| + | <script language="JavaScript"> |
| + | clickMenu = function(menu) { |
| + | var getEls = document.getElementById(menu).getElementsByTagName("LI"); |
| + | var getAgn = getEls; |
| + | |
| + | for (var i=0; i<getEls.length; i++) { |
| + | getEls[i].onclick=function() { |
| + | for (var x=0; x<getAgn.length; x++) { |
| + | if ((this.className.indexOf('default'))==-1) { |
| + | getAgn[x].className=getAgn[x].className.replace("default", "off"); |
| + | } |
| + | getAgn[x].className=getAgn[x].className.replace("unclick", ""); |
| + | getAgn[x].className=getAgn[x].className.replace("click", "unclick"); |
| + | } |
| + | if ((this.className.indexOf('unclick'))!=-1) { |
| + | for (var x=0; x<getAgn.length; x++) { |
| + | getAgn[x].className=getAgn[x].className.replace("off", "default"); |
| + | } |
| + | this.className=this.className.replace("unclick", ""); |
| + | } |
| + | else { |
| + | this.className+=" click"; |
| + | } |
| + | } |
| + | } |
| + | } |
| + | </script> |
| + | <style type="text/css"> |
| + | #gallery {width:650px; height:500px; position:relative; border:1px solid #ddd; background:#fff;} |
| + | #gallery ul {list-style:none; padding:5px; margin:0; width:120px; float:right; height:300px; overflow:auto;} |
| + | #gallery ul li {display:inline; width:50px; height:50px; float:left; margin:0 4px 4px 0; border:1px solid #444; cursor:pointer;} |
| + | #gallery ul li img {display:block; width:50px; height:50px;} |
| + | #gallery ul li span {display:none; position:absolute; left:520px; top:300px; width:120px;font-family:verdana, arial, sans-serif; color:#666; font-size:11px; line-height:15px; text-align:justify;} |
| + | #gallery ul li span b {color:#333;} |
| + | |
| + | #gallery ul li.default {width:0; height:0; border:0;} |
| + | #gallery ul li.default i {position:absolute; left:0; top:0; width:545px; height:480px;} |
| + | #gallery ul li.default i img {margin:5px auto 0 auto; width:400px; height:400px; border:1px solid #fff;} |
| + | |
| + | #gallery ul li.off {display:none;} |
| + | #gallery ul li.click {border-color:#EF4BB9; background:#fff; cursor:default;} |
| + | #gallery ul li.click i {position:absolute; left:0; top:0; width:500px; height:480px;} |
| + | #gallery ul li.click i img {margin:5px auto 0 5px; width:auto; height:auto; border:1px solid black;} |
| + | |
| + | #gallery ul li.default span, |
| + | #gallery ul li.click span {display:block;} |
| + | </style> |
| </head> | | </head> |
| | | |
Line 13: |
Line 60: |
| | | |
| <article> | | <article> |
- | <h2>under construction...</h2> | + | <h2>Programming book</h2> |
| + | To improve our programming skill, we create a program every week (from March to July).<br> |
| + | Some interesting and interactive programs are as follows.<br> |
| + | Enjoy!<br> |
| + | <br> |
| + | <!--img must be under 480*480--> |
| + | <div id="gallery"> |
| + | <ul> |
| + | <li><i><img src="hanabi4.png"></i><span><b>Fire Works</b><br> |
| + | explanation<br> |
| + | <a href="#URL">Link</a> |
| + | </span></li> |
| + | <li><i><img src="fireworks.png"></i><span><b>Fire Works 2</b><br> |
| + | explanation |
| + | <a href="#URL">Link</a> |
| + | </span></li> |
| + | <li><i><img src="F_N.png"></i><span><b>FitzHugh-Nagumo</b><br> |
| + | Model of the ニューロンの定性的な振る舞い |
| + | </span></li> |
| + | <li><i><img src="bro.png"></i><span><b>Fractal</b><br> |
| + | Romanesco |
| + | </span></li> |
| + | <li><i><img src="furiko_ga.png"></i><span><b>Genetic Algorithm</b><br> |
| + | explanation |
| + | </span></li> |
| + | <li><i><img src="maze.png"></i><span><b>Maze</b><br> |
| + | Auto-made Maze |
| + | </span></li> |
| + | <li><i><img src="pso.png"></i><span><b>PSO</b><br> |
| + | Particle Swarm Optimization |
| + | </span></li> |
| + | <li><i><img src="bz.png"></i><span><b>Reaction Diffusion</b><br> |
| + | BZ reaction |
| + | </span></li> |
| + | <li><i><img src="voronoi.png"></i><span><b>Voronoi Diagram</b><br> |
| + | explanation |
| + | </span></li> |
| + | <!-- |
| + | <li class="default"><i><img src="../images/trees/t19.jpg" title="" alt="" /></i><span><b>Default text.</b><br />Iudico petentium ullamcorper mei id. Sed an illum sonet quando, ei inciderint signiferumque pri, te duo omnis malis aeterno.</span></li> |
| + | --> |
| + | </div> |
| + | <br> |
| + | <h2>Note book</h2> |
| + | <h3>Feb - Mar : </h3> |
| + | Studying about iGEM, and the past software teams' projects.<br> |
| + | <h3>Apr - May : </h3> |
| + | Decided to take part in “May Festival”, our university's festival with team UT-Tokyo, we talk about the software exhibited at that time.<br> |
| + | Gamification -- turn non-game concepts into game -- is our main theme, because |
| + | we think it is important to attract people who are not interested in synthetic biology to enjoyable games!<br> |
| + | And after discussions, we create the “Memory Game”. This game uses BioBrick-like materials.(-> you can play it <a href="#URL">here</a>)<br> |
| + | This colorful game gathers visitors' attentions.<br> |
| + | <h3>Jun - Jul : </h3> |
| + | Talking after talking.<br> |
| + | We gather and talk about our projects a lot.<br> |
| + | What we should create? What is its feature?<br> |
| + | <h3>Aug - Sep : </h3> |
| + | Program the software, receive feedback from other teams as well as members, and improve.<br> |
| + | On August 13th, we participate “iGEM JAPAN exchange meet-ups” and make a presentation.<br> |
| + | And now, we prepare for the asia Jamboree.<br> |
| + | |
| </article> | | </article> |
| | | |