Initial commit

rc1 · Jul 24, 2024 · 5f063e8 · 5f063e8
1 parent 94e5e46
commit 5f063e8
Show file tree

Hide file tree

Showing 30 changed files with 1,155 additions and 707 deletions.
diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml
@@ -0,0 +1,57 @@
+.gitname: Deploy on server
+
+on:
+  push:
+    branches:
+      - main
+
+permissions:
+  contents: read
+  packages: write
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      # - name: Free Disk Space - Ubuntu Runners
+      #   uses: endersonmenezes/free-disk-space@v2
+      #   with:
+      #     remove_android: true #64s~79s
+      #     remove_dotnet: true #1s-2s
+      #     remove_haskell: true #3s-5s
+      #     remove_tool_cache: true #4s-6s
+
+      - name: Checkout Repository
+        uses: actions/checkout@v2
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v1
+
+      - name: Login to GitHub Container Registry
+        uses: docker/login-action@v2
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Build and Push Docker Image
+        run: |
+          docker buildx build --push --file Dockerfile --tag ghcr.io/rc1/high-or-low-game:latest .
+  deploy:
+    runs-on: self-hosted
+    needs: build
+    steps:
+      - name: Checkout Repository
+        uses: actions/checkout@v2
+
+      - name: Login to GitHub Container Registry
+        run: |
+          echo ${{ secrets.GITHUB_TOKEN }} | docker login ghcr.io -u ${{ github.actor }} --password-stdin
+
+      - name: Pull and Run Docker Image with Docker Compose
+        run: |
+          cd /home/ross/datadrive/docker-high-or-low-game/repo
+          git pull origin main
+          docker compose pull
+          docker compose down
+          docker compose up -d
diff --git a/Dockerfile b/Dockerfile
@@ -0,0 +1,13 @@
+# Step 1: Build the application
+FROM node:21.7.3 AS builder
+WORKDIR /app
+COPY package.json package-lock.json ./
+RUN npm clean-install
+
+COPY . .
+RUN npm install
+RUN npm run build
+
+# Step 2: Set up the production environment
+FROM nginx
+COPY --from=builder /app/dist /usr/share/nginx/html
diff --git a/LICENSE b/LICENSE
@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2024 high-or-low
+Copyright (c) 2024 Ross Cairns
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

diff --git a/README.md b/README.md
@@ -1,3 +1,15 @@
+# High or Low Game
+
+A quick, **dirty**, and ugly exportation of:
+
+1. Open WC typescript, LitElement, Web Components starter app project generator. Often a little verbose to explore all the key concepts and approaches of the generator template. Quick dip into Web Audio and Streams API. 
+2. A game designed to help my kids articulate the concept of higher or lower pitch in sound. As a child, no one explained this to me, and I remember not being offered music lessons at a Scottish primary school 🥲 simply because I couldn't yet match the words to the concept.
+3. It is not that great a game... so I will leave as is. 
+4. It is made it for my mobile screen.
+5. It talks (one kid is to young to read).
+
+------
+
 <p align="center">
   <img width="200" src="https://open-wc.org/hero.png"></img>
 </p>

diff --git a/docker-compose.yml b/docker-compose.yml
@@ -0,0 +1,20 @@
+version: '3.8'
+
+services:
+  sketchbook-js:
+    image: ghcr.io/rc1/high-or-low-game:latest
+   ports:
+     - "8080:80"
+    restart: always
+    networks:
+      - web
+    labels:
+      - traefik.http.routers.high-or-low-game.rule=Host(`high-or-low-game.electricglen.com`)
+      - traefik.enable=true
+      - traefik.http.routers.high-or-low-game.tls=true
+      - traefik.http.routers.high-or-low-game.tls.certresolver=lets-encrypt
+      - traefik.port=80
+
+networks:
+  web:
+    external: true
diff --git a/index.html b/index.html
@@ -4,28 +4,34 @@
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
-  <meta name="Description" content="Put your description here.">
+  <meta name="Description" content="High or Low Game">
   <base href="/">
-
   <style>
     html,
     body {
       margin: 0;
       padding: 0;
       font-family: sans-serif;
       background-color: #ededed;
+      width: 100%;
+      height: 100%;
+      color: white;
+    }
+
+    high-or-low-game {
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      left: 0;
+      right: 0;
     }
   </style>
   <title>high-or-low</title>
 </head>
 
 <body>
   <high-or-low-game></high-or-low-game>
-
-  <script type="module" src="./out-tsc/src/high-or-low-game.js"></script>
-  <!-- <script type="module" src="./out-tsc/src/app-header.js"></script>
-  <script type="module" src="./out-tsc/src/app.js"></script> -->
-
+  <script type="module" src="./out-tsc/src/web-components/high-or-low-game.js"></script>
 </body>
 
 </html>
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -19,6 +19,7 @@
     "start": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"web-dev-server\""
   },
   "dependencies": {
+    "@rollup/plugin-url": "^8.0.2",
     "lit": "^3.1.4"
   },
   "devDependencies": {

diff --git a/src/app-header.ts b/src/app-header.ts