final visual edits, getting graph tooltips looking good, double check…

…ing math
opulo-inc · Oct 29, 2023 · 20cdb68 · 20cdb68
1 parent fd0a0a8
commit 20cdb68
Show file tree

Hide file tree

Showing 10 changed files with 796 additions and 0 deletions.
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -0,0 +1,51 @@
+name: Deploy
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  build:
+    name: Build
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout repo
+        uses: actions/checkout@v3
+        with:
+          lfs: true
+
+      - name: Setup Node
+        uses: actions/setup-node@v3
+
+      - name: Install dependencies
+        uses: bahmutov/npm-install@v1
+
+      - name: Build project
+        run: npm run build
+
+      - name: Upload production-ready build files
+        uses: actions/upload-artifact@v3
+        with:
+          name: production-files
+          path: ./dist
+
+  deploy:
+    name: Deploy
+    needs: build
+    runs-on: ubuntu-latest
+    if: github.ref == 'refs/heads/main'
+
+    steps:
+      - name: Download artifact
+        uses: actions/download-artifact@v3
+        with:
+          name: production-files
+          path: ./dist
+
+      - name: Deploy to GitHub Pages
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: ./dist
diff --git a/dist/assets/index-5f549ff5.css b/dist/assets/index-5f549ff5.css
diff --git a/dist/assets/index-e442241e.js b/dist/assets/index-e442241e.js
diff --git a/dist/assets/opulo-black-alpha-f3ee483a.png b/dist/assets/opulo-black-alpha-f3ee483a.png
diff --git a/dist/index.html b/dist/index.html
@@ -0,0 +1,86 @@
+<!DOCTYPE html>
+<html>
+<head>
+
+<!-- Google Tag Manager -->
+
+    <title>LumenPnP Config Tool</title>
+
+    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+
+
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap" rel="stylesheet">
+
+
+
+
+    <link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
+    <link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
+    <link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
+    <link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
+    <link rel="manifest" href="site.webmanifest">
+    <link rel="mask-icon" href="safari-pinned-tab.svg" color="#5bbad5">
+    <meta name="msapplication-TileColor" content="#da532c">
+    <meta name="theme-color" content="#ffffff">
+  <script type="module" crossorigin src="./assets/index-e442241e.js"></script>
+  <link rel="stylesheet" href="./assets/index-5f549ff5.css">
+</head>
+<body>
+
+
+  <div id="output"></div>
+    <div id="background-pane">
+      <div id="menu">
+      <h1>LumenPnP - Pays For Itself</h1>
+      <p style="text-align:left;">This calculator determines how many boards it takes to break even on a LumenPnP purchase, and compares the boards produced per hour against hand-population. It makes a few assumptions:</p>
+      <ul>
+        <li>It takes approximately two hours to set up a LumenPnP for a job.</li>
+        <li>It takes about one minute to unload and load a board in the LumenPnP.</li>
+        <li>The LumenPnP is running at 1000 CPH</li>
+      </ul>
+      <br >
+      <div class="row">
+        <div class="col-left">
+          <h3>Operator Hourly Rate (in USD)</h3>
+          <input type="number" value="20" id="operator-rate"><br>
+        </div>
+        <div class="col-center">
+          <h3>Time to Hand-Assemble One Board (In Minutes)</h3>
+          <input type="number" value="45" id="hand-time"><br>
+        </div>
+        <div class="col-right">
+          <h3>Parts per Board</h3>
+          <input type="number" value="100" id="cpb"><br>
+        </div>
+      </div>
+
+    <br>
+
+    <div id="button-wrapper">
+      <button id="calculate-button">Calculate</button>
+    </div>
+
+    <canvas style="height:0px;" id="myChart"></canvas>
+
+    <div id="order"></div>
+
+    <canvas style="height:0px;" id="boardsChart"></canvas>
+
+    <div id="bph-result"></div>
+
+    </div>
+
+    </div>
+
+    <a href="https://www.opulo.io/"><div id="info">
+      <img style="width: 120px;" src="./assets/opulo-black-alpha-f3ee483a.png" />
+    </div></a>
+
+  </div>
+
+
+
+</body>
+</html>
diff --git a/index.html b/index.html
@@ -0,0 +1,84 @@
+<!DOCTYPE html>
+<html>
+<head>
+
+<!-- Google Tag Manager -->
+
+    <title>LumenPnP Config Tool</title>
+
+    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+    <script src="script.js" type="module"></script>
+
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap" rel="stylesheet">
+
+
+    <link rel="stylesheet" href="style.css">
+
+    <link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
+    <link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
+    <link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
+    <link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
+    <link rel="manifest" href="site.webmanifest">
+    <link rel="mask-icon" href="safari-pinned-tab.svg" color="#5bbad5">
+    <meta name="msapplication-TileColor" content="#da532c">
+    <meta name="theme-color" content="#ffffff">
+</head>
+<body>
+
+
+  <div id="output"></div>
+    <div id="background-pane">
+      <div id="menu">
+      <h1>LumenPnP - Pays For Itself</h1>
+      <p style="text-align:left;">This calculator determines how many boards it takes to break even on a LumenPnP purchase, and compares the boards produced per hour against hand-population. It makes a few assumptions:</p>
+      <ul>
+        <li>It takes approximately two hours to set up a LumenPnP for a job.</li>
+        <li>It takes about one minute to unload and load a board in the LumenPnP.</li>
+        <li>The LumenPnP is running at 1000 CPH</li>
+      </ul>
+      <br >
+      <div class="row">
+        <div class="col-left">
+          <h3>Operator Hourly Rate (in USD)</h3>
+          <input type="number" value="20" id="operator-rate"><br>
+        </div>
+        <div class="col-center">
+          <h3>Time to Hand-Assemble One Board (In Minutes)</h3>
+          <input type="number" value="45" id="hand-time"><br>
+        </div>
+        <div class="col-right">
+          <h3>Parts per Board</h3>
+          <input type="number" value="100" id="cpb"><br>
+        </div>
+      </div>
+
+    <br>
+
+    <div id="button-wrapper">
+      <button id="calculate-button">Calculate</button>
+    </div>
+
+    <canvas style="height:0px;" id="myChart"></canvas>
+
+    <div id="order"></div>
+
+    <canvas style="height:0px;" id="boardsChart"></canvas>
+
+    <div id="bph-result"></div>
+
+    </div>
+
+    </div>
+
+    <a href="https://www.opulo.io/"><div id="info">
+      <img style="width: 120px;" src="opulo-black-alpha.png" />
+    </div></a>
+
+  </div>
+
+
+
+</body>
+</html>
diff --git a/opulo-black-alpha.png b/opulo-black-alpha.png