message.html 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. html {
  6. overflow: hidden;
  7. resize: none;
  8. }
  9. body {
  10. font-size: 16px;
  11. margin: 0;
  12. padding: 0;
  13. background-color: rgba(255, 255, 255, 0.8);
  14. }
  15. #message {
  16. padding: 10px 16px;
  17. background: #fff;
  18. border-radius: 2px;
  19. box-shadow: 0 3px 6px -4px rgb(0 0 0 / 12%),
  20. 0 6px 16px 0 rgb(0 0 0 / 8%), 0 9px 28px 8px rgb(0 0 0 / 5%);
  21. pointer-events: all;
  22. text-align: center;
  23. color: rgba(0, 0, 0, 0.85);
  24. font-size: 14px;
  25. font-variant: tabular-nums;
  26. line-height: 1.5715;
  27. list-style: none;
  28. font-feature-settings: 'tnum';
  29. font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
  30. 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji',
  31. 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  32. -webkit-text-size-adjust: 100%;
  33. word-break: break-all;
  34. }
  35. #message .anticon {
  36. position: relative;
  37. top: 1px;
  38. margin-right: 8px;
  39. font-size: 16px;
  40. }
  41. .message-success .anticon {
  42. color: #52c41a;
  43. }
  44. .message-warning .anticon {
  45. color: #faad14;
  46. }
  47. .message-error .anticon {
  48. color: #ff4d4f;
  49. }
  50. .anticon {
  51. display: inline-block;
  52. color: inherit;
  53. font-style: normal;
  54. line-height: 0;
  55. text-align: center;
  56. text-transform: none;
  57. vertical-align: -0.125em;
  58. text-rendering: optimizeLegibility;
  59. -webkit-font-smoothing: antialiased;
  60. -moz-osx-font-smoothing: grayscale;
  61. }
  62. </style>
  63. <meta charset="utf-8" />
  64. <script src="../js/path.js"></script>
  65. <script src="base.js"></script>
  66. <script type="text/javascript">
  67. function createIcon(type) {
  68. var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg')
  69. svg.setAttribute('viewBox', '64 64 896 896')
  70. svg.setAttribute('width', '1em')
  71. svg.setAttribute('height', '1em')
  72. svg.setAttribute('fill', 'currentColor')
  73. var path = document.createElementNS(
  74. 'http://www.w3.org/2000/svg',
  75. 'path'
  76. )
  77. switch (type) {
  78. case 'success':
  79. path.setAttribute(
  80. 'd',
  81. 'M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm193.5 301.7l-210.6 292a31.8 31.8 0 01-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.2 0 19.9 4.9 25.9 13.3l71.2 98.8 157.2-218c6-8.3 15.6-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.5 12.7z'
  82. )
  83. break
  84. case 'error':
  85. path.setAttribute(
  86. 'd',
  87. 'M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 01-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z'
  88. )
  89. break
  90. case 'warning':
  91. path.setAttribute(
  92. 'd',
  93. 'M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 010-96 48.01 48.01 0 010 96z'
  94. )
  95. break
  96. }
  97. svg.appendChild(path)
  98. return svg
  99. }
  100. function writemessage() {
  101. var params = getQueryParams()
  102. var container = document.getElementById('message')
  103. if (!!params.type && params.type !== 'default') {
  104. var span = document.createElement('span')
  105. span.className = 'anticon'
  106. span.appendChild(createIcon(params.type))
  107. container.className = container.className + ' message-' + params.type
  108. container.appendChild(span)
  109. }
  110. const msg = document.createElement('span')
  111. msg.innerText = params.message
  112. container.appendChild(msg)
  113. var duration = Number(params.duration)
  114. if (!!duration) {
  115. setTimeout(() => {
  116. window.close()
  117. }, duration * 1000)
  118. }
  119. }
  120. function init() {
  121. StopEscKeyKown()
  122. writemessage()
  123. }
  124. </script>
  125. </head>
  126. <body onload="init()">
  127. <div id="message"></div>
  128. </body>
  129. </html>