From 56044082443aed136a82d12ac041e5348c187968 Mon Sep 17 00:00:00 2001
From: Marcus Noble <github@marcusnoble.co.uk>
Date: Fri, 26 Jan 2024 13:47:41 +0000
Subject: [PATCH] Initial commit

Signed-off-by: Marcus Noble <github@marcusnoble.co.uk>
---
 .gitignore     | 172 +++++++++++++++++++++++++++++++++++++++++++++++++
 Dockerfile     |   3 +
 LICENSE        |  19 ++++++
 Makefile       |  32 +++++++++
 README.md      |   3 +
 src/index.html |  40 ++++++++++++
 src/script.js  |  55 ++++++++++++++++
 src/style.css  | 120 ++++++++++++++++++++++++++++++++++
 8 files changed, 444 insertions(+)
 create mode 100644 .gitignore
 create mode 100644 Dockerfile
 create mode 100644 LICENSE
 create mode 100644 Makefile
 create mode 100644 README.md
 create mode 100644 src/index.html
 create mode 100644 src/script.js
 create mode 100644 src/style.css

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..67d7404
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,172 @@
+lib.wasm
+
+### Git ###
+# Created by git for backups. To disable backups in Git:
+# $ git config --global mergetool.keepBackup false
+*.orig
+
+# Created by git when using merge tools for conflicts
+*.BACKUP.*
+*.BASE.*
+*.LOCAL.*
+*.REMOTE.*
+*_BACKUP_*.txt
+*_BASE_*.txt
+*_LOCAL_*.txt
+*_REMOTE_*.txt
+
+### Go ###
+# Binaries for programs and plugins
+*.exe
+*.exe~
+*.dll
+*.so
+*.dylib
+
+# Test binary, built with `go test -c`
+*.test
+
+# Output of the go coverage tool, specifically when used with LiteIDE
+*.out
+
+# Dependency directories (remove the comment below to include it)
+# vendor/
+
+### Go Patch ###
+/vendor/
+/Godeps/
+
+### Node ###
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# TypeScript v1 declaration files
+typings/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+.env.test
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+
+# next.js build output
+.next
+
+# nuxt.js build output
+.nuxt
+
+# rollup.js default build output
+dist/
+
+# Storybook build outputs
+.out
+.storybook-out
+
+# vuepress build output
+.vuepress/dist
+
+# Serverless directories
+.serverless/
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+
+# Temporary folders
+tmp/
+temp/
+
+# VSCode
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+*.code-workspace
+.history/
+
+# MacOS
+# General
+.DS_Store
+.AppleDouble
+.LSOverride
+
+# 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
diff --git a/Dockerfile b/Dockerfile
new file mode 100644
index 0000000..61b1d3d
--- /dev/null
+++ b/Dockerfile
@@ -0,0 +1,3 @@
+FROM nginx:1.25-alpine-slim
+
+COPY src /usr/share/nginx/html
diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000..2955198
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,19 @@
+MIT License Copyright (c) 2020 - present Marcus Noble
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is furnished
+to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice (including the next
+paragraph) shall be included in all copies or substantial portions of the
+Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS
+OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF
+OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
diff --git a/Makefile b/Makefile
new file mode 100644
index 0000000..4103543
--- /dev/null
+++ b/Makefile
@@ -0,0 +1,32 @@
+.DEFAULT_GOAL := default
+
+IMAGE ?= rg.fr-par.scw.cloud/averagemarcus/devstats-viewer:latest
+
+export DOCKER_CLI_EXPERIMENTAL=enabled
+
+.PHONY: build # Build the project
+build: lint check-format fetch-deps
+	@go build -o kube-image-prefetch main.go
+
+.PHONY: docker-build # Build the docker image
+docker-build:
+	@docker build -t $(IMAGE) .
+
+.PHONY: docker-publish # Push the docker image to the remote registry
+docker-publish:
+	@docker push $(IMAGE)
+
+.PHONY: release # Release the latest version of the application
+release:
+	kubectl --namespace devstats-viewer set image deployment devstats-viewer web=rg.fr-par.scw.cloud/averagemarcus/devstats-viewer:$(SHA)
+
+.PHONY: help # Show this list of commands
+help:
+	@echo "kube-image-prefetch"
+	@echo "Usage: make [target]"
+	@echo ""
+	@echo "target	description" | expand -t20
+	@echo "-----------------------------------"
+	@grep '^.PHONY: .* #' Makefile | sed 's/\.PHONY: \(.*\) # \(.*\)/\1	\2/' | expand -t20
+
+default: test
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..250c414
--- /dev/null
+++ b/README.md
@@ -0,0 +1,3 @@
+# devstats-viewer
+
+Discover your CNCF devstats score based on your GitHub username
diff --git a/src/index.html b/src/index.html
new file mode 100644
index 0000000..e670028
--- /dev/null
+++ b/src/index.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
+
+    <title>Devstats!</title>
+
+    <link rel="stylesheet" href="/style.css" />
+    <script src="/script.js" defer></script>
+  </head>
+  <body>
+    <div class="wrapper">
+      <div class="content" role="main">
+        <h1 class="title">Devstats!</h1>
+        
+        <p>
+          Enter your GitHub username to find your CNCF devstats score.
+        </p>
+        
+        <div>
+          <label>GitHub Username: <input name="github" id="github" autocomplete="off" data-lpignore="true" /></label>
+          <button id="find">Find</button>
+        </div>
+        
+        <div id="status"></div>
+        
+        <div id="result"></div>
+        <details id="rawResultsWrapper" class="hidden">
+          <summary>Raw results</summary>
+          <pre id="rawResults"></pre>
+        </details>
+      </div>
+    </div>
+
+    <footer class="footer">
+      Made with 💙 by <a href="https://marcusnoble.com">Marcus Noble</a>
+    </footer>
+  </body>
+</html>
diff --git a/src/script.js b/src/script.js
new file mode 100644
index 0000000..92f6578
--- /dev/null
+++ b/src/script.js
@@ -0,0 +1,55 @@
+const btn = document.querySelector("#find");
+const gh = document.querySelector("#github");
+const result = document.querySelector("#result");
+const status = document.querySelector("#status");
+
+const rawResultsWrapper = document.querySelector("#rawResultsWrapper");
+const rawResults = document.querySelector("#rawResults");
+
+function find() {
+  let user = gh.value.toLowerCase();
+  if (user != "") {
+    statusUpdate(`Fetching devstat score for '${user}'`, "info");
+    rawResultsWrapper.classList.add('hidden');
+    fetch("https://devstats.cncf.io/api/v1", {
+      method: "POST",
+      mode: "cors",
+      cache: "no-cache",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      redirect: "follow",
+      body: "{\"api\":\"DevActCnt\",\"payload\":{\"project\":\"all\",\"range\":\"Last decade\",\"metric\":\"Contributions\",\"repository_group\":\"All\",\"country\":\"All\",\"github_id\":\"" + user + "\",\"bg\":\"\"}}",
+    })
+    .then(res => res.json())
+    .then(data => {
+      statusUpdate("", "info");
+      let score = data.number[0];
+      if (score) {
+        result.innerHTML = score; 
+        rawResults.innerText = JSON.stringify(data, "", 2)
+        rawResultsWrapper.classList.remove('hidden');
+      } else {
+        statusUpdate(`Failed to get devstat score for '${user}'`, "error");
+      }
+    })
+    .catch(err => {
+      statusUpdate(`Failed to get devstat score for '${user}'`, "error");
+      console.log(err);
+    });
+  }
+}
+
+function statusUpdate(msg, statusClass) {
+  console.log(msg);
+  status.innerText = msg;
+  status.className = statusClass;
+}
+
+gh.onkeypress = function(event) {
+  if (event.keyCode == 13) {
+    find();
+  }
+}
+
+btn.onclick = find;
\ No newline at end of file
diff --git a/src/style.css b/src/style.css
new file mode 100644
index 0000000..4d577fe
--- /dev/null
+++ b/src/style.css
@@ -0,0 +1,120 @@
+:root {
+  --color-bg: #FFFFFF;
+  --color-text-main: #000000;
+  --color-primary: #326CE5;
+  --wrapper-height: 87vh;
+  --image-max-width: 300px;
+  --image-margin: 3rem;
+  --font-family: "HK Grotesk";
+  --font-family-header: "HK Grotesk";
+}
+
+/* Basic page style resets */
+* {
+  box-sizing: border-box;
+}
+[hidden], .hidden {
+  display: none !important;
+}
+
+/* Import fonts */
+@font-face {
+  font-family: HK Grotesk;
+  src: url("https://cdn.glitch.me/605e2a51-d45f-4d87-a285-9410ad350515%2FHKGrotesk-Regular.otf?v=1603136326027")
+    format("opentype");
+}
+@font-face {
+  font-family: HK Grotesk;
+  font-weight: bold;
+  src: url("https://cdn.glitch.me/605e2a51-d45f-4d87-a285-9410ad350515%2FHKGrotesk-Bold.otf?v=1603136323437")
+    format("opentype");
+}
+
+html,
+body {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+
+body {
+  font-family: HK Grotesk;
+  background-color: var(--color-bg);
+  color: var(--color-text-main);
+}
+
+/* Page structure */
+.wrapper {
+  min-height: var(--wrapper-height);
+  display: grid;
+  place-items: center;
+  margin: 0 1rem;
+}
+.content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+
+/* Very light scaling for our illustration */
+.title {
+  color: var(--color-primary);
+  font-family: HK Grotesk;
+  font-style: normal;
+  font-weight: bold;
+  font-size: 90px;
+  line-height: 105%;
+  margin: 0;
+}
+
+footer {
+  text-align: center;
+  font-family: HK Grotesk;
+  font-weight: light;
+  font-size: 0.8em;
+}
+
+label {
+  font-weight: bold;
+}
+
+button,
+input {
+  font-family: inherit;
+  font-size: 100%;
+  background: #FFFFFF;
+  border: 1px solid #000000;
+  box-sizing: border-box;
+  border-radius: 4px;
+  padding: 0.5rem 1rem;
+  transition: 500ms;
+  display: inline-block;
+}
+
+#status {
+  height: 22px;
+  margin: 8px;
+}
+
+#status.info {
+  color: blue;
+}
+#status.error {
+  color: red;
+}
+
+#result {
+  color: var(--color-primary);
+  font-family: HK Grotesk;
+  font-style: normal;
+  font-weight: bold;
+  font-size: 70px;
+  margin: 0.5em;
+  height: 100px;
+}
+
+#rawResultsWrapper {
+  max-width: 90vw;
+  overflow-x: scroll;
+}
\ No newline at end of file