urlmskr

Axorax · Jun 26, 2024 · 88a802d · 88a802d
commit 88a802d
Show file tree

Hide file tree

Showing 21 changed files with 820 additions and 0 deletions.
diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml
@@ -0,0 +1 @@
+patreon: axorax
diff --git a/.github/workflows/clear_deploys.yml b/.github/workflows/clear_deploys.yml
@@ -0,0 +1,16 @@
+name: clear_deploys
+
+on: push
+
+jobs:
+  deldep:
+    runs-on: ubuntu-latest
+    permissions: write-all
+
+    steps:
+      - name: Delete deployment
+        uses: strumwolf/delete-deployment-environment@v2
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          environment: github-pages
+          onlyRemoveDeployments: true
diff --git a/404.html b/404.html
@@ -0,0 +1,34 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="shortcut icon" href="./favicon.svg" type="image/x-icon" />
+    <title>urlmskr</title>
+  </head>
+  <body>
+    <script>
+      const decoded = window.location.href.replace(
+        "https://axorax.github.io/urlmskr/",
+        "",
+      );
+
+      if (decoded.toLowerCase().endsWith("+reveal")) {
+        document.head.innerHTML += '<link rel="stylesheet" href="./style.css">';
+        document.body.innerHTML = `
+          <div class="reveal center">
+              <div>
+                  <div class="top">This URL redirects to:</div>
+                  <div class="destination">${window.atob(
+                    decoded.slice(0, -7),
+                  )}</div>
+              </div>
+          </div>  
+        `;
+      } else {
+        window.location.replace(window.atob(decoded));
+      }
+    </script>
+  </body>
+</html>
diff --git a/README.md b/README.md
@@ -0,0 +1,36 @@
+<p align="center"><img src="./urlmskr.svg"></p>
+
+<p align="center"><a href="./README.md">English</a> — <a href="./README_zh.md">中文</a> — <a href="./README_bn.md">বাংলা</a> — <a href="./README_bn.md">عربي</a> — <a href="./README_es.md">español</a></p>
+
+# ❓ About
+
+urlmskr lets you mask links and send encoded messages by changing a link to one that can't be easily read but still redirects to the original. It runs entirely on the frontend, requires no backend server, and stores no data. You can host it anywhere. Support the project on [Patreon!](https://www.patreon.com/axorax) <3
+
+# 🤔 Why?
+
+Using a tool like urlmskr allows you to send a link without revealing the destination site. However, this could lead to receiving links to unwanted sites. To reveal the destination, simply add `+reveal` at the end of the URL. For example: `https://axorax.github.io/urlmskr/hello69+reveal`.
+
+# 💻 Integrate with your project
+
+urlmskr includes libraries for various programming languages in the root directory, named `lib` with the respective language extension. You can paste or import the code into your project. Here’s how to use the JavaScript library:
+
+```html
+<!doctype html>
+<html lang="en">
+  <head>
+    <title>Example</title>
+  </head>
+  <body>
+    <script src="https://axorax.github.io/urlmskr/lib.js"></script>
+    <script>
+      document.write(urlmskr.mask("https://axorax.github.io")); // Mask URL
+      document.write("<br>"); // Add empty line
+      document.write(urlmskr.mask("Hello", "text")); // Mask text
+    </script>
+  </body>
+</html>
+```
+
+---
+
+<p align="center"><a href="https://www.patreon.com/axorax">Support me on Patreon</a> — <a href="https://github.com/axorax/socials">Check out my socials</a></p>
diff --git a/README_ar.md b/README_ar.md
@@ -0,0 +1,39 @@
+<p align="center"><img src="./urlmskr.svg"></p>
+
+<p align="center"><a href="./README.md">English</a> — <a href="./README_zh.md">中文</a> — <a href="./README_bn.md">বাংলা</a> — <a href="./README_bn.md">عربي</a> — <a href="./README_es.md">español</a></p>
+
+> [!IMPORTANT]  
+> هذه ترجمة تقريبية وقد لا تكون دقيقة.
+
+# ❓ نبذة عن
+
+يتيح لك urlmskr إخفاء الروابط وإرسال رسائل مشفرة عن طريق تغيير الرابط إلى رابط لا يمكن قراءته بسهولة ولكن مع ذلك يعيد التوجيه إلى الرابط الأصلي. يعمل بالكامل على الواجهة الأمامية، ولا يتطلب خادمًا خلفيًا، ولا يخزن أي بيانات. يمكنك استضافته في أي مكان. ادعم المشروع على [Patreon!](https://www.patreon.com/axorax) <3
+
+# 🤔 لماذا؟
+
+يسمح لك استخدام أداة مثل urlmskr بإرسال رابط دون الكشف عن الموقع الوجهة. ومع ذلك، قد يؤدي ذلك إلى تلقي روابط لمواقع غير مرغوب فيها. وللكشف عن الوجهة، ما عليك سوى إضافة `+reveal` في نهاية عنوان URL. على سبيل المثال: `https://axorax.github.io/urlmskr/hello69+reveal`.
+
+# 💻 التكامل مع مشروعك
+
+يتضمن urlmskr مكتبات للغات البرمجة المختلفة في الدليل الجذر، باسم `lib` مع امتداد اللغة المعنية. يمكنك لصق أو استيراد التعليمات البرمجية في مشروعك. إليك كيفية استخدام مكتبة JavaScript:
+
+```html
+<!doctype html>
+<html lang="en">
+  <head>
+    <title>مثال على ذلك</title>
+  </head>
+  <body>
+    <script src="https://axorax.github.io/urlmskr/lib.js"></script>
+    <script>
+      document.write(urlmskr.mask("https://axorax.github.io")); // عنوان URL للقناع
+      document.write("<br>"); // إضافة سطر فارغ
+      document.write(urlmskr.mask("Hello", "text")); // نص القناع
+    </script>
+  </body>
+</html>
+```
+
+---
+
+<p align="center"><a href="https://www.patreon.com/axorax">ادعمني على Patreon</a> — <a href="https://github.com/axorax/socials">تحقق من حساباتي الاجتماعية</a></p>
diff --git a/README_bn.md b/README_bn.md
@@ -0,0 +1,39 @@
+<p align="center"><img src="./urlmskr.svg"></p>
+
+<p align="center"><a href="./README.md">English</a> — <a href="./README_zh.md">中文</a> — <a href="./README_bn.md">বাংলা</a> — <a href="./README_bn.md">عربي</a> — <a href="./README_es.md">español</a></p>
+
+> [!IMPORTANT]  
+> এটি একটি মোটামুটি অনুবাদ এবং সঠিক নাও হতে পারে। আমি বাংলা জানি কিন্তু প্রুফরিড করার সময় পাইনি।
+
+# ❓ সম্পর্কিত
+
+urlmskr আপনাকে লিঙ্ক মাস্ক করতে দেয় এবং একটি লিঙ্ক পরিবর্তন করে এনকোড করা বার্তা পাঠাতে দেয় যা সহজে পড়া যায় না, তবুও মূলে পুনঃনির্দেশিত হয়। এটি সম্পূর্ণরূপে ফ্রন্টএন্ডে চলে, কোন ব্যাকএন্ড সার্ভারের প্রয়োজন হয় না এবং কোন ডেটা সঞ্চয় করে না। আপনি যে কোন জায়গায় এটি হোস্ট করতে পারেন. [Patreon!](https://www.patreon.com/axorax) <3 এ প্রকল্পকে সমর্থন করুন
+
+# 🤔 কেন?
+
+urlmskr এর মতো একটি টুল ব্যবহার করে আপনি গন্তব্য সাইটটি প্রকাশ না করে একটি লিঙ্ক পাঠাতে পারবেন। যাইহোক, এর ফলে অবাঞ্ছিত সাইটের লিঙ্ক পাওয়া যেতে পারে। গন্তব্য প্রকাশ করতে, URL-এর শেষে শুধু `+reveal` যোগ করুন। যেমন: `https://axorax.github.io/urlmskr/hello69+reveal`।
+
+# 💻 আপনার প্রকল্পের সাথে সংহত করুন
+
+urlmskr রুট ডিরেক্টরিতে বিভিন্ন প্রোগ্রামিং ভাষার জন্য লাইব্রেরি অন্তর্ভুক্ত করে, যার নাম `lib` সংশ্লিষ্ট ভাষা এক্সটেনশন সহ। আপনি আপনার প্রকল্পে কোড পেস্ট বা আমদানি করতে পারেন। জাভাস্ক্রিপ্ট লাইব্রেরি কীভাবে ব্যবহার করবেন তা এখানে:
+
+```html
+<!doctype html>
+<html lang="en">
+  <head>
+    <title>উদাহরণ</title>
+  </head>
+  <body>
+    <script src="https://axorax.github.io/urlmskr/lib.js"></script>
+    <script>
+      document.write(urlmskr.mask("https://axorax.github.io")); // মাস্ক URL
+      document.write("<br>"); // খালি লাইন যোগ করুন
+      document.write(urlmskr.mask("Hello", "text")); // মাস্ক পাঠ্য
+    </script>
+  </body>
+</html>
+```
+
+---
+
+<p align="center"><a href="https://www.patreon.com/axorax">Patreon এ আমাকে সমর্থন করুন</a> — <a href="https://github.com/axorax/socials">আমার সামাজিক চেক আউট করুন</a></p>
diff --git a/README_es.md b/README_es.md
@@ -0,0 +1,39 @@
+<p align="center"><img src="./urlmskr.svg"></p>
+
+<p align="center"><a href="./README.md">English</a> — <a href="./README_zh.md">中文</a> — <a href="./README_bn.md">বাংলা</a> — <a href="./README_bn.md">عربي</a> — <a href="./README_es.md">español</a></p>
+
+> [!IMPORTANT]  
+> Esta es una traducción aproximada y puede no ser exacta.
+
+# ❓ Acerca de
+
+urlmskr permite enmascarar enlaces y enviar mensajes codificados cambiando un enlace por otro que no pueda leerse fácilmente pero que redirija al original. Se ejecuta completamente en el frontend, no requiere servidor backend y no almacena datos. Puedes alojarlo en cualquier sitio. Apoya el proyecto en [Patreon!](https://www.patreon.com/axorax) <3
+
+# 🤔 ¿Por qué?
+
+Utilizar una herramienta como urlmskr permite enviar un enlace sin revelar el sitio de destino. Sin embargo, esto podría llevar a recibir enlaces a sitios no deseados. Para revelar el destino, basta con añadir `+reveal` al final de la URL. Por ejemplo: `https://axorax.github.io/urlmskr/hello69+reveal`.
+
+# 💻 Integración en su proyecto
+
+urlmskr incluye librerías para varios lenguajes de programación en el directorio raíz, llamadas `lib` con la extensión del lenguaje respectivo. Puede pegar o importar el código en su proyecto. A continuación se explica cómo utilizar la biblioteca JavaScript:
+
+```html
+<!doctype html>
+<html lang="en">
+  <head>
+    <title>Ejemplo</title>
+  </head>
+  <body>
+    <script src="https://axorax.github.io/urlmskr/lib.js"></script>
+    <script>
+      document.write(urlmskr.mask("https://axorax.github.io")); // Máscara URL
+      document.write("<br>"); // Añadir línea vacía
+      document.write(urlmskr.mask("Hello", "text")); // Texto de máscara
+    </script>
+  </body>
+</html>
+```
+
+---
+
+<p align="center"><a href="https://www.patreon.com/axorax">Apóyame en Patreon</a> — <a href="https://github.com/axorax/socials">Echa un vistazo a mis redes sociales</a></p>
diff --git a/README_zh.md b/README_zh.md
@@ -0,0 +1,39 @@
+<p align="center"><img src="./urlmskr.svg"></p>
+
+<p align="center"><a href="./README.md">English</a> — <a href="./README_zh.md">中文</a> — <a href="./README_bn.md">বাংলা</a> — <a href="./README_bn.md">عربي</a> — <a href="./README_es.md">español</a></p>
+
+> [!IMPORTANT]  
+> 这只是一个粗略的翻译，可能并不准确。
+
+# ❓ 关于
+
+urlmskr 可让你屏蔽链接并发送编码信息，方法是将链接更改为不易被读取但仍可重定向到原始链接的链接。它完全在前端运行，不需要后台服务器，也不存储数据。你可以将它托管到任何地方。在 [Patreon!](https://www.patreon.com/axorax) 上支持该项目 <3
+
+# 🤔 为什么？
+
+使用 urlmskr 这样的工具可以发送链接而不显示目标网站。不过，这可能会导致接收到不想要的网站链接。要显示目的地，只需在 URL 结尾添加 `+reveal`。例如：`https://axorax.github.io/urlmskr/hello69+reveal`。
+
+# 💻 与您的项目相结合
+
+urlmskr 的根目录中包含各种编程语言的库，以相应语言的扩展名 `lib` 命名。你可以将代码粘贴或导入到你的项目中。下面介绍如何使用 JavaScript 库：
+
+```html
+<!doctype html>
+<html lang="en">
+  <head>
+    <title>示例</title>
+  </head>
+  <body>
+    <script src="https://axorax.github.io/urlmskr/lib.js"></script>
+    <script>
+      document.write(urlmskr.mask("https://axorax.github.io")); // 屏蔽 URL
+      document.write("<br>"); // 添加空行
+      document.write(urlmskr.mask("Hello", "text")); // 屏蔽文本
+    </script>
+  </body>
+</html>
+```
+
+---
+
+<p align="center"><a href="https://www.patreon.com/axorax">在 Patreon 上支持我</a> — <a href="https://github.com/axorax/socials">查看我的社交网站</a></p>
diff --git a/_config.yml b/_config.yml
@@ -0,0 +1,3 @@
+exclude:
+  - "*.md"
+  - .github/
diff --git a/create.html b/create.html
@@ -0,0 +1,36 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>urlmskr</title>
+    <link rel="shortcut icon" href="./favicon.svg" type="image/x-icon" />
+    <link rel="stylesheet" href="./style.css" />
+    <script src="./script.js" defer></script>
+  </head>
+  <body class="center">
+    <div id="electric-surge"></div>
+
+    <main class="center">
+      <input id="input" type="text" placeholder="Type here..." />
+
+      <div class="group">
+        <button id="mode-button" onclick="modeChange()">
+          <p>Mode: <span>Redirect</span></p>
+        </button>
+        <button id="mask-button">Mask</button>
+      </div>
+
+      <button id="copy-button">🔗 Copy Masked URL</button>
+
+      <div class="output">
+        <span style="user-select: none">Type something to mask.</span>
+      </div>
+
+      <footer>
+        Support me on <a href="https://patreon.com/axorax">Patreon!</a>
+      </footer>
+    </main>
+  </body>
+</html>
diff --git a/favicon.svg b/favicon.svg
diff --git a/index.html b/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>urlmskr</title>
+    <link rel="shortcut icon" href="./favicon.svg" type="image/x-icon" />
+  </head>
+  <body>
+    <script src="./index.js"></script>
+  </body>
+</html>
diff --git a/index.js b/index.js
@@ -0,0 +1,37 @@
+const params = new URLSearchParams(window.location.search);
+
+if (params.get("r") && params.get("r").toLowerCase().endsWith(" reveal")) {
+  const url = params.get("r").slice(0, -7);
+  document.head.innerHTML += '<link rel="stylesheet" href="./style.css">';
+  document.body.innerHTML = `
+    <div class="reveal center">
+        <div>
+            <div class="top">This URL redirects to:</div>
+            <div class="destination">${window.atob(url)}</div>
+        </div>
+    </div>  
+  `;
+} else if (params.get("r")) {
+  window.location.replace(window.atob(params.get("r")));
+} else if (params.get("t")) {
+  const paragraph = document.createElement("p");
+  paragraph.innerText = window.atob(params.get("t"));
+  document.body.append(paragraph);
+
+  document.head.innerHTML += `
+    <style>
+      * {
+        margin: 0;
+        padding: 0;
+      }
+
+      p {
+        padding: .9rem 1.2rem;
+        font-size: 2rem;
+        font-family: Arial, Helvetica, sans-serif;
+      }
+    </style>
+  `;
+} else {
+  window.location.replace("https://axorax.github.io/urlmskr/create");
+}
diff --git a/inter.woff2 b/inter.woff2
diff --git a/lib.js b/lib.js
@@ -0,0 +1,25 @@
+function encode(text) {
+  return window.btoa(text);
+}
+
+function decode(text) {
+  return window.atob(text);
+}
+
+function mask(text, type) {
+  if (type == "text") {
+    return `https://axorax.github.io/urlmskr/?t=${encode(text)}`;
+  } else {
+    return `https://axorax.github.io/urlmskr/${encode(text)}`;
+  }
+}
+
+const urlmskr = {
+  encode,
+  decode,
+  mask,
+};
+
+// Usage examples:
+// urlmskr.mask('urlmskr', 'text');
+// urlmskr.mask('urlmskr', 'url');