<?php
/*
Template Name: Roi Calculator
*/

get_header();
?>
<section class="section banner roi-calculator-banner bg-white">
    <div class="container">
        <div class="text-cont text-center">
            <h1 class="banner-heading mb-4"><?php echo get_field('roi_heading'); ?></h1>
            <p class="banner-content mb-0">
                <?php echo get_field('roi_description'); ?>
            </p>
        </div>
    </div>
</section>
<section class="section company-information bg-white">
    <div class="container">
        <div class="box">
            <form id="roiForm">
                <div class="row">
                    <div class="col-lg-12">
                        <h3>Company Information</h3>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Company Name</label>
                            <input id="company_name" type="text" class="form-control" value="WareGo">
                        </div>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Warehouse Size (sq ft)</label>
                            <input id="warehouse_size" type="number" class="form-control" value="500000">
                        </div>
                    </div>

                    <div class="col-lg-12">
                        <h3 class="mt-xl-5 mt-lg-5 mt-md-4 mt-sm-0">Current Warehouse Operations</h3>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Pallets stored per month</label>
                            <input id="pallets_month" type="number" class="form-control" value="1000">
                        </div>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Outbound order processed (per day)</label>
                            <input id="outbound_orders" type="number" class="form-control" value="400">
                        </div>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>ASN received per month</label>
                            <input id="asn_month" type="number" class="form-control" value="5">
                        </div>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Average invoice value ($)</label>
                            <input id="invoice_value" type="number" class="form-control" value="200">
                        </div>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Average pallet value ($)</label>
                            <input id="pallet_value" type="number" class="form-control" value="20">
                        </div>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Warehouse employees</label>
                            <input id="employees" type="number" class="form-control" value="15">
                        </div>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Employee hourly rate ($)</label>
                            <input id="emp_rate" type="number" class="form-control" value="20">
                        </div>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Driver hourly rate ($)</label>
                            <input id="driver_rate" type="number" class="form-control" value="20">
                        </div>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Current Inventory accuracy (%)</label>
                            <input id="accuracy" type="number" class="form-control" value="98">
                        </div>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Weekly shrinkage ($)</label>
                            <input id="shrinkage" type="number" class="form-control" value="1000">
                        </div>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Picking errors per week</label>
                            <input id="picking_errors" type="number" class="form-control" value="25">
                        </div>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Order processing time (min)</label>
                            <input id="order_time" type="number" class="form-control" value="15">
                        </div>
                    </div>

                    <div class="col-lg-12">
                        <h3 class="mt-xl-5 mt-lg-5 mt-md-4 mt-sm-0">Warego Implementation Costs</h3>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Software licensing ($)</label>
                            <input id="software_cost" type="number" class="form-control" value="50000">
                        </div>
                    </div>

                    <div class="col-lg-6 col-md-6">
                        <div class="input-cont">
                            <label>Implementation services ($)</label>
                            <input id="implementation_cost" type="number" class="form-control" value="25000">
                        </div>
                    </div>
                </div>
            </form>
        </div>

        <div class="text-center mt-5">
            <a href="javascript:;" class="demo-btn animated-btn" id="calculateROI">
                Calculate ROI
            </a>
        </div>
    </div>
</section>

<section class="section roi-analysis-results">
    <div class="container">
        <div class="text-cont text-center">
            <h2 class="section-title">ROI Analysis <span>Results</span></h2>
        </div>
        <div class="box">
            <div class="row gy-4">
                <div class="col-lg-6">
                    <div class="card">
                        <ul>
                            <li><span class="left">Total Implementation Cost</span><span class="right" id="impl_cost">$0</span></li>
                            <li><span class="left">Annual Efficiency Gains</span><span class="right" id="eff_gains">$0</span></li>
                            <li><span class="left">Total Annual Benefits</span><span class="right" id="annual_benefits">$0</span></li>
                            <li><span class="left">ROI Percentage:</span><span class="right" id="roi_percent">$0</span></li>
                        </ul>
                    </div>
                </div>

                <div class="col-lg-6">
                    <div class="card">
                        <ul>
                            <li><span class="left">Annual Labor Savings</span><span class="right" id="labor_savings">$0</span></li>
                            <li><span class="left">Annual Accuracy Improvements</span><span class="right" id="accuracy_improve">$0</span></li>
                            <li><span class="left">Picking Error Savings</span><span class="right" id="picking_savings">$0</span></li>
                            <li><span class="left">Net Annual Benefit</span><span class="right" id="net_benefit">$0</span></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>


<section class="section key-benefits">
    <div class="container">
        <div class="text-cont text-center">
            <?php if(get_field('kb_section_title')): ?>
                <h2 class="section-title mb-4">
                    <?php echo get_field('kb_section_title'); ?>
                    <?php if(get_field('kb_title_highlighted_text')): ?>
                        <span><?php echo get_field('kb_title_highlighted_text'); ?></span>
                    <?php endif; ?>
                </h2>
            <?php endif; ?>
            
            <?php if(get_field('kb_section_description')): ?>
                <p class="section-content">
                    <?php echo get_field('kb_section_description'); ?>
                </p>
            <?php endif; ?>
        </div>
        
        <?php if(have_rows('kb_benefits_items')): ?>
            <div class="row gy-4">
                <?php while(have_rows('kb_benefits_items')): the_row(); ?>
                    <div class="col-lg-4 col-md-6">
                        <div class="card">
                            <?php if(get_sub_field('kb_item_number')): ?>
                                <h3><?php echo get_sub_field('kb_item_number'); ?></h3>
                            <?php endif; ?>
                            
                            <?php if(get_sub_field('kb_item_description')): ?>
                                <p><?php echo get_sub_field('kb_item_description'); ?></p>
                            <?php endif; ?>
                        </div>
                    </div>
                <?php endwhile; ?>
            </div>
        <?php endif; ?>
    </div>
</section>
<?php
    get_footer();
?>

<script>
  // Constants / Assumptions
  const WORK_DAYS_PER_YEAR = 260;
  const WEEKS_PER_YEAR = 52;

  // Assumed improvements with WareGo
  const LABOR_IMPROVEMENT = 0.30;       
  const SHRINKAGE_REDUCTION = 0.40;      
  const PICKING_ERROR_REDUCTION = 0.60;

  function getNumberValue(id) {
    const val = parseFloat(document.getElementById(id).value);
    return isNaN(val) ? 0 : val;
  }

  function formatCurrency(num) {
    return '$' + num.toLocaleString(undefined, {
      maximumFractionDigits: 0
    });
  }

  function formatPercent(num) {
    return num.toFixed(1) + '%';
  }

  document.getElementById('calculateROI').addEventListener('click', function () {
    
    const palletsMonth     = getNumberValue('pallets_month');
    const outboundOrders   = getNumberValue('outbound_orders'); 
    const asnMonth         = getNumberValue('asn_month');
    const invoiceValue     = getNumberValue('invoice_value');
    const palletValue      = getNumberValue('pallet_value');
    const employees        = getNumberValue('employees');
    const empRate          = getNumberValue('emp_rate');
    const driverRate       = getNumberValue('driver_rate');
    const accuracy         = getNumberValue('accuracy');
    const shrinkage        = getNumberValue('shrinkage');      
    const pickingErrors    = getNumberValue('picking_errors');  
    const orderTime        = getNumberValue('order_time');      

    const softwareCost     = getNumberValue('software_cost');
    const implementationCost = getNumberValue('implementation_cost');

  
    const implCost = softwareCost + implementationCost;

    const ordersPerYear = outboundOrders * WORK_DAYS_PER_YEAR;
    const minutesSavedPerOrder = orderTime * LABOR_IMPROVEMENT;
    const totalMinutesSaved = minutesSavedPerOrder * ordersPerYear;
    const laborHoursSaved = totalMinutesSaved / 60;
    const laborSavings = laborHoursSaved * empRate;

   
    const accuracyImprovements = shrinkage * WEEKS_PER_YEAR * SHRINKAGE_REDUCTION;

    
    const pickingSavings = pickingErrors * invoiceValue * WEEKS_PER_YEAR * PICKING_ERROR_REDUCTION;

   
    const efficiencyGains = laborSavings + pickingSavings;
    const totalAnnualBenefits = efficiencyGains + accuracyImprovements;

    const netAnnualBenefit = totalAnnualBenefits - implCost;
    const roiPercent = implCost > 0 ? (netAnnualBenefit / implCost) * 100 : 0;

  

    
    document.getElementById('impl_cost').textContent       = formatCurrency(implCost);
    document.getElementById('eff_gains').textContent       = formatCurrency(efficiencyGains);
    document.getElementById('annual_benefits').textContent = formatCurrency(totalAnnualBenefits);
    document.getElementById('roi_percent').textContent     = formatPercent(roiPercent);

   
    document.getElementById('labor_savings').textContent   = formatCurrency(laborSavings);
    document.getElementById('accuracy_improve').textContent= formatCurrency(accuracyImprovements);
    document.getElementById('picking_savings').textContent = formatCurrency(pickingSavings);
    document.getElementById('net_benefit').textContent     = formatCurrency(netAnnualBenefit);
  });
</script>