Elite Diviner
- Joined
- Apr 5, 2014
- Messages
- 464
- Reaction score
- 223
I tried telling her that a few days ago and even attempted to hook her up with a basic setup - where she said that doing it in ES5 with <script> would be better for her project@Luicy By now I bet you have thought to yourself that adding all script tags to the index in the correct order is a pain in the butt. A module bundler and taskrunner (and preferably a transpiler) is going to be a lifesaver for this project in the long run and is pretty much used for all modern js projects regardless of size.
The standard in the js community now a days is usingYou must be registered to see linkswithYou must be registered to see links.
It's 100% worth investing some time understanding how it works, and once you do, you're never going to not use it!
Good luck on your project
He deleted all three of ours posts, mine, yours, and Chris's, and I see why he did it. So that, this wasn't gonna happen.@Taiga stop censoring. The math.floor is an alternative for reinventing the wheel. No need to just delete my posts....
- Modified the canvas handler to work asyncronously.
You probably want to avoid drawing images async in a renderloop as your images will appear in the wrong order.
I meant Async between canvas's.
[COLOR=#6F42C1]$[/COLOR][COLOR=#24292E](image).[/COLOR][COLOR=#6F42C1]on[/COLOR][COLOR=#24292E]([/COLOR][COLOR=#032F62]"load"[/COLOR][COLOR=#24292E], [/COLOR][COLOR=#D73A49]function[/COLOR][COLOR=#24292E]() {
// draw the image
}[/COLOR]
All your drawImage/drawSprite methods are async when the image has not been loaded yet.
Code:[COLOR=#6F42C1]$[/COLOR][COLOR=#24292E](image).[/COLOR][COLOR=#6F42C1]on[/COLOR][COLOR=#24292E]([/COLOR][COLOR=#032F62]"load"[/COLOR][COLOR=#24292E], [/COLOR][COLOR=#D73A49]function[/COLOR][COLOR=#24292E]() { // draw the image }[/COLOR]
inside a function that will be called 30+ times a second
Git 1.0.1
- Created a simple Image2Array console application, converts a bitmap to a pixel array with color & position.
- Implemented a client sided image caching class, this is ran every single time the client loads.
- Moved the loading action messages to a single client_config.json.
- Implemented dynamic landing views, meaning they are defined in the client_config.json
- Implemented text variables: bottom tool bar, generic alerts, catalogue title.
- Changed font from WOFF to default TTF.
- Modified the canvas handler to work asyncronously.
- Added a CanvasHandler.drawImageSprite, works as defined.
- Added a CanvasHandler.setContextShadow, to allow image and object shadows.
- Added a CanvasHandler.calculateImage which both caches and calculates an image's width and heigth.
- Moved almost all configuration to a single class.
- Implemented a few socket handlings.
- Implemented the bottom bar and landing view.
- And more, review the GitHub link below.
See all changes on theYou must be registered to see links.
It'll probably be a better idea to stack Async/Await tasks then use Async.waterfallI just have a few questions and comments..
- What is the purpose of converting images to a json format?
- Be careful to not make the CanvasHandler to big/have much responsibility. I suggest to splits things up in smaller and manageable chunks.
- Why not send JSON via WebSockets instead of just strings (anything else to make your life easier works too)? Or atleast make something to make message handling alot easier.
- Whats the reason of making new canvasses? The "newCanvas" and "newContext" is quite worring me..
- Make sure you code maintanable. I see alot of hardcoded numbers and stuff. For example the Catalog contains lots of rectangle positions and stuff. I've no clue what it does.
- Your main.js is just a pain to see (sorry). There are libraries which solve that problem (or atleast the solution is better). For example: async-waterfall.
- Whats the reason of making new canvasses? The "newCanvas" and "newContext" is quite worring me..
It'll probably be a better idea to stack Async/Await tasks then use Async.waterfall
I just have a few questions and comments..
- What is the purpose of converting images to a json format?
- Be careful to not make the CanvasHandler to big/have much responsibility. I suggest to splits things up in smaller and manageable chunks.
- Why not send JSON via WebSockets instead of just strings (anything else to make your life easier works too)? Or atleast make something to make message handling alot easier.
- Whats the reason of making new canvasses? The "newCanvas" and "newContext" is quite worring me..
- Make sure you code maintanable. I see alot of hardcoded numbers and stuff. For example the Catalog contains lots of rectangle positions and stuff. I've no clue what it does.
- Your main.js is just a pain to see (sorry). There are libraries which solve that problem (or atleast the solution is better). For example: async-waterfall.