<?php
	require_once("canales.php");

?>
<script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>


<script>
	$(document).ready(function() {
	$('[data-toggle="tooltip"]').tooltip();
	});
</script>
<style>
	.tooltip-inner {
	background-color: #9E2A2A !important;
	/*!important is not necessary if you place custom.css at the end of your css calls. For the purpose of this demo, it seems to be required in SO snippet*/
	color: #fff;
	padding-top:5px;
	padding-bottom:5px;
	}

	.tooltip.top .tooltip-arrow {
	border-top-color: #9E2A2A;
	}

	.tooltip.right .tooltip-arrow {
	border-right-color: #9E2A2A;
	}

	.tooltip.bottom .tooltip-arrow {
	border-bottom-color: #9E2A2A;
	}

	.tooltip.left .tooltip-arrow {
	border-left-color: #9E2A2A;
	}
	/*----------- CAJA ----------- */
	.caja {
	font-family: Century Gothic,CenturyGothic,AppleGothic,sans-serif;
	color: #ffffff;
	font-size: 25px;
	font-weight: 400;
	text-align: center;
	background: #889ccf;
	margin: 0 0 25px;
	overflow: hidden;
	padding: 10px;
	border-radius: 25px 0px 25px 0px;
	-moz-border-radius: 25px 0px 25px 0px;
	-webkit-border-radius: 25px 0px 25px 0px;
	border: 2px solid #5878ca;}
</style>

<div class="main-panel">
	<div class="main-content">
		<div class="content-header">Sistema de administracion</div>
		<p>
			<div class="content-wrapper"><!-- Wizard Starts -->
				<div class="row">
					<div class="col-sm-12">
						<div class="form form-horizontal">
							<form role="form" method="post" action="tienecanal.php">
								<div class="form-group">
									<label>Nombre Canal</label>
									<input type="text" name="canalnew" class="form-control" value="<?php echo $nombrenuevo; ?>">
								</div>
								<div class="form-group">
									<label>Contraseña Canal</label>
									<input type="text" name="contraseñanew" class="form-control" placeholder="Contraseña Canal">
									<span class="help-block">!!! SOLO COMPLETAR CAMPO CONTRASEÑA SI DESEA CAMBIARLA!!!!</span>
									<small>Completa la contraseña si deseas cambiarla</small>
								</div>
								<div class="box-footer">
									<button href="" type="submit" name="editarcanal" class="btn btn-danger" style="width:100%;height:50px;padding-top:10px;font-size:17px;margin-bottom:15px;">Editar!</button>
								</div>
							</form>
						</div>
						<div class="col-xl-8 col-lg-12 col-12">
							<div class="card">
								<div class="card-header pb-2">
									<center><h4 class="card-title">Clientes Conectados</h4></center>
								</div>
								<div class="card-content">
									<?php
										foreach($clientescanal as $clientes){
										?>
										<div class="col-md-12"  style="paddint-top:10px;padding-bottom:10px">
											<div class="col-md-4 caja">
												<h4><?php echo $clientes["client_nickname"]; ?></h4>
												<h4><?php echo $clientes["client_database_id"]; ?></h4>
												<a id="iddelboton" style="margin-left: 20px;" class="btn btn-danger btn-sm" data-toggle="tooltip" data-placement="top" title="Expulsar"><i class="fas fa-ban"></i></a>
												<span class="btn btn-danger btn-sm" href="darcadmin.php?id=<?php echo $clientes ?>" data-toggle="tooltip" data-placement="top" title="Agregar / Remover Administrador"><i class="fas fa-cogs"></i></span>

											</div>
										</div>
									<?php } ?>
								</div>
							</div>
						</div>
						<script src="assets/vendors/js/core/jquery-3.2.1.min.js" type="text/javascript"></script>
						<script>

							$('#iddelboton').on('click',function() {
								var id = '<?php echo $clientes["client_database_id"]; ?>';
								$.get( "expulsar.php?id="+id, function( data ) {
									alert('get enviado');
								});

							</script>