mirror of
https://github.com/minetest/irrlicht.git
synced 2024-11-14 06:20:26 +01:00
219 lines
20 KiB
HTML
219 lines
20 KiB
HTML
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
||
|
|
<head>
|
||
|
|
<meta http-equiv="Content-Type" content="text/xhtml;charset=UTF-8"/>
|
||
|
|
<title>Irrlicht 3D Engine: Tutorial 2: Quake3Map</title>
|
||
|
|
|
||
|
|
<link href="tabs.css" rel="stylesheet" type="text/css"/>
|
||
|
|
<link href="doxygen.css" rel="stylesheet" type="text/css" />
|
||
|
|
<link href="navtree.css" rel="stylesheet" type="text/css"/>
|
||
|
|
<script type="text/javascript" src="jquery.js"></script>
|
||
|
|
<script type="text/javascript" src="resize.js"></script>
|
||
|
|
<script type="text/javascript" src="navtree.js"></script>
|
||
|
|
<script type="text/javascript">
|
||
|
|
$(document).ready(initResizable);
|
||
|
|
</script>
|
||
|
|
<link href="search/search.css" rel="stylesheet" type="text/css"/>
|
||
|
|
<script type="text/javascript" src="search/search.js"></script>
|
||
|
|
<script type="text/javascript">
|
||
|
|
$(document).ready(function() { searchBox.OnSelectItem(0); });
|
||
|
|
</script>
|
||
|
|
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div id="top"><!-- do not remove this div! -->
|
||
|
|
|
||
|
|
|
||
|
|
<div id="titlearea">
|
||
|
|
<table cellspacing="0" cellpadding="0">
|
||
|
|
<tbody>
|
||
|
|
<tr style="height: 56px;">
|
||
|
|
|
||
|
|
<td id="projectlogo"><img alt="Logo" src="irrlichtlogo.png"/></td>
|
||
|
|
|
||
|
|
|
||
|
|
<td style="padding-left: 0.5em;">
|
||
|
|
<div id="projectname">Irrlicht 3D Engine
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</td>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<td> <div id="MSearchBox" class="MSearchBoxInactive">
|
||
|
|
<span class="left">
|
||
|
|
<img id="MSearchSelect" src="search/mag_sel.png"
|
||
|
|
onmouseover="return searchBox.OnSearchSelectShow()"
|
||
|
|
onmouseout="return searchBox.OnSearchSelectHide()"
|
||
|
|
alt=""/>
|
||
|
|
<input type="text" id="MSearchField" value="Search" accesskey="S"
|
||
|
|
onfocus="searchBox.OnSearchFieldFocus(true)"
|
||
|
|
onblur="searchBox.OnSearchFieldFocus(false)"
|
||
|
|
onkeyup="searchBox.OnSearchFieldChange(event)"/>
|
||
|
|
</span><span class="right">
|
||
|
|
<a id="MSearchClose" href="javascript:searchBox.CloseResultsWindow()"><img id="MSearchCloseImg" border="0" src="search/close.png" alt=""/></a>
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
</td>
|
||
|
|
|
||
|
|
|
||
|
|
</tr>
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Generated by Doxygen 1.7.5.1 -->
|
||
|
|
<script type="text/javascript">
|
||
|
|
var searchBox = new SearchBox("searchBox", "search",false,'Search');
|
||
|
|
</script>
|
||
|
|
<script type="text/javascript" src="dynsections.js"></script>
|
||
|
|
</div>
|
||
|
|
<div id="side-nav" class="ui-resizable side-nav-resizable">
|
||
|
|
<div id="nav-tree">
|
||
|
|
<div id="nav-tree-contents">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div id="splitbar" style="-moz-user-select:none;"
|
||
|
|
class="ui-resizable-handle">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<script type="text/javascript">
|
||
|
|
initNavTree('example002.html','');
|
||
|
|
</script>
|
||
|
|
<div id="doc-content">
|
||
|
|
<div class="header">
|
||
|
|
<div class="headertitle">
|
||
|
|
<div class="title">Tutorial 2: Quake3Map </div> </div>
|
||
|
|
</div>
|
||
|
|
<div class="contents">
|
||
|
|
<div class="textblock"><div class="image">
|
||
|
|
<img src="002shot.jpg" alt="002shot.jpg"/>
|
||
|
|
</div>
|
||
|
|
<p>This Tutorial shows how to load a Quake 3 map into the engine, create a SceneNode for optimizing the speed of rendering, and how to create a user controlled camera.</p>
|
||
|
|
<p>Please note that you should know the basics of the engine before starting this tutorial. Just take a short look at the first tutorial, if you haven't done this yet: <a href="http://irrlicht.sourceforge.net/tut001.html">http://irrlicht.sourceforge.net/tut001.html</a></p>
|
||
|
|
<p>Lets start like the HelloWorld example: We include the irrlicht header files and an additional file to be able to ask the user for a driver type using the console. </p>
|
||
|
|
<div class="fragment"><pre class="fragment"><span class="preprocessor">#include <<a class="code" href="irrlicht_8h.html" title="Main header file of the irrlicht, the only file needed to include.">irrlicht.h</a>></span>
|
||
|
|
<span class="preprocessor">#include <iostream></span>
|
||
|
|
</pre></div><p>As already written in the HelloWorld example, in the Irrlicht Engine everything can be found in the namespace 'irr'. To get rid of the irr:: in front of the name of every class, we tell the compiler that we use that namespace from now on, and we will not have to write that 'irr::'. There are 5 other sub namespaces 'core', 'scene', 'video', 'io' and 'gui'. Unlike in the HelloWorld example, we do not call 'using namespace' for these 5 other namespaces, because in this way you will see what can be found in which namespace. But if you like, you can also include the namespaces like in the previous example. </p>
|
||
|
|
<div class="fragment"><pre class="fragment"><span class="keyword">using namespace </span>irr;
|
||
|
|
</pre></div><p>Again, to be able to use the Irrlicht.DLL file, we need to link with the Irrlicht.lib. We could set this option in the project settings, but to make it easy, we use a pragma comment lib: </p>
|
||
|
|
<div class="fragment"><pre class="fragment"><span class="preprocessor">#ifdef _MSC_VER</span>
|
||
|
|
<span class="preprocessor"></span><span class="preprocessor">#pragma comment(lib, "Irrlicht.lib")</span>
|
||
|
|
<span class="preprocessor">#endif</span>
|
||
|
|
</pre></div><p>Ok, lets start. Again, we use the main() method as start, not the WinMain(). </p>
|
||
|
|
<div class="fragment"><pre class="fragment"><span class="keywordtype">int</span> main()
|
||
|
|
{
|
||
|
|
</pre></div><p>Like in the HelloWorld example, we create an IrrlichtDevice with <a class="el" href="namespaceirr.html#abaf4d8719cc26b0d30813abf85e47c76" title="Creates an Irrlicht device. The Irrlicht device is the root object for using the engine.">createDevice()</a>. The difference now is that we ask the user to select which video driver to use. The Software device might be too slow to draw a huge Quake 3 map, but just for the fun of it, we make this decision possible, too. Instead of copying this whole code into your app, you can simply include <a class="el" href="driver_choice_8h.html">driverChoice.h</a> from Irrlicht's include directory. The function driverChoiceConsole does exactly the same. </p>
|
||
|
|
<div class="fragment"><pre class="fragment"> <span class="comment">// ask user for driver</span>
|
||
|
|
|
||
|
|
<a class="code" href="namespaceirr_1_1video.html#ae35a6de6d436c76107ad157fe42356d0" title="An enum for all types of drivers the Irrlicht Engine supports.">video::E_DRIVER_TYPE</a> driverType;
|
||
|
|
|
||
|
|
printf(<span class="stringliteral">"Please select the driver you want for this example:\n"</span>\
|
||
|
|
<span class="stringliteral">" (a) OpenGL 1.5\n (b) Direct3D 9.0c\n (c) Direct3D 8.1\n"</span>\
|
||
|
|
<span class="stringliteral">" (d) Burning's Software Renderer\n (e) Software Renderer\n"</span>\
|
||
|
|
<span class="stringliteral">" (f) NullDevice\n (otherKey) exit\n\n"</span>);
|
||
|
|
|
||
|
|
<span class="keywordtype">char</span> i;
|
||
|
|
std::cin >> i;
|
||
|
|
|
||
|
|
<span class="keywordflow">switch</span>(i)
|
||
|
|
{
|
||
|
|
<span class="keywordflow">case</span> <span class="charliteral">'a'</span>: driverType = <a class="code" href="namespaceirr_1_1video.html#ae35a6de6d436c76107ad157fe42356d0a2715182a79f1cb8e2826fd68a8150a53" title="OpenGL device, available on most platforms.">video::EDT_OPENGL</a>; <span class="keywordflow">break</span>;
|
||
|
|
<span class="keywordflow">case</span> <span class="charliteral">'b'</span>: driverType = <a class="code" href="namespaceirr_1_1video.html#ae35a6de6d436c76107ad157fe42356d0a4691ca314f9018f508dcf2c57dcaacec" title="Direct3D 9 device, only available on Win32 platforms.">video::EDT_DIRECT3D9</a>;<span class="keywordflow">break</span>;
|
||
|
|
<span class="keywordflow">case</span> <span class="charliteral">'c'</span>: driverType = <a class="code" href="namespaceirr_1_1video.html#ae35a6de6d436c76107ad157fe42356d0a8cc3807f6f28404f3424ad7e31b3142f" title="Direct3D8 device, only available on Win32 platforms.">video::EDT_DIRECT3D8</a>;<span class="keywordflow">break</span>;
|
||
|
|
<span class="keywordflow">case</span> <span class="charliteral">'d'</span>: driverType = <a class="code" href="namespaceirr_1_1video.html#ae35a6de6d436c76107ad157fe42356d0ae85481da26159b967191ccc6de1e4a05" title="The Burning's Software Renderer, an alternative software renderer.">video::EDT_BURNINGSVIDEO</a>;<span class="keywordflow">break</span>;
|
||
|
|
<span class="keywordflow">case</span> <span class="charliteral">'e'</span>: driverType = <a class="code" href="namespaceirr_1_1video.html#ae35a6de6d436c76107ad157fe42356d0a1598cd235a1a6bd052e2011b559e8995" title="The Irrlicht Engine Software renderer.">video::EDT_SOFTWARE</a>; <span class="keywordflow">break</span>;
|
||
|
|
<span class="keywordflow">case</span> <span class="charliteral">'f'</span>: driverType = <a class="code" href="namespaceirr_1_1video.html#ae35a6de6d436c76107ad157fe42356d0acfdbd476cbfd4d05e72f9adffcc42210" title="Null driver, useful for applications to run the engine without visualisation.">video::EDT_NULL</a>; <span class="keywordflow">break</span>;
|
||
|
|
<span class="keywordflow">default</span>: <span class="keywordflow">return</span> 1;
|
||
|
|
}
|
||
|
|
|
||
|
|
<span class="comment">// create device and exit if creation failed</span>
|
||
|
|
|
||
|
|
IrrlichtDevice *device =
|
||
|
|
<a class="code" href="namespaceirr.html#abaf4d8719cc26b0d30813abf85e47c76" title="Creates an Irrlicht device. The Irrlicht device is the root object for using the engine.">createDevice</a>(driverType, core::dimension2d<u32>(640, 480));
|
||
|
|
|
||
|
|
<span class="keywordflow">if</span> (device == 0)
|
||
|
|
<span class="keywordflow">return</span> 1; <span class="comment">// could not create selected driver.</span>
|
||
|
|
</pre></div><p>Get a pointer to the video driver and the SceneManager so that we do not always have to call <a class="el" href="classirr_1_1_irrlicht_device.html#ada90707ba5c645d47e000e4e0f87c4c4" title="Provides access to the video driver for drawing 3d and 2d geometry.">irr::IrrlichtDevice::getVideoDriver()</a> and <a class="el" href="classirr_1_1_irrlicht_device.html#a891b503ff4d5041296d88f23f97d7b3d" title="Provides access to the scene manager.">irr::IrrlichtDevice::getSceneManager()</a>. </p>
|
||
|
|
<div class="fragment"><pre class="fragment"> video::IVideoDriver* driver = device->getVideoDriver();
|
||
|
|
scene::ISceneManager* smgr = device->getSceneManager();
|
||
|
|
</pre></div><p>To display the Quake 3 map, we first need to load it. Quake 3 maps are packed into .pk3 files which are nothing else than .zip files. So we add the .pk3 file to our <a class="el" href="classirr_1_1io_1_1_i_file_system.html" title="The FileSystem manages files and archives and provides access to them.">irr::io::IFileSystem</a>. After it was added, we are able to read from the files in that archive as if they are directly stored on the disk. </p>
|
||
|
|
<div class="fragment"><pre class="fragment"> device->getFileSystem()->addFileArchive(<span class="stringliteral">"../../media/map-20kdm2.pk3"</span>);
|
||
|
|
</pre></div><p>Now we can load the mesh by calling <a class="el" href="classirr_1_1scene_1_1_i_scene_manager.html#a63894c3f3d46cfc385116f1705935e03" title="Get pointer to an animateable mesh. Loads the file if not loaded already.">irr::scene::ISceneManager::getMesh()</a>. We get a pointer returned to an <a class="el" href="classirr_1_1scene_1_1_i_animated_mesh.html" title="Interface for an animated mesh.">irr::scene::IAnimatedMesh</a>. As you might know, Quake 3 maps are not really animated, they are only a huge chunk of static geometry with some materials attached. Hence the IAnimatedMesh consists of only one frame, so we get the "first frame" of the "animation", which is our quake level and create an Octree scene node with it, using <a class="el" href="classirr_1_1scene_1_1_i_scene_manager.html#a503339385ca2b33d7e8035a61c4eca84" title="Adds a scene node for rendering using a octree to the scene graph.">irr::scene::ISceneManager::addOctreeSceneNode()</a>. The Octree optimizes the scene a little bit, trying to draw only geometry which is currently visible. An alternative to the Octree would be a <a class="el" href="classirr_1_1scene_1_1_i_mesh_scene_node.html" title="A scene node displaying a static mesh.">irr::scene::IMeshSceneNode</a>, which would always draw the complete geometry of the mesh, without optimization. Try it: Use <a class="el" href="classirr_1_1scene_1_1_i_scene_manager.html#aa0a32f9f5b13d94e24eed80bdb999919" title="Adds a scene node for rendering a static mesh.">irr::scene::ISceneManager::addMeshSceneNode()</a> instead of addOctreeSceneNode() and compare the primitives drawn by the video driver. (There is a <a class="el" href="classirr_1_1video_1_1_i_video_driver.html#a2ce9be45cacb4aa034d3afdb489a57a3" title="Returns amount of primitives (mostly triangles) which were drawn in the last frame.">irr::video::IVideoDriver::getPrimitiveCountDrawn()</a> method in the <a class="el" href="classirr_1_1video_1_1_i_video_driver.html" title="Interface to driver which is able to perform 2d and 3d graphics functions.">irr::video::IVideoDriver</a> class). Note that this optimization with the Octree is only useful when drawing huge meshes consisting of lots of geometry. </p>
|
||
|
|
<div class="fragment"><pre class="fragment"> scene::IAnimatedMesh* mesh = smgr->getMesh(<span class="stringliteral">"20kdm2.bsp"</span>);
|
||
|
|
scene::ISceneNode* node = 0;
|
||
|
|
|
||
|
|
<span class="keywordflow">if</span> (mesh)
|
||
|
|
node = smgr->addOctreeSceneNode(mesh->getMesh(0), 0, -1, 1024);
|
||
|
|
<span class="comment">// node = smgr->addMeshSceneNode(mesh->getMesh(0));</span>
|
||
|
|
</pre></div><p>Because the level was not modelled around the origin (0,0,0), we translate the whole level a little bit. This is done on <a class="el" href="classirr_1_1scene_1_1_i_scene_node.html" title="Scene node interface.">irr::scene::ISceneNode</a> level using the methods <a class="el" href="classirr_1_1scene_1_1_i_scene_node.html#a2166eb0a92cc0e46c49266f41a68ed50" title="Sets the position of the node relative to its parent.">irr::scene::ISceneNode::setPosition()</a> (in this case), <a class="el" href="classirr_1_1scene_1_1_i_scene_node.html#adb6ff54f52d3a9e1514cd487a550935c" title="Sets the rotation of the node relative to its parent.">irr::scene::ISceneNode::setRotation()</a>, and <a class="el" href="classirr_1_1scene_1_1_i_scene_node.html#a1d710e1e20546bd89affe09fa943b0e2" title="Sets the relative scale of the scene node.">irr::scene::ISceneNode::setScale()</a>. </p>
|
||
|
|
<div class="fragment"><pre class="fragment"> <span class="keywordflow">if</span> (node)
|
||
|
|
node->setPosition(<a class="code" href="namespaceirr_1_1core.html#a06f169d08b5c429f5575acb7edbad811" title="Typedef for a f32 3d vector.">core::vector3df</a>(-1300,-144,-1249));
|
||
|
|
</pre></div><p>Now we only need a camera to look at the Quake 3 map. We want to create a user controlled camera. There are some cameras available in the Irrlicht engine. For example the MayaCamera which can be controlled like the camera in Maya: Rotate with left mouse button pressed, Zoom with both buttons pressed, translate with right mouse button pressed. This could be created with <a class="el" href="classirr_1_1scene_1_1_i_scene_manager.html#a18e81a59e02231567ac938ea287fe523" title="Adds a maya style user controlled camera scene node to the scene graph.">irr::scene::ISceneManager::addCameraSceneNodeMaya()</a>. But for this example, we want to create a camera which behaves like the ones in first person shooter games (FPS) and hence use <a class="el" href="classirr_1_1scene_1_1_i_scene_manager.html#ac312cbc85161678d00192880f2cdddbb" title="Adds a camera scene node with an animator which provides mouse and keyboard control appropriate for f...">irr::scene::ISceneManager::addCameraSceneNodeFPS()</a>. </p>
|
||
|
|
<div class="fragment"><pre class="fragment"> smgr->addCameraSceneNodeFPS();
|
||
|
|
</pre></div><p>The mouse cursor needs not be visible, so we hide it via the irr::IrrlichtDevice::ICursorControl. </p>
|
||
|
|
<div class="fragment"><pre class="fragment"> device->getCursorControl()->setVisible(<span class="keyword">false</span>);
|
||
|
|
</pre></div><p>We have done everything, so lets draw it. We also write the current frames per second and the primitives drawn into the caption of the window. The test for <a class="el" href="classirr_1_1_irrlicht_device.html#abd3c88336b739da2694883d5ffd25a70" title="Returns if the window is active.">irr::IrrlichtDevice::isWindowActive()</a> is optional, but prevents the engine to grab the mouse cursor after task switching when other programs are active. The call to <a class="el" href="classirr_1_1_irrlicht_device.html#a731727774fad9fc4c6c1c85277ca36dc" title="Cause the device to temporarily pause execution and let other processes run.">irr::IrrlichtDevice::yield()</a> will avoid the busy loop to eat up all CPU cycles when the window is not active. </p>
|
||
|
|
<div class="fragment"><pre class="fragment"> <span class="keywordtype">int</span> lastFPS = -1;
|
||
|
|
|
||
|
|
<span class="keywordflow">while</span>(device->run())
|
||
|
|
{
|
||
|
|
<span class="keywordflow">if</span> (device->isWindowActive())
|
||
|
|
{
|
||
|
|
driver->beginScene(<span class="keyword">true</span>, <span class="keyword">true</span>, video::SColor(255,200,200,200));
|
||
|
|
smgr->drawAll();
|
||
|
|
driver->endScene();
|
||
|
|
|
||
|
|
<span class="keywordtype">int</span> fps = driver->getFPS();
|
||
|
|
|
||
|
|
<span class="keywordflow">if</span> (lastFPS != fps)
|
||
|
|
{
|
||
|
|
<a class="code" href="namespaceirr_1_1core.html#aef83fafbb1b36fcce44c07c9be23a7f2" title="Typedef for wide character strings.">core::stringw</a> str = L<span class="stringliteral">"Irrlicht Engine - Quake 3 Map example ["</span>;
|
||
|
|
str += driver->getName();
|
||
|
|
str += <span class="stringliteral">"] FPS:"</span>;
|
||
|
|
str += fps;
|
||
|
|
|
||
|
|
device->setWindowCaption(str.c_str());
|
||
|
|
lastFPS = fps;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
<span class="keywordflow">else</span>
|
||
|
|
device->yield();
|
||
|
|
}
|
||
|
|
</pre></div><p>In the end, delete the Irrlicht device. </p>
|
||
|
|
<div class="fragment"><pre class="fragment"> device->drop();
|
||
|
|
<span class="keywordflow">return</span> 0;
|
||
|
|
}
|
||
|
|
</pre></div><p>That's it. Compile and play around with the program. </p>
|
||
|
|
</div></div>
|
||
|
|
</div>
|
||
|
|
<div id="nav-path" class="navpath">
|
||
|
|
<ul>
|
||
|
|
<!-- window showing the filter options -->
|
||
|
|
<div id="MSearchSelectWindow"
|
||
|
|
onmouseover="return searchBox.OnSearchSelectShow()"
|
||
|
|
onmouseout="return searchBox.OnSearchSelectHide()"
|
||
|
|
onkeydown="return searchBox.OnSearchSelectKey(event)">
|
||
|
|
<a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(0)"><span class="SelectionMark"> </span>All</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(1)"><span class="SelectionMark"> </span>Classes</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(2)"><span class="SelectionMark"> </span>Namespaces</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(3)"><span class="SelectionMark"> </span>Files</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(4)"><span class="SelectionMark"> </span>Functions</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(5)"><span class="SelectionMark"> </span>Variables</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(6)"><span class="SelectionMark"> </span>Typedefs</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(7)"><span class="SelectionMark"> </span>Enumerations</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(8)"><span class="SelectionMark"> </span>Enumerator</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(9)"><span class="SelectionMark"> </span>Friends</a><a class="SelectItem" href="javascript:void(0)" onclick="searchBox.OnSelectItem(10)"><span class="SelectionMark"> </span>Defines</a></div>
|
||
|
|
|
||
|
|
<!-- iframe showing the search results (closed by default) -->
|
||
|
|
<div id="MSearchResultsWindow">
|
||
|
|
<iframe src="javascript:void(0)" frameborder="0"
|
||
|
|
name="MSearchResults" id="MSearchResults">
|
||
|
|
</iframe>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<li class="footer">
|
||
|
|
<a href="http://irrlicht.sourceforge.net" target="_blank">Irrlicht
|
||
|
|
Engine</a> Documentation © 2003-2012 by Nikolaus Gebhardt. Generated on Sat Jul 9 2016 18:18:25 for Irrlicht 3D Engine by
|
||
|
|
<a href="http://www.doxygen.org/index.html" target="_blank">Doxygen</a> 1.7.5.1 </li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|