<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns="http://www.w3.org/TR/REC-html40"><head><meta http-equiv=Content-Type content="text/html; charset=utf-8"><meta name=Generator content="Microsoft Word 15 (filtered medium)"><style><!--
/* Font Definitions */
@font-face
        {font-family:"Cambria Math";
        panose-1:2 4 5 3 5 4 6 3 2 4;}
@font-face
        {font-family:Calibri;
        panose-1:2 15 5 2 2 2 4 3 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
        {margin:0in;
        margin-bottom:.0001pt;
        font-size:11.0pt;
        font-family:"Calibri",sans-serif;}
a:link, span.MsoHyperlink
        {mso-style-priority:99;
        color:blue;
        text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
        {mso-style-priority:99;
        color:#954F72;
        text-decoration:underline;}
p.m-2983527224661074602m-8958789190955110277msolistparagraph, li.m-2983527224661074602m-8958789190955110277msolistparagraph, div.m-2983527224661074602m-8958789190955110277msolistparagraph
        {mso-style-name:m_-2983527224661074602m_-8958789190955110277msolistparagraph;
        mso-margin-top-alt:auto;
        margin-right:0in;
        mso-margin-bottom-alt:auto;
        margin-left:0in;
        font-size:11.0pt;
        font-family:"Calibri",sans-serif;}
p.m-2983527224661074602m-8958789190955110277m-8320956075756076490msolistparagraph, li.m-2983527224661074602m-8958789190955110277m-8320956075756076490msolistparagraph, div.m-2983527224661074602m-8958789190955110277m-8320956075756076490msolistparagraph
        {mso-style-name:m_-2983527224661074602m_-8958789190955110277m-8320956075756076490msolistparagraph;
        mso-margin-top-alt:auto;
        margin-right:0in;
        mso-margin-bottom-alt:auto;
        margin-left:0in;
        font-size:11.0pt;
        font-family:"Calibri",sans-serif;}
.MsoChpDefault
        {mso-style-type:export-only;}
@page WordSection1
        {size:8.5in 11.0in;
        margin:1.0in 1.0in 1.0in 1.0in;}
div.WordSection1
        {page:WordSection1;}
/* List Definitions */
@list l0
        {mso-list-id:286159018;
        mso-list-template-ids:-1;}
@list l0:level1
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l0:level2
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:1.0in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l0:level3
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:1.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l0:level4
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:2.0in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l0:level5
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:2.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l0:level6
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:3.0in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l0:level7
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:3.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l0:level8
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:4.0in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l0:level9
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:4.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l1
        {mso-list-id:872496562;
        mso-list-template-ids:-1;}
@list l1:level1
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l1:level2
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:1.0in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l1:level3
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:1.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l1:level4
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:2.0in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l1:level5
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:2.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l1:level6
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:3.0in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l1:level7
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:3.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l1:level8
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:4.0in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l1:level9
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:4.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l2
        {mso-list-id:1639459834;
        mso-list-template-ids:-1;}
@list l2:level1
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l2:level2
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:1.0in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l2:level3
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:1.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l2:level4
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:2.0in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l2:level5
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:2.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l2:level6
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:3.0in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l2:level7
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:3.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l2:level8
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:4.0in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
@list l2:level9
        {mso-level-number-format:bullet;
        mso-level-text:\F0B7;
        mso-level-tab-stop:4.5in;
        mso-level-number-position:left;
        text-indent:-.25in;
        mso-ansi-font-size:10.0pt;
        font-family:Symbol;}
ol
        {margin-bottom:0in;}
ul
        {margin-bottom:0in;}
--></style></head><body lang=EN-US link=blue vlink="#954F72"><div class=WordSection1><p class=MsoNormal>Whatever it is named, just try some complex and see what happens when you don’t use center, but instead actually (try to) translate child joints. </p><p class=MsoNormal>The issue is not what it is called, but what it actually is. Your interpretation seems to be one thing while an hanim application would have to look at it in an entirely different way. Again, just try to build something fun and see where you get led if you use translate. Again, think rootspace which you want to be uniform skeletonspace. </p><p class=MsoNormal>All is best when all joints are in rootspace and skin is also best when skinspace =skeletonspace. It doesn’t matter where you think the joint is located, just where the joint center is located relative to the root and its parents and children.  Maybe think like all the joints are actually in the same place but the center of rotation is positioned absolutely with respect to the root so we can have a reasonable way to establish positions of things like joints and sites, and yet all dimensions are biven with respect to the same thing – the root. </p><p class=MsoNormal>Gltf doesn’t have ‘center’? OK, so what? Believe me that is an artifact of the old ways and anyway, the label that is put on it makes no diff at all, it is what you do with it. Just do the right things and see what happens.</p><p class=MsoNormal>Good Work and Good Luck,</p><p class=MsoNormal>Joe </p><div style='mso-element:para-border-div;border:none;border-top:solid #E1E1E1 1.0pt;padding:3.0pt 0in 0in 0in'><p class=MsoNormal style='border:none;padding:0in'><b><o:p> </o:p></b></p><p class=MsoNormal style='border:none;padding:0in'><b>From: </b><a href="mailto:andreasplesch@gmail.com">Andreas Plesch</a><br><b>Sent: </b>Friday, December 14, 2018 3:38 PM<br><b>To: </b><a href="mailto:joedwil@earthlink.net">Joe D Williams</a><br><b>Cc: </b><a href="mailto:x3d-public@web3d.org">X3D Graphics public mailing list</a>; <a href="mailto:michalis.kambi@gmail.com">Michalis Kamburelis</a>; <a href="mailto:h-anim@web3d.org">Humanoid Animation (H-Anim) Working Group</a><br><b>Subject: </b>Re: [x3d-public] glTF - HAnim conversion</p></div><p class=MsoNormal><o:p> </o:p></p><div><div><div><p class=MsoNormal>Joe, the issue is that for automatic glTF conversion purposes center unfortunately is not available since glTF does not have it.</p></div><div><p class=MsoNormal><o:p> </o:p></p></div><div><p class=MsoNormal>It will be interesting to see how center would need to be treated for a conversion from HAnim to glTF. It will likely need embedded transforms/joints.</p></div><div><p class=MsoNormal><o:p> </o:p></p></div><div><p class=MsoNormal>-Andreas</p></div><div><p class=MsoNormal><o:p> </o:p></p><div><p class=MsoNormal>---on the phone---</p></div></div><p class=MsoNormal style='margin-bottom:12.0pt'><o:p> </o:p></p><div><div><p class=MsoNormal>On Fri, Dec 14, 2018, 11:57 AM Joseph D Williams <<a href="mailto:joedwil@earthlink.net" target="_blank">joedwil@earthlink.net</a> wrote:</p></div><blockquote style='border:none;border-left:solid #CCCCCC 1.0pt;padding:0in 0in 0in 6.0pt;margin-left:4.8pt;margin-right:0in'><div><div><ul type=disc><li class=m-2983527224661074602m-8958789190955110277msolistparagraph style='mso-list:l2 level1 lfo1'>I agree that HAnim is easier to mentally model and is better defined.</li></ul><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Hi Andreas, </p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Fine work. When you get the translation vs center thing, you will be even more impressed. Think that you really want to stay in the same space as root, for all joints. Look at what happens to the simple rig when you use center rather than translate and how that would evolve when you have more than a couple of joints in a row that have to be positioned exactly. </p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Thanks Again, </p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Joe. </p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p><div style='border:none;border-top:solid #E1E1E1 1.0pt;padding:3.0pt 0in 0in 0in'><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'><b>From: </b><a href="mailto:andreasplesch@gmail.com" target="_blank">Andreas Plesch</a><br><b>Sent: </b>Thursday, December 13, 2018 4:43 PM<br><b>To: </b><a href="mailto:joedwil@earthlink.net" target="_blank">Joe D Williams</a><br><b>Cc: </b><a href="mailto:x3d-public@web3d.org" target="_blank">X3D Graphics public mailing list</a>; <a href="mailto:michalis.kambi@gmail.com" target="_blank">Michalis Kamburelis</a>; <a href="mailto:h-anim@web3d.org" target="_blank">Humanoid Animation (H-Anim) Working Group</a><br><b>Subject: </b>Re: [x3d-public] glTF - HAnim conversion</p></div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p><div><div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>On Thu, Dec 13, 2018, 5:48 PM Joseph D Williams <<a href="mailto:joedwil@earthlink.net" target="_blank">joedwil@earthlink.net</a> wrote:</p></div><div><blockquote style='border:none;border-left:solid #CCCCCC 1.0pt;padding:0in 0in 0in 6.0pt;margin-left:4.8pt;margin-top:5.0pt;margin-right:0in;margin-bottom:5.0pt'><div><div><ul type=disc><li class=m-2983527224661074602m-8958789190955110277m-8320956075756076490msolistparagraph style='mso-list:l0 level1 lfo2'>… about not accepting that for implementation purposes  Such a choice does not affect authoring meaning</li></ul><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>OK, my overreaction just as you said, x3d implement must live with the syntax or structure of the ‘standard’ model presented by the x3d hanim standard (or else start a big project. Anything can be done under your covers and lots has changed under the covers over the last years but so far the overall best practice way of constructing and verifying the user code, using skin and/or segment geometry, and animating the thing for realtime interactivity has not changed. I think you are going through basics and learning well. What if there was no gltf or collada? That was true not so long ago.</p></div></div></blockquote></div></div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Since I looked at HAnim first in order to give it a try with x3dom, I may be biased but after trying to then figure out glTF skins, I agree that HAnim is easier to mentally model and is better defined.</p></div><div><div><blockquote style='border:none;border-left:solid #CCCCCC 1.0pt;padding:0in 0in 0in 6.0pt;margin-left:4.8pt;margin-top:5.0pt;margin-right:0in;margin-bottom:5.0pt'><div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p><ul type=disc><li class=m-2983527224661074602m-8958789190955110277m-8320956075756076490msolistparagraph style='mso-list:l1 level1 lfo3'>I still wish there was a simple two joint with minimal skin HAnim example.</li></ul><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Please, go for at least a root and two more, making a total of at least three joints.</p></div></div></blockquote></div></div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Makes sense. Will take a look at a finger.</p></div><div><div><blockquote style='border:none;border-left:solid #CCCCCC 1.0pt;padding:0in 0in 0in 6.0pt;margin-left:4.8pt;margin-top:5.0pt;margin-right:0in;margin-bottom:5.0pt'><div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>I’m lazy now and must say that if you take the path of coding in gltf, then deriving the x3d, then maybe the web3D x3d use case is really that you make your model in x3d, which to me is much easier, then export to one or more gltf files. That could also lead to a friendlier set of gltf interfaces to x3d/vrm, making it even easier to transport setups and animations between similar humanoids.</p></div></div></blockquote></div></div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>The angle was how to integrate glTF in general, as Inline content. It is unclear if animation and skinning in the glTF should be supported and how they would be controlled by the X3D runtime. HAnim support in a player could be leveraged to also do glTF skinning. But what you are suggestion is also valid. If there is no HAnim support, a glTF playing module could then be leveraged to add such support if it is possible to convert HAnim to glTF.</p></div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p></div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Best, Andreas</p></div><div><div><blockquote style='border:none;border-left:solid #CCCCCC 1.0pt;padding:0in 0in 0in 6.0pt;margin-left:4.8pt;margin-top:5.0pt;margin-right:0in;margin-bottom:5.0pt'><div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>In that last .x3d example I sent, take apart a hand and work with one finger, maybe. </p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Just attach the root to the first finger joint of your choice. The joints and vertices are clearly marked in the user code, and I think there is a viewpoint in there aimed at the right hand. </p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>All Best, </p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Joe</p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p><div style='border:none;border-top:solid #E1E1E1 1.0pt;padding:3.0pt 0in 0in 0in'><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'><b>From: </b><a href="mailto:andreasplesch@gmail.com" target="_blank">Andreas Plesch</a><br><b>Sent: </b>Thursday, December 13, 2018 1:04 PM<br><b>To: </b><a href="mailto:joedwil@earthlink.net" target="_blank">Joe D Williams</a><br><b>Cc: </b><a href="mailto:x3d-public@web3d.org" target="_blank">X3D Graphics public mailing list</a>; <a href="mailto:michalis.kambi@gmail.com" target="_blank">Michalis Kamburelis</a>; <a href="mailto:h-anim@web3d.org" target="_blank">Humanoid Animation (H-Anim) Working Group</a><br><b>Subject: </b>Re: [x3d-public] glTF - HAnim conversion</p></div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Thanks. Well, I do believe in baby steps and so I want to get a very simple example right and fully understand it before moving to more fully developed examples.</p><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p></div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Let me also try to be very specific since a few of the responses below are based on my descriptions being too concise ('rotated vertices' vs 'vertex locations being translated according to a rotation about a center').</p></div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p></div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>I still wish there was a simple two joint with minimal skin HAnim example.</p></div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p></div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>I did not understand your response about not accepting that for implementation purposes it may be convenient to have a weighted joint per vertex rather than vertex per weighted joint data structure. Such a choice does not affect authoring meaning I am not suggesting changes to HAnim.</p></div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p></div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>More if there is some progress, -Andreas</p></div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p></div><div><blockquote style='border:none;border-left:solid #CCCCCC 1.0pt;padding:0in 0in 0in 6.0pt;margin-left:4.8pt;margin-top:5.0pt;margin-right:0in;margin-bottom:5.0pt'><div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> </p></div></div></blockquote></div></div></div></div></blockquote></div></div></div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto;margin-left:4.8pt'> </p></div></div></blockquote></div></div></div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto;margin-left:4.8pt'> </p><p class=MsoNormal><o:p> </o:p></p></div></body></html>