Skip to content

Commit

Permalink
Eloquent JS ch3 + Tip Calculator submission
Browse files Browse the repository at this point in the history
  • Loading branch information
plb18001 committed Feb 17, 2022
1 parent 2a2e705 commit b8bcfc2
Show file tree
Hide file tree
Showing 14 changed files with 294 additions and 0 deletions.
14 changes: 14 additions & 0 deletions week-5/eloquent-js-ch3/bean/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bean Counter Exercise</title>
</head>
<body>
<h1>Hi there, press F12!</h1>

<script src="main.js"></script>
</body>
</html>
25 changes: 25 additions & 0 deletions week-5/eloquent-js-ch3/bean/main.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
// Your code here.
function countBs(x){
let b = 0;
for(i = 0; i < x.length; i++){
if (x.charAt(i) === "B") {
b += 1;
}
}
return b;
}

function countChar(x,y) {
let c = 0;
for(i=0; i < x.length; i++){
if(x.charAt(i) === y) {
c += 1;
}
}
return c;
}

console.log(countBs("BBC"));
// → 2
console.log(countChar("kakkerlak", "k"));
// → 4
14 changes: 14 additions & 0 deletions week-5/eloquent-js-ch3/minimum/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Minimum Exerise</title>
</head>
<body>
<h1>Hi there, press F12!</h1>

<script src="main.js"></script>
</body>
</html>
6 changes: 6 additions & 0 deletions week-5/eloquent-js-ch3/minimum/main.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
function min(x,y) {
return Math.min(x,y);
}
console.log(min(0, 10));

console.log(min(0, -10));
14 changes: 14 additions & 0 deletions week-5/eloquent-js-ch3/recursion/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Recursion Exercise</title>
</head>
<body>
<h1>Hi there, press F12!</h1>

<script src="main.js"></script>
</body>
</html>
32 changes: 32 additions & 0 deletions week-5/eloquent-js-ch3/recursion/main.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
// Your code here.
function isEven(x) {
if (x == 0){
return true;
}
else if (x == 1){
return false;
}
else if (x < 0) {
return isEven(-x);
}
else {
return isEven(x-2);
}
}

// Or
// function isEven(x){
// if (x % 2 == 0){
// return true;
// }
// else {
// return false;
// }
// }

console.log(isEven(50));
// → true
console.log(isEven(75));
// → false
console.log(isEven(-1));
// → ??
27 changes: 27 additions & 0 deletions week-5/tip-calculator-master/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
# General
.DS_Store
.AppleDouble
.LSOverride

# Icon must end with two \r
Icon


# Thumbnails
._*

# Files that might appear in the root of a volume
.DocumentRevisions-V100
.fseventsd
.Spotlight-V100
.TemporaryItems
.Trashes
.VolumeIcon.icns
.com.apple.timemachine.donotpresent

# Directories potentially created on remote AFP share
.AppleDB
.AppleDesktop
Network Trash Folder
Temporary Items
.apdisk
18 changes: 18 additions & 0 deletions week-5/tip-calculator-master/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
# Tip Calculator
An exercise in JavaScript function definitions and return values. Course: DMD 3475.

## Introduction
Our tip calculator application is almost complete. Our function named `updateValues()` will fetch the values that were input by the user.

At that point, the values are passed as arguments to two functions named `calculateTipPerPerson()` and `calculateTotalPerPerson()`. The values that are returned by each function are used to update the DOM.

## Instructions

1. Define both required functions: `calculateTipPerPerson()` and `calculateTotalPerPerson()`.
2. Each function should accept the 3 arguments being passed to them within the `updateValues()` function.
3. Using those values, calculate and return the appropriate answer.
4. Extra credit: Properly round the dollars and cents that are returned by your functions.

## Helpful Information
* Search Google for "Tip Calculator" to see the desired functionality for this application.
* The `calculateTotalPerPerson()` function should return a value that includes the tip.
28 changes: 28 additions & 0 deletions week-5/tip-calculator-master/css/main.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
body {
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
}

.card {
width: 400px;
max-width: 100%;
}

.card-image img {
height: 100px;
object-fit: cover;
object-position: center;
}

.card-content .row {
margin: 0;
}


.card .card-image .card-title {
font-weight: bold;
text-shadow: 2px 2px 3px black;
padding-bottom: 12px;
}
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
58 changes: 58 additions & 0 deletions week-5/tip-calculator-master/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Tip Calculator</title>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body class="blue darken-3">


<div class="card z-depth-2">
<div class="card-image">
<img src="images/claudia-crespo-ewOrvEa87j4-unsplash.jpg">
<span class="card-title">Tip Calculator</span>
</div>
<div class="card-content">
<div class="row">
<form class="col s12">
<div class="row">
<div class="input-field">
<i class="material-icons prefix">attach_money</i>
<input type="number" id="total" value="100.00" min="1"></input>
<label for="total">Bill Total</label>
</div>
<div class="input-field">
<i class="material-icons prefix">pie_chart</i>
<input type="number" id="tip" value="15" min="0"></input>
<label for="tip">Tip Percentage</label>
</div>
<div class="input-field">
<i class="material-icons prefix">group_add</i>
<input type="number" id="people" value="1" min="1"></input>
<label for="people">Number of People</label>
</div>
</div>
</form>
</div>
</div>
<div class="card-action">
<div class="row">
<div class="col s6">
Tip (per person): $<span class="tipOutput"></span>
</div>
<div class="col s6">
Total (per person): $<span class="totalOutput"></span>
</div>
</div>
</div>
</div>


<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
58 changes: 58 additions & 0 deletions week-5/tip-calculator-master/js/script.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
/**
* Get references to each of the form inputs
*/
let total = document.querySelector('#total');
let tip = document.querySelector('#tip');
let people = document.querySelector('#people');

/**
* Whenever the fields are updated, we call
* the updateValues function.
*/
total.addEventListener('change', updateValues);
total.addEventListener('keyup', updateValues);
tip.addEventListener('change', updateValues);
tip.addEventListener('keyup', updateValues);
people.addEventListener('change', updateValues);
people.addEventListener('keyup', updateValues);

/**
* We will need references for the span tags
* that we will use to output our results.
*/
let tipOutput = document.querySelector(".tipOutput");
let totalOutput = document.querySelector(".totalOutput");

/**
* This function is run every time an input is changed
* by a user.
*/
function updateValues(event){

// Get the latest values from our form inputs
let totalValue = total.value;
let tipValue = tip.value;
let peopleValue = people.value;

// Update the values on the screen
tipOutput.innerText = calculateTipPerPerson(totalValue, tipValue, peopleValue);
totalOutput.innerText = calculateTotalPerPerson(totalValue, tipValue, peopleValue);
}

/**
* Your code goes down here ...
* @todo Write functions for calculateTipPerPerson() and calculateTotalPerPerson()
*/
function calculateTipPerPerson(totalValue,tipValue, peopleValue){
tipOutput = (totalValue * (tipValue/100)) / peopleValue;
console.log(tipOutput);
return tipOutput;
}

function calculateTotalPerPerson(totalValue,tipValue, peopleValue){
let tipAdd = Number(totalValue) * (tipValue/100);
totalOutput = (Number(totalValue) + tipAdd) / peopleValue;
console.log(tipAdd);
console.log(totalOutput);
return totalOutput;
}

0 comments on commit b8bcfc2

Please sign in to comment.