entry.html 2.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <title>Document</title>
  7. <style>
  8. html,
  9. body {
  10. width: 100%;
  11. height: 100%;
  12. margin: 0;
  13. overflow: hidden;
  14. }
  15. .scene {
  16. width: 100%;
  17. height: 100%;
  18. }
  19. #toolbar {
  20. position: absolute;
  21. left: 50%;
  22. top: 0;
  23. z-index: 10000;
  24. }
  25. [xui_tags_view] .tag-body {
  26. position: absolute;
  27. left: 50%;
  28. bottom: 50px;
  29. width: 100px;
  30. height: 100px;
  31. background-color: bisque;
  32. transform: translateX(-50%) scale(0);
  33. transform-origin: bottom;
  34. transition: all 0.3s cubic-bezier(0.35, 0.32, 0.65, 0.63);
  35. pointer-events: none;
  36. }
  37. [xui_tags_view] .tag-body.show {
  38. transform: translateX(-50%) scale(1);
  39. }
  40. </style>
  41. </head>
  42. <body>
  43. <div id="scene" class="scene"></div>
  44. <div id="toolbar">
  45. <button id="save" onclick="save()">保存初始画面</button>
  46. <button id="publish" onclick="publish()">发布</button>
  47. </div>
  48. <script src="../../dist/sdk/kankan-sdk-deps.js"></script>
  49. <script src="../../dist/sdk/kankan-sdk.js"></script>
  50. <script>
  51. localStorage.setItem('token','eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiIxODgxOTI3MjIwOCIsInVzZXJOYW1lIjoiMTg4MTkyNzIyMDgiLCJpYXQiOjE2NjAwMzU5MTUsImp0aSI6IjJiNTc5Zjc1LWI3MTAtNDczOC04MjIyLTcwNzQ2NDVkMjU1ZiJ9.kplYeAbSbhnLD_iLkMuWY_4f8s2MgHr9fbUGpZeaDag')
  52. var kankan = new KanKan({
  53. dom: '#scene',
  54. num: 't-JKNqv1o'
  55. })
  56. kankan.render()
  57. function save() {
  58. kankan.Editor.saveEntry()
  59. .then(response => console.log(response))
  60. .catch(error => console.error(error))
  61. }
  62. function publish() {
  63. kankan.Editor.publish()
  64. .then(response => console.log(response))
  65. .catch(error => console.error(error))
  66. }
  67. </script>
  68. </body>
  69. </html>