diff --git a/app/views/admin/create/video/index.php b/app/views/admin/create/video/index.php index 7bc18a8bb99f84c2f9977df7855d205677275d7d..2058a23bf85f69f9fb013846eba43f56e0b710a5 100644 --- a/app/views/admin/create/video/index.php +++ b/app/views/admin/create/video/index.php @@ -14,29 +14,36 @@ $video = '/public/video/default.mp4'; <input type="hidden" name="user_id" value="<?= $_SESSION['user_id'] ?>"> <div class="text-input-container"> <label for="videoName" class="text-reg text-black text-xs">Video name</label> - <input id="name-input" type="text" name="videoName" placeholder="Video name" class="font-reg text-black text-sm" autocomplete="false" required> + <input id="name-input" type="text" name="videoName" placeholder="Video name" class="font-reg text-black text-sm" + autocomplete="false" required> <p id="video-error"></p> <label for="description" class="text-reg text-black text-xs">Description</label> - <input id="desc-input" type="text" name="description" placeholder="Description" class="font-reg text-black text-sm" autocomplete="false"> - - <label for="videoUrl" class="text-reg text-black text-xs">URL</label> + <input id="desc-input" type="text" name="description" placeholder="Description" + class="font-reg text-black text-sm" autocomplete="false"> + + <label for="videoUrl" class="text-reg text-black text-xs">File</label> <input type="hidden" id="new-video" name="new-video" value="<?php echo $video; ?>"> - <div class="button-container"> - <button class="font-reg text-sm primary-blue-button"> + <div class="language-picture-container"> + <p id="video-path">default.mp4</p> + <input type="hidden" id="new-language-pic" name="new-language-pic" value="<?php echo $video; ?>"> + <div class="button-container"> <input type="file" id="upload-input" accept="video/*"> - Change video - </button> - <button class="font-reg text-sm secondary-blue-button" id="delete-btn">Delete video</button> + <label for="upload-input" class="primary-blue-button font-reg text-sm">Change video</label> + <button class="font-reg text-sm secondary-blue-button" id="delete-btn">Delete video</button> + </div> </div> <label for="order" class="text-reg text-black text-xs">Order</label> - <input id="order-input" type="number" name="order" placeholder="Video order" class="font-reg text-black text-sm" autocomplete="false" required> + <input id="order-input" type="number" name="order" placeholder="Video order" class="font-reg text-black text-sm" + autocomplete="false" required> <p id="order-error"></p> </div> <div class="bottom-button-container"> - <a href="/admin/manage/<?= $data["languageId"] . "/" . $data["moduleId"] ?>" class="secondary-orange-button font-reg text-sm">Back</a> - <button id="create-btn" type="submit" class="primary-orange-button font-reg text-sm disable" onchange="checkVideo(), checkOrder()" disabled>Create</button> + <a href="/admin/manage/<?= $data["languageId"] . "/" . $data["moduleId"] ?>" + class="secondary-orange-button font-reg text-sm">Back</a> + <button id="create-btn" type="submit" class="primary-orange-button font-reg text-sm disable" + onchange="checkVideo(), checkOrder()" disabled>Create</button> </div> </form> </div> diff --git a/app/views/admin/edit/video/index.php b/app/views/admin/edit/video/index.php index 204f6a14f3c6865fdc6b5d9feb9c602031f50251..20d9dad3b354b5946eda440fb98faf3b5466474b 100644 --- a/app/views/admin/edit/video/index.php +++ b/app/views/admin/edit/video/index.php @@ -1,5 +1,6 @@ <?php $video = $data["video"]["video_url"]; +$parse_video = explode("/", $video); ?> <div class="create"> @@ -38,15 +39,16 @@ $video = $data["video"]["video_url"]; <p id="video-error"></p> <label for="description" class="text-reg text-black text-xs">Description</label> <input id="desc-input" type="text" name="description" placeholder="Description" class="font-reg text-black text-sm" autocomplete="false" value="<?= $data["video"]["video_desc"] ?>"> - <label for="videoUrl" class="text-reg text-black text-xs">URL</label> - + <label for="videoUrl" class="text-reg text-black text-xs">File</label> <input type="hidden" id="new-video" name="new-video" value="<?php echo $video; ?>"> - <div class="button-container"> - <button class="font-reg text-sm primary-blue-button"> + <div class="language-picture-container"> + <p id="video-path"><?= end($parse_video); ?></p> + <input type="hidden" id="new-language-pic" name="new-language-pic" value="<?php echo $video; ?>"> + <div class="button-container"> <input type="file" id="upload-input" accept="video/*"> - Change video - </button> - <button class="font-reg text-sm secondary-blue-button" id="delete-btn">Delete video</button> + <label for="upload-input" class="primary-blue-button font-reg text-sm">Change video</label> + <button class="font-reg text-sm secondary-blue-button" id="delete-btn">Delete video</button> + </div> </div> <label for="order" class="text-reg text-black text-xs">Order</label> diff --git a/public/css/create.css b/public/css/create.css index f45cee2acbb7911300ac3bc19268aecdd2d5c7cb..372857cbb2890eb5436ca17e2c85f78b2a3a5178 100644 --- a/public/css/create.css +++ b/public/css/create.css @@ -15,7 +15,7 @@ .create .input-container .language-picture-container { width: 100%; - max-width: 400px; + max-width: 1000px; display: flex; gap: 50px; align-items: center; @@ -64,6 +64,15 @@ justify-content: center; } +.video-image-container { + width: 100%; + max-width: 400px; + display: flex; + gap: 50px; + align-items: center; + justify-content: center; +} + /* Input container */ .create form { diff --git a/public/js/create-video.js b/public/js/create-video.js index e8af18db1cf2ee10bfeac0b81191e32009786201..206a4675c683e001dcaee41057f42988a867e9e8 100644 --- a/public/js/create-video.js +++ b/public/js/create-video.js @@ -68,6 +68,7 @@ document.getElementById('upload-input').addEventListener('change', function (eve const reader = new FileReader(); reader.onload = function (e) { + document.getElementById('video-path').innerHTML = file.name; saveVideoToRepository(file); }; @@ -80,6 +81,7 @@ document.getElementById('delete-btn').addEventListener('click', function (event) uploadInput.value = ''; const newVideoInput = document.getElementById('new-video'); newVideoInput.value = '/public/video/default.mp4'; + document.getElementById('video-path').innerHTML = 'default.mp4'; }); function saveVideoToRepository(videoFile) { diff --git a/public/js/edit-video.js b/public/js/edit-video.js index a8c70bf040c7a1b82dc92fae69ac4df91e045326..012daa47ebf33356718722e0a8aa7c203120434d 100644 --- a/public/js/edit-video.js +++ b/public/js/edit-video.js @@ -68,6 +68,7 @@ document.getElementById('upload-input').addEventListener('change', function (eve const reader = new FileReader(); reader.onload = function (e) { + document.getElementById('video-path').innerHTML = file.name; saveVideoToRepository(file); }; @@ -80,6 +81,7 @@ document.getElementById('delete-btn').addEventListener('click', function (event) uploadInput.value = ''; const newVideoInput = document.getElementById('new-video'); newVideoInput.value = '/public/video/default.mp4'; + document.getElementById('video-path').innerHTML = 'default.mp4'; }); function saveVideoToRepository(videoFile) {