Web deployment - Casey's Solitaire

[jacque]

Since we're talking about card games elsewhere, I've been using my very old Casey's Solitaire as a test app for web deployment. This thing is ancient: 22 years to be exact. And LC 10 opened it without a hitch when I decided to resurrect it.

I had to do some revisions, but only a few. Some things are not yet implemented in LC web apps:

• Text styles

• URL links

• Sounds

• Dragging - fails on mobile only

• Intermittent issues with PNG images with transparency

I took stam's advice and changed my PNGs to SVGs and they do work. Nice. There are a couple of links that don't work yet. One is just my contact email but the other is a link to the full game rules, which are more important. If you want to know how to play Casey's Solitaire, the rules are here:
https://www.hyperactivesw.com/casey/caseydocs.html. If you don't want Casey's interruptions, the game options are in the Settings (gear) button.

Since dragging isn't supported on mobile yet, you can only play with Casey in a desktop brower for now. Here he is: https://www.hyperactivesw.com/testfiles ... casey.html

And yes, some of the table backgrounds are hideous. They are due for replacement. Apparently I had less sophistication 22 years ago. There's a workaround though: don't choose those.

Feel free to waste some time.

[stam]

I'd love to try it... but so far not been able to load it.
The download is looooonnnggg. Even after receiving the message "All downloads complete" all i get is a spinning widget.

--------------------------------------
edit: the game finally did load after > 5 min but i didn't have any time left to play it;)
I suspect the graphical resources can be slimmed down quite a bit, which is probably essential for any web app.
I wonder if there is a way to load some of the heavier resources after a quick initial load to give the impression of a quicker load? Is a slash stack tactic feasible in web apps?

Will try to give it a whirl properly when i have some time.

S.

[bn]

It loaded within about 10 seconds for me,

Looks nice. Unfortunately Solitaire is beyond my mental capacities...

Gratulations
Bernd

[SWEdeAndy]

It loaded in 5-6 secs for me, and works very well!

[SWEdeAndy]

I tested now on Windows too, with Chrome. Everything seems to work well there as well, including the animations. That is interesting, as I have a game under development where animations work flawlessly in Mac browsers, but not at all in Windows browsers.

@jacque Which method is used for animation? Just normal 'move from/to'? Any use of 'lock moves' (guess not, since it's one move at a time)?

[stam]

Nope, still a lengthy, very lengthy first download.

Mind you, once cached it loads super-quick (2-3 sec). I had run this in Safari initially so to re-test i launched it in Chrome instead.
In Safari it's now super-quick to load (as it's already been cached). In Chrome super-slow first download...

In fact i thought of posting this update after i started the loading in Chrome and even now it's still ongoing...

[stam]

Once loaded i thought i'd give it a whirl.

Very weirdly, after a few moves the 10 of hearts from underneath the left most stack started creeping out of the left/lower corner of the screen - just managed to screenshot it. The left most stack is now a parrot.

Is this normal gameplay or a bug? if the former then i really don't understand it lol...

EDIT: i guess that seems to be a normal game mechanic... double click on it returns it to the pile... is that meant to be the parakeet stealing it lol

[SWEdeAndy]

Is this normal gameplay or a bug?

Hehe, that's the parrot "helping" you... You really need to read the instructions to get that one...

Nope, still a lengthy, very lengthy first download.

What's your internet connection speed? With around 200 Mbps I got the following load times for first time ever load of the game:
Chrome on Win: 5 secs
Chrome on Mac: 9 secs
Safari on Mac: 8 secs

[stam]

200 Mbps... lol. No wonder.

My download speed is 13 mbps at present (holidaying abroad but DL speeds seem reasonable...).

I don't think designing web apps should factor 200 mbps as an average 'normal' download speed for most people...

[SWEdeAndy]

I don't think designing web apps should factor 200 mbps as an average 'normal' download speed for most people...

Indeed, maybe not. That's Sweden for you... I've not been abroad for a while, lost my perspective.
I normally expect 250 Mbps on my home wifi, but now both my kids where bogging it down with youtube watching on their devices, so I only got 200...

[jacque]

Thanks for the feedback everyone. I'm working on reducing the image sizes. I also found a few in there that were hidden but unused and I'll remove those too. I only have about a 100 Mbps DL speed here but it loads for me in about 6-8 seconds. I'll see if I can reduce that more.

@stam: you can turn off Casey's antics in the settings. He likes to pull cards out of the piles, and other times he forgets himself and poops on them. If you don't clean off the card with the tissues at the top of the window, the cards stick together and you can't use that pile any more.

@Andy: I use the "move" command bracketed with "lock messages". That prevents stray mouse messages from happening. At least, that's what I had to do 22 years ago, I haven't tried changing it lately since it works.

Code: Select all

on moveActiveCardTo pFldName
  lock messages -- otherwise carrier picks up stray mouse msgs
  move btn "carrier" to the loc of fld pFldName in 300 milliseconds
  unlock messages
end moveActiveCardTo

Really appreciate the feedback, it was very informative. Tip: You'll increase your chances of winning if you deal out all aces first, which is a legal option. You'll have even better luck if you start each talon with high cards, which isn't strictly legal but makes a more satisfying game.

[jacque]

@jacque Which method is used for animation? Just normal 'move from/to'? Any use of 'lock moves' (guess not, since it's one move at a time)?

I didn't give you the whole answer above, the moveActiveCardTo handler above snaps the card to the target when the mouse goes up. The actual dragging is done by tracking the mouse in a mouseMove handler. It calculates an offset delta and sets the loc of the dragged card to that. When the mouse is released, the handler above snaps the card to the location of the control if it's a valid target.

Reading my old code, I suspect I'm the only developer who has ever named a custom property "poopOffsets".

Code: Select all

put the poopFld of img "poop" into tCdFld
put the left of fld tCdFld + item 1 of the poopOffsets of img "poop" into tH
put the top of fld tCdFld + item 2 of the poopOffsets of img "poop" into tV
set the loc of img "poop" to tH,tV