component AMV(amv *arn.AMV, user *arn.User)
	.amv.mountable
		AMVVideo(amv)
		AMVFooter(amv, user)

component AMVMini(amv *arn.AMV, user *arn.User)
	.amv.mountable
		AMVVideo(amv)
		AMVMiniFooter(amv, user)

component AMVVideo(amv *arn.AMV)
	.video-container(id=amv.ID, data-api="/api/amv/" + amv.ID)
		video.video.media-play-area.lazy.action(data-action="playVideo", data-trigger="click", data-media-id=amv.ID)
			source(data-src="https://notify.moe/videos/amvs/" + amv.File, data-type="video/webm")

			//- button.media-play-button
			//- 	RawIcon("play")
		
		.video-controls
			.video-progress-bar
				.video-current-progress
			
			.video-time= fmt.Sprintf("%d:%02d", int(amv.Info.Duration.Minutes()), int(amv.Info.Duration.Seconds()) % 60)

			//- button.video-control.action(data-action="like", data-trigger="click")
			//- 	RawIcon("heart-o")
			
			button.video-control.action(data-action="toggleFullscreen", data-trigger="click", data-id=amv.ID, aria-label="Fullscreen")
				RawIcon("square-o")

component AMVFooter(amv *arn.AMV, user *arn.User)
	.amv-footer
		if amv.Title.ByUser(user) == ""
			a(href=amv.Link() + "/edit") untitled
		else
			a(href=amv.Link())= amv.Title.ByUser(user)
		span  posted 
		span.utc-date.no-tip(data-date=amv.Created)
		span  by 
		a(href=amv.Creator().Link())= amv.Creator().Nick + " "

component AMVMiniFooter(amv *arn.AMV, user *arn.User)
	.amv-footer
		if amv.Title.ByUser(user) == ""
			a(href=amv.Link() + "/edit") untitled
		else
			a(href=amv.Link())= amv.Title.ByUser(user)