RPN Calc

by John Doe

HTML

<div id="display-wrapper">
<div id="display">

</div>
</div>
<div id="keyboard">
keyboard test
</div>

CSS

* {
  font-family:"Lucida Console", Monaco, monospace;
}
body {
  height: 100%;
  width: 100%;
  margin: 0;
}
p {
  background-color: skyblue;
}
#display-wrapper {
  position: absolute;
  bottom: 50%;
  left: 0;
  width: 100%;
  background-color: beige;
}
#display {
  position: relative;
  bottom: 0%;
  left: 0%;
  height: 50%;
  width: 95%;
  padding-left: 5%;
}
#display > p:nth-last-child(-n+2) {
  background-color: yellowgreen;
}

#display > p:last-child::before {
  content: "x ";
}
#display > p:nth-last-child(2)::before {
  content: "y ";
}
#display > p:nth-last-child(n+3)::before {
  content: "\00a0\00a0";
}

#keyboard {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 50%;
  background-color: orange;
  margin: 1px;
}

JavaScript

function initialize(){
	stack = new Stack()
  draw()
}

function Key(str, fun){
  this.key = str
  this.fun = fun
}

function Stack(){
  this.rest = []
  this.current = ""
  
  this.byLine = function(){
    var lines = []
    for (l of this.rest){
      lines.push(l.toString())
    }
    if( this.current.length == 0){
      lines.push("0.0")
    } else {
      lines.push(this.current)
    }
    return lines
  }
  
  this.addDigit = function(d){
    if(d.length == 1 && ("0" <= d && d <= "9" || d == ".")){
      this.current += d
    } else if (d == "backspace"){
      this.current = this.current.slice(0, -1);
    }
  }
  
  this.push = function(num){
    if(this.current.length > 0){
    	this.rest.push(parseFloat(this.current))
    } 
    this.current = num.toString()
  }
  
  this.pop = function(num){
    var ret = 0
    if(this.current.length == 0){
    	ret =  0
    } else {
    	ret = parseFloat(this.current)
    }
    if(this.rest.length >0){
    	this.current = this.rest.pop().toString()
    } else {
      this.current = ""
    }
    return ret
  }
  
  this.enter = function(){
    this.rest.push(parseFloat(this.current))
    this.current =""
  }
}



function inputNum(s){
  stack.addDigit(s)
  draw()
}

function operate(s){
  switch(s){
  case "+":
    var x = stack.pop()
    var y = stack.pop()
    stack.push(x+y)
    break
  case "-":
    var x = stack.pop()
    var y = stack.pop()
    stack.push(y-x)
    break
  case "*":
    var x = stack.pop()
    var y = stack.pop()
    stack.push(x*y)
    break
  case "/":
    var x = stack.pop()
    var y = stack.pop()
    stack.push(x/y)
    break
  case "%":
    var x = stack.pop()
    var y = stack.pop()
    stack.push(y%x)
    break
  case "%":
    var x = stack.pop()
    var y = stack.pop()
    stack.push(y%x)
    break
  case "=":
    stack.enter()
    break
  case "negate":
    var x = stack.pop()
    stack.push(-x)
    break
  default:
  }
  draw()

}



function draw(){
	drawDisplay()
 ...