<?php
	
	# Não apagar esse arquivo pra mód não dar bééééé!

require_once("header.php");

$cond = router(2);

nivel("slider");

$configs = array(
		"slider_principal" => array(
			"titlePag" => "SLIDER",
			"total"   => 6,  // Coloque 0 para apagar as fotos e zerar o mysql
			"width"   => 1920,
			"height"  => 950,
			"link"    => true,
			"titulo"  => false,
			"texto"   => false,
			"botao"   => false,
			"cor"     => false,
			"alinhamento" => false
			),
		);

if(@$configs["$cond"] == false)
	{
		echo '
			<div class="container">
				<br />
				<div class="alert text-center alert-info">
					<strong>
					Não foi possível localizar esse slider, verifique e tente novamente.
					</strong>
					<div>Entre em contato com administrador do site</div>				
				</div>
			</div>
			';
		exit;
	}
?>
	
	<div class="container">
		<div class="row">
			<div class="col-md-12 text-left">
				<h1><?php echo $configs["$cond"]["titlePag"]; ?></h1>
			</div>
		</div>
		
		<br />

.show-img i.fa.fa-spinner.fa-spin {
		    left: calc(50% - 19px);
		    top: calc(50% - 18px);
		    animation:fa-spin 1s infinite cubic-bezier(0.73, -1.48, 0.4, 1.04);
		}

.show-img img{
			position: relative;
			z-index: 1;
		}
		</style>

$('.colorPicker').colorpicker({
        		customClass: 'colorpicker-2x',
	        	sliders: {
	                saturation: {
	                    maxLeft: 200,
	                    maxTop: 200
	                },
	                hue: {
	                    maxTop: 200
	                },
	                alpha: {
	                    maxTop: 200
	                }
	            }
        	});

var enviando = 0;
			$(".btn-send").click(function(e){
				e.preventDefault();

var formName = "formSlider";
				var btn      = $(this);

$(btn).html("Processando... <span class='fa fa-spinner fa-spin'></span>");
				$(btn).addClass("disabled");

if(enviando == 0)
				{
					enviando = 1;
					$("."+formName).ajaxSubmit({
						url     : "model/slider/salvar",
						type    : "POST",
						success : function(data){ 
							$(btn).html('<span class="fa fa-floppy-o"></span> SALVAR');
							$("."+formName+" .result").html(data);
							$(btn).removeClass("disabled");

enviando = 0;
						}
					});
				}
			});

$(".btn-publicar").click(function(e){
				e.preventDefault();

$action = $(this).attr("data-action");
				$rowID  = $(this).attr("data-row-id");

if($action == "2")
				{
					$(".therow"+$rowID+" .input-publicado").val(2);
					$(".therow"+$rowID+" input, .therow"+$rowID+" textarea, .therow"+$rowID+" select").attr("readonly", "1");
					$(".therow"+$rowID+" .overlay").fadeIn("fast");
					$(this).css("opacity", "1");
				}
				else if($action == "1")
				{
					$(".therow"+$rowID+" .input-publicado").val(1);
					$(".therow"+$rowID+" .overlay").fadeOut("fast");
					$(".therow"+$rowID+" input, .therow"+$rowID+" textarea, .therow"+$rowID+" select").removeAttr("readonly");
				}
			});

<?php if($configs["$cond"]["total"] > 1): ?>
			$(".list-sliders").sortable({
				opacity: 0.4,
				cursor: "move",
				update: function(){
				}
			});
			<?php endif; ?>
		});

function manipula(widthCrop, defineClass){

var img    = new Image;
			img.src    = URL.createObjectURL(document.getElementById("inputimagem"+defineClass).files[0]);
			
			img.onload = function() {

if(img.width < widthCrop)
				{
					$input = $("#inputimagem"+defineClass);
					$input.replaceWith($input.val("").clone(true));
					/*$(".therow"+defineClass+" .foto").val("");
					$(".therow"+defineClass+" .show-img").html("<i class='fa fa-file-image-o'></i>");*/

sweetAlert("Atenção!", "A foto deve ter no mínimo "+widthCrop+"px de largura.", "warning", "Fechar");
					return false;
				}
				else
				{
					$(".therow"+defineClass+" .show-img").html("<i><div class='spinnerLoad'></div></i>");
					var canvas = document.createElement("canvas");

var ratio     = img.width/widthCrop;
					var width     = img.width/ratio;
					var height    = img.height/ratio;
					canvas.width  = width; 
					canvas.height = height;
					canvas.getContext("2d").drawImage(img, 0, 0, width, height);
					if(document.getElementById("inputimagem"+defineClass).files[0].type == 'image/png')
					{ 
						var image_base64 = canvas.toDataURL("image/png"); 
					}
					else
					{ 
						var image_base64 = canvas.toDataURL("image/jpeg"); 
					}

$(".therow"+defineClass+" .foto").val("");
					$(".therow"+defineClass+" .show-img").hide().html("<img src='"+image_base64+"' class='img-responsive'>").fadeIn("slow");
					$(".therow"+defineClass+" .foto").val(image_base64);
					
					// Limpa o input file para não enviar no POST
					$input = $("#inputimagem"+defineClass);
					$input.replaceWith($input.val("").clone(true));
				}
			}
		}
		</script>
		
		<?php if($configs["$cond"]["total"] > 1): ?>
		<div class="col-md-12 text-center result-drop" style="min-height: 0 !important">
			
		</div>
		<div class="text-center">
			<small>Arraste para alterar a ordem das fotos</small>
		</div>
		<div class="clearfix"></div>
		<br />
		<?php endif; ?>

<div id="short-images" class="list-sliders">
				<?php 
				for($i = 0; $i <= ($configs["$cond"]["total"])-1; $i++):

$ln = mysql_fetch_object(mysql_query("SELECT * FROM site_slider WHERE cond = '$cond' ORDER BY ID ASC LIMIT $i, ".$configs["$cond"]["total"]));
				?>
				<div id="widgetArray_<?php echo $ln->ID; ?>" class="row col therow<?php echo $i; ?>">
					<input type="hidden" class="input-publicado" name="publicado[]" value="<?php echo ($ln->publicado != "") ? $ln->publicado : '1'; ?>">
					<input type="hidden" name="ordem[]" value="<?php echo ($ln->ordem != "") ? $ln->ordem : ''; ?>">
					<div class="overlay text-center" <?php echo ($ln->publicado == "2") ? 'style="display: block;"' : ''; ?>>
						<a href="javascript:;" class="btn btn-success btn-lg btn-publicar" data-row-id="<?php echo $i; ?>" data-action="1">
							Ativar item
						</a>
					</div>
					<div class="col-md-4">
						<div class="row">
							<div class="col-md-12">
								<div class="show-img">
									<i class="fa fa-file-image-o"></i>
									<?php if(($ln->foto && file_exists("../uploads/slider/".$ln->foto)) == true): ?>
										<img src="<?php echo "../uploads/slider/".$ln->foto; ?>" class="img-responsive" />
									<?php endif; ?>
								</div>
							</div>
							<div class="col-md-12 text-center btn-send-photo">
								<input onchange="manipula(<?= $configs["$cond"]["width"] ?>, '<?php echo $i; ?>')" id="inputimagem<?php echo $i; ?>" data-buttonName="btn-primary" data-size="sm" data-input="false" data-buttonBefore="true" name="filefoto" data-buttonText="Escolher foto" class="filestyle" type="file">
								<br />
								Tamanho: <strong><?php echo $configs["$cond"]["width"]." x ".$configs["$cond"]["height"];  ?></strong> - <a target="_blank" href="<?= cp_root ?>crop/index.php?w=<?= $configs["$cond"]["width"] ?>&h=<?= $configs["$cond"]["height"] ?>">Ferramenta de corte</a>
								<br />
								<input type="hidden" name="foto[]" class="foto" value="<?php echo $ln->foto; ?>">
							</div>
						</div>
					</div>
					<div class="col-md-8">
						<div class="row">
							<?php if($configs["$cond"]["titulo"] == true): ?>
							<div class="col-md-8 form-group input-nome">
								<small>Título</small>
								<input type="text" name="titulo[]" class="form-control input-sm" value="<?php echo $ln->titulo; ?>">
							</div>
							<?php endif; ?>

<?php if($configs["$cond"]["cor"] == true): ?>
							<div class="col-md-4 form-group input-nome">
								<small>Cor dos texto</small>

</div>
							<?php endif; ?>
							
							<?php if($configs["$cond"]["texto"] == true): ?>
							<div class="col-md-12 form-group input-nome">
								<small>Texto</small>
								<textarea name="texto[]" class="form-control input-sm" style="resize: none"><?php echo $ln->texto; ?>

Texto do botão

Link

Destino

Alinhamento

Não Publicar