Merge pull request #477 from gordlin/video-urls

Handle shortened YT URLs, indicate URL support
ramp4-pcar4 · Dec 6, 2024 · b404587 · b404587
2 parents 682050f + 245eb98
commit b404587
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 0 deletions.
diff --git a/src/components/video-editor.vue b/src/components/video-editor.vue
@@ -48,6 +48,28 @@
             <label class="editor-label text-label" for="videoURL"
                 >{{ $t('editor.label.or') + ' ' + $t('editor.video.pasteUrl') }}:</label
             >
+            <span
+                class="mr-3"
+                :content="$t('editor.video.label.linkSupport')"
+                v-tippy="{ placement: 'top', hideOnClick: false, animateFill: true }"
+                tabindex="0"
+            >
+                <svg
+                    class="fill-current"
+                    xmlns="http://www.w3.org/2000/svg"
+                    xmlns:xlink="http://www.w3.org/1999/xlink"
+                    width="20"
+                    height="20"
+                    viewBox="0 0 416.979 416.979"
+                    xml:space="preserve"
+                >
+                    <g>
+                        <path
+                            d="M356.004,61.156c-81.37-81.47-213.377-81.551-294.848-0.182c-81.47,81.371-81.552,213.379-0.181,294.85   c81.369,81.47,213.378,81.551,294.849,0.181C437.293,274.636,437.375,142.626,356.004,61.156z M237.6,340.786   c0,3.217-2.607,5.822-5.822,5.822h-46.576c-3.215,0-5.822-2.605-5.822-5.822V167.885c0-3.217,2.607-5.822,5.822-5.822h46.576   c3.215,0,5.822,2.604,5.822,5.822V340.786z M208.49,137.901c-18.618,0-33.766-15.146-33.766-33.765   c0-18.617,15.147-33.766,33.766-33.766c18.619,0,33.766,15.148,33.766,33.766C242.256,122.755,227.107,137.901,208.49,137.901z"
+                        />
+                    </g>
+                </svg>
+            </span>
             <input
                 ref="videoUrl"
                 id="videoURL"
@@ -218,6 +240,12 @@ export default class VideoEditorV extends Vue {
     uploadVideoUrl(): void {
         // TODO: might need to improve upon detecting YT link depending on cases
         let url = (this.$refs.videoUrl as HTMLInputElement).value as string;
+
+        // handle shortened URL case
+        if (url.toLowerCase().includes('youtu.be')) {
+            url = url.replace('youtu.be/', 'www.youtube.com/watch?v=');
+        }
+
         const isYoutube = url.toLowerCase().includes('youtube');
 
         // change YT link to embed format

diff --git a/src/lang/lang.csv b/src/lang/lang.csv
@@ -148,6 +148,7 @@ editor.video.label.drag,Drag your video file here,1,Glissez votre fichier vidéo
 editor.video.label.captions,Video Captions,1,Sous-titres,1
 editor.video.label.transcript,Video Transcript,1,Transcription,1
 editor.video.label.upload,Upload,1,Télécharger,1
+editor.video.label.linkSupport,Supports YouTube links (regular and shortened) as well as direct links to mp4 videos.,1,Prend en charge les liens YouTube (réguliers et raccourcis) ainsi que les liens directs vers des vidéos mp4.,0
 editor.video.delete,Delete Video,1,Supprimer la vidéo,1
 editor.video.pasteUrl,Paste the URL to a video,1,Collez l'url d'une vidéo,0
 editor.chart.delete,Delete Chart,1,Supprimer le graphique,1