<?php $path="../../"; include("../../map.php");?>
<style>
.item-video:before {
    content: '';
    width: 30px;
    height: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    background: rgba(255,255,255,.26) url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20357%20357%22%3E%3Cpolygon%20points%3D%2238.25%2C0%2038.25%2C357%20318.75%2C178.5%20%20%20%22%20fill%3D%22%23FFF%22/%3E%3C/svg%3E%0A) 10px 8px no-repeat;
    background-size: 14px 14px;
    border-radius: 15px;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
</style>
<div class="v3-panel-group" id="myGroup" role="tablist" aria-multiselectable="true">
	<div class="v3-panel v3-panel-default">
		<div class="v3-panel-heading" role="tab" id="heading-t1">
			<h4 class="v3-panel-title">
				<a role="button" data-toggle="collapse" data-parent="#myGroup" href="#collapse-t1" aria-expanded="true" aria-controls="collapse-t1">
					Resimler
				</a>
			</h4>
		</div>
		<div id="collapse-t1" class="v3-panel-collapse collapse in show" role="tabpanel" aria-labelledby="heading-t1">
			<div class="v3-panel-body">
<?php
	$get_images = file_get_contents('https://cdn.'.$cdnurl.'/themes/?folder=images/thumbs', false, stream_context_create($arrContextOptions)); $images = json_decode($get_images, true);
	foreach($images as $image){
?>
	<a class="v3-col-md-4 v3-col-xs-6 item-image" href="fonksiyon.php?durum=ujson&crm_background=<?php echo str_replace("thumbs/","",$image)?>"  target="logfrm" style="position:relative;padding: 5px;">
		<img src="https://cdn.crmplus.com.tr/<?php echo $image?>" data-sourge="https://cdn.<?php echo $cdnurl?>/<?php echo str_replace("thumbs/","",$image)?>" class="themes theme_images" style="width:100%; height:80px; float:left; margin-left:5px; margin-bottom:5px; <?php if($module["crm_background"]==$image){echo "border: 4px solid orange;";}else{echo "border: 4px solid grey;";}?>">
		<p style="position: absolute; bottom: -10px; width: 87%; left: 15px; background: #ffffffa8; padding-left: 5px;"><?php echo str_replace(".jpg","",str_replace("themes/images/thumbs/","",$image))?></p>
	</a>
<?php } ?>
			</div>
		</div>
	</div>
	<div class="v3-panel v3-panel-default">
		<div class="v3-panel-heading" role="tab" id="heading-t2">
			<h4 class="v3-panel-title">
				<a role="button" data-toggle="collapse" data-parent="#myGroup" href="#collapse-t2" aria-expanded="true" aria-controls="collapse-t2">
					Svg Arkaplanlar
				</a>
			</h4>
		</div>
		<div id="collapse-t2" class="v3-panel-collapse collapse" role="tabpanel" aria-labelledby="heading-t2">
			<div class="v3-panel-body">
<?php
	$get_svgs = file_get_contents('https://cdn.'.$cdnurl.'/themes/?folder=svg', false, stream_context_create($arrContextOptions)); $svgs = json_decode($get_svgs, true);
	$colors = array("CornflowerBlue","CadetBlue","Grey"); $i=-1;
	foreach($svgs as $svg){$i++;
?>
	<a class="v3-col-md-4 v3-col-xs-6 item-svg" href="fonksiyon.php?durum=ujson&crm_background=<?php echo $colors[$i]?>,<?php echo $svg?>"  target="logfrm" style="position:relative;padding: 5px;">
		<div  class="themes theme_svgs" data-sourge="https://cdn.<?php echo $cdnurl?>/<?php echo $svg?>" data-color="<?php echo $colors[$i]?>" style="background-image:url(https://cdn.<?php echo $cdnurl?>/<?php echo $svg?>); background-size: cover; background-color: <?php echo $colors[$i]?>; width:100%; height:80px; float:left; margin-left:5px; margin-bottom:5px; <?php if($module["crm_background"]==$svg){echo "border: 4px solid orange;";}else{echo "border: 4px solid grey;";}?>"></div>
		<p style="position: absolute; bottom: -10px; width: 87%; left: 15px; background: #ffffffa8; padding-left: 5px;"><?php echo str_replace(".svg","",str_replace("themes/svg/","",$svg))?></p>
	</a>
<?php } ?>
			</div>
		</div>
	</div>
	<div class="v3-panel v3-panel-default">
		<div class="v3-panel-heading" role="tab" id="heading-t3">
			<h4 class="v3-panel-title">
				<a role="button" data-toggle="collapse" data-parent="#myGroup" href="#collapse-t3" aria-expanded="true" aria-controls="collapse-t3">
					Videolar
				</a>
			</h4>
		</div>
		<div id="collapse-t3" class="v3-panel-collapse collapse" role="tabpanel" aria-labelledby="heading-t3">
			<div class="v3-panel-body">
<?php
	$get_videos = file_get_contents('https://cdn.'.$cdnurl.'/themes/?folder=videos/thumbs', false, stream_context_create($arrContextOptions)); $videos = json_decode($get_videos, true);
	foreach($videos as $video){
?>
	<a class="v3-col-md-4 v3-col-xs-6 item-video" href="fonksiyon.php?durum=ujson&crm_background=<?php echo str_replace(".jpg",".mp4",str_replace("thumbs/","",$video))?>"  target="logfrm" style="position:relative;padding: 5px;">
		<img src="https://cdn.crmplus.com.tr/<?php echo $video?>" data-sourge="https://cdn.<?php echo $cdnurl?>/<?php echo str_replace(".jpg",".mp4",str_replace("thumbs/","",$video))?>" class="themes theme_videos" style="width:100%; height:80px; float:left; margin-left:5px; margin-bottom:5px; <?php if($module["crm_background"]==$video){echo "border: 4px solid orange;";}else{echo "border: 4px solid grey;";}?>">
		<p style="position: absolute; bottom: -10px; width: 87%; left: 15px; background: #ffffffa8; padding-left: 5px;"><?php echo str_replace(".jpg","",str_replace("themes/videos/thumbs/","",$video))?></p>
	</a>
<?php } ?>
			</div>
		</div>
	</div>
	<div class="v3-panel v3-panel-default">
		<div class="v3-panel-heading" role="tab" id="heading-t4">
			<h4 class="v3-panel-title">
				<a role="button" data-toggle="collapse" data-parent="#myGroup" href="#collapse-t4" aria-expanded="true" aria-controls="collapse-t4">
					Renkler
				</a>
			</h4>
		</div>
		<div id="collapse-t4" class="v3-panel-collapse collapse" role="tabpanel" aria-labelledby="heading-t4">
			<div class="v3-panel-body">
<?php
	$colors = array("Tomato","Black","CadetBlue","Chocolate","Crimson","DarkCyan","DarkKhaki","DarkOliveGreen","DimGray","FireBrick","GoldenRod","SlateGrey");
	foreach($colors as $color){
?>
	<a class="v3-col-md-4 v3-col-xs-6 item-color" href="fonksiyon.php?durum=ujson&crm_background=<?php echo $color?>"  target="logfrm" style="position:relative;padding: 5px;">
		<div  class="themes theme_colors" data-sourge="<?php echo $color?>" style="background:<?php echo $color?>; width:100%; height:80px; float:left; margin-left:5px; margin-bottom:5px; <?php if($module["crm_background"]==$color){echo "border: 4px solid orange;";}else{echo "border: 4px solid grey;";}?>"></div>
		<p style="position: absolute; bottom: -10px; width: 87%; left: 15px; background: #ffffffa8; padding-left: 5px;"><?php echo $color?></p>
	</a>
<?php } ?>
			</div>
		</div>
	</div>
</div>
<?php
	$mydir = '../../../deppo/image';
	$myfiles = array_diff(scandir($mydir), array('.', '..'));
	foreach($myfiles as $theme){$i++;
	if(substr($theme,0,5)=="theme"){
?>
	<a class="v3-col-md-4 v3-col-xs-6 item-image theme<?php echo $i?>" href="fonksiyon.php?durum=ujson&crm_background=deppo/image/<?php echo $theme?>"  target="logfrm" style="position:relative;padding: 5px;">
		<i class="fas fa-times v3-btn-xs" data_id="theme<?php echo $i?>" data_sourge="<?php echo $theme?>" style="position: absolute; right: 5px; top: 10px;"></i>
		<img src="../../../deppo/image/<?php echo $theme?>" data-sourge="../../../deppo/image/<?php echo $theme?>" class="themes theme_images" style="width:100%; height:80px; float:left; margin-left:5px; margin-bottom:5px; <?php if($module["crm_background"]==$theme){echo "border: 4px solid orange;";}else{echo "border: 4px solid grey;";}?>">
		<p style="position: absolute; bottom: -10px; width: 87%; left: 15px; background: #ffffffa8; padding-left: 5px;"><?php echo str_replace(".jpg","",str_replace("deppo/images/","",$theme))?></p>
	</a>
<?php }}?>
<div style="clear:both; display:block"></div>
<div class="v3-col-md-6 v3-col-xs-6" style="position:relative; padding-bottom:15px;">
	<a class="theme_reset" href="fonksiyon.php?durum=ujson&crm_background="  target="logfrm" style="clear:both;"><i class="fas fa-broom"></i> Reset Theme</a>
</div>
<div class="v3-col-md-6 v3-col-xs-6" style="position:relative; padding-bottom:15px;" id="dark_mode"></div>
<script>
	jQuery('.theme_images').click(function(e){
		jQuery('.themes').css('border','4px solid grey');
		jQuery(this).css('border','4px solid orange');
		var src = jQuery(this).attr("data-sourge");
		jQuery('#background-video').html('');
		jQuery('#jswpanel').css('background','url('+src+') center center / cover no-repeat fixed');
	});
	jQuery('.theme_videos').click(function(e){
		jQuery('.themes').css('border','4px solid grey');
		jQuery(this).css('border','4px solid orange');
		var src = jQuery(this).attr("data-sourge");
		jQuery('#jswpanel').css('background','url() center center / cover no-repeat fixed');
		jQuery('#jswpanel').append('<video id="background-video" autoplay loop muted><source src='+src+' type="video/mp4"></video>');
		jQuery('#background-video')[0].load();
	});
	jQuery('.theme_colors').click(function(e){
		jQuery('.themes').css('border','4px solid grey');
		jQuery(this).css('border','4px solid orange');
		var src = jQuery(this).attr("data-sourge");
		jQuery('#jswpanel').css('background','url() center center / cover no-repeat fixed');
		jQuery('#background-video').html('');
		jQuery('#background-video')[0].load();
		jQuery('#jswpanel').css('background',src);
	});
	jQuery('.theme_svgs').click(function(e){
		jQuery('.themes').css('border','4px solid grey');
		jQuery(this).css('border','4px solid orange');
		var src = jQuery(this).attr("data-sourge");
		var color = jQuery(this).attr("data-color");
		jQuery('#jswpanel').css('background',color);
		jQuery('#jswpanel').css('background-image','url('+src+')');
		jQuery('#background-video').html('');
		jQuery('#background-video')[0].load();
	});
	jQuery('.theme_reset').click(function(e){
		jQuery('.themes').css('border','4px solid grey');
		jQuery('#background-video').html('');
		jQuery('#jswpanel').css('background','url(https://cdn.<?php echo $cdnurl?>/themes/svg/pattern.svg)');
		jQuery('#jswpanel').css('background-repeat','repeat');
		jQuery('#jswpanel').css('background-size','auto');
		jQuery('#jswpanel').css('background-color','rgb(84, 93, 107)');
	});
	jQuery('.fa-times').click(function(e){
		var data_sourge = jQuery(this).attr('data_sourge');
		var data_id = jQuery(this).attr('data_id');
		jQuery('.'+data_id+'').hide();
		logfrm.location.href='modules/public/select_theme.php?file='+data_sourge+'';
	});
	jQuery(document).ready(function(){
		setTimeout(function(){
			if(jQuery('body').hasClass("dark-mode")){
				jQuery('#dark_mode').html('<a onclick="darkmode()" href="fonksiyon.php?durum=ujson&dark-mode="  target="logfrm"><i class="fas fa-sun"></i> Light Mode</a>');
			} else {
				jQuery('#dark_mode').html('<a onclick="darkmode()" href="fonksiyon.php?durum=ujson&dark-mode=1"  target="logfrm"><i class="fas fa-moon"></i> Dark Mode</a>');
			}
		}, 100);
	});
	jQuery('#dark_mode').click(function(e){
		setTimeout(function(){
			if(jQuery('body').hasClass("dark-mode")){
				jQuery('#dark_mode').html('<a onclick="darkmode()" href="fonksiyon.php?durum=ujson&dark-mode="  target="logfrm"><i class="fas fa-sun"></i> Light Mode</a>');
			} else {
				jQuery('#dark_mode').html('<a onclick="darkmode()" href="fonksiyon.php?durum=ujson&dark-mode=1"  target="logfrm"><i class="fas fa-moon"></i> Dark Mode</a>');
			}
		}, 100);
	});
</script>
<?php if($_GET["file"]<>""){unlink("../../../deppo/image/".$_GET["file"]);}?>