@extends('BaseSistemaWeb')

@section('CSS')
{{ HTML::style('SysWeb/SumeClientes/Paginas.min.css') }}
{{ HTML::style('gentemplate/css/min/editor.min.css?=v0.1.48') }}
<style>
	.modal-desktop .modal-dialog iframe {
		margin-left: -30px;
	}
</style>
@stop


@section('Contenido')
<div class="row">
	<div class="col-md-12">
		<h2><i class="icons-web-site" style="font-size: 30px !important;"></i> Sitio Web </h2>
	</div><!--/col-md-12-->
</div><!--/row-->

<div class="row">
	{{--
	<div class="col-md-12">
		<nav class="navbar navbar-inverse">
			<ul class="nav navbar-nav">
				<li><a href="{{ URL::to('templates') }}">Ver todos los Templates</a></li>
				<li><a href="{{ URL::to('templates/create') }}">Crear un Template</a>
			</ul>
		</nav>
	</div>
	--}}
	<div class="col-md-12">
		@if (Session::has('message'))
		<div class="alert alert-info">{{ Session::get('message') }}</div>
		@endif
	</div>
</div>

<div class="row">
	<div class="col-md-12">
		<div class="block-web">
			<div class="header"> <h3 class="content-header"> Listado ventanas del temas del sitio web <strong>{{ $TemaSW->nombre }}</strong> </h3> </div>
			<div class="porlets-content">
				<div class="table-responsive">
					<table class="table table-hover">
						<thead>
							<tr>
								<th class="col-md-3"> Nombre </th>
								<th> Módulo </th>
								<th class="col-md-3"> Acciones </th>
							</tr>
						</thead>
						<tbody>
							@foreach( $Ventanas as $Ventana )
							<tr>
								<td> {{ $Ventana->nombre }} </td>
								<td>
									@if( $Ventana->modulo == 'SW' )
									Sitio Web
									@elseif( $Ventana->modulo == 'TEL' )
									Tienda en línea
									@else
									No identificado
									@endif
								</td>
								<td>
									<a href="{{ URL::route('SysWebSWebPlantillasxTemaVentanasEditarConf', array($TemaSW->id, $Ventana->id)) }}" class="btn btn-warning tooltips" data-toggle="tooltip" data-original-title="Editar configuraciones de la ventana">
										<i class="fa fa-pencil-square-o"></i>
									</a>
									<a href="{{ URL::route('SysWebSWebPlantillasxTemaVentanasEditar', array($TemaSW->id, $Ventana->id)) }}" class="btn btn-primary tooltips" data-toggle="tooltip" data-original-title="Editar contenido de la ventana">
										<i class="fa fa-pencil-square-o"></i>
									</a>
									<a href="javascript:vistaPrevia({{ $Ventana->id }})" class="btn btn-info tooltips btnVer" data-toggle="tooltip" data-original-title="Vista previa de ventana emergente">
										<i class="fa fa-search"></i>
									</a>
									<button type="button" class="btn btn-danger tooltips btnEliminar" data-id="{{ $Ventana->id }}" data-toggle="tooltip" data-original-title="Eliminar ventana emergente">
										<i class="fa fa-trash"></i>
									</button>
									<a href="{{ URL::route('SysWebSWebPlantillasxTemaVentanasImportar', array($TemaSW->id, $Ventana->id)) }}" download class="btn btn-default tooltips" data-toggle="tooltip" data-original-title="Importar">
										<span class="fa fa-download"></span>
									</a>
								</td>
							</tr>
							@endforeach
						</tbody>
					</table>
				</div>
			</div>
			<div class="bottom">
				{{ HTML::linkRoute('SysWebSWebPlantillasxTemaVentanasAgregar', 'Agregar', array($TemaSW->id), array('class' => 'btn btn-primary')) }}
				{{ HTML::linkRoute('SysWebSWebTemas', 'Regresar', array(), array('class' => 'btn btn-default')) }}
			</div>
		</div>
	</div>
</div><!--/row end-->
@stop

@section('JS')
<script>
	
	function vistaPrevia(id){
		var id = id;
		var tipo = tipo;
		var mensaje = "<div class='row'> \
			<div class='col-xs-12'> \
				<div class='viewports'>\
					<ul class='viewlist' >\
						<li id='liTi' class='480px' style=' title='Vista previa en teléfonos inteligentes'>\
							<i class='fa fa-mobile'></i>\
						</li>\
						<li id='liT' class='800px' style=' title='Vista previa tablets y iPads'>\
							<i class='fa fa-tablet'></i>\
						</li>\
						<li id='liC' class='1280px' style=' title='Vista previa computadoras'>\
							<i class='fa fa-laptop'></i>\
						</li>\
					</ul>\
				</div>\
				<div class='iframe-container'> \
					<iframe id='VistaPreviaIframe' src='#' name='VistaPreviaIframe'></iframe> \
				</div> \
			</div> \
		</div>";
		BootstrapDialog.show({
		title: "Vista previa",
		type: BootstrapDialog.TYPE_PRIMARY,
		size: BootstrapDialog.SIZE_WIDE,
		message: mensaje,
		draggable: true,
		cssClass: "VistaPrevia modal-desktop",
		onshown: function(dialogRefs){
			dialogRefs.getModalBody().find(".iframe-container").isLoading({
                text:       "La vista previa está cargando...",
                position:   "overlay"
			});
			dialogRefs.getModalBody().find('.glyphicon').removeClass("glyphicon-refresh glyphicon-spin").addClass("fa fa-spinner fa-pulse fa-fw i-cargador")
			
			var obj = dialogRefs.getModalBody();
			var iframe = obj.find("#VistaPreviaIframe");
			var doc = obj.find("#VistaPreviaIframe")[0].contentWindow.document;
			doc.open();
			doc.write("");
			doc.close();
			ObtenerComplementosVistaPrevia(id, ruta, obj, null)
			dialogRefs.getModalBody().find("#liC").click(function (){
				$(this).closest(".VistaPrevia").removeClass("modal-movil modal-tablet modal-desktop portrait").addClass("modal-desktop");
				dialogRefs.getModalBody().find("#VistaPreviaIframe").removeAttr("style");
				ObtenerComplementosVistaPrevia(id, ruta, obj, null)
			})
			dialogRefs.getModalBody().find("#liTi").click(function (){
				$(this).closest(".VistaPrevia").removeClass("modal-movil modal-tablet modal-desktop portrait").addClass("modal-movil portrait");
				ObtenerComplementosVistaPrevia(id, ruta, obj, true)
				dialogRefs.getModalBody().find("#VistaPreviaIframe").removeAttr("style");
			})
			dialogRefs.getModalBody().find("#liT").click(function (){
				$(this).closest(".VistaPrevia").removeClass("modal-movil modal-tablet modal-desktop portrait").addClass("modal-tablet portrait");
				dialogRefs.getModalBody().find("#VistaPreviaIframe").css("margin-left","-1%");
				ObtenerComplementosVistaPrevia(id, ruta, obj, true)
			})
		},
		buttons: [{
			id: "btnCerrar",
			label: "Cerrar",
			cssClass: "btn-default",
			action: function(dialogItself){
				dialogItself.close();
			}
		}]
		});
	}
	function ObtenerComplementosVistaPrevia(id, ruta, obj, movil) {
		var id = id;
		var ruta = ruta;
		var tipo = tipo;
		var obj = obj
		var movil = movil;
		$.post(
			ruta,
			{ id: id, mobile:movil, vista:true},
			function(data){
				$(".VistaPrevia").find(".iframe-container").isLoading( "hide" );
				if(data.success){
					var iframe = obj.find("#VistaPreviaIframe");
					var doc = iframe[0].contentWindow.document;
					doc.open();
					doc.write("<!DOCTYPE HTML>"+data.codigoHTML);
					doc.close();
				}
				else{
					if(data.mensaje != ''){ new PNotify({ title: "Error", text: data.mensaje, type: "error" }); }
					$.each(data.errMensajes, function(key, value){ if(value != ''){ $("#err"+key).html(value); } else{ $("#err"+key).html(""); } });
				}
			},
			"json"
		);
	}
</script>
@stop

@section('JSOr')
$(".btn-danger").click(function(e){
	e.preventDefault()
	if(confirm("Esta seguro que desea borrar el tema")){
		$(".frm-eliminar").submit();
	}
});
@stop