path helpers

Cargo.toml

@@ -2,6 +2,7 @@
 members = [
 	"lib",
 	"native-player",
+	"video-encoder",
 	"wasm-module"
 ]
 resolver = "3"
@@ -12,7 +13,16 @@ strip = true
 codegen-units = 1
 
 [workspace.dependencies]
-strafesnet_common = { version = "0.8.1", registry = "strafesnet" }
-strafesnet_graphics = { version = "0.0.2", registry = "strafesnet" }
-strafesnet_roblox_bot_file = { version = "0.9.0", registry = "strafesnet" }
+glam = "0.32.0"
+
+strafesnet_common = { version = "0.8.6", registry = "strafesnet" }
+strafesnet_graphics = { version = "0.0.7", registry = "strafesnet" }
+strafesnet_roblox_bot_file = { version = "0.9.3", registry = "strafesnet" }
 strafesnet_snf = { version = "0.3.2", registry = "strafesnet" }
+
+strafesnet_roblox_bot_player = { version = "0.2.0", path = "lib" }
+
+# strafesnet_common = { path = "../strafe-project/lib/common" }
+# strafesnet_graphics = { path = "../strafe-project/engine/graphics" }
+# strafesnet_roblox_bot_file = { path = "../roblox_bot_file" }
+# strafesnet_snf = { path = "../strafe-project/lib/snf" }

README.md

@@ -1,23 +1,29 @@
-How to clone this repository:
+### How to clone this repository:
+- Install git
+- Install git lfs (for test files)
 ```
 git clone https://git.itzana.me/StrafesNET/roblox-bot-player
 cd roblox-bot-player
 git lfs pull
 ```
 
-How to build the wasm module:
+### How to build the wasm module:
+- Install rust
+- Install wasm-pack
 ```
 cd wasm-module
 wasm-pack build --target web --out-dir ../web-demo/pkg
 ```
 
-How to serve the web demo (requires wasm module):
+### How to serve the web demo (requires wasm module):
+- Install python3 or use your favourite http server
 ```
 cd web-demo
 python3 -m http.server
 ```
 
-How to run the native player:
+### How to run the native player:
+- Install rust
 ```
 cd native-player
 cargo run --release -- ../web-demo/bhop_marble_5692093612.snfm ../web-demo/bhop_marble_7cf33a64-7120-4514-b9fa-4fe29d9523d.qbot

lib/Cargo.toml

@@ -1,10 +1,10 @@
 [package]
 name = "strafesnet_roblox_bot_player"
-version = "0.1.0"
+version = "0.2.0"
 edition = "2024"
 
 [dependencies]
-glam = "0.31.0"
+glam.workspace = true
 strafesnet_common.workspace = true
 strafesnet_graphics.workspace = true
 strafesnet_roblox_bot_file.workspace = true

lib/src/bot.rs

@@ -1,36 +1,49 @@
+use strafesnet_common::timer::{TimerFixed,Realtime,Unpaused};
+use strafesnet_common::run::{Time as RunTime};
+use strafesnet_common::physics::{Time as PhysicsTime,TimeInner as PhysicsTimeInner};
 use strafesnet_roblox_bot_file::v0;
-use strafesnet_common::physics::{Time as PhysicsTime};
+
+use crate::head::{Time as PlaybackTime,TimeInner as PlaybackTimeInner};
 
 /// A loaded bot file.
 pub struct CompleteBot{
 	//Instructions
 	timelines:v0::Block,
-	time_base:PhysicsTime,
+	timer:TimerFixed<Realtime<PlaybackTimeInner,PhysicsTimeInner>,Unpaused>,
 	duration:PhysicsTime,
+	world_offset:glam::Vec3,
 }
 impl CompleteBot{
 	pub(crate) const CAMERA_OFFSET:glam::Vec3=glam::vec3(0.0,2.0,0.0);
 	pub fn new(
 		timelines:v0::Block,
 	)->Self{
-		let first=timelines.output_events.first().unwrap();
-		let last=timelines.output_events.last().unwrap();
+		let start=crate::time::from_float(timelines.output_events.first().unwrap().time).unwrap();
+		let end=crate::time::from_float(timelines.output_events.last().unwrap().time).unwrap();
+		let world_position=timelines.world_events.iter().find_map(|event|match &event.event{
+			v0::WorldEvent::Reset(world_reset_event)=>Some(world_reset_event.position),
+			_=>None,
+		}).expect("Map must contain a WorldReset event");
 		Self{
-			time_base:crate::time::from_float(first.time).unwrap(),
-			duration:crate::time::from_float(last.time-first.time).unwrap(),
+			timer:TimerFixed::new(PlaybackTime::ZERO,start),
+			duration:end-start,
 			timelines,
+			world_offset:glam::vec3(world_position.x,world_position.y,world_position.z),
 		}
 	}
-	pub const fn time_base(&self)->PhysicsTime{
-		self.time_base
+	pub fn time(&self,time:PlaybackTime)->PhysicsTime{
+		self.timer.time(time)
 	}
 	pub const fn duration(&self)->PhysicsTime{
 		self.duration
 	}
+	pub const fn world_offset(&self)->glam::Vec3{
+		self.world_offset
+	}
 	pub const fn timelines(&self)->&v0::Block{
 		&self.timelines
 	}
-	pub fn run_duration(&self,mode_id:v0::ModeID)->Option<PhysicsTime>{
+	pub fn run_duration(&self,mode_id:v0::ModeID)->Option<RunTime>{
 		let mut it=self.timelines.run_events.iter().rev();
 		let end=it.find_map(|event|match &event.event{
 			v0::RunEvent::Finish(run_start_event) if run_start_event.mode==mode_id=>Some(event.time),

lib/src/graphics.rs

@@ -3,49 +3,28 @@ use strafesnet_graphics::graphics::GraphicsState;
 /// The graphics state, essentially a handle to all the information on the GPU.
 pub struct Graphics{
 	graphics:GraphicsState,
-	config:wgpu::SurfaceConfiguration,
-	device:wgpu::Device,
-	queue:wgpu::Queue,
+	start_offset:glam::Vec3,
 }
 impl Graphics{
-	pub fn new(device:wgpu::Device,queue:wgpu::Queue,config:wgpu::SurfaceConfiguration)->Self{
-		let mut graphics=strafesnet_graphics::graphics::GraphicsState::new(&device,&queue,&config);
-		graphics.resize(&device,&config,glam::Vec2::ONE);
+	pub fn new(device:&wgpu::Device,queue:&wgpu::Queue,size:glam::UVec2,view_format: wgpu::TextureFormat)->Self{
+		let graphics=strafesnet_graphics::graphics::GraphicsState::new(device,queue,size,view_format);
 		Self{
 			graphics,
-			device,
-			queue,
-			config,
+			start_offset:glam::Vec3::ZERO,
 		}
 	}
-	pub fn change_map(&mut self,map:&strafesnet_common::map::CompleteMap){
+	pub fn change_map(&mut self,device:&wgpu::Device,queue:&wgpu::Queue,map:&strafesnet_common::map::CompleteMap){
 		self.graphics.clear();
-		self.graphics.generate_models(&self.device,&self.queue,map);
+		self.graphics.generate_models(device,queue,map);
+		let modes=map.modes.clone().denormalize();
+		let mode=modes.get_mode(strafesnet_common::gameplay_modes::ModeId::MAIN).expect("Map does not have a main mode");
+		let start_zone=map.models.get(mode.get_start().get() as usize).expect("Map does not have a start zone");
+		self.start_offset=glam::Vec3::from_array(start_zone.transform.translation.map(|f|f.into()).to_array());
 	}
-	pub fn resize(&mut self,surface:&wgpu::Surface<'_>,size:glam::UVec2){
-		self.config.width=size.x.max(1);
-		self.config.height=size.y.max(1);
-		surface.configure(&self.device,&self.config);
-		self.graphics.resize(&self.device,&self.config,glam::Vec2::ONE);
+	pub fn resize(&mut self,device:&wgpu::Device,size:glam::UVec2,fov:glam::Vec2){
+		self.graphics.resize(device,size,fov);
 	}
-	pub fn render(&mut self,surface:&wgpu::Surface<'_>,pos:glam::Vec3,angles:glam::Vec2){
-		//this has to go deeper somehow
-		let frame=match surface.get_current_texture(){
-			Ok(frame)=>frame,
-			Err(_)=>{
-				surface.configure(&self.device,&self.config);
-				surface
-					.get_current_texture()
-					.expect("Failed to acquire next surface texture!")
-			}
-		};
-		let view=frame.texture.create_view(&wgpu::TextureViewDescriptor{
-			format:Some(self.config.view_formats[0]),
-			..wgpu::TextureViewDescriptor::default()
-		});
-
-		self.graphics.render(&view,&self.device,&self.queue,strafesnet_graphics::graphics::view_inv(pos,angles));
-
-		frame.present();
+	pub fn encode_commands(&mut self,encoder:&mut wgpu::CommandEncoder,view:&wgpu::TextureView,pos:glam::Vec3,angles:glam::Vec2){
+		self.graphics.encode_commands(encoder,view,strafesnet_graphics::graphics::view_inv(pos+self.start_offset,angles));
 	}
 }

lib/src/head.rs

@@ -1,7 +1,6 @@
 use glam::Vec3Swizzles;
 use strafesnet_common::timer::{Scaled,Timer,TimerState};
 use strafesnet_common::session::{Time as SessionTime,TimeInner as SessionTimeInner};
-use strafesnet_common::physics::{Time as PhysicsTime,TimeInner as PhysicsTimeInner};
 use strafesnet_roblox_bot_file::v0::{EventType,Head,Timed};
 
 use crate::bot::CompleteBot;
@@ -11,71 +10,65 @@ fn vector3_to_glam(v:&strafesnet_roblox_bot_file::v0::Vector3)->glam::Vec3{
 	glam::vec3(v.x,v.y,v.z)
 }
 
+#[derive(Clone,Copy,Hash,Eq,PartialEq,Ord,PartialOrd,Debug)]
+pub enum TimeInner{}
+pub type Time=strafesnet_common::integer::Time<TimeInner>;
+
 /// A playback context.  Advance time and then generate a camera position to pass to the renderer.
 pub struct PlaybackHead{
 	head:Head,
-	loop_offset:PhysicsTime,
-	timer:Timer<Scaled<SessionTimeInner,PhysicsTimeInner>>,
+	timer:Timer<Scaled<SessionTimeInner,TimeInner>>,
 	state:PlaybackState,
 }
-const HEAD_NO_CRASH:Head={
-	let mut head=Head::new();
-	// push one output event so that output-1 doesn't underflow
-	head.push(EventType::Output);
-	head
-};
 impl PlaybackHead{
-	pub fn new(time:SessionTime)->Self{
-		let timer=Timer::unpaused(time,PhysicsTime::ZERO);
+	pub fn new(bot:&CompleteBot,time:SessionTime)->Self{
+		let timer=Timer::unpaused(time,Time::ZERO);
+		let head=Head::after_time(bot.timelines(),bot.time(Time::ZERO).into());
+		let mut state=PlaybackState::new();
+		state.process_head(bot.timelines(),&head);
 		Self{
-			head:HEAD_NO_CRASH,
-			loop_offset:PhysicsTime::ZERO,
+			head,
 			timer,
-			state:PlaybackState::new(),
+			state,
 		}
 	}
 	pub const fn state(&self)->&PlaybackState{
 		&self.state
 	}
-	pub fn time(&self,bot:&CompleteBot,time:SessionTime)->PhysicsTime{
-		bot.time_base()+self.timer.time(time)+self.loop_offset
+	pub fn time(&self,time:SessionTime)->Time{
+		self.timer.time(time)
+	}
+	pub fn timer(&self)->&Timer<Scaled<SessionTimeInner,TimeInner>>{
+		&self.timer
+	}
+	pub fn set_paused(&mut self,time:SessionTime,paused:bool){
+		_=self.timer.set_paused(time,paused);
+	}
+	pub fn set_time(&mut self,bot:&CompleteBot,time:SessionTime,new_time:Time){
+		let new_time=new_time.rem_euclid(bot.duration().coerce());
+		self.timer.set_time(time,new_time);
+		// reset head
+		self.head=Head::after_time(bot.timelines(),bot.time(new_time).into());
+
+		self.state=PlaybackState::new();
+		self.state.process_head(bot.timelines(),&self.head);
+	}
+	pub fn get_scale(&self)->strafesnet_common::integer::Ratio64{
+		self.timer.get_scale()
+	}
+	pub fn set_scale(&mut self,time:SessionTime,new_scale:strafesnet_common::integer::Ratio64){
+		self.timer.set_scale(time,new_scale);
 	}
 	pub fn next_event(&self,bot:&CompleteBot)->Option<Timed<EventType>>{
 		self.head.next_event(bot.timelines())
 	}
 	pub fn process_event(&mut self,bot:&CompleteBot,event_type:EventType){
-		self.state.process_event(bot,event_type,self.head.get_event_index(event_type));
+		self.state.process_event(bot.timelines(),event_type,self.head.get_event_index(event_type));
 		self.head.push(event_type);
 	}
-	pub fn set_paused(&mut self,time:SessionTime,paused:bool){
-		_=self.timer.set_paused(time,paused);
-	}
-	pub fn seek_to(&mut self,time:SessionTime,new_time:PhysicsTime){
-		self.timer.set_time(time,new_time);
-		self.loop_offset=PhysicsTime::ZERO;
-		// reset head
-		self.head=HEAD_NO_CRASH;
-	}
-	pub fn seek_backward(&mut self,time_offset:SessionTime){
-		let (mut state,paused)=self.timer.clone().into_state();
-		let offset=state.get_time(-time_offset).coerce();
-		state.set_offset(offset);
-		self.timer=Timer::from_state(state,paused);
-		// reset head
-		self.head=HEAD_NO_CRASH;
-	}
-	pub fn seek_forward(&mut self,time_offset:SessionTime){
-		let (mut state,paused)=self.timer.clone().into_state();
-		let offset=state.get_time(time_offset).coerce();
-		state.set_offset(offset);
-		self.timer=Timer::from_state(state,paused);
-	}
-	pub fn set_scale(&mut self,time:SessionTime,new_scale:strafesnet_common::integer::Ratio64){
-		self.timer.set_scale(time,new_scale);
-	}
 	pub fn advance_time(&mut self,bot:&CompleteBot,time:SessionTime){
-		let mut simulation_time=self.time(bot,time);
-		let mut time_float=simulation_time.get() as f64/PhysicsTime::ONE_SECOND.get() as f64;
+		let mut simulation_time=bot.time(self.time(time));
+		let mut time_float=simulation_time.into();
 		loop{
 			match self.next_event(bot){
 				Some(next_event)=>{
@@ -87,38 +80,74 @@ impl PlaybackHead{
 				},
 				None=>{
 					//reset playback
-					self.head=HEAD_NO_CRASH;
-					self.loop_offset-=bot.duration();
+					self.head=Head::after_time(bot.timelines(),bot.time(Time::ZERO).into());
+					self.state=PlaybackState::new();
+					self.state.process_head(bot.timelines(),&self.head);
+
+					// hack to wind back timer offset without precise session timestamp
+					let (mut state,paused)=self.timer.clone().into_state();
+					let offset=state.get_offset()-bot.duration().coerce();
+					state.set_offset(offset);
+					self.timer=Timer::from_state(state,paused);
+
+					// update loop variables
 					simulation_time-=bot.duration();
-					time_float=simulation_time.get() as f64/PhysicsTime::ONE_SECOND.get() as f64;
+					time_float=simulation_time.into();
 				},
 			}
 		}
 	}
-	pub fn get_position_angles(&self,bot:&CompleteBot,time:SessionTime)->(glam::Vec3,glam::Vec2){
-		let time=self.time(bot,time);
+	fn interpolate_output<'a>(&self,bot:&'a CompleteBot,time:SessionTime)->InterpolateOutput<'a>{
+		let time=bot.time(self.time(time));
 		let event0=&bot.timelines().output_events[self.head.get_event_index(EventType::Output)-1];
 		let event1=&bot.timelines().output_events[self.head.get_event_index(EventType::Output)];
-		let p0=vector3_to_glam(&event0.event.position);
-		let p1=vector3_to_glam(&event1.event.position);
-		// let v0=vector3_to_glam(&event0.event.velocity);
-		// let v1=vector3_to_glam(&event1.event.velocity);
-		// let a0=vector3_to_glam(&event0.event.acceleration);
-		// let a1=vector3_to_glam(&event1.event.acceleration);
 		let t0=event0.time;
 		let t1=event1.time;
-		let time_float=time.get() as f64/PhysicsTime::ONE_SECOND.get() as f64;
+		let time_float:f64=time.into();
 		let t=((time_float-t0)/(t1-t0)) as f32;
-		let p=p0.lerp(p1,t);
-		// let v=v0.lerp(v1,t);
-		// let a=a0.lerp(a1,t);
+		InterpolateOutput{
+			event0:&event0.event,
+			event1:&event1.event,
+			t:t,
+		}
+	}
+	pub fn get_position_angles(&self,bot:&CompleteBot,time:SessionTime)->(glam::Vec3,glam::Vec2){
+		let interp=self.interpolate_output(bot,time);
 
-		//println!("position={:?}",p);
+		let p=interp.position();
+		let a=interp.angles();
 
-		let angles0=vector3_to_glam(&event0.event.angles);
-		let angles1=vector3_to_glam(&event1.event.angles);
-		let angles=angles0.lerp(angles1,t);
-
-		(p+CompleteBot::CAMERA_OFFSET,angles.yx())
+		(p-bot.world_offset()+CompleteBot::CAMERA_OFFSET,a.yx())
+	}
+	pub fn get_velocity(&self,bot:&CompleteBot,time:SessionTime)->glam::Vec3{
+		let interp=self.interpolate_output(bot,time);
+		interp.velocity()
+	}
+	pub fn get_angles(&self,bot:&CompleteBot,time:SessionTime)->glam::Vec3{
+		let interp=self.interpolate_output(bot,time);
+		interp.angles()
+	}
+}
+
+struct InterpolateOutput<'a>{
+	event0:&'a strafesnet_roblox_bot_file::v0::OutputEvent,
+	event1:&'a strafesnet_roblox_bot_file::v0::OutputEvent,
+	t:f32,
+}
+impl InterpolateOutput<'_>{
+	fn position(&self)->glam::Vec3{
+		let p0=vector3_to_glam(&self.event0.position);
+		let p1=vector3_to_glam(&self.event1.position);
+		p0.lerp(p1,self.t)
+	}
+	fn velocity(&self)->glam::Vec3{
+		let v0=vector3_to_glam(&self.event0.velocity);
+		let v1=vector3_to_glam(&self.event1.velocity);
+		v0.lerp(v1,self.t)
+	}
+	fn angles(&self)->glam::Vec3{
+		let a0=vector3_to_glam(&self.event0.angles);
+		let a1=vector3_to_glam(&self.event1.angles);
+		a0.lerp(a1,self.t)
 	}
 }

lib/src/lib.rs

@@ -2,14 +2,4 @@ pub mod bot;
 pub mod head;
 pub mod time;
 pub mod state;
-// pub mod surface;
 pub mod graphics;
-
-// Create Surface
-// Create Graphics from map file and with surface as sample
-// Create bot from bot file
-// Create playback head
-// loop{
-// 		advance head
-// 		render frame
-// }

lib/src/state.rs

@@ -4,8 +4,6 @@ use strafesnet_common::run;
 use strafesnet_common::physics::Time as PhysicsTime;
 use strafesnet_roblox_bot_file::v0;
 
-use crate::bot::CompleteBot;
-
 pub struct Run{
 	run:run::RunState,
 	flag_reason:Option<v0::FlagReason>,
@@ -57,6 +55,8 @@ pub struct PlaybackState{
 	mouse_pos:v0::Vector2,
 	// EventType::Output
 	jump_count:u32,
+	angles:v0::Vector3,
+	angles_delta:glam::Vec3,
 	// EventType::Sound
 	// EventType::World
 	// EventType::Gravity
@@ -79,23 +79,31 @@ impl PlaybackState{
 			game_controls:v0::GameControls::empty(),
 			mouse_pos:v0::Vector2{x:0.0,y:0.0},
 			jump_count:0,
+			angles:v0::Vector3{x:0.0,y:0.0,z:0.0},
+			angles_delta:glam::Vec3::ZERO,
 			gravity:v0::Vector3{x:0.0,y:0.0,z:0.0},
 			runs:HashMap::new(),
 			style:v0::Style::Autohop,
 			absolute_sensitivity_enabled:false,
 			fov_y:1.0,
-			sens_x:1.0,
+			sens_x:0.3,
 			vertical_sensitivity_multipler:1.0,
-			turn_speed:1.0,
+			turn_speed:core::f64::consts::TAU/0.715588,
 		}
 	}
 	pub fn get_run(&self,mode:v0::ModeID)->Option<&Run>{
 		self.runs.get(&mode)
 	}
 	fn push_output(&mut self,event:&v0::OutputEvent){
+		// Jumps may occur during a substep
 		if event.tick_info.contains(v0::TickInfo::Jump){
 			self.jump_count+=1;
 		}
+		// Game tick "end", i.e. not a sub-step
+		if event.tick_info.contains(v0::TickInfo::TickEnd){
+			self.angles_delta=glam::vec3(event.angles.x,event.angles.y,event.angles.z)-glam::vec3(self.angles.x,self.angles.y,self.angles.z);
+			self.angles=event.angles;
+		}
 	}
 	fn push_input(&mut self,event:&v0::InputEvent){
 		self.game_controls=event.game_controls;
@@ -111,13 +119,13 @@ impl PlaybackState{
 				self.style=run_event_prepare.style;
 			},
 			v0::RunEvent::Start(run_event_zone)=>{
-				let time=PhysicsTime::raw((event.time*PhysicsTime::ONE_SECOND.get() as f64) as i64);
+				let time=crate::time::from_float(event.time).unwrap();
 				if let Some(run)=self.runs.get_mut(&run_event_zone.mode){
 					_=run.run.start(time);
 				}
 			},
 			v0::RunEvent::Finish(run_event_zone)=>{
-				let time=PhysicsTime::raw((event.time*PhysicsTime::ONE_SECOND.get() as f64) as i64);
+				let time=crate::time::from_float(event.time).unwrap();
 				if let Some(run)=self.runs.get_mut(&run_event_zone.mode){
 					_=run.run.finish(time);
 				}
@@ -179,7 +187,7 @@ impl PlaybackState{
 	fn push_setting(&mut self,event:&v0::SettingEvent){
 		match event{
 			v0::SettingEvent::FieldOfView(setting_event_field_of_view)=>{
-				self.fov_y=setting_event_field_of_view.fov;
+				self.fov_y=(setting_event_field_of_view.fov*0.5).to_radians().tan();
 			},
 			v0::SettingEvent::Sensitivity(setting_event_sensitivity)=>{
 				self.sens_x=setting_event_sensitivity.sensitivity;
@@ -195,16 +203,90 @@ impl PlaybackState{
 			},
 		}
 	}
-	pub(crate) fn process_event(&mut self,bot:&CompleteBot,event_type:v0::EventType,event_index:usize){
-		match event_type{
-			v0::EventType::Input=>self.push_input(&bot.timelines().input_events[event_index].event),
-			v0::EventType::Output=>self.push_output(&bot.timelines().output_events[event_index].event),
-			v0::EventType::Sound=>{},
-			v0::EventType::World=>{},
-			v0::EventType::Gravity=>self.push_gravity(&bot.timelines().gravity_events[event_index].event),
-			v0::EventType::Run=>self.push_run(&bot.timelines().run_events[event_index]),
-			v0::EventType::Camera=>{},
-			v0::EventType::Setting=>self.push_setting(&bot.timelines().setting_events[event_index].event),
+	pub(crate) fn process_head(&mut self,block:&v0::Block,head:&v0::Head){
+		// Avoid running the realtime events from the beginning.
+		// Run the preceding input event to initialize the state.
+		if let Some(index)=head.get_event_index(v0::EventType::Input).checked_sub(1)
+			&&let Some(event)=block.input_events.get(index)
+		{
+			self.push_input(&event.event);
+		}
+
+		// Helper function
+		fn is_output_tick_end(&(_,event):&(usize,&v0::Timed<v0::OutputEvent>))->bool{
+			event.event.tick_info.contains(v0::TickInfo::TickEnd)
+		}
+		// Run two preceding output events to flush out the default state.
+		let output_end_index=head.get_event_index(v0::EventType::Output);
+		let mut it=block.output_events[..output_end_index].iter().enumerate().rev();
+		// Find two TickEnd events before output_end_index
+		let _first=it.find(is_output_tick_end);
+		let second=it.find(is_output_tick_end);
+		// Get the index at the second event, if two TickEnd events don't exist then start at 0
+		let output_start_index=second.map_or(0,|(i,_)|i);
+		for event in &block.output_events[output_start_index..output_end_index]{
+			self.push_output(&event.event);
+		}
+
+		// for event in &bot.sound_events[0..head.get_event_index(v0::EventType::Sound)]{
+		// 	self.push_sound(&event.event);
+		// }
+
+		// Offline events have to be run from the beginning because they contain cumulative state.
+		// for event in &bot.world_events[0..head.get_event_index(v0::EventType::World)]{
+		// 	self.push_world(&event.event);
+		// }
+
+		// Except for gravity, only the most recent event is relevant.
+		if let Some(index)=head.get_event_index(v0::EventType::Gravity).checked_sub(1)
+			&&let Some(event)=block.gravity_events.get(index)
+		{
+			self.push_gravity(&event.event);
+		}
+		for event in &block.run_events[0..head.get_event_index(v0::EventType::Run)]{
+			self.push_run(event);
+		}
+		// for event in &bot.camera_events[0..head.get_event_index(v0::EventType::Camera)]{
+		// 	self.push_camera(&event.event);
+		// }
+		for event in &block.setting_events[0..head.get_event_index(v0::EventType::Setting)]{
+			self.push_setting(&event.event);
 		}
 	}
+	pub(crate) fn process_event(&mut self,block:&v0::Block,event_type:v0::EventType,event_index:usize){
+		match event_type{
+			v0::EventType::Input=>self.push_input(&block.input_events[event_index].event),
+			v0::EventType::Output=>self.push_output(&block.output_events[event_index].event),
+			v0::EventType::Sound=>{},
+			v0::EventType::World=>{},
+			v0::EventType::Gravity=>self.push_gravity(&block.gravity_events[event_index].event),
+			v0::EventType::Run=>self.push_run(&block.run_events[event_index]),
+			v0::EventType::Camera=>{},
+			v0::EventType::Setting=>self.push_setting(&block.setting_events[event_index].event),
+		}
+	}
+	pub const fn get_fov_y(&self)->f64{
+		let zoom_enabled=self.game_controls.contains(v0::GameControls::Zoom);
+		if zoom_enabled{self.fov_y*0.2}else{self.fov_y}
+	}
+	pub const fn get_sensitivity(&self)->glam::DVec2{
+		if self.absolute_sensitivity_enabled{
+			glam::dvec2(self.sens_x,self.sens_x*self.vertical_sensitivity_multipler)
+		}else{
+			let sens_x=self.sens_x*self.get_fov_y()/128.0;
+			glam::dvec2(sens_x,sens_x*self.vertical_sensitivity_multipler)
+		}
+	}
+	pub const fn get_controls(&self)->v0::GameControls{
+		self.game_controls
+	}
+	pub const fn get_jump_count(&self)->u32{
+		self.jump_count
+	}
+	pub const fn get_gravity(&self)->v0::Vector3{
+		self.gravity
+	}
+	pub const fn get_angles_delta(&self)->glam::Vec3{
+		self.angles_delta
+	}
 }

lib/src/surface.rs

@@ -1,2 +0,0 @@
-/// A render surface configuration, containing information such as resolution and pixel format
-pub struct Surface{}

native-player/Cargo.toml

@@ -4,11 +4,11 @@ version = "0.1.0"
 edition = "2024"
 
 [dependencies]
-glam = "0.31.0"
+glam.workspace = true
 pollster = "0.4.0"
 wgpu = "28.0.0"
 winit = "0.30.12"
-strafesnet_roblox_bot_player = { version = "0.1.0", path = "../lib" }
+strafesnet_roblox_bot_player.workspace = true
 strafesnet_common.workspace = true
 strafesnet_graphics.workspace = true
 strafesnet_roblox_bot_file.workspace = true

native-player/src/player.rs

@@ -1,7 +1,8 @@
 use strafesnet_common::instruction::TimedInstruction;
 use strafesnet_common::session::Time as SessionTime;
-use strafesnet_common::physics::Time as PhysicsTime;
-use strafesnet_roblox_bot_player::{bot::CompleteBot,graphics::Graphics,head::PlaybackHead};
+use strafesnet_common::timer::TimerState;
+use strafesnet_roblox_bot_player::{bot::CompleteBot,graphics::Graphics,head::{PlaybackHead,Time as PlaybackTime}};
+use strafesnet_graphics::surface::Surface;
 
 pub enum SessionControlInstruction{
 	SetPaused(bool),
@@ -28,62 +29,86 @@ fn speed_ratio(speed:i8)->strafesnet_common::integer::Ratio64{
 	}
 }
 
-pub struct PlayerWorker<'a>{
-	surface:wgpu::Surface<'a>,
-	graphics_thread:Graphics,
-	bot:Option<CompleteBot>,
+struct Playback{
+	bot:CompleteBot,
 	playback_head:PlaybackHead,
 	playback_speed:i8,
 }
+
+pub struct PlayerWorker<'a>{
+	graphics_thread:Graphics,
+	surface:Surface<'a>,
+	playback:Option<Playback>,
+}
 impl<'a> PlayerWorker<'a>{
 	pub fn new(
-		surface:wgpu::Surface<'a>,
 		graphics_thread:Graphics,
+		surface:Surface<'a>,
 	)->Self{
-		let playback_head=PlaybackHead::new(SessionTime::ZERO);
 		Self{
-			surface,
 			graphics_thread,
-			bot:None,
-			playback_head,
-			playback_speed:0,
+			surface,
+			playback:None,
 		}
 	}
-	pub fn send(&mut self,ins:TimedInstruction<Instruction,SessionTime>){
+	pub fn send(&mut self,device:&wgpu::Device,queue:&wgpu::Queue,ins:TimedInstruction<Instruction,SessionTime>){
 		match ins.instruction{
-			Instruction::SessionControl(SessionControlInstruction::SetPaused(paused))=>{
-				self.playback_head.set_paused(ins.time,paused);
+			Instruction::SessionControl(SessionControlInstruction::SetPaused(paused))=>if let Some(playback)=&mut self.playback{
+				playback.playback_head.set_paused(ins.time,paused);
 			},
-			Instruction::SessionControl(SessionControlInstruction::Restart)=>{
-				self.playback_head.seek_to(ins.time,PhysicsTime::ZERO);
+			Instruction::SessionControl(SessionControlInstruction::Restart)=>if let Some(playback)=&mut self.playback{
+				playback.playback_head.set_time(&playback.bot,ins.time,PlaybackTime::ZERO);
 			},
-			Instruction::SessionControl(SessionControlInstruction::SkipForward)=>{
-				self.playback_head.seek_forward(SessionTime::from_secs(2));
+			Instruction::SessionControl(SessionControlInstruction::SkipForward)=>if let Some(playback)=&mut self.playback{
+				let head_time=playback.playback_head.timer().clone().into_state().0.get_time(ins.time+SessionTime::from_secs(2));
+				playback.playback_head.set_time(&playback.bot,ins.time,head_time);
 			},
-			Instruction::SessionControl(SessionControlInstruction::SkipBack)=>{
-				self.playback_head.seek_backward(SessionTime::from_secs(2));
+			Instruction::SessionControl(SessionControlInstruction::SkipBack)=>if let Some(playback)=&mut self.playback{
+				let head_time=playback.playback_head.timer().clone().into_state().0.get_time(ins.time-SessionTime::from_secs(2));
+				playback.playback_head.set_time(&playback.bot,ins.time,head_time);
 			},
-			Instruction::SessionControl(SessionControlInstruction::DecreaseTimescale)=>{
-				self.playback_speed=self.playback_speed.saturating_sub(1).max(-27);
-				self.playback_head.set_scale(ins.time,speed_ratio(self.playback_speed));
+			Instruction::SessionControl(SessionControlInstruction::DecreaseTimescale)=>if let Some(playback)=&mut self.playback{
+				playback.playback_speed=playback.playback_speed.saturating_sub(1).max(-27);
+				playback.playback_head.set_scale(ins.time,speed_ratio(playback.playback_speed));
 			},
-			Instruction::SessionControl(SessionControlInstruction::IncreaseTimescale)=>{
-				self.playback_speed=self.playback_speed.saturating_add(1).min(27);
-				self.playback_head.set_scale(ins.time,speed_ratio(self.playback_speed));
+			Instruction::SessionControl(SessionControlInstruction::IncreaseTimescale)=>if let Some(playback)=&mut self.playback{
+				playback.playback_speed=playback.playback_speed.saturating_add(1).min(27);
+				playback.playback_head.set_scale(ins.time,speed_ratio(playback.playback_speed));
 			},
-			Instruction::Render=>if let Some(bot)=&self.bot{
-				self.playback_head.advance_time(bot,ins.time);
-				let (pos,angles)=self.playback_head.get_position_angles(bot,ins.time);
-				self.graphics_thread.render(&self.surface,pos,angles);
+			Instruction::Render=>if let Some(playback)=&mut self.playback{
+				playback.playback_head.advance_time(&playback.bot,ins.time);
+				let (pos,angles)=playback.playback_head.get_position_angles(&playback.bot,ins.time);
+
+				//this has to go deeper somehow
+				let frame=self.surface.new_frame(device);
+
+				let mut encoder=device.create_command_encoder(&wgpu::CommandEncoderDescriptor{label:None});
+
+				self.graphics_thread.encode_commands(&mut encoder,frame.view(),pos,angles);
+
+				queue.submit([encoder.finish()]);
+
+				frame.present();
 			},
-			Instruction::Resize(physical_size)=>{
-				self.graphics_thread.resize(&self.surface,glam::uvec2(physical_size.width,physical_size.height));
+			Instruction::Resize(physical_size)=>if let Some(playback)=&self.playback{
+				let fov_y=playback.playback_head.state().get_fov_y();
+				let fov_x=fov_y*physical_size.width as f64/physical_size.height as f64;
+				let fov=glam::vec2(fov_x as f32,fov_y as f32);
+				let size=glam::uvec2(physical_size.width,physical_size.height);
+				self.surface.configure(device,size);
+				self.graphics_thread.resize(device,size,fov);
 			},
 			Instruction::ChangeMap(complete_map)=>{
-				self.graphics_thread.change_map(&complete_map);
+				self.graphics_thread.change_map(device,queue,&complete_map);
 			},
 			Instruction::LoadReplay(bot)=>{
-				self.bot=Some(CompleteBot::new(bot));
+				let bot=CompleteBot::new(bot);
+				let playback_head=PlaybackHead::new(&bot,SessionTime::ZERO);
+				self.playback=Some(Playback{
+					bot,
+					playback_head,
+					playback_speed:0,
+				});
 			},
 		}
 	}

native-player/src/setup.rs

@@ -19,10 +19,10 @@ pub async fn setup_and_start(title:&str){
 
 	let adapter=setup::step3::pick_adapter(&instance,&surface).await.expect("No suitable GPU adapters found on the system!");
 
-	let (device,queue)=setup::step4::request_device(&adapter).await;
+	let (device,queue)=setup::step4::request_device(&adapter).await.unwrap();
 
 	let size=window.inner_size();
-	let config=setup::step5::configure_surface(&adapter,&device,&surface,(size.width,size.height));
+	let surface=setup::step5::configure_surface(&adapter,&device,surface,(size.width,size.height)).unwrap();
 
 	//dedicated thread to ping request redraw back and resize the window doesn't seem logical
 
@@ -32,7 +32,6 @@ pub async fn setup_and_start(title:&str){
 		device,
 		queue,
 		surface,
-		config,
 	);
 
 	for arg in std::env::args().skip(1){

native-player/src/window.rs

@@ -13,15 +13,20 @@ pub struct WindowContext<'a>{
 	simulation_paused:bool,
 	window:&'a winit::window::Window,
 	physics_thread:PlayerWorker<'a>,
+	device:wgpu::Device,
+	queue:wgpu::Queue,
 }
 
 impl WindowContext<'_>{
+	fn phys(&mut self,ins:TimedInstruction<crate::player::Instruction,strafesnet_common::session::Time>){
+		self.physics_thread.send(&self.device,&self.queue,ins);
+	}
 	fn window_event(&mut self,time:SessionTime,event:winit::event::WindowEvent){
 		match event{
 			winit::event::WindowEvent::DroppedFile(path)=>{
 				match crate::file::load(path.as_path()){
-					Ok(LoadFormat::Map(map))=>self.physics_thread.send(TimedInstruction{time,instruction:PhysicsWorkerInstruction::ChangeMap(map)}),
-					Ok(LoadFormat::Bot(bot))=>self.physics_thread.send(TimedInstruction{time,instruction:PhysicsWorkerInstruction::LoadReplay(bot)}),
+					Ok(LoadFormat::Map(map))=>self.phys(TimedInstruction{time,instruction:PhysicsWorkerInstruction::ChangeMap(map)}),
+					Ok(LoadFormat::Bot(bot))=>self.phys(TimedInstruction{time,instruction:PhysicsWorkerInstruction::LoadReplay(bot)}),
 					Err(e)=>println!("Failed to load file: {e}"),
 				}
 			},
@@ -31,7 +36,7 @@ impl WindowContext<'_>{
 					return;
 				}
 				//pause unpause
-				self.physics_thread.send(TimedInstruction{
+				self.phys(TimedInstruction{
 					time,
 					instruction:PhysicsWorkerInstruction::SessionControl(SessionControlInstruction::SetPaused(!state)),
 				});
@@ -74,7 +79,7 @@ impl WindowContext<'_>{
 							},
 							_=>None,
 						}{
-							self.physics_thread.send(TimedInstruction{
+							self.phys(TimedInstruction{
 								time,
 								instruction,
 							});
@@ -83,7 +88,7 @@ impl WindowContext<'_>{
 				}
 			},
 			winit::event::WindowEvent::Resized(size)=>{
-				self.physics_thread.send(
+				self.phys(
 					TimedInstruction{
 						time,
 						instruction:PhysicsWorkerInstruction::Resize(size)
@@ -92,7 +97,7 @@ impl WindowContext<'_>{
 			},
 			winit::event::WindowEvent::RedrawRequested=>{
 				self.window.request_redraw();
-				self.physics_thread.send(
+				self.phys(
 					TimedInstruction{
 						time,
 						instruction:PhysicsWorkerInstruction::Render
@@ -121,17 +126,19 @@ impl WindowContext<'_>{
 		window:&'a winit::window::Window,
 		device:wgpu::Device,
 		queue:wgpu::Queue,
-		surface:wgpu::Surface<'a>,
-		config:wgpu::SurfaceConfiguration,
+		surface:strafesnet_graphics::surface::Surface<'a>,
 	)->WindowContext<'a>{
-		let graphics=strafesnet_roblox_bot_player::graphics::Graphics::new(device,queue,config);
+		let size=surface.size();
+		let graphics=strafesnet_roblox_bot_player::graphics::Graphics::new(&device,&queue,size,surface.view_format());
 		WindowContext{
 			simulation_paused:false,
 			window,
 			physics_thread:crate::player::PlayerWorker::new(
-				surface,
 				graphics,
+				surface,
 			),
+			device,
+			queue,
 		}
 	}
 }

video-encoder/Cargo.toml

@@ -0,0 +1,14 @@
+[package]
+name = "video-encoder"
+version = "0.1.0"
+edition = "2024"
+
+[dependencies]
+glam.workspace = true
+wgpu = "28.0.0"
+strafesnet_roblox_bot_player.workspace = true
+strafesnet_common.workspace = true
+strafesnet_graphics.workspace = true
+strafesnet_roblox_bot_file.workspace = true
+strafesnet_snf.workspace = true
+vk-video = "0.2.0"

video-encoder/shaders/rgb_to_yuv.wgsl

@@ -0,0 +1,46 @@
+struct VertexOutput {
+	@builtin(position) position: vec4<f32>,
+}
+
+@vertex
+fn vs_main(@builtin(vertex_index) vertex_index: u32) -> VertexOutput {
+    // hacky way to draw a large triangle
+    let tmp1 = i32(vertex_index) / 2;
+    let tmp2 = i32(vertex_index) & 1;
+    var result:VertexOutput;
+    result.position=vec4<f32>(
+        f32(tmp1) * 4.0 - 1.0,
+        f32(tmp2) * 4.0 - 1.0,
+        1.0,
+        1.0
+    );
+    return result;
+}
+
+@group(0)
+@binding(0)
+var texture: texture_2d<f32>;
+@group(0)
+@binding(1)
+var texture_sampler: sampler;
+
+@fragment
+fn fs_main_y(input: VertexOutput) -> @location(0) f32 {
+	let conversion_weights = vec3<f32>(0.2126, 0.7152, 0.0722);
+	let color = textureSample(texture, texture_sampler, input.position.xy).rgb;
+
+	return clamp(dot(color, conversion_weights), 0.0, 1.0);
+}
+
+@fragment
+fn fs_main_uv(input: VertexOutput) -> @location(0) vec2<f32> {
+	let conversion_weights = mat3x2<f32>(
+		-0.1146, 0.5,
+		-0.3854, -0.4542,
+		0.5, -0.0458,
+	);
+	let conversion_bias = vec2<f32>(0.5, 0.5);
+	let color = textureSample(texture, texture_sampler, input.position.xy).rgb;
+
+	return clamp(conversion_weights * color + conversion_bias, vec2(0.0, 0.0), vec2(1.0, 1.0));
+}

video-encoder/src/main.rs

@@ -0,0 +1,5 @@
+mod setup;
+
+fn main(){
+	setup::setup_and_start();
+}

video-encoder/src/setup.rs

@@ -0,0 +1,367 @@
+use std::io::Write;
+use strafesnet_common::session::Time as SessionTime;
+
+pub fn setup_and_start(){
+	let vulkan_instance = vk_video::VulkanInstance::new().unwrap();
+	let vulkan_adapter = vulkan_instance.create_adapter(None).unwrap();
+	let vulkan_device = vulkan_adapter
+		.create_device(
+			wgpu::Features::TEXTURE_COMPRESSION_BC,
+			wgpu::ExperimentalFeatures::disabled(),
+			wgpu::Limits::defaults(),
+		)
+		.unwrap();
+
+	let size = glam::uvec2(1920,1080);
+	let target_framerate = 60;
+	let average_bitrate = 10_000_000;
+	let max_bitrate = 20_000_000;
+
+	let bot_file=include_bytes!("../../web-demo/bhop_marble_7cf33a64-7120-4514-b9fa-4fe29d9523d.qbot");
+	let map_file=include_bytes!("../../web-demo/bhop_marble_5692093612.snfm");
+
+	// decode
+	let timelines=strafesnet_roblox_bot_file::v0::read_all_to_block(std::io::Cursor::new(bot_file)).unwrap();
+	let map=strafesnet_snf::read_map(std::io::Cursor::new(map_file)).unwrap().into_complete_map().unwrap();
+
+	// playback
+	let bot=strafesnet_roblox_bot_player::bot::CompleteBot::new(timelines);
+	let mut playback_head=strafesnet_roblox_bot_player::head::PlaybackHead::new(&bot,SessionTime::ZERO);
+
+	let mut wgpu_state = WgpuState::new(
+		vulkan_device.wgpu_device(),
+		vulkan_device.wgpu_queue(),
+		size,
+	);
+
+	wgpu_state.change_map(&map);
+
+	let mut encoder = vulkan_device
+		.create_wgpu_textures_encoder(
+			vulkan_device
+				.encoder_parameters_high_quality(
+					vk_video::parameters::VideoParameters {
+						width:size.x.try_into().unwrap(),
+						height:size.y.try_into().unwrap(),
+						target_framerate:target_framerate.into(),
+					},
+					vk_video::parameters::RateControl::VariableBitrate {
+						average_bitrate,
+						max_bitrate,
+						virtual_buffer_size: std::time::Duration::from_secs(2),
+					},
+				)
+				.unwrap(),
+		)
+		.unwrap();
+
+	let mut output_file = std::fs::File::create("output.h264").unwrap();
+
+	let duration = bot.duration();
+	for i in 0..duration.get()*target_framerate as i64/SessionTime::ONE_SECOND.get() {
+		let time=SessionTime::raw(i*SessionTime::ONE_SECOND.get()/target_framerate as i64);
+		playback_head.advance_time(&bot,time);
+		let (pos,angles)=playback_head.get_position_angles(&bot,time);
+		wgpu_state.render(pos,angles);
+
+		let res = unsafe {
+			encoder
+				.encode(
+					vk_video::Frame {
+						data: wgpu_state.video_texture.clone(),
+						pts: None,
+					},
+					false,
+				)
+				.unwrap()
+		};
+
+		output_file.write_all(&res.data).unwrap();
+	}
+}
+
+struct WgpuState {
+	device: wgpu::Device,
+	queue: wgpu::Queue,
+	// graphics output
+	graphics:strafesnet_roblox_bot_player::graphics::Graphics,
+	// not sure if this needs to stay bound to keep the TextureView valid
+	#[expect(unused)]
+	graphics_texture: wgpu::Texture,
+	graphics_texture_view: wgpu::TextureView,
+	// video output
+	video_texture: wgpu::Texture,
+	y_renderer: PlaneRenderer,
+	uv_renderer: PlaneRenderer,
+}
+
+impl WgpuState {
+	fn new(
+		device: wgpu::Device,
+		queue: wgpu::Queue,
+		size: glam::UVec2,
+	) -> WgpuState {
+		const FORMAT: wgpu::TextureFormat = wgpu::TextureFormat::Bgra8UnormSrgb;
+		let graphics = strafesnet_roblox_bot_player::graphics::Graphics::new(&device,&queue,size,FORMAT);
+
+		let shader = wgpu::include_wgsl!("../shaders/rgb_to_yuv.wgsl");
+		let shader = device.create_shader_module(shader);
+
+		let graphics_texture_bind_group_layout=device.create_bind_group_layout(&wgpu::BindGroupLayoutDescriptor{
+			label:Some("RGB Bind Group Layout"),
+			entries:&[
+				wgpu::BindGroupLayoutEntry{
+					binding:0,
+					visibility:wgpu::ShaderStages::FRAGMENT,
+					ty:wgpu::BindingType::Texture{
+						sample_type:wgpu::TextureSampleType::Float{filterable:true},
+						multisampled:false,
+						view_dimension:wgpu::TextureViewDimension::D2,
+					},
+					count:None,
+				},
+				wgpu::BindGroupLayoutEntry{
+					binding:1,
+					visibility:wgpu::ShaderStages::FRAGMENT,
+					ty:wgpu::BindingType::Sampler(wgpu::SamplerBindingType::Filtering),
+					count:None,
+				},
+			],
+		});
+
+		let graphics_texture=device.create_texture(&wgpu::TextureDescriptor{
+			label:Some("RGB texture"),
+			format:FORMAT,
+			size:wgpu::Extent3d{
+				width:size.x,
+				height:size.y,
+				depth_or_array_layers:1,
+			},
+			mip_level_count:1,
+			sample_count:1,
+			dimension:wgpu::TextureDimension::D2,
+			usage:wgpu::TextureUsages::RENDER_ATTACHMENT|wgpu::TextureUsages::TEXTURE_BINDING,
+			view_formats:&[],
+		});
+		let graphics_texture_view = graphics_texture.create_view(&wgpu::TextureViewDescriptor {
+			label: Some("RGB texture view"),
+			aspect: wgpu::TextureAspect::All,
+			usage: Some(wgpu::TextureUsages::RENDER_ATTACHMENT|wgpu::TextureUsages::TEXTURE_BINDING),
+			..Default::default()
+		});
+		let clamp_sampler=device.create_sampler(&wgpu::SamplerDescriptor{
+			label:Some("Clamp Sampler"),
+			address_mode_u:wgpu::AddressMode::ClampToEdge,
+			address_mode_v:wgpu::AddressMode::ClampToEdge,
+			address_mode_w:wgpu::AddressMode::ClampToEdge,
+			mag_filter:wgpu::FilterMode::Linear,
+			min_filter:wgpu::FilterMode::Linear,
+			mipmap_filter:wgpu::MipmapFilterMode::Linear,
+			..Default::default()
+		});
+		let graphics_texture_bind_group=device.create_bind_group(&wgpu::BindGroupDescriptor{
+			layout:&graphics_texture_bind_group_layout,
+			entries:&[
+				wgpu::BindGroupEntry{
+					binding:0,
+					resource:wgpu::BindingResource::TextureView(&graphics_texture_view),
+				},
+				wgpu::BindGroupEntry{
+					binding:1,
+					resource:wgpu::BindingResource::Sampler(&clamp_sampler),
+				},
+			],
+			label:Some("Graphics Texture"),
+		});
+
+		let pipeline_layout = device.create_pipeline_layout(&wgpu::PipelineLayoutDescriptor {
+			label: Some("wgpu pipeline layout"),
+			bind_group_layouts: &[
+				&graphics_texture_bind_group_layout
+			],
+			immediate_size: 0,
+		});
+
+		let video_texture = device.create_texture(&wgpu::TextureDescriptor {
+			label: Some("wgpu render target"),
+			format: wgpu::TextureFormat::NV12,
+			usage: wgpu::TextureUsages::RENDER_ATTACHMENT | wgpu::TextureUsages::COPY_SRC,
+			dimension: wgpu::TextureDimension::D2,
+			sample_count: 1,
+			view_formats: &[],
+			mip_level_count: 1,
+			size: wgpu::Extent3d {
+				width: size.x,
+				height: size.y,
+				depth_or_array_layers: 1,
+			},
+		});
+
+		let y_renderer = PlaneRenderer::new(
+			&device,
+			&pipeline_layout,
+			&shader,
+			"fs_main_y",
+			&video_texture,
+			wgpu::TextureAspect::Plane0,
+			graphics_texture_bind_group.clone(),
+		);
+		let uv_renderer = PlaneRenderer::new(
+			&device,
+			&pipeline_layout,
+			&shader,
+			"fs_main_uv",
+			&video_texture,
+			wgpu::TextureAspect::Plane1,
+			graphics_texture_bind_group,
+		);
+
+		WgpuState {
+			device,
+			queue,
+			graphics,
+			graphics_texture,
+			graphics_texture_view,
+			video_texture,
+			y_renderer,
+			uv_renderer,
+		}
+	}
+
+	fn change_map(&mut self,map:&strafesnet_common::map::CompleteMap){
+		self.graphics.change_map(&self.device,&self.queue,map);
+	}
+
+	fn render(&mut self,pos:glam::Vec3,angles:glam::Vec2) {
+		let mut encoder = self
+			.device
+			.create_command_encoder(&wgpu::CommandEncoderDescriptor {
+				label: Some("wgpu encoder"),
+			});
+
+		self.graphics.encode_commands(&mut encoder,&self.graphics_texture_view,pos,angles);
+
+		self.y_renderer.render(&mut encoder);
+		self.uv_renderer.render(&mut encoder);
+
+		encoder.transition_resources(
+			[].into_iter(),
+			[wgpu::TextureTransition {
+				texture: &self.video_texture,
+				state: wgpu::TextureUses::COPY_SRC,
+				selector: None,
+			}]
+			.into_iter(),
+		);
+
+		let buffer = encoder.finish();
+
+		self.queue.submit([buffer]);
+	}
+}
+
+struct PlaneRenderer {
+	graphics_texture_bind_group: wgpu::BindGroup,
+	pipeline: wgpu::RenderPipeline,
+	plane: wgpu::TextureAspect,
+	plane_view: wgpu::TextureView,
+}
+
+impl PlaneRenderer {
+	fn new(
+		device: &wgpu::Device,
+		pipeline_layout: &wgpu::PipelineLayout,
+		shader: &wgpu::ShaderModule,
+		fragment_entry_point: &str,
+		texture: &wgpu::Texture,
+		plane: wgpu::TextureAspect,
+		graphics_texture_bind_group: wgpu::BindGroup,
+	) -> Self {
+		let format = texture.format().aspect_specific_format(plane).unwrap();
+		let pipeline = device.create_render_pipeline(&wgpu::RenderPipelineDescriptor {
+			label: Some("wgpu pipeline"),
+			layout: Some(pipeline_layout),
+			cache: None,
+			vertex: wgpu::VertexState {
+				module: shader,
+				buffers: &[],
+				entry_point: None,
+				compilation_options: Default::default(),
+			},
+			fragment: Some(wgpu::FragmentState {
+				module: shader,
+				entry_point: Some(fragment_entry_point),
+				compilation_options: Default::default(),
+				targets: &[Some(wgpu::ColorTargetState {
+					blend: None,
+					format,
+					write_mask: wgpu::ColorWrites::ALL,
+				})],
+			}),
+			primitive: wgpu::PrimitiveState {
+				topology: wgpu::PrimitiveTopology::TriangleList,
+				cull_mode: Some(wgpu::Face::Back),
+				polygon_mode: wgpu::PolygonMode::Fill,
+				front_face: wgpu::FrontFace::Ccw,
+				conservative: false,
+				unclipped_depth: false,
+				strip_index_format: None,
+			},
+			multiview_mask: None,
+			multisample: wgpu::MultisampleState {
+				count: 1,
+				mask: !0,
+				alpha_to_coverage_enabled: false,
+			},
+			depth_stencil: None,
+		});
+
+		let plane_view = texture.create_view(&wgpu::TextureViewDescriptor {
+			label: Some("wgpu render target plane view"),
+			aspect: plane,
+			usage: Some(wgpu::TextureUsages::RENDER_ATTACHMENT),
+			..Default::default()
+		});
+
+		Self {
+			graphics_texture_bind_group,
+			pipeline,
+			plane,
+			plane_view,
+		}
+	}
+
+	fn render(&self, encoder: &mut wgpu::CommandEncoder) {
+		let clear_color = match self.plane {
+			wgpu::TextureAspect::Plane0 => wgpu::Color::BLACK,
+			wgpu::TextureAspect::Plane1 => wgpu::Color {
+				r: 0.5,
+				g: 0.5,
+				b: 0.0,
+				a: 1.0,
+			},
+			_ => unreachable!(),
+		};
+
+		let mut render_pass = encoder.begin_render_pass(&wgpu::RenderPassDescriptor {
+			label: Some("wgpu render pass"),
+			timestamp_writes: None,
+			occlusion_query_set: None,
+			depth_stencil_attachment: None,
+			color_attachments: &[Some(wgpu::RenderPassColorAttachment {
+				view: &self.plane_view,
+				ops: wgpu::Operations {
+					load: wgpu::LoadOp::Clear(clear_color),
+					store: wgpu::StoreOp::Store,
+				},
+				resolve_target: None,
+				depth_slice: None,
+			})],
+			multiview_mask: None,
+		});
+
+		render_pass.set_bind_group(0,&self.graphics_texture_bind_group,&[]);
+		render_pass.set_pipeline(&self.pipeline);
+		render_pass.draw(0..3, 0..1);
+	}
+}

wasm-module/Cargo.toml

@@ -6,8 +6,13 @@ edition = "2024"
 [lib]
 crate-type = ["cdylib"]
 
+[features]
+default = []
+webgl = ["wgpu/webgl"]
+
 [dependencies]
-strafesnet_roblox_bot_player = { version = "0.1.0", path = "../lib" }
+glam.workspace = true
+strafesnet_roblox_bot_player.workspace = true
 strafesnet_common.workspace = true
 strafesnet_graphics.workspace = true
 strafesnet_roblox_bot_file.workspace = true
@@ -15,7 +20,7 @@ strafesnet_snf.workspace = true
 wasm-bindgen = "0.2.108"
 wasm-bindgen-futures = "0.4.58"
 web-sys = { version = "0.3.85", features = ["HtmlCanvasElement"] }
-wgpu = "28.0.0"
+wgpu = { version = "28.0.0" }
 
 [package.metadata.wasm-pack.profile.release]
 wasm-opt = ["-Oz", "--enable-bulk-memory","--enable-nontrapping-float-to-int"]

wasm-module/src/lib.rs

@@ -1,11 +1,8 @@
 use wasm_bindgen::prelude::wasm_bindgen;
-use wasm_bindgen::JsValue;
+use wasm_bindgen::JsError;
 use strafesnet_roblox_bot_file::v0;
 use strafesnet_roblox_bot_player::{bot,head,time,graphics};
-use strafesnet_graphics::setup;
-use strafesnet_common::physics::Time as PhysicsTime;
-
-mod ratio;
+use strafesnet_graphics::{setup,surface};
 
 // Hack to keep the code compiling,
 // SurfaceTarget::Canvas is not available in IDE for whatever reason.
@@ -25,21 +22,30 @@ impl From<ToSurfaceTarget> for wgpu::SurfaceTarget<'static>{
 #[wasm_bindgen]
 pub struct Graphics{
 	graphics:graphics::Graphics,
-	surface:wgpu::Surface<'static>,
+	surface:surface::Surface<'static>,
+	device:wgpu::Device,
+	queue:wgpu::Queue,
 }
 #[wasm_bindgen]
-pub async fn setup_graphics(canvas:web_sys::HtmlCanvasElement)->Graphics{
-	let size=(canvas.width(),canvas.height());
+pub async fn setup_graphics(canvas:web_sys::HtmlCanvasElement)->Result<Graphics,JsError>{
+	let size=glam::uvec2(canvas.width(),canvas.height());
 
-	let instance=setup::step1::create_instance();
-	let surface=setup::step2::create_surface(&instance,ToSurfaceTarget(canvas)).unwrap();
-	let adapter=setup::step3::pick_adapter(&instance,&surface).await.expect("No suitable GPU adapters found on the system!");
-	let (device,queue)=setup::step4::request_device(&adapter).await;
-	let config=setup::step5::configure_surface(&adapter,&device,&surface,size);
-	Graphics{
-		graphics:graphics::Graphics::new(device,queue,config),
-		surface:surface,
-	}
+	let instance_desc=wgpu::InstanceDescriptor::from_env_or_default();
+	let instance=wgpu::util::new_instance_with_webgpu_detection(&instance_desc).await;
+	let surface=setup::step2::create_surface(&instance,ToSurfaceTarget(canvas)).map_err(|e|JsError::new(&e.to_string()))?;
+	let adapter=instance.request_adapter(&wgpu::RequestAdapterOptions{
+		power_preference:wgpu::PowerPreference::HighPerformance,
+		force_fallback_adapter:false,
+		compatible_surface:Some(&surface),
+	}).await.map_err(|e|JsError::new(&e.to_string()))?;
+	let (device,queue)=setup::step4::request_device(&adapter).await.map_err(|e|JsError::new(&e.to_string()))?;
+	let surface=setup::step5::configure_surface(&adapter,&device,surface,(size.x,size.y)).map_err(|e|JsError::new(&e.to_string()))?;
+	Ok(Graphics{
+		graphics:graphics::Graphics::new(&device,&queue,size,surface.view_format()),
+		surface,
+		device,
+		queue,
+	})
 }
 #[wasm_bindgen]
 impl Graphics{
@@ -47,15 +53,21 @@ impl Graphics{
 	pub fn render(&mut self,bot:&CompleteBot,head:&PlaybackHead,time:f64){
 		let time=time::from_float(time).unwrap();
 		let (pos,angles)=head.head.get_position_angles(&bot.bot,time);
-		self.graphics.render(&self.surface,pos,angles);
+		let frame=self.surface.new_frame(&self.device);
+		let mut encoder=self.device.create_command_encoder(&wgpu::CommandEncoderDescriptor{label:None});
+		self.graphics.encode_commands(&mut encoder,frame.view(),pos,angles);
+		self.queue.submit([encoder.finish()]);
+		frame.present();
 	}
 	#[wasm_bindgen]
-	pub fn resize(&mut self,width:u32,height:u32){
-		self.graphics.resize(&self.surface,[width,height].into());
+	pub fn resize(&mut self,width:u32,height:u32,fov_slope_x:f32,fov_slope_y:f32){
+		let size=[width,height].into();
+		self.surface.configure(&self.device,size);
+		self.graphics.resize(&self.device,size,[fov_slope_x as f32,fov_slope_y as f32].into());
 	}
 	#[wasm_bindgen]
 	pub fn change_map(&mut self,map:&CompleteMap){
-		self.graphics.change_map(&map.map);
+		self.graphics.change_map(&self.device,&self.queue,&map.map);
 	}
 }
 
@@ -66,20 +78,20 @@ pub struct CompleteBot{
 #[wasm_bindgen]
 impl CompleteBot{
 	#[wasm_bindgen(constructor)]
-	pub fn new(data:&[u8])->Result<Self,JsValue>{
-		let timelines=v0::read_all_to_block(std::io::Cursor::new(data)).map_err(|e|JsValue::from_str(&e.to_string()))?;
+	pub fn new(data:&[u8])->Result<Self,JsError>{
+		let timelines=v0::read_all_to_block(std::io::Cursor::new(data)).map_err(|e|JsError::new(&e.to_string()))?;
 		Ok(Self{
 			bot:bot::CompleteBot::new(timelines),
 		})
 	}
 	#[wasm_bindgen]
 	pub fn duration(&self)->f64{
-		self.bot.duration().get() as f64/PhysicsTime::ONE_SECOND.get() as f64
+		self.bot.duration().into()
 	}
 	#[wasm_bindgen]
 	pub fn run_duration(&self,mode_id:u32)->Option<f64>{
 		let mode=v0::ModeID(mode_id);
-		Some(self.bot.run_duration(mode)?.get() as f64/PhysicsTime::ONE_SECOND.get() as f64)
+		Some(self.bot.run_duration(mode)?.into())
 	}
 }
 
@@ -90,11 +102,11 @@ pub struct CompleteMap{
 #[wasm_bindgen]
 impl CompleteMap{
 	#[wasm_bindgen(constructor)]
-	pub fn new(data:&[u8])->Result<Self,JsValue>{
+	pub fn new(data:&[u8])->Result<Self,JsError>{
 		let map=strafesnet_snf::read_map(std::io::Cursor::new(data))
-			.map_err(|e|JsValue::from_str(&e.to_string()))?
+			.map_err(|e|JsError::new(&e.to_string()))?
 			.into_complete_map()
-			.map_err(|e|JsValue::from_str(&e.to_string()))?;
+			.map_err(|e|JsError::new(&e.to_string()))?;
 		Ok(Self{
 			map,
 		})
@@ -108,11 +120,11 @@ pub struct PlaybackHead{
 #[wasm_bindgen]
 impl PlaybackHead{
 	#[wasm_bindgen(constructor)]
-	pub fn new(time:f64)->Result<Self,JsValue>{
+	pub fn new(bot:&CompleteBot,time:f64)->Self{
 		let time=time::from_float(time).unwrap();
-		Ok(Self{
-			head:head::PlaybackHead::new(time),
-		})
+		Self{
+			head:head::PlaybackHead::new(&bot.bot,time),
+		}
 	}
 	#[wasm_bindgen]
 	pub fn advance_time(&mut self,bot:&CompleteBot,time:f64){
@@ -120,12 +132,40 @@ impl PlaybackHead{
 		self.head.advance_time(&bot.bot,time);
 	}
 	#[wasm_bindgen]
+	pub fn set_paused(&mut self,time:f64,paused:bool){
+		let time=time::from_float(time).unwrap();
+		self.head.set_paused(time,paused);
+	}
+	#[wasm_bindgen]
+	pub fn get_scale(&mut self)->f64{
+		let scale=self.head.get_scale();
+		scale.num() as f64/scale.den() as f64
+	}
+	#[wasm_bindgen]
+	pub fn set_scale(&mut self,time:f64,scale:f64){
+		let time=time::from_float(time).unwrap();
+		self.head.set_scale(time,scale.try_into().unwrap());
+	}
+	#[wasm_bindgen]
+	pub fn get_head_time(&self,time:f64)->f64{
+		let time=time::from_float(time).unwrap();
+		let time=self.head.time(time);
+		time.into()
+	}
+	/// Set the playback head position to new_time.
+	#[wasm_bindgen]
+	pub fn set_head_time(&mut self,bot:&CompleteBot,time:f64,new_time:f64){
+		let time=time::from_float(time).unwrap();
+		let new_time=time::from_float(new_time).unwrap();
+		self.head.set_time(&bot.bot,time,new_time);
+	}
+	#[wasm_bindgen]
 	pub fn get_run_time(&self,bot:&CompleteBot,time:f64,mode_id:u32)->Option<f64>{
 		let time=time::from_float(time).unwrap();
-		let time=self.head.time(&bot.bot,time);
+		let time=bot.bot.time(self.head.time(time));
 		let mode=v0::ModeID(mode_id);
 		let run_time=self.head.state().get_run(mode)?.time(time);
-		Some(run_time.get() as f64/strafesnet_common::run::Time::ONE_SECOND.get() as f64)
+		Some(run_time.into())
 	}
 	#[wasm_bindgen]
 	pub fn is_run_in_progress(&self,mode_id:u32)->Option<bool>{
@@ -138,30 +178,31 @@ impl PlaybackHead{
 		Some(self.head.state().get_run(mode)?.is_finished())
 	}
 	#[wasm_bindgen]
-	pub fn set_paused(&mut self,time:f64,paused:bool){
+	pub fn get_fov_slope_y(&self)->f64{
+		self.head.state().get_fov_y()
+	}
+	#[wasm_bindgen]
+	pub fn get_speed(&self,bot:&CompleteBot,time:f64)->f32{
 		let time=time::from_float(time).unwrap();
-		self.head.set_paused(time,paused);
+		let velocity=self.head.get_velocity(&bot.bot,time);
+
+		use glam::Vec3Swizzles;
+		velocity.xz().length()
 	}
 	#[wasm_bindgen]
-	pub fn set_scale(&mut self,time:f64,scale:f64){
+	pub fn get_game_controls(&self)->u32{
+		self.head.state().get_controls().bits()
+	}
+	/// Returns an array of [pitch, yaw, roll] in radians.  Yaw is not restricted to any particular range.
+	#[wasm_bindgen]
+	pub fn get_angles(&self,bot:&CompleteBot,time:f64)->Vec<f32>{
 		let time=time::from_float(time).unwrap();
-		let scale=crate::ratio::ratio_from_float(scale).unwrap();
-		self.head.set_scale(time,scale);
+		let angles=self.head.get_angles(&bot.bot,time);
+		angles.to_array().to_vec()
 	}
+	/// Returns the camera angles yaw delta between the last game tick and the most recent game tick.
 	#[wasm_bindgen]
-	pub fn seek_to(&mut self,time:f64,new_time:f64){
-		let time=time::from_float(time).unwrap();
-		let new_time=time::from_float(new_time).unwrap();
-		self.head.seek_to(time,new_time);
-	}
-	#[wasm_bindgen]
-	pub fn seek_forward(&mut self,time_offset:f64){
-		let time_offset=time::from_float(time_offset).unwrap();
-		self.head.seek_forward(time_offset);
-	}
-	#[wasm_bindgen]
-	pub fn seek_backward(&mut self,time_offset:f64){
-		let time_offset=time::from_float(time_offset).unwrap();
-		self.head.seek_backward(time_offset);
+	pub fn get_angles_yaw_delta(&self)->f32{
+		self.head.state().get_angles_delta().y
 	}
 }

wasm-module/src/ratio.rs

@@ -1,130 +0,0 @@
-use strafesnet_common::integer::Ratio64;
-
-#[derive(Debug)]
-pub enum RatioFromFloatError{
-	Nan,
-	Overflow,
-	Underflow,
-}
-
-fn f64_into_parts(f: f64) -> (u64, i16, i8) {
-	let bits: u64 = f.to_bits();
-	let sign: i8 = if bits >> 63 == 0 { 1 } else { -1 };
-	let mut exponent: i16 = ((bits >> 52) & 0x7ff) as i16;
-	let mantissa = if exponent == 0 {
-		(bits & 0xfffffffffffff) << 1
-	} else {
-		(bits & 0xfffffffffffff) | 0x10000000000000
-	};
-	// Exponent bias + mantissa shift
-	exponent -= 1023 + 52;
-	(mantissa, exponent, sign)
-}
-
-pub fn ratio_from_float(value:f64)->Result<Ratio64,RatioFromFloatError>{
-	// Handle special values first
-	match value.classify(){
-		core::num::FpCategory::Nan=>return Err(RatioFromFloatError::Nan),
-		core::num::FpCategory::Zero=>return Ok(Ratio64::ZERO),
-		core::num::FpCategory::Subnormal
-		|core::num::FpCategory::Normal
-		|core::num::FpCategory::Infinite=>{
-			if value<i64::MIN as f64{
-				return Err(RatioFromFloatError::Underflow);
-			}
-			if (i64::MAX as f64)<value{
-				return Err(RatioFromFloatError::Overflow);
-			}
-		}
-	}
-
-	// value = sign * mantissa * 2 ^ exponent
-	let (mantissa,exponent,sign)=f64_into_parts(value);
-
-	if 0<=exponent{
-		// we know value < i64::MIN, so it must just be an integer.
-		return Ok(Ratio64::new((sign as i64*mantissa as i64)<<exponent,1).unwrap());
-	}
-
-	if exponent< -62-52{
-		// very small number is not representable
-		return Ok(Ratio64::ZERO);
-	}
-
-	if -63<exponent{
-		// exactly representable
-		return Ok(Ratio64::new(sign as i64*mantissa as i64,1<<-exponent).unwrap());
-	}
-
-	// the denominator is necessarily bigger than the numerator at this point.
-
-	// create exact float num/den ratio
-	let mut in_num=mantissa as u128;
-	let mut in_den=1u128<<-exponent;
-
-	// a+b*c
-	fn ma(a:i64,b:i64,c:i64)->Option<i64>{
-		a.checked_add(b.checked_mul(c)?)
-	}
-
-	let mut p_prev=1i64;
-	let mut q_prev=0i64;
-	let mut p_cur=0i64;
-	let mut q_cur=1i64;
-
-	// compute continued fraction
-	loop{
-		let whole=in_den/in_num;
-
-		if whole==0{
-			// we have depleted the input fraction and created an exact representation
-			break;
-		}
-
-		if (i64::MAX as u128)<whole{
-			// cannot continue fraction
-			break;
-		}
-
-		let Some(p_next)=ma(p_prev,p_cur,whole as i64)else{
-			// overflow
-			break;
-		};
-		let Some(q_next)=ma(q_prev,q_cur,whole as i64)else{
-			// overflow
-			break;
-		};
-
-		p_prev=p_cur;
-		q_prev=q_cur;
-		p_cur=p_next;
-		q_cur=q_next;
-		(in_num,in_den)=(in_den-in_num*whole,in_num);
-	}
-
-	Ok(Ratio64::new(p_cur,q_cur as u64).unwrap())
-}
-
-#[cfg(test)]
-fn req(r0:Ratio64,r1:Ratio64){
-	println!("r0={r0:?} r1={r1:?}");
-	assert_eq!(r0.num(),r1.num(),"Nums not eq");
-	assert_eq!(r0.den(),r1.den(),"Dens not eq");
-}
-
-#[test]
-fn test(){
-	req(ratio_from_float(2.0).unwrap(),Ratio64::new(2,1).unwrap());
-	req(ratio_from_float(1.0).unwrap(),Ratio64::new(1,1).unwrap());
-	req(ratio_from_float(0.5).unwrap(),Ratio64::new(1,2).unwrap());
-	req(ratio_from_float(1.1).unwrap(),Ratio64::new(2476979795053773,2251799813685248).unwrap());
-	req(ratio_from_float(0.8).unwrap(),Ratio64::new(3602879701896397,4503599627370496).unwrap());
-	req(ratio_from_float(0.61).unwrap(),Ratio64::new(5494391545392005,9007199254740992).unwrap());
-	req(ratio_from_float(0.01).unwrap(),Ratio64::new(5764607523034235,576460752303423488).unwrap());
-	req(ratio_from_float(0.001).unwrap(),Ratio64::new(1152921504606847,1152921504606846976).unwrap());
-	req(ratio_from_float(0.00001).unwrap(),Ratio64::new(89605456633725,8960545663372499267).unwrap());
-	req(ratio_from_float(0.00000000001).unwrap(),Ratio64::new(35204848,3520484800000000213).unwrap());
-	req(ratio_from_float(0.000000000000000001).unwrap(),Ratio64::new(2,1999999999999999857).unwrap());
-	req(ratio_from_float(2222222222222.0).unwrap(),Ratio64::new(2222222222222,1).unwrap());
-	req(ratio_from_float(core::f64::consts::PI).unwrap(),Ratio64::new(884279719003555,281474976710656).unwrap());
-}

web-demo/player.js

@@ -16,7 +16,7 @@ const canvas = document.getElementById("viewport");
 const graphics = await setup_graphics(canvas);
 const bot = new CompleteBot(new Uint8Array(await b.arrayBuffer()));
 const map = new CompleteMap(new Uint8Array(await m.arrayBuffer()));
-const playback = new PlaybackHead(0);
+const playback = new PlaybackHead(bot, 0);
 
 graphics.change_map(map);
 
@@ -51,19 +51,27 @@ function set_scale(new_scale) {
 	control_speed.value = `${scale.toPrecision(3)}x`;
 }
 
+const SEEK_DURATION = 1.0;
+
 // Controls
 document.getElementById("control_reset").addEventListener("click", (e) => {
-	playback.seek_to(elapsed(), 0.0);
+	playback.set_head_time(bot, elapsed(), 0.0);
 });
 document.getElementById("control_pause").addEventListener("click", (e) => {
 	paused = !paused;
 	playback.set_paused(elapsed(), paused);
 });
 document.getElementById("control_forward").addEventListener("click", (e) => {
-	playback.seek_forward(2.0);
+	const time_now = elapsed();
+	const playback_time = playback.get_head_time(time_now);
+	const time_offset = playback.get_scale() * SEEK_DURATION;
+	playback.set_head_time(bot, time_now, playback_time + time_offset);
 });
 document.getElementById("control_backward").addEventListener("click", (e) => {
-	playback.seek_backward(2.0);
+	const time_now = elapsed();
+	const playback_time = playback.get_head_time(time_now);
+	const time_offset = playback.get_scale() * SEEK_DURATION;
+	playback.set_head_time(bot, time_now, playback_time - time_offset);
 });
 document.getElementById("control_slower").addEventListener("click", (e) => {
 	set_scale((scale * 4) / 5);
@@ -111,7 +119,9 @@ requestAnimationFrame(animate);
 function resize() {
 	canvas.width = canvas.clientWidth;
 	canvas.height = canvas.clientHeight;
-	graphics.resize(canvas.width, canvas.height);
+	const fov_y = playback.get_fov_slope_y();
+	const fov_x = (fov_y * canvas.width) / canvas.height;
+	graphics.resize(canvas.width, canvas.height, fov_x, fov_y);
 }
 window.addEventListener("resize", resize);
 resize();