
<?php
require ('../../connect.php');
session_start();
$type=$_SESSION['title'];
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<style>

 td {
      font-size: 20px;
    }
    .status-active {
      color: green;
    }

    .status-inactive {
      color: red;
    }
/* Table Styles */
table {
  border-collapse: collapse;
  width: 100%;
}

th, td {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

th {
  background-color: deeppink; /* Deep Pink Background for Table Header */
  color: white; /* White Text Color for Table Header */
}

/* Status Styles */
.status-active {
  color: green;
}

.status-inactive {
  color: red;
}

/* Button Styles */
.btn {
  padding: 8px 12px;
  background-color: gray;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  text-decoration: none;
  float:right;
  transition: background-color 0.3s;
}

.btn-danger {
  background-color: red;
}

.btn:hover {
  background-color:black;
}

.btn-icon {
  margin-right: 5px;
}

/* Card Styles */
.card {
  background-color: white;
  border: 1px solid #ccc;
  border-radius: 5px;
  margin: 20px auto;
  padding: 20px;
  max-width: 800px; /* Adjust as needed */
}

.card-header {
  margin-bottom: 20px;
}

.card-title {
  font-size: 24px;
  margin: 0;
  color: deeppink; /* Deep Pink Color for Card Title */
}

.card-body {
  padding: 0;
}

</style>

</head>
<body>
<script>
		function add(){
			var rightcontent=$("#rightcontent").hide();

		 $.ajax({
		type:"POST",
		 url:"professional_singer/music/songs_add.php",
		success:function(data){
			$("#centerconteid").css("marginLeft", "450px");
               
               $("#centerconteid").html(data);
		}
		}) 
	}
</script>
<div  class="card card-pink">
              <div class="card-header">
                <h3 class="card-title"><font size="5"><b>SONGS LIST</b></font></h3>
			<a onclick="add()" style="float: right;color:white" data-toggle="modal" class="btn btn-dark"><b> Add New Song</b></a>
			
				
              </div>
			  
              <!-- /.card-header -->
              <div class="card-body">
			  
                <table id="example1" class="table table-bordered table-striped">
                  <thead>
                  <tr>
                    <th>S.No</th>
					<th>Song Name</th>
					
					<th>Action</th>
                  </tr>
                  </thead>
                   <tbody font size="5">
<?php


          $sql = $con->query("SELECT id ,title FROM song_master where singer_type='$type' ORDER BY title");

//$sql = $con->query($sql_query);
$cnt=1;
 while($empdetails = $sql->fetch(PDO::FETCH_ASSOC))
{
	
?>

<tr>
<td><?php echo $cnt;?></td>

<td><?php echo $empdetails['title'];?></td>


<td style="display:flex;justify-content:center;gap:20px;">
	<button class="btn btn-light btn-sm" 
			data-id="<?php echo $empdetails['id']; ?>" 
			onclick="songs_view(<?php echo $empdetails['id']; ?>)" style="background-color:blue;">&nbsp;&nbsp;
			
			<i class="fa fa-eye"></i>

	</button>

	

	
<button class="btn btn-success btn-sm" data-id="<?php echo $empdetails['id']; ?>" onclick="songs_edit(<?php echo $empdetails['id']; ?>)" style="background-color:green;">&nbsp;&nbsp;<i class="fa fa-edit btn-icon"></i>&nbsp;Edit</button>


              <button class="btn btn-danger btn-sm" data-id="<?php echo $empdetails['id']; ?>" onclick="songs_delete(<?php echo $empdetails['id']; ?>)"style="background-color:red;">&nbsp;&nbsp;<i class="fa fa-trash btn-icon"></i>&nbsp;Delete</button>
</td>

</tr>
<?php 
$cnt=$cnt+1;
 }?></tbody>          

 
                </table>
				
              </div>
              <!-- /.card-body -->
            </div>


<div class="footerlabeel" style="display:flex;justify-content:space-between;margin-top:600px;">
    <label class="lableoffooter" style="font-size:18px;">©&nbspAll&nbsprights&nbspreserved&nbsp@2024</label><br>
    <label class="lableoffooter" style="font-size:18px;">Developed&nbspand&nbspMaintained&nbspby&nbspBluebase&nbspSoftware&nbspServices&nbspPrivate&nbspLimited</label>
</div>
<br><br>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script>
  $(document).ready(function(){
	
    $('#example1').DataTable({
      "paging": true,
      "lengthChange": true,
      "searching": true,
      "ordering": true,
      "info": true,
      "autoWidth": true,
      "responsive": true,
	  "lengthMenu": [
        [25, 50, 100, 200, 500, 1000, -1],
        [25, 50, 100, 200, 500, 1000, "All"]
    ],
    });
  });
  function songs_edit(v){
	//alert(v);
	var rightcontent=$("#rightcontent").hide();

	$.ajax({
	type:"POST",
	url:"professional_singer/music/songs_edit.php?id="+v,
	
	success:function(data)
	{
		$("#centerconteid").css("marginLeft", "450px");
               
               $("#centerconteid").html(data);
	}
	})
}

  function songs_view(v){
	//alert(v);
	var rightcontent=$("#rightcontent").hide();

	$.ajax({
	type:"POST",
	url:"professional_singer/music/songs_view_show.php?id="+v,
	success:function(data)
	{
		$("#centerconteid").css("marginLeft", "450px");
               
               $("#centerconteid").html(data);
	}
	})
}

	
		function songs_delete(v){
	//alert(v);
	$.ajax({
	type:"POST",
	url:"professional_singer/music/songs_delete.php?id="+v,
	
	success:function(data)
	{
		if(data==1)
      { 
        alert('Not');
      
      }
     else
      {
        Songs()
		alert("Songs deleted Successfully");
		
      }
      
	}
	})
}
</script>
</body>
</html>
