<?php
	$enableMessengerBox = Mage::getStoreConfig('chatbot_enable/facebook_config/facebook_messenger_box');
	if ($enableMessengerBox == "1"): // { OPEN IF
?>
	<?php
		$chatbotHelper = Mage::helper('werules_chatbot');
		$mageHelper = Mage::helper('core');
		$imgWidth = (int)Mage::getStoreConfig('chatbot_enable/facebook_config/facebook_messenger_box_width');
		if (!($imgWidth))
			$imgWidth = 60;
	?>
	<style>
		#werules-messenger-box {
			position: fixed;
			display: block;
			z-index: 999;
			bottom: 20px;
			right: 30px;
			cursor: pointer;
		}

		#werules-messenger-box:hover .werules-messenger-icon img{
			transform:scale(1.1, 1.1);
			-webkit-transform:scale(1.1, 1.1);
			-moz-transform:scale(1.1, 1.1);
		}

		.werules-messenger-icon img {
			width: <?php echo $imgWidth;?>px;
			filter: drop-shadow(2px 6px 4px rgba(0,0,0,.3));
			-webkit-filter: drop-shadow(2px 6px 4px rgba(0,0,0,.3));
		}

		.werules-tiptext{
			width: 120px;
			background-color: white;
			color: #2c2c2c; ;
			text-align: center;
			padding: 5px 0;
			border: 1px solid #eeeeee;
			border-radius: 6px;
			position: fixed;
			bottom: 30px;
			right: <?php echo (int)$imgWidth + 40;?>px;
			text-transform: uppercase;
			filter: drop-shadow(2px 6px 4px rgba(0,0,0,.3));
			-webkit-filter: drop-shadow(2px 6px 4px rgba(0,0,0,.3));
		}

		.werules-tiptext:after{
			content: "";
			position: absolute;
			top: 50%;
			left: 100%;
			margin-top: -5px;
			border-width: 5px;
			border-style: solid;
			border-color: transparent transparent transparent #eeeeee;
		}

		@media (max-width: 480px)
		{
			.werules-mobilehidden{
				display: none;
			}
		}
	</style>
	<?php
		$fbUsername = $chatbotHelper->getFacebookPageChatID();
		$enableReferral = Mage::getStoreConfig('chatbot_enable/facebook_config/enable_referral');
		$ref = "";
		if ($enableReferral == "1")
		{
			$refData = array(
				"page" => Mage::helper('core/url')->getCurrentUrl() // TODO
			);
			$ref = "?ref=" . serialize($refData);
		}
		$fbChatUrl = null;
		if ($fbUsername)
			$fbChatUrl = $chatbotHelper->_fbUrl . $fbUsername . $ref;
	?>

	<div id="werules-messenger-box">
		<!-- code from https://gist.github.com/tomcritchlow/493774b09b02e31d1184d7cda926c659 -->
		<a href="<?php echo $fbChatUrl; ?>" target="_blank" onclick="OpenChatInNewTab();">
			<div class="werules-messenger-icon">
				<img src="<?php echo $this->getSkinUrl('images/werules_chatbot/messenger-icon.png'); ?>"/>
				<span class="werules-tiptext werules-mobilehidden"><?php echo $mageHelper->__("Message us"); ?></span>
			</div>
		</a>
	</div>
	<script>
		function OpenChatInNewTab() {
			var screenwidth = screen.width;
			var screenheight = window.innerHeight;
			window.open('<?php echo $fbChatUrl; ?>', '_blank', "directories=no,titlebar=no,toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=no,width=500,height=" + screenheight + ",left=" + (screenwidth - 500));
		}
	</script>
<?php
	//} // CLOSE IF
	endif;
?>