Server : Apache/2.4.41 (Ubuntu) System : Linux absol.cf 5.4.0-198-generic #218-Ubuntu SMP Fri Sep 27 20:18:53 UTC 2024 x86_64 User : www-data ( 33) PHP Version : 7.4.33 Disable Function : pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_get_handler,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,pcntl_async_signals,pcntl_unshare, Directory :  /var/www/html/libs/absol-full/dist/js/

Upload File : current_dir [ Writeable ] document_root [ Writeable ]

/*** module: node_modules/absol-tutor/js/app/Inspector.js ***/
"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _Context = _interopRequireDefault(require("absol/src/AppPattern/Context"));

var _OOP = _interopRequireDefault(require("absol/src/HTML5/OOP"));

var _Tooltip = _interopRequireDefault(require("absol-acomp/js/Tooltip"));

var _Core = require("../dom/Core");

require("../../css/inspector.css");

var _Dom = require("absol/src/HTML5/Dom");

var _BaseEditor = _interopRequireDefault(require("absol-form/js/core/BaseEditor"));

var _OnsScreenWindow = _interopRequireDefault(require("absol-acomp/js/OnsScreenWindow"));

var _ExpTree = _interopRequireDefault(require("absol-acomp/js/ExpTree"));

var _Clipboard = require("absol/src/HTML5/Clipboard");

var _Snackbar = _interopRequireDefault(require("absol-acomp/js/Snackbar"));

var _utils = require("absol-acomp/js/utils");


/***
 * @extends BaseEditor
 * @constructor
 */
function Inspector() {
  _BaseEditor.default.call(this);

  this.ev_mouseenter = this.ev_mouseenter.bind(this);

  this._createBox();

  this._createTreeWindow();
}

_OOP.default.mixClass(Inspector, _BaseEditor.default);

Inspector.prototype.CONFIG_STORE_KEY = "TUTOR_INSPECTOR_SETTING";
Inspector.prototype.config = {
  inspectedTreeWindow: {
    x: 1,
    y: 58,
    width: 15,
    height: 40
  }
};

Inspector.prototype.onResume = function () {
  document.body.addEventListener('mouseover', this.ev_mouseenter);
  this.$treeWindow.addTo(document.body);
};

Inspector.prototype.onPause = function () {
  document.body.removeEventListener('mouseover', this.ev_mouseenter);
  this.$box.remove();
  this.$treeWindow.remove();
};

Inspector.prototype._createBox = function () {
  this.$box = (0, _Core._)({
    class: 'atr-inspector-rect',
    child: {
      class: 'atr-inspector-rect-text',
      child: {
        text: ''
      }
    }
  });
  this.$text = (0, _Core.$)('.atr-inspector-rect-text', this.$box);
};

Inspector.prototype._createTreeWindow = function () {
  this.$treeWindow = (0, _Core._)({
    tag: _OnsScreenWindow.default.tag,
    style: {
      zIndex: 1900000000,
      top: this.config.inspectedTreeWindow.y + 'vh',
      left: this.config.inspectedTreeWindow.x + 'vw',
      width: this.config.inspectedTreeWindow.width + 'vw',
      height: this.config.inspectedTreeWindow.height + 'vh'
    },
    props: {
      windowTitle: 'Inspected Tree'
    },
    child: [{
      class: 'atr-inspector-tree-ctn',
      child: {
        tag: _ExpTree.default.tag,
        props: {
          name: ':root',
          icon: 'span.mdi.mdi-source-commit-start-next-local',
          status: 'open'
        }
      }
    }, {
      class: 'atr-inspector-tree-footer',
      child: {
        text: 'Tip: click to copy path'
      }
    }]
  });
  /***
   *
   * @type {ExpTree}
   */

  this.$tree = (0, _Core.$)('exptree', this.$treeWindow);
};

Inspector.prototype.tag2Icon = {
  'default': 'span.mdi.mdi-source-commit-start-next-local',
  'selectmenu': 'span.mdi.mdi-menu-open',
  'quickmenutrigger': 'span.mdi.mdi-dots-vertical-circle-outline',
  'checkbox': 'span.mdi.mdi-check-box-outline',
  'text-input': 'span.mdi.mdi-form-textbox'
};
/**
 *
 * @param {Array<string>} path
 * @param {string} tagName
 */

Inspector.prototype.addNode = function (path, tagName) {
  var current = this.$tree;
  var prev = null;

  for (var i = 0; i < path.length; ++i) {
    prev = current;
    prev.status = 'open';
    current = prev.accessByPath([path[i]]);

    if (!current) {
      current = (0, _Core._)({
        tag: _ExpTree.default.tag,
        extendEvent: 'contextmenu',
        props: {
          name: path[i]
        },
        on: {
          press: function (event) {
            var path = this.getPath();
            path.shift();
            (0, _Clipboard.copyText)(JSON.stringify(path.join(' ')));

            _Snackbar.default.show('Copy: ' + JSON.stringify(path.join(' ')));
          }
        }
      });

      if (i + 1 === path.length) {
        current.icon = this.tag2Icon[tagName] || this.tag2Icon.default;
      } else {
        current.icon = this.tag2Icon.default;
      }

      prev.addChild(current);
    }

    if (i + 1 === path.length) {
      if (this.$lastActiveNode) {
        this.$lastActiveNode.active = false;
      }

      this.$lastActiveNode = current;
      this.$lastActiveNode.active = true;
      (0, _utils.vScrollIntoView)(this.$lastActiveNode.getNode());
    }
  }
};

Inspector.prototype.ev_mouseenter = function (event) {
  if (!event.ctrlKey) return;
  var target = event.target;
  var elt;
  var idPath = [];
  var tooltipText = [];

  while (target) {
    if (target.classList.contains('absol-selectlist-item') && !(target.parentElement && target.parentElement.classList.contains('absol-selectmenu-holder-item'))) {
      elt = target;
      break;
    }

    var tutorId = target.getAttribute('data-tutor-id') || target['data-tutor-id'] || target['data-tutor-id'];

    if (tutorId) {
      if (!elt) elt = target;
      idPath.unshift(tutorId);
    }

    target = target.parentElement;
  }

  target = elt;
  var tagName = 'default';

  if (target) {
    if (idPath.length > 0) {
      tooltipText.push('id = ' + JSON.stringify(idPath[idPath.length - 1]));
      if (idPath.length > 1) tooltipText.push('path = ' + JSON.stringify(idPath.join(' ')));
      if (target.classList.contains('absol-selectmenu')) tagName = 'selectmenu';
      if (target.classList.contains('as-quick-menu-trigger')) tagName = 'quickmenutrigger';
      if (target.classList.contains('absol-checkbox')) tagName = 'checkbox';
      if (target.tagName === 'INPUT' && target.type === 'text') tagName = 'text-input';
      this.addNode(idPath, tagName);
    }

    if (target.classList.contains('absol-selectlist-item') || target.classList.contains('absol-selectmenu')) {
      if (target.value === 0 || target.value) tooltipText.push('value= <strong>' + target.value + '</strong>');
    }

    if (tooltipText.length > 0) {
      this.$text.innerHTML = tooltipText.join('  ');
      var bound = target.getBoundingClientRect();
      this.$box.addStyle({
        width: bound.width + 2 + 'px',
        height: bound.height + 2 + 'px',
        left: bound.left - 1 + 'px',
        top: bound.top - 1 + 'px'
      }).addTo(document.body);
      var textBound = this.$text.getBoundingClientRect();
      var screen = (0, _Dom.getScreenSize)();

      if (bound.top < textBound.height) {
        this.$box.addClass('atr-bottom');
      } else {
        this.$box.removeClass('atr-bottom');
      }

      if (bound.left + textBound.width > screen.width) {
        this.$box.addClass('atr-left');
      } else {
        this.$box.removeClass('atr-left');
      }
    }
  }

  if (!target) {
    this.$box.remove();
  }
};

var _default = Inspector;
exports.default = _default;