Template:Team:UC Davis/MutantWidget

From 2011.igem.org

(Difference between revisions)
Line 2: Line 2:
<script src='https://2011.igem.org/Template:Team:UC_Davis/jquery.flot.min.js?action=raw'></script>
<script src='https://2011.igem.org/Template:Team:UC_Davis/jquery.flot.min.js?action=raw'></script>
<script>
<script>
-
mutantcolors = ["white", "red", "orange", "yellow", "green", "blue", "indigo", "violet"];
+
mutantcolors = ["#fff","#FF7722","#bb66ff","#12aeef","#EE3333","#AADD00", "#BA5FAB", "#33ee33"];
$(document).ready(function(){
$(document).ready(function(){
-
    //Convert the ul to a table for some reason.
+
$("#mutantwidget").append('<div id="mw_selectmenu"/>');
-
$("#mutantwidget").wrapInner("<table/>").wrapInner('<div id="mw_selectmenu"/>');
+
$("#mw_selectmenu").append("<table id='seltable'/>");
$('#mutantwidget h3').wrapInner('<td/>').children().unwrap().css({opacity:.3}).wrap('<tr/>');
$('#mutantwidget h3').wrapInner('<td/>').children().unwrap().css({opacity:.3}).wrap('<tr/>');
 +
$('#mutantwidget tr').appendTo($('#mutantwidget #seltable'));
$('#mutantwidget').prepend('<div id="mw_grapharea"/>');
$('#mutantwidget').prepend('<div id="mw_grapharea"/>');
$('#mw_grapharea').append('<div id="mw_plot"/>');
$('#mw_grapharea').append('<div id="mw_plot"/>');
$('#mutantwidget').append('<div id="mw_sequencearea"/>');
$('#mutantwidget').append('<div id="mw_sequencearea"/>');
-
$('#mutantwidget .sequence').hide().appendTo($('#mutantwidget #mw_sequencearea'));
+
$('#mutantwidget span').hide();
 +
$('#mutantwidget .sequence').appendTo($('#mutantwidget #mw_sequencearea'));
$('#mw_selectmenu td').mouseover(function()
$('#mw_selectmenu td').mouseover(function()
{
{
Line 25: Line 27:
}
}
-
});
 
-
$.plot($("#mw_plot"), [ [[0, 0], [1, 1]] ],
 
-
{
 
-
yaxis: { max: 1 },
 
-
grid: { color:"rgba(225, 225, 225, 1)" },
 
});
});
$('#mutantwidget td').click(
$('#mutantwidget td').click(
function() {
function() {
-
                        if($(this).hasClass("selected"))
+
            if($(this).hasClass("selected"))
{
{
$(this).removeClass("selected");
$(this).removeClass("selected");
Line 41: Line 38:
$(this).dequeue().css({opacity:1});
$(this).dequeue().css({opacity:1});
$(this).addClass("selected");
$(this).addClass("selected");
 +
$('#mw_sequencearea').children().hide();
$('#mw_sequencearea').children().eq($(this).parent().index()).show();
$('#mw_sequencearea').children().eq($(this).parent().index()).show();
}
}
 +
dataseries = [];
 +
$('#mutantwidget td').each(
 +
function(index)
 +
{
 +
if($(this).hasClass("selected"))
 +
{
 +
if(data[index])
 +
{
 +
dataseries.push(data[index]);
 +
}
 +
}
 +
}
 +
);
 +
if(!dataseries[0])
 +
{
 +
dataseries.push([[0,0]]);
 +
}
 +
$.plot($("#mw_plot"), dataseries,
 +
{
 +
xaxis: {max:.014, min:0},
 +
yaxis: {max: 1.0, min:0},
 +
grid: { color:"rgba(225, 225, 225, 1)" },
 +
});
}
}
);
);
Line 59: Line 80:
}
}
);
);
 +
 +
//Extract plotting data
 +
data = [];
 +
$('#mutantwidget .xdata').each(
 +
function(index)
 +
{
 +
data.push({color:mutantcolors[index], data:[]});
 +
var thisdatax = $(this).text().split(',');
 +
var thisdatay = $('#mutantwidget .ydata').eq(index).text().split(',');
 +
var i;
 +
for(i=0; i < thisdatay.length; ++i)
 +
{
 +
thisdatay[i] = parseFloat(thisdatay[i]);
 +
}
 +
for(i=0; i < thisdatax.length; ++i)
 +
{
 +
thisdatax[i] = parseFloat(thisdatax[i]);
 +
data[index].data.push([thisdatax[i], thisdatay[i]])
 +
}
 +
 +
}
 +
);
 +
$.plot($("#mw_plot"), [[0,0]],
 +
{
 +
xaxis: {max:.014, min:0},
 +
yaxis: {max: 1.0, min:0},
 +
grid: { color:"rgba(225, 225, 225, 1)" },
 +
});
});
});

Revision as of 23:41, 22 September 2011

Retrieved from "http://2011.igem.org/Template:Team:UC_Davis/MutantWidget"