vb.org Archive - Mini Mods - v3 Arcade

What Does This Do?
Basically, when you turn lights down, the entire page darkens* and lets you play the game in the 'dark' which cuts out distractions.

*You can also change the fade background colour to match that of your forum and blank everything out except the game.

Upload the contents of the zip file to your forum root

In your v3ARCADE_PLAY template and find:

Code:

<title>{vb:rawphrase x_powered_by_vbulletin, {vb:raw vboptions.bbtitle}} - {vb:raw vboptions.arcadename} - {vb:raw game.title}</title>

{vb:raw headinclude_bottom}

</head>

Underneath that add:

Code:

<style type="text/css">

        #lights { /* This is the container which holds the light switch */

            position:relative; /* Set the position of the light switch to relative so it can be placed above the "dimming" layer */

            z-index:500; /* Set the height on the Z axis to 500 which is above the "dimmed" layer */

        }

 

        object { /* The object tag is what the swf files are held in */

            outline:none; /* Set the outline of swf objects to none so when you click on it you don't get a border around the swf */

        }

 

        #fade { /* This is the "dimmed" layer which fades in when the lights go off */

            display: none; /* Set the display to none which hides the layer */

            background: #fff; /* Set the color to black */

            position: fixed; left: 0; top: 0; /* Set the position to fixed so when the user scrolls it stays with them */

            width: 100%; height: 100%; /* Set the width and height to 100% of the browser window */

            opacity: .90; /* Set the layer's opacity to .90 which is 90% */

            z-index:100; /* Set the height on the Z axis to 100 which is below the "light switch" layer */

        }

#standout{

 position:relative;

background-color:#ffffff;                  

 z-index:1000;

}

    </style>

<script type="text/javascript" src="swfobject.js"></script>

<script type="text/javascript">

    var flashvars = false;

 

    var params = {

        movie: "Lights.swf",

        quality: "high",

        allowScriptAccess: "always",

        wmode: "transparent"

    };

 

    var attributes = false;

 

    swfobject.embedSWF("Lights.swf", "lights", "100", "100", "9.0.0", "expressInstall.swf", flashvars, params, attributes);

</script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>

<script type="text/javascript">

    function lightsOn(){

        //When you turn the lights back on fade out the "dim" layer over 500 milliseconds and then remove it

        $('#fade').fadeOut(500,function() { $("#fade").remove(); });

    };

 

    function lightsOff(){

        $('body').append('<div id="fade"></div>'); //When you turn the lights off add the "dimmed" layer to the page

        $('#fade').fadeIn(250); //Fade in the "dim" layer over 250 milliseconds

    };

</script>

You can change background: #fff; /* Set the color to black */ to match the colour of your forum if you'd prefer that to black and the opacity: .90; /* Set the layer's opacity to .90 which is 90% */ to suit your needs.

Still in the v3ARCADE_PLAY template find:

Code:

<td align="center" class="blockbody" valign="top">

            <!-- main -->

Below that add:

Code:

<div id = "standout">

Next, find:

Code:

<!-- /main -->

        </td>

Above that add:

Code:

</div>

Search for:

Code:

</div>

            </div>

            <!-- /right area-->

Above that add:

Code:

<div class="blockrow" align="center">

<div id="lights"></div>

Save the template.

Thanks goes to C.Birch for pointing out and providing a fix that some people were experiencing where upon pressing the lights out button the whole screen was dimming including the flash game. The required changes can be seen here and have been integrated into the instructions above.

*Nothing has changed in the zip archive, no need to download if upgrading, just carry out the template edits

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.01081 seconds Memory Usage 1,752KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (8)bbcode_code_printable (2)bbcode_quote_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)pagenav (1)pagenav_curpage (2)pagenav_pagelink (1)post_thanks_navbar_search (1)printthread (10)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start pagenav_page pagenav_complete bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: