diff --git a/admin/materi1.html b/admin/materi1.html
new file mode 100644
index 0000000000000000000000000000000000000000..250330274864890e778aa674320b20ca05027218
--- /dev/null
+++ b/admin/materi1.html
@@ -0,0 +1,176 @@
+<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pb-2 mb-3 border-bottom">
+ <h1 class="h2">Materi</h1>
+ <div class="btn-toolbar mb-2 mb-md-0">
+
+ </div>
+</div>
+
+<form action="../addMateri.php" method="POST" id="upload_form" enctype="multipart/form-data">
+ <div class="form-group">
+ <label for="usr">Topik:</label>
+ <div class="radio">
+ <label><input type="radio" name="optradio" value="new">Tambah Baru</label>
+
+ <input type="text" id="new" name="topik" disabled>
+ </div>
+ <div class="radio">
+ <label><input type="radio" name="optradio" value="exist">Pilih dari yang sudah ada</label>
+ <select id="sel1" name="topik" disabled>
+
+ </select>
+ </div>
+ </div>
+ <div class="form-group">
+ <label>Judul: </label>
+ <input type="text" class="form-control" id="judul" name="judul">
+ </div>
+ <div class="form-group">
+ <label for="comment">Konten Materi:</label>
+ <textarea class="form-control" rows="7" id="deskripsi_acara" name="konten" value="" placeholder="Kosongkan bila tidak ada konten materi"></textarea>
+ </div>
+ <div class="form-group">
+ <label><input type="checkbox" value="" id="isVideo">Upload video? </label>
+ <input type="hidden" class="form-control" id="chx-helper" name="isVideo" value="0">
+ <input class="input-file" id="fileInput" type="file" name="videofile" disabled accept="video/*">
+ <diva></diva>
+ </div>
+
+ <div class="form-group">
+ <label><input type="checkbox" value="" id="isPDF">Upload PDF? </label>
+ <input type="hidden" class="form-control" id="chx2-helper" name="isPDF" value="0">
+ <input class="input-file" id="PDFinput" type="file" name="pdffile" disabled accept="application/pdf">
+ </div>
+ <button type="submit" class="btn btn-default">Kirim</button>
+
+</form>
+<div id="progbar" class="d-none">
+ <h6>Uploading ...</h6>
+<div class="progress">
+ <div class="bar progress-bar progress-bar-striped active"></div>
+</div>
+</div>
+
+<script>
+ $.getJSON("../getAllTopik.php",function(data){
+ var select = document.getElementById("sel1");
+ $.each(data, function(){
+ var opt = document.createElement("option");
+ opt.innerHTML = this;
+ select.appendChild(opt);
+ });
+ });
+
+ $('#isVideo').change(function(){
+ if (this.checked) {
+ $("#fileInput").removeAttr("disabled");
+ $("#chx-helper").val(1);
+ } else {
+ $("#fileInput").attr("disabled",true);
+ $("#chx-helper").val(0);
+ }
+ });
+
+ $('#isPDF').change(function(){
+ if (this.checked) {
+ $("#PDFinput").removeAttr("disabled");
+ $("#chx2-helper").val(1);
+ } else {
+ $("#PDFinput").attr("disabled",true);
+ $("#chx2-helper").val(0);
+ }
+ });
+
+ $("input:radio[name=optradio]").on("change",function(){
+ if (this.value == "exist") {
+ $("#sel1").removeAttr("disabled");
+ $("#new").attr("disabled",true);
+ } else {
+ $("#new").removeAttr("disabled");
+ $("#sel1").attr("disabled",true);
+ }
+ });
+
+ var bar = $('.bar');
+
+ $('form').ajaxForm({
+ beforeSend: function() {
+ $('#progbar').removeClass('d-none');
+ $('#upload_form').addClass('d-none');
+ var percentVal = '0%';
+ bar.width(percentVal)
+ },
+ uploadProgress: function(event, position, total, percentComplete) {
+ var percentVal = percentComplete + '%';
+ bar.width(percentVal)
+ },
+ success: function() {
+ var percentVal = '100%';
+ bar.width(percentVal)
+ },
+ complete: function(xhr) {
+ $('#progbar').addClass('d-none');
+ $('#upload_form').removeClass('d-none');
+ alert(xhr.responseText);
+ }
+ });
+ // $("#upload_form").on("submit", function(e){
+ // e.preventDefault();
+ // $.ajax({
+ // url: "../addMateri.php", // Url to which the request is send
+ // type: "POST", // Type of request to be send, called as method
+ // data: new FormData(this), // Data sent to server, a set of key/value pairs (i.e. form fields and values)
+ // contentType: false, // The content type used when sending data to the server.
+ // cache: false, // To unable request pages to be cached
+ // processData:false, // To send DOMDocument or non processed data file it is set to false
+ // success: function(data) // A function to be called if request succeeds
+ // {
+ // // lakukan pemanggilan api notifikasi
+ // alert(data);
+ // }
+ // });
+ // });
+ document.getElementsByTagName('input')[6].addEventListener('change', function(event) {
+ var file = event.target.files[0];
+ var fileReader = new FileReader();
+ fileReader.onload = function() {
+ var blob = new Blob([fileReader.result], {type: file.type});
+ var url = URL.createObjectURL(blob);
+ var video = document.createElement('video');
+ var timeupdate = function() {
+ if (snapImage()) {
+ video.removeEventListener('timeupdate', timeupdate);
+ video.pause();
+ }
+ };
+ video.addEventListener('loadeddata', function() {
+ if (snapImage()) {
+ video.removeEventListener('timeupdate', timeupdate);
+ }
+ });
+ var snapImage = function() {
+ var canvas = document.createElement('canvas');
+ canvas.width = video.videoWidth;
+ canvas.height = video.videoHeight;
+ canvas.getContext('2d').drawImage(video, 0, 0, canvas.width, canvas.height);
+ var image = canvas.toDataURL();
+ var success = image.length > 100000;
+ if (success) {
+ var img = document.createElement('img');
+ img.src = image;
+ document.getElementsByTagName('diva')[0].appendChild(img);
+ URL.revokeObjectURL(url);
+ }
+ return success;
+ };
+ video.addEventListener('timeupdate', timeupdate);
+ video.preload = 'metadata';
+ video.src = url;
+ // Load video in Safari / IE11
+ video.muted = true;
+ video.playsInline = true;
+ video.play();
+ };
+ fileReader.readAsArrayBuffer(file);
+ });
+
+</script>
\ No newline at end of file