webtalekit-alpha 0.2.10 → 0.2.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (391) hide show
  1. package/.claude/settings.local.json +12 -0
  2. package/.clinerules +65 -0
  3. package/.history/README_20240812174230.md +193 -0
  4. package/.history/README_20240812175424.md +185 -0
  5. package/.history/README_20240812191012.md +185 -0
  6. package/.history/README_20240812191155.md +185 -0
  7. package/.history/README_20240812191211.md +185 -0
  8. package/.history/README_20240812192035.md +185 -0
  9. package/.history/dist/src/core/index_20240815021552.js +474 -0
  10. package/.history/dist/src/core/index_20240815022042.js +476 -0
  11. package/.history/dist/src/core/index_20240815022206.js +476 -0
  12. package/.history/dist/src/core/index_20240815023104.js +478 -0
  13. package/.history/dist/src/core/index_20240817022019.js +494 -0
  14. package/.history/dist/src/core/index_20240818013827.js +493 -0
  15. package/.history/dist/src/core/index_20240820001418.js +502 -0
  16. package/.history/package_20240812174230.json +45 -0
  17. package/.history/package_20240825011731.json +45 -0
  18. package/.history/package_20240825011739.json +44 -0
  19. package/.history/parser/parser_20240812174230.js +50 -0
  20. package/.history/parser/parser_20240825012739.js +47 -0
  21. package/.history/parser/parser_20240825012835.js +52 -0
  22. package/.history/src/core/drawer_20240813091343.ts +262 -0
  23. package/.history/src/core/drawer_20240815232345.ts +262 -0
  24. package/.history/src/core/drawer_20240815232350.ts +262 -0
  25. package/.history/src/core/drawer_20240816025257.ts +357 -0
  26. package/.history/src/core/drawer_20240816025358.ts +357 -0
  27. package/.history/src/core/drawer_20240816030148.ts +365 -0
  28. package/.history/src/core/drawer_20240816231033.ts +294 -0
  29. package/.history/src/core/drawer_20240816231107.ts +262 -0
  30. package/.history/src/core/drawer_20240816231234.ts +268 -0
  31. package/.history/src/core/drawer_20240817013836.ts +290 -0
  32. package/.history/src/core/drawer_20240817015150.ts +289 -0
  33. package/.history/src/core/drawer_20240817015353.ts +290 -0
  34. package/.history/src/core/drawer_20240817021254.ts +291 -0
  35. package/.history/src/core/drawer_20240817023440.ts +295 -0
  36. package/.history/src/core/drawer_20240817023445.ts +295 -0
  37. package/.history/src/core/drawer_20240818015327.ts +295 -0
  38. package/.history/src/core/drawer_20240819231006.ts +318 -0
  39. package/.history/src/core/drawer_20240820002829.ts +317 -0
  40. package/.history/src/core/drawer_20240820003141.ts +295 -0
  41. package/.history/src/core/drawer_20240824010043.ts +295 -0
  42. package/.history/src/core/drawer_20240825013311.ts +293 -0
  43. package/.history/src/core/drawer_20240902235257.ts +295 -0
  44. package/.history/src/core/drawer_20240904002038.ts +262 -0
  45. package/.history/src/core/drawer_20240904004020.ts +262 -0
  46. package/.history/src/core/drawer_20240904004238.ts +262 -0
  47. package/.history/src/core/drawer_20240904005648.ts +262 -0
  48. package/.history/src/core/drawer_20240904005808.ts +262 -0
  49. package/.history/src/core/drawer_20240904010523.ts +262 -0
  50. package/.history/src/core/drawer_20240904011611.ts +262 -0
  51. package/.history/src/core/drawer_20240904011740.ts +262 -0
  52. package/.history/src/core/index_20240812190102.js +443 -0
  53. package/.history/src/core/index_20240812190105.js +443 -0
  54. package/.history/src/core/index_20240812205421.js +452 -0
  55. package/.history/src/core/index_20240812213441.js +452 -0
  56. package/.history/src/core/index_20240812214203.js +453 -0
  57. package/.history/src/core/index_20240813090823.js +453 -0
  58. package/.history/src/core/index_20240813230449.js +452 -0
  59. package/.history/src/core/index_20240813230539.js +452 -0
  60. package/.history/src/core/index_20240813231447.js +453 -0
  61. package/.history/src/core/index_20240813231449.js +453 -0
  62. package/.history/src/core/index_20240813231511.js +453 -0
  63. package/.history/src/core/index_20240813231531.js +453 -0
  64. package/.history/src/core/index_20240813231913.js +453 -0
  65. package/.history/src/core/index_20240813232356.js +453 -0
  66. package/.history/src/core/index_20240813232640.js +453 -0
  67. package/.history/src/core/index_20240813232900.js +453 -0
  68. package/.history/src/core/index_20240814221127.js +454 -0
  69. package/.history/src/core/index_20240814221322.js +454 -0
  70. package/.history/src/core/index_20240814221526.js +454 -0
  71. package/.history/src/core/index_20240814222048.js +454 -0
  72. package/.history/src/core/index_20240814222918.js +459 -0
  73. package/.history/src/core/index_20240814223136.js +459 -0
  74. package/.history/src/core/index_20240814223501.js +464 -0
  75. package/.history/src/core/index_20240814224347.js +468 -0
  76. package/.history/src/core/index_20240815013712.js +474 -0
  77. package/.history/src/core/index_20240815021534.js +474 -0
  78. package/.history/src/core/index_20240815023143.js +477 -0
  79. package/.history/src/core/index_20240815023207.js +479 -0
  80. package/.history/src/core/index_20240815023344.js +481 -0
  81. package/.history/src/core/index_20240815035600.js +479 -0
  82. package/.history/src/core/index_20240815041549.js +480 -0
  83. package/.history/src/core/index_20240815185515.js +481 -0
  84. package/.history/src/core/index_20240815192158.js +481 -0
  85. package/.history/src/core/index_20240815222912.js +482 -0
  86. package/.history/src/core/index_20240815224052.js +483 -0
  87. package/.history/src/core/index_20240815224843.js +484 -0
  88. package/.history/src/core/index_20240815224850.js +483 -0
  89. package/.history/src/core/index_20240815231706.js +479 -0
  90. package/.history/src/core/index_20240816025748.js +483 -0
  91. package/.history/src/core/index_20240816030102.js +484 -0
  92. package/.history/src/core/index_20240817013329.js +485 -0
  93. package/.history/src/core/index_20240817013526.js +485 -0
  94. package/.history/src/core/index_20240817013819.js +488 -0
  95. package/.history/src/core/index_20240817013829.js +488 -0
  96. package/.history/src/core/index_20240817014921.js +494 -0
  97. package/.history/src/core/index_20240817022057.js +494 -0
  98. package/.history/src/core/index_20240817023316.js +493 -0
  99. package/.history/src/core/index_20240818005637.js +493 -0
  100. package/.history/src/core/index_20240818005721.js +493 -0
  101. package/.history/src/core/index_20240818011804.js +493 -0
  102. package/.history/src/core/index_20240818013835.js +493 -0
  103. package/.history/src/core/index_20240818014310.js +493 -0
  104. package/.history/src/core/index_20240818014323.js +493 -0
  105. package/.history/src/core/index_20240818014333.js +493 -0
  106. package/.history/src/core/index_20240818020725.js +496 -0
  107. package/.history/src/core/index_20240819195504.js +497 -0
  108. package/.history/src/core/index_20240819202012.js +495 -0
  109. package/.history/src/core/index_20240819231228.js +501 -0
  110. package/.history/src/core/index_20240819232555.js +502 -0
  111. package/.history/src/core/index_20240819233404.js +502 -0
  112. package/.history/src/core/index_20240820003114.js +495 -0
  113. package/.history/src/core/index_20240820003120.js +495 -0
  114. package/.history/src/core/index_20240820003331.js +495 -0
  115. package/.history/src/core/index_20240820004126.js +498 -0
  116. package/.history/src/core/index_20240820004357.js +497 -0
  117. package/.history/src/core/index_20240820005103.js +498 -0
  118. package/.history/src/core/index_20240820005110.js +499 -0
  119. package/.history/src/core/index_20240820005206.js +497 -0
  120. package/.history/src/core/index_20240820005352.js +497 -0
  121. package/{src/core/index.js → .history/src/core/index_20240823224904.ts} +75 -224
  122. package/.history/src/core/index_20240823224905.js +505 -0
  123. package/.history/src/core/index_20240823231631.ts +530 -0
  124. package/.history/src/core/index_20240823231735.ts +530 -0
  125. package/.history/src/core/index_20240823232123.ts +539 -0
  126. package/.history/src/core/index_20240823232329.ts +539 -0
  127. package/.history/src/core/index_20240823233058.ts +539 -0
  128. package/.history/src/core/index_20240823234946.ts +539 -0
  129. package/.history/src/core/index_20240824005956.ts +534 -0
  130. package/.history/src/core/index_20240824010113.ts +534 -0
  131. package/.history/src/core/index_20240824010124.ts +534 -0
  132. package/.history/src/core/index_20240824010212.ts +534 -0
  133. package/.history/src/core/index_20240824010218.ts +534 -0
  134. package/.history/src/core/index_20240824010407.ts +534 -0
  135. package/.history/src/core/index_20240824010611.ts +534 -0
  136. package/.history/src/core/index_20240824010623.ts +534 -0
  137. package/.history/src/core/index_20240824010652.ts +534 -0
  138. package/.history/src/core/index_20240824011007.ts +534 -0
  139. package/.history/src/core/index_20240824210450.ts +534 -0
  140. package/.history/src/core/index_20240824210703.ts +534 -0
  141. package/.history/src/core/index_20240824210708.ts +534 -0
  142. package/.history/src/core/index_20240824211001.ts +537 -0
  143. package/.history/src/core/index_20240824211258.ts +537 -0
  144. package/.history/src/core/index_20240824211654.ts +537 -0
  145. package/.history/src/core/index_20240824211723.ts +537 -0
  146. package/.history/src/core/index_20240824211808.ts +538 -0
  147. package/.history/src/core/index_20240824214041.js +538 -0
  148. package/.history/src/core/index_20240824215312.ts +538 -0
  149. package/.history/src/core/index_20240824215341.ts +538 -0
  150. package/.history/src/core/index_20240824220703.ts +538 -0
  151. package/.history/src/core/index_20240824220709.ts +538 -0
  152. package/.history/src/core/index_20240825012244.ts +536 -0
  153. package/.history/src/core/index_20240825012435.ts +539 -0
  154. package/.history/src/core/index_20240825012440.ts +539 -0
  155. package/.history/src/core/index_20240826005054.ts +539 -0
  156. package/.history/src/core/index_20240826005321.ts +540 -0
  157. package/.history/src/core/index_20240826005410.ts +539 -0
  158. package/.history/src/core/index_20240826005418.ts +539 -0
  159. package/.history/src/core/index_20240830231825.ts +539 -0
  160. package/.history/src/core/index_20240831022416.ts +539 -0
  161. package/.history/src/core/index_20240901222314.js +459 -0
  162. package/.history/src/core/index_20240901222951.js +459 -0
  163. package/.history/src/core/index_20240901223824.js +471 -0
  164. package/.history/src/core/index_20240901223833.js +468 -0
  165. package/.history/src/core/index_20240902223954.js +447 -0
  166. package/.history/src/core/index_20240902224000.js +446 -0
  167. package/.history/src/core/index_20240902230345.js +448 -0
  168. package/.history/src/core/index_20240902231130.js +449 -0
  169. package/.history/src/core/index_20240902231559.js +449 -0
  170. package/.history/src/core/index_20240902232135.js +449 -0
  171. package/.history/src/core/index_20240902232809.js +452 -0
  172. package/.history/src/core/index_20240902232815.js +452 -0
  173. package/.history/src/core/index_20240903000104.js +467 -0
  174. package/.history/src/core/index_20240904001731.js +444 -0
  175. package/.history/src/core/index_20240904002038.ts +539 -0
  176. package/.history/src/core/index_20240904011848.js +444 -0
  177. package/.history/src/core/index_20240904012138.js +444 -0
  178. package/.history/src/core/index_20240904012743.js +444 -0
  179. package/.history/src/core/index_20240904013051.js +444 -0
  180. package/.history/src/core/resourceManager_20240403231531.ts +16 -0
  181. package/.history/src/core/resourceManager_20240823232627.ts +17 -0
  182. package/.history/src/core/resourceManager_20240824214014.js +16 -0
  183. package/.history/src/core/resourceManager_20240824214620.js +17 -0
  184. package/.history/src/core/scenarioManager_20240812203410.ts +86 -0
  185. package/.history/src/core/scenarioManager_20240812203839.ts +94 -0
  186. package/.history/src/core/scenarioManager_20240812213437.ts +85 -0
  187. package/.history/src/core/scenarioManager_20240813225852.ts +85 -0
  188. package/.history/src/core/scenarioManager_20240823235010.ts +85 -0
  189. package/.history/src/core/scenarioManager_20240904002038.ts +94 -0
  190. package/.history/src/core/scenarioManager_20240904012411.ts +94 -0
  191. package/.history/src/core/scenarioManager_20240904012519.ts +94 -0
  192. package/.history/src/index_20240403231531.js +6 -0
  193. package/.history/src/index_20240429233436.js +8 -0
  194. package/.history/src/index_20240429233926.js +8 -0
  195. package/.history/src/index_20240429234401.js +7 -0
  196. package/.history/src/index_20240429234404.js +6 -0
  197. package/.history/src/resource/soundObject_20240419004314.ts +71 -0
  198. package/.history/src/resource/soundObject_20240815034420.ts +66 -0
  199. package/.history/src/resource/soundObject_20240815034836.ts +79 -0
  200. package/.history/src/resource/soundObject_20240815034919.ts +87 -0
  201. package/.history/src/resource/soundObject_20240815040724.ts +81 -0
  202. package/.history/src/resource/soundObject_20240815041022.ts +87 -0
  203. package/.history/src/resource/soundObject_20240815042103.ts +87 -0
  204. package/.history/src/resource/soundObject_20240823235929.ts +91 -0
  205. package/.history/src/resource/soundObject_20240824213129.ts +99 -0
  206. package/.history/src/resource/soundObject_20240824213611.ts +101 -0
  207. package/.history/src/resource/soundObject_20240824215734.ts +101 -0
  208. package/.history/src/resource/soundObject_20240825004926.ts +101 -0
  209. package/.history/src/resource/soundObject_20240825004947.ts +101 -0
  210. package/.history/src/utils/logger_20240812174230.ts +13 -0
  211. package/.history/src/utils/logger_20240823232736.ts +14 -0
  212. package/.history/src/utils/logger_20240824214930.js +14 -0
  213. package/.history/src/utils/store_20240812174230.ts +17 -0
  214. package/.history/src/utils/store_20240823232948.ts +29 -0
  215. package/.history/src/utils/store_20240824214020.js +17 -0
  216. package/.history/src/utils/store_20240824214955.js +29 -0
  217. package/.history/src/utils/waitUtil_20240812174230.ts +4 -0
  218. package/.history/src/utils/waitUtil_20240823232739.ts +4 -0
  219. package/.history/src/utils/waitUtil_20240824214024.js +4 -0
  220. package/.history/src/utils/waitUtil_20240824215009.js +4 -0
  221. package/.history/test/js/title_20240428215305.js +254 -0
  222. package/.history/test/js/title_20240429221911.js +227 -0
  223. package/.history/test/js/title_20240429222806.js +243 -0
  224. package/.history/test/js/title_20240429222854.js +263 -0
  225. package/.history/test/js/title_20240429222906.js +263 -0
  226. package/.history/test/js/title_20240429235639.js +263 -0
  227. package/.history/test/js/title_20240429235840.js +263 -0
  228. package/.history/test/js/title_20240430014721.js +262 -0
  229. package/.history/test/js/title_20240430014759.js +254 -0
  230. package/.history/test/js/title_20240430134612.js +285 -0
  231. package/.history/test/js/title_20240430141051.js +285 -0
  232. package/.history/test/js/title_20240430173745.js +245 -0
  233. package/.history/tsconfig_20240812174230.json +22 -0
  234. package/.history/tsconfig_20240824010157.json +19 -0
  235. package/.history/tsconfig_20240824220700.json +20 -0
  236. package/.history/tsconfig_20240825011301.json +20 -0
  237. package/.history/webpack.config_20240423002825.js +37 -0
  238. package/.history/webpack.config_20240430001157.js +38 -0
  239. package/.history/webpack.config_20240430001309.js +37 -0
  240. package/.history/webpack.config_20240430002112.js +37 -0
  241. package/CLAUDE.md +96 -0
  242. package/LICENSE +21 -0
  243. package/README.md +149 -48
  244. package/coverage/lcov-report/base.css +224 -0
  245. package/coverage/lcov-report/block-navigation.js +87 -0
  246. package/coverage/lcov-report/core/drawer.ts.html +1264 -0
  247. package/coverage/lcov-report/core/index.html +146 -0
  248. package/coverage/lcov-report/core/resourceManager.ts.html +136 -0
  249. package/coverage/lcov-report/core/scenarioManager.ts.html +373 -0
  250. package/coverage/lcov-report/favicon.png +0 -0
  251. package/coverage/lcov-report/index.html +146 -0
  252. package/coverage/lcov-report/prettify.css +1 -0
  253. package/coverage/lcov-report/prettify.js +2 -0
  254. package/coverage/lcov-report/resource/ImageObject.ts.html +433 -0
  255. package/coverage/lcov-report/resource/index.html +131 -0
  256. package/coverage/lcov-report/resource/soundObject.ts.html +346 -0
  257. package/coverage/lcov-report/sort-arrow-sprite.png +0 -0
  258. package/coverage/lcov-report/sorter.js +196 -0
  259. package/coverage/lcov-report/utils/TextMeasurer.ts.html +520 -0
  260. package/coverage/lcov-report/utils/index.html +161 -0
  261. package/coverage/lcov-report/utils/logger.ts.html +142 -0
  262. package/coverage/lcov-report/utils/store.ts.html +151 -0
  263. package/coverage/lcov-report/utils/waitUtil.ts.html +97 -0
  264. package/coverage/lcov.info +882 -0
  265. package/dist/README.md +294 -0
  266. package/dist/engineConfig.json +10 -0
  267. package/dist/package.json +51 -0
  268. package/dist/parser/cli.js +61 -0
  269. package/dist/parser/parser.js +53 -0
  270. package/{src → dist/src}/core/drawer.js +2 -11
  271. package/dist/src/core/drawer.js.map +1 -0
  272. package/dist/src/core/index.js +969 -0
  273. package/{src → dist/src}/core/scenarioManager.js +5 -6
  274. package/dist/src/core/scenarioManager.js.map +1 -0
  275. package/{src → dist/src}/resource/ImageObject.js +2 -2
  276. package/{src → dist/src}/resource/soundObject.js +6 -4
  277. package/dist/src/resource/soundObject.js.map +1 -0
  278. package/dist/src/utils/fallbackTemplate.js +13 -0
  279. package/dist/src/utils/fallbackTemplate.js.map +1 -0
  280. package/{src → dist/src}/utils/logger.js +4 -3
  281. package/dist/src/utils/logger.js.map +1 -0
  282. package/{src → dist/src}/utils/waitUtil.js +4 -3
  283. package/dist/src/utils/waitUtil.js.map +1 -0
  284. package/dist/webtalekit-alpha-0.2.13.tgz +0 -0
  285. package/docs/event-system-specification.md +493 -0
  286. package/docs/glossary.html +833 -0
  287. package/docs/index.html +296 -0
  288. package/docs/tag-reference.html +1317 -0
  289. package/docs/ui-template-guide.html +1068 -0
  290. package/example/README.md +29 -0
  291. package/example/engineConfig.json +10 -0
  292. package/example/package-lock.json +5145 -0
  293. package/example/package.json +26 -0
  294. package/example/src/index.js +13 -0
  295. package/example/src/resource/background/beach.jpg +0 -0
  296. package/example/src/resource/background/city.jpg +0 -0
  297. package/example/src/resource/background/crossroad.jpg +0 -0
  298. package/example/src/resource/background/forest.jpg +0 -0
  299. package/example/src/resource/background/laboratory.jpg +0 -0
  300. package/example/src/resource/background/library.jpg +0 -0
  301. package/example/src/resource/background/living_room.jpg +0 -0
  302. package/example/src/resource/background/music_room.jpg +0 -0
  303. package/example/src/resource/background/stage.jpg +0 -0
  304. package/example/src/resource/background/sunset.jpg +0 -0
  305. package/example/src/resource/background/title_bg.png +0 -0
  306. package/example/src/resource/bgm/calm_music.wav +0 -0
  307. package/example/src/resource/bgm/doorbell.mp3 +0 -0
  308. package/example/src/resource/bgm/nc366476_Virtual_Voyage.mp3 +0 -0
  309. package/example/src/resource/bgm/title_theme.mp3 +0 -0
  310. package/example/src/resource/chara/dancer.png +0 -0
  311. package/example/src/resource/chara/guest.png +0 -0
  312. package/example/src/resource/chara/guide.png +0 -0
  313. package/example/src/resource/chara/scientist.png +0 -0
  314. package/example/src/resource/config.js +0 -0
  315. package/example/src/resource/se/doorbell.mp3 +0 -0
  316. package/example/src/resource/system/systemPicture/01_message/message.png +0 -0
  317. package/example/src/resource/system/systemPicture/02_button/button.png +0 -0
  318. package/example/src/resource/system/systemPicture/02_button/button2.png +0 -0
  319. package/example/src/resource/system/systemPicture/02_button/button3.png +0 -0
  320. package/example/src/resource/system/systemPicture/03_system_button/auto.png +0 -0
  321. package/example/src/resource/system/systemPicture/03_system_button/auto2.png +0 -0
  322. package/example/src/resource/system/systemPicture/03_system_button/close.png +0 -0
  323. package/example/src/resource/system/systemPicture/03_system_button/close2.png +0 -0
  324. package/example/src/resource/system/systemPicture/03_system_button/config.png +0 -0
  325. package/example/src/resource/system/systemPicture/03_system_button/config2.png +0 -0
  326. package/example/src/resource/system/systemPicture/03_system_button/load.png +0 -0
  327. package/example/src/resource/system/systemPicture/03_system_button/load2.png +0 -0
  328. package/example/src/resource/system/systemPicture/03_system_button/log.png +0 -0
  329. package/example/src/resource/system/systemPicture/03_system_button/log2.png +0 -0
  330. package/example/src/resource/system/systemPicture/03_system_button/menu.png +0 -0
  331. package/example/src/resource/system/systemPicture/03_system_button/menu2.png +0 -0
  332. package/example/src/resource/system/systemPicture/03_system_button/qload.png +0 -0
  333. package/example/src/resource/system/systemPicture/03_system_button/qload2.png +0 -0
  334. package/example/src/resource/system/systemPicture/03_system_button/qsave.png +0 -0
  335. package/example/src/resource/system/systemPicture/03_system_button/qsave2.png +0 -0
  336. package/example/src/resource/system/systemPicture/03_system_button/save.png +0 -0
  337. package/example/src/resource/system/systemPicture/03_system_button/save2.png +0 -0
  338. package/example/src/resource/system/systemPicture/03_system_button/screen.png +0 -0
  339. package/example/src/resource/system/systemPicture/03_system_button/screen2.png +0 -0
  340. package/example/src/resource/system/systemPicture/03_system_button/skip.png +0 -0
  341. package/example/src/resource/system/systemPicture/03_system_button/skip2.png +0 -0
  342. package/example/src/resource/system/systemPicture/03_system_button/title.png +0 -0
  343. package/example/src/resource/system/systemPicture/03_system_button/title2.png +0 -0
  344. package/example/src/resource/system/systemPicture//345/210/251/347/224/250/350/246/217/347/264/204.txt +0 -0
  345. package/example/src/resource/system/wait.gif +0 -0
  346. package/example/src/scene/animation.scene +28 -0
  347. package/example/src/scene/background.scene +29 -0
  348. package/example/src/scene/character.scene +26 -0
  349. package/example/src/scene/choice.scene +97 -0
  350. package/example/src/scene/dialog.scene +105 -0
  351. package/example/src/scene/effects.scene +38 -0
  352. package/example/src/scene/en/animation.scene +28 -0
  353. package/example/src/scene/en/background.scene +26 -0
  354. package/example/src/scene/en/character.scene +26 -0
  355. package/example/src/scene/en/choice.scene +32 -0
  356. package/example/src/scene/en/effects.scene +37 -0
  357. package/example/src/scene/en/sound.scene +26 -0
  358. package/example/src/scene/en/text.scene +26 -0
  359. package/example/src/scene/en/title.scene +39 -0
  360. package/example/src/scene/if_test.scene +37 -0
  361. package/example/src/scene/resource-error-test.scene +15 -0
  362. package/example/src/scene/save-load-test.scene +48 -0
  363. package/example/src/scene/sound.scene +26 -0
  364. package/example/src/scene/test_error.scene +21 -0
  365. package/example/src/scene/text.scene +34 -0
  366. package/example/src/scene/title.scene +51 -0
  367. package/example/src/screen/incoming.html +474 -0
  368. package/example/src/screen/title.html +135 -0
  369. package/example/src/template.html +16 -0
  370. package/example/test-results/.last-run.json +4 -0
  371. package/example/webpack.config.js +69 -0
  372. package/image.png +0 -0
  373. package/package.json +3 -1
  374. package/playwright-report/index.html +71 -0
  375. package/s-plan1-5Light-s-1.jpg +0 -0
  376. package/test-results/.last-run.json +6 -0
  377. package/tests/e2e/if-global-attribute.spec.js +90 -0
  378. package/tests/e2e/resource-error-handling.spec.js +58 -0
  379. package/tests/e2e/screenshots/before-error-check.png +0 -0
  380. package/tests/e2e/screenshots/choices.png +0 -0
  381. package/tests/e2e/screenshots/message-window-click-wait.png +0 -0
  382. package/src/core/drawer.js.map +0 -1
  383. package/src/core/scenarioManager.js.map +0 -1
  384. package/src/resource/soundObject.js.map +0 -1
  385. package/src/utils/logger.js.map +0 -1
  386. package/src/utils/waitUtil.js.map +0 -1
  387. /package/{src → dist/src}/core/resourceManager.js +0 -0
  388. /package/{src → dist/src}/core/resourceManager.js.map +0 -0
  389. /package/{src → dist/src}/resource/ImageObject.js.map +0 -0
  390. /package/{src → dist/src}/utils/store.js +0 -0
  391. /package/{src → dist/src}/utils/store.js.map +0 -0
@@ -0,0 +1,1317 @@
1
+ <!DOCTYPE html>
2
+ <html lang="ja">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>webTaleKit タグリファレンス</title>
7
+ <style>
8
+ body {
9
+ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
10
+ line-height: 1.6;
11
+ margin: 0;
12
+ padding: 0;
13
+ background: linear-gradient(135deg, #87CEEB 0%, #4169E1 50%, #1E90FF 100%);
14
+ color: #333;
15
+ }
16
+ .container {
17
+ max-width: 1400px;
18
+ margin: 0 auto;
19
+ padding: 20px;
20
+ background: rgba(255, 255, 255, 0.95);
21
+ border-radius: 15px;
22
+ box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
23
+ margin-top: 20px;
24
+ margin-bottom: 20px;
25
+ }
26
+ .main-layout {
27
+ display: flex;
28
+ gap: 20px;
29
+ }
30
+ .sidebar {
31
+ flex: 0 0 280px;
32
+ background: white;
33
+ border-radius: 10px;
34
+ padding: 20px;
35
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
36
+ position: sticky;
37
+ top: 20px;
38
+ height: fit-content;
39
+ max-height: calc(100vh - 40px);
40
+ overflow-y: auto;
41
+ }
42
+ .content {
43
+ flex: 1;
44
+ min-width: 0;
45
+ }
46
+ h1 {
47
+ text-align: center;
48
+ color: #2c3e50;
49
+ font-size: 2.5em;
50
+ margin-bottom: 30px;
51
+ text-shadow: 2px 2px 4px rgba(0,0,0,0.1);
52
+ }
53
+ .intro {
54
+ background: #f8f9fa;
55
+ padding: 20px;
56
+ border-radius: 10px;
57
+ margin-bottom: 30px;
58
+ border-left: 5px solid #3498db;
59
+ }
60
+ .nav {
61
+ background: #34495e;
62
+ padding: 15px;
63
+ border-radius: 10px;
64
+ margin-bottom: 20px;
65
+ }
66
+ .nav h3 {
67
+ color: white;
68
+ margin: 0 0 15px 0;
69
+ font-size: 1.2em;
70
+ border-bottom: 1px solid #4a5f7a;
71
+ padding-bottom: 10px;
72
+ }
73
+ .nav ul {
74
+ list-style: none;
75
+ padding: 0;
76
+ margin: 0;
77
+ display: flex;
78
+ flex-direction: column;
79
+ gap: 5px;
80
+ }
81
+ .nav li {
82
+ background: transparent;
83
+ border-radius: 5px;
84
+ border-left: 3px solid transparent;
85
+ transition: all 0.3s;
86
+ }
87
+ .nav li:hover {
88
+ border-left-color: #3498db;
89
+ background: rgba(52, 152, 219, 0.1);
90
+ }
91
+ .nav a {
92
+ color: #ecf0f1;
93
+ text-decoration: none;
94
+ padding: 8px 15px;
95
+ display: block;
96
+ transition: color 0.3s;
97
+ font-size: 0.95em;
98
+ }
99
+ .nav a:hover {
100
+ color: #3498db;
101
+ }
102
+ .tag-section {
103
+ background: white;
104
+ margin-bottom: 25px;
105
+ padding: 25px;
106
+ border-radius: 10px;
107
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
108
+ border-left: 5px solid #e74c3c;
109
+ }
110
+ .tag-name {
111
+ font-size: 1.8em;
112
+ font-weight: bold;
113
+ color: #e74c3c;
114
+ margin-bottom: 10px;
115
+ border-bottom: 2px solid #ecf0f1;
116
+ padding-bottom: 10px;
117
+ }
118
+ .tag-description {
119
+ margin-bottom: 20px;
120
+ font-size: 1.1em;
121
+ color: #555;
122
+ }
123
+ .attributes {
124
+ background: #f8f9fa;
125
+ padding: 15px;
126
+ border-radius: 8px;
127
+ margin-bottom: 20px;
128
+ }
129
+ .attributes h4 {
130
+ margin-top: 0;
131
+ color: #2c3e50;
132
+ border-bottom: 1px solid #bdc3c7;
133
+ padding-bottom: 5px;
134
+ }
135
+ .attr-list {
136
+ display: grid;
137
+ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
138
+ gap: 10px;
139
+ }
140
+ .attr-item {
141
+ background: white;
142
+ padding: 10px;
143
+ border-radius: 5px;
144
+ border-left: 3px solid #3498db;
145
+ }
146
+ .attr-name {
147
+ font-weight: bold;
148
+ color: #2c3e50;
149
+ }
150
+ .attr-type {
151
+ color: #7f8c8d;
152
+ font-size: 0.9em;
153
+ font-style: italic;
154
+ }
155
+ .examples {
156
+ background: #2c3e50;
157
+ color: #ecf0f1;
158
+ padding: 20px;
159
+ border-radius: 8px;
160
+ margin-bottom: 15px;
161
+ }
162
+ .examples h4 {
163
+ margin-top: 0;
164
+ color: #3498db;
165
+ border-bottom: 1px solid #34495e;
166
+ padding-bottom: 5px;
167
+ }
168
+ .code-block {
169
+ background: #34495e;
170
+ padding: 15px;
171
+ border-radius: 5px;
172
+ margin: 10px 0;
173
+ overflow-x: auto;
174
+ border-left: 3px solid #3498db;
175
+ }
176
+ .code-block pre {
177
+ margin: 0;
178
+ font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
179
+ font-size: 0.9em;
180
+ line-height: 1.4;
181
+ }
182
+ .usage-notes {
183
+ background: #fff3cd;
184
+ border: 1px solid #ffeaa7;
185
+ border-radius: 8px;
186
+ padding: 15px;
187
+ margin-top: 15px;
188
+ }
189
+ .usage-notes h4 {
190
+ margin-top: 0;
191
+ color: #856404;
192
+ }
193
+ .back-to-top {
194
+ position: fixed;
195
+ bottom: 20px;
196
+ right: 20px;
197
+ background: #3498db;
198
+ color: white;
199
+ padding: 10px 15px;
200
+ border-radius: 50px;
201
+ text-decoration: none;
202
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
203
+ transition: all 0.3s;
204
+ }
205
+ .back-to-top:hover {
206
+ background: #2980b9;
207
+ transform: translateY(-2px);
208
+ }
209
+ @media (max-width: 1024px) {
210
+ .main-layout {
211
+ flex-direction: column;
212
+ }
213
+ .sidebar {
214
+ flex: none;
215
+ position: static;
216
+ max-height: none;
217
+ margin-bottom: 20px;
218
+ }
219
+ .nav ul {
220
+ display: flex;
221
+ flex-direction: row;
222
+ flex-wrap: wrap;
223
+ gap: 10px;
224
+ }
225
+ .nav li {
226
+ background: #3498db;
227
+ border-left: none;
228
+ }
229
+ .nav a {
230
+ color: white;
231
+ padding: 8px 15px;
232
+ }
233
+ .nav a:hover {
234
+ background: rgba(255, 255, 255, 0.2);
235
+ color: white;
236
+ }
237
+ }
238
+ @media (max-width: 768px) {
239
+ .container {
240
+ margin: 10px;
241
+ padding: 15px;
242
+ }
243
+ .attr-list {
244
+ grid-template-columns: 1fr;
245
+ }
246
+ }
247
+ </style>
248
+ </head>
249
+ <body>
250
+ <div class="container">
251
+ <h1>webTaleKit タグリファレンス</h1>
252
+
253
+ <div class="intro">
254
+ <h2>概要</h2>
255
+ <p>webTaleKitは、TypeScript/JavaScriptベースのビジュアルノベルエンジンです。このリファレンスでは、.sceneファイルで使用できるすべてのタグとその属性について詳しく説明しています。</p>
256
+ <p>各タグは特定の機能を提供し、組み合わせることで豊かなインタラクティブストーリーを作成できます。</p>
257
+
258
+ <div style="background: #e8f4fd; padding: 15px; border-radius: 8px; border-left: 4px solid #2196F3; margin-top: 20px;">
259
+ <h3 style="margin-top: 0; color: #1976D2;">🌟 グローバル属性</h3>
260
+ <p style="margin-bottom: 0;"><strong>if属性:</strong>すべてのタグで<code style="background: #f5f5f5; padding: 2px 6px; border-radius: 3px;">if="条件式"</code>を使用できます。条件がtrueの場合のみそのタグが実行されます。</p>
261
+ </div>
262
+ </div>
263
+
264
+ <div class="main-layout">
265
+ <aside class="sidebar">
266
+ <nav class="nav">
267
+ <h3>タグ一覧</h3>
268
+ <ul>
269
+ <li><a href="#text">text</a></li>
270
+ <li><a href="#say">say</a></li>
271
+ <li><a href="#choice">choice</a></li>
272
+ <li><a href="#show">show</a></li>
273
+ <li><a href="#hide">hide</a></li>
274
+ <li><a href="#sound">sound</a></li>
275
+ <li><a href="#jump">jump</a></li>
276
+ <li><a href="#route">route</a></li>
277
+ <li><a href="#if">if</a></li>
278
+ <li><a href="#call">call</a></li>
279
+ <li><a href="#moveto">moveto</a></li>
280
+ <li><a href="#wait">wait</a></li>
281
+ <li><a href="#dialog">dialog</a></li>
282
+ <li><a href="#newpage">newpage</a></li>
283
+ </ul>
284
+ </nav>
285
+ </aside>
286
+ <main class="content">
287
+
288
+ <section id="text" class="tag-section">
289
+ <div class="tag-name">&lt;text&gt;</div>
290
+ <div class="tag-description">
291
+ 基本的なテキスト表示を行います。ゲームの地の文や説明文の表示に使用されます。
292
+ </div>
293
+
294
+ <div class="attributes">
295
+ <h4>属性</h4>
296
+ <div class="attr-list">
297
+ <div class="attr-item">
298
+ <div class="attr-name">speed</div>
299
+ <div class="attr-type">number (省略可)</div>
300
+ <div>テキストの表示速度(ミリ秒)。デフォルト: 25</div>
301
+ </div>
302
+ <div class="attr-item">
303
+ <div class="attr-name">time</div>
304
+ <div class="attr-type">number (省略可)</div>
305
+ <div>表示後の待機時間(ミリ秒)</div>
306
+ </div>
307
+ <div class="attr-item">
308
+ <div class="attr-name">get / post / put / delete</div>
309
+ <div class="attr-type">string (省略可)</div>
310
+ <div>HTTPリクエストのURL。子要素でheader、data、then、errorを指定</div>
311
+ </div>
312
+ </div>
313
+ </div>
314
+
315
+ <div class="attributes">
316
+ <h4>マークアップタグ</h4>
317
+ <div class="attr-list">
318
+ <div class="attr-item">
319
+ <div class="attr-name">&lt;color value="色名"&gt;</div>
320
+ <div class="attr-type">文字色指定</div>
321
+ <div>文字の色を変更します(red, blue, #ff0000など)</div>
322
+ </div>
323
+ <div class="attr-item">
324
+ <div class="attr-name">&lt;b&gt;</div>
325
+ <div class="attr-type">太字</div>
326
+ <div>テキストを太字で表示します</div>
327
+ </div>
328
+ <div class="attr-item">
329
+ <div class="attr-name">&lt;i&gt;</div>
330
+ <div class="attr-type">斜体</div>
331
+ <div>テキストを斜体で表示します</div>
332
+ </div>
333
+ <div class="attr-item">
334
+ <div class="attr-name">&lt;ruby text="ルビ"&gt;</div>
335
+ <div class="attr-type">ルビ</div>
336
+ <div>漢字等にルビを振ります</div>
337
+ </div>
338
+ <div class="attr-item">
339
+ <div class="attr-name">&lt;br&gt;</div>
340
+ <div class="attr-type">改行 + 待機</div>
341
+ <div>テキストを改行し、クリック待ちします(waitタグのエイリアス)</div>
342
+ </div>
343
+ <div class="attr-item">
344
+ <div class="attr-name">&lt;wait time="ミリ秒" nw /&gt;</div>
345
+ <div class="attr-type">一時停止</div>
346
+ <div>テキスト表示中に指定時間待機します。timeを省略するとクリック待ち。nw属性で待機スキップ</div>
347
+ </div>
348
+ </div>
349
+ </div>
350
+
351
+ <div class="examples">
352
+ <h4>使用例</h4>
353
+ <div class="code-block">
354
+ <pre>&lt;text&gt;これは基本的なテキストです。&lt;/text&gt;
355
+
356
+ &lt;text speed="10"&gt;ゆっくりと表示されるテキストです。&lt;/text&gt;
357
+
358
+ &lt;text&gt;変数も使用できます: {{playerName}}&lt;/text&gt;
359
+
360
+ &lt;!-- マークアップタグの使用例 --&gt;
361
+ &lt;text&gt;
362
+ &lt;color value="red"&gt;赤い文字&lt;/color&gt;や&lt;b&gt;太字&lt;/b&gt;、&lt;i&gt;斜体&lt;/i&gt;も使えます。
363
+ &lt;br&gt;改行も簡単です。
364
+ &lt;/text&gt;
365
+
366
+ &lt;!-- ルビの使用例 --&gt;
367
+ &lt;text&gt;
368
+ &lt;ruby text="かんじ"&gt;漢字&lt;/ruby&gt;にルビを振ることができます。
369
+ &lt;/text&gt;
370
+
371
+ &lt;!-- テキスト内での待機 --&gt;
372
+ &lt;text&gt;
373
+ こんにちは。&lt;wait time="1000" /&gt;お元気ですか?
374
+ &lt;/text&gt;
375
+
376
+ &lt;!-- 複合的な使用例 --&gt;
377
+ &lt;text&gt;
378
+ &lt;color value="blue"&gt;&lt;b&gt;重要な&lt;/b&gt;&lt;/color&gt;お知らせがあります。&lt;br&gt;
379
+ &lt;wait time="500" /&gt;&lt;i&gt;しばらくお待ちください...&lt;/i&gt;
380
+ &lt;/text&gt;
381
+
382
+ &lt;!-- HTTPリクエストの使用例 --&gt;
383
+ &lt;text get="https://api.example.com/data"&gt;
384
+ &lt;progress&gt;データを読み込み中...&lt;/progress&gt;
385
+ &lt;header&gt;
386
+ &lt;content-type&gt;application/json&lt;/content-type&gt;
387
+ &lt;authorization&gt;Bearer token&lt;/authorization&gt;
388
+ &lt;/header&gt;
389
+ &lt;data&gt;
390
+ &lt;query&gt;example&lt;/query&gt;
391
+ &lt;/data&gt;
392
+ &lt;then&gt;データの読み込みが完了しました。&lt;/then&gt;
393
+ &lt;error&gt;データの読み込みに失敗しました。&lt;/error&gt;
394
+ &lt;/text&gt;
395
+
396
+ &lt;!-- ifグローバル属性の使用例 --&gt;
397
+ &lt;text if="playerLevel >= 10"&gt;レベル10以上のプレイヤーのみに表示されるメッセージです。&lt;/text&gt;
398
+
399
+ &lt;text if="hasItem('key')"&gt;鍵を持っている場合のメッセージです。&lt;/text&gt;
400
+
401
+ &lt;text if="gameMode === 'hard'"&gt;ハードモード専用のヒントです。&lt;/text&gt;</pre>
402
+ </div>
403
+ </div>
404
+
405
+ <div class="usage-notes">
406
+ <h4>使用上の注意</h4>
407
+ <ul>
408
+ <li>マークアップタグは適切に閉じてください(&lt;b&gt;...&lt;/b&gt;)</li>
409
+ <li>マークアップタグはネストすることができます</li>
410
+ <li>{{variable}}形式でJavaScript変数を展開できます</li>
411
+ <li>speedが小さいほど文字表示が速くなります</li>
412
+ <li>colorタグのvalue属性には色名(red, blue)やHEXコード(#ff0000)が使用できます</li>
413
+ <li>&lt;br&gt;タグは改行と同時にクリック待ちが発生します(&lt;wait /&gt;のエイリアス)</li>
414
+ <li>waitタグのnw属性を指定すると、待機をスキップできます</li>
415
+ <li>HTTPリクエスト機能を使用すると、API連携やAI統合が可能になります</li>
416
+ <li>HTTPレスポンスの結果は、sceneFile.resに格納されます</li>
417
+ <li><strong>if属性:</strong>条件がtrueの場合のみテキストが表示されます(例: if="playerLevel >= 5")</li>
418
+ </ul>
419
+ </div>
420
+ </section>
421
+
422
+ <section id="say" class="tag-section">
423
+ <div class="tag-name">&lt;say&gt;</div>
424
+ <div class="tag-description">
425
+ キャラクターの台詞を表示します。キャラクター名と音声ファイルを指定できます。
426
+ </div>
427
+
428
+ <div class="attributes">
429
+ <h4>属性</h4>
430
+ <div class="attr-list">
431
+ <div class="attr-item">
432
+ <div class="attr-name">name</div>
433
+ <div class="attr-type">string (必須)</div>
434
+ <div>話者の名前</div>
435
+ </div>
436
+ <div class="attr-item">
437
+ <div class="attr-name">voice</div>
438
+ <div class="attr-type">string (省略可)</div>
439
+ <div>音声ファイルのパス</div>
440
+ </div>
441
+ <div class="attr-item">
442
+ <div class="attr-name">speed</div>
443
+ <div class="attr-type">number (省略可)</div>
444
+ <div>テキストの表示速度。デフォルト: 25</div>
445
+ </div>
446
+ </div>
447
+ </div>
448
+
449
+ <div class="examples">
450
+ <h4>使用例</h4>
451
+ <div class="code-block">
452
+ <pre>&lt;say name="主人公"&gt;こんにちは!&lt;/say&gt;
453
+
454
+ &lt;say name="ヒロイン" voice="./voice/heroine_01.wav"&gt;
455
+ お疲れ様でした。
456
+ &lt;/say&gt;
457
+
458
+ &lt;say name="{{characterName}}" speed="50"&gt;
459
+ 変数も使用できます。
460
+ &lt;/say&gt;
461
+
462
+ &lt;!-- ifグローバル属性の使用例 --&gt;
463
+ &lt;say name="店主" if="playerMoney >= 100"&gt;
464
+ いらっしゃいませ!何かお買い物ですか?
465
+ &lt;/say&gt;
466
+
467
+ &lt;say name="警備員" if="hasPermission === false"&gt;
468
+ ここから先は立ち入り禁止です。
469
+ &lt;/say&gt;</pre>
470
+ </div>
471
+ </div>
472
+
473
+ <div class="usage-notes">
474
+ <h4>使用上の注意</h4>
475
+ <ul>
476
+ <li>nameは必須属性です</li>
477
+ <li>voiceで指定した音声ファイルは台詞と同時に再生されます</li>
478
+ <li>textタグと同様にマークアップタグが使用できます</li>
479
+ <li><strong>if属性:</strong>条件がtrueの場合のみ台詞が表示されます(例: if="characterPresent")</li>
480
+ </ul>
481
+ </div>
482
+ </section>
483
+
484
+ <section id="choice" class="tag-section">
485
+ <div class="tag-name">&lt;choice&gt;</div>
486
+ <div class="tag-description">
487
+ プレイヤーが選択できる選択肢を表示します。ストーリーの分岐に使用されます。
488
+ </div>
489
+
490
+ <div class="attributes">
491
+ <h4>属性</h4>
492
+ <div class="attr-list">
493
+ <div class="attr-item">
494
+ <div class="attr-name">prompt</div>
495
+ <div class="attr-type">string (省略可)</div>
496
+ <div>選択肢の前に表示するプロンプトテキスト</div>
497
+ </div>
498
+ </div>
499
+ <h4>子要素: &lt;item&gt;</h4>
500
+ <div class="attr-list">
501
+ <div class="attr-item">
502
+ <div class="attr-name">label</div>
503
+ <div class="attr-type">string (必須)</div>
504
+ <div>選択肢に表示するテキスト</div>
505
+ </div>
506
+ <div class="attr-item">
507
+ <div class="attr-name">onSelect</div>
508
+ <div class="attr-type">string (省略可)</div>
509
+ <div>選択時のイベント識別子</div>
510
+ </div>
511
+ </div>
512
+ </div>
513
+
514
+ <div class="examples">
515
+ <h4>使用例</h4>
516
+ <div class="code-block">
517
+ <pre>&lt;choice prompt="どちらを選びますか?"&gt;
518
+ &lt;item label="はい" onSelect="yes"&gt;
519
+ &lt;say name="主人公"&gt;はいを選びました。&lt;/say&gt;
520
+ &lt;/item&gt;
521
+ &lt;item label="いいえ" onSelect="no"&gt;
522
+ &lt;say name="主人公"&gt;いいえを選びました。&lt;/say&gt;
523
+ &lt;/item&gt;
524
+ &lt;/choice&gt;
525
+
526
+ &lt;choice&gt;
527
+ &lt;item label="次のシーンへ"&gt;
528
+ &lt;route to="next_scene" /&gt;
529
+ &lt;/item&gt;
530
+ &lt;/choice&gt;
531
+
532
+ &lt;!-- ifグローバル属性の使用例 --&gt;
533
+ &lt;choice prompt="何をしますか?" if="canMakeChoice"&gt;
534
+ &lt;item label="戦う"&gt;
535
+ &lt;text&gt;戦闘を開始します。&lt;/text&gt;
536
+ &lt;/item&gt;
537
+ &lt;item label="逃げる"&gt;
538
+ &lt;text&gt;逃走します。&lt;/text&gt;
539
+ &lt;/item&gt;
540
+ &lt;/choice&gt;</pre>
541
+ </div>
542
+ </div>
543
+
544
+ <div class="usage-notes">
545
+ <h4>使用上の注意</h4>
546
+ <ul>
547
+ <li>各itemには任意のタグを含めることができます</li>
548
+ <li>選択後は自動的に選択肢が非表示になります</li>
549
+ <li>promptが空文字列の場合、プロンプトは表示されません</li>
550
+ <li><strong>if属性:</strong>条件がtrueの場合のみ選択肢が表示されます(例: if="allowChoices")</li>
551
+ </ul>
552
+ </div>
553
+ </section>
554
+
555
+ <section id="show" class="tag-section">
556
+ <div class="tag-name">&lt;show&gt;</div>
557
+ <div class="tag-description">
558
+ 画像(背景、キャラクター、エフェクトなど)を画面に表示します。
559
+ </div>
560
+
561
+ <div class="attributes">
562
+ <h4>属性</h4>
563
+ <div class="attr-list">
564
+ <div class="attr-item">
565
+ <div class="attr-name">src</div>
566
+ <div class="attr-type">string (必須)</div>
567
+ <div>画像ファイルのパス</div>
568
+ </div>
569
+ <div class="attr-item">
570
+ <div class="attr-name">name</div>
571
+ <div class="attr-type">string (省略可)</div>
572
+ <div>画像の識別名</div>
573
+ </div>
574
+ <div class="attr-item">
575
+ <div class="attr-name">mode</div>
576
+ <div class="attr-type">string (省略可)</div>
577
+ <div>表示モード: bg, chara, cutin, cg, effect</div>
578
+ </div>
579
+ <div class="attr-item">
580
+ <div class="attr-name">pos</div>
581
+ <div class="attr-type">string (省略可)</div>
582
+ <div>位置指定: left/center/right:top/middle/bottom</div>
583
+ </div>
584
+ <div class="attr-item">
585
+ <div class="attr-name">x, y</div>
586
+ <div class="attr-type">number (省略可)</div>
587
+ <div>詳細な座標指定(ピクセル)</div>
588
+ </div>
589
+ <div class="attr-item">
590
+ <div class="attr-name">width, height</div>
591
+ <div class="attr-type">number (省略可)</div>
592
+ <div>画像のサイズ(ピクセル)</div>
593
+ </div>
594
+ <div class="attr-item">
595
+ <div class="attr-name">transition</div>
596
+ <div class="attr-type">string (省略可)</div>
597
+ <div>表示エフェクト: fade</div>
598
+ </div>
599
+ <div class="attr-item">
600
+ <div class="attr-name">duration</div>
601
+ <div class="attr-type">number (省略可)</div>
602
+ <div>エフェクトの時間(ミリ秒)</div>
603
+ </div>
604
+ <div class="attr-item">
605
+ <div class="attr-name">opacity</div>
606
+ <div class="attr-type">number (省略可)</div>
607
+ <div>透明度(0.0-1.0)</div>
608
+ </div>
609
+ <div class="attr-item">
610
+ <div class="attr-name">sepia</div>
611
+ <div class="attr-type">number (省略可)</div>
612
+ <div>セピア効果の強度</div>
613
+ </div>
614
+ <div class="attr-item">
615
+ <div class="attr-name">mono</div>
616
+ <div class="attr-type">boolean (省略可)</div>
617
+ <div>モノクロ効果</div>
618
+ </div>
619
+ <div class="attr-item">
620
+ <div class="attr-name">blur</div>
621
+ <div class="attr-type">number (省略可)</div>
622
+ <div>ぼかし効果の強度</div>
623
+ </div>
624
+ <div class="attr-item">
625
+ <div class="attr-name">look</div>
626
+ <div class="attr-type">boolean (省略可)</div>
627
+ <div>画像を左右反転して表示</div>
628
+ </div>
629
+ <div class="attr-item">
630
+ <div class="attr-name">entry</div>
631
+ <div class="attr-type">object (省略可)</div>
632
+ <div>表示開始の遅延設定 {time: 秒数, wait: boolean}</div>
633
+ </div>
634
+ </div>
635
+ </div>
636
+
637
+ <div class="examples">
638
+ <h4>使用例</h4>
639
+ <div class="code-block">
640
+ <pre>&lt;!-- 背景画像の表示 --&gt;
641
+ &lt;show src="./resource/background/forest.jpg" mode="bg" /&gt;
642
+
643
+ &lt;!-- キャラクターの表示 --&gt;
644
+ &lt;show src="./resource/chara/hero.png" name="主人公" pos="left:middle" /&gt;
645
+
646
+ &lt;!-- フェードイン効果付きで表示 --&gt;
647
+ &lt;show src="./resource/chara/heroine.png" name="ヒロイン" pos="right:middle"
648
+ transition="fade" duration="2000" /&gt;
649
+
650
+ &lt;!-- エフェクト適用 --&gt;
651
+ &lt;show src="./resource/effect/sparkle.png" name="キラキラ"
652
+ opacity="0.7" sepia="0.3" /&gt;
653
+
654
+ &lt;!-- 座標指定 --&gt;
655
+ &lt;show src="./resource/item/sword.png" name="剣" x="100" y="200" /&gt;
656
+
657
+ &lt;!-- 左右反転表示 --&gt;
658
+ &lt;show src="./resource/chara/hero.png" name="主人公" pos="left:middle" look="true" /&gt;
659
+
660
+ &lt;!-- 遅延表示 --&gt;
661
+ &lt;show src="./resource/chara/surprise.png" name="驚き" pos="center:middle"
662
+ entry="{time: 2, wait: true}" /&gt;
663
+
664
+ &lt;!-- ifグローバル属性の使用例 --&gt;
665
+ &lt;show src="./resource/chara/angry.png" name="主人公" pos="left:middle"
666
+ if="playerEmotion === 'angry'" /&gt;
667
+
668
+ &lt;show src="./resource/item/treasure.png" name="宝箱" pos="center:middle"
669
+ if="foundTreasure" /&gt;</pre>
670
+ </div>
671
+ </div>
672
+
673
+ <div class="usage-notes">
674
+ <h4>使用上の注意</h4>
675
+ <ul>
676
+ <li>mode="cutin"の場合、pos="center:middle"が強制されます</li>
677
+ <li>mode="cg"の場合、画面全体に表示され他の画像は一時的に隠されます</li>
678
+ <li>nameを指定することで、後からhideやmovetoで操作できます</li>
679
+ <li>posとx,yの両方を指定した場合、x,yが優先されます</li>
680
+ <li>lookをtrueにすると画像が左右反転されます(キャラの向きを変える時に便利)</li>
681
+ <li>entryで表示開始を遅延できます(演出効果に有効)</li>
682
+ <li><strong>if属性:</strong>条件がtrueの場合のみ画像が表示されます(例: if="showCharacter")</li>
683
+ </ul>
684
+ </div>
685
+ </section>
686
+
687
+ <section id="hide" class="tag-section">
688
+ <div class="tag-name">&lt;hide&gt;</div>
689
+ <div class="tag-description">
690
+ showで表示した画像を非表示にします。
691
+ </div>
692
+
693
+ <div class="attributes">
694
+ <h4>属性</h4>
695
+ <div class="attr-list">
696
+ <div class="attr-item">
697
+ <div class="attr-name">name</div>
698
+ <div class="attr-type">string (必須)</div>
699
+ <div>非表示にする画像の識別名</div>
700
+ </div>
701
+ <div class="attr-item">
702
+ <div class="attr-name">mode</div>
703
+ <div class="attr-type">string (省略可)</div>
704
+ <div>非表示モード: cg(CGモードの終了)</div>
705
+ </div>
706
+ <div class="attr-item">
707
+ <div class="attr-name">transition</div>
708
+ <div class="attr-type">string (省略可)</div>
709
+ <div>非表示エフェクト: fade</div>
710
+ </div>
711
+ <div class="attr-item">
712
+ <div class="attr-name">duration</div>
713
+ <div class="attr-type">number (省略可)</div>
714
+ <div>エフェクトの時間(ミリ秒)</div>
715
+ </div>
716
+ </div>
717
+ </div>
718
+
719
+ <div class="examples">
720
+ <h4>使用例</h4>
721
+ <div class="code-block">
722
+ <pre>&lt;!-- 即座に非表示 --&gt;
723
+ &lt;hide name="主人公" /&gt;
724
+
725
+ &lt;!-- フェードアウト効果 --&gt;
726
+ &lt;hide name="ヒロイン" transition="fade" duration="1500" /&gt;
727
+
728
+ &lt;!-- CGモードの終了 --&gt;
729
+ &lt;hide mode="cg" /&gt;</pre>
730
+ </div>
731
+ </div>
732
+
733
+ <div class="usage-notes">
734
+ <h4>使用上の注意</h4>
735
+ <ul>
736
+ <li>nameで指定する識別名は、showで指定したものと一致する必要があります</li>
737
+ <li>mode="cg"の場合、nameは不要で、CGモードが終了され元の画像が復元されます</li>
738
+ </ul>
739
+ </div>
740
+ </section>
741
+
742
+ <section id="sound" class="tag-section">
743
+ <div class="tag-name">&lt;sound&gt;</div>
744
+ <div class="tag-description">
745
+ BGMや効果音の再生・停止・一時停止を制御します。
746
+ </div>
747
+
748
+ <div class="attributes">
749
+ <h4>属性</h4>
750
+ <div class="attr-list">
751
+ <div class="attr-item">
752
+ <div class="attr-name">src</div>
753
+ <div class="attr-type">string (省略可)</div>
754
+ <div>音声ファイルのパス</div>
755
+ </div>
756
+ <div class="attr-item">
757
+ <div class="attr-name">name</div>
758
+ <div class="attr-type">string (省略可)</div>
759
+ <div>音声の識別名</div>
760
+ </div>
761
+ <div class="attr-item">
762
+ <div class="attr-name">mode</div>
763
+ <div class="attr-type">string (省略可)</div>
764
+ <div>音声モード: bgm, se</div>
765
+ </div>
766
+ <div class="attr-item">
767
+ <div class="attr-name">play</div>
768
+ <div class="attr-type">boolean (省略可)</div>
769
+ <div>再生開始</div>
770
+ </div>
771
+ <div class="attr-item">
772
+ <div class="attr-name">stop</div>
773
+ <div class="attr-type">boolean (省略可)</div>
774
+ <div>再生停止</div>
775
+ </div>
776
+ <div class="attr-item">
777
+ <div class="attr-name">pause</div>
778
+ <div class="attr-type">boolean (省略可)</div>
779
+ <div>再生一時停止</div>
780
+ </div>
781
+ <div class="attr-item">
782
+ <div class="attr-name">loop</div>
783
+ <div class="attr-type">boolean (省略可)</div>
784
+ <div>ループ再生</div>
785
+ </div>
786
+ </div>
787
+ </div>
788
+
789
+ <div class="examples">
790
+ <h4>使用例</h4>
791
+ <div class="code-block">
792
+ <pre>&lt;!-- BGMの再生 --&gt;
793
+ &lt;sound src="./resource/bgm/peaceful.mp3" mode="bgm" play loop /&gt;
794
+
795
+ &lt;!-- 効果音の再生 --&gt;
796
+ &lt;sound src="./resource/se/door.wav" play /&gt;
797
+
798
+ &lt;!-- BGMの停止 --&gt;
799
+ &lt;sound mode="bgm" stop /&gt;
800
+
801
+ &lt;!-- 特定の音声の一時停止 --&gt;
802
+ &lt;sound name="環境音" pause /&gt;</pre>
803
+ </div>
804
+ </div>
805
+
806
+ <div class="usage-notes">
807
+ <h4>使用上の注意</h4>
808
+ <ul>
809
+ <li>mode="bgm"の場合、以前のBGMは自動的に停止されます</li>
810
+ <li>loopを指定すると、音声が無限にループ再生されます</li>
811
+ <li>play, stop, pauseは排他的に使用してください</li>
812
+ </ul>
813
+ </div>
814
+ </section>
815
+
816
+ <section id="jump" class="tag-section">
817
+ <div class="tag-name">&lt;jump&gt;</div>
818
+ <div class="tag-description">
819
+ シナリオ内の指定した行番号にジャンプします。
820
+ </div>
821
+
822
+ <div class="attributes">
823
+ <h4>属性</h4>
824
+ <div class="attr-list">
825
+ <div class="attr-item">
826
+ <div class="attr-name">index</div>
827
+ <div class="attr-type">number (必須)</div>
828
+ <div>ジャンプ先の行番号(0から開始)</div>
829
+ </div>
830
+ </div>
831
+ </div>
832
+
833
+ <div class="examples">
834
+ <h4>使用例</h4>
835
+ <div class="code-block">
836
+ <pre>&lt;!-- 10行目にジャンプ --&gt;
837
+ &lt;jump index="10" /&gt;
838
+
839
+ &lt;!-- 選択肢での使用例 --&gt;
840
+ &lt;choice prompt="もう一度見ますか?"&gt;
841
+ &lt;item label="はい"&gt;
842
+ &lt;jump index="5" /&gt;
843
+ &lt;/item&gt;
844
+ &lt;item label="いいえ"&gt;
845
+ &lt;text&gt;終了します。&lt;/text&gt;
846
+ &lt;/item&gt;
847
+ &lt;/choice&gt;</pre>
848
+ </div>
849
+ </div>
850
+
851
+ <div class="usage-notes">
852
+ <h4>使用上の注意</h4>
853
+ <ul>
854
+ <li>行番号は0から開始します</li>
855
+ <li>存在しない行番号を指定するとエラーになります</li>
856
+ <li>後方にジャンプした場合、間の行は再実行されません</li>
857
+ </ul>
858
+ </div>
859
+ </section>
860
+
861
+ <section id="route" class="tag-section">
862
+ <div class="tag-name">&lt;route&gt;</div>
863
+ <div class="tag-description">
864
+ 別のシーンファイルに遷移します。
865
+ </div>
866
+
867
+ <div class="attributes">
868
+ <h4>属性</h4>
869
+ <div class="attr-list">
870
+ <div class="attr-item">
871
+ <div class="attr-name">to</div>
872
+ <div class="attr-type">string (必須)</div>
873
+ <div>遷移先のシーンファイル名</div>
874
+ </div>
875
+ </div>
876
+ </div>
877
+
878
+ <div class="examples">
879
+ <h4>使用例</h4>
880
+ <div class="code-block">
881
+ <pre>&lt;!-- タイトルシーンに遷移 --&gt;
882
+ &lt;route to="title" /&gt;
883
+
884
+ &lt;!-- 次のシーンに遷移 --&gt;
885
+ &lt;route to="chapter2" /&gt;
886
+
887
+ &lt;!-- 選択肢での使用例 --&gt;
888
+ &lt;choice&gt;
889
+ &lt;item label="タイトルに戻る"&gt;
890
+ &lt;route to="title" /&gt;
891
+ &lt;/item&gt;
892
+ &lt;/choice&gt;</pre>
893
+ </div>
894
+ </div>
895
+
896
+ <div class="usage-notes">
897
+ <h4>使用上の注意</h4>
898
+ <ul>
899
+ <li>遷移前に現在のシーンのcleanUp関数が呼ばれます</li>
900
+ <li>BGMは自動的に停止され、新しいシーンのBGMが再生されます</li>
901
+ <li>画面は新しいシーンの設定でリセットされます</li>
902
+ </ul>
903
+ </div>
904
+ </section>
905
+
906
+ <section id="if" class="tag-section">
907
+ <div class="tag-name">&lt;if&gt;</div>
908
+ <div class="tag-description">
909
+ 条件に基づいてシナリオを分岐します。JavaScript式を条件として使用できます。
910
+ </div>
911
+
912
+ <div class="attributes">
913
+ <h4>属性</h4>
914
+ <div class="attr-list">
915
+ <div class="attr-item">
916
+ <div class="attr-name">condition</div>
917
+ <div class="attr-type">string (必須)</div>
918
+ <div>評価するJavaScript式</div>
919
+ </div>
920
+ </div>
921
+ <h4>子要素</h4>
922
+ <div class="attr-list">
923
+ <div class="attr-item">
924
+ <div class="attr-name">&lt;then&gt;</div>
925
+ <div class="attr-type">element</div>
926
+ <div>条件がtrueの場合に実行される内容</div>
927
+ </div>
928
+ <div class="attr-item">
929
+ <div class="attr-name">&lt;else&gt;</div>
930
+ <div class="attr-type">element (省略可)</div>
931
+ <div>条件がfalseの場合に実行される内容</div>
932
+ </div>
933
+ </div>
934
+ </div>
935
+
936
+ <div class="examples">
937
+ <h4>使用例</h4>
938
+ <div class="code-block">
939
+ <pre>&lt;if condition="playerScore >= 80"&gt;
940
+ &lt;then&gt;
941
+ &lt;say name="先生"&gt;素晴らしい成績ですね!&lt;/say&gt;
942
+ &lt;/then&gt;
943
+ &lt;else&gt;
944
+ &lt;say name="先生"&gt;もう少し頑張りましょう。&lt;/say&gt;
945
+ &lt;/else&gt;
946
+ &lt;/if&gt;
947
+
948
+ &lt;if condition="hasKey === true"&gt;
949
+ &lt;then&gt;
950
+ &lt;text&gt;扉を開けることができます。&lt;/text&gt;
951
+ &lt;route to="inside_room" /&gt;
952
+ &lt;/then&gt;
953
+ &lt;else&gt;
954
+ &lt;text&gt;鍵が必要です。&lt;/text&gt;
955
+ &lt;/else&gt;
956
+ &lt;/if&gt;</pre>
957
+ </div>
958
+ </div>
959
+
960
+ <div class="usage-notes">
961
+ <h4>使用上の注意</h4>
962
+ <ul>
963
+ <li>conditionには任意のJavaScript式を記述できます</li>
964
+ <li>シーンのscript部分で定義した変数や関数を参照できます</li>
965
+ <li>elseは省略可能です</li>
966
+ <li>ifは入れ子にすることができます</li>
967
+ </ul>
968
+ </div>
969
+ </section>
970
+
971
+ <section id="call" class="tag-section">
972
+ <div class="tag-name">&lt;call&gt;</div>
973
+ <div class="tag-description">
974
+ JavaScript関数を実行します。ゲームの状態変更や複雑な処理に使用されます。
975
+ </div>
976
+
977
+ <div class="attributes">
978
+ <h4>属性</h4>
979
+ <div class="attr-list">
980
+ <div class="attr-item">
981
+ <div class="attr-name">method</div>
982
+ <div class="attr-type">string (省略可)</div>
983
+ <div>実行するJavaScriptコード</div>
984
+ </div>
985
+ <div class="attr-item">
986
+ <div class="attr-name">func</div>
987
+ <div class="attr-type">string (省略可)</div>
988
+ <div>実行する関数呼び出し(methodの別名)</div>
989
+ </div>
990
+ </div>
991
+ </div>
992
+
993
+ <div class="examples">
994
+ <h4>使用例</h4>
995
+ <div class="code-block">
996
+ <pre>&lt;!-- 変数の設定 --&gt;
997
+ &lt;call method="playerScore = 100" /&gt;
998
+
999
+ &lt;!-- 関数の呼び出し --&gt;
1000
+ &lt;call func="saveGame()" /&gt;
1001
+
1002
+ &lt;!-- 複雑な処理 --&gt;
1003
+ &lt;call method="
1004
+ if (inventory.includes('key')) {
1005
+ hasKey = true;
1006
+ removeItem('key');
1007
+ }
1008
+ " /&gt;</pre>
1009
+ </div>
1010
+ </div>
1011
+
1012
+ <div class="usage-notes">
1013
+ <h4>使用上の注意</h4>
1014
+ <ul>
1015
+ <li>methodとfuncは同じ機能です(互換性のため両方サポート)</li>
1016
+ <li>シーンのscript部分で定義した変数や関数にアクセスできます</li>
1017
+ <li>エラーが発生した場合はコンソールに出力されます</li>
1018
+ </ul>
1019
+ </div>
1020
+ </section>
1021
+
1022
+ <section id="moveto" class="tag-section">
1023
+ <div class="tag-name">&lt;moveto&gt;</div>
1024
+ <div class="tag-description">
1025
+ 表示中の画像を指定した位置に移動します。アニメーション効果付きです。
1026
+ </div>
1027
+
1028
+ <div class="attributes">
1029
+ <h4>属性</h4>
1030
+ <div class="attr-list">
1031
+ <div class="attr-item">
1032
+ <div class="attr-name">name</div>
1033
+ <div class="attr-type">string (必須)</div>
1034
+ <div>移動させる画像の識別名</div>
1035
+ </div>
1036
+ <div class="attr-item">
1037
+ <div class="attr-name">x</div>
1038
+ <div class="attr-type">number (必須)</div>
1039
+ <div>移動先のX座標</div>
1040
+ </div>
1041
+ <div class="attr-item">
1042
+ <div class="attr-name">y</div>
1043
+ <div class="attr-type">number (必須)</div>
1044
+ <div>移動先のY座標</div>
1045
+ </div>
1046
+ <div class="attr-item">
1047
+ <div class="attr-name">duration</div>
1048
+ <div class="attr-type">number (省略可)</div>
1049
+ <div>移動にかかる時間(秒)。デフォルト: 1</div>
1050
+ </div>
1051
+ </div>
1052
+ </div>
1053
+
1054
+ <div class="examples">
1055
+ <h4>使用例</h4>
1056
+ <div class="code-block">
1057
+ <pre>&lt;!-- 画像を表示 --&gt;
1058
+ &lt;show src="./resource/chara/hero.png" name="主人公" pos="left:middle" /&gt;
1059
+
1060
+ &lt;!-- 中央に移動(2秒かけて) --&gt;
1061
+ &lt;moveto name="主人公" x="400" y="300" duration="2" /&gt;
1062
+
1063
+ &lt;!-- 素早く移動 --&gt;
1064
+ &lt;moveto name="主人公" x="100" y="100" duration="0.5" /&gt;</pre>
1065
+ </div>
1066
+ </div>
1067
+
1068
+ <div class="usage-notes">
1069
+ <h4>使用上の注意</h4>
1070
+ <ul>
1071
+ <li>移動対象の画像は事前にshowで表示されている必要があります</li>
1072
+ <li>移動中は他のコマンドも並行して実行されます</li>
1073
+ <li>存在しないnameを指定してもエラーにはなりません</li>
1074
+ </ul>
1075
+ </div>
1076
+ </section>
1077
+
1078
+ <section id="wait" class="tag-section">
1079
+ <div class="tag-name">&lt;wait&gt;</div>
1080
+ <div class="tag-description">
1081
+ 指定した時間だけ待機します。またはクリック待ちを行います。
1082
+ </div>
1083
+
1084
+ <div class="attributes">
1085
+ <h4>属性</h4>
1086
+ <div class="attr-list">
1087
+ <div class="attr-item">
1088
+ <div class="attr-name">time</div>
1089
+ <div class="attr-type">number (省略可)</div>
1090
+ <div>待機時間(ミリ秒)</div>
1091
+ </div>
1092
+ <div class="attr-item">
1093
+ <div class="attr-name">wait</div>
1094
+ <div class="attr-type">number (省略可)</div>
1095
+ <div>待機時間(timeの別名)</div>
1096
+ </div>
1097
+ </div>
1098
+ </div>
1099
+
1100
+ <div class="examples">
1101
+ <h4>使用例</h4>
1102
+ <div class="code-block">
1103
+ <pre>&lt;!-- 2秒待機 --&gt;
1104
+ &lt;wait time="2000" /&gt;
1105
+
1106
+ &lt;!-- クリック待ち --&gt;
1107
+ &lt;wait /&gt;
1108
+
1109
+ &lt;!-- テキスト内での使用 --&gt;
1110
+ &lt;text&gt;
1111
+ こんにちは。&lt;wait time="1000" /&gt;お元気ですか?
1112
+ &lt;/text&gt;</pre>
1113
+ </div>
1114
+ </div>
1115
+
1116
+ <div class="usage-notes">
1117
+ <h4>使用上の注意</h4>
1118
+ <ul>
1119
+ <li>timeまたはwaitを省略した場合、クリック待ちになります</li>
1120
+ <li>timeとwaitは同じ機能です</li>
1121
+ <li>テキスト内のwaitタグはnw属性で無待機にできます</li>
1122
+ </ul>
1123
+ </div>
1124
+ </section>
1125
+
1126
+ <section id="dialog" class="tag-section">
1127
+ <div class="tag-name">&lt;dialog&gt;</div>
1128
+ <div class="tag-description">
1129
+ モーダルダイアログを表示します。ユーザーとのインタラクションやメニュー、確認画面の表示に使用されます。
1130
+ </div>
1131
+
1132
+ <div class="attributes">
1133
+ <h4>属性</h4>
1134
+ <div class="attr-list">
1135
+ <div class="attr-item">
1136
+ <div class="attr-name">id</div>
1137
+ <div class="attr-type">string (省略可)</div>
1138
+ <div>ダイアログの識別ID</div>
1139
+ </div>
1140
+ <div class="attr-item">
1141
+ <div class="attr-name">template</div>
1142
+ <div class="attr-type">string (省略可)</div>
1143
+ <div>カスタムテンプレートファイルのパス</div>
1144
+ </div>
1145
+ </div>
1146
+ <h4>子要素</h4>
1147
+ <div class="attr-list">
1148
+ <div class="attr-item">
1149
+ <div class="attr-name">&lt;prompt&gt;</div>
1150
+ <div class="attr-type">element (必須)</div>
1151
+ <div>ダイアログに表示するメッセージ(文字列またはテキスト要素)</div>
1152
+ </div>
1153
+ <div class="attr-item">
1154
+ <div class="attr-name">&lt;actions&gt;</div>
1155
+ <div class="attr-type">element (必須)</div>
1156
+ <div>ダイアログのアクション群(action要素を含む)</div>
1157
+ </div>
1158
+ </div>
1159
+ <h4>&lt;action&gt;要素の属性</h4>
1160
+ <div class="attr-list">
1161
+ <div class="attr-item">
1162
+ <div class="attr-name">id</div>
1163
+ <div class="attr-type">string (必須)</div>
1164
+ <div>アクションの識別ID</div>
1165
+ </div>
1166
+ <div class="attr-item">
1167
+ <div class="attr-name">label</div>
1168
+ <div class="attr-type">string (必須)</div>
1169
+ <div>ボタンに表示するラベル</div>
1170
+ </div>
1171
+ <div class="attr-item">
1172
+ <div class="attr-name">value</div>
1173
+ <div class="attr-type">string (省略可)</div>
1174
+ <div>アクションの値</div>
1175
+ </div>
1176
+ </div>
1177
+ </div>
1178
+
1179
+ <div class="examples">
1180
+ <h4>使用例</h4>
1181
+ <div class="code-block">
1182
+ <pre>&lt;!-- 基本的なダイアログ --&gt;
1183
+ &lt;dialog id="confirm"&gt;
1184
+ &lt;prompt&gt;本当に削除しますか?&lt;/prompt&gt;
1185
+ &lt;actions&gt;
1186
+ &lt;action id="yes" label="はい" value="delete"&gt;
1187
+ &lt;call method="deleteData()" /&gt;
1188
+ &lt;text&gt;削除しました。&lt;/text&gt;
1189
+ &lt;/action&gt;
1190
+ &lt;action id="no" label="いいえ" value="cancel"&gt;
1191
+ &lt;text&gt;キャンセルしました。&lt;/text&gt;
1192
+ &lt;/action&gt;
1193
+ &lt;/actions&gt;
1194
+ &lt;/dialog&gt;
1195
+
1196
+ &lt;!-- 選択肢ダイアログ --&gt;
1197
+ &lt;dialog id="choice"&gt;
1198
+ &lt;prompt&gt;どの色が好きですか?&lt;/prompt&gt;
1199
+ &lt;actions&gt;
1200
+ &lt;action id="red" label="赤" value="red"&gt;
1201
+ &lt;text&gt;赤は情熱的な色ですね。&lt;/text&gt;
1202
+ &lt;/action&gt;
1203
+ &lt;action id="blue" label="青" value="blue"&gt;
1204
+ &lt;text&gt;青は落ち着いた色です。&lt;/text&gt;
1205
+ &lt;/action&gt;
1206
+ &lt;action id="green" label="緑" value="green"&gt;
1207
+ &lt;text&gt;緑は自然を感じさせます。&lt;/text&gt;
1208
+ &lt;/action&gt;
1209
+ &lt;/actions&gt;
1210
+ &lt;/dialog&gt;
1211
+
1212
+ &lt;!-- カスタムテンプレート使用 --&gt;
1213
+ &lt;dialog id="custom" template="./src/screen/custom.html"&gt;
1214
+ &lt;prompt&gt;カスタムダイアログです&lt;/prompt&gt;
1215
+ &lt;actions&gt;
1216
+ &lt;action id="ok" label="OK"&gt;
1217
+ &lt;text&gt;カスタムダイアログを閉じます。&lt;/text&gt;
1218
+ &lt;/action&gt;
1219
+ &lt;/actions&gt;
1220
+ &lt;/dialog&gt;
1221
+
1222
+ &lt;!-- ネストしたダイアログ --&gt;
1223
+ &lt;dialog id="main"&gt;
1224
+ &lt;prompt&gt;メニューを選択してください&lt;/prompt&gt;
1225
+ &lt;actions&gt;
1226
+ &lt;action id="settings" label="設定"&gt;
1227
+ &lt;dialog id="settings"&gt;
1228
+ &lt;prompt&gt;設定項目を選択してください&lt;/prompt&gt;
1229
+ &lt;actions&gt;
1230
+ &lt;action id="sound" label="音量設定"&gt;
1231
+ &lt;text&gt;音量設定画面を開きます。&lt;/text&gt;
1232
+ &lt;/action&gt;
1233
+ &lt;action id="display" label="表示設定"&gt;
1234
+ &lt;text&gt;表示設定画面を開きます。&lt;/text&gt;
1235
+ &lt;/action&gt;
1236
+ &lt;/actions&gt;
1237
+ &lt;/dialog&gt;
1238
+ &lt;/action&gt;
1239
+ &lt;/actions&gt;
1240
+ &lt;/dialog&gt;</pre>
1241
+ </div>
1242
+ </div>
1243
+
1244
+ <div class="usage-notes">
1245
+ <h4>使用上の注意</h4>
1246
+ <ul>
1247
+ <li>ダイアログは画面の中央にモーダル表示されます</li>
1248
+ <li>actionsの各actionには必ずidとlabelを指定してください</li>
1249
+ <li>ダイアログが表示されている間、背景の操作はできません</li>
1250
+ <li>promptには文字列またはtext要素を指定できます</li>
1251
+ <li>templateを指定すると、カスタムデザインのダイアログが使用できます</li>
1252
+ <li>ダイアログ内でさらにダイアログを開くことができます(ネスト可能)</li>
1253
+ <li>アクション選択後は自動的にダイアログが閉じられます</li>
1254
+ <li>選択されたアクションのIDは戻り値として取得できます</li>
1255
+ </ul>
1256
+ </div>
1257
+ </section>
1258
+
1259
+ <section id="newpage" class="tag-section">
1260
+ <div class="tag-name">&lt;newpage&gt;</div>
1261
+ <div class="tag-description">
1262
+ 画面をクリアして新しいページを開始します。背景画像のみが残ります。
1263
+ </div>
1264
+
1265
+ <div class="examples">
1266
+ <h4>使用例</h4>
1267
+ <div class="code-block">
1268
+ <pre>&lt;!-- ページをクリア --&gt;
1269
+ &lt;newpage /&gt;
1270
+
1271
+ &lt;!-- 新しい場面の開始 --&gt;
1272
+ &lt;text&gt;場面が変わりました。&lt;/text&gt;</pre>
1273
+ </div>
1274
+ </div>
1275
+
1276
+ <div class="usage-notes">
1277
+ <h4>使用上の注意</h4>
1278
+ <ul>
1279
+ <li>すべてのキャラクターと効果が削除されます</li>
1280
+ <li>背景画像とテキスト表示領域はクリアされます</li>
1281
+ <li>新しい場面を開始する際に使用します</li>
1282
+ </ul>
1283
+ </div>
1284
+ </section>
1285
+
1286
+ </main>
1287
+ </div>
1288
+ </div>
1289
+
1290
+ <a href="#top" class="back-to-top">↑ TOPへ</a>
1291
+
1292
+ <script>
1293
+ // スムーススクロール
1294
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
1295
+ anchor.addEventListener('click', function (e) {
1296
+ e.preventDefault();
1297
+ const target = document.querySelector(this.getAttribute('href'));
1298
+ if (target) {
1299
+ target.scrollIntoView({
1300
+ behavior: 'smooth'
1301
+ });
1302
+ }
1303
+ });
1304
+ });
1305
+
1306
+ // 戻るボタンの表示制御
1307
+ window.addEventListener('scroll', function() {
1308
+ const backToTop = document.querySelector('.back-to-top');
1309
+ if (window.pageYOffset > 300) {
1310
+ backToTop.style.display = 'block';
1311
+ } else {
1312
+ backToTop.style.display = 'none';
1313
+ }
1314
+ });
1315
+ </script>
1316
+ </body>
1317
+ </html>