fs-play

fs-glass

fs-glass is a set of JavaScript modules that provide a transparent interface for performing file system operations over HTTP. It consists of a front-end module (fs-glass-front.js) for the client-side and a back-end module (fs-glass-back.js) for the server-side. The name “glass” signifies that while the modules are powerful and useful, they can be dangerous if misused—much like handling glass.

Table of Contents

Overview

fs-glass allows developers to perform file system operations such as reading, writing, copying, moving, and deleting files and directories over HTTP. This can be particularly useful for web applications that require server-side file manipulation initiated from the client-side.

Key Features

Setup Instructions

Front-End Setup

Include the fs-glass-front.js script in your HTML file or import it into your JavaScript module.

<script src="path/to/fs-glass-front.js"></script>

Or, if using modules:

import fs from './fs-glass-front.js';

Back-End Setup

Place fs-glass-back.js in your server directory and require it in your Node.js application.

const fsOperations = require('./fs-glass-back.js');

How to Use

Front-End Methods

The front-end fs object provides the following methods:

Back-End Functions

The back-end module exports the following functions:

Sample Usage

Front-End Example

// Writing data to a file
fs.write('/path/to/file.txt', 'Hello, World!')
  .then(response => console.log('File written successfully'))
  .catch(error => console.error('Error writing file:', error));

// Creating a directory
fs.mkdir('/path/to/new/directory')
  .then(response => console.log('Directory created successfully'))
  .catch(error => console.error('Error creating directory:', error));

// Copying a file
fs.copy('/path/to/source.txt', '/path/to/destination', 'copied.txt')
  .then(response => console.log('File copied successfully'))
  .catch(error => console.error('Error copying file:', error));

Back-End Example Without Express

Below is a simple example of setting up an HTTP server without using Express. This server listens for HTTP requests and performs file system operations based on the request method and URL.

const http = require('http');
const url = require('url');
const fs = require('fs');
const fsOperations = require('./fs-glass-back.js');
const { mkdir, copy, move, dup, rename, remove, explore, recon } = fsOperations;

const port = 3000;

const server = http.createServer((req, res) => {
  const parsedUrl = url.parse(req.url, true);
  const pathname = decodeURIComponent(parsedUrl.pathname);
  let body = [];

  req.on('data', chunk => {
    body.push(chunk);
  });

  req.on('end', () => {
    body = Buffer.concat(body).toString();

    // Handle CORS (if needed)
    res.setHeader('Access-Control-Allow-Origin', '*');
    res.setHeader('Access-Control-Allow-Methods', 'GET, PUT, POST, DELETE, OPTIONS');
    res.setHeader('Access-Control-Allow-Headers', 'Content-Type');

    if (req.method === 'OPTIONS') {
      res.writeHead(204);
      res.end();
      return;
    }

    // Define response handlers
    const sendResponse = (statusCode, data) => {
      res.writeHead(statusCode, { 'Content-Type': 'application/json' });
      res.end(JSON.stringify(data));
    };

    const sendError = (statusCode, message) => {
      res.writeHead(statusCode, { 'Content-Type': 'text/plain' });
      res.end(message);
    };

    // Route handling
    if (req.method === 'PUT') {
      // Write file
      fs.writeFile('.' + pathname, body, err => {
        if (err) return sendError(500, err.toString());
        sendResponse(200, { message: 'File written successfully' });
      });
    } else if (req.method === 'POST') {
      // Parse operation from body
      let operation;
      try {
        operation = JSON.parse(body);
      } catch (err) {
        return sendError(400, 'Invalid JSON');
      }

      const { op, args } = operation;
      if (op && ops[op]) {
        ops[op](...args)
          .then(() => sendResponse(200, { message: `${op} operation completed successfully` }))
          .catch(err => sendError(500, err.toString()));
      } else {
        sendError(400, 'Invalid operation');
      }
    } else if (req.method === 'DELETE') {
      // Delete file or directory
      remove('.' + pathname)
        .then(() => sendResponse(200, { message: 'File or directory deleted successfully' }))
        .catch(err => sendError(500, err.toString()));
    } else if (req.method === 'GET') {
      // Handle explore and recon
      if (pathname.endsWith('??')) {
        const path = '.' + pathname.slice(0, -2);
        explore(path)
          .then(data => sendResponse(200, data))
          .catch(err => sendError(500, err.toString()));
      } else if (pathname.endsWith('?')) {
        const path = '.' + pathname.slice(0, -1);
        recon(path)
          .then(data => sendResponse(200, data))
          .catch(err => sendError(500, err.toString()));
      } else {
        // Read file
        fs.readFile('.' + pathname, (err, data) => {
          if (err) return sendError(500, err.toString());
          res.writeHead(200, { 'Content-Type': 'application/octet-stream' });
          res.end(data);
        });
      }
    } else {
      sendError(405, 'Method Not Allowed');
    }
  });
});

server.listen(port, () => {
  console.log(`Server running at http://localhost:${port}/`);
});

// Define the operations mapping
const ops = { mkdir, copy, move, dup, rename };

Explanation:

Note: This is a basic example for illustrative purposes. In a production environment, you should implement robust error handling, input validation, and security measures.

Security Considerations

Warning: fs-glass performs file system operations over HTTP, which can be extremely dangerous if not properly secured. Without adequate authentication and authorization mechanisms, unauthorized users could potentially read, modify, or delete sensitive files on the server.

To mitigate risks:

Disclaimer: Use fs-glass at your own risk. The authors are not responsible for any damages or data loss resulting from the use of this software.

Licensing Information

This project is licensed under the MIT License.

Note: Remember that fs-glass is a powerful tool that should be used with caution. Always ensure that your server-side implementation includes proper security measures to prevent unauthorized access and operations.

image

One ultimate function to set up a dropzone element for files uploading

setUploader

setUploader is a flexible JavaScript utility function that simplifies file uploading in web applications. It allows you to configure file selection via buttons or drag-and-drop, handle multiple files, and define custom behaviors for informing users and reporting upload statuses.

Table of Contents

Features

Installation

Include the setUploader function in your JavaScript code. You can add it directly to your script or import it as a module if you’ve structured it that way.

<script src="path/to/your/setUploader.js"></script>

Usage

Syntax

setUploader({
  pathsrc,
  namesrc,
  chooser,
  starter,
  dropzone,
  informcb,
  reportcb,
  fetchArgs,
  multiple
});

Parameters

Examples

Basic Example

setUploader({
  chooser: document.getElementById('selectBtn'),
  informcb: (files) => {
    console.log('Selected files:', files);
  },
  reportcb: (response, i) => {
    response.text().then((text) => console.log(`Response for file ${i}:`, text));
  },
});

Advanced Example with All Options

setUploader({
  pathsrc: () => document.getElementById('pathInput').value,
  namesrc: () => document.getElementById('nameInput').value,
  chooser: document.getElementById('selectBtn'),
  starter: document.getElementById('uploadBtn'),
  dropzone: document.getElementById('dropZone'),
  multiple: true,
  informcb: (files, path, getName) => {
    document.getElementById('info').innerText = `Uploading ${files.length} files to ${path}`;
  },
  reportcb: (response, i) => {
    response.text().then((text) => {
      console.log(`Server response for file ${i}: ${text}`);
    });
  },
  fetchArgs: (path, name, body) => {
    return [`${path}/${name}`, { method: 'PUT', body }];
  },
});

Explanation of the Advanced Example

License

This project is licensed under the MIT License.

image

image

image