clock.js 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157
  1. this.init = function () {
  2. let self = this;
  3. let arrows = {
  4. "second": {
  5. color: "red",
  6. radius: 0.01,
  7. height: 1,
  8. offset: 0,
  9. visible: true,
  10. visWidth: 0.5,
  11. textPos: "-0.25,0,0"
  12. },
  13. "minute": {
  14. color: "blue",
  15. radius: 0.02,
  16. height: 0.8,
  17. offset: 0.3,
  18. visible: true,
  19. visWidth: 0.3,
  20. textPos: "-0.15,0,0"
  21. },
  22. "hour": {
  23. color: "green",
  24. radius: 0.03,
  25. height: 0.6,
  26. offset: 0.5,
  27. visible: false,
  28. visWidth: 0.3,
  29. textPos: "-0.15,0,0"
  30. }
  31. }
  32. for (const [key, value] of Object.entries(arrows)) {
  33. let arrowNode = {
  34. "extends": "proxy/aframe/aentity.vwf",
  35. "properties": {
  36. displayName: key
  37. },
  38. "children": {
  39. "arrow": {
  40. "extends": "proxy/aframe/acylinder.vwf",
  41. "properties": {
  42. radius: value.radius,
  43. height: value.height,
  44. position: [0, value.height / 2, 0]
  45. },
  46. "children": {
  47. "material": {
  48. "extends": "proxy/aframe/aMaterialComponent.vwf",
  49. "type": "component",
  50. "properties": {
  51. "color": value.color
  52. }
  53. },
  54. "digit": {
  55. "extends": "proxy/aframe/aplane.vwf",
  56. "properties": {
  57. height: 0.3,
  58. width: value.visWidth,
  59. position: [0, value.height + value.offset, 0],
  60. visible: value.visible
  61. },
  62. children: {
  63. "material": {
  64. "extends": "proxy/aframe/aMaterialComponent.vwf",
  65. "type": "component",
  66. "properties": {
  67. "color": "white",
  68. "side": "double"
  69. }
  70. },
  71. "text": {
  72. "extends": "proxy/aframe/atext.vwf",
  73. "properties": {
  74. "color": "black",
  75. "value": "",
  76. "side": "double",
  77. position: value.textPos
  78. }
  79. }
  80. }
  81. }
  82. }
  83. }
  84. }
  85. }
  86. self.children.create(key, arrowNode)
  87. }
  88. let vis = {
  89. "extends": "proxy/aframe/acylinder.vwf",
  90. "properties": {
  91. radius: 1.2,
  92. height: 0.01,
  93. rotation: [90, 0, 0],
  94. position: [0, 0, -0.05]
  95. },
  96. "children": {
  97. "clock": {
  98. "extends": "proxy/aframe/a-asset-image-item.vwf",
  99. "properties": {
  100. "itemID": "clock",
  101. "itemSrc": "/defaults/assets/textures/clock.png"
  102. }
  103. },
  104. "material": {
  105. "extends": "proxy/aframe/aMaterialComponent.vwf",
  106. "type": "component",
  107. "properties": {
  108. "src": "#clock",
  109. "side": "double"
  110. //"color": "white"
  111. }
  112. }
  113. }
  114. }
  115. self.children.create("vis", vis)
  116. }
  117. this.run = function () {
  118. let seconds = this.time//Math.floor(this.time/2);
  119. let minutes = Math.floor(seconds / 60);
  120. let hours = Math.floor(minutes / 60);
  121. if (this.second && this.minute && this.hour) {
  122. this.second.rotation = [0, 0, -360 * (seconds / 60)];
  123. this.minute.rotation = [0, 0, -360 * (minutes / 60)];
  124. this.hour.rotation = [0, 0, -360 * (hours / 12)];
  125. this.second.arrow.digit.rotation = [0, 0, 360 * (seconds / 60)];
  126. this.minute.arrow.digit.rotation = [0, 0, 360 * (minutes / 60)];
  127. this.hour.arrow.digit.rotation = [0, 0, 360 * (hours / 60)];
  128. let sText = Number.parseFloat(seconds % 60 ).toFixed(1);
  129. let minText = minutes % 60;
  130. let hrText = hours % 12;
  131. this.second.arrow.digit.text.value = (sText == 0) ? "" : sText
  132. this.minute.arrow.digit.text.value = (minText == 0) ? "" : minText
  133. this.hour.arrow.digit.text.value = (hrText == 0) ? "" : hrText
  134. }
  135. this.future(0.1).run()
  136. }