diff --git a/.github/workflows/test.yml-template b/.github/workflows/test.yml-template new file mode 100644 index 0000000..bb13dfc --- /dev/null +++ b/.github/workflows/test.yml-template @@ -0,0 +1,23 @@ +name: Test + +on: + pull_request: + branches: [ master ] + +jobs: + build: + + runs-on: ubuntu-latest + + strategy: + matrix: + node-version: [20.x] + + steps: + - uses: actions/checkout@v2 + - name: Use Node.js ${{ matrix.node-version }} + uses: actions/setup-node@v1 + with: + node-version: ${{ matrix.node-version }} + - run: npm install + - run: npm test diff --git a/package-lock.json b/package-lock.json index d0b3b95..3650660 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,7 +12,7 @@ "devDependencies": { "@faker-js/faker": "^8.4.1", "@mate-academy/eslint-config": "latest", - "@mate-academy/scripts": "^1.8.6", + "@mate-academy/scripts": "^2.1.3", "axios": "^1.7.2", "eslint": "^8.57.0", "eslint-plugin-jest": "^28.6.0", @@ -1487,10 +1487,11 @@ } }, "node_modules/@mate-academy/scripts": { - "version": "1.8.6", - "resolved": "https://registry.npmjs.org/@mate-academy/scripts/-/scripts-1.8.6.tgz", - "integrity": "sha512-b4om/whj4G9emyi84ORE3FRZzCRwRIesr8tJHXa8EvJdOaAPDpzcJ8A0sFfMsWH9NUOVmOwkBtOXDu5eZZ00Ig==", + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/@mate-academy/scripts/-/scripts-2.1.3.tgz", + "integrity": "sha512-a07wHTj/1QUK2Aac5zHad+sGw4rIvcNl5lJmJpAD7OxeSbnCdyI6RXUHwXhjF5MaVo9YHrJ0xVahyERS2IIyBQ==", "dev": true, + "license": "MIT", "dependencies": { "@octokit/rest": "^17.11.2", "@types/get-port": "^4.2.0", diff --git a/package.json b/package.json index 1d03d64..8e6392d 100644 --- a/package.json +++ b/package.json @@ -18,7 +18,7 @@ "devDependencies": { "@faker-js/faker": "^8.4.1", "@mate-academy/eslint-config": "latest", - "@mate-academy/scripts": "^1.8.6", + "@mate-academy/scripts": "^2.1.3", "axios": "^1.7.2", "eslint": "^8.57.0", "eslint-plugin-jest": "^28.6.0", diff --git a/src/createServer.js b/src/createServer.js index 1cf1dda..bbd760e 100644 --- a/src/createServer.js +++ b/src/createServer.js @@ -1,8 +1,135 @@ 'use strict'; +const http = require('http'); +const path = require('path'); +const fs = require('fs'); +const zlib = require('node:zlib'); +const { IncomingForm } = require('formidable'); + +const compressionTypes = { + gzip: { + createStream: zlib.createGzip, + extension: 'gz', + }, + deflate: { + createStream: zlib.createDeflate, + extension: 'dfl', + }, + br: { + createStream: zlib.createBrotliCompress, + extension: 'br', + }, +}; + +function sendHtml(res) { + const filePath = path.join(__dirname, 'index.html'); + + fs.readFile(filePath, (err, data) => { + if (err) { + res.writeHead(500, { 'Content-Type': 'text/plain; charset=utf-8' }); + res.end('Internal Server Error'); + + return; + } + + res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8' }); + res.end(data); + }); +} + +function sendBadRequest(response) { + response.writeHead(400, { 'Content-Type': 'text/plain; charset=utf-8' }); + response.end('Bad Request'); +} + +function sendNotFound(response) { + response.writeHead(404, { 'Content-Type': 'text/plain; charset=utf-8' }); + response.end('Not Found'); +} + function createServer() { - /* Write your code here */ - // Return instance of http.Server class + return http.createServer((request, response) => { + const { method, url } = request; + + if (method === 'GET' && url === '/') { + sendHtml(response); + + return; + } + + if (method === 'GET' && url === '/compress') { + sendBadRequest(response); + + return; + } + + if (method === 'POST' && url === '/compress') { + const form = new IncomingForm({ multiples: false }); + + form.parse(request, async (error, fields, files) => { + if (error) { + sendBadRequest(response); + + return; + } + + const compressionType = Array.isArray(fields.compressionType) + ? fields.compressionType[0] + : fields.compressionType; + const file = Array.isArray(files.file) ? files.file[0] : files.file; + + if (!file || !compressionType) { + sendBadRequest(response); + + return; + } + + if (!compressionTypes[compressionType]) { + sendBadRequest(response); + + return; + } + + const filePath = file.filepath || file.file?.path || file.path; + const filename = + file.originalFilename || + file.name || + path.basename(filePath || 'unknown'); + + if (!filePath || !filename) { + sendBadRequest(response); + + return; + } + + const { createStream, extension } = compressionTypes[compressionType]; + const readStream = fs.createReadStream(filePath); + const compressStream = createStream(); + + const handleStreamError = () => { + if (!response.headersSent) { + sendBadRequest(response); + } else { + response.destroy(); + } + }; + + readStream.on('error', handleStreamError); + compressStream.on('error', handleStreamError); + + response.writeHead(200, { + 'Content-Type': 'application/octet-stream', + 'Content-Disposition': `attachment; filename=${filename}.${extension}`, + }); + + readStream.pipe(compressStream).pipe(response); + }); + + return; + } + + sendNotFound(response); + }); } module.exports = { diff --git a/src/index.html b/src/index.html new file mode 100644 index 0000000..ff6e2ee --- /dev/null +++ b/src/index.html @@ -0,0 +1,111 @@ + + + + + + + The Compressor + + +
+

Welcome to The Compressor

+ +

+ This is a simple web application that allows you to upload a file and compress it + using one of three compression algorithms: gzip, deflate, or brotli (br). + To use the application, simply select a file from your computer, choose the desired compression + type from the dropdown menu, and click the "Compress" button. The compressed file will be generated + and made available for download. Enjoy compressing your files with ease! +

+ +
+ + + + + + +
+
+ + diff --git a/src/styles/styles.css b/src/styles/styles.css new file mode 100644 index 0000000..3cd7a42 --- /dev/null +++ b/src/styles/styles.css @@ -0,0 +1,69 @@ +body { + font-family: 'Arial', sans-serif; + margin: 0; + padding: 0; + background-color: #f5f5f5; +} + +.container { + width: 80%; + margin: 0 auto; + padding: 0; + display: flex; + height: 100vh; + flex-direction: column; + align-items: center; + justify-content: center; +} + +.mainTitle { + text-align: center; + color: #333; +} + +.mainDescription { + text-align: center; + color: #666; + margin-bottom: 40px; +} + +.form { + display: flex; + flex-direction: column; + align-items: center; + gap: 20px; +} + +.label { + display: flex; + flex-direction: column; + gap: 10px; + font-size: 18px; + color: #333; +} + +.fileInput { + padding: 10px; + border: 1px solid #ccc; + border-radius: 4px; + background-color: #fff; + cursor: pointer; +} + +.selector { + padding: 10px; + border: 1px solid #ccc; + border-radius: 4px; + background-color: #fff; + cursor: pointer; +} + +.submitBtn { + padding: 10px 20px; + border: none; + border-radius: 4px; + background-color: #007bff; + color: #fff; + font-size: 16px; + cursor: pointer; +}