Template:Team:Uppsala/notebook

From 2013.igem.org

(Difference between revisions)
(Replaced content with " #main_frame { min-height: 1800px; width: 950px; margin: 20px auto; border: 1px solid ligth gray; border-radius: 15px; box-shadow: ...")
Line 9: Line 9:
}
}
 +
 +
 +
#main_frame {
 +
min-height: 1800px;
 +
width: 950px;
 +
margin: 20px auto;
 +
border: 1px solid ligth gray;
 +
border-radius:         15px;
 +
box-shadow:         0px 0px 30px rgba(110,110,110, .8);
 +
background:         white;
 +
 +
}
 +
 +
 +
 +
.cal_calendar
 +
{
 +
float: left;
 +
        background-color: white;
 +
        width: 100%;
 +
        margin: auto;
 +
        height: 20%;
 +
       
 +
}
 +
.cal_d_weeks th
 +
{
 +
border-radius: 5px;
 +
}
 +
.cal_calendar th
 +
{
 +
border: 1px solid #22409a;
 +
        background-color: #b6e6fd;
 +
        width: 36px;
 +
}
 +
.cal_calendar td
 +
{
 +
/*border: 1px solid gray;*/
 +
box-shadow: 0px 5px 10px rgba(120,120,120, .7);
 +
        background-color: white;
 +
        text-align: center;
 +
        width: 36px;
 +
        height: 36px;
 +
}
 +
.cal_today input[type=submit]
 +
{
 +
color: #0089d1;
 +
        font-weight: bold;
 +
}
 +
.cal_days_bef_aft
 +
{
 +
visibility: hidden;
 +
        color: #5a779e;
 +
}
 +
.week input[type=submit]
 +
{
 +
color: #22409a;
 +
font-weight: bold;
 +
}
 +
.head th
 +
{
 +
border: white;
 +
background-color: white;
 +
}
 +
input[type=submit]:hover
 +
{
 +
/*box-shadow: inset 10px -10px 10px rgba(34,64,154, 0.5);*/
 +
color: #b6e6fd;
 +
font-weight: bold;
 +
background-color: #22409a;
 +
}
 +
input[type=submit]
 +
{
 +
 +
border: white;
 +
background-color: white;
 +
width: 100%;
 +
height: 100%;
 +
opacity: 1;
 +
}
 +
#file_holder
 +
{
 +
margin-top: 35%;
 +
}
 +
#calendar
 +
{
 +
 +
}
 +
.eventBox
 +
{
 +
 +
text-align: center;
 +
border: 2px solid ligth gray;
 +
box-shadow: 0px 2px 10px rgba(120,120,120, .7);
 +
padding: 10px;
 +
margin-top: 10px;
 +
}
 +
 +
#left{
 +
width: 36px;
 +
}
 +
#right{
 +
width: 36px;
 +
}
 +
 +
 +
</style>
 +
 +
<script type="text/javascript">
 +
 +
var month = new Date().getMonth();   // current month that the calendar will show
 +
var year = new Date().getFullYear(); //  current year that the calendar will show
 +
var cal_table = ''; //  calendar string
 +
var eventString;
 +
var days_with_dirys = new Array('t201381');
 +
var inputs = 1;
 +
var days_in_month = new Array(31,28,31,30,31,30,31,31,30,31,30,31);
 +
/*
 +
getWeek() will calculate current week nr
 +
*/
 +
Date.prototype.getWeek = function()
 +
{
 +
        var onejan = new Date(this.getFullYear(),0,1);
 +
        return Math.ceil((((this - onejan) / 86400000) + onejan.getDay()+1)/7);
 +
 +
}
 +
/*
 +
writes/rewrites the calculator string
 +
*/
 +
function calendar_normal()
 +
{
 +
var m = month+1;
 +
var date = new Date(); // todays date
 +
        var today = date.getDate();   //  todays month number
 +
cal_table = '';
 +
 +
if(year<=200)
 +
{
 +
                year += 1900;
 +
}
 +
 +
        months = new Array('January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December');
 +
var weekDay = new Array('Mon', 'Tue', 'We', 'Thu', 'Fri', 'Sat', 'Sun');
 +
days_in_month = new Array(31,28,31,30,31,30,31,31,30,31,30,31);
 +
 +
if(year%4 == 0 && year!=1900)
 +
{
 +
                days_in_month[1]=29;
 +
}
 +
 +
        total = days_in_month[month];
 +
        var date_today = months[month]+' '+year;
 +
       
 +
        cal_table = cal_table + '<table class="cal_calendar" ><tbody id="cal_body"><tr class="head"><th class="arrow"><input id="left" type="image" onclick="left_arrow()" src="image/buttons/arrowleft.png"></th><th colspan="6" >'+date_today+'</th><th class="arrow"><input id="right" type="image" onclick="right_arrow()" src="image/buttons/arrowright.png"></th></tr>';
 +
        cal_table = cal_table + '<tr class="cal_d_weeks"><th>Mon</th><th>Tue</th><th>Wed</th><th>Thu</th><th>Fri</th><th>Sat</th><th>Sun</th><th>Week</th></tr><tr>';
 +
        week = 0;
 +
 +
var first_week_day = new Date(year, month, 0).getDay();
 +
 +
        for(week_day = 0; week_day < first_week_day; week_day++)
 +
        {
 +
                cal_table = cal_table +'<td class="cal_days_bef_aft"></td>';
 +
                week++;
 +
        }
 +
 +
        for(i=1;i<=total;i++)
 +
        {
 +
 +
                if(week==0)
 +
                {
 +
                    cal_table = cal_table + '<tr>';
 +
                }
 +
 +
                if(today==i && month == date.getMonth() && year == date.getFullYear())
 +
                {
 +
                    cal_table = cal_table +'<td id="'+'t'+year+m+i+'" class="cal_today"><input type="submit" onclick="showNotes(year, month, value)" value="'+i+'"></td>';
 +
                }
 +
 +
                else
 +
                {
 +
                    cal_table = cal_table +'<td id="'+'t'+year+m+i+'" class="not_today"><input type="submit" onclick="showNotes(year, month, value)" value="'+i+'"></td>';
 +
                }
 +
 +
                week++;
 +
markerNotes(year, m, i);
 +
                if(week==7)
 +
                {
 +
var weeknr = new Date(year, month, i-1).getWeek();
 +
cal_table = cal_table + '<td class="week"><input type="submit" onclick="showNotesOfweek(year, value)" value="'+weeknr+'"></td>';
 +
                    cal_table = cal_table + '</tr>';   
 +
week=0;
 +
                }
 +
 +
        }
 +
 +
        for(i=1;week!=0;i++)
 +
        {
 +
                cal_table = cal_table + '<td class="cal_days_bef_aft"></td>';
 +
                week++;
 +
 +
                if(week==7)
 +
                {
 +
if(weeknr == 53)
 +
{
 +
var weeknr = 1;
 +
}
 +
else
 +
{
 +
var weeknr = weeknr+1;
 +
}
 +
cal_table = cal_table + '<td class="week"><input type="submit" onclick="showNotesOfweek(year, value)" value="'+weeknr+'"></td>';
 +
                        cal_table = cal_table + '</tr>';
 +
                        week=0;
 +
                }
 +
        }
 +
        cal_table = cal_table + '</tbody></table>';
 +
}
 +
 +
 +
function left_arrow()
 +
{
 +
month = month-1;
 +
if(month == -1)
 +
{
 +
year = year - 1;
 +
month = 11;
 +
}
 +
calendar_normal();
 +
document.getElementById('calendar').innerHTML = cal_table;
 +
}
 +
 +
 +
 +
function right_arrow()
 +
{
 +
month = month+1;
 +
if(month == 12)
 +
{
 +
year = year +1;
 +
month = 0;
 +
}
 +
calendar_normal();
 +
document.getElementById('calendar').innerHTML = cal_table;
 +
}
 +
 +
function showNotes(y, m, day)
 +
{
 +
var m = month+1;
 +
 +
eventString =  '<div class="eventBox" id="'+'d'+y+m+day+'" onclick="diry('+y+', '+m+', '+day+');"><h1>'+y+'-'+m+'-'+day+'</h1></div>';
 +
document.getElementById('file_holder').innerHTML = eventString;
 +
}
 +
 +
function showNotesOfweek(y, wnr)
 +
{
 +
var d = new Date(y, 0, 0);
 +
var w = d.getTime() + 604800000 * (wnr-1);
 +
var m = new Date(w).getMonth()+1;
 +
var y = new Date(w).getFullYear();
 +
var day = new Date(w).getDate();
 +
 +
var e = new Date(w).getDay();
 +
day = day - e+1;
 +
 +
eventString = '<div class="eventBox" id="'+'d'+y+m+day+'" onclick="diry('+y+', '+m+', '+day+');"><h1>'+y+'-'+m+'-'+day+'</h1></div>';
 +
 +
for(i=1;i<7;i++)
 +
{
 +
if(days_in_month[m-1] == day )
 +
{
 +
day = 0;
 +
m++;
 +
if(m>12)
 +
{
 +
y++;
 +
var d = new Date(y, 0, 0);
 +
var w = d.getTime() + 604800000 * (wnr-1);
 +
var m = 1;
 +
}
 +
 +
}
 +
day++;
 +
eventString = eventString + '<div class="eventBox" id="'+'d'+y+m+day+'" onclick="diry('+y+', '+m+', '+day+');"><h1>'+y+'-'+m+'-'+day+'</h1></div>';
 +
}
 +
document.getElementById('file_holder').innerHTML = eventString;
 +
eventString = '';
 +
}
 +
 +
function markerNotes(y, m, d)
 +
{
 +
var id='t'+y+m+d;
 +
 +
for(c = 0; c<=inputs; c++)
 +
{
 +
if(days_with_dirys[c] == id)
 +
{
 +
 +
 +
cal_table = cal_table + '<style type="text/css">#'+id+'{border: 2px solid #FFA500;}</style>';
 +
 +
}
 +
}
 +
}
 +
 +
</script>
 +
<script type="text/javascript">
 +
function diry(y, m, d)
 +
{
 +
var ds = ''; //diryString
 +
var id = 'd'+y+m+d;
 +
//var ds = y+'-'+m+'-'+d;
 +
if(id == 'd201381')
 +
{
 +
ds = '<br><h2>Thursday 2013-08-01</h2><p>Name of participants: Marcus H, Karl H, Lovisa P, Emil M, Victor S, Hampus.E<br><br><h3>Ongoing constructs:</h3><br>' +
 +
'114. pSB1C3-B0034-TAL(MUT)<br>105. pSB3T5-J23101-B0034-TAL<br>107. pSB3T5-CP1-B0034-TAL<br>115. pSB3K5-J23101-B0034-His-TAL<br>116. pSB3T5-J23110-B0034-His-TAL<br>119.pSB1C3-B0034-4CL<br>120.pSB1C3-B0034-HIS-4CL<br>'+
 +
'137. pSB3K3-CP8-B0034-TAL<br>138. pSB3K3-CP8-B0034-His-TAL<br>139. pSB3K3-J23101-B0034-BFP<br>171. pSB3T5-J23110-B0034-4CL-B0034-STS<br>172. pSB3T5-CP1-B0034-TAL<br>185. pEL3S17-J23110-B0034-TAL-B0034-4CL-B0034-STS<br>186. pEL3S17-CP1-B0034-4CL-B0034-STS<br>'+
 +
'187. pEL3S17-CP8-B0034-4CL-B0034-STS<br>188. pEL3S17-J23101-B0034-4CL-B0034-STS<br>189. pSB3K3-J23101-B0034-TAL<br>204. pEL3S17-J23110-HIS-STS<br>205.pSBLB4C15-CP1-B0034-HIS-TAL<br>206.pSB1C3-J23101-B0034-TAL<br>'+
 +
 +
'<h3>Todays work</h3><br><h3>PCR screening and gel electrophorersis of construct:</h3><br>185.(5-10) pEL3S17-J23110-B0034-TAL-B0034-4CL-B0034-STS<br>'+
 +
 +
'<h3>sequencing prep. of constructs:</h3><br>185.9-185.10<br>'+
 +
 +
'<h3>Transformation of constructs:</h3><br>171. pSB3T5-J23110-B0034-4CL-B0034-STS<br>204. pEL3S17-J23110-HIS-STS<br>205.pSBLB4C15-CP1-B0034-HIS-TAL<br>206.pSB1C3-J23101-B0034-TAL<br><br>'+
 +
 +
'<h3>Results</h3><br>Construct 185, clone 9 and 10, bonds around 3000/4000 bp.<br><br>'+
 +
 +
'<h3>Follow up</h3><br>- <br><br>'+
 +
 +
'<h3>Other experiments</h3><br>-<br></p>';
 +
}
 +
else
 +
{
 +
ds = 'Nothing happend during this day!';
 +
}
 +
document.getElementById(id).setAttribute('onclick','closeNote('+y+', '+m+', '+d+');');
 +
document.getElementById(id).innerHTML = ds;
 +
}
 +
 +
function closeNote(y, m, d)
 +
{
 +
var ds = '';
 +
var id = 'd'+y+m+d;
 +
var ds = '<h1>'+y+'-'+m+'-'+d+'</h1>';
 +
document.getElementById(id).setAttribute('onclick','diry('+y+', '+m+', '+d+');');
 +
document.getElementById(id).innerHTML = ds;
 +
}
 +
</script>

Revision as of 23:47, 15 August 2013

#main_frame { min-height: 1800px; width: 950px; margin: 20px auto; border: 1px solid ligth gray; border-radius: 15px; box-shadow: 0px 0px 30px rgba(110,110,110, .8); background: white;

}


#main_frame { min-height: 1800px; width: 950px; margin: 20px auto; border: 1px solid ligth gray; border-radius: 15px; box-shadow: 0px 0px 30px rgba(110,110,110, .8); background: white;

}


.cal_calendar { float: left; 

       background-color:	white;
       width:				100%;
       margin:				auto;
       height:				20%;

} .cal_d_weeks th { border-radius: 5px; } .cal_calendar th { border: 1px solid #22409a; 

       background-color:	#b6e6fd;
       width:				36px;

} .cal_calendar td { /*border: 1px solid gray;*/ box-shadow: 0px 5px 10px rgba(120,120,120, .7); 

       background-color:	white;
       text-align:			center;
       width:				36px;
       height:				36px;

} .cal_today input[type=submit] { color: #0089d1; 

       font-weight:		bold;

} .cal_days_bef_aft { visibility: hidden; 

       color:				#5a779e;

} .week input[type=submit] { color: #22409a; font-weight: bold; } .head th { border: white; background-color: white; } input[type=submit]:hover { /*box-shadow: inset 10px -10px 10px rgba(34,64,154, 0.5);*/ color: #b6e6fd; font-weight: bold; background-color: #22409a; } input[type=submit] {

border: white; background-color: white; width: 100%; height: 100%; opacity: 1; }

  1. file_holder

{ margin-top: 35%; }

  1. calendar

{

} .eventBox {

text-align: center; border: 2px solid ligth gray; box-shadow: 0px 2px 10px rgba(120,120,120, .7); padding: 10px; margin-top: 10px; }

  1. left{

width: 36px; }

  1. right{

width: 36px; }


</style>

<script type="text/javascript">

var month = new Date().getMonth(); // current month that the calendar will show var year = new Date().getFullYear(); // current year that the calendar will show var cal_table = ; // calendar string var eventString; var days_with_dirys = new Array('t201381'); var inputs = 1; var days_in_month = new Array(31,28,31,30,31,30,31,31,30,31,30,31); /* getWeek() will calculate current week nr */ Date.prototype.getWeek = function() { 

       var onejan = new Date(this.getFullYear(),0,1);
       return Math.ceil((((this - onejan) / 86400000) + onejan.getDay()+1)/7);

} /* writes/rewrites the calculator string */ function calendar_normal() { var m = month+1; var date = new Date(); // todays date 

       var today = date.getDate(); 	   //  todays month number

cal_table = ;

if(year<=200) { 

               year += 1900;

} 

       months = new Array('January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December');

var weekDay = new Array('Mon', 'Tue', 'We', 'Thu', 'Fri', 'Sat', 'Sun'); days_in_month = new Array(31,28,31,30,31,30,31,31,30,31,30,31);

if(year%4 == 0 && year!=1900) { 

               days_in_month[1]=29;

} 

       total = days_in_month[month];
       var date_today = months[month]+' '+year;
cal_table = cal_table + '<tbody id="cal_body">'; cal_table = cal_table + ''; 
       week = 0;

var first_week_day = new Date(year, month, 0).getDay(); 

       for(week_day = 0; week_day < first_week_day; week_day++) 
       {
cal_table = cal_table +''; 
               week++;
       }

       for(i=1;i<=total;i++)
       {

               if(week==0)
               {
cal_table = cal_table + ''; } if(today==i && month == date.getMonth() && year == date.getFullYear()) { cal_table = cal_table +''; 
               }

               else
               {
cal_table = cal_table +''; 
               }

               week++;

markerNotes(year, m, i); 

               if(week==7)
               {

var weeknr = new Date(year, month, i-1).getWeek();

cal_table = cal_table + ''; cal_table = cal_table + ''; week=0; } } for(i=1;week!=0;i++) { cal_table = cal_table + ''; 
               week++;

               if(week==7)
               {

if(weeknr == 53) { var weeknr = 1; } else { var weeknr = weeknr+1; }

cal_table = cal_table + ''; 
                       cal_table = cal_table + '</tr>';
                       week=0;
               }
       }
cal_table = cal_table + '</tbody>
<input id="left" type="image" onclick="left_arrow()" src="image/buttons/arrowleft.png">'+date_today+'<input id="right" type="image" onclick="right_arrow()" src="image/buttons/arrowright.png">
MonTueWedThuFriSatSunWeek
<input type="submit" onclick="showNotes(year, month, value)" value="'+i+'"> <input type="submit" onclick="showNotes(year, month, value)" value="'+i+'"> <input type="submit" onclick="showNotesOfweek(year, value)" value="'+weeknr+'">
<input type="submit" onclick="showNotesOfweek(year, value)" value="'+weeknr+'">
';

}


function left_arrow() { month = month-1; if(month == -1) { year = year - 1; month = 11; } calendar_normal(); document.getElementById('calendar').innerHTML = cal_table; }


function right_arrow() { month = month+1; if(month == 12) { year = year +1; month = 0; } calendar_normal(); document.getElementById('calendar').innerHTML = cal_table; }

function showNotes(y, m, day) { var m = month+1;

eventString = '';

document.getElementById('file_holder').innerHTML = eventString; }

function showNotesOfweek(y, wnr) { var d = new Date(y, 0, 0); var w = d.getTime() + 604800000 * (wnr-1); var m = new Date(w).getMonth()+1; var y = new Date(w).getFullYear(); var day = new Date(w).getDate();

var e = new Date(w).getDay(); day = day - e+1;

eventString = '

'+y+'-'+m+'-'+day+'

';

for(i=1;i<7;i++) { if(days_in_month[m-1] == day ) { day = 0; m++; if(m>12) { y++; var d = new Date(y, 0, 0); var w = d.getTime() + 604800000 * (wnr-1); var m = 1; }

} day++;

eventString = eventString + '

'+y+'-'+m+'-'+day+'

';

} document.getElementById('file_holder').innerHTML = eventString; eventString = ; }

function markerNotes(y, m, d) { var id='t'+y+m+d;

for(c = 0; c<=inputs; c++) { if(days_with_dirys[c] == id) {


cal_table = cal_table + '<style type="text/css">#'+id+'{border: 2px solid #FFA500;}</style>';

} } }

</script> <script type="text/javascript"> function diry(y, m, d) { var ds = ; //diryString var id = 'd'+y+m+d; //var ds = y+'-'+m+'-'+d; if(id == 'd201381') {

ds = '

Thursday 2013-08-01

Name of participants: Marcus H, Karl H, Lovisa P, Emil M, Victor S, Hampus.E

Ongoing constructs:


' +

'114. pSB1C3-B0034-TAL(MUT)
105. pSB3T5-J23101-B0034-TAL
107. pSB3T5-CP1-B0034-TAL
115. pSB3K5-J23101-B0034-His-TAL
116. pSB3T5-J23110-B0034-His-TAL
119.pSB1C3-B0034-4CL
120.pSB1C3-B0034-HIS-4CL
'+ '137. pSB3K3-CP8-B0034-TAL
138. pSB3K3-CP8-B0034-His-TAL
139. pSB3K3-J23101-B0034-BFP
171. pSB3T5-J23110-B0034-4CL-B0034-STS
172. pSB3T5-CP1-B0034-TAL
185. pEL3S17-J23110-B0034-TAL-B0034-4CL-B0034-STS
186. pEL3S17-CP1-B0034-4CL-B0034-STS
'+ '187. pEL3S17-CP8-B0034-4CL-B0034-STS
188. pEL3S17-J23101-B0034-4CL-B0034-STS
189. pSB3K3-J23101-B0034-TAL
204. pEL3S17-J23110-HIS-STS
205.pSBLB4C15-CP1-B0034-HIS-TAL
206.pSB1C3-J23101-B0034-TAL
'+

'

Todays work


PCR screening and gel electrophorersis of construct:


185.(5-10) pEL3S17-J23110-B0034-TAL-B0034-4CL-B0034-STS
'+ '

sequencing prep. of constructs:


185.9-185.10
'+ '

Transformation of constructs:


171. pSB3T5-J23110-B0034-4CL-B0034-STS
204. pEL3S17-J23110-HIS-STS
205.pSBLB4C15-CP1-B0034-HIS-TAL
206.pSB1C3-J23101-B0034-TAL

'+ '

Results


Construct 185, clone 9 and 10, bonds around 3000/4000 bp.

'+ '

Follow up


-

'+ '

Other experiments


-

';

} else { ds = 'Nothing happend during this day!'; } document.getElementById(id).setAttribute('onclick','closeNote('+y+', '+m+', '+d+');'); document.getElementById(id).innerHTML = ds; }

function closeNote(y, m, d) { var ds = ; var id = 'd'+y+m+d;

var ds = '

'+y+'-'+m+'-'+d+'

';

document.getElementById(id).setAttribute('onclick','diry('+y+', '+m+', '+d+');'); document.getElementById(id).innerHTML = ds; } </script>

Retrieved from "http://2013.igem.org/Template:Team:Uppsala/notebook"