Untitled

avatar
unknown
plain_text
2 years ago
12 kB
8
Indexable
/*ROI Calculator V2 Starts Here*/
function roi_calculator_shortcode_v2() {
    ob_start(); 
    ?>
    <form id="roi-form">

<label class="prd-lbl">Size of Salesforce Development Team</label>
<input type="range" id="sizeOfSalesforceDev" name="sizeOfSalesforceDev" class="prd-slc" min="1" max="4" value="1">
<output for="sizeOfSalesforceDev" id="sizeOutput" class="prd-output">Small 1 Employee</output>
<br/>
    

<label class="prd-lbl">Current Pricing Changes (How long to make manual change)</label>
<input type="range" id="currentPricing" name="currentPricing" class="prd-slc" min="1" max="4" value="2">
<output for="currentPricing" id="currentPricingOutput" class="prd-output">Efficient (4 Days)</output>
<br/>

<label class="prd-lbl">Average Price Adjustment</label>
<input type="range" id="averagePriceAdjustment" name="averagePriceAdjustment" class="prd-slc" min="1" max="5" value="4">
<output for="averagePriceAdjustment" id="priceOutput" class="prd-output">Large Increase ($1000)</output>
<br/>

<label class="prd-lbl">Deal per Day?</label>
<input type="range" id="dealPerDay" name="dealPerDay" class="prd-slc" min="1" max="5" value="3">
<output for="dealPerDay" id="dealOutput" class="prd-output">Marginal # Orders (500)</output>
<br/>

<label class="prd-lbl">Prodly Subscription</label>
<input type="range" id="prodlySubscription" name="prodlySubscription" class="prd-slc" min="0" max="2" step="1" value="0" list="prodlySubscriptionList">
<datalist id="prodlySubscriptionList">
    <option value="0">25000</option>
    <option value="1">50000</option>
    <option value="2">100000</option>
</datalist>
<output for="prodlySubscription" id="prodlyOutput" class="prd-output">Prodly Standard</output>
<br/>

<label class="prd-lbl-result" id="costSavingsPerYearLabel">Cost Savings Per Year</label>
<output id="costSavingsPerYearOutput" class="prd-output">$0.00</output>
<br/>
<label class="prd-lbl-result" id="increasedRevenueYearLabel">ROI of Pricing Changes</label>
<output id="increasedRevenueYearOutput" class="prd-output">$0.00</output>
<br/>
<label class="prd-lbl-result" id="roiProdlysNetImpactYearLabel">ROI</label>
<output id="roiProdlysNetImpactYearOutput" class="prd-output">$0.00</output> <output id="roipercentOutput" class="prd-output">0%</output>
<br/>
</form>

    <script>
        
let prodlySubscriptionCost = 25000;
let devOpsCoEProgramCosts = 5000;
let totalCustomercosts = 30000;
let costSavingsPerYear = 0;
let increasedRevenueYear = 0;
/*let prodlysNetImpactYear = 0;*/

let roiProdlysNetImpactYearVar = 0;
let roipercentVar = 0;

let sizeOfSalesforceDevVar = 0;
let currentPricingVar = 0.5; 
let dealPerDayVar = 10;
let averagePriceAdjustmentVar = 0.5;
 

function formatNumber(num) {
    return num.toFixed(0).replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1,');
}

function updateRoiProdlysNetImpactYear() {
    roiProdlysNetImpactYearVar = costSavingsPerYear + increasedRevenueYear;   
    // Muestra roiProdlysNetImpactYearVar en el output correspondiente con el formato adecuado
    document.getElementById('roiProdlysNetImpactYearOutput').textContent = "$" + formatNumber(roiProdlysNetImpactYearVar);
}

function updateCostSavingsPerYear() {
    costSavingsPerYear = 80 * (((sizeOfSalesforceDevVar * 12) + (sizeOfSalesforceDevVar * 432)) - (sizeOfSalesforceDevVar * 1.2 + sizeOfSalesforceDevVar * 43.2));
    document.getElementById('costSavingsPerYearOutput').textContent = "$" + formatNumber(costSavingsPerYear);
    updateRoiProdlysNetImpactYear();  // Esto asegura que roiProdlysNetImpactYearVar se actualice correctamente.
}

function updateIncreasedRevenueYear() {
    increasedRevenueYear = currentPricingVar * dealPerDayVar * averagePriceAdjustmentVar * 0.9;
    document.getElementById('increasedRevenueYearOutput').textContent = "$" + formatNumber(increasedRevenueYear);
    updateRoiProdlysNetImpactYear();  // Esto asegura que roiProdlysNetImpactYearVar se actualice correctamente.
}

function updateRoiPercent() {
    roipercentVar = ((roiProdlysNetImpactYearVar - totalCustomercosts) / totalCustomercosts);
    document.getElementById('roipercentOutput').textContent = formatNumber(roipercentVar) + "%";
}
updateRoiPercent();

let sizeValues = [1, 3, 10, 15];

document.getElementById('sizeOfSalesforceDev').addEventListener('input', function (e) {
    let index = parseInt(e.target.value, 10) - 1; 
    let value = sizeValues[index];
    switch(value) {
        case 1:
            document.getElementById('sizeOutput').textContent = "Small 1 Employee";
            break;
        case 3:
            document.getElementById('sizeOutput').textContent = "Medium 3 Employees";
            break;
        case 10:
            document.getElementById('sizeOutput').textContent = "Large 10 Employees";
            break;
        case 15:
            document.getElementById('sizeOutput').textContent = "Enterprise 15 Employees";
            break;
    }
    sizeOfSalesforceDevVar = value;

    // Calcula costSavingsPerYear
    costSavingsPerYear = 80 * (((sizeOfSalesforceDevVar * 12) + (sizeOfSalesforceDevVar * 432)) - (sizeOfSalesforceDevVar * 1.2 + sizeOfSalesforceDevVar * 43.2));

    // Muestra costSavingsPerYear en el output correspondiente con el formato adecuado
    document.getElementById('costSavingsPerYearOutput').textContent = "$" + formatNumber(costSavingsPerYear);
    updateCostSavingsPerYear();
});


let pricingValues = [0.5, 4, 28, 90];
document.getElementById('currentPricing').addEventListener('input', function (e) {
    let index = parseInt(e.target.value, 10) - 1; 
    let value = pricingValues[index];
    switch(value) {
        case 0.5:
            document.getElementById('currentPricingOutput').textContent = "Super fast (12 hours)";
            break;
        case 4:
            document.getElementById('currentPricingOutput').textContent = "Efficient (4 Days)";
            break;
        case 28:
            document.getElementById('currentPricingOutput').textContent = "Need some Work (4 Weeks)";
            break;
        case 90:
            document.getElementById('currentPricingOutput').textContent = "Super Complex (3 Months)";
            break;
    }
    currentPricingVar = value;
    updateIncreasedRevenueYear();
});



let priceValues = [0.5, 5, 50, 1000, 10000];
document.getElementById('averagePriceAdjustment').addEventListener('input', function (e) {
    let index = parseInt(e.target.value, 10) - 1; 
    let value = priceValues[index];
    switch(value) {
        case 0.5:
            document.getElementById('priceOutput').textContent = "Micro Increase ($.5)";
            break;
        case 5:
            document.getElementById('priceOutput').textContent = "Small Increase ($5)";
            break;
        case 50:
            document.getElementById('priceOutput').textContent = "Marginal Increase ($50)";
            break;
        case 1000:
            document.getElementById('priceOutput').textContent = "Large Increase ($1000)";
            break;
        case 10000:
            document.getElementById('priceOutput').textContent = "Extra-Large Increase ($10000)";
            break;
    }
    averagePriceAdjustmentVar = value;
    updateIncreasedRevenueYear();
});


let dealValues = [10, 100, 500, 1000, 10000];
document.getElementById('dealPerDay').addEventListener('input', function (e) {
    let index = parseInt(e.target.value, 10) - 1;  // -1 porque el array empieza en 0
    let value = dealValues[index];
    switch(value) {
        case 10:
            document.getElementById('dealOutput').textContent = "Minimum # Orders (10)";
            break;
        case 100:
            document.getElementById('dealOutput').textContent = "Small # Orders (100)";
            break;
        case 500:
            document.getElementById('dealOutput').textContent = "Marginal # Orders (500)";
            break;
        case 1000:
            document.getElementById('dealOutput').textContent = "Large # Orders (1000)";
            break;
        case 10000:
            document.getElementById('dealOutput').textContent = "Extra-Large # Orders (10000)";
            break;
    }
    dealPerDayVar = value;
    updateIncreasedRevenueYear();
});

let prodlySubscriptionVar = 25000; 
document.getElementById('prodlySubscription').addEventListener('input', function (e) {
    let value = parseInt(e.target.value, 10);
    let chosenValue;
    switch(value) {
        case 0:
            chosenValue = 25000;
            document.getElementById('prodlyOutput').textContent = "Prodly Standard";
            break;
        case 1:
            chosenValue = 50000;
            document.getElementById('prodlyOutput').textContent = "Prodly Plus";
            break;
        case 2:
            chosenValue = 100000;
            document.getElementById('prodlyOutput').textContent = "Prodly Enterprise";
            break;
    }

    // Almacena el valor numérico en la variable prodlySubscriptionVar
    prodlySubscriptionVar = chosenValue;

    // Calcula devOpsCoEProgramCosts
    devOpsCoEProgramCosts = prodlySubscriptionVar * 0.2;

    // Calcula totalCustomercosts
    totalCustomercosts = prodlySubscriptionVar + devOpsCoEProgramCosts;
});


</script>

    <div id="result" class="prd-result"></div>
    <style>
        .prd-submit {
            padding: 10px 20px;
            margin-top:20px;
            border: 0px !important;
            background-color: #FE4438;
            -webkit-border-radius: 40px;
            -moz-border-radius: 40px;
            border-radius: 40px;
        }
        .prd-submit:hover{
            background-color: #3c3c3c;
            cursor: pointer !important;
        }
        button:not(:disabled), [type="button"]:not(:disabled), [type="reset"]:not(:disabled), [type="submit"]:not(:disabled) {
           cursor: pointer !important;
        }
        .prd-result{
            margin-top: 40px;
            font-size: 20px;            
        }
        .prd-lbl{
            color:#333333;
            font-weight: 600;
        }
        .prd-lbl-result{
            color:#FE4438;
            font-weight: 400;
            margin-bottom:20px;
            font-size: 19px;
        }
        .prd-lbl-result-bold{
            color:#FE4438;
            font-weight: 600;
            margin-bottom:20px;
            font-size: 21px;
        }
        .prd-result-savings{
            color:#333333;
        }
        .prd-slc{
            width:100%;
            padding:5px 10px;
            /*margin-bottom:20px;*/
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 5px;
        }
        .prd-output{
            margin-bottom: 40px;
            color: #FE4438;
            font-weight: 600;
            font-size: 20px;
            /*text-align: center;
            width: 100%;*/
        }
        .prd-roi{
            color:#FE4438;
        }
        .prd-h3-learn-more{
            color:#333333;
            font-size: 24px;
            line-height: 1.2;
        }
        #prd-lm-on{
            display:block !important;
            visibility: visible !important;
        }


    </style>
    
    <?php
    return ob_get_clean();
}
add_shortcode('roi_calculator_v2', 'roi_calculator_shortcode_v2');
/*ROI Calculator Ends Here*/
Editor is loading...