video.rs (3676B)
1 use std::rc::Rc; 2 3 use crate::app::components::events::{EventExt, RoomExt}; 4 use matrix_sdk::{ 5 events::{room::message::VideoMessageEventContent, AnySyncMessageEvent}, 6 Room, 7 }; 8 use rand::random; 9 use yew::prelude::*; 10 11 pub(crate) struct Video { 12 props: Props, 13 } 14 15 #[derive(Clone, Properties, Debug)] 16 pub struct Props { 17 #[prop_or_default] 18 pub prev_event: Option<AnySyncMessageEvent>, 19 pub event: AnySyncMessageEvent, 20 pub video_event: VideoMessageEventContent, 21 pub room: Rc<Room>, 22 } 23 24 impl Component for Video { 25 type Message = (); 26 type Properties = Props; 27 28 fn create(props: Self::Properties, _link: ComponentLink<Self>) -> Self { 29 Video { props } 30 } 31 32 fn update(&mut self, _msg: Self::Message) -> bool { 33 false 34 } 35 36 fn change(&mut self, _props: Self::Properties) -> bool { 37 // TODO fix the PartialEq hack 38 /*if format!("{:?}", self.props) != format!("{:?}", props) { 39 self.props = props; 40 true 41 } else { 42 false 43 }*/ 44 true 45 } 46 47 //noinspection RsTypeCheck 48 fn view(&self) -> Html { 49 let new_user = self.props.event.is_new_user(self.props.prev_event.as_ref()); 50 let sender_displayname = if new_user { 51 self.props.room.get_sender_displayname(&self.props.event) 52 } else { 53 "" 54 }; 55 56 let _caption = format!("{}: {}", sender_displayname, self.props.video_event.body); 57 58 if let Some(video_url) = self.props.video_event.url.as_ref() { 59 let thumbnail = self 60 .props 61 .video_event 62 .info 63 .as_ref() 64 .unwrap() 65 .thumbnail_url 66 .as_ref() 67 .unwrap_or(video_url); 68 69 let lightbox_id: u8 = random(); 70 let lightbox_id_full = format!("video_{}", lightbox_id); 71 let lightbox_href_full = format!("#video_{}", lightbox_id); 72 if new_user { 73 html! { 74 <div> 75 <p><displayname>{sender_displayname}{": "}</displayname></p> 76 <a href={lightbox_href_full}><img src=thumbnail/></a> 77 <div class="lightbox short-animate" id={lightbox_id_full}> 78 <video class="long-animate" controls=true> 79 <source src=video_url type="video/mp4"/> 80 {"Your browser does not support the video tag."} 81 </video> 82 </div> 83 <div id="lightbox-controls" class="short-animate"> 84 <a id="close-lightbox" class="long-animate" href="#!">{"Close Lightbox"}</a> 85 </div> 86 </div> 87 } 88 } else { 89 html! { 90 <div> 91 <a href={lightbox_href_full}><img src=thumbnail/></a> 92 <div class="lightbox short-animate" id={lightbox_id_full}> 93 <video class="long-animate" controls=true> 94 <source src=video_url type="video/mp4"/> 95 {"Your browser does not support the video tag."} 96 </video> 97 </div> 98 <div id="lightbox-controls" class="short-animate"> 99 <a id="close-lightbox" class="long-animate" href="#!">{"Close Lightbox"}</a> 100 </div> 101 </div> 102 } 103 } 104 } else { 105 html! {} 106 } 107 } 108 }