commit inicial

phsm99 · Nov 21, 2019 · d0a7d28 · d0a7d28
commit d0a7d28
Show file tree

Hide file tree

Showing 8 changed files with 466 additions and 0 deletions.
diff --git a/cantor.html b/cantor.html
@@ -0,0 +1,63 @@
+<!doctype html>
+<html>
+
+<head>
+    <!-- Required meta tags -->
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+
+    <!-- Bootstrap CSS -->
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
+        integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
+
+    <title>Ajax Puro</title>
+</head>
+
+<body>
+    <div class="container">
+
+        <nav class="navbar navbar-expand-lg navbar-light bg-light">
+            <a class="navbar-brand" href="#">MÚSICAS</a>
+            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#conteudoNavbarSuportado"
+                aria-controls="conteudoNavbarSuportado" aria-expanded="false" aria-label="Alterna navegação">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+
+            <div class="collapse navbar-collapse" id="conteudoNavbarSuportado">
+                <ul class="navbar-nav mr-auto">
+                    <li class="nav-item ">
+                        <a class="nav-link" href="./index.html">Página Principal <span class="sr-only">(página atual)</span></a>
+                    </li>
+                    <li class="nav-item active" style="font-weight: bold;">
+                        <a class="nav-link" href="#">Cantor</a>
+                    </li>
+                    <li class="nav-item ">
+                        <a class="nav-link" href="./genero.html">Gênero</a>
+                    </li>
+
+                </ul>
+            </div>
+        </nav>
+
+        <button type="button" class="btn btn-dark">Criar Nova Música</button>
+        <hr>
+        <div id="listaMusicas" class="row">
+
+
+        </div>
+    </div>
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
+    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
+        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
+        crossorigin="anonymous"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
+        integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
+        crossorigin="anonymous"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
+        integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
+        crossorigin="anonymous"></script>
+
+    <script src="main.js"></script>
+</body>
+
+</html>
diff --git a/cd_cover.png b/cd_cover.png
diff --git a/config.php b/config.php
@@ -0,0 +1,9 @@
+<?php
+$servidor = "localhost";
+$usuario = "root";
+$senha = "";
+$banco = "aula_php";
+
+$conexao = mysqli_connect($servidor,$usuario,$senha,$banco);
+mysqli_set_charset($conexao,"utf8");
+?>
diff --git a/genero.html b/genero.html
@@ -0,0 +1,95 @@
+<!doctype html>
+<html>
+
+<head>
+    <!-- Required meta tags -->
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+
+    <!-- Bootstrap CSS -->
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
+        integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
+
+    <title>Ajax Puro</title>
+</head>
+
+<body>
+    <div class="container">
+
+        <nav class="navbar navbar-expand-lg navbar-light bg-light">
+            <a class="navbar-brand" href="#">MÚSICAS</a>
+            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#conteudoNavbarSuportado"
+                aria-controls="conteudoNavbarSuportado" aria-expanded="false" aria-label="Alterna navegação">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+
+            <div class="collapse navbar-collapse" id="conteudoNavbarSuportado">
+                <ul class="navbar-nav mr-auto">
+                    <li class="nav-item ">
+                        <a class="nav-link" href="./index.html">Página Principal <span class="sr-only">(página
+                                atual)</span></a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link" href="./cantor.html">Cantor</a>
+                    </li>
+                    <li class="nav-item active" style="font-weight: bold;">
+                        <a class="nav-link" href="#">Gênero</a>
+                    </li>
+
+                </ul>
+            </div>
+        </nav>
+
+        <button type="button" class="btn btn-dark">Criar Novo Gênero</button>
+        <hr>
+        <div id="listaGeneros">
+
+        </div>
+
+    </div>
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
+    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
+        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
+        crossorigin="anonymous"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
+        integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
+        crossorigin="anonymous"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
+        integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
+        crossorigin="anonymous"></script>
+
+    <script src="main.js"></script>
+
+    <script>
+        var xhr = new XMLHttpRequest();
+        xhr.onreadystatechange = function () {
+            if (xhr.readyState === 4) {
+                var dado = JSON.parse(xhr.responseText);
+                var conteudoHTML = `<table class="table">`;
+                conteudoHTML += `       <thead>`;
+                conteudoHTML += `           <tr>`;
+                conteudoHTML += `               <th scope="col">Id</th>`;
+                conteudoHTML += `               <th scope="col">Nome</th>`;
+                conteudoHTML += `               <th scope="col"></th>`;
+                conteudoHTML += `           </tr>`;
+                conteudoHTML += `       </thead>`;
+                conteudoHTML += `       <tbody>`;
+                for (var i = 0; i < dado.length; i++) {
+                    conteudoHTML += item_genero(dado[i].Id, dado[i].Nome);
+                }
+                conteudoHTML += `       </tbody>`;
+                conteudoHTML += `</table>`;
+
+                console.log(conteudoHTML);
+
+                document.getElementById('listaGeneros').innerHTML = conteudoHTML;
+            }
+        };
+
+        xhr.open('GET', 'genero.php?acao=listar_generos');
+        xhr.send();
+
+    </script>
+</body>
+
+</html>
diff --git a/genero.php b/genero.php
@@ -0,0 +1,58 @@
+<?php
+
+if (!empty($_GET['acao'])) {
+    $acao = $_GET['acao'];
+
+    //criar conexao com banco
+    include('config.php');
+
+    //listar genero
+    if ($acao == "listar_generos") {
+        $sql_genero = "SELECT * from genero order by 1;";
+
+        $query_genero = mysqli_query($conexao, $sql_genero);
+
+        if ($query_genero) {
+            $genero = [];
+            while ($dados = mysqli_fetch_array($query_genero)) {
+                $id = $dados['Id'];
+                $nome = $dados['Nome'];
+                array_push($genero, ['Id' => $id, 'Nome' => $nome]);
+            }
+
+            echo json_encode($genero);
+        } else {
+            echo 0;
+        }
+    } else if ($acao == "inserir_genero") {
+
+        $nome = $dados['nome'];
+        $preco = $dados['preco'];
+        $descricao = $dados['descricao'];
+        $url_img = $dados['url_img'];
+
+        $sql_inserir = "INSERT INTO genero (nome,url_img,preco,descricao,id_cat)"
+            . "values($nome,$url_img,$preco,$descricao,1)";
+        $query_inserir = mysqli_query($conexao, $sql_inserir);
+        if ($query_inserir) { } else {
+            echo 0;
+        }
+    } else if ($acao == "excluir_generos") {
+        if (!empty($_GET['id'])) {
+            $id_apagar = $_GET['id'];
+            $sql_excluir = "DELETE FROM genero WHERE id=" . $id_apagar . ";";
+            $query_apagar = mysqli_query($conexao, $sql_excluir);
+            if ($query_apagar) {
+                echo 1;
+            } else {
+                echo 0;
+            }
+        } else {
+            echo 0;
+        }
+    } else {
+        echo 0;
+    }
+} else {
+    echo 0;
+}
diff --git a/index.html b/index.html
@@ -0,0 +1,85 @@
+<!doctype html>
+<html>
+
+<head>
+    <!-- Required meta tags -->
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+
+    <!-- Bootstrap CSS -->
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
+        integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
+
+    <title>Ajax Puro</title>
+</head>
+
+<body>
+    <div class="container">
+
+        <nav class="navbar navbar-expand-lg navbar-light bg-light">
+            <a class="navbar-brand" href="#">MÚSICAS</a>
+            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#conteudoNavbarSuportado"
+                aria-controls="conteudoNavbarSuportado" aria-expanded="false" aria-label="Alterna navegação">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+
+            <div class="collapse navbar-collapse" id="conteudoNavbarSuportado">
+                <ul class="navbar-nav mr-auto">
+                    <li class="nav-item active" style="font-weight: bold;">
+                        <a class="nav-link" href="#">Página Principal <span class="sr-only">(página atual)</span></a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link" href="./cantor.html">Cantor</a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link" href="./genero.html">Gênero</a>
+                    </li>
+
+                </ul>
+            </div>
+        </nav>
+
+        <button type="button" class="btn btn-dark">Criar Nova Música</button>
+        <hr>
+        <div id="listaMusicas" class="row">
+
+
+        </div>
+    </div>
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
+    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
+        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
+        crossorigin="anonymous"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
+        integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
+        crossorigin="anonymous"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
+        integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
+        crossorigin="anonymous"></script>
+
+    <script src="main.js"></script>
+
+
+    <script>
+        var xhr = new XMLHttpRequest();
+        xhr.onreadystatechange = function () {
+            if (xhr.readyState === 4) {
+                var dado = JSON.parse(xhr.responseText);
+                var conteudoHTML = '';
+                for (var i = 0; i < dado.length; i++) {
+                    conteudoHTML += item_musica(dado[i].Id, dado[i].Nome, dado[i].DataLancamento, dado[i].Duracao, dado[i].Cantor, dado[i].Genero, dado[i].FotoDeCapa);
+                }
+
+
+                document.getElementById('listaMusicas').innerHTML = conteudoHTML;
+            }
+        };
+
+        xhr.open('GET', 'musica.php?acao=listar_musicas');
+        xhr.send();
+
+    </script>
+
+</body>
+
+</html>