# Project export: Calhacks 11 project
This document was generated by HackStack to give an AI agent context about a hackathon project. Sections are labeled with their provenance; content marked as truncated was cut to keep this document small.
## Project metadata
- Hackathon: Cal Hacks 11.0
- Tagline: Learned basic html, css and js with a custom calculator app.
- Devpost: https://devpost.com/software/calhacks-11-project
- GitHub: https://github.com/albertysu/calhacks11-project
- Team: 1 GitHub contributor(s) — Albert Su (4 commits)
## Devpost submission (written by the team)
No Devpost description available.
## README (from the GitHub repository)
Learned basic html, css and js with a custom calculator app.
## Detected evidence (automated analysis)
Indexed codebase: 4 recognized source files, 5 KB.
- CSS (language) — detected in the code
- HTML (language) — detected in the code
- JavaScript (language) — detected in the code
## Codebase structure (from repository index)
### Files (5 of 5)
```
.DS_Store
index.html
README.md
script.js
style.css
```
### Dependencies
No dependency index available.
### Recent commits (newest first)
- Create README.md
- import style from zach
- import script from josh
- finished html
## Key source files (fetched from GitHub, selected and truncated for size)
### style.css
```css
h1 {
text-align: center;
color: #fffaf3;
font-size: 80px;
}
html {
background-color: #6e6a86;
}
#container {
display: flex;
flex-direction: column;
height: 536px;
width: 428px;
margin: auto;
border: 5px solid black;
background-color: black;
}
.row {
display: flex;
flex: 1;
}
#display {
flex: 0.9;
display: flex;
align-items: center;
justify-content: right;
background-color: gray;
border: 2px solid black;
border-right: gray;
font-size: 60px;
}
.spacing {
flex: 0.1;
background-color: gray;
border: 2px solid black;
border-left: gray;
}
.function {
flex: 1;
background-color: #9ccfd8;
}
.number {
flex: 1;
background-color: #31748f;
}
.operator {
flex: 1;
background-color: #f6c177;
}
.button {
display: flex;
justify-content: center;
align-items: center;
font-size: 40px;
border: 2px solid black;
border-radius: 5%;
}
#zero {
flex: 2.04;
}
```
### index.html
```html
Calculator
Calculator
```
### script.js
```javascript
let secondary_arg = 0;
let display_arg = 0;
let operator = -1;
const display_div = document.getElementById("display");
function updateDisplay() {
display_div.innerText = display_arg;
}
function button_num(e) {
display_arg = display_arg * 10 + Number(e.target.innerText);
updateDisplay();
}
function button_operator(e) {
let op = e.target.innerText;
if (op === "=") {
operate();
operator = -1;
return;
}
operate();
if (op === "+") {
operator = 1;
} else if (op === "-") {
operator = 2;
} else if (op === "*") {
operator = 3;
} else if (op === "/") {
operator = 4;
}
secondary_arg = display_arg;
display_arg = 0;
}
function button_function(e) {
let target = e.target.innerText;
if (target === "AC") {
display_arg = 0;
secondary_arg = 0;
operator = -1;
updateDisplay();
}
if (target === "+/-") {
display_arg = display_arg * -1;
updateDisplay();
}
if (target === "%") {
display_arg = display_arg / 100;
updateDisplay();
}
}
function operate() {
if (operator === -1) {
return;
}
if (operator === 1) {
display_arg = secondary_arg + display_arg;
} else if (operator === 2) {
display_arg = secondary_arg - display_arg;
} else if (operator === 3) {
display_arg = secondary_arg * display_arg;
} else if (operator === 4) {
display_arg = secondary_arg / display_arg;
}
updateDisplay();
}
function assign_values() {
const number_buttons = document.querySelectorAll('.number');
for (var i = 0; i < number_buttons.length; i++) {
number_buttons[i].addEventListener("mousedown", button_num);
}
const operator_buttons = document.querySelectorAll('.operator');
for (var i = 0; i < operator_buttons.length; i++) {
operator_buttons[i].addEventListener("mousedown", button_operator);
}
const function_buttons = document.querySelectorAll('.function');
for (var i = 0; i < function_buttons.length; i++) {
function_buttons[i].addEventListener("mousedown", button_function);
}
}
assign_values();
```