Team:Heidelberg/js/notebook
From 2014.igem.org
Line 1: | Line 1: | ||
var projects = { | var projects = { | ||
- | + | DNMT1: "DNMT1 description", | |
- | + | LOV: "LOV Domain description", | |
- | + | Lyso: "Lysozyme description", | |
- | + | Xyla: "Xylanase description", | |
- | + | Toolbox: "Toolbox description", | |
- | + | General: "General description", | |
- | + | }; | |
- | + | ||
scrollToElement = function(id){ | scrollToElement = function(id){ | ||
- | $('#outerWrapper').animate({scrollTop: $('#'+id).offset().top - $('#innerWrapper').offset().top}, 1500, "easeInOutCubic"); | + | $('#outerWrapper').animate({scrollTop: $('#'+id).offset().top - $('#innerWrapper').offset().top}, 1500, "easeInOutCubic"); |
} | } | ||
- | updateToTimestamp = function(timestamp | + | updateToTimestamp = function(timestamp) { |
- | + | console.log("Updating to Timestamp: ", timestamp); | |
- | + | var $week = $('#innerWrapper .'+selectedProject).filter(function(){ | |
- | + | return ($(this).data("timestamp") <= timestamp) && (timestamp < $(this).data("timestamp")+604800); | |
- | + | }).first(); | |
- | + | $('#innerWrapper .'+selectedProject).removeClass('active'); | |
- | + | $('#outerWrapper').stop(true); | |
- | + | $week.addClass('active'); | |
- | + | $('#outerWrapper').animate({scrollTop: ($week.offset().top - $('#innerWrapper').offset().top)-20}, 1500, "easeInOutCubic"); | |
- | + | var $month = $('.month').filter(function(){ | |
- | + | return $(this).data("timestamp") <= timestamp; | |
- | + | }).last(); | |
- | + | $('.month').removeClass('active'); | |
- | + | $month.addClass('active'); | |
- | + | Graph.setDate(timestamp); | |
- | + | ||
} | } | ||
+ | var viewModel = new (function () { | ||
+ | var self = this; | ||
+ | self.projects = ['DNMT1', 'LOV', 'Lyso', 'Xyla', 'Toolbox', 'General'] | ||
+ | self.selected = ko.observable('General'); | ||
+ | })(); | ||
+ | $(function () { | ||
+ | $(".titles span").click(function(event){ | ||
+ | $('.titles span').removeClass("active"); | ||
+ | $(event.target).addClass("active"); | ||
+ | $('#project-description').html(projects[event.target.id]); | ||
+ | selectedProject = event.target.id; | ||
+ | console.log(selectedProject); | ||
+ | $('#innerWrapper > :not(.'+selectedProject).fadeOut(); | ||
+ | $('#innerWrapper > .'+selectedProject).fadeIn(); | ||
+ | }); | ||
- | + | $(".month").click(function(event){ | |
- | + | event.preventDefault(); | |
- | + | updateToTimestamp($(this).data("timestamp"), true); | |
- | + | return false; | |
- | + | }); | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | $(".weekentry").click(function() { | |
- | + | updateToTimestamp($(this).data("timestamp"), true); | |
- | + | }); | |
- | + | ||
- | + | ||
- | + | Graph.init(); | |
- | + | ||
- | + | ||
}); | }); | ||
- | |||
- |
Revision as of 16:14, 17 October 2014
var projects = { DNMT1: "DNMT1 description", LOV: "LOV Domain description", Lyso: "Lysozyme description", Xyla: "Xylanase description", Toolbox: "Toolbox description", General: "General description", };
scrollToElement = function(id){ $('#outerWrapper').animate({scrollTop: $('#'+id).offset().top - $('#innerWrapper').offset().top}, 1500, "easeInOutCubic"); }
updateToTimestamp = function(timestamp) { console.log("Updating to Timestamp: ", timestamp); var $week = $('#innerWrapper .'+selectedProject).filter(function(){ return ($(this).data("timestamp") <= timestamp) && (timestamp < $(this).data("timestamp")+604800); }).first(); $('#innerWrapper .'+selectedProject).removeClass('active'); $('#outerWrapper').stop(true); $week.addClass('active'); $('#outerWrapper').animate({scrollTop: ($week.offset().top - $('#innerWrapper').offset().top)-20}, 1500, "easeInOutCubic"); var $month = $('.month').filter(function(){ return $(this).data("timestamp") <= timestamp; }).last(); $('.month').removeClass('active'); $month.addClass('active');
Graph.setDate(timestamp); }
var viewModel = new (function () { var self = this; self.projects = ['DNMT1', 'LOV', 'Lyso', 'Xyla', 'Toolbox', 'General'] self.selected = ko.observable('General'); })();
$(function () { $(".titles span").click(function(event){ $('.titles span').removeClass("active"); $(event.target).addClass("active"); $('#project-description').html(projects[event.target.id]); selectedProject = event.target.id; console.log(selectedProject); $('#innerWrapper > :not(.'+selectedProject).fadeOut(); $('#innerWrapper > .'+selectedProject).fadeIn(); });
$(".month").click(function(event){ event.preventDefault(); updateToTimestamp($(this).data("timestamp"), true); return false; });
$(".weekentry").click(function() { updateToTimestamp($(this).data("timestamp"), true); });
Graph.init(); });