index.php 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512
  1. <?php
  2. /**
  3. * API Help view.
  4. *
  5. * Shows API documentation.
  6. *
  7. * @category View
  8. */
  9. ?>
  10. <?php
  11. include __DIR__ . "/api.php";
  12. ?>
  13. <!DOCTYPE html>
  14. <html lang='en'>
  15. <head>
  16. <meta content='text/html; charset=utf-8' http-equiv='content-type'/>
  17. <meta name='viewport' content='width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1'/>
  18. <title>SWDB APIv2</title>
  19. <link rel='shortcut icon' href='<?=URL::IMG["LOGO"]?>sw.png'/>
  20. <!-- CSS -->
  21. <link rel='stylesheet' type='text/css' href='<?=URL::CSS?>ui.css'/>
  22. <style>
  23. section#navbar{
  24. text-align: left;
  25. position: fixed;
  26. top: 0;
  27. left: 0;
  28. width: 15%;
  29. height: 100%;
  30. border-radius: 0;
  31. margin: 0 1em 0 0;
  32. padding: 0em 0.4em 0.1em 0.4em;
  33. border-left: 0;
  34. border-top: 0;
  35. border-bottom: 0;
  36. }
  37. section#navbar hr{
  38. height: 0em;
  39. padding: 0;
  40. margin: 0 1em;
  41. border: 0.01em solid #3105;
  42. border-radius: 1em;
  43. }
  44. section#navbar h1{
  45. text-align: center;
  46. margin-top: 0;
  47. }
  48. section#navbar h1 img{
  49. max-width: 100%;
  50. display: block;
  51. margin: auto auto -1em auto;
  52. }
  53. section#navbar h1 div{
  54. text-shadow: 0 0 0.5em #000000, 0 0 0.5em #000000, 0 0 0.2em #000000, 0 0 0.2em #000000;
  55. font-family: monospace, monospace;
  56. }
  57. section#navbar h1 div#swdb{
  58. font-weight: bold;
  59. font-size: 160%;
  60. margin-bottom: -0.2em;
  61. }
  62. section#navbar h1 div#api{
  63. font-style: italic;
  64. font-size: 110%;
  65. }
  66. section#navbar h3 {
  67. margin: 0.4em 0 0.2em 1em;
  68. border-left: 0.5em solid #3105;
  69. border-radius: 0.2em;
  70. padding-left: 0.3em;
  71. background-color: #00000000;
  72. transition: all .3s ease-in-out;
  73. }
  74. section#navbar h3:hover{
  75. background-color: #3105;
  76. }
  77. section#navbar h3 a{
  78. color: #cccccc
  79. }
  80. section#navbar h3:hover a{
  81. color: #ffffff
  82. }
  83. section#navbar ul {
  84. margin: 0.2em 0;
  85. list-style: none;
  86. }
  87. section#navbar ul li{
  88. border-left: 0.5em solid #3105;
  89. border-radius: 0.2em;
  90. padding-left: 0.3em;
  91. margin-bottom: 0.2em;
  92. background-color: #00000000;
  93. transition: all .3s ease-in-out;
  94. }
  95. section#navbar ul li:hover{
  96. background-color: #3105;
  97. }
  98. section#navbar ul li a{
  99. color: #cccccc
  100. }
  101. section#navbar ul li:hover a{
  102. color: #ffffff
  103. }
  104. section#navbar div#copyright{
  105. text-align: center;
  106. font-size: 70%;
  107. position: absolute;
  108. bottom: 1em;
  109. }
  110. section.category{
  111. margin: 2em 1em 1em 18%;
  112. }
  113. section.category h2{
  114. padding: 0.5em 3em;
  115. }
  116. section.category article{
  117. margin: 1.5em;
  118. padding-left: 1em;
  119. padding-right: 1em;
  120. text-align: left;
  121. }
  122. section.category article h3{
  123. vertical-align: bottom;
  124. }
  125. section.category article h3 span.description{
  126. font-style: italic;
  127. font-size: 90%;
  128. }
  129. section.category article:not(:last-child){
  130. padding-bottom: 1em;
  131. margin-bottom: 1em;
  132. border-bottom: 0.1em solid #ffffff66;
  133. }
  134. section.category article div.command span{
  135. display: inline-block;
  136. border-radius: 0.6em;
  137. padding: 0.3em 0.5em;
  138. border-width: 0.15em;
  139. border-style: solid;
  140. color: #ffffff;
  141. font-family: monospace, monospace;
  142. font-weight: bold;
  143. }
  144. section.category article div.command span.url{
  145. background-color: #292b36;
  146. border-color: #4b4d57;
  147. }
  148. section.category article div.command span.type{
  149. text-transform: uppercase;
  150. }
  151. section.category article div.command span.type_GET {
  152. background-color: #008000;
  153. border-color: #22a222;
  154. }
  155. section.category article div.command span.type_PUT {
  156. background-color: #e5c500;
  157. border-color: #f7e722;
  158. }
  159. section.category article div.command span.type_POST {
  160. background-color: #4070ec;
  161. border-color: #6292fe;
  162. }
  163. section.category article div.command span.type_DELETE {
  164. background-color: #ed0039;
  165. border-color: #ff225b;
  166. }
  167. section.category article table{
  168. border-collapse: collapse;
  169. width: 80%;
  170. border-radius: 0.5em;
  171. margin: 0.5em auto 1em auto;
  172. }
  173. section.category article table th {
  174. background-color: #331100;
  175. text-align: left;
  176. font-weight: bold;
  177. padding: 0.5em 1em;
  178. border: 0.1px solid #e0e0e0;
  179. }
  180. section.category article table td {
  181. background-color: #352413;
  182. vertical-align: top;
  183. padding: 0.2em 0.4em;
  184. border: #e0e0e0 1px solid;
  185. }
  186. section.category article table td.name {
  187. font-family: monospace, monospace;
  188. font-weight: bold;
  189. }
  190. section.category article table td.type {
  191. font-family: monospace, monospace;
  192. font-weight: bold;
  193. }
  194. section.category article table td.status {
  195. font-family: monospace, monospace;
  196. font-weight: bold;
  197. }
  198. section.category article table td.description span.optional {
  199. font-size: 90%;
  200. color: #bbbbbb;
  201. font-style: italic;
  202. }
  203. section#example{
  204. position: fixed;
  205. display: none;
  206. top: 15%;
  207. left: 20%;
  208. width: 60%;
  209. max-width: 90em;
  210. height: 70%;
  211. max-height: 30em;
  212. text-align: right;
  213. }
  214. section#example article{
  215. text-align: right;
  216. }
  217. section#example article pre#example_content{
  218. text-align: left;
  219. background-color: #292b36;
  220. border: 0.3em solid #4b4d57;
  221. border-radius: 0.8em;
  222. padding: 1em;
  223. max-height: 20em;
  224. overflow: scroll;
  225. }
  226. </style>
  227. <!-- Javascript -->
  228. <script>
  229. function showExample(command, status, example){
  230. document.getElementById('example_title').innerHTML = command + " HTTP status " + status + " response example";
  231. document.getElementById('example_content').innerHTML = JSON.stringify(JSON.parse(example), null, 4);
  232. document.getElementById('example').style.display = 'block';
  233. }
  234. function closeExample(command, status, example){
  235. document.getElementById('example').style.display = 'none';
  236. }
  237. </script>
  238. <!-- Meta tags -->
  239. <link rel='canonical' href='<?=URL::BASE?>API/v2/help/'/>
  240. <link rel='author' href='SWDB'/>
  241. <link rel='publisher' href='SWDB'/>
  242. <meta name='description' content='SWDB API v2 Documentation'/>
  243. <meta property='og:title' content='SWDB APIv2'/>
  244. <meta property='og:url' content='<?=URL::BASE?>API/v2/help/'/>
  245. <meta property='og:description' content='SWDB API v2 Documentation'/>
  246. <meta property='og:image' content='<?=URL::IMG["LOGO"]?>sw.png'/>
  247. <meta property='og:site_name' content='SWDB'/>
  248. <meta property='og:type' content='website'/>
  249. <meta property='og:locale' content='en'/>
  250. <meta name='twitter:card' content='summary'/>
  251. <meta name='twitter:title' content='SWDB APIv2'/>
  252. <meta name='twitter:description' content='SWDB API v2 Documentation'/>
  253. <meta name='twitter:image' content='<?=URL::IMG["LOGO"]?>sw.png'/>
  254. <meta name='twitter:url' content='<?=URL::BASE?>API/v2/help/'/>
  255. <meta name='robots' content='index follow'/>
  256. </head>
  257. <body>
  258. <section id='navbar' class='content'>
  259. <h1>
  260. <div id='swdb'>
  261. <img alt=' ' src='<?=URL::IMG["LOGO"]?>sw.png'/>
  262. SWDB
  263. </div>
  264. <div id='api'>
  265. API v2
  266. </div>
  267. </h1>
  268. <hr/>
  269. <?php
  270. foreach ($API["category"] as $category){
  271. ?>
  272. <h3>
  273. <a href='#category_<?=$category["name"]?>'>
  274. <?=$category["name"]?>
  275. </a>
  276. </h3>
  277. <ul>
  278. <?php
  279. foreach ($category["command"] as $command){
  280. ?>
  281. <li>
  282. <a href='#command_<?=$command["name"]?>' alt='<?=$command["description"]?>'>
  283. <?=$command["name"]?>
  284. </a>
  285. </li>
  286. <?php
  287. }
  288. ?>
  289. </ul>
  290. <hr/>
  291. <?php
  292. }
  293. ?>
  294. <div id='copyright'>
  295. Version 2.1. Developed by <a href="https://inigovalentin.com">Iñigo Valentin</a>.
  296. <br/>
  297. <br/>
  298. Source code available on <a href="https://github.com">Github</a> under the GPLv3.
  299. <br/>
  300. <br/>
  301. Neither I nor this tool are affiliated with or endorsed by <a href="http://com2us.com/">Com2uS</a> in any way. The Summoners War logo and the monster images are property of their respective owners (Com2US, probably). Monsters images and info are parsed from <a href="https://swarfarm.com">https://swarfarm.com</a>.
  302. </div>
  303. </section>
  304. <?php
  305. foreach ($API["category"] as $category){
  306. ?>
  307. <section id='category_<?=$category["name"]?>' class='category content'>
  308. <h2>
  309. <?=$category["name"]?>
  310. </h2>
  311. <?php
  312. foreach ($category["command"] as $command){
  313. ?>
  314. <article id='command_<?=$command["name"]?>'>
  315. <h3>
  316. <?=$command["name"]?>
  317. <span class='description'>
  318. - <?=$command["description"]?>
  319. </span>
  320. </h3>
  321. <div class='command'>
  322. <span class='type type_<?=$command["type"]?>'>
  323. <?=$command["type"]?>
  324. </span>
  325. <span class='url'>
  326. <?=htmlspecialchars($command["url"])?>
  327. </span>
  328. </div>
  329. <table class='params'>
  330. <thead>
  331. <tr>
  332. <th class='header' colspan='3'>
  333. Parameters
  334. </th>
  335. </tr>
  336. <tr>
  337. <th class='name'>
  338. Parameter
  339. </th>
  340. <th class='type'>
  341. Type
  342. </th>
  343. <th class='description'>
  344. Description
  345. </th>
  346. </tr>
  347. </thead>
  348. <tbody>
  349. <?php
  350. foreach ($command["parameter"] as $param){
  351. ?>
  352. <tr>
  353. <td class='name'>
  354. <?=$param["key"]?>
  355. </td>
  356. <td class='type'>
  357. <?=$param["type"]?>
  358. </td>
  359. <td class='description'>
  360. <?=($param["optional"] ? "<span class='optional'>[Optional] </span>" : "")?>
  361. <?=$param["description"]?>
  362. </td>
  363. </tr>
  364. <?php
  365. }
  366. ?>
  367. </tbody>
  368. </table>
  369. <table class='success'>
  370. <thead>
  371. <tr>
  372. <th class='header' colspan='2'>
  373. Sucessfull Responses
  374. </th>
  375. </tr>
  376. <tr>
  377. <th class='status'>
  378. Status
  379. </th>
  380. <th class='description'>
  381. Description
  382. </th>
  383. </tr>
  384. </thead>
  385. <tbody>
  386. <?php
  387. foreach ($command["success"] as $status){
  388. ?>
  389. <tr>
  390. <td class='status'>
  391. HTTP/1.1 <?=$status["status"]?>
  392. </td>
  393. <td class='description'>
  394. <?=$status["description"]?>
  395. <?php
  396. if ($status["example"] != null){
  397. ?>
  398. <span class='fake_a' onclick="showExample('<?=$command["name"]?>', <?=$status["status"]?>, '<?=htmlspecialchars(json_decode($status["example"]), ENT_QUOTES)?>')">
  399. View example.
  400. </span>
  401. <?php
  402. }
  403. ?>
  404. </td>
  405. </tr>
  406. <?php
  407. }
  408. ?>
  409. </tbody>
  410. </table>
  411. <table class='error'>
  412. <thead>
  413. <tr>
  414. <th class='header' colspan='2'>
  415. Error Responses
  416. </th>
  417. </tr>
  418. <tr>
  419. <th class='status'>
  420. Status
  421. </th>
  422. <th class='description'>
  423. Description
  424. </th>
  425. </tr>
  426. </thead>
  427. <tbody>
  428. <?php
  429. foreach ($command["error"] as $status){
  430. ?>
  431. <tr>
  432. <td class='status'>
  433. HTTP/1.1 <?=$status["status"]?>
  434. </td>
  435. <td class='description'>
  436. <?=$status["description"]?>
  437. <?php
  438. if ($status["example"] != null){
  439. ?>
  440. <span class='fake_a' onclick="showExample('<?=$command["name"]?>', '<?=htmlspecialchars(json_decode($status["example"]), ENT_QUOTES)?>')">
  441. View example.
  442. </span>
  443. <?php
  444. }
  445. ?>
  446. </td>
  447. </tr>
  448. <?php
  449. }
  450. ?>
  451. </tbody>
  452. </table>
  453. </article>
  454. <?php
  455. }
  456. ?>
  457. </section>
  458. <section id='example' class='content'>
  459. <h2 id='example_title'>
  460. </h2>
  461. <article>
  462. <pre id='example_content'>
  463. </pre>
  464. <input type='button' value='Close' onClick='closeExample();'>
  465. </article>
  466. </section>
  467. <?php
  468. }
  469. ?>
  470. </body>
  471. </html>