WebDev

SMF Arcade => SMF Arcade Support + Plugins => Topic started by: wulfx01 on August 27, 2023, 11:47:25 AM

Title: arcade HTML5
Post by: wulfx01 on August 27, 2023, 11:47:25 AM
hello chen
a great arcade you have coded there
but 1 disturbs,
when you play a HTML5 game, the scrollbar goes away when you are with the mouse out of the picture.
not with flash games
in which PHP can I change it?
Title: Re: arcade HTML5
Post by: Chen Zhen on August 27, 2023, 11:07:59 PM
Hello & welcome to the site!

I'll look at it tomorrow & give you an edit for it if I confirm that behavior.
JavaScript is used to determine the mouseenter event which hides the scrollbar. This was the behavior for both templates but perhaps something was overlooked when changes were applied.
Title: Re: arcade HTML5
Post by: wulfx01 on August 28, 2023, 01:00:08 AM
that's good, thank you  :D
Title: Re: arcade HTML5
Post by: wulfx01 on August 29, 2023, 01:36:21 AM
if you tell me which files, I can also check for myself   :D
Title: Re: arcade HTML5
Post by: Chen Zhen on September 01, 2023, 02:27:23 AM

I won't be releasing an update anytime soon because the next stable version has many changes + additions that will take time to develop & test.

Here is the necessary edit...

file:
./Themes/default/ArcadeGame.template.php

find:
function smfArcadeGameDims3() {
var divelement = document.getElementById("game");
if (divelement) {
divelement.width = "100vw";
divelement.height = "100vh";
scrollTo(document.body, divelement.offsetTop, 100);
}

Add after above code:
var gameObject = document.getElementById("gamearea");
gameObject.onmouseenter = function (){
document.body.style.overflowY="hidden";
};
gameObject.onmouseleave = function (){
document.body.style.overflowY="auto";
};
Title: Re: arcade HTML5
Post by: wulfx01 on September 01, 2023, 10:39:52 PM
klasse, danke dier. :D

allerdings reicht es in dem code

function smfArcadeGameDims3() {
sessionStorage.removeItem("scoreLoop_' . $_SESSION['arcade_html5_token'][1] . '");
var divelement = document.getElementById("game");
var divelement2 = document.getElementById("gameTabIndex");
divelement.width = "100vw";
divelement.height = "100vh";
scrollTo(document.body, (divelement2.offsetTop)-' . (int)$context['game']['height']/4 . ', 100);
var gameObject = document.getElementById("gamecontainer");
gameObject.onmouseenter = function (){
document.body.style.overflowY="auto";
};
gameObject.onmouseleave = function (){
document.body.style.overflowY="auto";
};
}

von  " hidden"

in "auto"  zu ändern

document.body.style.overflowY="auto";
Title: Re: arcade HTML5
Post by: Chen Zhen on September 02, 2023, 12:07:53 AM
You'll have to speak English for support here.. I had to use a translator for some of your post.

You seemed to ask for the scrollbar to be hidden when the mouse is over the flash game container so that the user has full control when playing a game (like HTML5 game behavior) and then visible again when navigating the forum page which makes more sense.

The problem you'll find are for games that have arrow key control & you attempt to go up/down.. it will end up controlling the overflow of the page instead of control within the game.

You do whatever works with the game container behavior you're seeking but what I originally posted is likely more desirable.
Title: Re: arcade HTML5
Post by: wulfx01 on September 02, 2023, 04:38:31 AM
yes, sorry, i no longer write in german  :-X
the code you sent is great  :D
EhPortal 1.39.6 © 2024, WebDev