horizontal-resizer.js 3.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. var __extends = (this && this.__extends) || (function () {
  2. var extendStatics = function (d, b) {
  3. extendStatics = Object.setPrototypeOf ||
  4. ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
  5. function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
  6. return extendStatics(d, b);
  7. };
  8. return function (d, b) {
  9. extendStatics(d, b);
  10. function __() { this.constructor = d; }
  11. d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
  12. };
  13. })();
  14. var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
  15. if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
  16. return cooked;
  17. };
  18. var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
  19. var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  20. if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  21. else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  22. return c > 3 && r && Object.defineProperty(target, key, r), r;
  23. };
  24. import { LitElement, html, customElement, css } from 'lit-element';
  25. var HorizontalResizer = (function (_super) {
  26. __extends(HorizontalResizer, _super);
  27. function HorizontalResizer() {
  28. var _this = _super.call(this) || this;
  29. _this._emitMove = function (e) {
  30. var n = e.clientX - _this.lastPosX;
  31. _this.lastPosX = e.clientX;
  32. var event = new CustomEvent('resize-x', {
  33. detail: n,
  34. bubbles: true,
  35. composed: true
  36. });
  37. _this.dispatchEvent(event);
  38. };
  39. _this._endResize = function (e) {
  40. _this.lastPosX = -1;
  41. window.removeEventListener("mousemove", _this._emitMove);
  42. window.removeEventListener("mouseup", _this._endResize);
  43. };
  44. _this.lastPosX = -1;
  45. return _this;
  46. }
  47. HorizontalResizer.prototype.render = function () {
  48. var _this = this;
  49. return html(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n <div @mousedown=", "></div>\n "], ["\n <div @mousedown=", "></div>\n "])), function (e) { return _this._startResize(e); });
  50. };
  51. HorizontalResizer.prototype._startResize = function (e) {
  52. this.lastPosX = e.clientX;
  53. window.addEventListener("mousemove", this._emitMove);
  54. window.addEventListener("mouseup", this._endResize);
  55. };
  56. HorizontalResizer.styles = css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n :host {\n min-width:4px;\n background-color:lightgray;\n cursor:col-resize;\n }\n div{\n width:100%;\n height:100%;\n }\n "], ["\n :host {\n min-width:4px;\n background-color:lightgray;\n cursor:col-resize;\n }\n div{\n width:100%;\n height:100%;\n }\n "])));
  57. HorizontalResizer = __decorate([
  58. customElement('horizontal-resizer')
  59. ], HorizontalResizer);
  60. return HorizontalResizer;
  61. }(LitElement));
  62. export { HorizontalResizer };
  63. var templateObject_1, templateObject_2;
  64. //# sourceMappingURL=horizontal-resizer.js.map