maction.js 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  1. "use strict";
  2. var __extends = (this && this.__extends) || (function () {
  3. var extendStatics = function (d, b) {
  4. extendStatics = Object.setPrototypeOf ||
  5. ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
  6. function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
  7. return extendStatics(d, b);
  8. };
  9. return function (d, b) {
  10. if (typeof b !== "function" && b !== null)
  11. throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
  12. extendStatics(d, b);
  13. function __() { this.constructor = d; }
  14. d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
  15. };
  16. })();
  17. Object.defineProperty(exports, "__esModule", { value: true });
  18. exports.CHTMLmaction = void 0;
  19. var Wrapper_js_1 = require("../Wrapper.js");
  20. var maction_js_1 = require("../../common/Wrappers/maction.js");
  21. var maction_js_2 = require("../../common/Wrappers/maction.js");
  22. var maction_js_3 = require("../../../core/MmlTree/MmlNodes/maction.js");
  23. var CHTMLmaction = (function (_super) {
  24. __extends(CHTMLmaction, _super);
  25. function CHTMLmaction() {
  26. return _super !== null && _super.apply(this, arguments) || this;
  27. }
  28. CHTMLmaction.prototype.toCHTML = function (parent) {
  29. var chtml = this.standardCHTMLnode(parent);
  30. var child = this.selected;
  31. child.toCHTML(chtml);
  32. this.action(this, this.data);
  33. };
  34. CHTMLmaction.prototype.setEventHandler = function (type, handler) {
  35. this.chtml.addEventListener(type, handler);
  36. };
  37. CHTMLmaction.kind = maction_js_3.MmlMaction.prototype.kind;
  38. CHTMLmaction.styles = {
  39. 'mjx-maction': {
  40. position: 'relative'
  41. },
  42. 'mjx-maction > mjx-tool': {
  43. display: 'none',
  44. position: 'absolute',
  45. bottom: 0, right: 0,
  46. width: 0, height: 0,
  47. 'z-index': 500
  48. },
  49. 'mjx-tool > mjx-tip': {
  50. display: 'inline-block',
  51. padding: '.2em',
  52. border: '1px solid #888',
  53. 'font-size': '70%',
  54. 'background-color': '#F8F8F8',
  55. color: 'black',
  56. 'box-shadow': '2px 2px 5px #AAAAAA'
  57. },
  58. 'mjx-maction[toggle]': {
  59. cursor: 'pointer'
  60. },
  61. 'mjx-status': {
  62. display: 'block',
  63. position: 'fixed',
  64. left: '1em',
  65. bottom: '1em',
  66. 'min-width': '25%',
  67. padding: '.2em .4em',
  68. border: '1px solid #888',
  69. 'font-size': '90%',
  70. 'background-color': '#F8F8F8',
  71. color: 'black'
  72. }
  73. };
  74. CHTMLmaction.actions = new Map([
  75. ['toggle', [function (node, _data) {
  76. node.adaptor.setAttribute(node.chtml, 'toggle', node.node.attributes.get('selection'));
  77. var math = node.factory.jax.math;
  78. var document = node.factory.jax.document;
  79. var mml = node.node;
  80. node.setEventHandler('click', function (event) {
  81. if (!math.end.node) {
  82. math.start.node = math.end.node = math.typesetRoot;
  83. math.start.n = math.end.n = 0;
  84. }
  85. mml.nextToggleSelection();
  86. math.rerender(document);
  87. event.stopPropagation();
  88. });
  89. }, {}]],
  90. ['tooltip', [function (node, data) {
  91. var tip = node.childNodes[1];
  92. if (!tip)
  93. return;
  94. if (tip.node.isKind('mtext')) {
  95. var text = tip.node.getText();
  96. node.adaptor.setAttribute(node.chtml, 'title', text);
  97. }
  98. else {
  99. var adaptor_1 = node.adaptor;
  100. var tool_1 = adaptor_1.append(node.chtml, node.html('mjx-tool', {
  101. style: { bottom: node.em(-node.dy), right: node.em(-node.dx) }
  102. }, [node.html('mjx-tip')]));
  103. tip.toCHTML(adaptor_1.firstChild(tool_1));
  104. node.setEventHandler('mouseover', function (event) {
  105. data.stopTimers(node, data);
  106. var timeout = setTimeout(function () { return adaptor_1.setStyle(tool_1, 'display', 'block'); }, data.postDelay);
  107. data.hoverTimer.set(node, timeout);
  108. event.stopPropagation();
  109. });
  110. node.setEventHandler('mouseout', function (event) {
  111. data.stopTimers(node, data);
  112. var timeout = setTimeout(function () { return adaptor_1.setStyle(tool_1, 'display', ''); }, data.clearDelay);
  113. data.clearTimer.set(node, timeout);
  114. event.stopPropagation();
  115. });
  116. }
  117. }, maction_js_2.TooltipData]],
  118. ['statusline', [function (node, data) {
  119. var tip = node.childNodes[1];
  120. if (!tip)
  121. return;
  122. if (tip.node.isKind('mtext')) {
  123. var adaptor_2 = node.adaptor;
  124. var text_1 = tip.node.getText();
  125. adaptor_2.setAttribute(node.chtml, 'statusline', text_1);
  126. node.setEventHandler('mouseover', function (event) {
  127. if (data.status === null) {
  128. var body = adaptor_2.body(adaptor_2.document);
  129. data.status = adaptor_2.append(body, node.html('mjx-status', {}, [node.text(text_1)]));
  130. }
  131. event.stopPropagation();
  132. });
  133. node.setEventHandler('mouseout', function (event) {
  134. if (data.status) {
  135. adaptor_2.remove(data.status);
  136. data.status = null;
  137. }
  138. event.stopPropagation();
  139. });
  140. }
  141. }, {
  142. status: null
  143. }]]
  144. ]);
  145. return CHTMLmaction;
  146. }((0, maction_js_1.CommonMactionMixin)(Wrapper_js_1.CHTMLWrapper)));
  147. exports.CHTMLmaction = CHTMLmaction;
  148. //# sourceMappingURL=maction.js.map