Method clear

js/main.js:1425–1465

()

  }

  clear() {
    const w = this.params.defaultSize.width === 'fill' ? this.wrapper.clientWidth : this.params.defaultSize.width;
    const h = this.params.defaultSize.height === 'fill' ? this.wrapper.clientHeight : this.params.defaultSize.height;
    this.resize(w, h);
    this.clearBackground();
    this.worklog.captureState(true);
    this.worklog.clean = true;
    this.syncToolElement();
    this.adjustSizeFull();

    if (this.params.initText && this.worklog.empty) {
      this.ctx.lineWidth = 3;
      this.ctx.strokeStyle = '#fff';
      const initTexts = this.wrapper.querySelectorAll('.init-text');
      if (initTexts.length > 0) {
        initTexts.forEach((text) => {
          text.remove();
        });
      }
      this.initText = document.createElement('div');
      this.initText.classList.add('init-text');
      this.wrapper.append(this.initText);
      this.initText.innerHTML = '<div style="pointer-events: none;position:absolute;top:50%;width:100%;left: 50%; transform: translate(-50%, -50%)">' +
        `${this.params.initText}</div>`;
      this.initText.style.left = '0';
      this.initText.style.top = '0';
      this.initText.style.right = '0';
      this.initText.style.bottom = '0';
      this.initText.style.pointerEvents = 'none';
      this.initText.style['text-align'] = 'center';
      this.initText.style.position = 'absolute';
      this.initText.style.color = this.params.initTextColor;
      this.initText.style['font-family'] = this.params.initTextStyle.split(/ (.+)/)[1];
      this.initText.style['font-size'] = this.params.initTextStyle.split(/ (.+)/)[0];

      this.wrapper.addEventListener('click', () => {
        this.initText.remove();
        this.initText = null;
      }, { once: true });
    }
  }

  clearBackground() {
    this.ctx.beginPath();