📜 ⬆️ ⬇️

New look at online Magic 8 Ball

image

Good day, dear habravchane!

Yes, today we will again talk about the ball from the movie "Route 60". Someone heard about it, someone saw it, someone even bought a copy and uses it in their professional activities (where could it be without it in the IT sphere?).
But even those to whom this topic has managed to fill the teeth on edge, I ask you not to discard this publication. My ball keeps a little secret ...

')

Prehistory


As it happened, probably, with each of you, this topic captured me suddenly and completely. One fine spring day I plowed the expanses of the RuNet in search of a gift for my friend. A quick birthday did not give the opportunity to think closely about the gift, so the souvenir sites went to work, one of which I stumbled upon such a ball. An interesting idea, I thought, especially since my friend PM, in his work a thing is very useful! Due to the fact that the purchase should have been made in the online store, and I didn’t want to buy a cat in a bag, I went further into the runet, studying what I was going to buy and whether it was worth it. Pictures, videos, descriptions - I was interested in everything, even frequent online variations were subjected to close viewing.
And what did I find?
In our age of high technology, HTML5 and other beautiful things, all the implementations I met did not go further than changing the inscription on a static ball image by mouse click ...
The thought went to work, the idea clutched at the idea, and the hands had already managed to open the favorite html / js editor and recruited the skeleton of the page.

What happened?


I will not describe the process of implementing this miracle, because the purpose of this publication is different. If someone is interested in how I did it - maybe I will write another publication with all the details.
Just today, I made the final touches and posted my creation on m8ball.ru .

Where is the secret?


The secret is how to get the ball to answer questions. Believe me, he answers the questions, although opening it for the first time, not everyone will succeed so simply ask a question and get an answer. I suggest you deal with this task yourself.
For those who like to immediately see the root, I advise you not to go into the source code of the page, but try to figure it out without it.

If I could a hint - attention, spoiler


Ok, for those who have already knocked their heads on the screen, but never received an answer, I will give a hint:
Try to minimize the browser to windowed mode, reduce its size to a third of the screen in height and width, and then move the window across the desktop.

PS


Do not think that here I am raising the topic of comparing browsers, nothing like that, just dry facts.
On my computer, a good speed of work was achieved only in the Google Chrome browser (I have version 12).
In Firefox version 3.6, it solidly slows down.
In IE 8 it doesn’t work at all, which I didn’t expect, though, the canvas wasn’t implemented there yet.
I did not try other browsers, I give it to you.
When the option "Do not display the contents of the window while dragging" is enabled, the ball is naughty and refuses to answer questions

Pps


And I bought another friend's gift :)

Source: https://habr.com/ru/post/118915/


All Articles