From 3f7ec817b4a140c42d43c8b3401bf13c858f5aa6 Mon Sep 17 00:00:00 2001 From: Federico Rodriguez Date: Fri, 2 Dec 2022 14:26:01 -0300 Subject: [PATCH] Point array buffer to the correct location on colorShaderDrawRectangle --- dev/watch.js | 32 ++++---- package-lock.json | 187 ++++++++++++++++++++++++++++++++++++++++++++-- package.json | 5 +- src/index.ts | 26 ++----- src/shaders.ts | 15 +++- 5 files changed, 218 insertions(+), 47 deletions(-) diff --git a/dev/watch.js b/dev/watch.js index aac70bf..2f66dd6 100644 --- a/dev/watch.js +++ b/dev/watch.js @@ -1,21 +1,23 @@ -const fsevents = require('fsevents'); +const chokidar = require('chokidar'); const { exec } = require('child_process'); console.log("Started watching /src directory..."); -const stop = fsevents.watch('./src', (path, flags, id) => { - const info = fsevents.getInfo(path, flags, id); - if(info.event === 'moved') { - console.log(`Detected change in ${info.path}.`); - exec('./build.sh dev', (error, stdout, stderr) => { - if(error) { - console.log(`error: ${error.message}`); - } - if(stderr) { - console.log(`srderr: ${stderr}`); - } +const command = './bash.rc'; - console.log(stdout); - }) - } +chokidar.watch('./src', (path) => { + console.log(`Detected change in ${path}.`); + try { + exec(command, (error, stdout, stderr) => { + console.log(stdout); + if(error) { + console.log(`error: ${error.message}`); + } + if(stderr) { + console.log(`stderr: ${stderr}`); + } + }) + } catch(e) { + console.log(`FAILED: ${e}`); + } }) diff --git a/package-lock.json b/package-lock.json index 103e1f8..1cfe365 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,14 +1,187 @@ { "name": "svg-draw", "version": "1.0.0", - "lockfileVersion": 1, + "lockfileVersion": 3, "requires": true, - "dependencies": { - "fsevents": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.1.2.tgz", - "integrity": "sha512-R4wDiBwZ0KzpgOWetKDug1FZcYhqYnUYKtfZYt4mD5SBz76q0KR4Q9o7GIPamsVPGmW3EYPPJ0dOOjvx32ldZA==", - "dev": true + "packages": { + "": { + "name": "svg-draw", + "version": "1.0.0", + "license": "ISC", + "dependencies": { + "chokidar": "^3.5.3" + } + }, + "node_modules/anymatch": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz", + "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==", + "dependencies": { + "normalize-path": "^3.0.0", + "picomatch": "^2.0.4" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/binary-extensions": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz", + "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==", + "engines": { + "node": ">=8" + } + }, + "node_modules/braces": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", + "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", + "dependencies": { + "fill-range": "^7.0.1" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/chokidar": { + "version": "3.5.3", + "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz", + "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==", + "funding": [ + { + "type": "individual", + "url": "https://paulmillr.com/funding/" + } + ], + "dependencies": { + "anymatch": "~3.1.2", + "braces": "~3.0.2", + "glob-parent": "~5.1.2", + "is-binary-path": "~2.1.0", + "is-glob": "~4.0.1", + "normalize-path": "~3.0.0", + "readdirp": "~3.6.0" + }, + "engines": { + "node": ">= 8.10.0" + }, + "optionalDependencies": { + "fsevents": "~2.3.2" + } + }, + "node_modules/fill-range": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", + "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", + "dependencies": { + "to-regex-range": "^5.0.1" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/fsevents": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", + "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", + "hasInstallScript": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": "^8.16.0 || ^10.6.0 || >=11.0.0" + } + }, + "node_modules/glob-parent": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "dependencies": { + "is-glob": "^4.0.1" + }, + "engines": { + "node": ">= 6" + } + }, + "node_modules/is-binary-path": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz", + "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==", + "dependencies": { + "binary-extensions": "^2.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/is-extglob": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", + "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/is-glob": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz", + "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==", + "dependencies": { + "is-extglob": "^2.1.1" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/is-number": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", + "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", + "engines": { + "node": ">=0.12.0" + } + }, + "node_modules/normalize-path": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", + "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/picomatch": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", + "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", + "engines": { + "node": ">=8.6" + }, + "funding": { + "url": "https://github.com/sponsors/jonschlinkert" + } + }, + "node_modules/readdirp": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", + "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", + "dependencies": { + "picomatch": "^2.2.1" + }, + "engines": { + "node": ">=8.10.0" + } + }, + "node_modules/to-regex-range": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", + "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", + "dependencies": { + "is-number": "^7.0.0" + }, + "engines": { + "node": ">=8.0" + } } } } diff --git a/package.json b/package.json index fa85948..afb7540 100644 --- a/package.json +++ b/package.json @@ -16,8 +16,7 @@ "url": "https://github.com/elfedy/svg-draw/issues" }, "homepage": "https://github.com/elfedy/svg-draw#readme", - "dependencies": {}, - "devDependencies": { - "fsevents": "^2.1.2" + "dependencies": { + "chokidar": "^3.5.3" } } diff --git a/src/index.ts b/src/index.ts index 9ab6869..a4a7920 100644 --- a/src/index.ts +++ b/src/index.ts @@ -38,7 +38,7 @@ function run(sprite) { [ 'x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x'], [ 'x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x'], [ 'x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x','x'], - ] + ]; if(gl === null) { @@ -256,7 +256,7 @@ function run(sprite) { }, // Enemies - enemySpawnCountdown: 3 * time.seconds, + enemySpawnCountdown: 1 * time.seconds, enemyColor: { r: 0.8, g: 0.2, @@ -562,17 +562,6 @@ function run(sprite) { // ColorShader // Create and bind buffer to the position attribute gl.useProgram(colorShaderProgram); - gl.bindBuffer(gl.ARRAY_BUFFER, colorShader.buffers.aPosition); - gl.vertexAttribPointer( - colorShader.locations.aPosition, - 2, // size: components per iteration - gl.FLOAT, // data type - false, // normalize - 0, // stride: bytes between beggining of consecutive vetex attributes in buffer - 0 // offset: where to start reading data from the buffer - ); - // Enable vertex attribute - gl.enableVertexAttribArray(colorShader.locations.aPosition); // TODO(fede): optimize tile drawing: // * Just do a single pass through all the tiles. @@ -593,9 +582,9 @@ function run(sprite) { // Draw Tiles and store ground tiles to render // after bullets let grassTiles = [] - for(var row = 0; row < Game.tileRows; row++) { - for(var col = 0; col < Game.tileCols; col++) { - var tile = Game.tiles[row][col]; + for(let row = 0; row < Game.tileRows; row++) { + for(let col = 0; col < Game.tileCols; col++) { + let tile = Game.tiles[row][col]; if(tile == 'x') continue; if(tile !== 'g') { let tileName @@ -624,7 +613,6 @@ function run(sprite) { } } } - gl.useProgram(colorShaderProgram); // DrawBullets @@ -851,8 +839,8 @@ function bulletCreate(tank: Tank) { tank.bullet = { vx: vx, vy: vy, - width: 10, - height: 10, + width: 5, + height: 5, position: { x: tank.position.x, y: tank.position.y, diff --git a/src/shaders.ts b/src/shaders.ts index cc6cd88..bf0a3af 100644 --- a/src/shaders.ts +++ b/src/shaders.ts @@ -62,9 +62,19 @@ function squareVertices(width: number, height: number, x: number, y: number): nu } // COLOR SHADER -function colorShaderDrawRectangle(gl, colorShader, color: Color, width, height, x, y) +function colorShaderDrawRectangle(gl, colorShader, color: Color, width, height, x, y, debugMe =false) { - var glLocations = colorShader.locations; + let glLocations = colorShader.locations; + gl.bindBuffer(gl.ARRAY_BUFFER, colorShader.buffers.aPosition); + gl.vertexAttribPointer( + glLocations.aPosition, + 2, // size: components per iteration + gl.FLOAT, // data type + false, // normalize + 0, // stride: bytes between beggining of consecutive vetex attributes in buffer + 0 // offset: where to start reading data from the buffer + ); + gl.enableVertexAttribArray(glLocations.aPosition); // Set matices var matrixProjection = mat3.projection(gl.canvas.width, gl.canvas.height); var matrixChangeOrigin = mat3.translation(-width / 2, -height / 2); @@ -141,7 +151,6 @@ var SPRITE_META = { width: 20, height: 20, }, - // TODO: The rest I added }; function textureShaderDrawTank(gl, textureShader, textureName, tank) {