Random shapes cover the playing area

Hextris / hextris

Fast paced HTML5 puzzle game inspired by Tetris!

https://hextris.io

Other

2.22k stars 971 forks source link

Random shapes cover the playing area #162

Open TJScalzo opened 8 years ago

TJScalzo commented 8 years ago

Random shapes appear at the top of the screen that cover the hexagon. It's pretty annoying and I'm not sure why it's happening. I'm on a 2011 MacBook Pro playing in Safari. Is it just because I have an old computer?

lengstrom commented 8 years ago

No, that's a canvas problem. I'm not sure why we have that problem. @garrettdreyfus and I will look into it.

lengstrom commented 8 years ago

Do you have any steps towards recreating that problem?

TJScalzo commented 8 years ago

I'm using Safari Version 9.0.2 (9537.86.3.9.1). I'm on a MacBook Pro 2011. Hm... what other information are you looking for?

TJScalzo commented 8 years ago

Well I don't know what changed (if anything) but there aren't any shapes covering the game anymore. That's a little strange...

rechl commented 8 years ago

I have the same problem on Safari on iOS 9.3. you can recreate this problem ( on a Mac at least) with the iOS simulator.

lengstrom commented 8 years ago

Do you guys have the problem on https://hextris.io/ still?

rechl commented 8 years ago

Yes it still exists. :( I investigated further. Seems to depend on actual screen size or ratio. Set the window height to 720px or 768px and it happens also on Chrome 49 on Mac

lengstrom commented 8 years ago

Thanks for further info! I'll look into it. Also, pull requests are welcome :)

On Tue, Apr 12, 2016 at 5:20 AM, sgotre notifications@github.com wrote:

Yes it still exists. :( I investigated further. Seems to depend on actual screen size or ratio. Set the window height to 720px or 768px and it happens also on Chrome 49 on Mac

— You are receiving this because you commented. Reply to this email directly or view it on GitHub https://github.com/Hextris/hextris/issues/162#issuecomment-208811750

hhiptmair commented 8 years ago

adding a font definition (e.g. "px Exo") to the renderText(...) calls in view.js seems to fix the problem:

change renderText(trueCanvas.width / 2 + gdx + 6 * settings.scale, trueCanvas.height / 2 + gdy - 155 * settings.scale, 150, "#2c3e50", "Hextris"); to renderText(trueCanvas.width / 2 + gdx + 6 * settings.scale, trueCanvas.height / 2 + gdy - 155 * settings.scale, 150, "#2c3e50", "Hextris", "px Expo"); etc

at least for me, this fixed an issue with huge text-overlays in the canvas.

rechl commented 8 years ago

Thanks for proposal @hhiptmair ! I will try this and create PR if it works!

hhiptmair commented 8 years ago

even better: just remove the "20" in the renderText-definition: var font = 'px Exo';

rechl commented 8 years ago

@hhiptmair you proposal worked fine regarding the visual elements. see http://teraone.github.io/hextris/

Unfortunately I still can not play within the iOS Simulator on iPad. We should try on a real device. Do you have an suggestions for debugging canvas elements in (mobile) safari?

lengstrom commented 8 years ago

Chrome debugger console works well (you can emulate a mobile platform). Sorry I'm not more involved right now because of finals - I'll definitely fix this by the time finals end in late May.

hhiptmair commented 8 years ago

hhiptmair commented 8 years ago

@sgotre for debugging canvas elements, the inspector-tool (switch to canvas in the menu) of firefox is quite powerful. but i assume there are plugins for chrome too

lengstrom commented 8 years ago

Thanks! I'll test and deploy in a few weeks.

ToStr1 commented 7 years ago

Windows 10 Chrome Version 60.0.3112.113 still experiencing this bug.

peter-jerry-ye commented 5 years ago

Windows 10 Firefox Version 69.0.1 still experiencing this bug