diff --git a/perfectSteak.css b/perfectSteak.css index 25509bf..bfc7883 100644 --- a/perfectSteak.css +++ b/perfectSteak.css @@ -85,6 +85,11 @@ input[type="radio"].toggle-right + label { height:200px; } +#d3{ + position: relative; + width: 80%; +} + .btn{ font-size:8pt; padding:2px; diff --git a/perfectSteak.js b/perfectSteak.js index 05a0465..b7e2360 100644 --- a/perfectSteak.js +++ b/perfectSteak.js @@ -5,56 +5,114 @@ var perfectSteak = function (div) { var currentInfo = { - 'meatTemp': 23, //initial temperature of the meat - 'thickness': 3, //thickness of the meat in centimeters - 'data': [], //timestamps of temperatures - 'numRows': 2, //how many steps there are in the recipe - 'time': 0, //time + 'meatTemp': 23, //initial temperature of the meat + 'thickness': 3, //thickness of the meat in centimeters + 'data': [], //timestamps of temperatures + 'numRows': 2, //how many steps there are in the recipe + 'time': 0, //time 'OKToGraph': true, //flag for when data is ready to graph - 'recipe': {}, //recipe - 'totalTime': 0, //total cooking - 'names':{'Steak':0,'Tuna':0,'Turkey':0} + 'recipe': {}, //recipes -- THIS HAS ALL SAVED RECIPES, INCLUDING THE ONES THAT WE SAVED + 'totalTime': 0, //total cooking + 'names': { + 'Steak': 0, + 'Tuna': 0, + 'Turkey': 0 + } }; var timeStep = 15; var inputTable = $(".inputTable"); - var toC = function (F) { + var toC = function (F) { return ((5 / 9) * (F - 32)); } - var toC = function (F) { + var toC = function (F) { return ((5 / 9) * (F - 32)); } -var importRecipes=function(){ - var saved=[{"name":"Heston Blumenthal","data":[[15,300,73],[15,73,300],[15,300,73],[15,73,300],[15,300,73],[15,73,300],[15,300,73],[15,73,300],[15,300,73],[15,73,300],[15,300,73],[15,73,300],[15,300,73],[15,73,300],[15,300,73],[15,73,300],[15,300,73],[15,73,300],[15,300,73],[15,73,300],[15,300,73],[15,73,300],[15,300,73],[15,73,300],[15,300,73],[15,73,300],[15,300,73],[300,73,73]],"Temp":73}, - {"name":"4 minutes a side","data":[[240,300,73],[240,73,300],[300,73,73]],"Temp":73}, - {"name":"America's Test Kitchen","data":[[15,450,73],[15,73,450],[300,225,225],[900,73,73]],"Temp":73}, - {"name":"Nathan Mhyrvold","data":[[3600,125,125],[30,-321,-321],[120,390,390]],"Temp":73}]; - for (var i=0;i<4;i++){ - var name=saved[i]["name"]; - var data=saved[i]["data"]; - - - for(var n=0;n 2) { + var timedata = $("#row" + g + "time").val() || 1000; + + + if (timedata == 1000) { + var timeMin = 4; + return 4; + } else if (timedata.length > 2) { var timeMin = function (time) { var timeString = ''; @@ -217,15 +281,21 @@ var importRecipes=function(){ var parseRecipe = function (recipeStr) { - - recipeStr=recipeStr.replace(/\n/g,' '); - + + recipeStr = recipeStr.replace(/\n/g, ' '); + var pattTemp = /\d+/g; var pattCelsius = /\°(.+)$/g; - var meatType; - if(recipeStr.indexOf("Steak")>-1){meatType="Steak"} - if(recipeStr.indexOf("Tuna")>-1){meatType="Tuna"} - if(recipeStr.indexOf("Turkey")>-1){meatType="Turkey"} + var meatType; + if (recipeStr.indexOf("Steak") > -1) { + meatType = "Steak" + } + if (recipeStr.indexOf("Tuna") > -1) { + meatType = "Tuna" + } + if (recipeStr.indexOf("Turkey") > -1) { + meatType = "Turkey" + } var pattTemp = /\d+/g; @@ -239,7 +309,7 @@ var importRecipes=function(){ if (recipeStr.match(pattCelsius)[0].charAt(1) == "F") { celsius = "F"; } - + var parsedThickness = numArray.shift(); var startingTemp = numArray.shift(); @@ -249,25 +319,27 @@ var importRecipes=function(){ for (var i = 0; i < numArray.length; i += 3) { newRow = []; newRow.push(numArray[i], numArray[i + 1], numArray[i + 2]); - + parsedData.push(newRow); } - var steak=[]; - for(var i=0;i"); var tableTabs = $(''); - - var tabContent = $("
"); - var tabPaneActive=$("
"); - var thickInpDiv=$("Meat Thickness: cm Initial Meat Temperature: °C"); - var meatInp=$("
Meat Type SteakTuna Turkey
"); - var switcheroo=$(''); - var mytog2=$(""); - var inputTable=$("
"); - var tabPane=$("
") - var inpTabHeader = $("Duration (m:s)Side 1 (°C)Side 2 (°C)"); - var containerm = $("
"); - inputTable.append(inpTabHeader) - switcheroo.append(mytog2); - tabPaneActive.append(switcheroo, thickInpDiv, meatInp, inputTable); - tabPane.append(containerm); - tabContent.append(tabPaneActive, tabPane); - + + var tabContent = $("
"); + var tabPaneActive = $("
"); + var thickInpDiv = $("Meat Thickness: cm Initial Meat Temperature: °C"); + var meatInp = $("
Meat Type SteakTuna Turkey
"); + var switcheroo = $(''); + var mytog2 = $(""); + var inputTable = $("
"); + var tabPane = $("
") + var inpTabHeader = $("Duration (m:s)Side 1 (°C)Side 2 (°C)"); + var containerm = $("
"); + inputTable.append(inpTabHeader) + switcheroo.append(mytog2); + tabPaneActive.append(switcheroo, thickInpDiv, meatInp, inputTable); + tabPane.append(containerm); + tabContent.append(tabPaneActive, tabPane); + displayDiv.append(tableTabs, tabContent); - tabContent.change(function () { - - $('#si1').html("Side 1 (°" + $('.mytog2:checked').attr('id') + ")"); - $('#si2').html("Side 2 (°" + $('.mytog2:checked').attr('id') + ")"); - $('#work').html("°" + $('.mytog2:checked').attr('id')); - //graph(false, $('.mytog:checked').attr('id')); - }); + tabContent.change(function () { + + $('#si1').html("Side 1 (°" + $('.mytog2:checked').attr('id') + ")"); + $('#si2').html("Side 2 (°" + $('.mytog2:checked').attr('id') + ")"); + $('#work').html("°" + $('.mytog2:checked').attr('id')); + //graph(false, $('.mytog:checked').attr('id')); + }); var addButton; - + var flipButton; var cookButton; var cookButt = $(""); cookButt.css("width", '100%'); - + /* updateTime goes through the table and updates the total cooking time entered. It also checks for any entries that are in seconds and calls to change them into the format mm:ss */ @@ -373,7 +446,7 @@ var importRecipes=function(){ time += sec; } } - model.updateTotalTime(time); + model.updateTotalTime(time); } /* @@ -386,9 +459,13 @@ var importRecipes=function(){ var dropdown1 = $(''); var dropdown2 = $(''); + var dropdown3 = $('') + dropdown3.append(''); + for (var key in model.currentInfo['recipe']) { dropdown1.append($('')); dropdown2.append($('')); + dropdown3.append($('')); } dropdownDiv.change(function () { @@ -396,17 +473,32 @@ var importRecipes=function(){ var name1 = e1.options[e1.selectedIndex].text; var e2 = document.getElementById("d2"); var name2 = e2.options[e2.selectedIndex].text; - var info = model.currentInfo['recipe'][name1]; - console.log(info); + console.log(info); d3.selectAll('.finalsteak').remove(); - - drawFinished(info[0], info[1], info[2], info[3], 0,info[4],info[5]); + + drawFinished(info[0], info[1], info[2], info[3], 0, info[4], info[5]); var inf = model.currentInfo['recipe'][name2]; - drawFinished(inf[0], inf[1], inf[2], inf[3], 1,inf[4],inf[5]); + drawFinished(inf[0], inf[1], inf[2], inf[3], 1, inf[4], inf[5]); }); + dropdown3.change(function () { + var e3 = document.getElementById("d3"); + var name3 = e3.options[e3.selectedIndex].text; + console.log(name3 + " name3") + console.log(model.currentInfo['recipe'][name3]); + model.dataChange(model.currentInfo['recipe'][name3]); + model.numRowsChange(model.currentInfo['recipe'][name3].length); + buildTable(); + buildDisplay(); + graph(); + + + + }) + dropdownDiv.append(dropdown1, dropdown2); - $(".span9").prepend(dropdownDiv); + tabPaneActive.prepend(dropdown3); + $(".span12").prepend(dropdownDiv); } /* @@ -414,14 +506,14 @@ var importRecipes=function(){ */ var buildDisplay = function () { if (model.currentInfo["OKToGraph"]) { - div.append("
"); + div.append("
"); var switches = $('
'); div.append(switches); switches.change(function () { - + graph(false, $('.mytog:checked').attr('id')); }); - + $(".span3").append(displayDiv); $("#startModal").modal("show"); @@ -443,12 +535,12 @@ var importRecipes=function(){ var toC = function (F) { return ((5 / 9) * (F - 32)); } - - + + var buildTable = function (inpTable) { var timeStep = model.timeStep; - var len = model.currentInfo["data"].length||1000; + var len = model.currentInfo["data"].length || 1000; var newData = [] var sumtime = 0; for (var i = 0; i < model.currentInfo["numRows"]; i++) { @@ -473,8 +565,8 @@ var importRecipes=function(){ var step2Col = $(""); step2Col.append(inp2); step1Col.append(flipButton); - - closeButton.on("click", function () { + + closeButton.on("click", function () { var rowNum = String($(this).attr("id").charAt(3)) //NOW WE'RE REMOVING THE ROW WITH THE X NEXT TO IT $("#row" + rowNum).remove(); @@ -494,11 +586,11 @@ var importRecipes=function(){ $("inp1_" + l).attr("id", String("inp1_" + parseInt(l - 1))); $("#row" + l + "side2").attr("id", String("row" + parseInt(l - 1) + "side2")); $("#inp2_" + l).attr("id", String("inp2_" + parseInt(l - 1))); - $("#addButton"+l).attr("id", String("addButton"+parseInt(l-1))); + $("#addButton" + l).attr("id", String("addButton" + parseInt(l - 1))); } }); - + row.append(duration, step1Col, step2Col); inputTable.append(row); if (i == model.currentInfo["numRows"] - 1) { @@ -523,28 +615,26 @@ var importRecipes=function(){ var inf = model.currentInfo['recipe'][name2]; drawFinished(inf[0], inf[1], inf[2], inf[3], 0); }) - + cookButt.on("click", function () { - if($("#recipeInput").closest(".tab-pane").hasClass("active")) - { + if ($("#recipeInput").closest(".tab-pane").hasClass("active")) { var recipeString = $("#recipeInput").val(); model.parseRecipe(recipeString); - } - else{ + } else { model.checkDiv(); updateTime(); model.buildData(); - - if (clicked && model.currentInfo["OKToGraph"]) { - graph(false, $('.mytog:checked').attr('id')) - } else { - d3.selectAll(".containers").remove(); - d3.selectAll(".mysteak").remove(); - model.dataClear(); + + if (clicked && model.currentInfo["OKToGraph"]) { + graph(false, $('.mytog:checked').attr('id')) + } else { + d3.selectAll(".containers").remove(); + d3.selectAll(".mysteak").remove(); + model.dataClear(); + } } - } }) $(".inputTable").append(addButton); //, saveBut,saveModal); @@ -557,7 +647,7 @@ var importRecipes=function(){ sumtime += parseFloat(time[k]); } - if (len == 0||len==1000) { + if (len == 0 || len == 1000) { inp1.val(180); inp2.val(23); @@ -590,82 +680,82 @@ var importRecipes=function(){ var addRow = function (table) { - var i = parseInt(model.currentInfo["numRows"])-1; - console.log(i+"i"); - var row = $(""); - - var durationi= $(""); - var rowitime=$(""); - durationi.append(rowitime); - - var rowiside1=$(""); - var inp1_i=$(""); - var flipButtoni=$(""); - rowiside1.append(inp1_i, flipButtoni); - - var rowiside2=$(""); - var inp2_i=$(""); - var rowibutton=$("") - rowiside2.append(inp2_i, rowibutton); - - rowibutton.on("click", function(){ - var rowNum = String($(this).attr("id").charAt(3)) - //NOW WE'RE REMOVING THE ROW WITH THE X NEXT TO IT - row.remove(); - //REDUCING THE NUMBER OF EXPECTED ROWS - model.numRowsMinus(); - console.log("closed" + model.currentInfo["numRows"]); - //NOW WE NEED TO CHANGE THE ROW NUMBER OF ALL THE OTHER ROWS - for (var l = i + 1; l < model.currentInfo["numRows"] + 1; l++) { - console.log("we're in the closeRow loop " + l); - console.log($("#row" + l).attr("id") + "id"); - console.log(String("row" + parseInt(l - 1))) - $("#row" + l).attr("id", String("row" + parseInt(l - 1))); - $("#row" + l + "time").attr("id", String("row" + parseInt(l - 1) + "time")) - $("#row" + l + "button").attr("id", String("row" + parseInt(l - 1) + "button")) - $("#duration" + l).attr("id", String("duration" + parseInt(l - 1))); - $("#row" + l + "side1").attr("id", String("row" + parseInt(l - 1) + "side1")); - $("inp1_" + l).attr("id", String("inp1_" + parseInt(l - 1))); - $("#row" + l + "side2").attr("id", String("row" + parseInt(l - 1) + "side2")); - $("#inp2_" + l).attr("id", String("inp2_" + parseInt(l - 1))); - $("#addButton"+l).attr("id", String("addButton"+parseInt(l-1))); - } - }) - - row.append(durationi, rowiside1, rowiside2); - - var addButton=$(""); - addButton.on("click", function () { - addButton.remove(); + var i = parseInt(model.currentInfo["numRows"]) - 1; + console.log(i + "i"); + var row = $(""); + + var durationi = $(""); + var rowitime = $(""); + durationi.append(rowitime); + + var rowiside1 = $(""); + var inp1_i = $(""); + var flipButtoni = $(""); + rowiside1.append(inp1_i, flipButtoni); + + var rowiside2 = $(""); + var inp2_i = $(""); + var rowibutton = $("") + rowiside2.append(inp2_i, rowibutton); + + rowibutton.on("click", function () { + var rowNum = String($(this).attr("id").charAt(3)) + //NOW WE'RE REMOVING THE ROW WITH THE X NEXT TO IT + row.remove(); + //REDUCING THE NUMBER OF EXPECTED ROWS + model.numRowsMinus(); + console.log("closed" + model.currentInfo["numRows"]); + //NOW WE NEED TO CHANGE THE ROW NUMBER OF ALL THE OTHER ROWS + for (var l = i + 1; l < model.currentInfo["numRows"] + 1; l++) { + console.log("we're in the closeRow loop " + l); + console.log($("#row" + l).attr("id") + "id"); + console.log(String("row" + parseInt(l - 1))) + $("#row" + l).attr("id", String("row" + parseInt(l - 1))); + $("#row" + l + "time").attr("id", String("row" + parseInt(l - 1) + "time")) + $("#row" + l + "button").attr("id", String("row" + parseInt(l - 1) + "button")) + $("#duration" + l).attr("id", String("duration" + parseInt(l - 1))); + $("#row" + l + "side1").attr("id", String("row" + parseInt(l - 1) + "side1")); + $("inp1_" + l).attr("id", String("inp1_" + parseInt(l - 1))); + $("#row" + l + "side2").attr("id", String("row" + parseInt(l - 1) + "side2")); + $("#inp2_" + l).attr("id", String("inp2_" + parseInt(l - 1))); + $("#addButton" + l).attr("id", String("addButton" + parseInt(l - 1))); + } + }) + + row.append(durationi, rowiside1, rowiside2); + + var addButton = $(""); + addButton.on("click", function () { + addButton.remove(); model.buildData(); model.numRowsPlus(); console.log("just added a row" + model.currentInfo['numRows']); addRow($(".inputTable")); }); - - inputTable.append(addButton); - - table.append(row); - - if (i==0){ - rowitime.val("4:00"); - inp1_i.val(180); - inp2_i.val(23) - }else{ - - rowitime.val("4:00"); - inp1_i.val($(String("#inp1_"+parseInt(i-1))).val()); - inp2_i.val($(String("#inp2_"+parseInt(i-1))).val()); - } + + inputTable.append(addButton); + + table.append(row); + + if (i == 0) { + rowitime.val("4:00"); + inp1_i.val(23); + inp2_i.val(180) + } else { + + rowitime.val("4:00"); + inp1_i.val($(String("#inp1_" + parseInt(i - 1))).val() || 23); + inp2_i.val($(String("#inp2_" + parseInt(i - 1))).val() || 180); + } } var addButtonFun = function () { addButton.on("click", function () { - addButton.remove(); + addButton.remove(); model.buildData(); model.numRowsPlus(); addRow($(".inputTable")); - $('#table').stop().animate({ + $('#table').stop().animate({ scrollTop: $("#table")[0].scrollHeight }, 800); @@ -692,9 +782,13 @@ var importRecipes=function(){ }); } - - var graph = function (isFirst, falseColor) { + + var loadRecipe=function(recipe){ + } + + var graph = function (isFirst, falseColor) { + d3.selectAll(".mysteak").remove(); d3.selectAll(".containers").remove(); model.dataClear(); @@ -746,7 +840,7 @@ var importRecipes=function(){ //add to on click and calculate(blah,blah,blah, meatType) var meatType = $("input[type='radio'][name='meat']:checked").attr('id'); - + if (falseColor == 'T') { meatType = 'False'; @@ -755,13 +849,15 @@ var importRecipes=function(){ if (OKtoCook == true) { var steak = [model.currentInfo["data"][0][1]]; for (var m = 0; m < parseFloat($("#thicknessInp").val()) * 10; m++) { - if($('.mytog2:checked').attr('id')=='C'){ - steak.push(parseFloat($("#steakTemp").val()))} - else{steak.push(toC(parseFloat($("#steakTemp").val())))} + if ($('.mytog2:checked').attr('id') == 'C') { + steak.push(parseFloat($("#steakTemp").val())) + } else { + steak.push(toC(parseFloat($("#steakTemp").val()))) + } } steak.push(model.currentInfo["data"][0][2]); - - calculate(model.currentInfo["data"], steak, meatType, isFirst, model.currentInfo["totalTime"],$('.mytog2:checked').attr('id')) + + calculate(model.currentInfo["data"], steak, meatType, isFirst, model.currentInfo["totalTime"], $('.mytog2:checked').attr('id')) } } var CookButtonFun = function () { @@ -823,7 +919,7 @@ var importRecipes=function(){ view.buildDisplay(); - /* $('.inputTable').offset({ + /* $('.inputTable').offset({ top: 1030 });*/