What I've done so far is completed the majority of the required specifications on the issue that I was working on (following player bot while zoomed in). Though this took me a while to work on, even though this was an extension of an issue on worked on before zoom in and out of gamescreen, I had to refactor the code I did before to work with the issue I'm working with now. While I was refactoring, I cleaned up the code I had before, simplified the functions and made them
generally usable for other use cases.
After I got most of the specifications done, I encountered a bug where the function to follow the bot closely doesn't work initially after first loading the page. It had to be manually zoom in and out with mouse wheel first then it works fine. If not, it would break the entire zoom in and out functionality entirely and the page needs to be reloaded. This took me a while to figure out. It did not make sense to me, I had to put in a specific calculated value first then after that any value put in works fine.
What I had to do was this:
const newScale = Math.max(minZoom, Math.min(maxZoom, app.stage.scale.x + 10));
const botPos = { x: firstBot.x, y: firstBot.y };
smoothZoom(botPos, newScale);
As suppose to just this:
const botPos = { x: firstBot.x, y: firstBot.y };
smoothZoom(botPos, 1);
Need to look at it more so I can figure out what's going on. For now it is fixed.
Goal
As for my goals from my planning phase. Everything seems to be moving smoothly, I am trying to be more thorough with my work. Double checking my code, trying follow the maintainers coding standard and style, and thoroughly checking for any potential addition they may add.
Research
Currently I'm looking into more about zooming in canvas with for .vue. So I can figure out what's going on with that issue and if I can improve upon my code or add more functionalities. But what I learned so far from it is that .vue seems to be a good framework to work with for dynamic changes and animations on a canvas. For instance I find it really neat for something to move smoothly on a canvas and zoom in and out also. I thought I would need something complex for that to happen.
Conclusion
I learned so many things working on this project. Especially when this is the first time I'm working with .vue and I don't have a lot of experience with typescript. This might be something that I might use later on for my personal project. Though I need more research on it to actually do that which will come in time as I work with it more.
Top comments (0)