mirror of https://github.com/sotrh/learn-wgpu
You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
62 lines
22 KiB
HTML
62 lines
22 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en-US">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>Update to 0.13! | Learn Wgpu</title>
|
|
<meta name="generator" content="VuePress 1.9.10">
|
|
|
|
<meta name="description" content="">
|
|
|
|
<link rel="preload" href="/learn-wgpu/assets/css/0.styles.81cb5453.css" as="style"><link rel="preload" href="/learn-wgpu/assets/js/app.842fd276.js" as="script"><link rel="preload" href="/learn-wgpu/assets/js/2.7dc9d716.js" as="script"><link rel="preload" href="/learn-wgpu/assets/js/1.eaeeb819.js" as="script"><link rel="preload" href="/learn-wgpu/assets/js/58.35b75a7b.js" as="script"><link rel="prefetch" href="/learn-wgpu/assets/js/10.82969053.js"><link rel="prefetch" href="/learn-wgpu/assets/js/11.aa0f7418.js"><link rel="prefetch" href="/learn-wgpu/assets/js/12.c451dcd5.js"><link rel="prefetch" href="/learn-wgpu/assets/js/13.5da78eab.js"><link rel="prefetch" href="/learn-wgpu/assets/js/14.5e01b032.js"><link rel="prefetch" href="/learn-wgpu/assets/js/15.0b975c05.js"><link rel="prefetch" href="/learn-wgpu/assets/js/16.af1799fe.js"><link rel="prefetch" href="/learn-wgpu/assets/js/17.0423b92c.js"><link rel="prefetch" href="/learn-wgpu/assets/js/18.bde3a2c3.js"><link rel="prefetch" href="/learn-wgpu/assets/js/19.e34dfafc.js"><link rel="prefetch" href="/learn-wgpu/assets/js/20.8d8f4a96.js"><link rel="prefetch" href="/learn-wgpu/assets/js/21.56ba867c.js"><link rel="prefetch" href="/learn-wgpu/assets/js/22.44a48b8b.js"><link rel="prefetch" href="/learn-wgpu/assets/js/23.8ac3a76f.js"><link rel="prefetch" href="/learn-wgpu/assets/js/24.9ed2104b.js"><link rel="prefetch" href="/learn-wgpu/assets/js/25.1676676b.js"><link rel="prefetch" href="/learn-wgpu/assets/js/26.90f40f03.js"><link rel="prefetch" href="/learn-wgpu/assets/js/27.c755f80e.js"><link rel="prefetch" href="/learn-wgpu/assets/js/28.ca7a4cc7.js"><link rel="prefetch" href="/learn-wgpu/assets/js/29.ea2d6bbf.js"><link rel="prefetch" href="/learn-wgpu/assets/js/3.6221c182.js"><link rel="prefetch" href="/learn-wgpu/assets/js/30.12d50dcb.js"><link rel="prefetch" href="/learn-wgpu/assets/js/31.bcaf5c7c.js"><link rel="prefetch" href="/learn-wgpu/assets/js/32.3d0e544d.js"><link rel="prefetch" href="/learn-wgpu/assets/js/33.945dce62.js"><link rel="prefetch" href="/learn-wgpu/assets/js/34.0fe8e5e4.js"><link rel="prefetch" href="/learn-wgpu/assets/js/35.7c607f94.js"><link rel="prefetch" href="/learn-wgpu/assets/js/36.275ea4aa.js"><link rel="prefetch" href="/learn-wgpu/assets/js/37.5ecf7ce2.js"><link rel="prefetch" href="/learn-wgpu/assets/js/38.b0253733.js"><link rel="prefetch" href="/learn-wgpu/assets/js/39.73123b03.js"><link rel="prefetch" href="/learn-wgpu/assets/js/4.ff267fdb.js"><link rel="prefetch" href="/learn-wgpu/assets/js/40.30864a0f.js"><link rel="prefetch" href="/learn-wgpu/assets/js/41.9218ac5e.js"><link rel="prefetch" href="/learn-wgpu/assets/js/42.08068df5.js"><link rel="prefetch" href="/learn-wgpu/assets/js/43.ddac8e2c.js"><link rel="prefetch" href="/learn-wgpu/assets/js/44.f7f124ac.js"><link rel="prefetch" href="/learn-wgpu/assets/js/45.2ea5b108.js"><link rel="prefetch" href="/learn-wgpu/assets/js/46.85709c9f.js"><link rel="prefetch" href="/learn-wgpu/assets/js/47.22e16c22.js"><link rel="prefetch" href="/learn-wgpu/assets/js/48.7d70df25.js"><link rel="prefetch" href="/learn-wgpu/assets/js/49.6426e080.js"><link rel="prefetch" href="/learn-wgpu/assets/js/5.250d79d3.js"><link rel="prefetch" href="/learn-wgpu/assets/js/50.e101ca0a.js"><link rel="prefetch" href="/learn-wgpu/assets/js/51.f9c8041f.js"><link rel="prefetch" href="/learn-wgpu/assets/js/52.ecbe158e.js"><link rel="prefetch" href="/learn-wgpu/assets/js/53.8c976652.js"><link rel="prefetch" href="/learn-wgpu/assets/js/54.daee63ce.js"><link rel="prefetch" href="/learn-wgpu/assets/js/55.461095bb.js"><link rel="prefetch" href="/learn-wgpu/assets/js/56.74e5dcef.js"><link rel="prefetch" href="/learn-wgpu/assets/js/57.22981293.js"><link rel="prefetch" href="/learn-wgpu/assets/js/59.302e302d.js"><link rel="prefetch" href="/learn-wgpu/assets/js/60.bca5b731.js"><link rel="prefetch" href="/learn-wgpu/assets/js/61.f10516d3.js"><link rel="prefetch" href="/learn-wgpu/assets/js/62.fc721fd9.js"><link rel="prefetch" href="/learn-wgpu/assets/js/63.68526f40.js"><link rel="prefetch" href="/learn-wgpu/assets/js/64.f4cb43e2.js"><link rel="prefetch" href="/learn-wgpu/assets/js/65.e23a076d.js"><link rel="prefetch" href="/learn-wgpu/assets/js/66.19a033d1.js"><link rel="prefetch" href="/learn-wgpu/assets/js/67.ab338058.js"><link rel="prefetch" href="/learn-wgpu/assets/js/68.d785413d.js"><link rel="prefetch" href="/learn-wgpu/assets/js/8.e648abec.js"><link rel="prefetch" href="/learn-wgpu/assets/js/9.4760ec68.js"><link rel="prefetch" href="/learn-wgpu/assets/js/vendors~docsearch.efa6f8ef.js">
|
|
<link rel="stylesheet" href="/learn-wgpu/assets/css/0.styles.81cb5453.css">
|
|
</head>
|
|
<body>
|
|
<div id="app" data-server-rendered="true"><div class="theme-container"><header class="navbar"><div class="inner"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div> <a href="/learn-wgpu/" class="home-link router-link-active"><!----> <span class="site-name">Learn Wgpu</span></a> <div class="links"><!----> <div class="search-box"><input aria-label="Search" autocomplete="off" spellcheck="false" value=""> <!----></div></div></div></header> <div class="sidebar-mask"></div> <div class="docs-layout"><aside class="sidebar"><!----> <ul class="sidebar-links"><li><a href="/learn-wgpu/" aria-current="page" class="sidebar-link">Introduction</a></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>Beginner</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/learn-wgpu/beginner/tutorial1-window/" class="sidebar-link">Dependencies and the window</a></li><li><a href="/learn-wgpu/beginner/tutorial2-surface/" class="sidebar-link">The Surface</a></li><li><a href="/learn-wgpu/beginner/tutorial3-pipeline/" class="sidebar-link">The Pipeline</a></li><li><a href="/learn-wgpu/beginner/tutorial4-buffer/" class="sidebar-link">Buffers and Indices</a></li><li><a href="/learn-wgpu/beginner/tutorial5-textures/" class="sidebar-link">Textures and bind groups</a></li><li><a href="/learn-wgpu/beginner/tutorial6-uniforms/" class="sidebar-link">Uniform buffers and a 3d camera</a></li><li><a href="/learn-wgpu/beginner/tutorial7-instancing/" class="sidebar-link">Instancing</a></li><li><a href="/learn-wgpu/beginner/tutorial8-depth/" class="sidebar-link">The Depth Buffer</a></li><li><a href="/learn-wgpu/beginner/tutorial9-models/" class="sidebar-link">Model Loading</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>Intermediate</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/learn-wgpu/intermediate/tutorial10-lighting/" class="sidebar-link">Working with Lights</a></li><li><a href="/learn-wgpu/intermediate/tutorial11-normals/" class="sidebar-link">Normal Mapping</a></li><li><a href="/learn-wgpu/intermediate/tutorial12-camera/" class="sidebar-link">A Better Camera</a></li><li><a href="/learn-wgpu/intermediate/tutorial13-hdr/" class="sidebar-link">High Dynamic Range Rendering</a></li></ul></section></li><li><section class="sidebar-group collapsable depth-0"><p class="sidebar-heading"><span>Showcase</span> <span class="arrow right"></span></p> <!----></section></li><li><section class="sidebar-group collapsable depth-0"><p class="sidebar-heading open"><span>News</span> <span class="arrow down"></span></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/learn-wgpu/news/0.18%20and%20hdr/" class="sidebar-link">Update to 0.18 and HDR tutorial</a></li><li><a href="/learn-wgpu/news/0.17/" class="sidebar-link">Update to 0.17</a></li><li><a href="/learn-wgpu/news/0.16/" class="sidebar-link">Update to 0.16</a></li><li><a href="/learn-wgpu/news/0.15/" class="sidebar-link">Update to 0.15!</a></li><li><a href="/learn-wgpu/news/0.14/" class="sidebar-link">Update to 0.14!</a></li><li><a href="/learn-wgpu/news/0.13/" aria-current="page" class="active sidebar-link">Update to 0.13!</a></li><li><a href="/learn-wgpu/news/0.12/" class="sidebar-link">Update to 0.12!</a></li><li><a href="/learn-wgpu/news/pre-0.12/" class="sidebar-link">News (Pre 0.12)</a></li></ul></section></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h1 id="update-to-0-13"><a href="#update-to-0-13" class="header-anchor">#</a> Update to 0.13!</h1> <p><a href="https://github.com/gfx-rs/wgpu/blob/master/CHANGELOG.md#wgpu-013-2022-06-30" target="_blank" rel="noopener noreferrer">WGPU Change Log<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></p> <p>The change log above contains most of the details about what has changed about WGPU and therefore the tutorial. I will make a special mention about how to use <code>map_async()</code> as that has changed. Previously <code>map_async</code> returned a promise that you had to await before you could access a buffers contents. It now expects a <code>'static</code> callback that takes the <code>Result</code> of the mapping attempt as a parameter. This means that if we want to save a buffers context to an image instead of doing the following:</p> <div class="language-rust extra-class"><pre class="language-rust"><code>
|
|
<span class="token punctuation">{</span>
|
|
<span class="token keyword">let</span> buffer_slice <span class="token operator">=</span> output_buffer<span class="token punctuation">.</span><span class="token function">slice</span><span class="token punctuation">(</span><span class="token punctuation">..</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
|
|
<span class="token keyword">let</span> mapping <span class="token operator">=</span> buffer_slice<span class="token punctuation">.</span><span class="token function">map_async</span><span class="token punctuation">(</span><span class="token namespace">wgpu<span class="token punctuation">::</span></span><span class="token class-name">MapMode</span><span class="token punctuation">::</span><span class="token class-name">Read</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
device<span class="token punctuation">.</span><span class="token function">poll</span><span class="token punctuation">(</span><span class="token namespace">wgpu<span class="token punctuation">::</span></span><span class="token class-name">Maintain</span><span class="token punctuation">::</span><span class="token class-name">Wait</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
mapping<span class="token punctuation">.</span><span class="token keyword">await</span><span class="token punctuation">.</span><span class="token function">unwrap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
|
|
<span class="token keyword">let</span> data <span class="token operator">=</span> buffer_slice<span class="token punctuation">.</span><span class="token function">get_mapped_range</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
|
|
<span class="token keyword">use</span> <span class="token namespace">image<span class="token punctuation">::</span></span><span class="token punctuation">{</span><span class="token class-name">ImageBuffer</span><span class="token punctuation">,</span> <span class="token class-name">Rgba</span><span class="token punctuation">}</span><span class="token punctuation">;</span>
|
|
<span class="token keyword">let</span> buffer <span class="token operator">=</span>
|
|
<span class="token class-name">ImageBuffer</span><span class="token punctuation">::</span><span class="token operator"><</span><span class="token class-name">Rgba</span><span class="token operator"><</span><span class="token keyword">u8</span><span class="token operator">></span><span class="token punctuation">,</span> _<span class="token operator">></span><span class="token punctuation">::</span><span class="token function">from_raw</span><span class="token punctuation">(</span>texture_size<span class="token punctuation">,</span> texture_size<span class="token punctuation">,</span> data<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">unwrap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
buffer<span class="token punctuation">.</span><span class="token function">save</span><span class="token punctuation">(</span><span class="token string">"image.png"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">unwrap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
<span class="token punctuation">}</span>
|
|
output_buffer<span class="token punctuation">.</span><span class="token function">unmap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
</code></pre></div><p>We would do the following:</p> <div class="language-rust extra-class"><pre class="language-rust"><code><span class="token punctuation">{</span>
|
|
<span class="token keyword">let</span> buffer_slice <span class="token operator">=</span> output_buffer<span class="token punctuation">.</span><span class="token function">slice</span><span class="token punctuation">(</span><span class="token punctuation">..</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
|
|
<span class="token keyword">let</span> <span class="token punctuation">(</span>tx<span class="token punctuation">,</span> rx<span class="token punctuation">)</span> <span class="token operator">=</span> <span class="token namespace">futures_intrusive<span class="token punctuation">::</span>channel<span class="token punctuation">::</span>shared<span class="token punctuation">::</span></span><span class="token function">oneshot_channel</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
buffer_slice<span class="token punctuation">.</span><span class="token function">map_async</span><span class="token punctuation">(</span><span class="token namespace">wgpu<span class="token punctuation">::</span></span><span class="token class-name">MapMode</span><span class="token punctuation">::</span><span class="token class-name">Read</span><span class="token punctuation">,</span> <span class="token keyword">move</span> <span class="token closure-params"><span class="token closure-punctuation punctuation">|</span>result<span class="token closure-punctuation punctuation">|</span></span> <span class="token punctuation">{</span>
|
|
tx<span class="token punctuation">.</span><span class="token function">send</span><span class="token punctuation">(</span>result<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">unwrap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
device<span class="token punctuation">.</span><span class="token function">poll</span><span class="token punctuation">(</span><span class="token namespace">wgpu<span class="token punctuation">::</span></span><span class="token class-name">Maintain</span><span class="token punctuation">::</span><span class="token class-name">Wait</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
rx<span class="token punctuation">.</span><span class="token function">receive</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token keyword">await</span><span class="token punctuation">.</span><span class="token function">unwrap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">unwrap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
|
|
<span class="token keyword">let</span> data <span class="token operator">=</span> buffer_slice<span class="token punctuation">.</span><span class="token function">get_mapped_range</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
|
|
<span class="token keyword">use</span> <span class="token namespace">image<span class="token punctuation">::</span></span><span class="token punctuation">{</span><span class="token class-name">ImageBuffer</span><span class="token punctuation">,</span> <span class="token class-name">Rgba</span><span class="token punctuation">}</span><span class="token punctuation">;</span>
|
|
<span class="token keyword">let</span> buffer <span class="token operator">=</span>
|
|
<span class="token class-name">ImageBuffer</span><span class="token punctuation">::</span><span class="token operator"><</span><span class="token class-name">Rgba</span><span class="token operator"><</span><span class="token keyword">u8</span><span class="token operator">></span><span class="token punctuation">,</span> _<span class="token operator">></span><span class="token punctuation">::</span><span class="token function">from_raw</span><span class="token punctuation">(</span>texture_size<span class="token punctuation">,</span> texture_size<span class="token punctuation">,</span> data<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">unwrap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
buffer<span class="token punctuation">.</span><span class="token function">save</span><span class="token punctuation">(</span><span class="token string">"image.png"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">unwrap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
|
|
<span class="token punctuation">}</span>
|
|
output_buffer<span class="token punctuation">.</span><span class="token function">unmap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
</code></pre></div><p>You can explore the reasoning for the change to <code>map_async</code> in <a href="https://github.com/gfx-rs/wgpu/pull/2698" target="_blank" rel="noopener noreferrer">this PR<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>.</p> <p>Another thing to note is that presentation modes need to match what the surface supports. You can get a list of supported modes from <a href="https://docs.rs/wgpu/latest/wgpu/struct.Surface.html#method.get_supported_modes" target="_blank" rel="noopener noreferrer">Surface::get_surface_modes()<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>.</p> <p>As always, let me know if I missed anything in the migration process. You can open an issue/submit a PR on the <a href="https://github.com/sotrh/learn-wgpu" target="_blank" rel="noopener noreferrer">Learn Wgpu repo<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>!</p></div> <footer class="page-edit"><!----> <div class="last-updated"><span class="prefix">Last Updated: </span> <span class="time">12/1/2023, 2:10:48 AM</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev">
|
|
←
|
|
<a href="/learn-wgpu/news/0.14/" class="prev">
|
|
Update to 0.14!
|
|
</a></span> <span class="next"><a href="/learn-wgpu/news/0.12/">
|
|
Update to 0.12!
|
|
</a>
|
|
→
|
|
</span></p></div> </main></div></div><div class="global-ui"><!----></div></div>
|
|
<script src="/learn-wgpu/assets/js/app.842fd276.js" defer></script><script src="/learn-wgpu/assets/js/2.7dc9d716.js" defer></script><script src="/learn-wgpu/assets/js/1.eaeeb819.js" defer></script><script src="/learn-wgpu/assets/js/58.35b75a7b.js" defer></script>
|
|
</body>
|
|
</html>
|