added AutoGithubLink and fixed uniforms challenge

code/beginner/tutorial6-uniforms/challenge.rs

@@ -552,6 +552,9 @@ fn main() {
         .unwrap();
 
     let mut state = State::new(&window);
+
+    let mut old_time = std::time::Instant::now();
+    const MSPT: std::time::Duration = std::time::Duration::from_millis(20);
     
     event_loop.run(move |event, _, control_flow| {
         match event {
@@ -559,7 +562,7 @@ fn main() {
                 ref event,
                 window_id,
             } if window_id == window.id() => if state.input(event) {
-                *control_flow = ControlFlow::Wait;
+                ()
             } else { 
                 match event {
                     WindowEvent::CloseRequested => *control_flow = ControlFlow::Exit,
@@ -573,26 +576,34 @@ fn main() {
                                 virtual_keycode: Some(VirtualKeyCode::Escape),
                                 ..
                             } => *control_flow = ControlFlow::Exit,
-                            _ => *control_flow = ControlFlow::Wait,
+                            _ => (),
                         }
                     }
                     WindowEvent::Resized(logical_size) => {
                         state.resize(*logical_size);
-                        *control_flow = ControlFlow::Wait;
+                        ()
                     }
                     WindowEvent::HiDpiFactorChanged(new_hidpi_factor) => {
                         state.update_hidpi_and_resize(*new_hidpi_factor);
-                        *control_flow = ControlFlow::Wait;
+                        ()
                     }
-                    _ => *control_flow = ControlFlow::Wait,
+                    _ => (),
                 }
             }
             Event::EventsCleared => {
                 state.update();
                 state.render();
-                *control_flow = ControlFlow::Wait;
+
+                let new_time = std::time::Instant::now();
+                let delta_time = new_time - old_time;
+                *control_flow = if delta_time > MSPT {
+                    ControlFlow::Poll
+                } else {
+                    ControlFlow::WaitUntil(old_time + MSPT)
+                };
+                old_time = new_time;
             }
-            _ => *control_flow = ControlFlow::Wait,
+            _ => (),
         }
     });
 }

docs/.vuepress/components/AutoGithubLink.vue

@@ -0,0 +1,17 @@
+<template>
+    <div class="auto-github-link">
+        <a :href="link" target="_blank" rel="noopener noreferrer">Check out the code!</a>
+        <OutboundLink/>
+    </div>
+</template>
+
+<script>
+const GITHUB_REPO = "https://github.com/sotrh/learn-wgpu/tree/master/code"
+export default {
+    computed: {
+        link() {
+            return GITHUB_REPO + this.$page.path;
+        }
+    }
+}
+</script>

docs/.vuepress/config.js

@@ -21,7 +21,7 @@ module.exports = {
                 title: 'Beginner',
                 collapsable: false,
                 children: [
-                    '/beginner/tutorial1-window',
+                    '/beginner/tutorial1-window/',
                     '/beginner/tutorial2-swapchain/',
                     '/beginner/tutorial3-pipeline/',
                     '/beginner/tutorial4-buffer/',

docs/beginner/tutorial1-window/README.md

@@ -71,4 +71,6 @@ fn main() {
 }
 ```
 
-All this does is create a window, and keep it open until until user closes it, or presses escape. Next tutorial we'll actually start using wgpu!
+All this does is create a window, and keep it open until until user closes it, or presses escape. Next tutorial we'll actually start using wgpu!
+
+<AutoGithubLink/>

docs/beginner/tutorial2-swapchain/README.md

@@ -93,7 +93,7 @@ As of writing, the wgpu implementation doesn't allow you to customize much of re
 ```
 Here we defining and creating the `swap_chain`. The `usage` field describes how the `swap_chain`'s underlying textures will be used. `OUTPUT_ATTACHMENT` specifies that the textures will be used to write to the screen (we'll talk about more `TextureUsage`s later).
 
-The `format` defines how the `swap_chain`s textures will be stored on the gpu. Usually you want to specify the format of the display you're using. As of writing, I was unable to find a way to query what format the display has through `wgpu`, so `wgpu::TextureFormat::Bgra8UnormSrgb` will do for now.
+The `format` defines how the `swap_chain`s textures will be stored on the gpu. Usually you want to specify the format of the display you're using. As of writing, I was unable to find a way to query what format the display has through `wgpu`, though [there are plans on including such a method](https://github.com/gfx-rs/wgpu-rs/issues/123#issuecomment-555803321), so `wgpu::TextureFormat::Bgra8UnormSrgb` will do for now. We use `wgpu::TextureFormat::Bgra8UnormSrgb` because that's the format that's [guaranteed to be natively supported by the swapchains of all the APIs/platforms](https://github.com/gfx-rs/wgpu-rs/issues/123#issuecomment-555800583) which are currently supported.
 
 `width` and `height`, are self explanatory.
 
@@ -349,4 +349,6 @@ In the event loop we're currently using `*control_flow = ControlFlow::Wait` in m
 
 ## Challenge
 
-Modify the `input()` method to capture mouse events, and update the clear color using that. *Hint: you'll probably need to use `WindowEvent::CursorMoved`*
+Modify the `input()` method to capture mouse events, and update the clear color using that. *Hint: you'll probably need to use `WindowEvent::CursorMoved`*
+
+<AutoGithubLink/>

docs/beginner/tutorial3-pipeline/README.md

@@ -260,4 +260,6 @@ With all that you should be seeing a lovely brown triangle.
 ![Said lovely brown triangle](./tutorial3-pipeline-triangle.png)
 
 ## Challenge
-Create a second pipeline that uses the triangles position data to create a color that it then sends to the fragment shader to use for `f_color`. Have the app swap between these when you press the spacebar. *Hint: use*`in`*and*`out`*variables in a separate shader.*
+Create a second pipeline that uses the triangles position data to create a color that it then sends to the fragment shader to use for `f_color`. Have the app swap between these when you press the spacebar. *Hint: use*`in`*and*`out`*variables in a separate shader.*
+
+<AutoGithubLink/>

docs/beginner/tutorial4-buffer/README.md

@@ -331,4 +331,6 @@ With all that you should have a garishly magenta pentagon in your window.
 ![Magenta pentagon in window](./indexed-pentagon.png)
 
 ## Challenge
-Create a more complex shape than the one we made (aka. more than three triangles) using a vertex buffer and an index buffer. Toggle between the two with the space key.
+Create a more complex shape than the one we made (aka. more than three triangles) using a vertex buffer and an index buffer. Toggle between the two with the space key.
+
+<AutoGithubLink/>

docs/beginner/tutorial5-textures/README.md

@@ -373,6 +373,8 @@ With that in place we now have our tree subscribed right-side up on our hexagon.
 
 Create another texture and swap it out when you press the space key.
 
+<AutoGithubLink/>
+
 <!-- Things changed to accomodate textures: vertex struct and desc, the shader, -->
 <!-- -1..1 -> 0..1
 (x + 1) / 2

docs/beginner/tutorial6-uniforms/README.md

@@ -425,6 +425,8 @@ That's all we need to do. If you run the code now you should see a pentagon with
 
 Have our model rotate on it's own independently of the the camera. *Hint: you'll need another matrix for this.*
 
+<AutoGithubLink/>
+
 <!-- TODO: add a gif/video for this -->
 
 <!-- 

docs/intermediate/windowless/README.md

@@ -222,4 +222,6 @@ output_buffer.map_read_async(0, output_buffer_size, move |result: wgpu::BufferMa
 
 With all that you should have an image like this. 
 
-![a brown triangle](./image-output.png)
+![a brown triangle](./image-output.png)
+
+<AutoGithubLink/>