Hello, Matheus!
Well, I don’t know if I understand the problem well, but I prepared a script to demonstrate how you can fetch the pending videos from a logged-in user. You can see it with the codes below:
Database:
-- MySQL dump 10.13 Distrib 5.7.29, for Linux (x86_64)
--
-- Host: localhost Database: videos_stackoverflow
-- ------------------------------------------------------
-- Server version 5.7.29-0ubuntu0.18.04.1
/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8 */;
/*!40103 SET @OLD_TIME_ZONE=@@TIME_ZONE */;
/*!40103 SET TIME_ZONE='+00:00' */;
/*!40014 SET @OLD_UNIQUE_CHECKS=@@UNIQUE_CHECKS, UNIQUE_CHECKS=0 */;
/*!40014 SET @OLD_FOREIGN_KEY_CHECKS=@@FOREIGN_KEY_CHECKS, FOREIGN_KEY_CHECKS=0 */;
/*!40101 SET @OLD_SQL_MODE=@@SQL_MODE, SQL_MODE='NO_AUTO_VALUE_ON_ZERO' */;
/*!40111 SET @OLD_SQL_NOTES=@@SQL_NOTES, SQL_NOTES=0 */;
--
-- Table structure for table `videos`
--
DROP TABLE IF EXISTS `videos`;
/*!40101 SET @saved_cs_client = @@character_set_client */;
/*!40101 SET character_set_client = utf8 */;
CREATE TABLE `videos` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`nomecomp` varchar(100) NOT NULL,
`urlvideo` varchar(255) NOT NULL,
`descricao` text,
`pendente` tinyint(1) NOT NULL DEFAULT '1',
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=10 DEFAULT CHARSET=latin1;
/*!40101 SET character_set_client = @saved_cs_client */;
--
-- Dumping data for table `videos`
--
LOCK TABLES `videos` WRITE;
/*!40000 ALTER TABLE `videos` DISABLE KEYS */;
INSERT INTO `videos` VALUES (1,'matheus','https://www.youtube.com/watch?v=8iNczzhZmbc','video 1',0),(2,'matheus','https://www.youtube.com/watch?v=8iNczzhZmbc','video 2',0),(3,'matheus','https://www.youtube.com/watch?v=8iNczzhZmbc','video 3 - PENDENTE',1),(4,'matheus','https://www.youtube.com/watch?v=8iNczzhZmbc','video 4 - PENDENTE',1),(5,'macario','https://www.youtube.com/watch?v=8iNczzhZmbc','video 5',0),(6,'macario','https://www.youtube.com/watch?v=8iNczzhZmbc','video 6 - PENDENTE',1),(7,'macario','https://www.youtube.com/watch?v=8iNczzhZmbc','video 7 - PENDENTE',1),(8,'macario','https://www.youtube.com/watch?v=8iNczzhZmbc','video 8 - PENDENTE',1),(9,'macario','https://www.youtube.com/watch?v=8iNczzhZmbc','video 9 - PENDENTE',1);
/*!40000 ALTER TABLE `videos` ENABLE KEYS */;
UNLOCK TABLES;
/*!40103 SET TIME_ZONE=@OLD_TIME_ZONE */;
/*!40101 SET SQL_MODE=@OLD_SQL_MODE */;
/*!40014 SET FOREIGN_KEY_CHECKS=@OLD_FOREIGN_KEY_CHECKS */;
/*!40014 SET UNIQUE_CHECKS=@OLD_UNIQUE_CHECKS */;
/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
/*!40111 SET SQL_NOTES=@OLD_SQL_NOTES */;
-- Dump completed on 2020-04-13 9:22:05
Index.php
<?php
$servidor = 'localhost';
$usuario = 'root';
$senha = '';
$banco = 'videos_stackoverflow';
$conexao = mysqli_connect($servidor, $usuario, $senha, $banco);
$consulta = "SELECT
*
FROM
videos
WHERE
videos.nomecomp = 'macario'
AND videos.pendente = 1";
$resultados = mysqli_query($conexao, $consulta);
$videos_pendentes = array();
while ($video = mysqli_fetch_assoc($resultados))
$videos_pendentes[] = $video;
mysqli_free_result($resultados);
mysqli_close($conexao);
$videos_pendentes = json_encode($videos_pendentes);
?>
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vídeos Pendentes</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<h1 style="margin-top: 60px;">Listar vídeos pendentes</h1>
<p>Por favor, clique no botão abaixo para listar os vídeos pendentes de um monitor.</p>
<button id="btn-lista-videos-tabela" class="btn btn-primary">Mostrar em tabela</button>
<button id="btn-lista-videos-carousel" class="btn btn-primary">Mostrar em Carousel</button>
</div>
</div>
<div class="row" style="margin-top: 60px;">
<div class="col-md-8 col-md-offset-2">
<table id="tabela-videos" class="table" style="display: none;">
<thead>
<tr>
<th>#</th>
<th>Monitor</th>
<th>URL</th>
<th>Descrição</th>
</tr>
</thead>
<tbody id="tabela-videos-corpo">
<!-- Nada aqui, por enquanto -->
</tbody>
</table>
<div id="carouselExampleIndicators" class="carousel slide" style="display: none;" data-ride="carousel">
<ol id="carousel-indicadores" class="carousel-indicators"></ol>
<div id="carousel-itens" class="carousel-inner"></div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Anterior</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Próximo</span>
</a>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
<script>
$(document).ready(function() {
const videos_pendentes = JSON.parse(<?php echo json_encode($videos_pendentes) ?>);
$('#btn-lista-videos-tabela').click(function() {
let html = '';
if (videos_pendentes.length > 0) {
videos_pendentes.forEach(function(video) {
html += '<tr>';
html += ' <td>' + video.id + '</td>';
html += ' <td>' + video.nomecomp + '</td>';
html += ' <td>' + video.urlvideo + '</td>';
html += ' <td>' + video.descricao + '</td>';
html += '</tr>';
});
$('#tabela-videos-corpo').html( html );
$('#tabela-videos').show();
} else {
alert('Nenhum vídeo pendente');
}
});
$('#btn-lista-videos-carousel').click(function() {
let itens = '';
let indicadores = '';
if (videos_pendentes.length > 0) {
videos_pendentes.forEach(function(video, indice) {
indicadores += '<li data-target="#carouselExampleIndicators" data-slide-to="' + indice + '" class="' + (indice == 0? 'active' : '') + '"></li>'
itens += '<div class="carousel-item ' + (indice == 0? 'active' : '') + '">';
itens += ' <iframe width="700" height="450" src="'+ video.urlvideo +'" frameborder="0" allowfullscreen></iframe>';
itens += '</div>';
});
console.log(indicadores);
$('#carouselExampleIndicators').show();
$('#carousel-indicadores').html( indicadores );
$('#carousel-itens').html( itens );
} else {
alert('Nenhum vídeo pendente');
}
});
$('.carousel').carousel();
});
</script>
</body>
</html>
In summary I created a very simplified database and inserted some records. I put two "nomecomps" as monitors of these videos. The names of these monitors are matheus
and macario
.
Suppose the way to identify the logged in user is by "nomecomp", then when loading the screen that shows the pending videos, you should already have consulted which are these videos, applying the restrictions you want. Finally, you can launch the videos viewed in the database by PHP, in a JS variable, as shown in line 90 of the index.php file.
If you have any questions, comment here.