Textless Asset Video Generator
About this app
Create stunning textless videos with ease using our user-friendly video generator tool. Add audio, images, and effects to make your videos stand out!
Textless Asset Video Generator Textless Asset Video Generator Create your textless videos easily Generate Video
Related apps
IPTV M3U8 & EPG Generator Studio | Image to M3U Playlist & Guide
Image to IPTV Converter & M3U Playlist Generator
Image to IPTV Converter & M3U Playlist Generator
Image to M3U Playlist Converter | IPTV & Media Stream Generator
Roulette Row Predictor Pro - Live Pattern & Trend Stats Analyzer
Video to Repeated Sequence Generator - Rhythm & Glitch Loop Maker
LoopCraft - Video to Repeated Sequence Converter
LoopMatrix - Video Sequence Repeater & Stutter Maker
MuffleFX - Video & Audio Low-Pass Filter Studio
Seeding Rate Calculator
Irrigation Set Time Calculator
Fertilizer Nutrient Units Calculator
Put this on your site
Source
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Textless Asset Video Generator</title>
<meta name="description" content="Create stunning textless videos with ease using our user-friendly video generator tool. Add audio, images, and effects to make your videos stand out!">
<meta name="keywords" content="video generator, create videos, textless videos, video tools, media creation">
<!-- Libraries -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.6.0/css/fontawesome.min.css" crossorigin="anonymous">
<script type="text/javascript">
try {
// App Javascript Goes Here. Place your entire script content inside the try block for error handling.
let videoData = {
images: [],
audio: null
};
document.addEventListener("DOMContentLoaded", function() {
// Handle image input
document.getElementById('uploadImages').addEventListener('change', function(event) {
const files = event.target.files;
videoData.images = [];
for (let i = 0; i < files.length; i++) {
const fileURL = URL.createObjectURL(files[i]);
videoData.images.push(fileURL);
}
renderImagePreview();
});
// Handle audio input
document.getElementById('uploadAudio').addEventListener('change', function(event) {
const file = event.target.files[0];
if (file) {
videoData.audio = URL.createObjectURL(file);
renderAudioPreview();
}
});
// Generate video
document.getElementById('generateVideo').addEventListener('click', function() {
if (videoData.images.length > 0 && videoData.audio) {
alert("Video Generation Started! (Functionality to be implemented)");
} else {
alert("Please upload both images and audio.");
}
});
});
function renderImagePreview() {
const previewContainer = document.getElementById('imagePreview');
previewContainer.innerHTML = "";
videoData.images.forEach((src) => {
const img = document.createElement('img');
img.src = src;
img.className = "img-thumbnail";
img.style.width = "100px";
img.style.margin = "5px";
previewContainer.appendChild(img);
});
}
function renderAudioPreview() {
const audioContainer = document.getElementById('audioPreview');
audioContainer.innerHTML = "";
const audioElem = document.createElement('audio');
audioElem.controls = true;
audioElem.src = videoData.audio;
audioContainer.appendChild(audioElem);
}
} catch (error) {
throw error;
}
</script>
<style>
/* App CSS Goes Here */
body {
background: linear-gradient(to right, #6a11cb, #2575fc);
color: white;
font-family: Arial, sans-serif;
}
#main-container {
margin-top: 50px;
background-color: rgba(0, 0, 0, 0.8);
border-radius: 15px;
padding: 20px;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
}
h1, h5 {
text-align: center;
}
.btn-upload {
margin: 10px 0;
}
#imagePreview {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 20px 0;
}
</style>
</head>
<body>
<div id="main-container" class="container">
<h1>Textless Asset Video Generator</h1>
<h5>Create your textless videos easily</h5>
<div class="mb-3">
<input type="file" id="uploadImages" class="form-control btn-upload" multiple accept="image/*" />
<input type="file" id="uploadAudio" class="form-control btn-upload" accept="audio/*" />
</div>
<button id="generateVideo" class="btn btn-primary btn-block">Generate Video</button>
<div id="imagePreview"></div>
<div id="audioPreview"></div>
</div>
</body>
</html>
NEW APPS
These are apps made by the community!