<?php
function dtb_preloader_enable() {
    global $dtb_preloader_val,$dtb_preloader_home_val, $dtb_preloader_type_val, $dtb_preloader_type_val;
	$dtb_preloader_type_val = dtb_get_option('dtb_preloader_type', 'preloader1');
	$dtb_custom_preloader_image_val = dtb_get_option('dtb_custom_preloader_image');
	$dtb_custom_preloader_image_url_val = dtb_get_option('dtb_custom_preloader_image_url');
	$dtb_custom_preloader_image_alt_val = dtb_get_option('dtb_custom_preloader_image_alt');
?>
	<div class="preloader">
		<div class="status">
			<?php
				if($dtb_custom_preloader_image_val){
			?>
					<img class="dtb_custom_preloader_img" src=<?php echo $dtb_custom_preloader_image_url_val ?> alt="<?php echo $dtb_custom_preloader_image_alt_val ?>">
			<?php
				}else{
			?>
				<style>
					@keyframes dtb-infinite-spinning{from{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes dtb-reverse-spinning{from{transform:rotate(360deg)}to{transform:rotate(0)}}@keyframes dtb-opacity{0%,100%{opacity:0}50%{opacity:1}}@keyframes dtb-rotate-5{0%,70%{transform:rotate(0)}100%{transform:rotate(180deg)}}@keyframes dtb-height-5{0%{height:50}100%,70%{height:0}}@keyframes dtb-translate-6{0%,100%{transform:translateY(0)}50%{transform:translateY(20px)}}@keyframes dtb-scale-7{from{transform:scale(0)}to{transform:scale(1)}}@keyframes dtb-opacity-7{from{opacity:1}to{opacity:0}}@keyframes dtb-height-8{0%,100%{height:5px}50%{height:21px}}@keyframes dtb-translateY-8{0%,100%{transform:translateY(13px)}50%{transform:translateY(5px)}}@keyframes dtb-opacity-9{0%,100%{opacity:1}50%{opacity:.2}}@keyframes dtb-scale-10{0%,100%{transform:scale(.1)}25%,50%,75%{transform:scale(1)}}@keyframes dtb-dashoffset-11{from{stroke-dashoffset:0}to{stroke-dashoffset:256.58892822265625}}@keyframes dtb-scale-12{from{transform:scale(1.8)}to{transform:scale(1)}}@keyframes dtb-opacity-12{from{opacity:1}to{opacity:0}}
				</style>
				<?php 
				if ($dtb_preloader_type_val == 'preloader1') { ?>
					<svg class="preloader" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80"><path style='animation:dtb-infinite-spinning 1.5s infinite linear;transform-origin:40px 40px;' d="M10 40v-1.1-1.3-.8c0-.3.1-.6.1-.9.1-.6.1-1.4.2-2.1.2-.8.3-1.6.5-2.5.2-.9.6-1.8.8-2.8.3-1 .8-1.9 1.2-3 .5-1 1.1-2 1.7-3.1.7-1 1.4-2.1 2.2-3.1 1.6-2.1 3.7-3.9 6-5.6 2.3-1.7 5-3 7.9-4.1.7-.2 1.5-.4 2.2-.7.7-.3 1.5-.3 2.3-.5.8-.2 1.5-.3 2.3-.4l1.2-.1.6-.1h.6c1.5 0 2.9-.1 4.5.2.8.1 1.6.1 2.4.3.8.2 1.5.3 2.3.5 3 .8 5.9 2 8.5 3.6 2.6 1.6 4.9 3.4 6.8 5.4 1 1 1.8 2.1 2.7 3.1.8 1.1 1.5 2.1 2.1 3.2.6 1.1 1.2 2.1 1.6 3.1.4 1 .9 2 1.2 3 .3 1 .6 1.9.8 2.7.2.9.3 1.6.5 2.4.1.4.1.7.2 1 0 .3.1.6.1.9.1.6.1 1 .1 1.4.4 1 .4 1.4.4 1.4.2 2.2-1.5 4.1-3.7 4.3s-4.1-1.5-4.3-3.7v-.7-.9-1.1-.7c0-.2-.1-.5-.1-.8-.1-.6-.1-1.2-.2-1.9s-.3-1.4-.4-2.2c-.2-.8-.5-1.6-.7-2.4-.3-.8-.7-1.7-1.1-2.6-.5-.9-.9-1.8-1.5-2.7-.6-.9-1.2-1.8-1.9-2.7-1.4-1.8-3.2-3.4-5.2-4.9-2-1.5-4.4-2.7-6.9-3.6-.6-.2-1.3-.4-1.9-.6-.7-.2-1.3-.3-1.9-.4-1.2-.3-2.8-.4-4.2-.5h-2c-.7 0-1.4.1-2.1.1-.7.1-1.4.1-2 .3-.7.1-1.3.3-2 .4-2.6.7-5.2 1.7-7.5 3.1-2.2 1.4-4.3 2.9-6 4.7-.9.8-1.6 1.8-2.4 2.7-.7.9-1.3 1.9-1.9 2.8-.5 1-1 1.9-1.4 2.8-.4.9-.8 1.8-1 2.6-.3.9-.5 1.6-.7 2.4-.2.7-.3 1.4-.4 2.1-.1.3-.1.6-.2.9 0 .3-.1.6-.1.8 0 .5-.1.9-.1 1.3-.2.7-.2 1.1-.2 1.1z"></path></svg>
				<?php	} 
				
				elseif ($dtb_preloader_type_val == 'preloader2') { ?>
					<svg class="preloader" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80"><path style='animation:dtb-infinite-spinning .8s infinite linear;transform-origin:40px 40px;' d="M10 40v-1.1-1.3-.8c0-.3.1-.6.1-.9.1-.6.1-1.4.2-2.1.2-.8.3-1.6.5-2.5.2-.9.6-1.8.8-2.8.3-1 .8-1.9 1.2-3 .5-1 1.1-2 1.7-3.1.7-1 1.4-2.1 2.2-3.1 1.6-2.1 3.7-3.9 6-5.6 2.3-1.7 5-3 7.9-4.1.7-.2 1.5-.4 2.2-.7.7-.3 1.5-.3 2.3-.5.8-.2 1.5-.3 2.3-.4l1.2-.1.6-.1h.6c1.5 0 2.9-.1 4.5.2.8.1 1.6.1 2.4.3.8.2 1.5.3 2.3.5 3 .8 5.9 2 8.5 3.6 2.6 1.6 4.9 3.4 6.8 5.4 1 1 1.8 2.1 2.7 3.1.8 1.1 1.5 2.1 2.1 3.2.6 1.1 1.2 2.1 1.6 3.1.4 1 .9 2 1.2 3 .3 1 .6 1.9.8 2.7.2.9.3 1.6.5 2.4.1.4.1.7.2 1 0 .3.1.6.1.9.1.6.1 1 .1 1.4.4 1 .4 1.4.4 1.4.2 2.2-1.5 4.1-3.7 4.3s-4.1-1.5-4.3-3.7v-.7-.9-1.1-.7c0-.2-.1-.5-.1-.8-.1-.6-.1-1.2-.2-1.9s-.3-1.4-.4-2.2c-.2-.8-.5-1.6-.7-2.4-.3-.8-.7-1.7-1.1-2.6-.5-.9-.9-1.8-1.5-2.7-.6-.9-1.2-1.8-1.9-2.7-1.4-1.8-3.2-3.4-5.2-4.9-2-1.5-4.4-2.7-6.9-3.6-.6-.2-1.3-.4-1.9-.6-.7-.2-1.3-.3-1.9-.4-1.2-.3-2.8-.4-4.2-.5h-2c-.7 0-1.4.1-2.1.1-.7.1-1.4.1-2 .3-.7.1-1.3.3-2 .4-2.6.7-5.2 1.7-7.5 3.1-2.2 1.4-4.3 2.9-6 4.7-.9.8-1.6 1.8-2.4 2.7-.7.9-1.3 1.9-1.9 2.8-.5 1-1 1.9-1.4 2.8-.4.9-.8 1.8-1 2.6-.3.9-.5 1.6-.7 2.4-.2.7-.3 1.4-.4 2.1-.1.3-.1.6-.2.9 0 .3-.1.6-.1.8 0 .5-.1.9-.1 1.3-.2.7-.2 1.1-.2 1.1z"></path><path style='animation:dtb-reverse-spinning .6s infinite linear;transform-origin:40px 40px;' d="M62 40.1s0 .2-.1.7c0 .2 0 .5-.1.8v.5c0 .2-.1.4-.1.7-.1.5-.2 1-.3 1.6-.2.5-.3 1.1-.5 1.8-.2.6-.5 1.3-.7 1.9-.3.7-.7 1.3-1 2.1-.4.7-.9 1.4-1.4 2.1-.5.7-1.1 1.4-1.7 2-1.2 1.3-2.7 2.5-4.4 3.6-1.7 1-3.6 1.8-5.5 2.4-2 .5-4 .7-6.2.7-1.9-.1-4.1-.4-6-1.1-1.9-.7-3.7-1.5-5.2-2.6s-2.9-2.3-4-3.7c-.6-.6-1-1.4-1.5-2-.4-.7-.8-1.4-1.2-2-.3-.7-.6-1.3-.8-2l-.6-1.8c-.1-.6-.3-1.1-.4-1.6-.1-.5-.1-1-.2-1.4-.1-.9-.1-1.5-.1-2v-.7s0 .2.1.7c.1.5 0 1.1.2 2 .1.4.2.9.3 1.4.1.5.3 1 .5 1.6.2.6.4 1.1.7 1.8.3.6.6 1.2.9 1.9.4.6.8 1.3 1.2 1.9.5.6 1 1.3 1.6 1.8 1.1 1.2 2.5 2.3 4 3.2 1.5.9 3.2 1.6 5 2.1 1.8.5 3.6.6 5.6.6 1.8-.1 3.7-.4 5.4-1 1.7-.6 3.3-1.4 4.7-2.4 1.4-1 2.6-2.1 3.6-3.3.5-.6.9-1.2 1.3-1.8.4-.6.7-1.2 1-1.8.3-.6.6-1.2.8-1.8.2-.6.4-1.1.5-1.7l.3-1.5c.1-.4.1-.8.1-1.2 0-.2 0-.4.1-.5v-.5-.8-.7c0-1.1.9-2 2-2s2 .9 2 2c.1-.1.1 0 .1 0z"></path></svg>
				<?php	} 
				
				elseif ($dtb_preloader_type_val == 'preloader3') { ?>
					<svg class="preloader" xmlns="http://www.w3.org/2000/svg" viewBox="2 2 35 35"><path opacity=".3" d="M20.201 5.169c-8.254 0-14.946 6.692-14.946 14.946 0 8.255 6.692 14.946 14.946 14.946s14.946-6.691 14.946-14.946c-.001-8.254-6.692-14.946-14.946-14.946zm0 26.58c-6.425 0-11.634-5.208-11.634-11.634 0-6.425 5.209-11.634 11.634-11.634 6.425 0 11.633 5.209 11.633 11.634 0 6.426-5.208 11.634-11.633 11.634z"/><path style='animation:dtb-infinite-spinning 1s infinite linear;transform-origin:20px 20px;' d="M26.013 10.047l1.654-2.866c-2.198-1.272-4.743-2.012-7.466-2.012v3.312c2.119 0 4.1.576 5.812 1.566z"><animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 20 20" to="360 20 20" dur="1s" repeatCount="indefinite"/></path></svg>
				
				<?php }
				
				elseif ($dtb_preloader_type_val == 'preloader4') { ?>
					<svg class="preloader" xmlns="http://www.w3.org/2000/svg" viewBox="0 15 56 70">
						<circle cx="8" cy="50" r="6" style="animation: dtb-opacity 1s infinite linear; animation-delay: .1s" />
						<circle cx="28" cy="50" r="6" style="animation: dtb-opacity 1s infinite linear; animation-delay: .2s"/>
						<circle cx="48" cy="50" r="6" style="animation: dtb-opacity 1s infinite linear; animation-delay: .3s" />
					</svg>
				
				<?php }
				
				elseif ($dtb_preloader_type_val == 'preloader5') { ?>
					<svg class="preloader" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
						<rect class="none" fill="none"  stroke-width="4" x="25" y="25" width="50" height="50" style="animation: dtb-rotate-5 1.8s infinite linear; transform-origin: 50px 50px;" />
						<rect x="27" y="27" width="46" height="50" style="animation: dtb-height-5 1.8s infinite linear; animation-fill-mode: forwards; " />
					</svg>
				
				<?php }
				
				elseif ($dtb_preloader_type_val == 'preloader6') { ?>
					<svg class="preloader" xmlns="http://www.w3.org/2000/svg" viewBox="-15 25 100 100">
					<rect x="16" y="50" width="8" height="20" style="animation: dtb-translate-6 .8s infinite linear;" />
					<rect x="30" y="50" width="8" height="20"  style="animation: dtb-translate-6 .8s infinite linear; animation-delay: .2s;" />
					<rect x="44" y="50" width="8" height="20" style="animation: dtb-translate-6 .8s infinite linear; animation-delay: .4s;" />
					</svg>
				
				<?php }
				
				elseif ($dtb_preloader_type_val == 'preloader7') { ?>
					<svg class="preloader preloader7" width="70" height="70" xmlns="http://www.w3.org/2000/svg">
						<g class="none" fill-rule="evenodd" stroke-width="2">
							<circle cx="35" cy="35" r="26" style="animation: dtb-scale-7 1.8s infinite cubic-bezier(0.165, 0.84, 0.44, 1), dtb-opacity-7 1.8s infinite cubic-bezier(0.3, 0.61, 0.355, 1);animation-delay: -0.9s;transform-origin: 35px 35px;" />
							<circle cx="35" cy="35" r="26" style="animation: dtb-scale-7 1.8s infinite cubic-bezier(0.165, 0.84, 0.44, 1), dtb-opacity-7 1.8s infinite cubic-bezier(0.3, 0.61, 0.355, 1); transform-origin: 35px 35px;">
						</g>
					</svg>
				
				<?php }
				
				elseif ($dtb_preloader_type_val == 'preloader8') { ?>
					<svg class="preloader" xmlns="http://www.w3.org/2000/svg" width="40" viewBox="0 0 24 30">
					<rect y="0" width="4" style="animation: dtb-height-8 .6s infinite linear, dtb-translateY-8 .6s infinite linear;" />
					<rect x="10" y="0" width="4" style="animation: dtb-height-8 .6s infinite linear, dtb-translateY-8 .6s infinite linear; animation-delay: .15s;" />
					<rect x="20" y="0" width="4" style="animation: dtb-height-8 .6s infinite linear, dtb-translateY-8 .6s infinite linear; animation-delay: .3s;" />
					</svg>				
				
				<?php }
				
				elseif ($dtb_preloader_type_val == 'preloader9') { ?>
					<svg class="preloader" xmlns="http://www.w3.org/2000/svg" width="50" viewBox="0 0 40 30">
						<rect width="4" height="20" style="animation: dtb-opacity-9 .6s infinite linear;" />
						<rect x="11" width="4" height="20" style="animation: dtb-opacity-9 .6s infinite linear; animation-delay: .2s;" />
						<rect x="22" width="4" height="20" style="animation: dtb-opacity-9 .6s infinite linear; animation-delay: .4s;" />
					</svg>
				
				<?php }
				
				elseif ($dtb_preloader_type_val == 'preloader10') { ?>
					<svg class="preloader" width="60" viewBox="0 -10 80 60">
						<rect width="20" height="20" rx="3" ry="3" style="animation: dtb-scale-10 1s infinite linear; transform-origin: 10px 10px;" />
						<rect width="20" height="20" x="25" rx="3" ry="3" style="animation: dtb-scale-10 1s infinite linear; transform-origin: 35px 10px; animation-delay: .2s;" />
						<rect width="20" height="20" x="50" rx="3" ry="3" style="animation: dtb-scale-10 1s infinite linear; transform-origin: 60px 10px; animation-delay: .4s;" />
					</svg>
				
				<?php }
				
				elseif ($dtb_preloader_type_val == 'preloader11') { ?>
					<svg class="preloader none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid"style="background:0 0">
						<path class="none" fill="none" d="M24.3 30C11.4 30 5 43.3 5 50s6.4 20 19.3 20c19.3 0 32.1-40 51.4-40C88.6 30 95 43.3 95 50s-6.4 20-19.3 20c-19.3 0-32.1-40-51.4-40z" stroke-width="4" stroke-dasharray="159.085 97.504" style="animation:dtb-dashoffset-11 1s infinite linear;" />
					</svg>
				
				<?php }
				
				elseif ($dtb_preloader_type_val == 'preloader12') { ?>
					<svg class="preloader nostroke" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid">
						<g transform="translate(80 50)">
							<circle r="6" transform="scale(1.21152)" style="animation: dtb-scale-12 .6s infinite linear, dtb-opacity-12 .6s infinite linear; animation-delay: -.525s" />
						</g>
						<g transform="rotate(45 -50.355 121.569)">
							<circle r="6" fill-opacity=".875" transform="scale(1.31152)" style="animation: dtb-scale-12 .6s infinite linear, dtb-opacity-12 .6s infinite linear; animation-delay: -.450s" />
						</g>
						<g transform="rotate(90 -15 65)">
							<circle r="6" fill-opacity=".75" transform="scale(1.41152)" style="animation: dtb-scale-12 .6s infinite linear, dtb-opacity-12 .6s infinite linear; animation-delay: -.375s" />
						</g>
						<g transform="rotate(135 -.355 41.569)">
							<circle r="6" fill-opacity=".625" transform="scale(1.51152)" style="animation: dtb-scale-12 .6s infinite linear, dtb-opacity-12 .6s infinite linear; animation-delay: -.3s" />
						</g>
						<g transform="rotate(180 10 25)">
							<circle r="6" fill-opacity=".5" transform="scale(1.61152)" style="animation: dtb-scale-12 .6s infinite linear, dtb-opacity-12 .6s infinite linear; animation-delay: -.225s">
						</g>
						<g transform="rotate(-135 20.355 8.431)">
							<circle r="6" fill-opacity=".375" transform="scale(1.71152)" style="animation: dtb-scale-12 .6s infinite linear, dtb-opacity-12 .6s infinite linear; animation-delay: -.15.s" />
						</g>
						<g transform="rotate(-90 35 -15)">
							<circle r="6" fill-opacity=".25" transform="scale(1.01152)" style="animation: dtb-scale-12 .6s infinite linear, dtb-opacity-12 .6s infinite linear; animation-delay: -.075s" />
						</g>
						<g transform="rotate(-45 70.355 -71.569)">
							<circle r="6" fill-opacity=".125" transform="scale(1.11152)" style="animation: dtb-scale-12 .6s infinite linear, dtb-opacity-12 .6s infinite linear;" />
						</g>
					</svg>
										
				<?php }
				
				?>
			<?php }
				
				?>
		</div>
	</div>

    <?php
    
}
?>