Live Demo
You can see the live demo of online tool here
Get Started
In order to get started you need to create the simple index.html
file and copy paste the following code
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 |
<div class="container"> <h1 class="text-center"> Youtube Video Timestamp Generator Online </h1> <div class="form-group"> <label for="youtubeurl">Youtube Video URL:</label> <input name="" type="text" id="url" placeholder="https://www.youtube.com/watch?v=4hFFY5Uzazs" required class="form-control" > </div> <div class="form-group"> <label for="minutes">Minutes:</label> <input name="" type="number" id="minutes" placeholder="Enter Minutes" value="0" required class="form-control" > </div> <div class="form-group"> <label for="seconds">Seconds:</label> <input name="" type="number" id="seconds" placeholder="Enter Seconds" value="0" required class="form-control" > </div> <br><br> <div id="result"></div> <br><br> <div class="form-group"> <button id="copy" style="display:none" class="btn btn-danger btn-block"> Copy to Clipboard </button> </div> <br><br> </div> </body> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/sweetalert2@10"></script> <script> var url = "" var minutes = "" var seconds = "" var resultUrl = "" $("#url").on('change',function(){ url = $(this).val() generateTimestamp(url,minutes,seconds) }) $("#minutes").on('change',function(){ minutes = parseInt($(this).val()) generateTimestamp(url,minutes,seconds) }) $("#seconds").on('change',function(){ seconds = parseInt($(this).val()) generateTimestamp(url,minutes,seconds) }) $("#copy").on('click',function(){ copytoclipboard() }) function generateTimestamp(url,minutes,seconds){ var minutesseconds = minutes * 60 console.log(minutesseconds) console.log(seconds) var total = parseInt(minutesseconds + seconds) console.log(total) resultUrl = `<h1 class="text-center"><a target="_blank" style="text-decoration:underline" href="https://youtu.be/${youtube_parser(url)}?t=${total}">https://youtu.be/${youtube_parser(url)}?t=${total}</a></h1>` $("#result").html(resultUrl) $("#copy").show() } function youtube_parser(url){ var regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#&?]*).*/; var match = url.match(regExp); return (match&&match[7].length==11)? match[7] : false; } function copytoclipboard(){ var textToCopy = $("#result").text(); var myTemporaryInputElement = document.createElement("input"); myTemporaryInputElement.type = "text"; myTemporaryInputElement.value = textToCopy; document.body.appendChild(myTemporaryInputElement); myTemporaryInputElement.select(); document.execCommand("Copy"); document.body.removeChild(myTemporaryInputElement); Swal.fire( 'Good job!', 'URL Successfully Copied', 'success' ) } </script> </html> |
Screenshot