Daily Lucky Numbers:
5
10
16
18
44
47

Mobile compatibility

Started by Dave, August 14, 2021, 05:35:23 AM

Previous topic - Next topic

Dave

Hi all,

I occasionally use my Samsung Tab S6 to play games on my site if I'm out and about. When I log in to the site I go to Arcade and the layout is huge and virtually all white (and I've tested it here too). I've attached a couple of screenshots so you can see it. It happens on all themes even the SMF default.

If I click on the 'View desktop site' option on the tablet it then shows as normal.

Now I'm not sure if this is an SMF issue or if it's the Arcade. The Quiz works as normal as does everything else.

Anyone have any idea what might cause this?

Screenshot_20210814-082300_Edge.jpg

Dave


Dave

Quote from: Dave on August 14, 2021, 05:35:23 AMHi all,

I occasionally use my Samsung Tab S6 to play games on my site if I'm out and about. When I log in to the site I go to Arcade and the layout is huge and virtually all white (and I've tested it here too). I've attached a couple of screenshots so you can see it. It happens on all themes even the SMF default.

If I click on the 'View desktop site' option on the tablet it then shows as normal.

Now I'm not sure if this is an SMF issue or if it's the Arcade. The Quiz works as normal as does everything else.

Anyone have any idea what might cause this?

Screenshot_20210814-082300_Edge.jpg

Dave




Sorry I should have resized the attachment  :-[

Chen Zhen

August 14, 2021, 01:56:05 PM #2 Last Edit: August 14, 2021, 01:58:07 PM by Chen Zhen
The Arcade has mobile detection and automatically uses the mobile template.
Only one mobile template is available for the arcade although it does allow people to create their own mobile templates using hooks and custom files.

The default mobile template is just a plain white background template.
I left it up to people to design their own templates or perhaps have one made for them by a 3rd party.
The design of the mobile template is geared toward mobile devices up to approx. 12.5 inch.
If you're looking at the tablet in portrait mode it will show like your screenshots.
Turning the tablet to side view (landscape mode) will switch it to two games wide.
If your tablet is large enough to view like a laptop then you will have to use desktop mode on it.

The one thing I can do is to have an option in the arcade itself to switch modes and have it save that option in the user's arcade profile.
Options for mobile view, desktop view or automatic.




Dave

Quote from: Chen Zhen on August 14, 2021, 01:56:05 PMThe one thing I can do is to have an option in the arcade itself to switch modes and have it save that option in the user's arcade profile.
Options for mobile view, desktop view or automatic.

That sounds like a good plan. I did look on SMF theme site to see if there were any mobile themes, but they are very limited.

Thank UD

Chen Zhen


I was not referring to SMF mobile themes although that would be a good idea.
What I meant was that hooks are added via the Arcade installation to allow for custom Arcade skins & lists.
 
A new RC has been installed on your site.
There is a new setting in your Arcade user profile to disable mobile detection for skins & lists.
It will still use the detection for game play.

Test it out and let me know if I forgot something.

Dave

Thanks  UD

I have set the settings to 'Detection Disabled' and the way I see it on my mobile now is as the attachments, which is better as it shows more games in the list below.

Where would a custom theme for the Arcade be stored?

Screenshot_20210815-074157_Edge (Copy).jpg

Chen Zhen

The custom Arcade hooks were introduced 1 year ago.
No one has made any custom skins or lists as of yet.
If you are capable of developing your own then you can use the following info for reference:
https://web-develop.ca/index.php?page=arcade_hook_usage

Another option is to ask for paid help on the SMF mother site. A developer can use that link as reference.

Dave

Quote from: Chen Zhen on August 15, 2021, 09:30:49 PMIf you are capable of developing your own then you can use the following info for reference:
https://web-develop.ca/index.php?page=arcade_hook_usage

I wish I was that clever UD

Thanks again for the help

Dave

Skhilled

We are working on a SMF RC4 theme and the RC versions are mobile ready. It's almost finished...not far to go. But have not tried to see if the arcade, etc. will show using it like portals do with SMF themes. I have not installed any mods yet until it is completed or almost. That would be a good thing. :)

You can see the theme here:

https://docskillz.com/smfrc4

I did plan on "trying" to make skins for the arcade but started a new job and was working 6 days a week for the past 4 months or so and it is a very physically demanding job. Now that they've cut it back to 5 days I'll have more time after I'm finished this theme. :)

Hero

nice style.  I like it very much.  It's a shame that it is not for smf 2.0.18.

Skhilled

You can get the 2.0 versions at:

https://www.jpr62.com/theme/index.php

My friend, Jeff, created the original themes and other friends have helped keep the site going since his passing. Now I've taken it up to help keep them going and also hosting the site for free on my hosting servers.

Skhilled

Chen, a question... I'm ready to start working on a skin, well, changing the color scheme for the skins and should I use SMF 2.0 or the RC version for this or does it make a difference?

Chen Zhen

September 09, 2021, 06:42:35 PM #12 Last Edit: September 09, 2021, 06:45:33 PM by Chen Zhen
No it does not make a difference.
The arcade, its skins & lists work for both versions.

Remember that the arcade has custom hooks for its skins and lists.
You do not need to edit any existing arcade files.

ref.
https://web-develop.ca/index.php?page=arcade_hook_usage

Skhilled

That's the problem, I've never got into hooks, etc. I can easily change most css styles and create some of my own and know a little about php. However, I've never got that far into php. I thought maybe it was similar to smf themes and would have to create my own directory under the arcade's /Themes directory, copy the default one's from it and then edit those.

Chen Zhen

September 10, 2021, 06:58:13 PM #14 Last Edit: September 10, 2021, 07:08:39 PM by Chen Zhen
Do it that way to design your template & css files and then I will help you with adding hooks.

In my templates I use a lot of style elements for the css but using class & a css file is better.
So when you edit the template you may have to take most of the style element css (change to class elements) and transfer it to a css file .

example:
<div style="color: red;">Hello</div>
becomes:
<div class="theme_x_color">Hello</div>
with a css file containing:
.theme_x_color {
  color: red;
}

Always load css files in the header.
So in your php source file you use $context['html_headers'] for that.
Do you know how to do that from perusing SMF files in the past?