var showBoatSlider = "false";
if(showBoatSlider == "") {
showBoatSlider = "true";
}
var boatSlider;
function isInt(value) {
return !isNaN(value) && (function(x) { return (x | 0) === x; })(parseFloat(value))
}
function formatInput() {
var loan = document.querySelector('#loan-calc #loan').value;
loan = formatNumber(loan);
if(loan !== 0) {
document.querySelector('#loan-calc #loan').value = "$" + loan;
}
var downpayment = document.querySelector('#loan-calc #down-payment-input').value;
downpayment = formatNumber(downpayment);
document.querySelector('#loan-calc #down-payment-input').value = "$" + downpayment;
var monthly = document.querySelector('#loan-calc #monthly').value;
monthly = formatNumber(monthly);
document.querySelector('#loan-calc #monthly').value = "$" + monthly;
}
function formatNumber(number) {
if(isNaN(number)) {
return 0.00;
} else {
return number.toString().replace(/\$/g,'').replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
}
function updateDownpayment(type) {
var loan = parseInt(jQuery("#loan-calc #loan").val().substring(1).replace(/,/g, '')),
downpayment = parseInt(jQuery("#loan-calc #down-payment-input").val().substring(1).replace(/,/g, '')),
percentage = document.querySelector('#down-payment-percentage-input').value;
if(type == "percentage") {
if(percentage) {
var downpayment = Math.round((percentage / 100) * loan);
document.querySelector('#down-payment-input').value = "$" + formatNumber(downpayment);
}
} else if(type == "value") {
if(downpayment) {
var percentage = Math.round((downpayment / loan) * 100);
if(!isNaN(percentage)) {
document.querySelector('#down-payment-percentage-input').value = percentage;
}
}
}
}
function convertTerm(type) {
var years = document.querySelector('#term-years').value,
months = document.querySelector('#term-months').value;
if(type == 'years') {
var totalMonths = Math.round(years * 11.9920326906);
document.querySelector('#term-months').value = totalMonths;
} else if(type == 'months') {
var totalYears = Math.round(months * 0.0833886986);
document.querySelector('#term-years').value = totalYears;
}
}
function getFormData() {
const formData = [
{
selector: document.querySelector('#loan-calc #monthly'),
value: document.querySelector('#loan-calc #monthly').value.replace(/\D+/g, ''),
isInt: true,
errorMessage: "Invalid monthly amount"
},
{
selector: document.querySelector('#loan-calc #loan'),
value: document.querySelector('#loan-calc #loan').value.replace(/\D+/g, ''),
isInt: true,
errorMessage: "Invalid purchase amount"
},
{
selector: document.querySelector('#loan-calc #down-payment-input'),
value: document.querySelector('#loan-calc #down-payment-input').value.replace(/\D+/g, ''),
isInt: true,
errorMessage: "Invalid down payment amount"
},
{
selector: document.querySelector('#loan-calc #down-payment-percentage-input'),
value: document.querySelector('#loan-calc #down-payment-percentage-input').value.replace(/\D+/g, ''),
isInt: true,
errorMessage: "Invalid down payment percentage"
},
{
id: "field-loan-term-years",
selector: document.querySelector('#loan-calc #term-years'),
value: document.querySelector('#loan-calc #term-years').value,
required: true,
isInt: true,
errorMessage: "Invalid number of years"
},
{
id: "field-loan-term-months",
selector: document.querySelector('#loan-calc #term-months'),
value: document.querySelector('#loan-calc #term-months').value,
required: true,
isInt: true,
errorMessage: "Invalid number of months"
},
{
selector: document.querySelector('#loan-calc #interest-rates'),
value: document.querySelector('#loan-calc #interest-rates').value,
required: true,
errorMessage: "Invalid interest rate"
}
];
return formData;
}
function validateFormData(formData) {
var valid = true;
jQuery("#loan-calc .loan-section").removeClass("error");
jQuery("#loan-calc .loan-section").parent().find(".error-message").html("");
console.log(formData);
formData.map((data, i) => {
if(data.selector == document.querySelector('#loan-calc #monthly')) {
var monthly = data.value;
var loanAmount = formData[i+1].value;
if(jQuery(".form-toggle #toggle-monthly").hasClass("active")) {
if(!monthly) {
valid = true;
// jQuery(data.selector).parent().addClass("error");
// jQuery(data.selector).parent().find(".error-message").html(data.errorMessage);
}
} else if(jQuery(".form-toggle #toggle-total").hasClass("active")) {
if(!loanAmount) {
valid = true;
// jQuery(data.selector).parent().addClass("error");
// jQuery(data.selector).parent().find(".error-message").html(data.errorMessage);
}
}
}
if(data.required) {
if(!data.value) {
valid = false;
jQuery(data.selector).parent().addClass("error");
jQuery(data.selector).parent().find(".error-message").html(data.errorMessage);
}
}
if(data.isInt) {
if(!isInt(data.value) && data.value != "") {
valid = false;
jQuery(data.selector).parent().addClass("error");
jQuery(data.selector).parent().find(".error-message").html(data.errorMessage);
}
}
});
// Custom rule for loan terms
var validateLoanTerms = {
years: function() {
var yearTerm = formData.filter(function (data) {
return data.id == "field-loan-term-years";
});
return yearTerm;
},
months: function() {
var monthTerm = formData.filter(function (data) {
return data.id == "field-loan-term-months";
});
return monthTerm;
},
};
if(validateLoanTerms.years()[0].value == "0" && validateLoanTerms.months()[0].value == "0") {
valid = false;
jQuery(validateLoanTerms.months()[0].selector).parent().addClass("error");
jQuery(validateLoanTerms.months()[0].selector).parent().find(".error-message").html("Please choose a loan term greater than 0");
}
return valid;
}
function calculateLoan(e) {
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
event: 'e_formSubmission',
form_name: 'loan calculator'
});
if(e) {
e.preventDefault();
}
const formData = getFormData();
const validation = validateFormData(formData);
document.querySelector("#loan-calc #loan-results-box").classList.add("loading");
if(validation) {
document.querySelector("#loan-calc #loan-results-box").classList.remove("loading");
var data = {
monthly: parseInt(jQuery("#loan-calc #monthly").val().substring(1).replace(/,/g, '')),
amount: parseInt(jQuery("#loan-calc #loan").val().substring(1).replace(/,/g, '')),
downpayment: parseInt(jQuery("#loan-calc #down-payment-input").val().substring(1).replace(/,/g, '')),
monthTerm: parseInt(jQuery("#loan-calc #term-months").val()),
salesTax: parseFloat(jQuery("#loan-calc #sales-tax-input").val()),
interestRate: parseFloat(jQuery("#loan-calc #interest-rates").val())
};
if(jQuery(".form-toggle #toggle-monthly").hasClass("active")) {
var principal = data.amount;
} else if(jQuery(".form-toggle #toggle-total").hasClass("active")) {
var principal = data.monthly*data.monthTerm;
jQuery("#loan-calc #loan").val("$" + formatNumber(principal));
}
if(data.downpayment) {
principal = principal - data.downpayment;
}
if(data.salesTax) {
principal = principal + (principal * (data.salesTax / 100));
}
var interest = data.interestRate / 100 / 12;
var payments = data.monthTerm;
var downPayment = data.downpayment;
var salesTax = (principal * (data.salesTax / 100));
var x = Math.pow(1 + interest, payments);
var monthly = (principal*x*interest)/(x-1);
var principalPaid = jQuery("#loan").val();
var interestPaid = parseFloat(((monthly*payments)-principal).toFixed(2));
var maxLoanAmount = principal + interestPaid;
jQuery("#loan-calc .results #total").html("$" + formatNumber(maxLoanAmount.toFixed(2)));
jQuery("#loan-calc .results #total-monthly-payment").html("$" + formatNumber(monthly.toFixed(2)));
jQuery("#loan-calc #total-principal-value").html("$" + formatNumber(principal.toFixed(2)));
jQuery("#loan-calc #total-interest-value").html("$" + formatNumber(interestPaid.toFixed(2)));
jQuery("#loan-calc #total-down-payment").html("$" + formatNumber(downPayment.toFixed(2)));
jQuery("#loan-calc #total-sales-tax").html("$" + formatNumber(salesTax.toFixed(2)));
if(jQuery(".form-toggle #toggle-monthly").hasClass("active")) {
jQuery("#loan-calc #monthly").val("$" + formatNumber(monthly.toFixed(2)));
}
if(showBoatSlider == "true" || !jQuery("#boat-listings-container").hasClass("disabled")) {
generateBoatListings(data.amount);
}
} else {
document.querySelector("#loan-calc #loan-results-box").classList.remove("loading");
}
}
function generateBoatListings(boatValue) {
var itemsToShow = 9;
var apiUrl = "https://api.boattrader.com/app/search/boat?apikey=a3qe89odmrv4kf0r4lmar5fa7pex2tzdb&pageSize=28&page=1&country=US&facets=country,state,make,makeModel,class,fuelType,hullMaterial,stateCity,priceRevisedSince,minMaxPercentilPrices,condition&fields=id,make,model,year,featureType,isOemModel,showSaveButton,type,class,condition,specifications.dimensions.lengths.nominal.ft,location.address.state,location.address.country,location.address.city,location.address.zip,aliases,owner.logos.enhanced,owner.name,owner.rootName,owner.id,price.hidden,price.type.amount.USD,price.discount.amount.USD,price.discount.revisedDate,portalLink,media.0.title,media.0.date.modified,media.0.mediaType,media.0.width,media.0.videoEmbedUrl,media.0.videoVideoThumbnailUri,media.0.url,attributes,bestimate&useMultiFacetedFacets=true&zip=33010&distance=200mi&sort=proximity-asc&price="+boatValue+"-"+boatValue;
var delayTimer;
var delay = 500;
delayTimer = setTimeout(function() {
var request = new XMLHttpRequest();
request.open("GET", apiUrl);
request.send();
request.onload = () => {
if(request.status === 200) {
var container = document.getElementById("boat-listings-container");
container.style.display = "block";
var response = JSON.parse(request.response);
var records = response.search.records.filter(
record => {
return record.year > 2002 &&
record.price.hidden == false;
}
);
var listings = records.slice(0, itemsToShow);
const parentBlock = document.querySelector('.boat-listings');
parentBlock.innerHTML = "";
listings.map(function(listing) {
var listingBlock = document.createElement('div');
listingBlock.classList.add('boat-listing');
var image = document.createElement("img");
image.setAttribute("src", listing.media[0].url);
listingBlock.appendChild(image);
var titleBlock = document.createElement('div');
titleBlock.classList.add('title');
titleBlock.innerHTML = "
"+ listing.year + " " + listing.make + " " + listing.model + " | " + listing.specifications.dimensions.lengths.nominal.ft + "' " + " ";
listingBlock.appendChild(titleBlock);
var detailsBlock = document.createElement('div');
detailsBlock.classList.add('details');
listingBlock.appendChild(detailsBlock);
var priceBlock = document.createElement('div');
priceBlock.classList.add('price');
if(!listing.price.hidden) {
priceBlock.innerHTML = "
$" + formatNumber(listing.price.type.amount.USD + "") + " ";
detailsBlock.appendChild(priceBlock);
}
var locationBlock = document.createElement('div');
locationBlock.classList.add('location');
locationBlock.innerHTML = "
Location: " + listing.location.address.city + ", " + listing.location.address.state + "";
priceBlock.appendChild(locationBlock);
var buyBlock = document.createElement('div');
buyBlock.classList.add('buy');
var buyLink = document.createElement('a');
buyLink.href = listing.portalLink;
buyLink.innerText = "View Listing";
buyLink.target = "_blank";
buyBlock.appendChild(buyLink);
detailsBlock.appendChild(buyBlock);
parentBlock.appendChild(listingBlock);
jQuery("#boat-listings-container .boat-listings").slick('refresh');
});
} else if(request.status === 400) {
console.log("Error");
}
}
}, delay);
}
function generateSlider() {
jQuery("#boat-listings-container .boat-listings").slick({
infinite: true,
slidesToShow: 4,
slidesToScroll: 1,
arrows: true,
responsive: [
{
breakpoint: 1260,
settings: {
slidesToShow: 3,
slidesToScroll: 1
}
},
{
breakpoint: 991,
settings: {
slidesToShow: 1,
slidesToScroll: 1
}
},
]
});
}
jQuery(document).ready(function() {
if(showBoatSlider == "true" || !jQuery("#boat-listings-container").hasClass("disabled")) {
generateSlider();
generateBoatListings("150000");
}
jQuery(".form-toggle a").click(function(e) {
e.preventDefault();
jQuery(".form-toggle a").removeClass("active");
jQuery(this).addClass("active");
var id = jQuery(this).attr('id');
if(id == "toggle-monthly") {
jQuery("#loan-amount").show();
jQuery("#down-payment").show();
jQuery("#desired-monthly-payment").hide();
jQuery(".results .monthly-payment").show();
jQuery(".results .total-loan-amount").hide();
jQuery(".results #total").hide();
jQuery(".results #total-monthly-payment").show();
} else if(id == "toggle-total") {
jQuery("#loan-amount").hide();
jQuery("#down-payment").hide();
jQuery("#desired-monthly-payment").show();
jQuery(".results .monthly-payment").hide();
jQuery(".results .total-loan-amount").show();
jQuery(".results #total").show();
jQuery(".results #total-monthly-payment").hide();
}
});
});
Desired monthly payment
Purchase amount
Loan term in years
Or
Loan term in months
Sales Tax
%
Adjust the loan term, down payment amount and interest rate to see results based on the numbers you provide – and how any changes to those numbers may affect your payment.
Your estimated monthly payment:
Loan Amount:
$000.00
$000.00
Total Principal Paid
Total Interest Paid
Down Payment
Sales Tax
See Important disclosure3
Ready to buy a boat? Check out these boats for sale on Boat Trader!
tippy('#loan-disclaimer-1', {
allowHTML: true,
placement: 'bottom',
content: 'Actual rate, purchase amount and term can vary depending on the lender, FICO score, credit history, lender assets/liquidity requirements, down payment, debit and payment to income ratios, collateral type, age of collateral, loan to value, vehicle registration (LLC), loan type (Purchase versus Refinance), state of residency and other criteria. Loan is for recreational pleasure use only. Rates and terms are subject to change without notice based on market conditions and borrower eligibility. Other rates and loan terms are available.
† Max loan term may vary.',
});