use std::collections::HashMap; // Credit of most code to https://sotrh.github.io/learn-wgpu/ since I'm not familiar with wgpu use std::sync::Arc; use glam::camera::lh::proj::directx::perspective; use wgpu::util::DeviceExt; use glam::prelude::*; struct Controller { buttons: HashMap, keys: HashMap, mouse: Vec2, } impl Controller { fn new() -> Controller { Controller { buttons: Default::default(), keys: HashMap::new(), mouse: Vec2::new(0.0,0.0), } } } struct Camera { frame: Affine3A, aspect_ratio: f32, z_near: f32, z_far: f32, fov_y: f32, } impl Camera { fn view(&self) -> Mat4 { let projection = perspective(self.fov_y, self.aspect_ratio, self.z_near, self.z_far); projection * self.frame.inverse() } fn new(window: &Arc) -> Camera { Camera { aspect_ratio: window.inner_size().width as f32 / window.inner_size().height as f32, frame: Affine3A::IDENTITY, fov_y: 90.0, z_near: 0.1, z_far: 1000.0 } } fn resize(&mut self, window: &Arc) { self.aspect_ratio = window.inner_size().width as f32 / window.inner_size().height as f32 } fn control(&mut self, delta: Vec3) { self.frame = self.frame * Affine3A::from_translation(delta); } fn rotate(&mut self, yaw: f32, pitch: f32) { let (mut y,mut x,z) = self.frame.matrix3.to_euler(EulerRot::YXZ); x = (x + pitch * 0.005).clamp(-1.4,1.4); y = y + yaw * 0.005; self.frame.matrix3 = Mat3A::from_euler(EulerRot::YXZ,y,x,z); } } const VERTICES: &[Vertex] = &[ // Changed Vertex { position: [-0.5,-0.5,-0.5], tex_coords: [0,0]} ]; const INDICES: &[u16] = &[ 0, 1, 4, 1, 2, 4, 2, 3, 4, ]; #[cfg(target_arch = "wasm32")] use wasm_bindgen::prelude::*; use winit::dpi::PhysicalPosition; #[cfg(target_arch = "wasm32")] use winit::platform::web::EventLoopExtWebSys; use winit::{ application::ApplicationHandler, event::*, event_loop::{ActiveEventLoop, EventLoop}, keyboard::{KeyCode, PhysicalKey}, window::Window, }; type Kt = HashMap>; struct Renderer { surface: (wgpu::Surface<'static>,bool), config: wgpu::SurfaceConfiguration, device: wgpu::Device, queue: wgpu::Queue, camera: Camera, clear_color: wgpu::Color, } struct UniformPlan { bind_group: wgpu::BindGroup, buffer: wgpu::Buffer, } struct TexturePlan { bind_group: wgpu::BindGroup, texture: wgpu::Texture, } #[repr(C)] #[derive(Copy, Clone, Debug, bytemuck::Pod, bytemuck::Zeroable)] struct SimpleVertex { pos: [f32; 3], uv: [f32; 2], norm: [f32; 3], } impl SimpleVertex { fn desc() -> wgpu::VertexBufferLayout<'static> { wgpu::VertexBufferLayout { array_stride: std::mem::size_of::() as wgpu::BufferAddress, step_mode: wgpu::VertexStepMode::Vertex, attributes: &[ wgpu::VertexAttribute { offset: 0, shader_location: 0, format: wgpu::VertexFormat::Float32x3, }, wgpu::VertexAttribute { offset: std::mem::size_of::<[f32; 3]>() as wgpu::BufferAddress, shader_location: 1, format: wgpu::VertexFormat::Float32x2, }, wgpu::VertexAttribute { offset: std::mem::size_of::<[f32; 5]>() as wgpu::BufferAddress, shader_location: 2, format: wgpu::VertexFormat::Float32x3, } ] } } } struct SimpleMesh { vertex_buffer: wgpu::Buffer, index_buffer: wgpu::Buffer, indices_count: u32, } struct SimpleMaterial { albedo: TexturePlan, normal: Option, specular: Option, } struct SimpleModel { affine: Affine3A, material: mars::gc::Gc, } struct SimpleRenderPlan { pipeline: wgpu::RenderPipeline, // todo: clients: Kt>> clients: Vec } struct FluidRigidBody { } pub struct State { renderer: Renderer, controller: Controller, window: Arc, diffuse_bind_group: wgpu::BindGroup, sky: wgpu::Color, } impl State { // We don't need this to be async right now, // but we will in the next tutorial pub async fn new(window: Arc) -> anyhow::Result { let size = window.inner_size(); // The instance is a handle to our GPU // BackendBit::PRIMARY => Vulkan + Metal + DX12 + Browser WebGPU let instance = wgpu::Instance::new(wgpu::InstanceDescriptor { #[cfg(not(target_arch = "wasm32"))] backends: wgpu::Backends::PRIMARY, #[cfg(target_arch = "wasm32")] backends: wgpu::Backends::GL, flags: Default::default(), memory_budget_thresholds: Default::default(), backend_options: Default::default(), display: None, }); let surface = instance.create_surface(window.clone())?; let adapter = instance .request_adapter(&wgpu::RequestAdapterOptions { power_preference: wgpu::PowerPreference::default(), compatible_surface: Some(&surface), force_fallback_adapter: false, }) .await?; let (device, queue) = adapter .request_device(&wgpu::DeviceDescriptor { label: None, required_features: wgpu::Features::empty(), experimental_features: wgpu::ExperimentalFeatures::disabled(), // WebGL doesn't support all of wgpu's features, so if // we're building for the web we'll have to disable some. required_limits: if cfg!(target_arch = "wasm32") { wgpu::Limits::downlevel_webgl2_defaults() } else { wgpu::Limits::default() }, memory_hints: Default::default(), trace: wgpu::Trace::Off, }) .await?; let surface_caps = surface.get_capabilities(&adapter); // Shader code in this tutorial assumes an sRGB surface texture. Using a different // one will result in all the colors coming out darker. If you want to support non // sRGB surfaces, you'll need to account for that when drawing to the frame. let surface_format = surface_caps .formats .iter() .find(|f| f.is_srgb()) .copied() .unwrap_or(surface_caps.formats[0]); let config = wgpu::SurfaceConfiguration { usage: wgpu::TextureUsages::RENDER_ATTACHMENT, format: surface_format, width: size.width, height: size.height, present_mode: surface_caps.present_modes[0], alpha_mode: surface_caps.alpha_modes[0], view_formats: vec![], desired_maximum_frame_latency: 2, }; let diffuse_bytes = include_bytes!("assets/test.png"); let diffuse_image = image::load_from_memory(diffuse_bytes)?; let diffuse_rgba = diffuse_image.to_rgba8(); use image::GenericImageView; let dimensions = diffuse_image.dimensions(); println!("{:?}",dimensions); let texture_size = wgpu::Extent3d { width: dimensions.0, height: dimensions.1, // All textures are stored as 3D, we represent our 2D texture // by setting depth to 1. depth_or_array_layers: 1, }; let diffuse_texture = device.create_texture( &wgpu::TextureDescriptor { size: texture_size, mip_level_count: 1, // We'll talk about this a little later sample_count: 1, dimension: wgpu::TextureDimension::D2, // Most images are stored using sRGB, so we need to reflect that here. format: wgpu::TextureFormat::Rgba8UnormSrgb, // TEXTURE_BINDING tells wgpu that we want to use this texture in shaders // COPY_DST means that we want to copy data to this texture usage: wgpu::TextureUsages::TEXTURE_BINDING | wgpu::TextureUsages::COPY_DST, label: Some("diffuse_texture"), // This is the same as with the SurfaceConfig. It // specifies what texture formats can be used to // create TextureViews for this texture. The base // texture format (Rgba8UnormSrgb in this case) is // always supported. Note that using a different // texture format is not supported on the WebGL2 // backend. view_formats: &[], } ); queue.write_texture( // Tells wgpu where to copy the pixel data wgpu::TexelCopyTextureInfo { texture: &diffuse_texture, mip_level: 0, origin: wgpu::Origin3d::ZERO, aspect: wgpu::TextureAspect::All, }, // The actual pixel data &diffuse_rgba, // The layout of the texture wgpu::TexelCopyBufferLayout { offset: 0, bytes_per_row: Some(4 * dimensions.0), rows_per_image: Some(dimensions.1), }, texture_size, ); let diffuse_texture_view = diffuse_texture.create_view(&wgpu::TextureViewDescriptor::default()); let diffuse_sampler = device.create_sampler(&wgpu::SamplerDescriptor { address_mode_u: wgpu::AddressMode::Repeat, address_mode_v: wgpu::AddressMode::Repeat, address_mode_w: wgpu::AddressMode::Repeat, mag_filter: wgpu::FilterMode::Linear, min_filter: wgpu::FilterMode::Linear, mipmap_filter: wgpu::MipmapFilterMode::Nearest, ..Default::default() }); let texture_bind_group_layout = device.create_bind_group_layout(&wgpu::BindGroupLayoutDescriptor { entries: &[ wgpu::BindGroupLayoutEntry { binding: 0, visibility: wgpu::ShaderStages::FRAGMENT, ty: wgpu::BindingType::Texture { multisampled: false, view_dimension: wgpu::TextureViewDimension::D2, sample_type: wgpu::TextureSampleType::Float { filterable: true }, }, count: None, }, wgpu::BindGroupLayoutEntry { binding: 1, visibility: wgpu::ShaderStages::FRAGMENT, // This should match the filterable field of the // corresponding Texture entry above. ty: wgpu::BindingType::Sampler(wgpu::SamplerBindingType::Filtering), count: None, }, ], label: Some("texture_bind_group_layout"), }); let diffuse_bind_group = device.create_bind_group( &wgpu::BindGroupDescriptor { layout: &texture_bind_group_layout, entries: &[ wgpu::BindGroupEntry { binding: 0, resource: wgpu::BindingResource::TextureView(&diffuse_texture_view), }, wgpu::BindGroupEntry { binding: 1, resource: wgpu::BindingResource::Sampler(&diffuse_sampler), } ], label: Some("diffuse_bind_group"), } ); let camera = Camera::new(&window); let camera_buffer = device.create_buffer_init( &wgpu::util::BufferInitDescriptor { label: Some("Camera Buffer"), contents: bytemuck::cast_slice(&[camera.view()]), usage: wgpu::BufferUsages::UNIFORM | wgpu::BufferUsages::COPY_DST, } ); let camera_bind_group_layout = device.create_bind_group_layout(&wgpu::BindGroupLayoutDescriptor { entries: &[ wgpu::BindGroupLayoutEntry { binding: 0, visibility: wgpu::ShaderStages::VERTEX, ty: wgpu::BindingType::Buffer { ty: wgpu::BufferBindingType::Uniform, has_dynamic_offset: false, min_binding_size: None, }, count: None, } ], label: Some("camera_bind_group_layout"), }); let camera_bind_group = device.create_bind_group(&wgpu::BindGroupDescriptor { layout: &camera_bind_group_layout, entries: &[ wgpu::BindGroupEntry { binding: 0, resource: camera_buffer.as_entire_binding(), } ], label: Some("camera_bind_group"), }); let vertex_buffer = device.create_buffer_init( &wgpu::util::BufferInitDescriptor { label: Some("Vertex Buffer"), contents: bytemuck::cast_slice(VERTICES), usage: wgpu::BufferUsages::VERTEX, } ); let index_buffer = device.create_buffer_init( &wgpu::util::BufferInitDescriptor { label: Some("Index Buffer"), contents: bytemuck::cast_slice(INDICES), usage: wgpu::BufferUsages::INDEX, } ); let num_indices = INDICES.len() as u32; let shader1 = device.create_shader_module(wgpu::include_wgsl!("assets/shader.wgsl")); let render_pipeline_layout1 = device.create_pipeline_layout(&wgpu::PipelineLayoutDescriptor { label: Some("Render Pipeline Layout"), bind_group_layouts: &[ Some(&texture_bind_group_layout), Some(&camera_bind_group_layout), ], immediate_size: 0, }); /*let water_pipeline = device.create_render_pipeline(&wgpu::RenderPipelineDescriptor { label: Some("Water Pipeline"), layout: Some(&water_pipeline_layout), vertex: wgpu::VertexState { module: &shader1, entry_point: Some("vs_main"), buffers: &[ ], compilation_options: wgpu::PipelineCompilationOptions::default(); } });*/ let render_pipeline1 = device.create_render_pipeline(&wgpu::RenderPipelineDescriptor { label: Some("Render Pipeline"), layout: Some(&render_pipeline_layout1), vertex: wgpu::VertexState { module: &shader1, entry_point: Some("vs_main"), buffers: &[ Vertex::desc(), ], compilation_options: wgpu::PipelineCompilationOptions::default(), }, fragment: Some(wgpu::FragmentState { // 3. module: &shader1, entry_point: Some("fs_main"), targets: &[Some(wgpu::ColorTargetState { // 4. format: config.format, blend: Some(wgpu::BlendState::REPLACE), write_mask: wgpu::ColorWrites::ALL, })], compilation_options: wgpu::PipelineCompilationOptions::default(), }), primitive: wgpu::PrimitiveState { topology: wgpu::PrimitiveTopology::TriangleList, // 1. strip_index_format: None, front_face: wgpu::FrontFace::Ccw, // 2. cull_mode: Some(wgpu::Face::Back), // Setting this to anything other than Fill requires Features::NON_FILL_POLYGON_MODE polygon_mode: wgpu::PolygonMode::Fill, // Requires Features::DEPTH_CLIP_CONTROL unclipped_depth: false, // Requires Features::CONSERVATIVE_RASTERIZATION conservative: false, }, depth_stencil: None, // 1. multisample: wgpu::MultisampleState { count: 1, // 2. mask: !0, // 3. alpha_to_coverage_enabled: false, // 4. }, multiview_mask: None, // 5. cache: None, // 6. }); Ok(Self { surface, camera_buffer, camera_bind_group, diffuse_bind_group, index_buffer, vertex_buffer, controller: Controller::new(), device, queue, config, is_surface_configured: false, window, num_indices, render_pipeline: render_pipeline1, sky: wgpu::Color { r: 0.1, g: 0.2, b: 0.3, a: 1.0, }, camera, }) } pub fn resize(&mut self, width: u32, height: u32) { if width > 0 && height > 0 { let max = 2048; self.config.width = width.min(max); self.config.height = height.min(max); self.surface.configure(&self.device, &self.config); self.camera.resize(&self.window); self.is_surface_configured = true; } } fn update(&mut self) { // ... } fn render(&mut self) -> anyhow::Result<()> { self.window.request_redraw(); // We can't render unless the surface is configured if !self.is_surface_configured { return Ok(()); } let output = match self.surface.get_current_texture() { wgpu::CurrentSurfaceTexture::Success(surface_texture) => surface_texture, wgpu::CurrentSurfaceTexture::Suboptimal(surface_texture) => { self.surface.configure(&self.device, &self.config); surface_texture } wgpu::CurrentSurfaceTexture::Timeout | wgpu::CurrentSurfaceTexture::Occluded | wgpu::CurrentSurfaceTexture::Validation => { // Skip this frame return Ok(()); } wgpu::CurrentSurfaceTexture::Outdated => { self.surface.configure(&self.device, &self.config); return Ok(()); } wgpu::CurrentSurfaceTexture::Lost => { // You could recreate the devices and all resources // created with it here, but we'll just bail anyhow::bail!("Lost device"); } }; let view = output .texture .create_view(&wgpu::TextureViewDescriptor::default()); let mut encoder = self .device .create_command_encoder(&wgpu::CommandEncoderDescriptor { label: Some("Render Encoder"), }); { let mut render_pass = encoder.begin_render_pass(&wgpu::RenderPassDescriptor { label: Some("Render Pass"), color_attachments: &[Some(wgpu::RenderPassColorAttachment { view: &view, resolve_target: None, depth_slice: None, ops: wgpu::Operations { load: wgpu::LoadOp::Clear(self.sky), store: wgpu::StoreOp::Store, }, })], depth_stencil_attachment: None, occlusion_query_set: None, timestamp_writes: None, multiview_mask: None, }); let mut movement = Vec3::new(0.0,0.0,0.0); let pressed = |keycode: KeyCode| { if let Some(true) = self.controller.keys.get(&keycode) { true } else { false } }; if pressed(KeyCode::KeyA) { movement.x -= 1.0; } if pressed(KeyCode::KeyD) { movement.x += 1.0; } if pressed(KeyCode::KeyW) { movement.z += 1.0; } if pressed(KeyCode::KeyS) { movement.z -= 1.0; } if pressed(KeyCode::KeyE) { movement.y += 1.0; } if pressed(KeyCode::KeyQ) { movement.y -= 1.0; } println!("{:?} {:?} {:?}",movement,self.camera.frame.translation,self.camera.frame.matrix3.to_euler(EulerRot::YXZ)); self.camera.control(movement * 0.1); self.queue.write_buffer(&self.camera_buffer,0,bytemuck::cast_slice(&[self.camera.view()])); render_pass.set_pipeline(&self.render_pipeline); render_pass.set_bind_group(1, &self.camera_bind_group, &[]); render_pass.set_bind_group(0, &self.diffuse_bind_group, &[]); render_pass.set_vertex_buffer(0, self.vertex_buffer.slice(..)); render_pass.set_index_buffer(self.index_buffer.slice(..), wgpu::IndexFormat::Uint16); render_pass.draw_indexed(0..self.num_indices, 0, 0..1); } // submit will accept anything that implements IntoIter self.queue.submit(std::iter::once(encoder.finish())); output.present(); Ok(()) } fn handle_key(&mut self, event_loop: &ActiveEventLoop, code: KeyCode, is_pressed: bool) { match (code, is_pressed) { (KeyCode::Escape, true) => event_loop.exit(), (KeyCode::Space, true) => {}, (KeyCode::KeyR, true) => { self.camera.frame = Affine3A::IDENTITY } _ => {} } self.controller.keys.insert(code, is_pressed); } fn handle_mouse_moved(&mut self, position: PhysicalPosition) { self.sky = wgpu::Color { r: 0.3, g: position.x / 1000.0, b: position.y / 1000.0, a: 1.0, }; if let Some(true) = self.controller.buttons.get(&MouseButton::Right) { self.camera.rotate(position.x as f32 - self.controller.mouse.x, position.y as f32 - self.controller.mouse.y); } self.controller.mouse = Vec2::new(position.x as f32, position.y as f32); } fn handle_mouse_button(&mut self, button: MouseButton, state: ElementState ) { self.controller.buttons.insert(button,state.is_pressed()); } } pub struct App { #[cfg(target_arch = "wasm32")] proxy: Option>, state: Option, } impl App { pub fn new(#[cfg(target_arch = "wasm32")] event_loop: &EventLoop) -> Self { #[cfg(target_arch = "wasm32")] let proxy = Some(event_loop.create_proxy()); Self { state: None, #[cfg(target_arch = "wasm32")] proxy, } } } impl ApplicationHandler for App { fn resumed(&mut self, event_loop: &ActiveEventLoop) { #[allow(unused_mut)] let mut window_attributes = Window::default_attributes(); #[cfg(target_arch = "wasm32")] { use wasm_bindgen::JsCast; use winit::platform::web::WindowAttributesExtWebSys; const CANVAS_ID: &str = "canvas"; let window = wgpu::web_sys::window().unwrap_throw(); let document = window.document().unwrap_throw(); let canvas = document.get_element_by_id(CANVAS_ID).unwrap_throw(); let html_canvas_element = canvas.unchecked_into(); window_attributes = window_attributes.with_canvas(Some(html_canvas_element)); } let window = Arc::new(event_loop.create_window(window_attributes).unwrap()); #[cfg(not(target_arch = "wasm32"))] { // If we are not on web we can use pollster to // await the window creation self.state = Some(pollster::block_on(State::new(window)).unwrap()); } #[cfg(target_arch = "wasm32")] { // Run the future asynchronously and use the // proxy to send the results to the event loop if let Some(proxy) = self.proxy.take() { wasm_bindgen_futures::spawn_local(async move { assert!( proxy .send_event( State::new(window) .await .expect("Unable to create canvas!!!") ) .is_ok() ) }); } } } #[allow(unused_mut)] fn user_event(&mut self, _event_loop: &ActiveEventLoop, mut event: State) { // This is where proxy.send_event() ends up #[cfg(target_arch = "wasm32")] { event.window.request_redraw(); event.resize( event.window.inner_size().width, event.window.inner_size().height, ); } self.state = Some(event); } fn window_event( &mut self, event_loop: &ActiveEventLoop, _window_id: winit::window::WindowId, event: WindowEvent, ) { let state = match &mut self.state { Some(canvas) => canvas, None => return, }; match event { WindowEvent::CloseRequested => event_loop.exit(), WindowEvent::Resized(size) => state.resize(size.width, size.height), WindowEvent::RedrawRequested => { state.update(); match state.render() { Ok(_) => {} Err(e) => { // Log the error and exit gracefully log::error!("{e}"); event_loop.exit(); } } } WindowEvent::MouseInput { button, state: element, .. } => state.handle_mouse_button(button,element), WindowEvent::CursorMoved { position: pos, .. } => state.handle_mouse_moved(pos), WindowEvent::KeyboardInput { event: KeyEvent { physical_key: PhysicalKey::Code(code), state: key_state, .. }, .. } => state.handle_key(event_loop, code, key_state.is_pressed()), _ => {} } } } pub fn run() -> anyhow::Result<()> { #[cfg(not(target_arch = "wasm32"))] { env_logger::init(); } #[cfg(target_arch = "wasm32")] { console_log::init_with_level(log::Level::Info).unwrap_throw(); } let event_loop = EventLoop::with_user_event().build()?; #[cfg(not(target_arch = "wasm32"))] { let mut app = App::new(); event_loop.run_app(&mut app)?; } #[cfg(target_arch = "wasm32")] { let app = App::new(&event_loop); event_loop.spawn_app(app); } Ok(()) } #[cfg(target_arch = "wasm32")] #[wasm_bindgen(start)] pub fn run_web() -> Result<(), wasm_bindgen::JsValue> { console_error_panic_hook::set_once(); run().unwrap_throw(); Ok(()) }