Merge branch 'main' of git.odit.services:kauft.es/linkylinky-chrome

Reviewed-on: #6

.gitignore

@@ -3,6 +3,4 @@ node_modules
 
 **/tailwind.css
 dist
-*.zip
-# Fuck lockfiles :D
-*.lock
+*.zip

.woodpecker/build.yml

@@ -0,0 +1,20 @@
+steps:
+  - name: build latest
+    image: woodpeckerci/plugin-docker-buildx
+    settings:
+      repo: registry.odit.services/customers/gutfeel-web
+      tags:
+        - latest
+      registry: registry.odit.services
+      platforms: linux/amd64,linux/arm64
+      cache_from: registry.odit.services/customers/gutfeel-web:latest
+      username:
+        from_secret: odit-registry-builder-username
+      password:
+        from_secret: odit-registry-builder-password
+    secrets:
+      - source: odit-npm-cache-url
+        target: NPM_REGISTRY_URL
+when:
+  branch: main
+  event: push

.woodpecker/release.yml

@@ -1,40 +1,26 @@
----
-kind: secret
-name: gitea_token
-get:
-  path: odit-git-bot
-  name: apikey
-
----
-kind: pipeline
-type: kubernetes
-name: build:tag
-
-steps:
-  - name: build and package
-    depends_on: ["clone"]
-    image: registry.odit.services/hub/library/node:16-alpine3.14
-    commands:
-      - apk add git zip -f
-      - yarn
-      - yarn build
-      - yarn build:package
-  - name: gitea_release
-    depends_on: ["build and package"]
-    image: plugins/gitea-release
-    settings:
-      title: Release ${DRONE_TAG}
-      api_key:
-        from_secret: gitea_token
-      base_url: https://git.odit.services
-      files: linkylinky-chrome.zip
-      checksum:
-        - md5
-        - sha1
-        - sha256
-        - sha512
-        - adler32
-        - crc32
-trigger:
-  event:
-    - tag
+steps:
+  - name: build and package
+    image: registry.odit.services/hub/library/node:16-alpine3.14
+    commands:
+      - apk add git zip -f
+      - yarn
+      - yarn build
+      - yarn build:package
+  - name: gitea_release
+    image: plugins/gitea-release
+    settings:
+      title: Release ${DRONE_TAG}
+      api_key:
+        from_secret: odit-git-bot-apikey
+      base_url: https://git.odit.services
+      files: linkylinky-chrome.zip
+      checksum:
+        - md5
+        - sha1
+        - sha256
+        - sha512
+        - adler32
+        - crc32
+
+when:
+  event: tag

CHANGELOG.md

@@ -2,14 +2,56 @@
 
 All notable changes to this project will be documented in this file. Dates are displayed in UTC.
 
+#### [0.3.1](https://git.odit.services/kauft.es/linkylinky-chrome/compare/0.3.0...0.3.1)
+
+- Smol js fix (fuck html attribute names) [`371e74e`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/371e74ebb40ce07b41efebbcf3bdd6f5f507368a)
+- Readme update 4 roadmap [`318ebc7`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/318ebc7125f738f02d3a799d472ef2a652c629d1)
+
+#### [0.3.0](https://git.odit.services/kauft.es/linkylinky-chrome/compare/0.2.0...0.3.0)
+
+> 25 September 2021
+
+- Now w/ clientside switch [`00da368`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/00da368436bb03de628c002d473a220d95e4c984)
+- 🚀RELEASE 0.3.0 [`ccb22ba`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/ccb22bad6a5d79ead28620ebac7303896bb08b54)
+
+#### [0.2.0](https://git.odit.services/kauft.es/linkylinky-chrome/compare/0.1.2...0.2.0)
+
+> 25 September 2021
+
+- Extension users can now disable bot preview [`f389f88`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/f389f88825958beb3d74cb0d50a118435b40652e)
+- 🚀RELEASE 0.2.0 [`7cd4771`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/7cd4771fbc358ca4048cda2d1f09ffaf6d200ad3)
+- Added "docs" images [`595695f`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/595695fe4f4cb696a47d0e8177b51f4ded15ed5b)
+
+#### [0.1.2](https://git.odit.services/kauft.es/linkylinky-chrome/compare/0.1.1...0.1.2)
+
+> 21 August 2021
+
+- Better then resolution [`32196bb`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/32196bb8f2f64dc83ef4aeeb211c26a917b7bee2)
+- 🚀RELEASE 0.1.2 [`bada398`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/bada398877d99d380394eac4da8ee0b30c609022)
+
+#### [0.1.1](https://git.odit.services/kauft.es/linkylinky-chrome/compare/0.1.0...0.1.1)
+
+> 17 August 2021
+
+- Generated yarn lockfile [`2cfa268`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/2cfa268d3f7aba25ea1050bc3b9140bc9b241dda)
+- Updated readme [`3ffdac3`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/3ffdac301a836aba35a0464b5b776a367dc5cfb9)
+- 🚀RELEASE 0.1.1 [`b7232ed`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/b7232edc5000df383bff03480b21102ed5edc91b)
+- Now allowing lockfiles [`c7ed917`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/c7ed917d889086d75e8afc3e931cbaf4bbc8cffa)
+- Added cleanup script [`b82a05a`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/b82a05a1dffbe76a272d6b6f130e81332f0bb6c1)
+- finished dev script [`b4d17cb`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/b4d17cbd96fc9dc817cd9e445cbdb7d880d8d61f)
+- Updated readme [`348d801`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/348d801ceb052472f9fcfe4d5dd6b26356e66db9)
+
 #### 0.1.0
 
+> 17 August 2021
+
 - Just use the default tailwind [`8a07f0e`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/8a07f0efad02d5f377ad8856d181170cd8d61e5d)
 - Added script for generating tailwind css file [`d3365f4`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/d3365f42f41e50cb1e0a174c3b46344e1468a4dd)
 - Split of js to comply with chrome [`78af0c8`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/78af0c8c7232707bec1d65dcbc1ac144b45598d0)
 - Added error alert [`e308b7b`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/e308b7b4486499d265b189c26370854b1c5a8614)
 - Added basic function for handling errors [`94b3899`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/94b38993e98363b25be97e71928ebf8e41fe4646)
 - Init [`531ebe8`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/531ebe8131c4f4ebecc94759a81e758114c49900)
+- 🚀RELEASE 0.1.0 [`60af64a`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/60af64a7c04f34b19918232dfe29673e8016de86)
 - Working in browser [`fe93746`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/fe937465bd3512eb7bc6dfe7dd47eb9307b8b486)
 - Fixed getting query urls [`06fa44f`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/06fa44f2bf4e57d2c85248104fe7c9d94d48d7bd)
 - Added build pipeline [`66ecf81`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/66ecf81556afe3cb6857dce3b9412353aa4961bc)

README.md

@@ -4,8 +4,12 @@
   <h3 align="center">A simple, privacy focused urls shortner</h3>
 </p>
 
-<!-- ## 👀 Preview
-TODO: -->
+## 👀 Preview
+<img height="300" src="./docs/fullpage_opened.webp">
+<img height="300" src="./docs/fullpage_created.webp">
+<img height="150" src="./docs/extension_opened.webp">
+<img height="150" src="./docs/extension_created.webp">
+<img height="400" src="./docs/fullpage_copy.webp">
 
 ## ⚡ Installation
 - Download the `linkylinky-chrome.zip` from [the lastest release](https://git.odit.services/kauft.es/linkylinky-chrome/releases)
@@ -15,6 +19,38 @@ TODO: -->
 - Click on `Load Unpacked` in the top left
 - Select the unziped folder ("linkylinky-chrome")
 
+## 🛠 Dev Setup 
+> Runs on port 3000
+
+#### Yarn
+```bash
+yarn
+yarn dev
+```
+
+#### NPM
+```bash
+npm i
+npm run dev
+```
+
+## 🚢 Build 
+#### Yarn
+```bash
+yarn
+yarn build
+# Optional to create the zip
+yarn build:package
+```
+
+#### NPM
+```bash
+npm i
+npm run build
+# Optional to create the zip
+npm run build:package
+```
+
 ## 🏴 Roadmap/ Progress
 - [x] Basic README
 - [x] Publish to git
@@ -24,9 +60,17 @@ TODO: -->
     - [x] Copy shorturl to deskop
     - [x] Notify on copy
     - [x] Generate another url
-- [ ] Project Logo™
+    - [x] Disable bot crawling/chat preview on demand
+    - [x] Use clientside redirect w/ animation
+- [x] Provide different url
+- [x] Project Logo™
 - [x] Basic error handling
 - [x] Finalize styling
+- [x] Advanced project stuff
+  - [x] Purge delivered css
+  - [x] Build script
+  - [x] Automagic builds via drone
+  - [x] Delivery as zip
 
 ## Credits
 * ClipboardJS by Zeno Rocha licensed under MIT - Website: https://clipboardjs.com/ - Repo: https://github.com/zenorocha/clipboard.js

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@odit/linkylinky-chrome",
-  "version": "0.1.0",
+  "version": "0.3.1",
   "license": "MIT",
   "private": false,
   "author": {
@@ -21,15 +21,17 @@
     "build:copy": "cpx './src/*' './dist/'",
     "build:css": "tailwindcss -o ./dist/tailwind.css --purge ./dist/index.html -m",
     "build:package": "cross-zip dist linkylinky-chrome.zip",
-    "dev": "tailwindcss -o ./src/tailwind.css",
-    "release": "release-it"
+    "dev": "tailwindcss -o ./src/tailwind.css && live-server ./src",
+    "release": "release-it",
+    "cleanup": "rimraf ./dist ./linkylinky-chrome.zip ./src/tailwind.css"
   },
   "devDependencies": {
     "cpx": "^1.5.0",
     "cross-zip-cli": "^1.0.0",
-    "release-it": "^14.11.5",
+    "live-server": "^1.2.1",
+    "release-it": "^15.0.0",
     "rimraf": "^3.0.2",
-    "tailwindcss": "^2.2.7"
+    "tailwindcss": "^3.0.0"
   },
   "release-it": {
     "git": {

renovate.json

@@ -0,0 +1,16 @@
+{
+  "$schema": "https://docs.renovatebot.com/renovate-schema.json",
+  "dependencyDashboard": true,
+  "baseBranches": [
+    "main"
+  ],
+  "addLabels": [
+    "status:review_needed",
+    "enhancement",
+    "priority:medium"
+  ],
+  "reviewers": [
+    "niggl",
+    "philipp"
+  ]
+}

src/index.html

@@ -13,6 +13,19 @@
 		}
 	</style>
 </head>
+<style>
+	/* CHECKBOX TOGGLE SWITCH */
+	/* @apply rules for documentation, these do not work as inline style */
+	.toggle-checkbox:checked {
+	  @apply: right-0 border-green-400;
+	  right: 0;
+	  border-color: #68D391;
+	}
+	.toggle-checkbox:checked + .toggle-label {
+	  @apply: bg-green-400;
+	  background-color: #68D391;
+	}
+	</style>
 
 <body>
 	<div class="p-4 flex items-center justify-center bg-white">
@@ -69,6 +82,24 @@
 						placeholder="custom url" />
 				</div>
 			</div>
+			<div id="bot_container">
+				<div class="mt-1 flex rounded-md shadow-sm">
+					<label for="toggle" class="text-base text-gray-700 pr-2">Disable Preview:</label>
+					<div class="relative inline-block w-10 mr-2 align-middle select-none transition duration-200 ease-in">
+						<input type="checkbox" name="toggle" id="bot_toggle" class="toggle-checkbox absolute block w-6 h-6 rounded-full bg-white border-4 appearance-none cursor-pointer"/>
+						<label for="toggle" class="toggle-label block overflow-hidden h-6 rounded-full bg-gray-300 cursor-pointer"></label>
+					</div>
+				</div>
+			</div>
+			<div id="clientside_container">
+				<div class="mt-1 flex rounded-md shadow-sm">
+					<label for="toggle" class="text-base text-gray-700 pr-2">Clientside Redirect:</label>
+					<div class="relative inline-block w-10 mr-2 align-middle select-none transition duration-200 ease-in">
+						<input type="checkbox" name="toggle" id="clientside_toggle" class="toggle-checkbox absolute block w-6 h-6 rounded-full bg-white border-4 appearance-none cursor-pointer"/>
+						<label for="toggle" class="toggle-label block overflow-hidden h-6 rounded-full bg-gray-300 cursor-pointer"></label>
+					</div>
+				</div>
+			</div>
 			<div class="hidden" name="shorturl_container" id="shorturl_container">
 				<div class="inline-flex w-full" id="shorturl_copy" data-clipboard-target="#shorturl">
 					<p name="shorturl" id="shorturl" class:bg-green-200={copied}

src/main.js

@@ -25,7 +25,9 @@ document.getElementById("create").onclick = createUrl;
 function createUrl() {
     let shorturl = {
         target: document.getElementById("target").value,
-        shortcode: document.getElementById("shortcode").value
+        shortcode: document.getElementById("shortcode").value,
+        no_preview: document.getElementById("bot_toggle").checked,
+        clientside: document.getElementById("clientside_toggle").checked
     };
 
     if (shorturl.shortcode == "" | !shorturl.shortcode) {
@@ -44,16 +46,19 @@ function createUrl() {
                 handleError(res);
             }
             else {
-                res.json()
+                res.json().then(res => {
+                    document.getElementById("shorturl").innerText = res.url;
+                    document.getElementById("shorturl_container").className = "";
+                    document.getElementById("target_container").className = "hidden";
+                    document.getElementById("shortcode_container").className = "hidden";
+                    document.getElementById("bot_container").classList.add("hidden");
+                    document.getElementById("clientside_container").classList.add("hidden");
+                    document.getElementById("create").classList.add("hidden");
+                    document.getElementById("reset").classList.remove("hidden");
+                    document.getElementById("bot_toggle").checked = false;
+                    document.getElementById("clientside_toggle").checked = false;
+                });
             }
-        })
-        .then(res => {
-            document.getElementById("shorturl").innerText = res.url;
-            document.getElementById("shorturl_container").className = "";
-            document.getElementById("target_container").className = "hidden";
-            document.getElementById("shortcode_container").className = "hidden";
-            document.getElementById("create").classList.add("hidden");
-            document.getElementById("reset").classList.remove("hidden");
         });
 
 }
@@ -95,6 +100,10 @@ function reset() {
         document.getElementById("target").value = tabs[0].url;
         document.getElementById("target_container").className = "";
         document.getElementById("shortcode_container").className = "";
+        document.getElementById("bot_container").classList.remove("hidden");
+        document.getElementById("bot_container").value = false;
+        document.getElementById("clientside_container").classList.remove("hidden");
+        document.getElementById("clientside_container").value = false;
         document.getElementById("create").classList.remove("hidden");
     });
 }