Skip to content
Snippets Groups Projects
Commit 4c28bd9f authored by bewe's avatar bewe
Browse files

fix: video css

parent 4b40f755
Branches
Tags
No related merge requests found
...@@ -14,29 +14,36 @@ $video = '/public/video/default.mp4'; ...@@ -14,29 +14,36 @@ $video = '/public/video/default.mp4';
<input type="hidden" name="user_id" value="<?= $_SESSION['user_id'] ?>"> <input type="hidden" name="user_id" value="<?= $_SESSION['user_id'] ?>">
<div class="text-input-container"> <div class="text-input-container">
<label for="videoName" class="text-reg text-black text-xs">Video name</label> <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> <p id="video-error"></p>
<label for="description" class="text-reg text-black text-xs">Description</label> <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"> <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>
<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; ?>"> <input type="hidden" id="new-video" name="new-video" value="<?php echo $video; ?>">
<div class="button-container"> <div class="language-picture-container">
<button class="font-reg text-sm primary-blue-button"> <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/*"> <input type="file" id="upload-input" accept="video/*">
Change video <label for="upload-input" class="primary-blue-button font-reg text-sm">Change video</label>
</button> <button class="font-reg text-sm secondary-blue-button" id="delete-btn">Delete video</button>
<button class="font-reg text-sm secondary-blue-button" id="delete-btn">Delete video</button> </div>
</div> </div>
<label for="order" class="text-reg text-black text-xs">Order</label> <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> <p id="order-error"></p>
</div> </div>
<div class="bottom-button-container"> <div class="bottom-button-container">
<a href="/admin/manage/<?= $data["languageId"] . "/" . $data["moduleId"] ?>" class="secondary-orange-button font-reg text-sm">Back</a> <a href="/admin/manage/<?= $data["languageId"] . "/" . $data["moduleId"] ?>"
<button id="create-btn" type="submit" class="primary-orange-button font-reg text-sm disable" onchange="checkVideo(), checkOrder()" disabled>Create</button> 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> </div>
</form> </form>
</div> </div>
......
<?php <?php
$video = $data["video"]["video_url"]; $video = $data["video"]["video_url"];
$parse_video = explode("/", $video);
?> ?>
<div class="create"> <div class="create">
...@@ -38,15 +39,16 @@ $video = $data["video"]["video_url"]; ...@@ -38,15 +39,16 @@ $video = $data["video"]["video_url"];
<p id="video-error"></p> <p id="video-error"></p>
<label for="description" class="text-reg text-black text-xs">Description</label> <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"] ?>"> <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; ?>"> <input type="hidden" id="new-video" name="new-video" value="<?php echo $video; ?>">
<div class="button-container"> <div class="language-picture-container">
<button class="font-reg text-sm primary-blue-button"> <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/*"> <input type="file" id="upload-input" accept="video/*">
Change video <label for="upload-input" class="primary-blue-button font-reg text-sm">Change video</label>
</button> <button class="font-reg text-sm secondary-blue-button" id="delete-btn">Delete video</button>
<button class="font-reg text-sm secondary-blue-button" id="delete-btn">Delete video</button> </div>
</div> </div>
<label for="order" class="text-reg text-black text-xs">Order</label> <label for="order" class="text-reg text-black text-xs">Order</label>
......
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
.create .input-container .language-picture-container { .create .input-container .language-picture-container {
width: 100%; width: 100%;
max-width: 400px; max-width: 1000px;
display: flex; display: flex;
gap: 50px; gap: 50px;
align-items: center; align-items: center;
...@@ -64,6 +64,15 @@ ...@@ -64,6 +64,15 @@
justify-content: center; justify-content: center;
} }
.video-image-container {
width: 100%;
max-width: 400px;
display: flex;
gap: 50px;
align-items: center;
justify-content: center;
}
/* Input container */ /* Input container */
.create form { .create form {
......
...@@ -68,6 +68,7 @@ document.getElementById('upload-input').addEventListener('change', function (eve ...@@ -68,6 +68,7 @@ document.getElementById('upload-input').addEventListener('change', function (eve
const reader = new FileReader(); const reader = new FileReader();
reader.onload = function (e) { reader.onload = function (e) {
document.getElementById('video-path').innerHTML = file.name;
saveVideoToRepository(file); saveVideoToRepository(file);
}; };
...@@ -80,6 +81,7 @@ document.getElementById('delete-btn').addEventListener('click', function (event) ...@@ -80,6 +81,7 @@ document.getElementById('delete-btn').addEventListener('click', function (event)
uploadInput.value = ''; uploadInput.value = '';
const newVideoInput = document.getElementById('new-video'); const newVideoInput = document.getElementById('new-video');
newVideoInput.value = '/public/video/default.mp4'; newVideoInput.value = '/public/video/default.mp4';
document.getElementById('video-path').innerHTML = 'default.mp4';
}); });
function saveVideoToRepository(videoFile) { function saveVideoToRepository(videoFile) {
......
...@@ -68,6 +68,7 @@ document.getElementById('upload-input').addEventListener('change', function (eve ...@@ -68,6 +68,7 @@ document.getElementById('upload-input').addEventListener('change', function (eve
const reader = new FileReader(); const reader = new FileReader();
reader.onload = function (e) { reader.onload = function (e) {
document.getElementById('video-path').innerHTML = file.name;
saveVideoToRepository(file); saveVideoToRepository(file);
}; };
...@@ -80,6 +81,7 @@ document.getElementById('delete-btn').addEventListener('click', function (event) ...@@ -80,6 +81,7 @@ document.getElementById('delete-btn').addEventListener('click', function (event)
uploadInput.value = ''; uploadInput.value = '';
const newVideoInput = document.getElementById('new-video'); const newVideoInput = document.getElementById('new-video');
newVideoInput.value = '/public/video/default.mp4'; newVideoInput.value = '/public/video/default.mp4';
document.getElementById('video-path').innerHTML = 'default.mp4';
}); });
function saveVideoToRepository(videoFile) { function saveVideoToRepository(videoFile) {
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment