TypeScript DOMUtils.DOM類代碼示例

const transposeUiContainer = function (element, pos) {
  if (element && DOMUtils.DOM.getStyle(element, 'position', true) !== 'static') {
    const containerPos = DOMUtils.DOM.getPos(element);
    const dx = containerPos.x - element.scrollLeft;
    const dy = containerPos.y - element.scrollTop;
    return transpose(pos, -dx, -dy);
  } else {
    return transpose(pos, 0, 0);
  }
};

 suite.test('isUIElement on valid element', function (editor) {
   const uiElm1 = DOMUtils.DOM.create('div', { class: 'mce-abc' }, null);
   const uiElm2 = DOMUtils.DOM.create('div', { class: 'mcex-abc' }, null);
   const noUiElm = DOMUtils.DOM.create('div', { class: 'mcey-abc' }, null);
   editor.settings.custom_ui_selector = '.mcex-abc';
   LegacyUnit.equal(FocusController.isUIElement(editor, uiElm1), true, 'Should be true since mce- is a ui prefix');
   LegacyUnit.equal(FocusController.isUIElement(editor, uiElm2), true, 'Should be true since mcex- is a ui prefix');
   LegacyUnit.equal(FocusController.isUIElement(editor, noUiElm), false, 'Should be true since mcey- is not a ui prefix');
   delete editor.settings.custom_ui_selector;
 });

    Tools.each(invalidNames.split(' '), function (invalidName) {
      const elm = DOMUtils.DOM.add(document.body, invalidName, { class: 'targetEditor' }, null);

      EditorManager.init({
        selector: invalidName + '.targetEditor',
        skin_url: '/project/js/tinymce/skins/lightgray',
        inline: true
      });

      LegacyUnit.strictEqual(EditorManager.get().length, 0, 'Should not have created an editor');
      DOMUtils.DOM.remove(elm);
    });

const getUiContainerDelta = function () {
  const uiContainer = Env.container;
  if (uiContainer && DOMUtils.DOM.getStyle(uiContainer, 'position', true) !== 'static') {
    const containerPos = DOMUtils.DOM.getPos(uiContainer);
    const dx = uiContainer.scrollLeft - containerPos.x;
    const dy = uiContainer.scrollTop - containerPos.y;
    return Option.some({
      x: dx,
      y: dy
    });
  } else {
    return Option.none();
  }
};

  const showForm = function (editor, id) {
    if (panel) {
      panel.items().hide();

      if (!showToolbar(panel, id)) {
        hide();
        return;
      }

      let contentAreaRect, panelRect, result, userConstainHandler;

      showPanel(panel);
      panel.items().hide();
      showToolbar(panel, id);

      userConstainHandler = Settings.getPositionHandler(editor);
      contentAreaRect = Measure.getContentAreaRect(editor);
      panelRect = DOMUtils.DOM.getRect(panel.getEl());

      result = Layout.calc(currentRect, contentAreaRect, panelRect);

      if (result) {
        panelRect = result.rect;
        movePanelTo(panel, Layout.userConstrain(userConstainHandler, currentRect, contentAreaRect, panelRect));
        togglePositionClass(panel, result.position);
      }
    }
  };

export default function () {
  const domElm = DOMUtils.DOM.create('div', {
    style: 'position: absolute; right: 10px; top: 10px;'
  });

  const attach = function (preventDuplicates?) {
    if (preventDuplicates && domElm.parentNode === document.body) {
      detach();
    }
    document.body.appendChild(domElm);
  };

  const detach = function () {
    DOMUtils.DOM.remove(domElm);
  };

  const update = function (html) {
    DOMUtils.DOM.setHTML(domElm, html);
  };

  const get = function () {
    return domElm;
  };

  return {
    attach,
    update,
    detach,
    get
  };
}

const save = function (editor) {
  let formObj;

  formObj = DOMUtils.DOM.getParent(editor.id, 'form');

  if (Settings.enableWhenDirty(editor) && !editor.isDirty()) {
    return;
  }

  editor.save();

  // Use callback instead
  if (Settings.hasOnSaveCallback(editor)) {
    editor.execCallback('save_onsavecallback', editor);
    editor.nodeChanged();
    return;
  }

  if (formObj) {
    editor.setDirty(false);

    if (!formObj.onsubmit || formObj.onsubmit()) {
      if (typeof formObj.submit === 'function') {
        formObj.submit();
      } else {
        displayErrorMessage(editor, 'Error: Form submit field collision.');
      }
    }

    editor.nodeChanged();
  } else {
    displayErrorMessage(editor, 'Error: No form element found.');
  }
};

const open = function (url) {
  // Chrome and Webkit has implemented noopener and works correctly with/without popup blocker
  // Firefox has it implemented noopener but when the popup blocker is activated it doesn't work
  // Edge has only implemented noreferrer and it seems to remove opener as well
  // Older IE versions pre IE 11 falls back to a window.open approach
  if (!Env.ie || Env.ie > 10) {
    const link = document.createElement('a');
    link.target = '_blank';
    link.href = url;
    link.rel = 'noreferrer noopener';

    const evt = document.createEvent('MouseEvents');
    evt.initMouseEvent('click', true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);

    appendClickRemove(link, evt);
  } else {
    const win = window.open('', '_blank');
    if (win) {
      win.opener = null;
      const doc = win.document;
      doc.open();
      doc.write('<meta http-equiv="refresh" content="0; url=' + DOMUtils.DOM.encode(url) + '">');
      doc.close();
    }
  }
};

const toAbsolute = function (rect) {
  const vp = DOMUtils.DOM.getViewPort();

  return {
    x: rect.x + vp.x,
    y: rect.y + vp.y,
    w: rect.w,
    h: rect.h
  };
};