🚀RELEASE 0.2.0

.gitignore

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

CHANGELOG.md

@@ -2,14 +2,41 @@
 
 All notable changes to this project will be documented in this file. Dates are displayed in UTC.
 
+#### [0.2.0](https://git.odit.services/kauft.es/linkylinky-chrome/compare/0.1.2...0.2.0)
+
+- Extension users can now disable bot preview [`f389f88`](https://git.odit.services/kauft.es/linkylinky-chrome/commit/f389f88825958beb3d74cb0d50a118435b40652e)
+- 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,15 @@ TODO: -->
     - [x] Copy shorturl to deskop
     - [x] Notify on copy
     - [x] Generate another url
+- [x] Provide different url
 - [ ] 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.2.0",
   "license": "MIT",
   "private": false,
   "author": {
@@ -21,12 +21,14 @@
     "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",
+    "live-server": "^1.2.1",
     "release-it": "^14.11.5",
     "rimraf": "^3.0.2",
     "tailwindcss": "^2.2.7"

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,15 @@
 						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 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,8 @@ 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").value
     };
 
     if (shorturl.shortcode == "" | !shorturl.shortcode) {
@@ -44,17 +45,17 @@ function createUrl() {
                 handleError(res);
             }
             else {
-                res.json()
-            }
-        })
-        .then(res => {
+                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("create").classList.add("hidden");
                     document.getElementById("reset").classList.remove("hidden");
                 });
+            }
+        });
 
 }