版博士V2.0程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

128 lines
3.8 KiB

  1. 'use strict';
  2. var vueDemi = require('vue-demi');
  3. var drauu = require('drauu');
  4. var core = require('@vueuse/core');
  5. var shared = require('@vueuse/shared');
  6. var __defProp = Object.defineProperty;
  7. var __getOwnPropSymbols = Object.getOwnPropertySymbols;
  8. var __hasOwnProp = Object.prototype.hasOwnProperty;
  9. var __propIsEnum = Object.prototype.propertyIsEnumerable;
  10. var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
  11. var __spreadValues = (a, b) => {
  12. for (var prop in b || (b = {}))
  13. if (__hasOwnProp.call(b, prop))
  14. __defNormalProp(a, prop, b[prop]);
  15. if (__getOwnPropSymbols)
  16. for (var prop of __getOwnPropSymbols(b)) {
  17. if (__propIsEnum.call(b, prop))
  18. __defNormalProp(a, prop, b[prop]);
  19. }
  20. return a;
  21. };
  22. function useDrauu(target, options) {
  23. const drauuInstance = vueDemi.ref();
  24. let disposables = [];
  25. const onChangedHook = core.createEventHook();
  26. const onCanceledHook = core.createEventHook();
  27. const onCommittedHook = core.createEventHook();
  28. const onStartHook = core.createEventHook();
  29. const onEndHook = core.createEventHook();
  30. const canUndo = vueDemi.ref(false);
  31. const canRedo = vueDemi.ref(false);
  32. const altPressed = vueDemi.ref(false);
  33. const shiftPressed = vueDemi.ref(false);
  34. const brush = vueDemi.ref({
  35. color: "black",
  36. size: 3,
  37. arrowEnd: false,
  38. cornerRadius: 0,
  39. dasharray: void 0,
  40. fill: "transparent",
  41. mode: "draw"
  42. });
  43. vueDemi.watch(brush, () => {
  44. const instance = drauuInstance.value;
  45. if (instance) {
  46. instance.brush = brush.value;
  47. instance.mode = brush.value.mode;
  48. }
  49. }, { deep: true });
  50. const undo = () => {
  51. var _a;
  52. return (_a = drauuInstance.value) == null ? void 0 : _a.undo();
  53. };
  54. const redo = () => {
  55. var _a;
  56. return (_a = drauuInstance.value) == null ? void 0 : _a.redo();
  57. };
  58. const clear = () => {
  59. var _a;
  60. return (_a = drauuInstance.value) == null ? void 0 : _a.clear();
  61. };
  62. const cancel = () => {
  63. var _a;
  64. return (_a = drauuInstance.value) == null ? void 0 : _a.cancel();
  65. };
  66. const load = (svg) => {
  67. var _a;
  68. return (_a = drauuInstance.value) == null ? void 0 : _a.load(svg);
  69. };
  70. const dump = () => {
  71. var _a;
  72. return (_a = drauuInstance.value) == null ? void 0 : _a.dump();
  73. };
  74. const cleanup = () => {
  75. var _a;
  76. disposables.forEach((dispose) => dispose());
  77. (_a = drauuInstance.value) == null ? void 0 : _a.unmount();
  78. };
  79. const syncStatus = () => {
  80. if (drauuInstance.value) {
  81. canUndo.value = drauuInstance.value.canUndo();
  82. canRedo.value = drauuInstance.value.canRedo();
  83. altPressed.value = drauuInstance.value.altPressed;
  84. shiftPressed.value = drauuInstance.value.shiftPressed;
  85. }
  86. };
  87. vueDemi.watch(() => core.unrefElement(target), (el) => {
  88. if (!el || typeof SVGSVGElement === "undefined" || !(el instanceof SVGSVGElement))
  89. return;
  90. if (drauuInstance.value)
  91. cleanup();
  92. drauuInstance.value = drauu.createDrauu(__spreadValues({ el }, options));
  93. syncStatus();
  94. disposables = [
  95. drauuInstance.value.on("canceled", () => onCanceledHook.trigger()),
  96. drauuInstance.value.on("committed", () => onCommittedHook.trigger()),
  97. drauuInstance.value.on("start", () => onStartHook.trigger()),
  98. drauuInstance.value.on("end", () => onEndHook.trigger()),
  99. drauuInstance.value.on("changed", () => {
  100. syncStatus();
  101. onChangedHook.trigger();
  102. })
  103. ];
  104. }, { flush: "post" });
  105. shared.tryOnScopeDispose(() => cleanup());
  106. return {
  107. drauuInstance,
  108. load,
  109. dump,
  110. clear,
  111. cancel,
  112. undo,
  113. redo,
  114. canUndo,
  115. canRedo,
  116. brush,
  117. onChanged: onChangedHook.on,
  118. onCommitted: onCommittedHook.on,
  119. onStart: onStartHook.on,
  120. onEnd: onEndHook.on,
  121. onCanceled: onCanceledHook.on
  122. };
  123. }
  124. exports.useDrauu = useDrauu;