All Activity

Merge intro (match3 game) - Air balloon

NEAT!!!

As you may know I really love one button games, thats why I have a one button site, you just click the screen to navigate, experiment and play. I'm not an expert in HTML5 (I know how to do animations and buttons, create variables and random numbers)but I made this demo some time ago playing with variables and movement to create my own hit detection and las week I decided to make it a game, very simple, but for me is big goal. I'll explain, you have a random number that tell the balls to pick a place to fall, that generate a variable, and the character is just an animation that moves side to side with a single button and creates a variable depending on the line is walking on, and if the 2 variables meet you have a hit. Is very simple game, but I'm so proud of it, I'm learning HTML5 and this will be awesome. PLAY DODGE And if you are interested, check my one button site that I'm making as an inclusive free site c1ic.mx

Hello fellow forum users, I'm facing some problems when trying to load pixi within a vue component. In order for pixi to be available within the component, I declare new PIXI.Application() within the data() segment of Vue. This works fine and I can even load a texture and display it within the appropriate HTML element I reserved for the canvas. In other words, I can replicate pixi.js tutorial 1 within a vue component without problems. The problem I'm facing is when I try to add a plain, no fancy Text element. Then, I get an error saying that: "CanvasRenderingContext2D.createPattern: Argument 1 could not be converted to any of: HTMLImageElement, SVGImageElement, HTMLCanvasElement, HTMLVideoElement, OffscreenCanvas, ImageBitmap, VideoFrame." This is in Firefox, in Brave I get: "Failed to execute 'createPattern' on 'CanvasRenderingContext2D': The provided value is not of type '(CSSImageValue or HTMLCanvasElement or HTMLImageElement or HTMLVideoElement or ImageBitmap or OffscreenCanvas or SVGImageElement or VideoFrame)'." I will leave here my code for the Vue component for your reference: <template> <div ref="stage"></div> </template> <script> import * as PIXI from 'pixi.js'; export default { data() { return { app: new PIXI.Application(), }; }, mounted() { (async () => { await this.app.init({ background: '#FFFFFF', // Background color, EP black resizeTo: HTMLElement, width: 1280, height: 720, antialias: true, // So that lines do not look crappy autoDensity: true // What does this do? }); this.$refs.stage.appendChild(this.app.canvas); const texture = await PIXI.Assets.load('https://pixijs.com/assets/bunny.png'); const bunny = new PIXI.Sprite(texture); this.app.stage.addChild(bunny); bunny.x = this.app.screen.width / 2; bunny.y = this.app.screen.height / 2; const basicText = new PIXI.Text({ text: 'Hello World'}); basicText.x = this.app.screen.width / 2; basicText.y = this.app.screen.height / 2; this.app.stage.addChild(basicText); })(); }, }; </script> <style> </style> If you remove the line where basicText is added to the stage, you get no error. I'm using the latest version of pixi (8.1). Thanks for your time reading my post and for providing any tips 🙂 BR, 2nOrderEDO

The RevoltFX effects framework now runs with the latest PixiJS version (8.1.0). https://github.com/bma73/revolt-fx We've also updated the examples https://github.com/bma73/revolt-fx-examples See a live demo: https://samples.revoltfx.electronauts.net/ To create your own effects use the RevoltFX online editor https://editor.revoltfx.electronauts.net/ https://github.com/bma73/revolt-fx-editor Stay tuned - there's more to come :-)

Hello, When I switch from battle system I try to unloadAll Assets. My code seems to destroy all textures the one's from spine2d, mp4, png. For some reason spine2d assets are still in garbage resulting in having 2.3gb of ram usage instead of aroung 500mb when only UI is loaded. My code works for sure for other assets, as when menu is loaded it takes about 550mb of ram and when unloaded all assets it goes down to 250mb.Spine2d assets for menu are still there as game at start takes 150mb of ram. // inside function that is triggered on back button click destroyContainer(battlePrepareContainer, true); unloadAssets(_.flatten([(Object.values(firstToLoad)), (Object.values(transitions))])); export const destroyContainer = (containerName: Container | string, full = false) => { const destroyOptions = { children: true, texture: full, baseTexture: full, }; const destroySpine = (spine: Spine) => { spine.spineDebug.debugGroup.destroy(destroyOptions); spine.spineDebug = null; spine.removeAllListeners(); spine.parent.removeChild(spine); if (spinePool.has(spine.name)) { spinePool.delete(spine.name) } console.log('spine', spine); spine.destroy(destroyOptions); spine = null; }; const destroyChildrenRecursive = (container: Container) => { container.children.forEach((child) => { if (child instanceof Spine) { destroySpine(child); } else if (child instanceof Container) { destroyChildrenRecursive(child); } else { child.removeAllListeners(); child.destroy(destroyOptions); child = null; } }); }; const destroyContainerAndChildren = (container: Container) => { destroyChildrenRecursive(container); container.removeAllListeners(); container.destroy(destroyOptions); container = null; }; if (typeof containerName === 'string') { if (window[containerName] && window[containerName] instanceof Container) { destroyContainerAndChildren(window[containerName]); window[containerName] = undefined; } } else if (containerName instanceof Container) { destroyContainerAndChildren(containerName); } }; export const unloadAssets = (exceptions: loadObject[]) => { const cacheKeys: string[] = Array.from(Assets.cache['_cacheMap'].keys()); const exceptionNames = exceptions.map((exception) => exception.name); const menuKeys = cacheKeys.filter((key: string) => { if (!key.includes('common') && !key.includes('assets/') && !exceptionNames.includes(key)) { return true; } return false; }); void Assets.unload(menuKeys) }

They do not pay anyone who is a fraud. Stop publishing your games.

I was supposed to get paid in May 2024; but no payment and they did not reply to my email. 🤬

Hi, yes most are real players but if playercounts low (usually under 20) it is populated with bots, they have generic names. I was working on this game for a long time and the players are from many gaming portals and a site called Replit on which it was really popular ( https://replit.com/@CoderGautamYT/swordbattleio

Very entertain game, good work!

Hi, I made a dominoes game to play through the browser. Check it out, what do you think? https://blitzplay.games/game/domino-masters

Can you show youe website? Can I buy it?

I m looking for PHP or content adder or developer on project https://hrani.eu. Just beginner, it s simply way written. Contact e please. In future paid way cooperation.

Hey Everyone, Here's another brand new MP3 track on my Sci-Fi 12 page: "INTROSPECTIVE MACHINE INTELLIGENCE" https://soundimage.org/sci-fi-12/ I wonder what kinds of things they will ponder. Anyhow...enjoy and keep creating cool stuff! 🙂

Funny, Simple and entertaining game. Appreciate your work. Regards Solserv

This is a very simple game I made in flash long time ago, I wanted to make the same game using HTML5, I just know how to make little animations and buttons and thats all I need to make games like this one. Click anywhere to play and make the dog jump, try to catch as many frisbees as you can. You can play this little game here https://c1ic.mx/perro/ I hope you like it !!!

NEWS and updates! I'm making the one button version of this Whack-a-mole game, can you imagine a game like this with one button?

That was a very entertain game! Are those real players or bots?

I added this step: - Add the Rollup bin folder to the Path. Type this command to know where npm was installed `npm config get prefix`. This command will show you the npm location. You will find the "node_modules" folder there. Go to the "rollup/bin" folder and copy this path, for example for me: `C:\Users\8Observer8\AppData\Roaming\npm\node_modules\rollup\dist\bin`. Add this folder to the path variable.

Наша бригада опытных мастеров находится в готовности подать вам передовые средства, которые не только обеспечивают надежную защиту от холодных воздействий, но и подарят вашему дому современный вид. Мы практикуем с новыми составами, подтверждая долгосрочный термин работы и отличные результирующие показатели. Изоляция облицовки – это не только экономия ресурсов на отапливании, но и заботливость о окружающей среде. Сберегательные разработки, какие мы применяем, способствуют не только жилищу, но и сохранению природных богатств. Самое первоочередное: [url=https://ppu-prof.ru/]Утепление и штукатурка фасада цена за квадратный[/url] у нас начинается всего от 1250 рублей за квадратный метр! Это доступное решение, которое превратит ваш жилище в действительный тепличный локал с минимальными затратами. Наши проекты – это не просто изоляция, это составление территории, в где всякий элемент отражает ваш собственный стиль. Мы примем все ваши просьбы, чтобы осуществить ваш дом еще более комфортным и привлекательным. Подробнее на [url=https://ppu-prof.ru/]https://www.ppu-prof.ru/[/url] Не откладывайте труды о своем доме на потом! Обращайтесь к специалистам, и мы сделаем ваш обиталище не только теплым, но и по последней моде. Заинтересовались? Подробнее о наших сервисах вы можете узнать на интернет-портале. Добро пожаловать в пределы комфорта и качественного исполнения.

My simple examples with Box2D-WASM: pure WebGL 1.0: Basic Examples of Using Box2D-WASM with pure WebGL 1.0 in JavaScript Phaser 3: Basic Examples of Using Box2D-WASM with Phaser 3 in JavaScript Pixi.js 7: Basic Examples of Using Box2D-WASM with Pixi.js in JavaScript Melon.js: Basic Examples of Using Box2D-WASM with Melon.js in JavaScript Three.js: Basic Examples of Using Box2D-WASM with Three.js in JavaScript

Playground: https://plnkr.co/edit/BGNYcIJRiJXpd9N4?preview GitHub: https://github.com/8Observer8/how-to-set-up-box2dwasm-with-importmap-rollup-js glMatrix is just a bonus: index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>How to set up Box2D-WASM with importmap and Rollup for JavaScript</title> </head> <body> <!-- Since import maps are not yet supported by all browsers, it is necessary to add the polyfill es-module-shims.js Source: https://threejs.org/docs/index.html#manual/en/introduction/Installation --> <script async src="https://unpkg.com/[email protected]/dist/es-module-shims.js"></script> <script type="importmap"> { "imports": { "box2d-wasm": "https://unpkg.com/[email protected]/dist/es/Box2D.js", "gl-matrix": "https://cdn.jsdelivr.net/npm/[email protected]/+esm" } } </script> <script type="module" src="./js/index.js"></script> </body> </html> init-box2d.js import Box2DLib from "box2d-wasm"; export let box2d = null; export function initBox2D() { return new Promise(resolve => { Box2DLib().then((re) => { box2d = re; resolve(); }); }); } index.js import { box2d, initBox2D } from "./init-box2d.js"; import { mat4, glMatrix } from "gl-matrix"; async function init() { await initBox2D(); const { b2Vec2 } = box2d; const vec = new b2Vec2(1, 2); console.log(`vec = (x: ${vec.x}, y: ${vec.y})`); const mat = mat4.create(); console.log(mat); console.log(glMatrix.toRadian(45)); } init(); Instructions for building and running the project in debug and release: - Download and unzip this example: https://github.com/8Observer8/how-to-set-up-box2dwasm-with-importmap-rollup-js - Go to the example folder in the console: `cd how-to-set-up-box2dwasm-with-importmap-rollup-js` - Install these packages globally with the command: > npm i -g http-server rollup uglify-js - Add the Rollup bin folder to the Path. Type this command to know where npm was installed `npm config get prefix`. This command will show you the npm location. You will find the "node_modules" folder there. Go to the "rollup/bin" folder and copy this path, for example for me: `C:\Users\8Observer8\AppData\Roaming\npm\node_modules\rollup\dist\bin`. Add this folder to the path variable. - Run http-server in the project directory: > http-server -c-1 Note. The `-c-1` key allows you to disable caching. - Start development mode with the following command: > npm run dev Note. Rollup will automatically keep track of saving changes to files and build a new index.js file ready for debugging. You can debug your project step by step in the browser by setting breakpoints. - Go to the browser and type the address: localhost:8080/index.html - Create a compressed file ready for publishing. Stop development mode, for example, with this command Ctrl + C in CMD, if it was launched before and enter the command: > npm run release Note. After this command, Rollup will create a compressed index.js file. Compression is done using the uglify-js package.

Remembered! Wanted to ask if you've considered adding some ads. The end of the run looks like the most suitable place for a video ad

Wrote a little review, but the post probably got deleted. Well, I did like you game. Great job!