MyBB Community Forums

Full Version: LightBox SplashPage
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
So im trying to develope a plugin that makes a light box popup the first time somebody visits the page. I know how i need to do this normally without a plugin like this:

Quick note i dont take credit for almost any of the code its based heavely on the Splash Page plugin. Only a slight differnt idea to make it more SEO friendly. Since simply letting google skip splash pages. Is not allowed by google.

<script src='http://(url)/jscripts/splash_script.js' type='text/javascript' /></script>


<!-- Background color shade -->
<div id="shadeDivID" 
   style="
      display:none;
      z-index:100499; 
      position:absolute;
      left:0px;
      top:0px;
      width:100%;
      height:100%;
      margin:0; 
      padding:0; 
      border:none; 
      opacity:0.4;
      filter:alpha(opacity=40);
      background-color:#000000;">
</div>

<!-- The Content Box -->
<div id="dialogDivID" 
   style="
      display:none;
      z-index:100500; 
      position:absolute;
      left:400px; 
      top:50px;
      width:640px; 
      background-color:#FFFFFF;
      padding:3px; 
      border-style:solid; 
      border-width:3px;">


//light box stuff
<div style="text-align:center;">
<?php
	setcookie('CookieName', true, time()+(3600*12*7*1));
?>

////Light box Content goes here/////

</div>

<div align="center">
<button type="button" onClick="javascript:location='https://www.google.com/';" style="color:Red;">Leave Page</button>
<button type="button" onClick="RemoveDialogDiv();"  style="color:Green;">Continue</button>
</div>

</div>
<?php
if(!isset($_COOKIE['(cookie name)'])) {  ?>
<body onload="PresentDialogDiv('shadeDivID','dialogDivID')">
<?php } else { ?>
<body>
<?php } ?>

test test
</body>

And thanks to the Splash Page plugin from Nickman. I also understand the basics of creating the plugin like so:

<?php
/**
 * LightBox Splash Page
 *
 * Shows a Lightbox popup the first time somebody visits your site.
 *
 * By: Anori
 * 
 * Credits:
 * Splash Page plugin by Nickman : http://mods.mybb.com/view/splash-page
 * How to make a Lightbox Splash page  by Will Bontrager : 
http://www.willmaster.com/library/features/lightbox-overlay-on-shaded-web-page.php
 * MyBB Hello World Plugin by MyBB  : http://www.mybb.com/
 */
 
if(!defined("IN_MYBB")) {
	die("What are you trying to do?!.");
}
 
$plugins->add_hook('index_start', 'lbsplash');

function lbsplash_info()
{
	return array(
		"name"			=> "LightboxSplash!",
		"description"	=> "Adds a customizable Light Box Splash Page to your forum",
		"website"		=> "",
		"author"		=> "Anori",
		"authorsite"	=> "",
		"version"		=> "1.0",
	);
}

function lbsplash_activate()
{
	require '../inc/adminfunctions_templates.php';
	global $db;

	$lbsplash_group = array(
		"gid"			=> "NULL",
		"name"			=> "splash",
		"title" 		=> "LightBox Splash Page Settings",
		"description"	=> "Settings for the Splash Page plugin.",
		"disporder"		=> "1",
		"isdefault"		=> "no",
	);

	$db->insert_query(TABLE_PREFIX."settinggroups", $lbsplash_group);
	$gid = $db->insert_id();

	$lbsplash_setting_1 = array(
		"sid"			=> "NULL",
		"name"			=> "enablelightboxsplashpage",
		"title"			=> "Show the lightbox splash page",
		"description"	=> "Do you want to display the Light Box Splash Page To Users?",
		"optionscode"	=> "yesno",
		"value"			=> "yes",
		"disporder"		=> "2",
		"gid"			=> intval($gid),
	);
	$lbsplash_setting_2 = array(
		"sid"			=> "NULL",
		"name"			=> "cookieTime",
		"title"			=> "How long does the cookie last...",
		"description"	=> "How long (in days) until the user should see the page again",
		"optionscode"	=> "text",
		"value"			=> "30",
		"disporder"		=> "3",
		"gid"			=> intval($gid),
	);
	
	$lbsplash_setting_3 = array(
		"sid"			=> "NULL",
		"name"			=> "lightboxwidth",
		"title"			=> "The width of the light box",
		"description"	=> "The width in pixels of the light box",
		"optionscode"	=> "text",
		"value"			=> "400",
		"disporder"		=> "4",
		"gid"			=> intval($gid),
	);
	

	$db->insert_query(TABLE_PREFIX."settings", $lbsplash_setting_1);
	$db->insert_query(TABLE_PREFIX."settings", $lbsplash_setting_2);
	$db->insert_query(TABLE_PREFIX."settings", $lbsplash_setting_3);
	
	$lbsplash_template = array(
		"tid"		=> "NULL",
		"title"		=> "global_lbsplash",
		"template"	=> "<html><head><title>Test</title></head><body>Test</body></html>",
		"sid"		=> "-1",
		"version"	=> "100.07",
		"status"	=> "",
		"dateline"	=> "1134703642",
	);

	$db->insert_query(TABLE_PREFIX."templates", $lbsplash_template);
}

function lbsplash_deactivate()
{
	require '../inc/adminfunctions_templates.php';
	global $db;

	$db->query("DELETE FROM ".TABLE_PREFIX."settings WHERE name IN ('enablelightboxsplashpage','cookieTime','lightboxwidth')");
	$db->query("DELETE FROM ".TABLE_PREFIX."settinggroups WHERE name='lbsplash'");
	$db->query("DELETE FROM ".TABLE_PREFIX."templates WHERE title='global_lbsplash'");
	
}

function lbsplash()
{
	global $theme,$session,$user,$mybb,$templates,$collapsed;
if ($mybb->settings['enablelightboxsplashpage'] !='no')
{
	if ($_COOKIE['CookieName'] != 'yes')
	{	
		if ($mybb->settings['cookieTime'] == 0)
		{
		my_setcookie("CookieName",'yes',-1);
		}
		else {
			$days=$mybb->settings['cookieTime'];
			$time=time()+(86400*$days);
			my_setcookie("CookieName",'yes',86400*$days);
		}
		
	}
}
}
?>

How do i make a plugin do it. Like Splash page does it with a custom template. I would like something similar but then in this case that becomes a Light box. So my question is more how to i merge the html / javascript code with a plugin. The content enterd in the template will be inserted where it now says:

////Light box Content goes here/////

Any help would be appreciated.
<?php
/**
 * LightBox Splash Page
 *
 * Shows a Lightbox popup the first time somebody visits your site.
 *
 * By: Anori
 * 
 * I used various plugins/sites to see how i was supposed to do this therefore the credits are below:
 *
 * Credits:
 * Splash Page plugin by Nickman : http://mods.mybb.com/view/splash-page
 * How to make a Lightbox Splash page  by Will Bontrager : http://www.willmaster.com/library/features/lightbox-overlay-on-shaded-web-page.php
 * MyBB Hello World Plugin by MyBB  : http://www.mybb.com/
 * Message Bar plugin by Yaldaram : http://yaldaram.com
 */
 
if(!defined("IN_MYBB")) {
	die("What are you trying to do?!.");
}
 
$plugins->add_hook('index_start', 'lbsplash');

function lbsplash_info()
{
	return array(
		"name"			=> "LightboxSplash!",
		"description"	=> "Adds a customizable Light Box Splash Page to your forum",
		"website"		=> "",
		"author"		=> "Anori",
		"authorsite"	=> "",
		"version"		=> "1.0",
	);
}

function lbsplash_activate()
{
	require '../inc/adminfunctions_templates.php';
	global $db;

	$lbsplash_group = array(
		"gid"			=> "NULL",
		"name"			=> "splash",
		"title" 		=> "LightBox Splash Page Settings",
		"description"	=> "Settings for the Light Box Splash Page plugin.",
		"disporder"		=> "1",
		"isdefault"		=> "no",
	);

	$db->insert_query(TABLE_PREFIX."settinggroups", $lbsplash_group);
	$gid = $db->insert_id();

	$lbsplash_setting_1 = array(
		"sid"			=> "NULL",
		"name"			=> "enablelightboxsplashpage",
		"title"			=> "Show the lightbox splash page",
		"description"	=> "Do you want to display the Light Box Splash Page To Users?",
		"optionscode"	=> "yesno",
		"value"			=> "yes",
		"disporder"		=> "2",
		"gid"			=> intval($gid),
	);
	$lbsplash_setting_2 = array(
		"sid"			=> "NULL",
		"name"			=> "cookieTime",
		"title"			=> "How long does the cookie last...",
		"description"	=> "How long (in days) until the user should see the page again, Put 0 to make them see the light box splash page each time",
		"optionscode"	=> "text",
		"value"			=> "30",
		"disporder"		=> "3",
		"gid"			=> intval($gid),
	);
	
	$lbsplash_setting_3 = array(
		"sid"			=> "NULL",
		"name"			=> "lightboxwidth",
		"title"			=> "The width of the light box",
		"description"	=> "The width in pixels of the light box",
		"optionscode"	=> "text",
		"value"			=> "400",
		"disporder"		=> "4",
		"gid"			=> intval($gid),
	);
	
	$lbsplash_setting_4 = array(
		"sid"			=> "NULL",
		"name"			=> "cookieName",
		"title"			=> "The name of the cookie",
		"description"	=> "Set the name of the cookie",
		"optionscode"	=> "text",
		"value"			=> "MyCookie",
		"disporder"		=> "5",
		"gid"			=> intval($gid),
	);
	
	$lbsplash_setting_5 = array(
		"sid"			=> "NULL",		
		"name"			=> "lbmessage",		
		"title"			=> "The content of the lightbox",		
		"description"	=> "Enter your messages here. (HTML allowed)",		
		"optionscode"	=> "textarea",		
		"value"			=> "Test message test",		
		"disporder"		=> "6",		
		"gid"			=> intval($gid),
	);
	

	$db->insert_query(TABLE_PREFIX."settings", $lbsplash_setting_1);
	$db->insert_query(TABLE_PREFIX."settings", $lbsplash_setting_2);
	$db->insert_query(TABLE_PREFIX."settings", $lbsplash_setting_3);
	$db->insert_query(TABLE_PREFIX."settings", $lbsplash_setting_4);
	$db->insert_query(TABLE_PREFIX."settings", $lbsplash_setting_5);
	
}

function lbsplash_deactivate()
{
	require '../inc/adminfunctions_templates.php';
	global $db;

	$db->query("DELETE FROM ".TABLE_PREFIX."settings WHERE name IN ('enablelightboxsplashpage','cookieTime','lightboxwidth','cookieName','lbmessage')");
	$db->query("DELETE FROM ".TABLE_PREFIX."settinggroups WHERE name='lbsplash'");
	
}

function lbsplash($page)
{
	global $theme,$session,$user,$mybb,$templates,$collapsed;
	
	$power = $mybb->settings['enablelightboxsplashpage'];
	$cookieTime = $mybb->settings['cookieTime'];
	$width = $mybb->settings['lightboxwidth'];
	$cookieName = $mybb->settings['cookieName'];
	$msg = $mybb->settings['lbmessage'];
	
if ($power !='no')
{
	if ($_COOKIE[$cookieName] != 'yes')
	{	
		if ($mybb->settings[$cookieTime] == 0)
		{
		my_setcookie($cookieName,'yes',-1);
		}
		else {
			$time=time()+(86400*$cookieTime);
			my_setcookie($cookieName,'yes',86400*$cookieTime);
		}
		
		$page = str_replace("
<script src='$mybb->settings['bburl']/jscripts/splash_script.js' type='text/javascript' /></script>
<div id=\"shadeDivID\" 
   style=\"
      display:none;
      z-index:100499; 
      position:absolute;
      left:0px;
      top:0px;
      width:100%;
      height:100%;
      margin:0; 
      padding:0; 
      border:none; 
      opacity:0.4;
      filter:alpha(opacity=40);
      background-color:#000000;\">
</div>
<div id=\"dialogDivID\" 
   style=\"
      display:none;
      z-index:100500; 
      position:absolute;
      left:400px; 
      top:50px;
      width:$width; 
      background-color:#FFFFFF;
      padding:3px; 
      border-style:solid; 
      border-width:3px;\">
<div style=\"text-align:center;\">
			<div style=\"text-align:center;\">
			$msg			
			</div>
			<div align=\"center\">
			<button type=\"button\" onClick=\"javascript:location='https://www.google.com/';\" style=\"color:Red;\">Leave Page</button>
			<button type=\"button\" onClick=\"RemoveDialogDiv();\"  style=\"color:Green;\">Continue</button>
			</div>
			</div>",$page);
	return $page;
		
		
	}
}
}
?>

This is what i have so far. And i was wondering if somebody could look at it. Search for all the mistakes Toungue And tell me i really would like the feedback since i have never made a plugin before.

Two thinsg im not sure about how to do yet is how to make this onload. Without using the <body onload=""> stuff.
And which hook i should use i currently use the index_start but maybe i need to use another one?

Any help is greatly appreciated.