Merge pull request #6 from mojafa/update-readme-codeanywhere

Add "Open with Codeanywhere" badge to README.md
add open with codeanywhere badge to main readme file
2026-05-31 16:53:37 +00:00 · 2025-01-19 11:13:48 +01:00 · 2025-01-18 06:58:11 +03:00 · 2023-03-08 17:04:13 +01:00 · 2023-03-08 17:02:57 +01:00 · 2023-03-08 17:02:50 +01:00
25 changed files with 481 additions and 7 deletions
--- a/README.md
+++ b/README.md
@@ -15,9 +15,9 @@ You write your code and text as you would any other day, just let garlic protect
 # Try Now!
-1. Go to this website: https://glittery-croquembouche-c25561.netlify.app/
+1. Go to this website: https://garlic-astro.netlify.app/
 2. You will see normal text the way it should be
-3. Run the following command: `wget https://glittery-croquembouche-c25561.netlify.app/`
+3. Run the following command: `wget https://garlic-astro.netlify.app/`
 4. Open the index.html
 5. You will see the encoded text :)
@@ -34,7 +34,7 @@ Install the packages with `npm i garlic-react`, you should then import the `Garl
 import Garlic from 'garlic';
 ```
-You just need to wrap your html in the `garlic()` method:
+You just need to wrap your html in the `Garlic.clove` method:
 ```js
 function App() {
@@ -55,10 +55,35 @@ Garlic.peal(document);
 And all is done!
 ## Astro
 Coming soon :)
-## Want some salt with that?
+install the package with `npm i garlic-astro`. With Astro, you just need to import the `Garlic` and `Clove` components into your layout:
-We can also add some [salt](https://auth0.com/blog/adding-salt-to-hashing-a-better-way-to-store-passwords/) to the encoding, add that extra step of security.
+
 ```astro
 import {Garlic, Clove} from 'garlic-astro';
 ---
 <Garlic>
 <!DOCTYPE html>
  <html lang="en">
      <head>
          <title>{title}</title>
      </head>
      <body>
        <Clove>
          <slot />
        </Clove>
      </body>
  </html>
 </Garlic>
 ```
 Ideally, `Garlic` should wrap the entire page, and `Clove` should wrap the content you want to protect. You can also use `Clove` multiple times, if you want to protect different parts of your page.
 You can then use the layout in `.astro` or `.mdx` files, and the content will be protected.
 # Why?
 AI needs data, your website might end-up in the dataset it uses for training. Dont want that? Garlic should help :)
 ## Stargazers over time
 [![Stargazers over time](https://starchart.cc/velocitatem/garlic.svg)](https://starchart.cc/velocitatem/garlic)
--- a/crawler.py
+++ b/crawler.py
@@ -8,7 +8,7 @@ import sqlite3
 import time
 import sys
-urls = ["http://localhost:37593"]
+urls = ["https://glittery-croquembouche-c25561.netlify.app/"]
 # connect to the database
 conn = sqlite3.connect('garlic.db')
--- a/demos/astro/README.md
+++ b/demos/astro/README.md
--- a/demos/astro/strong-singularity/.gitignore
+++ b/demos/astro/strong-singularity/.gitignore
@@ -0,0 +1,21 @@
 # build output
 dist/
 # generated types
 .astro/
 # dependencies
 node_modules/
 # logs
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 pnpm-debug.log*
 # environment variables
 .env
 .env.production
 # macOS-specific files
 .DS_Store
--- a/demos/astro/strong-singularity/.vscode/extensions.json
+++ b/demos/astro/strong-singularity/.vscode/extensions.json
@@ -0,0 +1,4 @@
 {
  "recommendations": ["astro-build.astro-vscode"],
  "unwantedRecommendations": []
 }
--- a/demos/astro/strong-singularity/.vscode/launch.json
+++ b/demos/astro/strong-singularity/.vscode/launch.json
@@ -0,0 +1,11 @@
 {
  "version": "0.2.0",
  "configurations": [
    {
      "command": "./node_modules/.bin/astro dev",
      "name": "Development server",
      "request": "launch",
      "type": "node-terminal"
    }
  ]
 }
--- a/demos/astro/strong-singularity/README.md
+++ b/demos/astro/strong-singularity/README.md
@@ -0,0 +1,55 @@
 # Astro Starter Kit: Basics
 ```
 npm create astro@latest -- --template basics
 ```
 [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/basics)
 [![Open with CodeSandbox](https://assets.codesandbox.io/github/button-edit-lime.svg)](https://codesandbox.io/p/sandbox/github/withastro/astro/tree/latest/examples/basics)
 [![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/withastro/astro?devcontainer_path=.devcontainer/basics/devcontainer.json)
 > 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun!
 ![basics](https://user-images.githubusercontent.com/4677417/186188965-73453154-fdec-4d6b-9c34-cb35c248ae5b.png)
 ## 🚀 Project Structure
 Inside of your Astro project, you'll see the following folders and files:
 ```
 /
 ├── public/
 │   └── favicon.svg
 ├── src/
 │   ├── components/
 │   │   └── Card.astro
 │   ├── layouts/
 │   │   └── Layout.astro
 │   └── pages/
 │       └── index.astro
 └── package.json
 ```
 Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
 There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
 Any static assets, like images, can be placed in the `public/` directory.
 ## 🧞 Commands
 All commands are run from the root of the project, from a terminal:
 | Command                | Action                                           |
 | :--------------------- | :----------------------------------------------- |
 | `npm install`          | Installs dependencies                            |
 | `npm run dev`          | Starts local dev server at `localhost:3000`      |
 | `npm run build`        | Build your production site to `./dist/`          |
 | `npm run preview`      | Preview your build locally, before deploying     |
 | `npm run astro ...`    | Run CLI commands like `astro add`, `astro check` |
 | `npm run astro --help` | Get help using the Astro CLI                     |
 ## 👀 Want to learn more?
 Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat).
--- a/demos/astro/strong-singularity/astro.config.mjs
+++ b/demos/astro/strong-singularity/astro.config.mjs
@@ -0,0 +1,9 @@
 import { defineConfig } from 'astro/config';
 // https://astro.build/config
 import mdx from "@astrojs/mdx";
 // https://astro.build/config
 export default defineConfig({
  integrations: [mdx()]
 });
--- a/demos/astro/strong-singularity/package.json
+++ b/demos/astro/strong-singularity/package.json
@@ -0,0 +1,18 @@
 {
 	"name": "strong-singularity",
 	"type": "module",
 	"version": "0.0.1",
 	"scripts": {
 		"dev": "astro dev",
 		"start": "astro dev",
 		"build": "astro build",
 		"preview": "astro preview",
 		"astro": "astro"
 	},
 	"dependencies": {
 		"@astrojs/mdx": "^0.17.2",
 		"astro": "^2.0.16",
 		"garlic-astro": "^0.0.1",
 		"jsdom": "^21.1.0"
 	}
 }
--- a/demos/astro/strong-singularity/public/favicon.svg
+++ b/demos/astro/strong-singularity/public/favicon.svg
@@ -0,0 +1,13 @@
 <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 36 36">
  <path fill="#000" d="M22.25 4h-8.5a1 1 0 0 0-.96.73l-5.54 19.4a.5.5 0 0 0 .62.62l5.05-1.44a2 2 0 0 0 1.38-1.4l3.22-11.66a.5.5 0 0 1 .96 0l3.22 11.67a2 2 0 0 0 1.38 1.39l5.05 1.44a.5.5 0 0 0 .62-.62l-5.54-19.4a1 1 0 0 0-.96-.73Z"/>
  <path fill="url(#gradient)" d="M18 28a7.63 7.63 0 0 1-5-2c-1.4 2.1-.35 4.35.6 5.55.14.17.41.07.47-.15.44-1.8 2.93-1.22 2.93.6 0 2.28.87 3.4 1.72 3.81.34.16.59-.2.49-.56-.31-1.05-.29-2.46 1.29-3.25 3-1.5 3.17-4.83 2.5-6-.67.67-2.6 2-5 2Z"/>
  <defs>
    <linearGradient id="gradient" x1="16" x2="16" y1="32" y2="24" gradientUnits="userSpaceOnUse">
      <stop stop-color="#000"/>
      <stop offset="1" stop-color="#000" stop-opacity="0"/>
    </linearGradient>
  </defs>
 	<style>
    @media (prefers-color-scheme:dark){:root{filter:invert(100%)}}
  </style>
 </svg>
--- a/demos/astro/strong-singularity/src/components/Card.astro
+++ b/demos/astro/strong-singularity/src/components/Card.astro
@@ -0,0 +1,63 @@
 ---
 export interface Props {
 	title: string;
 	body: string;
 	href: string;
 }
 const { href, title, body } = Astro.props;
 ---
 <li class="link-card">
 	<a href={href}>
 		<h2>
 			{title}
 			<span>&rarr;</span>
 		</h2>
 		<p>
 			{body}
 		</p>
 	</a>
 </li>
 <style>
 	.link-card {
 		list-style: none;
 		display: flex;
 		padding: 0.25rem;
 		background-color: white;
 		background-image: none;
 		background-size: 400%;
 		border-radius: 0.6rem;
 		background-position: 100%;
 		transition: background-position 0.6s cubic-bezier(0.22, 1, 0.36, 1);
 		box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
 	}
 	.link-card > a {
 		width: 100%;
 		text-decoration: none;
 		line-height: 1.4;
 		padding: 1rem 1.3rem;
 		border-radius: 0.35rem;
 		color: #111;
 		background-color: white;
 		opacity: 0.8;
 	}
 	h2 {
 		margin: 0;
 		font-size: 1.25rem;
 		transition: color 0.6s cubic-bezier(0.22, 1, 0.36, 1);
 	}
 	p {
 		margin-top: 0.5rem;
 		margin-bottom: 0;
 		color: #444;
 	}
 	.link-card:is(:hover, :focus-within) {
 		background-position: 0;
 		background-image: var(--accent-gradient);
 	}
 	.link-card:is(:hover, :focus-within) h2 {
 		color: rgb(var(--accent));
 	}
 </style>
--- a/demos/astro/strong-singularity/src/env.d.ts
+++ b/demos/astro/strong-singularity/src/env.d.ts
@@ -0,0 +1,6 @@
 /// <reference types="astro/client" />
 declare global {
 }
--- a/demos/astro/strong-singularity/src/layouts/Layout.astro
+++ b/demos/astro/strong-singularity/src/layouts/Layout.astro
@@ -0,0 +1,40 @@
 ---
 export interface Props {
 	title: string;
 }
 const { title } = Astro.props;
 import {Garlic, Clove} from 'garlic-astro';
 ---
 <Garlic>
 <!DOCTYPE html>
 <html lang="en">
 	<head>
 		<meta charset="UTF-8" />
 		<meta name="viewport" content="width=device-width" />
 		<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
 		<meta name="generator" content={Astro.generator} />
 		<title>{title}</title>
 	</head>
 	<body>
  <Clove>
      <slot />
  </Clove>
 	</body>
 </html>
 <style is:global>
 	:root {
 		--accent: 124, 58, 237;
 		--accent-gradient: linear-gradient(45deg, rgb(var(--accent)), #da62c4 30%, white 60%);
 	}
 	html {
 		font-family: system-ui, sans-serif;
 		background-color: #F6F6F6;
 	}
 	code {
 		font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
 			Bitstream Vera Sans Mono, Courier New, monospace;
 	}
 </style>
 </Garlic>
--- a/demos/astro/strong-singularity/src/pages/index.astro
+++ b/demos/astro/strong-singularity/src/pages/index.astro
@@ -0,0 +1,62 @@
 ---
 import Layout from '../layouts/Layout.astro';
 ---
  <Layout title="Welcome to Astro.">
    <main>
        <div class="App">
              <h1 id="garlic">Garlic</h1>
              <p>Garlic is a simple, fast and secure way to protect your website from being scraped by bots.</p>
                <p>You write your code and text as you would any other day, just let garlic protect your content from scraping.</p>
  <a href="/more/about">About</a>
          </div>
    </main>
  </Layout>
 <style>
 	main {
 		margin: auto;
 		padding: 1.5rem;
 		max-width: 60ch;
 	}
 	h1 {
 		font-size: 3rem;
 		font-weight: 800;
 		margin: 0;
 	}
 	.text-gradient {
 		background-image: var(--accent-gradient);
 		-webkit-background-clip: text;
 		-webkit-text-fill-color: transparent;
 		background-size: 400%;
 		background-position: 0%;
 	}
 	.instructions {
 		line-height: 1.6;
 		margin: 1rem 0;
 		border: 1px solid rgba(var(--accent), 25%);
 		background-color: white;
 		padding: 1rem;
 		border-radius: 0.4rem;
 	}
 	.instructions code {
 		font-size: 0.875em;
 		font-weight: bold;
 		background: rgba(var(--accent), 12%);
 		color: rgb(var(--accent));
 		border-radius: 4px;
 		padding: 0.3em 0.45em;
 	}
 	.instructions strong {
 		color: rgb(var(--accent));
 	}
 	.link-card-grid {
 		display: grid;
 		grid-template-columns: repeat(auto-fit, minmax(24ch, 1fr));
 		gap: 1rem;
 		padding: 0;
 	}
 </style>
--- a/demos/astro/strong-singularity/src/pages/more/about.mdx
+++ b/demos/astro/strong-singularity/src/pages/more/about.mdx
@@ -0,0 +1,9 @@
 ---
 layout: ../../layouts/Layout.astro
 title: About me
 ---
 I live on **Mars** but feel free to
 Here is my counter component, working in MDX:
--- a/demos/astro/strong-singularity/tsconfig.json
+++ b/demos/astro/strong-singularity/tsconfig.json
@@ -0,0 +1,3 @@
 {
  "extends": "astro/tsconfigs/base"
 }
--- a/garlic-astro/README.md
+++ b/garlic-astro/README.md
@@ -0,0 +1,35 @@
 # Astro Starter Kit: Component Package
 This is a template for an Astro component library. Use this template for writing components to use in multiple projects or publish to NPM.
 ```
 npm create astro@latest -- --template component
 ```
 [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/non-html-pages)
 [![Open with CodeSandbox](https://assets.codesandbox.io/github/button-edit-lime.svg)](https://codesandbox.io/p/sandbox/github/withastro/astro/tree/latest/examples/non-html-pages)
 [![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/withastro/astro?devcontainer_path=.devcontainer/component/devcontainer.json)
 [![Open in Codeanywhere](https://codeanywhere.com/img/open-in-codeanywhere-btn.svg)](https://app.codeanywhere.com/#https://github.com/withastro/astro?devcontainer_path=.devcontainer/component/devcontainer.json)
 ## 🚀 Project Structure
 Inside of your Astro project, you'll see the following folders and files:
 ```
 /
 ├── index.ts
 ├── src
 │   └── MyComponent.astro
 ├── tsconfig.json
 ├── package.json
 ```
 The `index.ts` file is the "entry point" for your package. Export your components in `index.ts` to make them importable from your package.
 ## 🧞 Commands
 All commands are run from the root of the project, from a terminal:
 | Command                | Action                                           |
 | :--------------------- | :----------------------------------------------- |
 | `npm link`              | Registers this package locally. Run `npm link my-component-library` in an Astro project to install your components
 | `npm publish` | [Publishes](https://docs.npmjs.com/creating-and-publishing-unscoped-public-packages#publishing-unscoped-public-packages) this package to NPM. Requires you to be [logged in](https://docs.npmjs.com/cli/v8/commands/npm-adduser)
--- a/garlic-astro/index.ts
+++ b/garlic-astro/index.ts
@@ -0,0 +1,5 @@
 import Garlic from '/home/velocitatem/Documents/Projects/garlic/garlic-astro/src/Garlic.astro';
 import Clove from '/home/velocitatem/Documents/Projects/garlic/garlic-astro/src/Clove.astro';
 // export both
 export { Garlic, Clove };
--- a/garlic-astro/package.json
+++ b/garlic-astro/package.json
@@ -0,0 +1,27 @@
 {
  "name": "garlic-astro",
  "version": "0.0.1",
  "type": "module",
    "author": "Daniel Alves Rosel",
    "homepage": "https://github.com/velocitatem/garlic/tree/main",
  "exports": {
    ".": "./index.ts"
  },
  "files": [
    "src",
    "index.ts"
  ],
  "keywords": [
    "astro-component"
  ],
  "scripts": {},
  "devDependencies": {
    "astro": "^2.0.17"
  },
  "peerDependencies": {
    "astro": "^2.0.0-beta.0"
  },
  "dependencies": {
    "jsdom": "^21.1.0"
  }
 }
--- a/garlic-astro/src/Clove.astro
+++ b/garlic-astro/src/Clove.astro
@@ -0,0 +1,30 @@
 ---
 let html = Astro.slots.render('default')
 html = await html
 // clean html, remove tabs and new lines and spaces that are not between tags
 html = html.replace(/>\s+</g, '><')
 html = html.replace(/(\r\n|\n|\r|\t)/gm, '')
 html = html.replace(/ +(?= )/g, '')
 import { JSDOM } from "jsdom";
 const dom = new JSDOM(html);
 function encodeTextNodes(node) {
  if (node.nodeType === 3) {
    node.nodeValue = Buffer.from(node.nodeValue).toString('base64')
  } else {
    for (let i = 0; i < node.childNodes.length; i++) {
    // if its text, we encode it, otherwise we keep going
    console.log(node.childNodes[i].nodeType, node.childNodes[i].nodeName)
    if (node.childNodes[i].nodeType === 3) {
      node.childNodes[i].nodeValue = Buffer.from(node.childNodes[i].nodeValue).toString('base64')
    } else {
      encodeTextNodes(node.childNodes[i])
      }
    }
  }
 }
 encodeTextNodes(dom.window.document.body)
 let encodedHtml = dom.serialize()
 ---
 <div set:html={encodedHtml}>
 </div>
--- a/garlic-astro/src/Garlic.astro
+++ b/garlic-astro/src/Garlic.astro
@@ -0,0 +1,34 @@
 ---
 ---
 <script is:global>
   function decodeBase64(root) {
       for (let i = 0; i < root.childNodes.length; i++) {
           const child = root.childNodes[i];
           if (child.childNodes.length === 1 && child.childNodes[0].nodeType === 3) {
               try {
               const decoded = atob(child.childNodes[0].nodeValue).split("_yummy_")[0]
               child.innerHTML = decoded;
               console.log(child);
               } catch (e) {
                   console.log(e);
               }
           }
           else if (child.nodeType === 3) {
               try {
               const decoded = atob(child.nodeValue).split("_yummy_")[0]
               child.nodeValue = decoded;
               console.log(child);
               } catch (e) {
                   console.log(e);
               }
           }
           else {
               decodeBase64(child);
           }
       }
   }
   document.addEventListener("DOMContentLoaded", function(event) {
       decodeBase64(document.body);
   });
 </script>
--- a/garlic-astro/tsconfig.json
+++ b/garlic-astro/tsconfig.json
@@ -0,0 +1,3 @@
 {
  "extends": "astro/tsconfigs/base"
 }
--- a/garlic-react/garlic.js
+++ b/garlic-react/garlic.js
@@ -2,6 +2,7 @@
 class Garlic {
    static clove(body) {
        let bodyCopy = {...body};
        if (body.props) {
            if (body.props.children) {
--- a/garlic-react/package.json
+++ b/garlic-react/package.json
--- a/garlic-react/script.js
+++ b/garlic-react/script.js
Author	SHA1	Message	Date
Daniel Rosel	0f883b0d86	Merge pull request #6 from mojafa/update-readme-codeanywhere Add "Open with Codeanywhere" badge to README.md	2025-01-19 11:13:48 +01:00
mojafa	8ab263eb22	add open with codeanywhere badge to main readme file Signed-off-by: mojafa <jmohsa@gmail.com>	2025-01-18 06:58:11 +03:00
Daniel Rosel	50e7cf3ea7	Merge pull request #3 from velocitatem/garlic-astro Garlic astro	2023-03-08 17:04:13 +01:00
Daniel Rosel	eddac361eb	Package instruct	2023-03-08 17:02:57 +01:00
Daniel Rosel	177b588e12	published package	2023-03-08 17:02:50 +01:00
Daniel Rosel	4353b726e2	Fixes	2023-03-08 16:48:30 +01:00
Daniel Rosel	a8c8ab7ac7	Merge pull request #2 from velocitatem/garlic-astro Garlic astro	2023-03-03 09:14:55 +01:00
Daniel Rosel	5242577179	Custom demos dir	2023-03-03 09:13:09 +01:00
Daniel Rosel	2b4732a34b	New link	2023-03-03 00:54:32 +01:00
Daniel Rosel	91270fbb72	Astro project	2023-03-03 00:52:44 +01:00
Daniel Rosel	5977dd67fb	Fixed bugs works for all now	2023-03-03 00:26:23 +01:00
Daniel Rosel	c6d3c9d7a4	Works!	2023-03-03 00:03:37 +01:00
Daniel Rosel	7965ee03b0	Moved files	2023-03-02 15:42:50 +01:00
Daniel Rosel	c2562a20d5	Gazers	2023-03-02 08:15:08 +01:00
Daniel Rosel	cc6d1ff903	Corrections	2023-03-01 18:40:02 +01:00