Template:Team:UC Davis/KO3D

From 2013.igem.org

(Difference between revisions)
 
(100 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
 +
<script src="http://code.jquery.com/jquery.min.js"></script>
 +
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
 +
<!--script src='https://2013.igem.org/Template:Team:UC_Davis/jquery.color.min.js?action=raw'></script-->
 +
<script src="http://code.jquery.com/color/jquery.color-2.1.2.js"></script>
<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 src='https://2011.igem.org/Template:Team:UC_Davis/Three.js?action=raw'></script>
<script src='https://2011.igem.org/Template:Team:UC_Davis/Three.js?action=raw'></script>
Line 249: Line 253:
     NEAR = 0.1,
     NEAR = 0.1,
     FAR = 10000;
     FAR = 10000;
 +
var dataMax = 90000;
-
mutantcolors = ["white", "#ff6666", "orange", "yellow", "#66ff66", "#66ffff", "#ddaaff", "pink"];
+
mutantcolors = ["white", "#ff6666", "yellow", "#66ff66", "#66ffff", "#ddaaff", "pink"];
-
mutantcolors_hex = [0xffffff, 0xff6666, 0xffa500, 0xffff00, 0x66ff66, 0x66ffff, 0xddaaff, 0xffc0cb];
+
mutantcolors_hex = [0xffffff, 0xff6666, 0xffff00, 0x66ff66, 0x66ffff, 0xddaaff, 0xffc0cb];
selectedColor = "orange";
selectedColor = "orange";
widget_mode = "3D";
widget_mode = "3D";
have_3d_data = false;
have_3d_data = false;
$(document).ready(function(){
$(document).ready(function(){
 +
     $("#mutantwidget").append('<div id="mw_selectmenu"/>');
     $("#mutantwidget").append('<div id="mw_selectmenu"/>');
     $("#mutantwidget").append('<div id="mw_optionsmenu"><table id="mw_optionstable"></table></div>');
     $("#mutantwidget").append('<div id="mw_optionsmenu"><table id="mw_optionstable"></table></div>');
 +
    if($("#mutantwidget .dataMax").text() == 3)
 +
    {$("#mutantwidget").append('<div id="mw_zoommenu"><table id="mw_zoomoptionstable"></table></div>');}
Line 271: Line 279:
         }
         }
   //    $('#mw_optionstable').append("<tr><td>Sequence</td></tr>");
   //    $('#mw_optionstable').append("<tr><td>Sequence</td></tr>");
-
 
+
        if($("#mutantwidget .dataMax") .length == 1)
 +
        {
 +
            $('#mw_zoomoptionstable').append("<tr><th>Ymax</th></tr>");
 +
            $('#mw_zoomoptionstable').append("<tr><td onClick>80000</td></tr>");
 +
            $('#mw_zoomoptionstable').append("<tr><td>10000</td></tr>");
 +
            $('#mw_zoomoptionstable').append("<tr><td>2000</td></tr>");
 +
        }
     $('#mw_optionstable td').css({opacity:0.3});
     $('#mw_optionstable td').css({opacity:0.3});
 +
    $('#mw_zoomoptionstable td').css({opacity:0.3});
     $('#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"/>');
Line 286: Line 301:
         $('#mutantwidget').append("<div class='yaxis'>Fluorescence/OD</div>");
         $('#mutantwidget').append("<div class='yaxis'>Fluorescence/OD</div>");
         $('#mutantwidget').append("<div class='xaxis'>Theophylline (mM)</div>");
         $('#mutantwidget').append("<div class='xaxis'>Theophylline (mM)</div>");
-
       
+
 
     $('#mw_selectmenu td').mouseover(function()
     $('#mw_selectmenu td').mouseover(function()
     {
     {
Line 301: Line 316:
         }
         }
     });
     });
 +
    $('#mw_zoommenu td').mouseover(function()
 +
    {
 +
        if(!$(this).hasClass("selected"))
 +
        {
 +
            $(this).dequeue().animate({"opacity":.6, "color":selectedColor}, 500);
 +
        }
 +
    });
 +
     $('#mw_optionsmenu td').mouseout(function()
     $('#mw_optionsmenu td').mouseout(function()
     {
     {
Line 315: Line 338:
             $(this).dequeue().animate({"opacity":.3, color:"rgb(225, 225, 225)"}, 500);
             $(this).dequeue().animate({"opacity":.3, color:"rgb(225, 225, 225)"}, 500);
         }
         }
 +
    });
 +
    $('#mw_zoommenu td').mouseout(function()
 +
    {
 +
        if(!$(this).hasClass("selected"))
 +
        {
 +
            $(this).dequeue().animate({"opacity":.3, color:"rgb(225, 225, 225)"}, 500);
 +
        }
     });
     });
 +
 +
    $('#mw_zoommenu td').click(
 +
        function()  {
 +
        if(!$(this).hasClass("selected"))
 +
        { $('#mw_zoommenu td').removeClass("selected");
 +
                $(this).addClass("selected");
 +
                $('#mw_zoommenu td').mouseout();
 +
                dataMax = $(this).text();
 +
        }
 +
        $('#mw_optionsmenu td').removeClass("selected");
 +
        if (widget_mode == "2D")
 +
          {$('#mw_optionsmenu td').eq(0).mouseover().click();}
 +
        else
 +
          {}
 +
        });
 +
       
     $('#mw_optionsmenu td').click(
     $('#mw_optionsmenu td').click(
         function() {
         function() {
Line 331: Line 377:
                     $('.yaxis').show();
                     $('.yaxis').show();
                     $('.xaxis').show();
                     $('.xaxis').show();
 +
                    $('#mw_zoommenu').show();
widget_mode = "2D";
widget_mode = "2D";
             dataseries = [];
             dataseries = [];
Line 353: Line 400:
             {  
             {  
                 xaxis: {max:10, min:0},
                 xaxis: {max:10, min:0},
-
                 yaxis: {max: 85000, min:0},
+
                 yaxis: {max: dataMax, min:0},
                 grid: {  },
                 grid: {  },
                                 points: {show: true},  
                                 points: {show: true},  
Line 365: Line 412:
                     $('.yaxis').hide();
                     $('.yaxis').hide();
                     $('.xaxis').hide();
                     $('.xaxis').hide();
 +
                    $('#mw_zoommenu').hide();
widget_mode = "3D";
widget_mode = "3D";
update3DPlotMeshes();
update3DPlotMeshes();
Line 410: Line 458:
             {  
             {  
                 xaxis: {max:10, min:0},
                 xaxis: {max:10, min:0},
-
                 yaxis: {max:85000, min:0},
+
                 yaxis: {max:dataMax, min:0},
                 grid: { },
                 grid: { },
                                 points: {show: true},  
                                 points: {show: true},  
Line 437: Line 485:
     //Extract plotting data
     //Extract plotting data
 +
    dataMax = $('#mutantwidget .dataMax').text();
 +
    if (dataMax.length == 0)
 +
    { dataMax = 90000; }
 +
    else if (dataMax == 3)
 +
    { dataMax = 80000; }
 +
    axisdimensions = [0, 1, 0, 10, 0, dataMax];
     data = [];
     data = [];
     errbars_2d = [];
     errbars_2d = [];
Line 477: Line 531:
             {  
             {  
                 xaxis: {max:10, min:0},
                 xaxis: {max:10, min:0},
-
                 yaxis: {max:85000, min:0},
+
                 yaxis: {max:dataMax, min:0},
                 grid: {  },
                 grid: {  },
             });
             });
Line 509: Line 563:
     }
     }
);
);
-
axisdimensions = [0, 1, 0, 10, 0, 90000];
+
axisdimensions = [0, 1, 0, 10, 0, dataMax];
var numxpoints = 30;
var numxpoints = 30;
var numypoints = 30;
var numypoints = 30;
Line 995: Line 1,049:
         $('#mw_selectmenu td').eq(0).mouseover().click();
         $('#mw_selectmenu td').eq(0).mouseover().click();
 +
        $('#mw_selectmenu td').eq(1).mouseover().click();
         $('#mw_selectmenu td').eq(3).mouseover().click();
         $('#mw_selectmenu td').eq(3).mouseover().click();
-
         $('#mw_selectmenu td').eq(5).mouseover().click();
+
         $('#mw_optionstable td').eq(1).mouseover().click();
-
 
+
        $('#mw_zoomoptionstable td').eq(0).mouseover().click();
});
});
</script>
</script>
Line 1,048: Line 1,103:
background: rgba(0,0,0,.6);
background: rgba(0,0,0,.6);
}
}
 +
 +
#mw_zoommenu {
 +
top: 25px;
 +
right: 650px;
 +
padding: 3px 0px 4px 9px;
 +
position: absolute;
 +
margin: 4px;
 +
width: 80px;
 +
}
 +
 +
#mw_zoomoptionstable {
 +
margin-left: 3px;
 +
background: rgba(0,0,0,.6);
 +
}
 +
 +
#mw_zoomoptionstable th{
 +
color:rgba(225,225,225,1);
 +
}
 +
#mw_sequencearea {
#mw_sequencearea {
font-family: monospace;
font-family: monospace;

Latest revision as of 02:07, 29 October 2013

Retrieved from "http://2013.igem.org/Template:Team:UC_Davis/KO3D"