diff --git a/.github/resources/2.png b/.github/resources/2.png new file mode 100644 index 0000000..bf86f7e Binary files /dev/null and b/.github/resources/2.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..644b194 --- /dev/null +++ b/index.html @@ -0,0 +1,96 @@ + + + + + + See - Scan, Explore, Examine + + + + + + + +
+
+ Screenshot of See +

Summary

+

A simple file viewer with syntax highlighting for Linux and macOS.

+
+ +
+

Installing

+

The see tool is a command-line utility for viewing files in a user-friendly manner. Follow the steps below to install see on your supported operating systems. Ensure you have curl installed.

+ +

For Linux and macOS

+

1. Check if curl is installed

+ 
command -v curl >/dev/null 2>&1 && echo "YES" || echo "NO"
+ +

2. Download the Installer from my Official GitHub

+ 
curl -O https://raw.githubusercontent.com/Henrisen/see/refs/heads/main/install
+ +

3. Run the Installer

+ 
chmod +x ./install && sudo ./install
+ +

For Windows

+

1. Check if curl is installed

+ 
where curl >nul 2>&1 && echo YES || echo NO
+ +

2. Download the Installer from my Official GitHub

+ 
curl -O https://raw.githubusercontent.com/Henrisen/see/refs/heads/main/install.bat
+ +

3. Run the Installer

+ 
.\install.bat
+
+ +
+

Usage

+

To use see, run it with the name of the file you want to open:

+ 
see example.sh
+ +

For real-time file updates, use the -f / --follow flag:

+ 
see -f example.sh
+ +

For custom update intervals, use the -u / --update-interval flag (default is 125 ms):

+ 
see -fu125 example.sh
+
+ +
+

License

+

This project is licensed under the BSD 3-Clause License. See the LICENSE file for more details.

+
+ +
+

Contributing

+

Contributions to this project are welcome. Please fork the repository, make your changes, and submit a pull request. Ensure your code adheres to the project’s coding standards and includes relevant tests.

+
    +
  1. Fork the repository
    2. +
  2. Create a new branch for your feature
    3. +
  3. Commit your changes
    4. +
  4. Push your branch to your fork
    5. +
  5. Open a pull request
    6. +
+
+
+ + + + + + diff --git a/static/script.js b/static/script.js new file mode 100644 index 0000000..e2c9fce --- /dev/null +++ b/static/script.js @@ -0,0 +1,104 @@ +Array.from(document.querySelectorAll("pre")).forEach((e) => { + e.addEventListener("click", (i) => { + let elm = i.target; + if (i.target.nodeName == "CODE") elm = elm.parentNode; + if (elm.ariaBusy) return; + navigator.clipboard.writeText(elm.firstChild.textContent); + let old = elm.firstChild.textContent; + elm.firstChild.textContent = "Command Copied"; + elm.ariaBusy = "yes"; + setTimeout(() => { + elm.firstChild.textContent = old; + elm.ariaBusy = ""; + }, 1000); + }); +}) + +// Get canvas and context +const header = document.getElementById('header'); +const canvas = document.getElementById('background'); +const ctx = canvas.getContext('2d'); + +// Make sure the canvas is responsive +canvas.width = window.innerWidth; +canvas.height = window.innerHeight; + +// Particle array +let particles = []; +let r=0.5329815303430079; +// Image for the background +const backgroundImage = new Image(); +backgroundImage.src = './.github/resources/2.png'; // Random image from Lorem Picsum + +// Function to create new particle +function createParticle(x, y) { + const speed = Math.random() * 5 + 2; // Speed of the particle + const angle = Math.random() * Math.PI * 2; // Random direction + const velocityX = Math.cos(angle) * speed; + const velocityY = Math.sin(angle) * speed; + + particles.push({ + x: x, + y: y, + radius: Math.random() * 3 + 5, // Random radius for each particle + color: 'rgba(255, 255, 255, 0.8)', // Particle color + velocityX: velocityX, + velocityY: velocityY + }); +} + +// Update particles +function updateParticles() { + // Loop through each particle + for (let i = 0; i < particles.length; i++) { + const p = particles[i]; + + // Update particle position + p.x += p.velocityX; + p.y += p.velocityY; + + // Fade out and shrink the particle + p.radius -= 0.05; + if (p.radius <= 0) { + particles.splice(i, 1); // Remove the particle if its radius is too small + i--; + } + } +} + +// Draw particles +function drawParticles() { + ctx.clearRect(0, 0, canvas.width, canvas.height); // Clear canvas + ctx.drawImage(backgroundImage, 0, 0, canvas.width *r, canvas.height); // Draw the image as background + + for (let i = 0; i < particles.length; i++) { + const p = particles[i]; + ctx.beginPath(); + ctx.arc(p.x, p.y, p.radius, 0, Math.PI * 2); // Draw particle as circle + ctx.fillStyle = p.color; + ctx.fill(); + } +} + +// Mousemove event to generate particles at cursor location +header.addEventListener('mousemove', (event) => { + // console.log(scrollX, scrollY); + // console.log(event.x, event.y); + createParticle(event.x + scrollX, event.y + scrollY); +}); + +// Animation loop to update and draw particles +function animate() { + updateParticles(); + drawParticles(); + requestAnimationFrame(animate); // Continue the animation +} + +// Start the animation +animate(); + +// Resize canvas on window resize +window.addEventListener('resize', () => { + canvas.width = window.innerWidth; + canvas.height = window.innerHeight; +}); diff --git a/static/style.css b/static/style.css new file mode 100644 index 0000000..65ee3ca --- /dev/null +++ b/static/style.css @@ -0,0 +1,117 @@ +/* style.css */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: 'Arial', sans-serif; + line-height: 1.6; + background-color: #222222; + color: #eeeeee; + overflow-x: hidden; +} + +header { + background-color: #0E1011; + position: relative; + height: 100vh; + display: flex; + justify-content: center; + align-items: center; + overflow: hidden; + color: white; + text-align: center; +} + +header canvas { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 1; +} + +.header-content { + z-index: 1; +} + +header h1 { + font-size: 4rem; + margin-bottom: 1rem; +} + +header p { + font-size: 1.5rem; +} + +nav { + background: #333; + padding: 1rem; + text-align: center; +} + +nav ul { + display: flex; + justify-content: center; + list-style: none; +} + +nav ul li { + margin: 0 1rem; +} + +nav ul li a { + color: white; + text-decoration: none; + font-weight: bold; + transition: color 0.3s; +} + +nav ul li a:hover { + color: #007bff; +} + +main { + background-color: #222222; + padding: 2rem; +} + +section { + padding: 2rem 0; +} + +section h2 { + color: #007bff; + margin-bottom: 1rem; +} + +pre { + background: #555555; + padding: 1rem; + border-left: 5px solid #007bff; + color: #e0e0e0; + overflow-x: auto; +} + +pre:hover { + color: #ffffff; +} + +footer { + background: #333; + color: white; + text-align: center; + padding: 1rem; +} + +html { + scroll-behavior: smooth; +} + +img { + width: 50%; + float: right; +} \ No newline at end of file