﻿<!-- declaration of global variables-->


    
$(document).ready(function() {
    var activity=0;
    var value;
    var testValue;
    var changedValue;
    var activityStatus=0;
    var emissionValue; //emissionsvärde. Ska kunna ändras av vätterhem
    var waterCost; //vattenkostnad per kubikmeter
    var electricityPrice; //elpris. Ska kunna ändras av vätterhem
    electricityPrice = $('#electricityPrice').text();
    emissionValue = $('#emissionValue').text();
    waterCost = $('#waterPrice').text();
    
    //gör om 1,25 till 1.25 - byter ut komma från EpiServer float format till javascript-format
    var elPrice = electricityPrice.split(",");
    electricityPrice = parseFloat((elPrice[0] + "." + elPrice[1]));
    
    var emValue = emissionValue.split(",");
    emissionValue = parseFloat((emValue[0] + "." + emValue[1]));
    
    var wCost = waterCost.split(",");
    waterCost = parseFloat((wCost[0] + "." + wCost[1]));
     
    //dusch
    $('#activity1').click(function () {
          
          $('#mainValue').replaceWith('<h2 id="mainValue">10</h2>');
          //ändrar inputvärdet om man tryckt pil upp eller ner. Om activiteten är nystartad så ges ett startvärde
          if (activity==1)            
               {
               $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>'); //ändrade värdet sätts
               }
          else
               {
               $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ 5 +'</h2>'); //startvärde sätts
               }
          
          activity=1;
          //visar rätt informationsbox
          $('#info1').show();
          $('#info2').hide();
          $('#info3').hide();
          $('#info4').hide();
          $('#info5').hide();
          $('#info6').hide();
          
          var mainValueInput = $('#mainValue').text(); //tid man duschar
          var mainWater = (mainValueInput*12); //12 liter vatten per min dusch
          var mainEnergy = (mainValueInput*(37*12)/1000); //energiförbrukning 37Wh för 40gradigt vatten
          var mainCO2 = (emissionValue*mainEnergy);
          var mainPrice = (waterCost*mainWater/1000);
          changedValue = $('#changeInput').text();
          
          $('#calculatorHeader').replaceWith('<span id="calculatorHeader">Om du <b>duschar</b> i</span>');
          $('#activityLabel').replaceWith('<p id="activityLabel" class="right">minuter, blir din <b>förbrukning</b></p>');
          $('#waterbox').show();
          $('#changeWaterBox').show();
          $('#changeWaterBoxTotal').show();
          $('#totaldiv').attr('style', 'width: 500px');
          
          $('#CO2Title').replaceWith('<p id="CO2Title" class="left">CO<sub>2</sub> (g)</p>');
          
          $('#mainPris').replaceWith('<h2 id="mainPris" class="valueMainBox">' + mainPrice.toFixed(2) + '</h2>');
          $('#mainEnergy').replaceWith('<h2 id="mainEnergy" class="valueMainBox">' + mainEnergy.toFixed(2) + '</h2>');
          $('#mainCO2').replaceWith('<h2 id="mainCO2" class="valueMainBox">' + mainCO2.toFixed(0) + '</h2>');
          $('#mainWater').replaceWith('<h2 id="mainWater" class="valueMainBox">' + mainWater.toFixed(0) + '</h2>');
          
          // besparingar, minskar du X så sparar du Y osv          
          $('#changeInputTitel').replaceWith('<p id="changeInputTitel" class="left"><b>Minskar</b> du duschtiden med</p>');
          $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">' + changedValue + '</h2>');
          $('#changeInputLabel').replaceWith('<p id="changeInputLabel" class="right">minuter, <b>sparar</b> du</p>');
          
          var changedRatio = ($('#changeInput').text()/$('#mainValue').text());
          
          //titeltexter changed values
          $('#changeTitel').replaceWith('<h3 id="changeTitel">Besparing per tillfälle</h3>');//
          $('#changeTitelPrice').replaceWith('<p id="changeTitelPrice" class="left">Kostnad (kr)<sub> </sub></p>');//
          $('#changeTitelEnergy').replaceWith('<p id="changeTitelEnergy" class="left">Energi (kWh)<sub> </sub></p>');//
          $('#changeTitelCO2').replaceWith('<p id="changeTitelCO2" class="left">CO<sub>2</sub> (g)</p>');//
          $('#changeTitelWater').replaceWith('<p id="changeTitelWater" class="left">Vatten (l)<sub> </sub></p>');//
                  
          //changed values
          $('#changePrice').replaceWith('<h2 id="changePrice">' + (changedRatio*mainPrice).toFixed(2) + '</h2>'); //+
          $('#changeEnergy').replaceWith('<h2 id="changeEnergy">' + (changedRatio*mainEnergy).toFixed(2) + '</h2>'); //+
          $('#changeCO2').replaceWith('<h2 id="changeCO2">' + (changedRatio*mainCO2).toFixed(0)+ '</h2>');//+
          $('#changeWater').replaceWith('<h2 id="changeWater">' + (changedRatio*mainWater).toFixed(0) + '</h2>');//+
          
          //titeltexter changed values (totalt per år)
          $('#changeTitelTotal').replaceWith('<h3 id="changeTitelTotal">Besparing per år (beräknat på 365 duschtillfällen)</h3>');
          $('#changeTitelPriceTotal').replaceWith('<p id="changeTitelPriceTotal" class="left">Kostnad (kr)</p>');
          $('#changeTitelEnergyTotal').replaceWith('<p id="changeTitelEnergyTotal" class="left">Energi (kWh)<sub> </sub></p>');
          $('#changeTitelCO2Total').replaceWith('<p id="changeTitelCO2Total" class="left">CO<sub>2</sub> (kg)</p>');
          $('#changeTitelWaterTotal').replaceWith('<p id="changeTitelWaterTotal" class="left" style="margin-top:2px;">Vatten (m<sup style="font-size:10px;">3</sup>)<sub> </sub></p>');
                    
          //changed values (totalt per år)
          $('#changePriceTotal').replaceWith('<h2 id="changePriceTotal">' + (365*changedRatio*mainPrice).toFixed(0) + '</h2>');
          $('#changeEnergyTotal').replaceWith('<h2 id="changeEnergyTotal">' + (365*changedRatio*mainEnergy).toFixed(0) + '</h2>');
          $('#changeCO2Total').replaceWith('<h2 id="changeCO2Total">' + (0.365*changedRatio*mainCO2).toFixed(1)+ '</h2>');
          $('#changeWaterTotal').replaceWith('<h2  id="changeWaterTotal">' + (0.365*changedRatio*mainWater).toFixed(1) + '</h2>');
          
          //energi/vattensymbol sätts
          $('#activitySymbol').replaceWith('<span id="activitySymbol" class="symbol"><img src="/vatterhem/Pages/MyPages/Vattersnurran/Images/vattendroppe.png" /></span>');
          $('#activitySymbol2').replaceWith('<span id="activitySymbol2" class="symbol"><img src="/vatterhem/Pages/MyPages/Vattersnurran/Images/vattendroppe.png" /></span>');
          
          
    });
    
    //handdisk
     $('#activity2').click(function () {
          
          $('#mainValue').replaceWith('<h2 id="mainValue">5</h2>');
          
          
          //ändrar inputvärdet om man tryckt pil upp eller ner. Om activiteten är nystartad så ges ett startvärde
          if (activity==2)            
               {
               $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>'); //ändrade värdet sätts
               }
          else
               {
               $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ 3 +'</h2>'); //startvärde sätts
               }
               
          activity=2;
          
          //visar rätt informationsbox
          $('#info1').hide();
          $('#info2').show();
          $('#info3').hide();
          $('#info4').hide();
          $('#info5').hide();
          $('#info6').hide();
          
          var mainValueInput = $('#mainValue').text(); //tid man duschar
          var mainWater = (mainValueInput*12); //12 liter vatten per min dusch
          var mainEnergy = (mainValueInput*(50*12)/1000); //energiförbrukning 50Wh för 45gradigt vatten
          var mainCO2 = (emissionValue*mainEnergy);
          var mainPrice = (waterCost*mainWater/1000);
          changedValue = $('#changeInput').text();
          
          $('#calculatorHeader').replaceWith('<span id="calculatorHeader">Om du <b>handdiskar</b> i</span>');
          $('#activityLabel').replaceWith('<p id="activityLabel" class="right">minuter, blir din <b>förbrukning</b></p>');
          $('#waterbox').show();
          $('#changeWaterBox').show();
          $('#changeWaterBoxTotal').show();
          $('#totaldiv').attr('style', 'width: 500px');
          
          $('#CO2Title').replaceWith('<p id="CO2Title" class="left">CO<sub>2</sub> (g)</p>');
          
          $('#mainPris').replaceWith('<h2 id="mainPris" class="valueMainBox">' + mainPrice.toFixed(2) + '</h2>');
          $('#mainEnergy').replaceWith('<h2 id="mainEnergy" class="valueMainBox">' + mainEnergy.toFixed(2) + '</h2>');
          $('#mainCO2').replaceWith('<h2 id="mainCO2" class="valueMainBox">' + mainCO2.toFixed(0) + '</h2>');
          $('#mainWater').replaceWith('<h2 id="mainWater" class="valueMainBox">' + mainWater.toFixed(0) + '</h2>');
          
          // besparingar, minskar du X så sparar du Y osv
          $('#changeInputTitel').replaceWith('<p id="changeInputTitel" class="left">Om du <b>minskar</b> disktiden med</p>');
          $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">' + changedValue + '</h2>');
          $('#changeInputLabel').replaceWith('<p id="changeInputLabel" class="right">minuter, <b>sparar</b> du</p>');
          
          var changedRatio = ($('#changeInput').text()/$('#mainValue').text());
          
          //titeltexter changed values
          $('#changeTitel').replaceWith('<h3 id="changeTitel">Besparing per tillfälle</h3>');//
          $('#changeTitelPrice').replaceWith('<p id="changeTitelPrice" class="left">Kostnad (kr)<sub> </sub></p>');//
          $('#changeTitelEnergy').replaceWith('<p id="changeTitelEnergy" class="left">Energi (kWh)<sub> </sub></p>');//
          $('#changeTitelCO2').replaceWith('<p id="changeTitelCO2" class="left">CO<sub>2</sub> (g)</p>');//
          $('#changeTitelWater').replaceWith('<p id="changeTitelWater" class="left">Vatten (l)<sub> </sub></p>');//
          
          
          //changed values
          $('#changePrice').replaceWith('<h2 id="changePrice">' + (changedRatio*mainPrice).toFixed(2) + '</h2>'); //+
          $('#changeEnergy').replaceWith('<h2 id="changeEnergy">' + (changedRatio*mainEnergy).toFixed(2) + '</h2>'); //+
          $('#changeCO2').replaceWith('<h2 id="changeCO2">' + (changedRatio*mainCO2).toFixed(0)+ '</h2>');//+
          $('#changeWater').replaceWith('<h2 id="changeWater">' + (changedRatio*mainWater).toFixed(0) + '</h2>');//+
          
          //titeltexter changed values (totalt per år)
          $('#changeTitelTotal').replaceWith('<h3 id="changeTitelTotal">Besparing per år (beräknat på 365 disktillfällen)</h3>');
          $('#changeTitelPriceTotal').replaceWith('<p id="changeTitelPriceTotal" class="left">Kostnad (kr)</p>');
          $('#changeTitelEnergyTotal').replaceWith('<p id="changeTitelEnergyTotal" class="left">Energi (kWh)<sub> </sub></p>');
          $('#changeTitelCO2Total').replaceWith('<p id="changeTitelCO2Total" class="left">CO<sub>2</sub> (kg)</p>');
          $('#changeTitelWaterTotal').replaceWith('<p id="changeTitelWaterTotal" class="left" style="margin-top:2px;">Vatten (m<sup style="font-size:10px;">3</sup>)<sub> </sub></p>');
                    
          //changed values (totalt per år)
          $('#changePriceTotal').replaceWith('<h2 id="changePriceTotal">' + (365*changedRatio*mainPrice).toFixed(0) + '</h2>');
          $('#changeEnergyTotal').replaceWith('<h2 id="changeEnergyTotal">' + (365*changedRatio*mainEnergy).toFixed(0) + '</h2>');
          $('#changeCO2Total').replaceWith('<h2 id="changeCO2Total">' + (0.365*changedRatio*mainCO2).toFixed(1)+ '</h2>');
          $('#changeWaterTotal').replaceWith('<h2  id="changeWaterTotal">' + (0.365*changedRatio*mainWater).toFixed(1) + '</h2>');
        
          
          //energi/vattensymbol sätts
          $('#activitySymbol').replaceWith('<span id="activitySymbol" class="symbol"><img src="/vatterhem/Pages/MyPages/Vattersnurran/Images/vattendroppe.png" /></span>');
          $('#activitySymbol2').replaceWith('<span id="activitySymbol2" class="symbol"><img src="/vatterhem/Pages/MyPages/Vattersnurran/Images/vattendroppe.png" /></span>');
          
    });

    //kran
    $('#activity3').click(function () {
                    
          $('#mainValue').replaceWith('<h2 id="mainValue">1</h2>');
          
          if (activity==3)            
               {
               $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>'); //ändrade värdet sätts
               }
          else
               {
               $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ 3 +'</h2>'); //startvärde sätts
               }
          activity=3;
                    
          //visar rätt informationsbox
          $('#info1').hide();
          $('#info2').hide();
          $('#info3').show();
          $('#info4').hide();
          $('#info5').hide();
          $('#info6').hide();
          
          var mainValueInput = $('#mainValue').text(); //tid man duschar
          var mainWater = 5000; //redan uträknad förbrukn under 1 år från kalkylblad (liter)
          var mainEnergy = (50*mainWater)/1000; //energiförbrukning 50Wh för 45gradigt vatten
          var mainCO2 = (emissionValue*mainEnergy/1000); // /1000 då värdet ska skrivas i kg ist f. g
          var mainPrice = (waterCost*mainWater/1000);
          changedValue = $('#changeInput').text();
          
          $('#calculatorHeader').replaceWith('<span id="calculatorHeader">Droppande <b>vattenkran</b> i</span>');
          $('#activityLabel').replaceWith('<p id="activityLabel" class="right">år ger <b>förbrukningen</b></p>');
          $('#waterbox').show();
          $('#changeWaterBox').show();
          $('#changeWaterBoxTotal').show();
          $('#totaldiv').attr('style', 'width: 500px');

          $('#CO2Title').replaceWith('<p id="CO2Title" class="left">CO<sub>2</sub> (kg)</p>');
          
          $('#mainPris').replaceWith('<h2 id="mainPris" class="valueMainBox">' + mainPrice.toFixed(0) + '</h2>');
          $('#mainEnergy').replaceWith('<h2 id="mainEnergy" class="valueMainBox">' + mainEnergy.toFixed(0) + '</h2>');
          $('#mainCO2').replaceWith('<h2 id="mainCO2" class="valueMainBox">' + mainCO2.toFixed(1) + '</h2>');
          $('#mainWater').replaceWith('<h2 id="mainWater" class="valueMainBox">' + mainWater.toFixed(0) + '</h2>');
          
          // besparingar, minskar du X så sparar du Y osv
          $('#changeInputTitel').replaceWith('<p id="changeInputTitel" class="left">Om du lagar kranen <b>sparar</b> du på</p>');
          $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">' + changedValue + '</h2>');
          $('#changeInputLabel').replaceWith('<p id="changeInputLabel" class="right">månader</p>');
          
          var changedRatio = ($('#changeInput').text()/12);
          changedValue = $('#changeInput').text();
           
          //titeltexter changed values
          $('#changeTitel').replaceWith('<h3 id="changeTitel">Besparing per månad</h3>');//
          $('#changeTitelPrice').replaceWith('<p id="changeTitelPrice" class="left">Kostnad (kr)<sub> </sub></p>');//
          $('#changeTitelEnergy').replaceWith('<p id="changeTitelEnergy" class="left">Energi (kWh)<sub> </sub></p>');//
          $('#changeTitelCO2').replaceWith('<p id="changeTitelCO2" class="left">CO<sub>2</sub> (kg)</p>');//
          $('#changeTitelWater').replaceWith('<p id="changeTitelWater" class="left">Vatten (l)<sub> </sub></p>');//
          
          //changed values
          $('#changePrice').replaceWith('<h2 id="changePrice">' + (mainPrice/12).toFixed(2) + '</h2>'); //+
          $('#changeEnergy').replaceWith('<h2 id="changeEnergy">' + (mainEnergy/12).toFixed(2) + '</h2>'); //+
          $('#changeCO2').replaceWith('<h2 id="changeCO2">' + (mainCO2/12).toFixed(1)+ '</h2>');//+
          $('#changeWater').replaceWith('<h2 id="changeWater">' + (mainWater/12).toFixed(0) + '</h2>');//+
          
          //titeltexter changed values (totalt per år)
          $('#changeTitelTotal').replaceWith('<h3 id="changeTitelTotal">Besparing under '+ $('#changeInput').text() +' mån</h3>');
          $('#changeTitelPriceTotal').replaceWith('<p id="changeTitelPriceTotal" class="left">Kostnad (kr)</p>');
          $('#changeTitelEnergyTotal').replaceWith('<p id="changeTitelEnergyTotal" class="left">Energi (kWh)<sub> </sub></p>');
          $('#changeTitelCO2Total').replaceWith('<p id="changeTitelCO2Total" class="left">CO<sub>2</sub> (kg)</p>');
          $('#changeTitelWaterTotal').replaceWith('<p id="changeTitelWaterTotal" class="left" style="margin-top:2px;">Vatten (m<sup style="font-size:10px;">3</sup>)<sub> </sub></p>');
                    
          //changed values (per totala antalet månader valt)
          $('#changePriceTotal').replaceWith('<h2 id="changePriceTotal">' + (changedRatio*mainPrice).toFixed(0) + '</h2>');
          $('#changeEnergyTotal').replaceWith('<h2 id="changeEnergyTotal">' + (changedRatio*mainEnergy).toFixed(0) + '</h2>');
          $('#changeCO2Total').replaceWith('<h2 id="changeCO2Total">' + (changedRatio*mainCO2).toFixed(1)+ '</h2>');
          $('#changeWaterTotal').replaceWith('<h2  id="changeWaterTotal">' + (changedRatio*mainWater).toFixed(0) + '</h2>');
    
          //energi/vattensymbol sätts
          $('#activitySymbol').replaceWith('<span id="activitySymbol" class="symbol"><img src="/vatterhem/Pages/MyPages/Vattersnurran/Images/vattendroppe.png" /></span>');
          $('#activitySymbol2').replaceWith('<span id="activitySymbol2" class="symbol"><img src="/vatterhem/Pages/MyPages/Vattersnurran/Images/vattendroppe.png" /></span>');
         
    });
    
    //tvätt
    $('#activity4').click(function () {
        
          $('#mainValue').replaceWith('<h2 id="mainValue">4</h2>');
           if (activity==4)            
               {
               $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>'); //ändrade värdet sätts
               }
          else
               {
               $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ 2 +'</h2>'); //startvärde sätts
               }
               
          activity=4;
                    
          //visar rätt informationsbox
          $('#info1').hide();
          $('#info2').hide();
          $('#info3').hide();
          $('#info4').show();
          $('#info5').hide();
          $('#info6').hide();
          
          changedValue = $('#changeInput').text();
          
          var mainValueInput = $('#mainValue').text(); //tid man duschar
          var mainEnergy = (mainValueInput*2); //energiförbrukning 2000W maskin drar 2kWh per timme
          var mainCO2 = (emissionValue*mainEnergy); // /1000 då värdet ska skrivas i kg ist f. g
          var mainPrice = (mainEnergy*electricityPrice);
          
          $('#calculatorHeader').replaceWith('<span id="calculatorHeader">Om du <b>tvättar</b></span>');
          $('#activityLabel').replaceWith('<p id="activityLabel" class="right">timmar <b>förbrukar</b> du</p>');
          $('#waterbox').hide();
          $('#changeWaterBox').hide();
          $('#changeWaterBoxTotal').hide();
          $('#totaldiv').attr('style', 'width: 400px');
          
          $('#CO2Title').replaceWith('<p id="CO2Title" class="left">CO<sub>2</sub> (g)</p>');
          
          $('#mainPris').replaceWith('<h2 id="mainPris" class="valueMainBox">' + mainPrice.toFixed(0) + '</h2>');
          $('#mainEnergy').replaceWith('<h2 id="mainEnergy" class="valueMainBox">' + mainEnergy.toFixed(0) + '</h2>');
          $('#mainCO2').replaceWith('<h2 id="mainCO2" class="valueMainBox">' + mainCO2.toFixed(0) + '</h2>');

          //energi/vattensymbol sätts
          $('#activitySymbol').replaceWith('<span id="activitySymbol" class="symbol"><img src="/vatterhem/Pages/MyPages/Vattersnurran/Images/stickpropp.png" /></span>');
          $('#activitySymbol2').replaceWith('<span id="activitySymbol2" class="symbol"><img src="/vatterhem/Pages/MyPages/Vattersnurran/Images/stickpropp.png" /></span>');
          
          
          $('#CO2Title').replaceWith('<p id="CO2Title" class="left">CO<sub>2</sub> (kg)</p>');
          
          // besparingar, minskar du X så sparar du Y osv
          $('#changeInputTitel').replaceWith('<p id="changeInputTitel" class="left">Om du minskar din tvättid med</p>');
          $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">' + changedValue + '</h2>');
          $('#changeInputLabel').replaceWith('<p id="changeInputLabel" class="right">timmar per månad, <b>sparar</b> du</p>');
          
          changedValue = $('#changeInput').text();
          var mainEnergy = (changedValue*2); //energiförbrukning 2000W maskin drar 2kWh per timme
          var mainCO2 = (emissionValue*mainEnergy); // /1000 då värdet ska skrivas i kg ist f. g
          var mainPrice = (mainEnergy*electricityPrice);
          
          
          if (mainCO2>1000)
          {
          $('#changeCO2').replaceWith('<h2 id="changeCO2">' + (mainCO2/1000).toFixed(1) + '</h2>');
          $('#changeTitelCO2').replaceWith('<p id="changeTitelCO2" class="left">CO<sub>2</sub> (kg)</p>');//
          }
          else
          {
          $('#changeCO2').replaceWith('<h2 id="changeCO2">' + (mainCO2).toFixed(0) + '</h2>');
          $('#changeTitelCO2').replaceWith('<p id="changeTitelCO2" class="left">CO<sub>2</sub> (g)</p>');//
          }
          //titeltexter changed values
          $('#changeTitel').replaceWith('<h3 id="changeTitel">Besparing per månad</h3>');//
          $('#changeTitelPrice').replaceWith('<p id="changeTitelPrice" class="left">Kostnad (kr)<sub> </sub></p>');//
          $('#changeTitelEnergy').replaceWith('<p id="changeTitelEnergy" class="left">Energi (kWh)<sub> </sub></p>');//
          
          $('#changeTitelWater').replaceWith('<p id="changeTitelWater" class="left">Vatten (l)<sub> </sub></p>');//
          
          //changed values
          $('#changePrice').replaceWith('<h2 id="changePrice">' + (mainPrice).toFixed(2) + '</h2>'); //+
          $('#changeEnergy').replaceWith('<h2 id="changeEnergy">' + (mainEnergy).toFixed(2) + '</h2>'); //+
          
          
          //titeltexter changed values (totalt per år)
          $('#changeTitelTotal').replaceWith('<h3 id="changeTitelTotal">Besparing per år</h3>');
          $('#changeTitelPriceTotal').replaceWith('<p id="changeTitelPriceTotal" class="left">Kostnad (kr)</p>');
          $('#changeTitelEnergyTotal').replaceWith('<p id="changeTitelEnergyTotal" class="left">Energi (kWh)<sub> </sub></p>');
          $('#changeTitelCO2Total').replaceWith('<p id="changeTitelCO2Total" class="left">CO<sub>2</sub> (kg)</p>');
          $('#changeTitelWaterTotal').replaceWith('<p id="changeTitelWaterTotal" class="left" style="margin-top:2px;">Vatten (m<sup style="font-size:10px;">3</sup>)<sub> </sub></p>');
                    
          //changed values (per totala antalet månader valt)
          $('#changePriceTotal').replaceWith('<h2 id="changePriceTotal">' + (mainPrice*12).toFixed(0) + '</h2>');
          $('#changeEnergyTotal').replaceWith('<h2 id="changeEnergyTotal">' + (mainEnergy*12).toFixed(0) + '</h2>');
          $('#changeCO2Total').replaceWith('<h2 id="changeCO2Total">' + (mainCO2*12/1000).toFixed(1)+ '</h2>');
    });
    
    //mikro
    $('#activity5').click(function () {
    
            
          $('#mainValue').replaceWith('<h2 id="mainValue">10</h2>');
          
            
           if (activity==5)            
               {
               $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>'); //ändrade värdet sätts
               }
          else
               {
               $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ 7 +'</h2>'); //startvärde sätts
               }
               
          activity=5;
                              
          //visar rätt informationsbox
          $('#info1').hide();
          $('#info2').hide();
          $('#info3').hide();
          $('#info4').hide();
          $('#info5').show();
          $('#info6').hide();
          
          changedValue = $('#changeInput').text();
          
          var mainValueInput = $('#mainValue').text(); //tid man duschar
          var mainEnergy = (mainValueInput*1.5)/60; //energiförbrukning 1500W micro
          var mainCO2 = (emissionValue*mainEnergy); // /1000 då värdet ska skrivas i kg ist f. g
          var mainPrice = (mainEnergy*electricityPrice);
          
          $('#calculatorHeader').replaceWith('<span id="calculatorHeader">Om du <b>mikrar</b> i</span>');
          $('#activityLabel').replaceWith('<p id="activityLabel" class="right">minuter <b>förbrukar</b> du</p>');
          $('#waterbox').hide();
          $('#changeWaterBox').hide();
          $('#changeWaterBoxTotal').hide();
          $('#totaldiv').attr('style', 'width: 400px');
          
          $('#CO2Title').replaceWith('<p id="CO2Title" class="left">CO<sub>2</sub> (g)</p>');
          
          $('#mainPris').replaceWith('<h2 id="mainPris" class="valueMainBox">' + mainPrice.toFixed(2) + '</h2>');
          $('#mainEnergy').replaceWith('<h2 id="mainEnergy" class="valueMainBox">' + mainEnergy.toFixed(2) + '</h2>');
          $('#mainCO2').replaceWith('<h2 id="mainCO2" class="valueMainBox">' + mainCO2.toFixed(0) + '</h2>');
          
          
          
          // besparingar, minskar du X så sparar du Y osv
          $('#changeInputTitel').replaceWith('<p id="changeInputTitel" class="left">Om du minskar tiden med</p>');
          $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">' + changedValue + '</h2>');
          $('#changeInputLabel').replaceWith('<p id="changeInputLabel" class="right">minuter per dag, <b>sparar</b> du</p>');
          
          changedValue = $('#changeInput').text();
          var mainEnergy = (changedValue*1.5)/60; //energiförbrukning 2000W maskin drar 2kWh per timme
          var mainCO2 = (emissionValue*mainEnergy); // /1000 då värdet ska skrivas i kg ist f. g
          var mainPrice = (mainEnergy*electricityPrice);
          
          

          //titeltexter changed values
          $('#changeTitel').replaceWith('<h3 id="changeTitel">Besparing per dag</h3>');//
          $('#changeTitelPrice').replaceWith('<p id="changeTitelPrice" class="left">Kostnad (kr)<sub> </sub></p>');//
          $('#changeTitelEnergy').replaceWith('<p id="changeTitelEnergy" class="left">Energi (kWh)<sub> </sub></p>');//
          
          $('#changeTitelWater').replaceWith('<p id="changeTitelWater" class="left">Vatten (l)<sub> </sub></p>');//
          
          //changed values
          $('#changePrice').replaceWith('<h2 id="changePrice">' + (mainPrice).toFixed(2) + '</h2>'); //+
          $('#changeEnergy').replaceWith('<h2 id="changeEnergy">' + (mainEnergy).toFixed(2) + '</h2>'); //+
          
          if (mainCO2>1000)
          {
          $('#changeCO2').replaceWith('<h2 id="changeCO2">' + (mainCO2/1000).toFixed(1) + '</h2>');
          $('#changeTitelCO2').replaceWith('<p id="changeTitelCO2" class="left">CO<sub>2</sub> (kg)</p>');//
          }
          else
          {
          $('#changeCO2').replaceWith('<h2 id="changeCO2">' + (mainCO2).toFixed(0) + '</h2>');
          $('#changeTitelCO2').replaceWith('<p id="changeTitelCO2" class="left">CO<sub>2</sub> (g)</p>');//
          }
          
          //titeltexter changed values (totalt per år)
          $('#changeTitelTotal').replaceWith('<h3 id="changeTitelTotal">Besparing per år</h3>');
          $('#changeTitelPriceTotal').replaceWith('<p id="changeTitelPriceTotal" class="left">Kostnad (kr)</p>');
          $('#changeTitelEnergyTotal').replaceWith('<p id="changeTitelEnergyTotal" class="left">Energi (kWh)<sub> </sub></p>');
          $('#changeTitelCO2Total').replaceWith('<p id="changeTitelCO2Total" class="left">CO<sub>2</sub> (kg)</p>');
          $('#changeTitelWaterTotal').replaceWith('<p id="changeTitelWaterTotal" class="left" style="margin-top:2px;">Vatten (m<sup style="font-size:10px;">3</sup>)<sub> </sub></p>');
                    
          //changed values (per totala antalet månader valt)
          $('#changePriceTotal').replaceWith('<h2 id="changePriceTotal">' + (mainPrice*365).toFixed(0) + '</h2>');
          $('#changeEnergyTotal').replaceWith('<h2 id="changeEnergyTotal">' + (mainEnergy*365).toFixed(0) + '</h2>');
          $('#changeCO2Total').replaceWith('<h2 id="changeCO2Total">' + (mainCO2*365/1000).toFixed(1)+ '</h2>');
    
          
          //energi/vattensymbol sätts
          $('#activitySymbol').replaceWith('<span id="activitySymbol" class="symbol"><img src="/vatterhem/Pages/MyPages/Vattersnurran/Images/stickpropp.png" /></span>');
          $('#activitySymbol2').replaceWith('<span id="activitySymbol2" class="symbol"><img src="/vatterhem/Pages/MyPages/Vattersnurran/Images/stickpropp.png" /></span>');
          
    });
    
    //standby
    $('#activity6').click(function () {
     
          $('#mainValue').replaceWith('<h2 id="mainValue">18</h2>');
          
                      
           if (activity==6)            
               {
               $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>'); //ändrade värdet sätts
               }
          else
               {
               $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ 10 +'</h2>'); //startvärde sätts
               }
               
          activity=6;
          
                    
          //visar rätt informationsbox
          $('#info1').hide();
          $('#info2').hide();
          $('#info3').hide();
          $('#info4').hide();
          $('#info5').hide();
          $('#info6').show();
          
          changedValue = $('#changeInput').text();
          
          
          var mainValueInput = $('#mainValue').text(); //tid man duschar
          var mainEnergy = (mainValueInput*0.05); //energiförbrukning 50Wh per timme, radio, tv, dator i standby
          var mainCO2 = (emissionValue*mainEnergy); // /1000 då värdet ska skrivas i kg ist f. g
          var mainPrice = (mainEnergy*electricityPrice);
        
          $('#calculatorHeader').replaceWith('<span id="calculatorHeader">Elektronik i <b>standbyläge</b></span>');
          $('#activityLabel').replaceWith('<p id="activityLabel" class="right">timmar <b>förbrukar</b> </p>');
          $('#waterbox').hide();          
          $('#changeWaterBox').hide();
          $('#changeWaterBoxTotal').hide();
          $('#totaldiv').attr('style', 'width: 400px');
          
                   
          $('#CO2Title').replaceWith('<p id="CO2Title" class="left">CO<sub>2</sub> (g)</p>');
          
          $('#mainPris').replaceWith('<h2 id="mainPris" class="valueMainBox">' + mainPrice.toFixed(2) + '</h2>');
          $('#mainEnergy').replaceWith('<h2 id="mainEnergy" class="valueMainBox">' + mainEnergy.toFixed(2) + '</h2>');
          $('#mainCO2').replaceWith('<h2 id="mainCO2" class="valueMainBox">' + mainCO2.toFixed(0) + '</h2>');
          
                    
          // besparingar, minskar du X så sparar du Y osv
          $('#changeInputTitel').replaceWith('<p id="changeInputTitel" class="left">Om du minskar tiden med</p>');
          $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">' + changedValue + '</h2>');
          $('#changeInputLabel').replaceWith('<p id="changeInputLabel" class="right">timmar per dag, <b>sparar</b> du</p>');
          
          changedValue = $('#changeInput').text();
          var mainEnergy = (changedValue*0.05); //energiförbrukning 2000W maskin drar 2kWh per timme
          var mainCO2 = (emissionValue*mainEnergy); // /1000 då värdet ska skrivas i kg ist f. g
          var mainPrice = (mainEnergy*electricityPrice);
          
          

          //titeltexter changed values
          $('#changeTitel').replaceWith('<h3 id="changeTitel">Besparing per dag</h3>');//
          $('#changeTitelPrice').replaceWith('<p id="changeTitelPrice" class="left">Kostnad (kr)<sub> </sub></p>');//
          $('#changeTitelEnergy').replaceWith('<p id="changeTitelEnergy" class="left">Energi (kWh)<sub> </sub></p>');//
          
          $('#changeTitelWater').replaceWith('<p id="changeTitelWater" class="left">Vatten (l)<sub> </sub></p>');//
          
          //changed values
          $('#changePrice').replaceWith('<h2 id="changePrice">' + (mainPrice).toFixed(2) + '</h2>'); //+
          $('#changeEnergy').replaceWith('<h2 id="changeEnergy">' + (mainEnergy).toFixed(2) + '</h2>'); //+
          
          if (mainCO2>1000)
          {
          $('#changeCO2').replaceWith('<h2 id="changeCO2">' + (mainCO2/1000).toFixed(1) + '</h2>');
          $('#changeTitelCO2').replaceWith('<p id="changeTitelCO2" class="left">CO<sub>2</sub> (kg)</p>');//
          }
          else
          {
          $('#changeCO2').replaceWith('<h2 id="changeCO2">' + (mainCO2).toFixed(0) + '</h2>');
          $('#changeTitelCO2').replaceWith('<p id="changeTitelCO2" class="left">CO<sub>2</sub> (g)</p>');//
          }
          
          //titeltexter changed values (totalt per år)
          $('#changeTitelTotal').replaceWith('<h3 id="changeTitelTotal">Besparing per år</h3>');
          $('#changeTitelPriceTotal').replaceWith('<p id="changeTitelPriceTotal" class="left">Kostnad (kr)</p>');
          $('#changeTitelEnergyTotal').replaceWith('<p id="changeTitelEnergyTotal" class="left">Energi (kWh)<sub> </sub></p>');
          $('#changeTitelCO2Total').replaceWith('<p id="changeTitelCO2Total" class="left">CO<sub>2</sub> (kg)</p>');
          $('#changeTitelWaterTotal').replaceWith('<p id="changeTitelWaterTotal" class="left" style="margin-top:2px;">Vatten (m<sup style="font-size:10px;">3</sup>)<sub> </sub></p>');
                    
          //changed values (per totala antalet månader valt)
          $('#changePriceTotal').replaceWith('<h2 id="changePriceTotal">' + (mainPrice*365).toFixed(0) + '</h2>');
          $('#changeEnergyTotal').replaceWith('<h2 id="changeEnergyTotal">' + (mainEnergy*365).toFixed(0) + '</h2>');
          $('#changeCO2Total').replaceWith('<h2 id="changeCO2Total">' + (mainCO2*365/1000).toFixed(1)+ '</h2>');
    
          
          
          //energi/vattensymbol sätts
          $('#activitySymbol').replaceWith('<span id="activitySymbol" class="symbol"><img src="/vatterhem/Pages/MyPages/Vattersnurran/Images/stickpropp.png" /></span>');
          $('#activitySymbol2').replaceWith('<span id="activitySymbol2" class="symbol"><img src="/vatterhem/Pages/MyPages/Vattersnurran/Images/stickpropp.png" /></span>');
          
    });
   
   $('#arrowUp').click(function () {

    
    switch(activity)
    {
        case 0: //ingen aktivitet vald
            

            break;
        case 1:
            changedValue = parseInt($('#changeInput').text());
            if (changedValue<10)
            {
            changedValue = changedValue + 1;
            }
            $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>');
            $('#activity1').click();
            break;
        case 2:
            changedValue = parseInt($('#changeInput').text());
            if (changedValue<5)
            {
            changedValue = changedValue + 1;
            }
            $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>');
            $('#activity2').click();
            break;
        case 3:
            changedValue = parseInt($('#changeInput').text());
            if (changedValue<12)
            {
            changedValue = changedValue + 1;
            }
            $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>');
            $('#activity3').click();
            break;
            
        case 4:
            changedValue = parseInt($('#changeInput').text());
            if (changedValue<8)
            {
            changedValue = changedValue + 1;
            }
            $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>');
            $('#activity4').click();
            break;
            
        case 5:
            changedValue = parseInt($('#changeInput').text());
            if (changedValue<10)
            {
            changedValue = changedValue + 1;
            }
            $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>');
            $('#activity5').click();
            break;
            
        case 6:
            changedValue = parseInt($('#changeInput').text());
            if (changedValue<18)
            {
            changedValue = changedValue + 1;
            }
            $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>');
            $('#activity6').click();
            break;
        default:
     }
     
   });
  $('#arrowDown').click(function () {

    
    switch(activity)
    {
        case 0: //ingen aktivitet vald
            

            break;
        case 1:
            changedValue = parseInt($('#changeInput').text());
            if (changedValue>0)
            {
            changedValue = changedValue - 1;
            }
            $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>');
            $('#activity1').click();
            break;
        case 2:
            changedValue = parseInt($('#changeInput').text());
            if (changedValue>0)
            {
            changedValue = changedValue - 1;
            }
            $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>');
            $('#activity2').click();
            break;
        case 3:
            changedValue = parseInt($('#changeInput').text());
            if (changedValue>0)
            {
            changedValue = changedValue - 1;
            }
            $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>');
            $('#activity3').click();
            break;
            
        case 4:
            changedValue = parseInt($('#changeInput').text());
            if (changedValue>0)
            {
            changedValue = changedValue - 1;
            }
            $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>');
            $('#activity4').click();
            break;
            
        case 5:
            changedValue = parseInt($('#changeInput').text());
            if (changedValue>0)
            {
            changedValue = changedValue - 1;
            }
            $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>');
            $('#activity5').click();
            break;
            
        case 6:
            changedValue = parseInt($('#changeInput').text());
            if (changedValue>0)
            {
            changedValue = changedValue - 1;
            }
            $('#changeInput').replaceWith('<h2 id="changeInput" style="margin-top:24px !important;">'+ changedValue +'</h2>');
            $('#activity6').click();
            break;
        default:
     }
     
   });
 
 $('#activity1').click();  
    
   $('.menuItem').hover( function(){
      $(this).css('background-color', '#00703a');
      $(this).css('color', '#FFFFFF');
   },
   function(){
      $(this).css('background-color', '#daefe7');
      $(this).css('color', '#00703a');
   });


});
