<?php 
	if(strtotime($block->getConfig('end_date')) >= strtotime($block->getCurrentTime())){ 
	$background = '';
	if($this->getConfig('background_image')){
		$path = $this->getConfig('background_image');
		$objectManager = \Magento\Framework\App\ObjectManager::getInstance();
		$storeManager = $objectManager->get('\Magento\Store\Model\StoreManagerInterface');
		$imageUrl = $storeManager->getStore()->getBaseUrl(\Magento\Framework\UrlInterface::URL_TYPE_MEDIA).$path;
		$background = "style='background-image: url(".$imageUrl.");'";
	}
?>
<div class="newsllters-banner" <?php echo $background ?>> 
	<div class="container-fluid">
		<div class="newsllters-banner-content">
			<div class="col-countdown col-lg-6 col-12">
				<div class="newsllters-title">
					<?php if($this->getConfig('title')){?><h2 class="title-newsllters size-32 uppercase"><?php echo $block->getConfig('title');?></h2><?php }?>
					<?php if($this->getConfig('description')){?><p class="short-des size-18"><?php echo $block->getConfig('description');?></p><?php }?>
				</div>
				<div class="countdown">
					<?php if($this->getConfig('title_countdown')){?><h5 class="sub-title-newsllters size-24 uppercase"><?php echo $block->getConfig('title_countdown');?></h5><?php }?>
					<div class="newsllters-countdown" data-date="<?php echo $block->getConfig('end_date');?>"></div>
				</div>
				<p class="margin_0 size-18 title-form"><?php echo __('Notify me when website launched') ?></p>
				<div class="col-newsletter">
					<?php echo $block->getLayout()->createBlock('Magento\Newsletter\Block\Subscribe')->setTemplate('Rokanthemes_RokanBase::subscribe.phtml')->toHtml(); ?>
				</div>
				<?php if($this->getConfig('social_html')){?>
					<div class="social-html">
						<?php echo $this->getLayout()->createBlock('Magento\Cms\Block\Block')->setBlockId($block->getConfig('social_html'))->toHtml(); ?>
					</div>
				<?php }?>
			</div>
		</div> 
	</div>
</div>
<script>
    require([
        'jquery',
        'rokanthemes/timecircles'
    ], function ($) {
		$( document ).ready(function() {
			if($('.newsllters-countdown').length>0){
				$(".newsllters-countdown").TimeCircles({
					fg_width: 0.01,
					bg_width: 1.2,
					text_size: 0.07,
					circle_bg_color: "#ffffff",
					time: {
						Days: {
							show: true,
							text: "Days",
						},
						Hours: {
							show: true,
							text: "Hours",
						},
						Minutes: {
							show: true,
							text: "Mins",
						},
						Seconds: {
							show: true,
							text: "Secs",
						}
					}
				}); 
			}
		});
    });
</script>
<?php } ?>