25개 이상의 토픽을 선택하실 수 없습니다. Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

meshviewer.index.html 11 KiB

11 년 전
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370
  1. <DOCTYPE html>
  2. <html>
  3. <meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
  4. <!--
  5. Copyright (c) 2012 The Native Client Authors. All rights reserved.
  6. Use of this source code is governed by a BSD-style license that can be
  7. found in the LICENSE file.
  8. -->
  9. <head>
  10. <style type="text/css">
  11. body
  12. {
  13. font:12px Consolas;
  14. }
  15. button
  16. {
  17. font:14px Consolas;
  18. }
  19. textarea
  20. {
  21. font:14px Consolas;
  22. }
  23. #id_div_progress_status
  24. {
  25. font:12px Consolas;
  26. }
  27. #id_div_progress
  28. {
  29. position: absolute;
  30. top: 20%;
  31. left: 30%;
  32. right: 30%;
  33. z-index: 3;
  34. background-color:white;
  35. border:1px solid #000000;
  36. visibility: hidden;
  37. z-index: 1;
  38. }
  39. progress
  40. {
  41. background-color: #f3f3f3;
  42. border: 0;
  43. height: 18px;
  44. width: 200px;
  45. border-radius: 9px;
  46. }
  47. progress::-webkit-progress-bar
  48. {
  49. background-color: #f3f3f3;
  50. border: 1px solid #000000;
  51. padding: 2px 2px;
  52. height: 20px;
  53. border-radius: 0px;
  54. }
  55. progress::-webkit-progress-value
  56. {
  57. background-color: #22BB22;
  58. border: 0px;
  59. height: 14px;
  60. border-radius: 0px;
  61. }
  62. #id_div_listener
  63. {
  64. position: relative;
  65. }
  66. #id_div_frame_embed
  67. {
  68. position: absolute;
  69. top: 2px;
  70. left: 2px;
  71. z-index: 0;
  72. }
  73. #BGCanvas
  74. {
  75. border:1px solid #000000;
  76. }
  77. #id_div_helper_cmd_0
  78. {
  79. margin-left: 5px;
  80. }
  81. </style>
  82. <title>Mesh Viewer Web Edition</title>
  83. </head>
  84. <script type="text/javascript">
  85. //Base data Setup : GLOBAL STYLE
  86. g_div_frame_embed_save = '';
  87. g_div_frame_embed = null;
  88. g_txtarea_code_src = null;
  89. g_div_helper_cmd = [null, null];
  90. g_div_helper_args = null;
  91. g_div_helper_cmnt = null;
  92. g_div_helper_vars = null;
  93. g_div_alphabet = null;
  94. g_div_progress = null;
  95. g_div_progress_status = null;
  96. g_progress_bar = null;
  97. g_var_progress_bar = -1;
  98. g_frame_embed = null;
  99. //This is the module pointer : can be either the NaCl or Em one depending on the context.
  100. g_embed_module = null;
  101. var g_autosave_timer = 4.0;
  102. var g_autosave_time = 4.0;
  103. var g_code_addin = ['custom setmesh "#CODE#"', '#CODE#'];
  104. var g_code_base = [];
  105. var CodeDictionnary = [];
  106. g_code_id = 0;
  107. g_code_base = ["//This is a comment\nsc#f8f afcb 1 1 1 0",
  108. "//This is a comment\naddlight 0.0 position (4 -1 -4) color (.0 .2 .5 1)\naddlight 0.0 position (8 2 6) color #ffff\nshowgizmo true\nshowlight true"];
  109. function machinchose() { return 'test machin '; }
  110. function GetTextAreaCodeSrc() { return g_txtarea_code_src; }
  111. function GetDivProgress() { return g_div_progress; }
  112. function GetProgressBar() { return g_progress_bar; }
  113. function GetDivProgressStatus() { return g_div_progress_status; }
  114. function GetDivEmbedData() { return g_div_frame_embed; }
  115. function GetDivEmbedDataSave() { return g_div_frame_embed_save; }
  116. function GetFrameData() { return g_frame_embed; }
  117. //Communication with iframe content.
  118. function InitModuleVar() { g_embed_module = GetiFrameModuleVar(); }
  119. function GetiFrameDivEmbed() { return (!g_frame_embed) ? (null) : (g_frame_embed.contentWindow.GetDivEmbed()); }
  120. function GetiFrameModuleVar() { return (!g_frame_embed) ? (null) : (g_frame_embed.contentWindow.GetEmbedModule()); }
  121. function IsUsingNaCl() { return window.chrome; }
  122. </script>
  123. <script src="../javascript/utils.js"></script>
  124. <script src="../javascript/progressstatus.js"></script>
  125. <script type="text/javascript">
  126. //Used by typedictionnary.js
  127. function GetCmdDictionnary() { return CodeDictionnary[g_code_id]; }
  128. g_code_id = 1;
  129. </script>
  130. <script src="../javascript/typedictionnary.js"></script>
  131. <!-- Init Scene setup dictionnary -->
  132. <script type="text/javascript">
  133. CodeDictionnary[g_code_id] = new TypeDictionnary("SceneSetup");
  134. </script>
  135. <script src="./scenesetupdictionnary.js"></script>
  136. <!-- Init Easy mesh dictionnary -->
  137. <script type="text/javascript">
  138. g_code_id--;
  139. CodeDictionnary[g_code_id] = new TypeDictionnary("EasyMesh");
  140. </script>
  141. <script src="./easymeshdictionnary.js"></script>
  142. <!-- Revert datas to normal -->
  143. <script type="text/javascript">
  144. g_code_id = 0;
  145. </script>
  146. <script type="text/javascript">
  147. //Base init for all datas
  148. function VarInit()
  149. {
  150. //Init frame variable first.
  151. g_frame_embed = document.getElementById('id_frame_embed');
  152. //This is in an iframe.
  153. g_div_frame_embed = g_frame_embed.contentDocument.getElementById('id_div_frame_embed');
  154. //The rest of these are in this page.
  155. g_txtarea_code_src = document.getElementById('id_txtarea_code_src');
  156. g_div_helper_cmd[0] = document.getElementById('id_div_helper_cmd_0');
  157. g_div_helper_cmd[1] = document.getElementById('id_div_helper_cmd_1');
  158. g_div_helper_args = document.getElementById('id_div_helper_args');
  159. g_div_helper_cmnt = document.getElementById('id_div_helper_cmnt');
  160. g_div_helper_vars = document.getElementById('id_div_helper_vars');
  161. g_div_alphabet = document.getElementById('id_div_alphabet');
  162. g_div_progress = document.getElementById('id_div_progress');
  163. g_div_progress_status = document.getElementById('id_div_progress_status');
  164. g_progress_bar = document.getElementById('id_progress_bar');
  165. }
  166. //Base init
  167. function Init()
  168. {
  169. VarInit();
  170. //Put here any cookie update
  171. if (DoesLolCookieExist("LolMeshViewerAutosave"))
  172. {
  173. var lol_cookie = GetLolCookie("LolMeshViewerAutosave");
  174. var value_list = lol_cookie.m_value.split(";");
  175. for (var i = 0; i < g_code_base.length && i < value_list.length; i++)
  176. g_code_base[i] = value_list[i];
  177. g_txtarea_code_src.value = g_code_base[g_code_id];
  178. }
  179. else if (!g_txtarea_code_src.value)
  180. g_txtarea_code_src.value = g_code_base[g_code_id];
  181. //Fill the TOC
  182. if (!g_div_alphabet.innerHTML)
  183. {
  184. for (var i = 0; i < CodeDictionnary.length; i++)
  185. {
  186. g_code_id = i;
  187. var new_toc = BuildTOC(true);
  188. var pattern = new RegExp("^[a-zA-Z\.]");
  189. while (pattern.test(new_toc))
  190. new_toc = new_toc.replace(pattern, "<b>$&");
  191. pattern = new RegExp("[a-zA-Z\.]$");
  192. while (pattern.test(new_toc))
  193. new_toc = new_toc.replace(pattern, "$&</b>");
  194. pattern = new RegExp("([a-zA-Z])([\.])");
  195. while (pattern.test(new_toc))
  196. new_toc = new_toc.replace(pattern, "$1</b>$2");
  197. pattern = new RegExp("([\.])([a-zA-Z])");
  198. while (pattern.test(new_toc))
  199. new_toc = new_toc.replace(pattern, "$1<b>$2");
  200. CodeDictionnary[i].m_alphabet = new_toc;
  201. }
  202. g_code_id = 0;
  203. InitEditValues();
  204. }
  205. //NaCl Specific
  206. if (IsUsingNaCl())
  207. {
  208. DynLoadFile("../javascript/naclloading.js");
  209. g_frame_embed.src = 'meshviewer.nacl.html';
  210. }
  211. else
  212. g_frame_embed.src = 'meshviewer.em.html';
  213. g_frame_embed.onload = function() { VarInit(); }
  214. //Tick has been done, start Tick
  215. window.setTimeout("Tick(.2)", 200);
  216. }
  217. function Tick(seconds)
  218. {
  219. window.setTimeout("Tick(.1)", 100);
  220. var text_src = g_txtarea_code_src;
  221. var div_cmds = g_div_helper_cmd;
  222. var div_args = g_div_helper_args;
  223. var div_cmnt = g_div_helper_cmnt;
  224. var div_vars = g_div_helper_vars;
  225. CmdLookup(div_cmds, div_args, div_cmnt, div_vars, text_src);
  226. g_autosave_timer -= seconds;
  227. if (g_autosave_timer < 0.0)
  228. {
  229. g_autosave_timer = g_autosave_time;
  230. StoreLolCookie("LolMeshViewerAutosave", GetTextValue(true), 10);
  231. }
  232. }
  233. function GetTextValue(getall)
  234. {
  235. var result = '';
  236. for (var i = (getall)?(0):(g_code_id); i < g_code_base.length; i++)
  237. {
  238. result += g_code_addin[i].replace('#CODE#', g_code_base[i]) + (getall)?(';'):('');
  239. if (getall && i == g_code_id)
  240. break;
  241. }
  242. return result;
  243. }
  244. function StoreTextAreaValue()
  245. {
  246. g_code_base[g_code_id] = GetTextAreaCodeSrc().value;
  247. }
  248. function ExchangeSetup()
  249. {
  250. StoreTextAreaValue();
  251. g_code_id = (g_code_id + 1) % 2;
  252. InitEditValues();
  253. }
  254. function InitEditValues()
  255. {
  256. GetTextAreaCodeSrc().value = g_code_base[g_code_id];
  257. g_div_alphabet.innerHTML = '&nbsp;Table of content<br>&nbsp;[' + CodeDictionnary[g_code_id].m_alphabet + ']&nbsp;<br>&nbsp;';
  258. }
  259. //Handle message from the NaCl module
  260. function ModuleSentMessage(message)
  261. {
  262. alert('Module sent message: ' + message.data);
  263. }
  264. //Called by the "Send Mesh Command !" button
  265. function SendMessageToModule()
  266. {
  267. StoreTextAreaValue();
  268. if (g_embed_module)
  269. {
  270. StoreLolCookie("LolMeshViewerAutosave", GetTextValue(true), 10);
  271. g_embed_module.SendMessage(GetTextValue(false));
  272. }
  273. else
  274. alert("Module not loaded !");
  275. }
  276. </script>
  277. <body>
  278. <h1>Mesh Viewer : Web version.</h1>
  279. <p>
  280. <div id="final_div">
  281. <div id="id_div_listener" align="center" style="width:770px;height:200px">
  282. <canvas id="BGCanvas" width="772" height="202"></canvas>
  283. <div id="id_div_progress">
  284. <br>&nbsp;
  285. <progress id="id_progress_bar" align="left"></progress>
  286. <div id="id_div_progress_status">....</div>&nbsp;
  287. </div>
  288. <div id="id_div_frame_embed">
  289. <iframe onload="Init();" id="id_frame_embed" src="../javascript/empty.html" width=770 height=200 frameborder=0 scrolling=no></iframe>
  290. </div>
  291. </div>
  292. </div>
  293. </p>
  294. <table border="0" cellpadding="0" cellspacing="0" width="772">
  295. <tr>
  296. <td align="left">
  297. <div><button onclick="SendMessageToModule()">Update program</button></div>
  298. </td>
  299. <td align="right">
  300. <div><button onclick="ExchangeSetup()">Change edit data</button></div>
  301. </td>
  302. </tr>
  303. </table>
  304. <table border="0" cellpadding="0" cellspacing="0">
  305. <tr>
  306. <td height="1%">
  307. <div id="bouton">
  308. <textarea autofocus id="id_txtarea_code_src" rows="6" cols="94" style="font: 14px Consolas; resize: none;"></textarea>
  309. </div>
  310. </td>
  311. <td valign="top" rowspan="3">&nbsp;</td>
  312. <td valign="top" rowspan="3">
  313. <div><b><u>Variable Types usage :</u></b></div>
  314. <div id="id_div_helper_vars"></div>
  315. </td>
  316. </tr>
  317. <tr>
  318. <td height="1%">
  319. <div id="id_div_alphabet"></div>
  320. </td>
  321. </tr>
  322. <tr>
  323. <td valign="top">
  324. <table border="0" cellpadding="0" cellspacing="0">
  325. <tr>
  326. <td valign="top"><div id="id_div_helper_cmd_0"></div></td>
  327. <td valign="top"><div id="id_div_helper_cmd_1"></div></td>
  328. <td valign="top"><div id="id_div_helper_args" ></div></td>
  329. <td valign="top"><div id="id_div_helper_cmnt" ></div></td>
  330. </tr>
  331. </table>
  332. </td>
  333. </tr>
  334. </table>
  335. </body>
  336. </html>