To zoom? To borderline? Or to nothing?

[xarn]

Hello,

There was a recent argument in the irc channel regarding the small detail of what happens when hovering your mouse over the cards.

Please try it out at:
http://50.57.161.126/

and tell us what you think.

[jojo]

The trouble with the zoom as it currently stands is that if you have one full line of cards, highlighting a card can push the other cards aside, creating a second line of cards. This moves everything about, creating unnecessary and distracting movement on the screen. Part of the trouble is so much of the screen is taken up by the different fronts, that the individual cards are too tiny to read any useful information off of without zooming in and out.

I don't know how feasible it is, but ideally there would be a pop-up enlargement of the card as you hover over it. Like in Elements (in the picture the mouse is over the cat card, but my print screen function has auto-edited out the cursor).

[aspidites]

I think the issue with the zoom affect is that, for lack of better words, its gimmicky. That is, it's cool at first, but has no true utility purpose. Or at least, what utility purpose exists is overshadowed by the disorienting affect of the cards being rearranged.

Of the options listed, I like the border effect the most, though I'd suggest a highlighting affect (or glow) , as it would be the least intrusive. That said, you are the developer, so your word sticks. You could also perhaps have an options panel that gives the user the choice of which animation to use.

I can't seem to find the code that determines it, but I imagine that each effect could be wrapped in a function object easily enough.

[xarn]

Just for information, you can get the full view of a card by right clicking.

The trouble with the zoom as it currently stands is that if you have one full line of cards, highlighting a card can push the other cards aside, creating a second line of cards.

I guess you refer to the old version. It has been updated since then. The cards still have a little bit motion though which can be "gimmicky".

[jojo]

Just for information, you can get the full view of a card by right clicking.

This. Changes. Everything.

[xarn]

glad it pleases you.

[xarn]

News:

Since there were requests to do so, I removed the zoom and added the borders.
To have all cards "fixed", I also had to remove the slow card rotation in favor of instant rotation.

(Explanation)

In order to rotate from 0 to 90 degrees and back, I used some morph capabilities of the new html5.
Moreover, this morph is active whenever the card change to another state. This includes when rotating but also the hover effect (on mouse over).
Putting borders instead made the same result: in a brief moment, all cards moved slightly due to the border appearing while the margin disappeared.
To solve that, I removed the morph altogether.

Future

I don't know if you like it or not. I could also re-enable the morph for the card flipping and you would see the small "all cards moving 1 pixel" while the border is drawn. All this is relatively easy to change, so I don't mind. Perhaps there would also be a way to enclose the cards into boxes so that a zoom/border/whatever wouldn't affect the other cards at all ...however, this requires a little more work, and, as it is a detail, is left for the future.

Current "easy" alternatives are:
- currently: instant borders + instant rotate (other cards fixed)
- before: slow zoom + slow rotate (other cards move)
- other: slow border + slow rotate (other cards move slightly)
- other: nothing + slow rotate (other cards fixed)

Feedback welcome

[snowdrop]

Looks great I only ran into one issue with it, but it's maybe only on my end. In Chromium I get the following after rotating back a card:

artifact.jpeg (13 KiB) Viewed 507 times

To replicate it, just mark a card. Then unamrk it AND keep the mouse pointer still/over the card, all the time. Then you get the above result. Move the mouse pointer ont he table, and it auto-fixes itself.

[xarn]

hmmm ...strange ...I didn't encountered this on my laptot ...perhaps it's a bug specific to your browser version, OS version, graphic card drivers or something alike.
Does somebody else have such strange visual artefacts?

[aspidites]

Also using chromium and get the same effect. However, the clipping only happens on roll-over. That is, once I move my mouse, the full image is restored.