Continous Salary

by bgvianyc

HTML

<div id="app"></div>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#app {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  transition: all 0.2s;
}

li {
  margin: 8px 0;
}

h2 {
  font-weight: bold;
  margin-bottom: 15px;
}

h1 {
  font-size: xx-large;
}

.done {
  color: rgba(0, 0, 0, 0.3);
  text-decoration: line-through;
}

input {
  margin: 10px;
}

React

function formatMoney(amount, decimalCount = 2, decimal = ".", thousands = ",") {
  try {
    decimalCount = Math.abs(decimalCount);
    decimalCount = isNaN(decimalCount) ? 2 : decimalCount;

    const negativeSign = amount < 0 ? "-" : "";

    let i = parseInt(amount = Math.abs(Number(amount) || 0).toFixed(decimalCount)).toString();
    let j = (i.length > 3) ? i.length % 3 : 0;

    return negativeSign + (j ? i.substr(0, j) + thousands : '') + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + thousands) + (decimalCount ? decimal + Math.abs(amount - i).toFixed(decimalCount).slice(2) : "");
  } catch (e) {
    console.log(e)
  }
};

const secondsInYear = 86400 * 365
class Salary extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
    	salary: 100000,
      days: 365,
      decSeconds: 0,
      name: '',
      percentage: 0,
      allocations: [],
      compoundRate: 0.04
    }
  }
  
  componentDidMount() {
  	this.interval = setInterval(
    	this.incrementSeconds,
      100
    )
  }
  
  componentWillUnmount() {
 	 clearInterval(this.interval);
  }
  
  incrementSeconds = () => {
  	const { decSeconds } = this.state
    this.setState({ decSeconds: decSeconds + 1 })
  }
  
  computeInterest = () => {
    // http://financeformulas.net/Future-Value-of-Annuity-Continuous-Compounding.html
  	const { compoundRate, salary, decSeconds } = this.state
  	
    const salaryPerSecond = salary / secondsInYear
    const elapsedTime = decSeconds / 10
    const intPerSecond = compoundRate / (secondsInYear / elapsedTime)
    let E = Math.E
   // return (E**(intPerSecond * elapsedTime) - 1) / (E ** (intPerSecond) - 1)
   const accruedInterest = salaryPerSecond * (E ** (intPerSecond * (elapsedTime / secondsInYear)) - 1) / (E ** intPerSecond - 1)
   return accruedInterest.toLocaleString(undefined, {minimumFractionDigits: 10})
  }
  
  handleSalaryChange = (event) => {
    this.setState({salary: event.target.value});
  }  
  
  handleDaysChange = (event)...