Html5 Slot Machine Game Source Code

2005-04-05 09:01:28 PM delphi101 I've looked in off-topic and decided I'd better post it here. Is there any information available about creating slot machine games?

A slot game is one of the most popular gambling games that has attracted gambling lovers from quite some time, and HTML5 Slot Machine Source Code is a standard solution for the firms that are looking forward to developing an online slot machine kind of gaming software.

AIS Technolabs has experienced coders who offer slot game development services with advanced features. HTML5 is one of the most sought-after languages used for generating source code. HTML5, along with JavaScript and CSS, has enabled developers to create impressive gaming solutions as per the need and demands of the clients. Our HTML Slot machine code is easy to customize and had all the necessary elements which today’s gamers want in an online slot game.

Glittering

Features of Our Slot

Machine Source Code

Online slot gaming is more in demand these days. So, excellent technical skills and advanced features are required to make these slot machines work effectively. So to make our slot machine source code effective and user-friendly, we implement it with given below features.

Responsive Design

Intuitive Controls

Interactive Interface

Smooth jQuery
Animation

Fraud and Cheat
Prevention Measures
Simple to Play

Compatible with
Every Browser

UPDATE: See also Simple Slot machine game using HTML5 Part 3: Loading.

In part 1 I presented simple slots machine purely in HTML5. This part extends the basic implementation with audio support. The game itself is simple slot machine that has only one winning line and we add effects for roll start, reel stop and win/loss.

Try audio enabled game here. Note that loading time is significantly longer in audio enabled version. Debug text under button tells what audio system game uses for your browser.
Original non audio version from part 1 is here.

How to support Audio

Web game can implement audio in 3 main ways.

1. Flash player audio. (e.g. use SoundManager2 library)
2. HTML5 Audio (Buzz is easy way to use it)
3. Web Audio API. (See HTML5 Rocks for tutorial)

Flash audio is pretty much deprecated now, as only older browsers will still need it that most of don’t support HTML5 canvas anyway.
HTML5 Audio works very well for desktop browsers, but has only nominal support for mobile (Android & iOS). It’s generally too moody for tablets or mobile.
Web Audio API is supported only by latest browsers, but it works reliably e.g. in Safari iOS 6.0.

Web Audio API has two implementations in wild, the WebKit (iOS, Safari, Chrome) and the Standard (latest Firefox). Fortunately differences are small.

Code

The libraries listed above simplify implementation a lot, but it’s easier to understand how these technologies work with simple examples. So I implemented both methods 2 and 3 from scratch.

Some caveats with audio.

  • Game initial loading time will increase. Audio files can be pretty large and they must be usually preloaded so they can be played on game start
  • iOS (iPad/iPhone) does not allow autoplay for audio. Audio must be enabled by playing some sound in click event handler.

Implementation

Initialization function accepts array of objects that have required audio file name in id property and callback that is called after audio has been initialized and loaded.
First code checks if mp3 or ogg is supported. Firefox requires .ogg and it’s easy to convert at least in OS/X or Linux with ffmpeg. Exact command line depends little on ffmpeg version.

$ ffmpeg -i win.mp3 -strict experimental -acodec vorbis -ac 2 win.ogg

When format is known, the code checks wether to use Web Audio API or normal HTML5 Audio.

Both initialization functions attempt to load the desired format of needed audio files and sets play function in objects that is used to play the effect. If audio initialization fails, this play function is set to dummy empty function.

HTML5 Audio initialization function creates Audio objects and sets src to point to the audio file. Downloading is handled automagically by the browser.

Free Slot Machine Game

Web Audio initialization is bit more complicated, it needs to download the audio with XHR requests.

NOTE: Chrome supports XMLHttpRequest only when loading pages over HTTP. If you load the HTML file locally you’ll see erros like this in the error console:
XMLHttpRequest cannot load file:///Users/teemuikonen/work/blog/slot2/audio/roll.mp3. Cross origin requests are only supported for HTTP.

After audio has initialized, the game can play any effect simply by calling play function for the effect. If audio initialization or loading failed, the play is simply a dummy function.

Code is available in Github.

Html5 Games Code

Open source html5 games

Open Source Html5 Games

Continue to Simple Slot machine game using HTML5 Part 3: Loading.