sonr/pkg/nebula/modals/intro_video_templ.go

// Code generated by templ - DO NOT EDIT.

// templ: version: v0.2.778
package modals

//lint:file-ignore SA4006 This context is only used if a nested component is present.

import "github.com/a-h/templ"
import templruntime "github.com/a-h/templ/runtime"

func IntroVideo() templ.Component {
	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
			return templ_7745c5c3_CtxErr
		}
		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
		if !templ_7745c5c3_IsBuffer {
			defer func() {
				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
				if templ_7745c5c3_Err == nil {
					templ_7745c5c3_Err = templ_7745c5c3_BufErr
				}
			}()
		}
		ctx = templ.InitializeContext(ctx)
		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
		if templ_7745c5c3_Var1 == nil {
			templ_7745c5c3_Var1 = templ.NopComponent
		}
		ctx = templ.ClearChildren(ctx)
		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div x-data=\"{\nsources: {\nmp4: &#39;https://cdn.devdojo.com/pines/videos/coast.mp4&#39;,\nwebm: &#39;https://cdn.devdojo.com/pines/videos/coast.webm&#39;,\nogg: &#39;https://cdn.devdojo.com/pines/videos/coast.ogg&#39;\n},\nplaying: false,\ncontrols: true,\nmuted: false,\nmuteForced: false,\nfullscreen: false,\nended: false,\nmouseleave: false,\nautoHideControlsDelay: 3000,\ncontrolsHideTimeout: null,\nposter: null,\nvideoDuration: 0,\ntimeDurationString: &#39;00:00&#39;,\ntimeElapsedString: &#39;00:00&#39;,\nshowTime: false,\nvolume: 1,\nvolumeBeforeMute: 1,\nvideoPlayerReady: false,\ntimelineSeek(e) {\ntime = this.formatTime(Math.round(e.target.value));\nthis.timeElapsedString = `${time.minutes}:${time.seconds}`;\n},\nmetaDataLoaded(event) {\nthis.videoDuration = event.target.duration;\nthis.$refs.videoProgress.setAttribute(&#39;max&#39;, this.videoDuration);\ntime = this.formatTime(Math.round(this.videoDuration));\nthis.timeDurationString = `${time.minutes}:${time.seconds}`;\nthis.showTime = true;\nthis.videoPlayerReady = true;\n},\ntogglePlay(e) {\nif (this.$refs.player.paused || this.$refs.player.ended) {\nthis.playing = true;\nthis.$refs.player.play();\n} else {\nthis.$refs.player.pause();\nthis.playing = false;\n}\n},\ntoggleMute(){\nthis.muted = !this.muted;\nthis.$refs.player.muted = this.muted;\nif(this.muted){\nthis.volumeBeforeMute = this.volume;\nthis.volume = 0;\n} else {\nthis.volume = this.volumeBeforeMute;\n}\n},\ntimeUpdatedInterval() {\nif (!this.$refs.videoProgress.getAttribute(&#39;max&#39;))\nthis.$refs.videoProgress.setAttribute(&#39;max&#39;, $refs.player.duration);\nthis.$refs.videoProgress.value = this.$refs.player.currentTime;\ntime = this.formatTime(Math.round(this.$refs.player.currentTime));\nthis.timeElapsedString = `${time.minutes}:${time.seconds}`;\n},\nupdateVolume(e) {\nthis.volume = e.target.value;\nthis.$refs.player.volume = this.volume;\nif(this.volume == 0){\nthis.muted = true;\n}\nif(this.muted &amp;&amp; this.volume &gt; 0){\nthis.muted = false;\n}\n},\ntimelineClicked(e) {\nrect = this.$refs.videoProgress.getBoundingClientRect();\npos = (e.pageX - rect.left) / this.$refs.videoProgress.offsetWidth;\nthis.$refs.player.currentTime = pos * this.$refs.player.duration;\n},\nhandleFullscreen() {\nif (document.fullscreenElement !== null) {\n// The document is in fullscreen mode\ndocument.exitFullscreen();\n} else {\n// The document is not in fullscreen mode\nthis.$refs.videoContainer.requestFullscreen();\n}\n},\nmousemoveVideo() {\nif(this.playing){\nthis.resetControlsTimeout();\n} else {\nthis.controls=true;\nclearTimeout(this.controlsHideTimeout);\n}\n},\nvideoEnded() {\nthis.ended = true;\nthis.playing = false;\nthis.$refs.player.currentTime = 0;\n},\nresetControlsTimeout() {\nthis.controls = true;\nclearTimeout(this.controlsHideTimeout);\nlet that = this;\nthis.controlsHideTimeout = setTimeout(function(){\nthat.controls=false\n}, this.autoHideControlsDelay);\n},\nformatTime(timeInSeconds) {\nresult = new Date(timeInSeconds * 1000).toISOString().substring(11, 19);\nreturn {\nminutes: result.substring(3, 5),\nseconds: result.substring(6, 8),\n};\n}\n}\" x-data=\"introVideo\" x-ref=\"videoContainer\" @mouseleave=\"mouseleave=true\" @mousemove=\"mousemoveVideo\" class=\"relative h-[360px] min-w-[640px] overflow-hidden rounded-md aspect-video\"><video x-ref=\"player\" @loadedmetadata=\"metaDataLoaded\" @timeupdate=\"timeUpdatedInterval\" @ended=\"videoEnded\" preload=\"metadata\" :poster=\"poster\" class=\"relative z-10 object-cover w-full h-full bg-black\" crossorigin=\"anonymous\"><source :src=\"sources.mp4\" type=\"video/mp4\"> <source :src=\"sources.webm\" type=\"video/webm\"> <source :src=\"sources.ogg\" type=\"video/ogg\"></video><div x-show=\"videoPlayerReady\" class=\"absolute inset-0 w-full h-full\"><div x-ref=\"videoBackground\" @click=\"togglePlay()\" class=\"absolute inset-0 z-30 flex items-center justify-center w-full h-full bg-black bg-opacity-0 cursor-pointer group\"><div x-show=\"playing\" x-transition:enter=\"
		if templ_7745c5c3_Err != nil {
			return templ_7745c5c3_Err
		}
		return templ_7745c5c3_Err
	})
}

var _ = templruntime.GeneratedTemplate