diff options
-rw-r--r-- | draw-component.js | 229 | ||||
-rw-r--r-- | index.html | 37 | ||||
-rw-r--r-- | keyboard-component.js | 22 | ||||
-rw-r--r-- | main.js | 70 | ||||
-rw-r--r-- | mouse-component.js | 94 | ||||
-rw-r--r-- | package-lock.json | 395 | ||||
-rw-r--r-- | package.json | 16 | ||||
-rw-r--r-- | update-component.js | 463 |
8 files changed, 1326 insertions, 0 deletions
diff --git a/draw-component.js b/draw-component.js new file mode 100644 index 0000000..9604507 --- /dev/null +++ b/draw-component.js @@ -0,0 +1,229 @@ +normalDraw = { + draw: function(){ + color("#aaa" ) + ctx.fillRect(0, 0, WIDTH, HEIGHT) + for(var i = 0; i < HEIGHT; i+=4){ + color("#ccc" ) + ctx.fillRect(0, i, WIDTH, 2) + } + // Where each message bottom is + let bottomY = HEIGHT/2; + for(var i = 0; i < messages.length; i++){ + let message = messages[i]; + let totalHeigt; + switch(message.type){ + case 0: + color("#111") + totalHeigt = roundedRect(0, bottomY, 3, 10); + + color("#888") + roundedRect(1, bottomY-1, 3, 8, true); + color("#444") + roundedRect(1, bottomY-1, 3, 8); + + color("#111") + font(10, "NANO CHAT", 3, bottomY - totalHeigt + 3) + break; + case 1: + color("#111") + totalHeigt = roundedRect(0, bottomY, 3, 10); + + color("#000") + roundedRect(1, bottomY-1, 3, 8, true); + color("#444") + roundedRect(1, bottomY-1, 3, 8); + + color("yellow") + font(10, "Now entering: ", 3, bottomY - totalHeigt + 3) + color("#ccc") + font(10, message.text, 85, bottomY - totalHeigt + 3) + break; + case 2: + totalHeigt = drawMessage(0, bottomY, message.from, message.text, message.pixels) + break; + } + bottomY -= totalHeigt; + + // stop drawing if we are beyond the screen + if(bottomY < 0) break; + } + // Draw current message + drawMessage(0, HEIGHT * 3 / 4, username, currentMessageText, currentMessagePixels, true) + + // Draw send button + color("#444") + roundedRect(WIDTH - 50, HEIGHT - 48, 3, 39, true, 55) + roundedRect(WIDTH - 50, HEIGHT - 2, 3, 39, true, 53) + color("#bbb") + roundedRect(WIDTH - 49, HEIGHT - 49, 3, 37, true, 55) + roundedRect(WIDTH - 49, HEIGHT - 3, 3, 37, true, 55) + color("#444") + ctx.beginPath() + ctx.moveTo(WIDTH - 30, HEIGHT - 62) + ctx.lineTo(WIDTH - 30, HEIGHT - 72) + ctx.lineTo(WIDTH - 35, HEIGHT - 72) + ctx.lineTo(WIDTH - 26, HEIGHT - 82) + ctx.lineTo(WIDTH - 17, HEIGHT - 72) + ctx.lineTo(WIDTH - 22, HEIGHT - 72) + ctx.lineTo(WIDTH - 22, HEIGHT - 62) + ctx.fill() + let centerX = WIDTH - 26 + let centerY = HEIGHT - 30 + let radius = 10; + for(var i = 0; i < 8; i++){ + var x = centerX + Math.cos(Math.PI / 4 * i) * radius + var y = centerY + Math.sin(Math.PI / 4 * i) * radius + ctx.beginPath() + ctx.moveTo(x-1, y-1) + ctx.lineTo(x+1, y-1) + ctx.lineTo(x+1, y+1) + ctx.lineTo(x-1, y+1) + ctx.fill() + } + + ctx.fillText("SEND", WIDTH - 39, HEIGHT - 60) + ctx.fillText("CLEAR", WIDTH - 41, HEIGHT - 14) + + drawKeyboard() + } +} +function drawMessage(x, y, from, text, pixels, current=false){ + var parts = split_into_parts(text) + var trueHeight = Math.max(parts.length, 1) * 14 + 7 + if(current || pixels.length != 0){ + trueHeight = 91 + } + + color("white") + roundedRect(x, y , 3, trueHeight-6, true); + color("blue") + roundedRect(x, y , 3, trueHeight-6); + color("#b3b3ff") + roundedRect(x, y - trueHeight + 18 , 3, 12, true, 88); + color("blue") + roundedRect(x, y - trueHeight + 18, 3, 12, false, 88); + font(12, from, 3, y - trueHeight+6) + color("black") + font(12, text, 3, y - trueHeight+6, true) + color("black") + for(var i = 0; i < pixels.length; i++){ + var pixel = pixels[i] + ctx.fillRect(pixel.x, pixel.y + y, 2, 2) + } + return trueHeight +} +var capsOn = false +var shiftOn = false +function drawKeyboard(){ + color("#444") + roundedRect(1, HEIGHT - 1, 3, HEIGHT/4 - 10, true, WIDTH-52) + color("#bbb") + roundedRect(2, HEIGHT - 2, 3, HEIGHT/4 - 12, true, WIDTH-54) + + ctx.font = 12 + "px Mono"; + var keys = [ + ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0", "-", "="], + ["q", "w", "e", "r", "t", "y", "u", "i", "o", "p"], + ["a", "s", "d", "f", "g", "h", "j", "k", "l"], + ["z", "x", "c", "v", "b", "n", "m", ",", ".", "/"] + ] + var d1 = Math.floor( (WIDTH-54) / 12) - 1 + var d2 = Math.ceil( (WIDTH-54) / 12) - 1 + for(var j = 0; j < keys.length; j++){ + var x = 6 + 8*j + var y = HEIGHT / 4 * 3 + 5 + (d1+1)*j + for(var i = 0; i < keys[j].length; i++){ + color("#ddd") + ctx.fillRect(x, y, d1, d1) + color("#444") + var char = keys[j][i] + if(capsOn || shiftOn){ + char = char.toUpperCase() + } + ctx.fillText(char, x + 4, y + 3) + x += d2 + } + } + // space + color("#ddd") + ctx.fillRect(6, HEIGHT - 27, WIDTH-65, 24) + color("#444") + ctx.fillText("space", 80, HEIGHT-20) + ctx.font = 7 + "px Mono"; + // shift + color("#ddd") + ctx.fillRect(6, HEIGHT - 27 - d2, d1+8, d1) + color("#444") + ctx.fillText("shift", 7, HEIGHT - 22 - d2) + // caps + color("#ddd") + ctx.fillRect(6, HEIGHT - 27 - 2 * d2, d1, d1) + color("#444") + ctx.fillText("cap", 7, HEIGHT - 22 - 2 * d2) + // enter + color("#ddd") + ctx.fillRect(d1*11+1, HEIGHT - 27 - 2 * d2, d1*2+1, d1) + color("#444") + ctx.fillText("enter", d1*11+5, HEIGHT - 22 - 2 * d2) + // backspace + color("#ddd") + ctx.fillRect(d1*11.5+1.5, HEIGHT - 27 - 3 * d2, d1+8, d1) + color("#444") + ctx.fillText("del", d1*11.5+5.5, HEIGHT - 22 - 3 * d2) +} +function roundedRect(x, y, radius, height, fill = false, width = WIDTH){ + ctx.beginPath(); + ctx.arc(x + radius, y - radius - height, radius, 3/2 * Math.PI, Math.PI, true) + ctx.arc(x + radius, y - radius, radius, Math.PI, 1/2 * Math.PI, true) + ctx.arc(x + width - radius, y-radius, radius, 1/2 * Math.PI, 0, true) + ctx.arc(x + width - radius, y-radius - height, radius, 0, 3/2 * Math.PI, true) + ctx.lineTo(x + radius, y - (radius * 2 ) - height) + if(fill){ + ctx.fill(); + } else { + ctx.stroke(); + } + + return radius*2 + height +} +function color(c) { + ctx.fillStyle = c; + ctx.strokeStyle = c; +} +function font(size, what, x, y, wrap = false) { + ctx.textBaseline = "top" + ctx.font = size + "px Mono"; + if(wrap){ + var parts = split_into_parts(what, true); + parts.forEach((element, i) => { + ctx.fillText(element, x, y + i*(size + 2)); + }); + } else { + ctx.fillText(what, x, y); + } +} +function split_into_parts(what, drawing=false){ + var parts = []; + var line = ""; + if(drawing){ + line = " " + } + for(var i = 0; i < what.length; i++){ + if(what.charAt(i) == "\n"){ + parts.push(line + "\n"); + line = "" + } else if(line.length == 34){ + parts.push(line); + line = what.charAt(i); + } else { + line += what.charAt(i) + } + if(parts.length == 6){ + break; + } + } + if(line.length != 0 && parts.length < 6){ + parts.push(line) + } + return parts; +}
\ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..3a60280 --- /dev/null +++ b/index.html @@ -0,0 +1,37 @@ +<!doctype html> +<html lang="en"> + +<head> + <title>Nano Chat</title> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> + <style> + @font-face { + font-family: 'Gameboy'; + src: url('Assets/font.ttf'); + } + canvas { + transform-origin: top left; + transform: scale(2, 2); + position: absolute; + left: 0; + top: 0; + } + </style> +</head> + +<body style="padding:0; margin:0; overflow:hidden;"> + <canvas id="canvas"></canvas> + <script> + var FPS = 10; + var WIDTH = 256; + var HEIGHT = 192 * 2; + </script> + <script src="update-component.js"></script> + <script src="draw-component.js"></script> + <script src="keyboard-component.js"></script> + <script src="mouse-component.js"></script> + <script src="main.js"></script> +</body> + +</html>
\ No newline at end of file diff --git a/keyboard-component.js b/keyboard-component.js new file mode 100644 index 0000000..ce590ae --- /dev/null +++ b/keyboard-component.js @@ -0,0 +1,22 @@ +typingMessageComponent = { + keyDown: function(e){ + if(e.keyCode == 48 && e.key == "Delete"){ // Mark delete as backspace + e.keyCode = 8 + } + + if(e.keyCode >= 32 && e.key.length == 1){ // Printable character (probably) + currentMessageText += e.key + } else if(e.keyCode == 13){ // Enter + currentMessageText += "\n"; + } else if(e.keyCode == 8) { // delete + if(currentMessageText.length >= 1){ + currentMessageText = currentMessageText.substring(0, currentMessageText.length - 1) + } else { + currentMessageText = "" + } + } + currentMessageParts = split_into_parts(currentMessageText) + currentMessageText = currentMessageParts.join("") + mouseIsDown = false + } +}
\ No newline at end of file @@ -0,0 +1,70 @@ +var canvas, ctx; +var t; // Frame counter +var gameInterval; +var components; + +var messages, username, currentMessageText, currentMessageParts, currentMessagePixels, mouseIsDown; + +window.onload = function () { + canvas = document.getElementById("canvas"); + ctx = canvas.getContext("2d"); + document.addEventListener("keydown", keyDown); + + document.addEventListener("mousedown", mouseDown) + document.addEventListener("mousemove", mouseMove) + document.addEventListener("mouseup", mouseUp) + window.addEventListener('resize', resizeCanvas, false); + window.addEventListener('orientationchange', resizeCanvas, false); + + init(); + resizeCanvas(); +} +function init() { + components = { + keyboard: typingMessageComponent, + mouse: drawMessageComponent, + draw: normalDraw, + update: normalUpdate + } + t = 0 + + username = "Mark" + messages = [] + messages.unshift({ + type: 0, + }) + messages.unshift({ + type: 1, + text: username + }) + currentMessageText = "" + currentMessagePixels = [] + gameInterval = setInterval(game, 1000 / FPS); +} +function resizeCanvas() { + canvas.width = WIDTH; + canvas.height = HEIGHT; +} +function keyDown(e) { + components.keyboard.keyDown(e); +} +function mouseDown(e){ + components.mouse.mouseDown(e); +} +function mouseUp(e){ + components.mouse.mouseUp(e); +} +function mouseMove(e){ + components.mouse.mouseMove(e); +} +function update() { + components.update.update() +} +function draw(){ + components.draw.draw() +} + +function game() { + update(); + draw(); +} diff --git a/mouse-component.js b/mouse-component.js new file mode 100644 index 0000000..10684cc --- /dev/null +++ b/mouse-component.js @@ -0,0 +1,94 @@ +drawMessageComponent = { + mouseDown: function(e){ + mouseIsDown = true + let x = e.x/2; + let y = e.y/2; + + if(206 < x && x < WIDTH && 292 < y && y < 336){ + messages.unshift({ + type: 2, + from: username, + text: currentMessageText, + pixels: currentMessagePixels + }) + currentMessageText = "" + currentMessagePixels = [] + } else if(206 < x && x < WIDTH && 338 < y && y < 382){ + currentMessageText = "" + currentMessagePixels = [] + } else if(0 < x && x < WIDTH && 198 < y && y < 288){ + currentMessagePixels.push({x: x, y: y - 288}) + } + checkKeyBoardClick(x, y) + }, + mouseUp: function(e){ + mouseIsDown = false + }, + mouseMove: function(e){ + let x = Math.floor(e.x/2); + let y = Math.floor(e.y/2); + if(mouseIsDown && 0 < x && x < WIDTH && 198 < y && y < 288){ + currentMessagePixels.push({x: x, y: y - 288}) + } + }, +} +function inBox(x, y, boxX, boxY, width, height){ + return boxX < x && x < boxX + width && boxY < y && y < boxY + height +} +var normalKeys = [ + ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0", "-", "="], + ["q", "w", "e", "r", "t", "y", "u", "i", "o", "p"], + ["a", "s", "d", "f", "g", "h", "j", "k", "l"], + ["z", "x", "c", "v", "b", "n", "m", ",", ".", "/"] +] +var keys = normalKeys +function checkKeyBoardClick(mouseX, mouseY){ + var d1 = Math.floor( (WIDTH-54) / 12) - 1 + var d2 = Math.ceil( (WIDTH-54) / 12) - 1 + for(var j = 0; j < keys.length; j++){ + var x = 6 + 8*j + var y = HEIGHT / 4 * 3 + 5 + (d1+1)*j + for(var i = 0; i < keys[j].length; i++){ + if(inBox(mouseX, mouseY, x, y, d1, d1)){ + var char = keys[j][i] + if(capsOn || shiftOn){ + char = char.toUpperCase() + } + shiftOn = false + keyDown({ + keyCode: 32, // any printable char code (yeah probably a bad idea) + key: char // the char + }) + } + x += d2 + } + } + // space + if(inBox(mouseX, mouseY, 6, HEIGHT - 27, WIDTH-65, 24)){ + keyDown({ + keyCode: 32, + key: " " + }) + } + // shift + if(inBox(mouseX, mouseY, 6, HEIGHT - 27 - d2, d1+8, d1)){ + shiftOn = true && !shiftOn + } + // caps + if(inBox(mouseX, mouseY, 6, HEIGHT - 27 - 2 * d2, d1, d1)){ + capsOn = !capsOn + } + // enter + if(inBox(mouseX, mouseY, d1*11+1, HEIGHT - 27 - 2 * d2, d1*2+1, d1)){ + keyDown({ + keyCode: 13 + }) + } + // backspace + if(inBox(mouseX, mouseY, d1*11.5+1.5, HEIGHT - 27 - 3 * d2, d1+8, d1)){ + keyDown({ + keyCode: 8 + }) + } + +}
\ No newline at end of file diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..82d6582 --- /dev/null +++ b/package-lock.json @@ -0,0 +1,395 @@ +{ + "name": "nanochat", + "version": "1.0.0", + "lockfileVersion": 1, + "requires": true, + "dependencies": { + "accepts": { + "version": "1.3.7", + "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.7.tgz", + "integrity": "sha512-Il80Qs2WjYlJIBNzNkK6KYqlVMTbZLXgHx2oT0pU/fjRHyEp+PEfEPY0R3WCwAGVOtauxh1hOxNgIf5bv7dQpA==", + "requires": { + "mime-types": "~2.1.24", + "negotiator": "0.6.2" + } + }, + "array-flatten": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz", + "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI=" + }, + "body-parser": { + "version": "1.19.0", + "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.19.0.tgz", + "integrity": "sha512-dhEPs72UPbDnAQJ9ZKMNTP6ptJaionhP5cBb541nXPlW60Jepo9RV/a4fX4XWW9CuFNK22krhrj1+rgzifNCsw==", + "requires": { + "bytes": "3.1.0", + "content-type": "~1.0.4", + "debug": "2.6.9", + "depd": "~1.1.2", + "http-errors": "1.7.2", + "iconv-lite": "0.4.24", + "on-finished": "~2.3.0", + "qs": "6.7.0", + "raw-body": "2.4.0", + "type-is": "~1.6.17" + } + }, + "bytes": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.0.tgz", + "integrity": "sha512-zauLjrfCG+xvoyaqLoV8bLVXXNGC4JqlxFCutSDWA6fJrTo2ZuvLYTqZ7aHBLZSMOopbzwv8f+wZcVzfVTI2Dg==" + }, + "content-disposition": { + "version": "0.5.3", + "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.3.tgz", + "integrity": "sha512-ExO0774ikEObIAEV9kDo50o+79VCUdEB6n6lzKgGwupcVeRlhrj3qGAfwq8G6uBJjkqLrhT0qEYFcWng8z1z0g==", + "requires": { + "safe-buffer": "5.1.2" + } + }, + "content-type": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.4.tgz", + "integrity": "sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA==" + }, + "cookie": { + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.0.tgz", + "integrity": "sha512-+Hp8fLp57wnUSt0tY0tHEXh4voZRDnoIrZPqlo3DPiI4y9lwg/jqx+1Om94/W6ZaPDOUbnjOt/99w66zk+l1Xg==" + }, + "cookie-signature": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz", + "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw=" + }, + "debug": { + "version": "2.6.9", + "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz", + "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==", + "requires": { + "ms": "2.0.0" + } + }, + "depd": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.2.tgz", + "integrity": "sha1-m81S4UwJd2PnSbJ0xDRu0uVgtak=" + }, + "destroy": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz", + "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA=" + }, + "ee-first": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz", + "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0=" + }, + "encodeurl": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz", + "integrity": "sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k=" + }, + "escape-html": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz", + "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg=" + }, + "etag": { + "version": "1.8.1", + "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz", + "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc=" + }, + "express": { + "version": "4.17.1", + "resolved": "https://registry.npmjs.org/express/-/express-4.17.1.tgz", + "integrity": "sha512-mHJ9O79RqluphRrcw2X/GTh3k9tVv8YcoyY4Kkh4WDMUYKRZUq0h1o0w2rrrxBqM7VoeUVqgb27xlEMXTnYt4g==", + "requires": { + "accepts": "~1.3.7", + "array-flatten": "1.1.1", + "body-parser": "1.19.0", + "content-disposition": "0.5.3", + "content-type": "~1.0.4", + "cookie": "0.4.0", + "cookie-signature": "1.0.6", + "debug": "2.6.9", + "depd": "~1.1.2", + "encodeurl": "~1.0.2", + "escape-html": "~1.0.3", + "etag": "~1.8.1", + "finalhandler": "~1.1.2", + "fresh": "0.5.2", + "merge-descriptors": "1.0.1", + "methods": "~1.1.2", + "on-finished": "~2.3.0", + "parseurl": "~1.3.3", + "path-to-regexp": "0.1.7", + "proxy-addr": "~2.0.5", + "qs": "6.7.0", + "range-parser": "~1.2.1", + "safe-buffer": "5.1.2", + "send": "0.17.1", + "serve-static": "1.14.1", + "setprototypeof": "1.1.1", + "statuses": "~1.5.0", + "type-is": "~1.6.18", + "utils-merge": "1.0.1", + "vary": "~1.1.2" + } + }, + "finalhandler": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.2.tgz", + "integrity": "sha512-aAWcW57uxVNrQZqFXjITpW3sIUQmHGG3qSb9mUah9MgMC4NeWhNOlNjXEYq3HjRAvL6arUviZGGJsBg6z0zsWA==", + "requires": { + "debug": "2.6.9", + "encodeurl": "~1.0.2", + "escape-html": "~1.0.3", + "on-finished": "~2.3.0", + "parseurl": "~1.3.3", + "statuses": "~1.5.0", + "unpipe": "~1.0.0" + } + }, + "forwarded": { + "version": "0.1.2", + "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz", + "integrity": "sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ=" + }, + "fresh": { + "version": "0.5.2", + "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz", + "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac=" + }, + "http-errors": { + "version": "1.7.2", + "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.7.2.tgz", + "integrity": "sha512-uUQBt3H/cSIVfch6i1EuPNy/YsRSOUBXTVfZ+yR7Zjez3qjBz6i9+i4zjNaoqcoFVI4lQJ5plg63TvGfRSDCRg==", + "requires": { + "depd": "~1.1.2", + "inherits": "2.0.3", + "setprototypeof": "1.1.1", + "statuses": ">= 1.5.0 < 2", + "toidentifier": "1.0.0" + } + }, + "iconv-lite": { + "version": "0.4.24", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", + "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==", + "requires": { + "safer-buffer": ">= 2.1.2 < 3" + } + }, + "inherits": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz", + "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=" + }, + "ipaddr.js": { + "version": "1.9.1", + "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz", + "integrity": "sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g==" + }, + "lodash-compat": { + "version": "3.10.2", + "resolved": "https://registry.npmjs.org/lodash-compat/-/lodash-compat-3.10.2.tgz", + "integrity": "sha1-xpQBKKnTD46QLNLPmf0Muk7PwYM=" + }, + "lodash-fp": { + "version": "0.10.4", + "resolved": "https://registry.npmjs.org/lodash-fp/-/lodash-fp-0.10.4.tgz", + "integrity": "sha1-KnjGVLJaDEZ1OiCqeG32Qcf4Lmc=", + "requires": { + "lodash-compat": "^3.10.2" + } + }, + "media-typer": { + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz", + "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g=" + }, + "merge-descriptors": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz", + "integrity": "sha1-sAqqVW3YtEVoFQ7J0blT8/kMu2E=" + }, + "methods": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz", + "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4=" + }, + "mime": { + "version": "1.6.0", + "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz", + "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==" + }, + "mime-db": { + "version": "1.44.0", + "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.44.0.tgz", + "integrity": "sha512-/NOTfLrsPBVeH7YtFPgsVWveuL+4SjjYxaQ1xtM1KMFj7HdxlBlxeyNLzhyJVx7r4rZGJAZ/6lkKCitSc/Nmpg==" + }, + "mime-types": { + "version": "2.1.27", + "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.27.tgz", + "integrity": "sha512-JIhqnCasI9yD+SsmkquHBxTSEuZdQX5BuQnS2Vc7puQQQ+8yiP5AY5uWhpdv4YL4VM5c6iliiYWPgJ/nJQLp7w==", + "requires": { + "mime-db": "1.44.0" + } + }, + "ml-sentiment": { + "version": "2.0.7", + "resolved": "https://registry.npmjs.org/ml-sentiment/-/ml-sentiment-2.0.7.tgz", + "integrity": "sha1-+LWaha0sQQfDMtCvtd6okntBHoE=", + "requires": { + "lodash-fp": "^0.10.4" + } + }, + "ms": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", + "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=" + }, + "negotiator": { + "version": "0.6.2", + "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.2.tgz", + "integrity": "sha512-hZXc7K2e+PgeI1eDBe/10Ard4ekbfrrqG8Ep+8Jmf4JID2bNg7NvCPOZN+kfF574pFQI7mum2AUqDidoKqcTOw==" + }, + "on-finished": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz", + "integrity": "sha1-IPEzZIGwg811M3mSoWlxqi2QaUc=", + "requires": { + "ee-first": "1.1.1" + } + }, + "parseurl": { + "version": "1.3.3", + "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz", + "integrity": "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==" + }, + "path-to-regexp": { + "version": "0.1.7", + "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz", + "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w=" + }, + "proxy-addr": { + "version": "2.0.6", + "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.6.tgz", + "integrity": "sha512-dh/frvCBVmSsDYzw6n926jv974gddhkFPfiN8hPOi30Wax25QZyZEGveluCgliBnqmuM+UJmBErbAUFIoDbjOw==", + "requires": { + "forwarded": "~0.1.2", + "ipaddr.js": "1.9.1" + } + }, + "qs": { + "version": "6.7.0", + "resolved": "https://registry.npmjs.org/qs/-/qs-6.7.0.tgz", + "integrity": "sha512-VCdBRNFTX1fyE7Nb6FYoURo/SPe62QCaAyzJvUjwRaIsc+NePBEniHlvxFmmX56+HZphIGtV0XeCirBtpDrTyQ==" + }, + "range-parser": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz", + "integrity": "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==" + }, + "raw-body": { + "version": "2.4.0", + "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.4.0.tgz", + "integrity": "sha512-4Oz8DUIwdvoa5qMJelxipzi/iJIi40O5cGV1wNYp5hvZP8ZN0T+jiNkL0QepXs+EsQ9XJ8ipEDoiH70ySUJP3Q==", + "requires": { + "bytes": "3.1.0", + "http-errors": "1.7.2", + "iconv-lite": "0.4.24", + "unpipe": "1.0.0" + } + }, + "safe-buffer": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz", + "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==" + }, + "safer-buffer": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz", + "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==" + }, + "send": { + "version": "0.17.1", + "resolved": "https://registry.npmjs.org/send/-/send-0.17.1.tgz", + "integrity": "sha512-BsVKsiGcQMFwT8UxypobUKyv7irCNRHk1T0G680vk88yf6LBByGcZJOTJCrTP2xVN6yI+XjPJcNuE3V4fT9sAg==", + "requires": { + "debug": "2.6.9", + "depd": "~1.1.2", + "destroy": "~1.0.4", + "encodeurl": "~1.0.2", + "escape-html": "~1.0.3", + "etag": "~1.8.1", + "fresh": "0.5.2", + "http-errors": "~1.7.2", + "mime": "1.6.0", + "ms": "2.1.1", + "on-finished": "~2.3.0", + "range-parser": "~1.2.1", + "statuses": "~1.5.0" + }, + "dependencies": { + "ms": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz", + "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==" + } + } + }, + "serve-static": { + "version": "1.14.1", + "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.14.1.tgz", + "integrity": "sha512-JMrvUwE54emCYWlTI+hGrGv5I8dEwmco/00EvkzIIsR7MqrHonbD9pO2MOfFnpFntl7ecpZs+3mW+XbQZu9QCg==", + "requires": { + "encodeurl": "~1.0.2", + "escape-html": "~1.0.3", + "parseurl": "~1.3.3", + "send": "0.17.1" + } + }, + "setprototypeof": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.1.tgz", + "integrity": "sha512-JvdAWfbXeIGaZ9cILp38HntZSFSo3mWg6xGcJJsd+d4aRMOqauag1C63dJfDw7OaMYwEbHMOxEZ1lqVRYP2OAw==" + }, + "statuses": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz", + "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow=" + }, + "toidentifier": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz", + "integrity": "sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==" + }, + "type-is": { + "version": "1.6.18", + "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz", + "integrity": "sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==", + "requires": { + "media-typer": "0.3.0", + "mime-types": "~2.1.24" + } + }, + "unpipe": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz", + "integrity": "sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw=" + }, + "utils-merge": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz", + "integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM=" + }, + "vary": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz", + "integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=" + } + } +} diff --git a/package.json b/package.json new file mode 100644 index 0000000..5149d2f --- /dev/null +++ b/package.json @@ -0,0 +1,16 @@ +{ + "name": "nanochat", + "version": "1.0.0", + "description": "", + "main": "main.js", + "scripts": { + "test": "echo \"Error: no test specified\" && exit 1" + }, + "author": "", + "license": "ISC", + "dependencies": { + "body-parser": "^1.19.0", + "express": "^4.17.1", + "ml-sentiment": "^2.0.7" + } +} diff --git a/update-component.js b/update-component.js new file mode 100644 index 0000000..2fd4819 --- /dev/null +++ b/update-component.js @@ -0,0 +1,463 @@ +events = {} +events[5 * FPS] = function(){ + messages.unshift({ + type: 1, + text: "l0st" + }) +} +events[8 * FPS] = function(){ + messages.unshift({ + type: 2, + from: "l0st", + text: "hi...", + pixels: [] + }) +} +normalUpdate = { + update: function(){ + if(t in events){ + events[t]() + } + t++ + if(currentMessagePixels.length >= smile.length){ + currentMessagePixels = currentMessagePixels.slice(0, smile.length) + transform(currentMessagePixels, smile, 100) + } + } +} +function transform(fromPixels, toPixels, period){ + for(var i = 0 ; i < toPixels.length; i++){ + var actualDX = toPixels[i].x - fromPixels[i].x; + var actualDY = toPixels[i].y - fromPixels[i].y; + var dX = Math.sign(actualDX) * Math.min(1, Math.abs(actualDX)) + var dY = Math.sign(actualDY) * Math.min(1, Math.abs(actualDY)) + fromPixels[i].x += dX + fromPixels[i].y += dY + } +} +var smile = [ + { + "x": 117, + "y": -62.5 + }, + { + "x": 116, + "y": -63 + }, + { + "x": 116, + "y": -62 + }, + { + "x": 115, + "y": -62 + }, + { + "x": 114, + "y": -61 + }, + { + "x": 114, + "y": -61 + }, + { + "x": 115, + "y": -61 + }, + { + "x": 115, + "y": -61 + }, + { + "x": 115, + "y": -61 + }, + { + "x": 116, + "y": -61 + }, + { + "x": 116, + "y": -60 + }, + { + "x": 116, + "y": -60 + }, + { + "x": 116, + "y": -60 + }, + { + "x": 116, + "y": -60 + }, + { + "x": 116, + "y": -60 + }, + { + "x": 116, + "y": -60 + }, + { + "x": 117, + "y": -60 + }, + { + "x": 117, + "y": -60 + }, + { + "x": 117, + "y": -61 + }, + { + "x": 142.5, + "y": -62 + }, + { + "x": 142, + "y": -62 + }, + { + "x": 142, + "y": -62 + }, + { + "x": 142, + "y": -62 + }, + { + "x": 142, + "y": -62 + }, + { + "x": 142, + "y": -61 + }, + { + "x": 142, + "y": -61 + }, + { + "x": 142, + "y": -61 + }, + { + "x": 142, + "y": -61 + }, + { + "x": 143, + "y": -61 + }, + { + "x": 143, + "y": -61 + }, + { + "x": 143, + "y": -61 + }, + { + "x": 144, + "y": -61 + }, + { + "x": 144, + "y": -62 + }, + { + "x": 144, + "y": -62 + }, + { + "x": 144, + "y": -62 + }, + { + "x": 143, + "y": -62 + }, + { + "x": 143, + "y": -62 + }, + { + "x": 143, + "y": -62 + }, + { + "x": 142, + "y": -61 + }, + { + "x": 142, + "y": -60 + }, + { + "x": 142, + "y": -59 + }, + { + "x": 142, + "y": -59 + }, + { + "x": 142, + "y": -59 + }, + { + "x": 143, + "y": -59 + }, + { + "x": 143, + "y": -59 + }, + { + "x": 144, + "y": -59 + }, + { + "x": 144, + "y": -59 + }, + { + "x": 145, + "y": -59 + }, + { + "x": 145, + "y": -59 + }, + { + "x": 145, + "y": -60 + }, + { + "x": 145, + "y": -60 + }, + { + "x": 145, + "y": -60 + }, + { + "x": 144, + "y": -60 + }, + { + "x": 114, + "y": -35.5 + }, + { + "x": 114, + "y": -36 + }, + { + "x": 114, + "y": -36 + }, + { + "x": 114, + "y": -35 + }, + { + "x": 114, + "y": -35 + }, + { + "x": 114, + "y": -34 + }, + { + "x": 114, + "y": -33 + }, + { + "x": 114, + "y": -33 + }, + { + "x": 114, + "y": -32 + }, + { + "x": 115, + "y": -32 + }, + { + "x": 117, + "y": -31 + }, + { + "x": 119, + "y": -30 + }, + { + "x": 120, + "y": -29 + }, + { + "x": 121, + "y": -28 + }, + { + "x": 122, + "y": -27 + }, + { + "x": 123, + "y": -26 + }, + { + "x": 125, + "y": -26 + }, + { + "x": 126, + "y": -25 + }, + { + "x": 127, + "y": -25 + }, + { + "x": 128, + "y": -24 + }, + { + "x": 129, + "y": -24 + }, + { + "x": 130, + "y": -24 + }, + { + "x": 131, + "y": -24 + }, + { + "x": 131, + "y": -24 + }, + { + "x": 132, + "y": -24 + }, + { + "x": 133, + "y": -24 + }, + { + "x": 134, + "y": -24 + }, + { + "x": 135, + "y": -24 + }, + { + "x": 136, + "y": -24 + }, + { + "x": 138, + "y": -25 + }, + { + "x": 139, + "y": -25 + }, + { + "x": 140, + "y": -26 + }, + { + "x": 141, + "y": -27 + }, + { + "x": 142, + "y": -27 + }, + { + "x": 143, + "y": -28 + }, + { + "x": 143, + "y": -29 + }, + { + "x": 144, + "y": -30 + }, + { + "x": 145, + "y": -30 + }, + { + "x": 145, + "y": -31 + }, + { + "x": 146, + "y": -32 + }, + { + "x": 146, + "y": -32 + }, + { + "x": 147, + "y": -33 + }, + { + "x": 147, + "y": -33 + }, + { + "x": 148, + "y": -34 + }, + { + "x": 148, + "y": -35 + }, + { + "x": 148, + "y": -35 + }, + { + "x": 148, + "y": -36 + }, + { + "x": 149, + "y": -36 + }, + { + "x": 149, + "y": -37 + }, + { + "x": 149, + "y": -37 + }, + { + "x": 149, + "y": -38 + }, + { + "x": 149, + "y": -38 + }, + { + "x": 149, + "y": -39 + } + ]
\ No newline at end of file |