"
Template:Bielefeld Recipes 2010
From 2010.igem.org
(Difference between revisions)
(New page: <html> <script> $(document).ready( function(){ $('#recipe_container').append("Welcome, "+wgUserName+". I know you are logged in!"); } ); </script> <div id="recipe_container"></div> </htm...) |
|||
| Line 1: | Line 1: | ||
<html> | <html> | ||
| + | <STYLE type='text/css'> | ||
| + | .compatibility_div ul, | ||
| + | .compatibility_div li { | ||
| + | display: inline; | ||
| + | } | ||
| + | .compatibility_div li { | ||
| + | position: relative; | ||
| + | padding-top: 2px; | ||
| + | padding-left:4px; | ||
| + | padding-right:3px; | ||
| + | margin-right:2px; | ||
| + | margin-bottom: 5px; | ||
| + | } | ||
| + | .compatibility_div .box { | ||
| + | top: 35px; | ||
| + | width: 200px; | ||
| + | left: 0px; | ||
| + | } | ||
| + | .compatibility_div .box_white { | ||
| + | border: 1px solid gray; | ||
| + | background-color: white; | ||
| + | } | ||
| + | .compatibility_div .box_red { | ||
| + | border: 1px solid #dd6666; | ||
| + | background-color: #ffcccc; | ||
| + | background-image: url('http://partsregistry.org/images/red_not/red_box.png'); | ||
| + | background-repeat: none; | ||
| + | } | ||
| + | .compatibility_div .box_green { | ||
| + | border: 1px solid #44ee44; | ||
| + | background-color: #aaffaa; | ||
| + | } | ||
| + | #reviews { | ||
| + | float:right; | ||
| + | width:140px; | ||
| + | margin-right:20px; | ||
| + | } | ||
| + | #reviews .review_box { | ||
| + | position:relative; | ||
| + | padding: 2px 5px 5px 5px; | ||
| + | border:1px solid #aaa; | ||
| + | font-size:85%; | ||
| + | cursor: pointer; | ||
| + | } | ||
| + | #reviews .histogram { | ||
| + | position:absolute; | ||
| + | z-index:100; | ||
| + | height:9px; | ||
| + | left:15px; | ||
| + | top:3px; | ||
| + | } | ||
| + | |||
| + | </STYLE> | ||
<script> | <script> | ||
$(document).ready( | $(document).ready( | ||
function(){ | function(){ | ||
| + | if(wgUserName != null){ | ||
$('#recipe_container').append("Welcome, "+wgUserName+". I know you are logged in!"); | $('#recipe_container').append("Welcome, "+wgUserName+". I know you are logged in!"); | ||
| + | } else { | ||
| + | $('#recipe_container').append("Please log in. Guests can neither submit nor vote."); | ||
| + | } | ||
| + | |||
| + | getRecipes(); | ||
| + | |||
| + | |||
} | } | ||
); | ); | ||
| + | |||
| + | function recipes(recipeList){ | ||
| + | var statusHTML = ""; | ||
| + | for (var i=0; i<recipeList.length-1; i++) { | ||
| + | var author = recipeList[i].author; | ||
| + | var title = recipeList[i].title; | ||
| + | var text = recipeList[i].text; | ||
| + | var taste = recipeList[i].taste; | ||
| + | |||
| + | $('#recipe_container').append('<a name="'+title+'"></a><h3> <span class="mw-headline"> <b>'+title+'</b> </span></h3>'); | ||
| + | $('#recipe_container').append(text); | ||
| + | $('#recipe_container').append('<div id="recipeCompatibility_'+i+'" class="compatibility_div" style="display:inline;"></div>'); | ||
| + | $('#recipeCompatibility_'+i).append("<p>Taste Compatibilty:</p>"); | ||
| + | $('#recipeCompatibility_'+i).append('<ul id="taste_ul_'+i+'"></ul>'); | ||
| + | $('#taste_ul_'+i).append("<LI id='taste_li_"+i+"_"+1+"' class='boxctrl box_red'>sweet<DIV class='box'<DIV>Where I come from, we say CANDY.</div></div></LI><LI id='taste_li_"+i+"_"+2+"' class='boxctrl box_red'>mild<DIV class='box'><DIV>My toast was better flavored.</div></div></LI><LI id='taste_li_"+i+"_"+3+"' class='boxctrl box_red'>spiced<DIV class='box'><DIV>I found traces of spice.</div></div></LI><LI id='taste_li_"+i+"_"+4+"' class='boxctrl box_red'>hot<DIV class='box'><DIV>Yay! That was hot!</div></div></LI><LI id='taste_li_"+i+"_"+5+"' class='boxctrl box_red'>burnin'<DIV class='box'><DIV>Can't... talk... *snief*</div></div></LI>"); | ||
| + | $('#taste_li_'+i+'_'+taste).removeClass('box_red').addClass('box_green'); | ||
| + | |||
| + | } | ||
| + | |||
| + | } | ||
</script> | </script> | ||
| + | <script type="text/javascript" src="http://www.igem-bielefeld.de/recipes/recipes.php" ></script> | ||
<div id="recipe_container"></div> | <div id="recipe_container"></div> | ||
</html> | </html> | ||
Revision as of 14:00, 9 September 2010
