<!DOCTYPE html>
<html lang="en" style="scroll-behavior:smooth !important;">

<head>

    <meta charset="UTF-8">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no" name="viewport">
    <title>Tambah Data Materi - Del Mobile Application </title>
    <!-- General CSS Files -->
    <link rel="icon" href="<?=base_url('assets/')?>img/favicon.png" type="image/png">
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@500;700;900&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Poppins:500,600,700&display=swap" rel="stylesheet">
    <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">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
        integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.css">
    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.20/css/dataTables.bootstrap4.min.css">
    <!-- Template CSS -->
    <link rel="stylesheet" href="<?=base_url('assets/')?>stisla-assets/css/style.css">
    <link rel="stylesheet" href="<?=base_url('assets/')?>stisla-assets/css/components.css">

</head>

<body>


    <!-- Start Sidebar -->
    <div id="app">
        <div class="main-wrapper">
            <div class="navbar-bg"></div>
            <nav class="navbar navbar-expand-lg main-navbar">
                <form class="form-inline mr-auto">
                    <ul class=" navbar-nav mr-3">
                        <li><a href="#" data-toggle="sidebar" class="nav-link nav-link-lg"><i
                                    class="fas fa-bars"></i></a>
                        </li>
                    </ul>
                </form>
                <ul class="navbar-nav navbar-right">
                    <li class="dropdown"><a href="#" data-toggle="dropdown"
                            class="nav-link dropdown-toggle nav-link-lg nav-link-user">
                            <img alt="image" style="margin-bottom:4px !important;"
                                src="../assets/stisla-assets/img/avatar/avatar-2.png"
                                class="rounded-circle mr-1 my-auto">
                            <div class="d-sm-none d-lg-inline-block" style="font-size:15px;">Hello, <?php
$data['user'] = $this->db->get_where('admin', ['email' =>
    $this->session->userdata('email')])->row_array();
echo $data['user']['username'];
?></div>
                        </a>
                        <div class="dropdown-menu dropdown-menu-right">
                            <div class="dropdown-title">Admin - Del Mobile Application</div>
                            <a href="<?=base_url('welcome/logout')?>" class="dropdown-item has-icon text-danger">
                                <i class="fas fa-sign-out-alt"></i> Logout
                            </a>
                        </div>
                    </li>
                </ul>
            </nav>
            <div class="main-sidebar">
                <aside id="sidebar-wrapper">
                    <div class="sidebar-brand text-danger">
                    <div>
                            <a href="<?=base_url('admin')?>"><img
                            src="<?=base_url('assets/')?>img/logo3.png" alt=""></a>
                        </div>
                    </div>
                    <div class="sidebar-brand sidebar-brand-sm">
                        <a href="<?=base_url('admin')?>">LY</a>
                    </div>
                    <ul class="sidebar-menu">
                        <li class="menu-header ">Dashboard</li>
                        <li class="nav-item dropdown ">
                            <a href="<?=base_url('admin')?>" class="nav-link"><i
                                    class="fas fa-desktop"></i><span>Dashboard</span></a>
                        </li>
                        <li class="menu-header">Management Siswa</li>
                        <li class="nav-item dropdown ">
                            <a href="#" class="nav-link has-dropdown" data-toggle="dropdown"><i class="fas fa-user"></i>
                                <span>Siswa</span></a>
                            <ul class="dropdown-menu">
                                <li><a class="nav-link" href="<?=base_url('admin/data_siswa')?>">Data Siswa</a></li>
                            </ul>
                        </li>
                        <li class="menu-header">Management Pengajar</li>
                        <li class="nav-item dropdown">
                            <a href="#" class="nav-link has-dropdown"><i class="fas fa-chalkboard-teacher"></i>
                                <span>Pengajar</span></a>
                            <ul class="dropdown-menu">
                                <li><a class="nav-link" href="<?=base_url('admin/data_pengajar')?>">Data Pengajar</a>
                                </li>
                                <li><a class="nav-link" href="<?=base_url('admin/add_pengajar')?>">Tambah Data Pengajar</a>
                                </li>

                            </ul>
                        </li>
                        <li class="menu-header">Management Materi</li>
                        <li class="nav-item dropdown active">
                            <a href="#" class="nav-link has-dropdown"><i class="fas fa-book"></i>
                                <span>Materi</span></a>
                            <ul class="dropdown-menu">
                                <li><a class="nav-link" href="<?=base_url('admin/data_materi')?>">Data Materi</a>
                                </li>
                                <li><a class="nav-link" href="<?=base_url('admin/tambah_materi')?>">Tambah Materi</a>
                                </li>

                            </ul>
                        </li>
                        <li class="menu-header">About Developer</li>
                        <li class="nav-item dropdown">
                            <a href="#" class="nav-link has-dropdown"><i class="fas fa-address-card"></i>
                                <span>Developer</span></a>
                            <ul class="dropdown-menu">
                                <li><a class="nav-link" href="<?=base_url('admin/about_developer')?>">Tentang
                                        Pembuat</a>
                                </li>
                                <li><a class="nav-link" href="<?=base_url('admin/about_learnify')?>">Tentang
                                Del Mobile Application</a>
                                </li>
                            </ul>
                        </li>
                </aside>
            </div>
            <!-- End Sidebar -->


            <!-- Main Content -->
            <div class="main-content">
                <section class="section">
                    <div class="">
                        <div class="card" style="width:100%;">
                            <div class="card-body">
                                <h2 class="card-title" style="color: black;">Tambah Data Materi</h2>
                                <hr>
                                <p class="card-text"> Penambahan data materi dapat dilakukan oleh admin dan pengajar yang
                                    bersangkutan. Silahkan isi data data yang diperlukan dibawah, selamat bekerja!
                                </p>
                                <a href="#detail" class="btn btn-primary">Saya paham dan
                                    ingin melanjutkan</a>
                            </div>
                        </div>
                        <div class="card card-success">
                            <div class="col-md-12 text-center">
                                <p class="registration-title font-weight-bold display-4 mt-4"
                                    style="color:black; font-size: 50px;">
                                    Tambah Materi</p>
                                <p style="line-height:-30px;margin-top:-20px;">Silahkan isi data data yang diperlukan
                                    dibawah </p>
                                <hr>
                            </div>
                            <div id="detail" class="card-body">
                                <form method="POST" enctype="multipart/form-data"
                                    action="<?=base_url('admin/tambah_materi')?>">
                                    <div class="col-md-12 bg-white"
                                        style="border-radius:3px;box-shadow:rgba(0, 0, 0, 0.03) 0px 4px 8px 0px">
                                        <form method="post" enctype="multipart/form-data"
                                            action="<?=base_url('pengajar/add_materi')?>">
                                            <input type="hidden" name="id">
                                            <div class="form-row">
                                                <div class="form-group col-md-12">
                                                    <label for="inputEmail4">Nama Pengajar</label>
                                                    <input autocomplete="off" required type="text" list="nama_pengajar"
                                                        onkeyup="autofill()" id="namapengajar" name="nama_pengajar"
                                                        class="form-control">
                                                    <small>List pengajar sudah tersedia di autocomplete, kalian hanya
                                                        tinggal klik input area nya atau dengan cara menulis namanya dan
                                                        klik pengajar yang akan dipilih.</small>
                                                    <datalist id=nama_pengajar>
                                                        <?php
include "koneksi.php";
$qry = mysqli_query($koneksi, "SELECT nama_pengajar From pengajar");
while ($t = mysqli_fetch_array($qry)) {
    echo "<option value='$t[nama_pengajar]'>";
}
?>
                                                    </datalist>
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="exampleFormControlInput1">Nama Mata Pelajaran</label>
                                                <input type="text" class="form-control" name="nama_mapel"
                                                    id="nama_mapel" required
                                                    placeholder="Pilih nama pengajar yang valid agar nama mapel muncul"
                                                    >
                                                <small>Jika nama mapel sudah berganti artinya nama pengajar yang kamu
                                                    masukan di input area adalah valid! jika tidak muncul nama mapel
                                                    anda harus klik input area nama pengajar dan pilih pengajar yang tersedia
                                                    disana.</small>
                                            </div>
                                            <div class="form-group">
                                                <label for="exampleFormControlTextarea1">Link Youtube</label>
                                                <textarea class="form-control" required name="deskripsi"
                                                    id="exampleFormControlTextarea1" rows="3"></textarea>
                                            </div>
                                            <div class="form-group">
                                                <label for="exampleFormControlTextarea1">Deskripsi Materi</label>
                                                <textarea class="form-control" required name="deskripsi"
                                                    id="exampleFormControlTextarea1" rows="3"></textarea>
                                            </div>
                                            <div class="form-group">
                                                <label for="inputState">Kelas</label>
                                                <select required id="inputState" name="kelas" class="form-control">
                                                    <option selected>Pilih disini</option>
                                                    <option value="X">Pemula</option>
                                                    <option value="XI">Pro</option>
                                                </select>
                                            </div>
                                            <button type="submit" class="btn btn-block btn-success">Tambah
                                                materi</button>
                                    </div>
                                </form>
                            </div>
                        </div>
                        <br>
                    </div>
                </section>
            </div>
        </div>
        <!-- End Main Content -->


        <!-- Start Footer -->
        <footer class="main-footer">
            <div class="footer-left">
                Copyright &copy; 2020 <div class="bullet"></div> Code & Design by <a
                    href="https://syauqizaidan.github.io/">Team</a>
            </div>
            <div class="footer-right">
                Made with <span class="text-danger"> &#10084;</span> by Team
            </div>
        </footer>
        <!-- End Footer -->


        <!-- General JS Scripts -->
        <script src="https://code.jquery.com/jquery-3.3.1.min.js"
            integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
        <script>
        function autofill() {
            var nama_pengajar = $("#namapengajar").val();
            $.ajax({
                url: '../autofill.php',
                data: "nama_pengajar=" + nama_pengajar,
            }).done(function(data) {
                var json = data,
                    obj = JSON.parse(json);
                $('#nama_mapel').val(obj.nama_mapel);
            });
        }
        </script>
        <script>
        $('.custom-file-input').on('change', function() {
            let fileName = $(this).val().split('\\').pop();
            $(this).next('.custom-file-label').addClass("selected").html(fileName);
        });
        </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="https://cdnjs.cloudflare.com/ajax/libs/jquery.nicescroll/3.7.6/jquery.nicescroll.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
        <script src="<?=base_url('assets/')?>stisla-assets/js/stisla.js"></script>
        <!-- JS Libraies -->
        <script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
        <script src="https://cdn.datatables.net/1.10.20/js/dataTables.bootstrap4.min.js"></script>
        <script>
        $(document).ready(function() {
            $('#example').DataTable();
        });
        </script>
        <!-- Template JS File -->
        <script src="<?=base_url('assets/')?>stisla-assets/js/scripts.js"></script>
        <script src="<?=base_url('assets/')?>stisla-assets/js/custom.js"></script>
        <!-- Page Specific JS File -->
</body>

</html>