#template-new-quantity-container, .jq-tin-square, #new-quantities table, .remove-ingredient, #scale-tag { display:none; } .row { clear:both; } .calc { overflow:hidden; padding:20px 30px; font:13px sans-serif; width:630px; background:#ffd8d8; } .calc img { float:right; } .calc input, .calc select, .calc button { border:1px solid #8b5074; margin:0 20px 10px 0; padding:3px; } .calc input[type=radio] { margin-right:5px; margin-left: 15px; padding:0; } .calc input[type=text] { width: 50px; } .calc input[type=text].jq-ingredient-name { width:130px; } .calc label { margin-right: 10px; } .calc button { background:#8b5074; color:white; padding:5px; } .calc button:hover { background:#fff; color:#8b5074; border-color:#8b5074; cursor:pointer; } .calc .remove-ingredient { background:#ffd8d8; color:white; padding:5px; } .calc .jq-tin-params, .calc .jq-unit { float:left; margin-top:10px; } .calc .jq-ingredient-name-label { width:80px; display:inline-block } .calc .intro { display:block; clear:both; overflow:hidden; padding:0 0 0 10px; } .calc h4 { font:italic 36px georgia, serif; margin:0 0 10px 0; color:#8b5074; } .calc h3 { font:italic 42px georgia, serif; margin:15px 0 0 0; color:#8b5074; } .calc p { font:18px georgia, serif; color:#8b5074; margin:0; } .calc #new-quantities table { font:18px georgia, serif; color:#8b5074; } .calc #new-quantities table th { font-weight:bold; color:#444; text-align:left; } .calc #new-quantities table td { color:#8b5074; min-width:200px; } .calc .jq-container { background:#ffebeb; display:block; clar:both; overflow:hidden; padding:10px 20px; margin-bottom:10px; } .calc .jq-entity { clear:both; } $(document).ready(function(){ $("#add-ingredient").click(function() { var el = getNewIngredientElement(); var index = $(".jq-ingredient").length + 1; el.find(".jq-ingredient-name-label").html("Ingredient " + index + ":"); el.find(".jq-ingredient-name").val(""); el.find(".jq-ingredient-qty").val(""); el.insertAfter(".jq-ingredient:last"); el.find(".remove-ingredient").show(); }); $(".remove-ingredient").live("click", function() { $(this).closest(".jq-ingredient").remove(); var ingredients = $(".jq-ingredient"); for (var i = 0; i < ingredients.length; i++) { $(ingredients[i]).find(".jq-ingredient-name-label").html("Ingredient " + (i+1) + ":"); } }); $("input[type='radio']").change(function(){ var val = $(this).val(); var parent = $(this).closest(".jq-entity"); parent.find(".jq-tin-params").hide(); parent.find(".jq-tin-" + val).fadeIn(100); }); $('input[type="text"]').live("keyup", refresh); $("#add-ingredient").click(refresh); $(".remove-ingredient").live("click", refresh); $('select').live("change", refresh); }); function refresh() { $("#new-quantities").find("table").hide(); $("#new-quantities").find("p").show(); $("#new-quantities").find("tbody tr").not("#template-new-quantity-container").remove(); var ratio = getRatio(); if (typeof ratio == "undefined" || isNaN(ratio) || !isFinite(ratio) || ratio == "") { $("#scale-tag").hide(); } else { $("#scale-tag").show(); $("#scale").html(new Number(ratio).toFixed(1)); } $(".jq-ingredient").each(function() { var tr = getNewQuantityTableRowElement(); tr.find(".jq-ingredient-name").html($(this).find(".jq-ingredient-name").val()); var newQuantity = $(this).find(".jq-ingredient-qty").val() * getRatio(); if (isNaN(newQuantity) && !isFinite(newQuantity)) return; if (newQuantity == 0) return; newQuantity = new Number(newQuantity).toFixed(1); tr.find(".jq-ingredient-qty").html(newQuantity + " " + $(this).find(".jq-ingredient-unit option:selected").html()); $("#new-quantities").find("tbody").append(tr); $("#new-quantities").find("table").show(); $("#new-quantities").find("p").hide(); }); } function getRatio() { return getVolumeInCC("new") / getVolumeInCC("existing"); } function getVolumeInCC(newOrExisting) { var container = $("#" + newOrExisting + "-tin"); var val = container.find("input:checked").val(); if ( val == "round" ) { var diameter = getDimensionInCM(newOrExisting, "diameter"); var height = getDimensionInCM(newOrExisting, "height"); var volume = Math.pow(diameter/2, 2) * Math.PI * height; return volume; } else { var width = getDimensionInCM(newOrExisting, "width"); var l = getDimensionInCM(newOrExisting, "length"); var depth = getDimensionInCM(newOrExisting, "depth"); var volume = width * l * depth; return volume; } } function getDimensionInCM(newOrExisting, dimension) { var container = $("#" + newOrExisting + "-tin"); var unit = container.find(".jq-unit").val(); var coeff = 2.54; if (unit == "cm") { return container.find(".jq-" + dimension).val(); } else { var inches = container.find(".jq-" + dimension).val(); return inches * 2.54; } } function getNewIngredientElement() { return $("#template-ingredient").clone().removeAttr("id"); } function getNewQuantityTableRowElement() { return $("#template-new-quantity-container").clone().removeAttr("id").show(); } #t# The CakeOmeter Making baking tin conversion a breeze! Existing Recipe Ingredient 1: Quantity: each ml litre fl/oz pint quart cup teaspoon tablespoon gram kg oz lb X Add Ingredient Existing Baking Tin Type: Round Square Diameter: Height: Width: Length: Height: cm inches New Baking Tin (scaled times) Type: Round Square Diameter: Height: Width: Length: Height: cm inches New Recipe Your new recipe will appear here automatically! Ingredient Quantity [amazon bestseller="baking tin"]