edwardpulubi

<html>
	<head>

		<style>
			body{
				width:100%;
				height:100%;
				background-color:#eee;
				margin:0px;
			}

			#container{
				position:relative;
				background-color:white;
				width:100%;
				height:70%;
				margin-bottom:50px;
				margin-top:140px;
				margin-left:0px;
			}


			#top_container{
				position:absolute;
				margin-top:0px;
				width:100%;
				height:100px;
				background-color:blue;

			}

			#currency{
				width:100px;
				height:100%;
				margin-right:10px;
				background-color:green;
				position:absolute;
				margin-left:5px;

			}

			#input_amount{
				width:100px;
				height:100%;
				background-color:green;
				position:absolute;
				margin-left:120px;

			}

			#amount_cont{
				width:99px;
			}

			#left_button1{
				position:absolute;
				right:0px;
			}

			#left_button2{
				position:absolute;
				right:50px;
			}

			#table_container{
				position:absolute;
				width:100%;
				margin-top:95px;

			}
		</style>

	</head>

	<body>
			<div id="container">
				<div id="top_container">
					<div id="currency">
						<div id="currency_drop">
							<select id="dropdown">
								<option value="EU"> EUROPE</option>
								<option value="Yuan"> Yuan</option>
								<option value="US"> US Dollar</option>
							<select>
						</div>
					</div>
					<div id="input_amount">
						<input type="text" name="amount" id="amount_cont">
					</div>

					<div id="left_button1">
						<button type="button" id="add">add</button>
					</div>


					<div id="left_button2">
						<button type="button" id="get_total">get total</button>
					</div>


				</div>
				<div id="table_container">
					<div>
					<table>
						<thead>
							<th> Amount</th>
							<th> Currency </th>
							<th> Conversion </th>
						</thead>
					<tbody id="convert-tbody"></tbody>
					<table>
					</div>


			</div>

	</body>

	<script>

			var USD = 45, EU = 52, YU = 7, computed = 0;

			 document.onclick
                function getValues(input, currency){

                    if(currency == 'US')
                    {
                        computed = input * USD;
                    }

                    if(currency == 'EU')
                    {
                        computed = input * EU;
                    }

                    if(currency == 'Yuan')
                    {
                        computed = input * YU;
                    }

                    return computed;
                }

			//
			var elements=[];
			var ScoreObject = function(amount, currency,conversion){
				this.amount = amount;
				this.currency = currency;
				this.conversion = conversion

			};

			document.getElementById("add").onclick = function(){

				var amount = document.getElementById("amount_cont").value;
				var currency = document.getElementById("dropdown").value;
				var conversion = 0;


				if(currency == 'US')
                    {
                        conversion = amount * USD;
                    }

                    if(currency == 'EU')
                    {
                        conversion = amount * EU;
                    }

                    if(currency == 'Yuan')
                    {
                        conversion = amount * YU;
                    }

				var newScoreObject = new ScoreObject(amount,currency,conversion);

				elements.push(newScoreObject);
				populateTable();
				console.log(document.getElementById("amount_cont").value);
			}

			function populateTable(){
				var tempTr = "";
				for(var i=0; i<elements.length;i++){
					tempTr += "<tr>";
					tempTr += "<td>" + elements[i].amount + "</td>"
					tempTr += "<td>" + elements[i].currency + "</td>"
					tempTr += "<td>" + elements[i].conversion + "</td>"
					tempTr += "</tr>";
				}

				document.getElementById("convert-tbody").innerHTML = tempTr;
			}

		</script>

</html>