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 File : /var/www/html/libs/absol-full/dist/js/mdls__absol-form__js__layouteditor__LayoutEditor.js
/*** module: node_modules/absol-form/js/layouteditor/LayoutEditor.js ***/
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.LayoutOutlineDelegate = LayoutOutlineDelegate;
exports.LEComponentPropertyDelegate = LEComponentPropertyDelegate;
exports.default = void 0;
var _Assembler = _interopRequireWildcard(require("../core/Assembler"));
var _Dom = _interopRequireDefault(require("absol/src/HTML5/Dom"));
var _FCore = _interopRequireDefault(require("../core/FCore"));
require("../dom/HLine");
require("../dom/VLine");
var _R = _interopRequireDefault(require("../R"));
var _BaseEditor = _interopRequireDefault(require("../core/BaseEditor"));
var _UndoHistory = _interopRequireDefault(require("../editor/UndoHistory"));
var _ComponentPropertiesEditor = _interopRequireDefault(require("../editor/ComponentPropertiesEditor"));
var _LayoutEditorCmd = _interopRequireWildcard(require("./LayoutEditorCmd"));
var _ClipboardManager = _interopRequireDefault(require("../ClipboardManager"));
var _EventEmitter = _interopRequireDefault(require("absol/src/HTML5/EventEmitter"));
var _Rectangle = _interopRequireDefault(require("absol/src/Math/Rectangle"));
var _RelativeAnchorEditor = _interopRequireDefault(require("./anchoreditors/RelativeAnchorEditor"));
var _FmFragment = _interopRequireWildcard(require("../core/FmFragment"));
var _BaseComponent = _interopRequireDefault(require("../core/BaseComponent"));
var _OOP = _interopRequireDefault(require("absol/src/HTML5/OOP"));
var _ResizeSystem = _interopRequireDefault(require("absol/src/HTML5/ResizeSystem"));
var _CMDTool = _interopRequireDefault(require("../fragment/CMDTool"));
var _safeThrow = _interopRequireDefault(require("absol/src/Code/safeThrow"));
var _LEQuickPathController = _interopRequireDefault(require("./controller/LEQuickPathController"));
var _LEUndoController = _interopRequireDefault(require("./controller/LEUndoController"));
var _LERulerController = _interopRequireDefault(require("./controller/LERulerController"));
var _LEToolTabController = _interopRequireDefault(require("./controller/LEToolTabController"));
var _LEViewportController = _interopRequireDefault(require("./controller/LEViewportController"));
var _LESelectController = _interopRequireDefault(require("./controller/LESelectController"));
var _LEEditingLayoutControl = _interopRequireDefault(require("./controller/LEEditingLayoutControl"));
var _LEAnchorEditorController = _interopRequireDefault(require("./controller/LEAnchorEditorController"));
var _LEClipboardTool = _interopRequireDefault(require("./tool/LEClipboardTool"));
var _LEBoundViewController = _interopRequireDefault(require("./controller/LEBoundViewController"));
var _LETextEditTool = _interopRequireDefault(require("./componenttool/LETextEditTool"));
var _Scroller = require("absol-acomp/js/Scroller");
var _FOutline = require("../launcher/FOutline");
var _MultiObjectPropertyEditor = require("../propertyeditors/MultiObjectPropertyEditor");
var _IndexedPropertyNames = _interopRequireDefault(require("../core/IndexedPropertyNames"));
var _Toast = _interopRequireDefault(require("absol-acomp/js/Toast"));
var _OnsScreenWindow = _interopRequireDefault(require("absol-acomp/js/OnsScreenWindow"));
var _FNode = require("../core/FNode");
var _utils = require("../core/utils");
var _LinearAnchorEditor = _interopRequireDefault(require("./anchoreditors/LinearAnchorEditor"));
var _HyperAnchorEditor = _interopRequireDefault(require("./anchoreditors/HyperAnchorEditor"));
var _Constants = require("../Constants");
var _LELayoutStructTool = _interopRequireDefault(require("./componenttool/LELayoutStructTool"));
var _generator = require("absol/src/JSMaker/generator");
var _ = _FCore.default._;
var $ = _FCore.default.$;
/***
*
*/
/****
* @extends BaseEditor
* @constructor
*/
function LayoutEditor() {
_BaseEditor.default.call(this);
_Assembler.default.call(this);
this._bindEvent();
this.CMDTool = new _CMDTool.default();
this._softScale = 1;
var self = this;
this.setContext(_R.default.LAYOUT_EDITOR, this);
this.setContext(_R.default.HAS_CMD_EDITOR, this);
this.setContext(_R.default.CMD_TOOL, this.CMDTool);
this.setupCmd(_LayoutEditorCmd.default, _LayoutEditorCmd.LayoutEditorCmdDescriptors);
this.outlineDelegate = new LayoutOutlineDelegate(this);
this.lcEmitter = new _EventEmitter.default();
this.setContext(_R.default.LAYOUT_EDITOR_EMITTER, this.lcEmitter);
this.undoHistory = new _UndoHistory.default();
this.setContext(_R.default.UNDO_HISTORY, this.undoHistory);
/*
this.cpeListenner = {
change: function (event) {
self.updateAnchorPosition();
self.updateEditing();
Dom.updateResizeSystem();
if (event.name && event.name.match(/vAlign|hAlign|top|bottom|left|right/)) {
self.updateAnchor();
self.updateEditing();
}
},
stopchange: function (event) {
var compName = event.object ? event.object.getAttribute('name') : ('{' + event.objects.map(function (object) {
return object.getAttribute('name')
}).join(', ') + '}');
self.undoCtrl.commit('edit', compName + '.' + event.name + '');
self.notifyUnsaved();
if (event.name === 'name') {
self.outlineDelegate.notifyTreeChange();
}
}
};
*/
this.layoutStructTool = new _LELayoutStructTool.default(this);
this.quickPathCtrl = new _LEQuickPathController.default(this);
this.undoCtrl = new _LEUndoController.default(this);
this.toolTabCtrl = new _LEToolTabController.default(this);
this.rulerCtrl = new _LERulerController.default(this);
this.viewportCtrl = new _LEViewportController.default(this);
this.selectCtrl = new _LESelectController.default(this);
this.editingLayoutCtrl = new _LEEditingLayoutControl.default(this);
this.anchorEditorsCtrl = new _LEAnchorEditorController.default(this);
this.boundViewCtrl = new _LEBoundViewController.default(this);
this.clipboardCtrl = new _LEClipboardTool.default(this);
this.lastComponentPropertyDelegate = new LEComponentPropertyDelegate(this, []);
/***
*
* @type {null|Context}
*/
this.conponetEditTool = null;
this.CMDTool.bindWithEditor(this);
this.lcEmitter.on(_Constants.EV_COMP_BOUND_CHANGE, () => {
this.rulerCtrl.updateEditing();
this.boundViewCtrl.update();
this.anchorEditorsCtrl.updateAnchorEditorPositions();
}).on(_Constants.EV_COMP_TREE_CHANGE, () => {
this.boundViewCtrl.update();
this.selectCtrl.calcSelectBoundStyle();
this.outlineDelegate.notifyTreeChange();
this.boundViewCtrl.update();
this.anchorEditorsCtrl.updateAnchorEditorPositions();
}).on(_Constants.EV_SELECTED_COMP_CHANGE, () => {
this.outlineDelegate.notifySelectedChange();
this.notifyCmdChange();
}).on(_Constants.EV_EDITING_LAYOUT_CHANGE, () => {
this.rulerCtrl.updateEditing();
}).on(_Constants.EV_ANCHOR_EDITOR_CHANGE, () => {
if (this.lastComponentPropertyDelegate) {
this.lastComponentPropertyDelegate.updatePropertyRecursive('left');
this.lastComponentPropertyDelegate.updatePropertyRecursive('right');
this.lastComponentPropertyDelegate.updatePropertyRecursive('top');
this.lastComponentPropertyDelegate.updatePropertyRecursive('bottom');
this.lastComponentPropertyDelegate.updatePropertyRecursive('width');
this.lastComponentPropertyDelegate.updatePropertyRecursive('height');
}
this.rulerCtrl.updateEditing();
this.boundViewCtrl.update();
});
}
_OOP.default.mixClass(LayoutEditor, _Assembler.default, _BaseEditor.default);
LayoutEditor.prototype.CONFIG_STORE_KEY = "FM_LayoutEditor_config";
LayoutEditor.prototype.config = {};
LayoutEditor.prototype.tag2AnchorEditorClass = {
RelativeLayout: _RelativeAnchorEditor.default,
LinearLayout: _LinearAnchorEditor.default,
ChainLayout: _LinearAnchorEditor.default,
HyperLayout: _HyperAnchorEditor.default,
GridLayout: _HyperAnchorEditor.default
};
LayoutEditor.prototype._bindEvent = function () {
for (var key in this) {
if (key.startsWith('ev_')) {
this[key] = this[key].bind(this);
}
}
};
LayoutEditor.prototype.setSoftScale = function (val) {
//todo
this._softScale = val;
this.$editorSpace.addStyle('transform', 'scale(' + val + ')');
};
LayoutEditor.prototype.getSoftScale = function (val) {
return this._softScale;
};
LayoutEditor.prototype.zoomBy = function (val) {
this.setSoftScale(val * this._softScale);
};
LayoutEditor.prototype.onAttached = function () {
this.flexFormEditor = this.getContext(_R.default.FLEX_FORM_EDITOR);
this.undoHistory.attach(this);
this.propertyEditor = this.getContext(_R.default.ALL_PROPERTY_EDITOR);
};
LayoutEditor.prototype.onStart = function () {
this.undoHistory.start();
this.CMDTool.start();
};
LayoutEditor.prototype.onResume = function () {
/**
* @type {import('../launcher/FMLauncher').default}
*/
this.formEditor = this.getContext(_R.default.FORM_EDITOR);
this.flexFormEditor = this.getContext(_R.default.FLEX_FORM_EDITOR);
this.componentPicker = this.getContext(_R.default.COMPONENT_PICKER);
this.componentPicker.bindWithEditor(this);
this.selfHolder = this.formEditor.getEditorHolderByEditor(this);
/**
* @type {import('../editor/UndoHistory').default}
*/
this.undoHistory.resume(); // this.componentOtline.resume();
/**
* @type {import('../fragment/CMDTool'.default)}
*/
_ClipboardManager.default.on('set', this.ev_clipboardSet);
this.getView().focus();
this.rulerCtrl.onEditorResume();
if (this.propertyEditor && this.lastComponentPropertyDelegate) {
this.propertyEditor.delegate = this.lastComponentPropertyDelegate;
}
};
LayoutEditor.prototype.onPause = function () {
// this.componentPropertiesEditor.off(this.cpeListenner);
// this.componentPicker.bindWithEditor(null);
// release undoHistory
this.undoHistory.pause(); // this.componentOtline.pause();
if (this.CMDTool) {
this.CMDTool.pause();
}
_ClipboardManager.default.off('set', this.ev_clipboardSet);
this.getView().blur();
this.rulerCtrl.onEditorPause();
};
LayoutEditor.prototype.onStop = function () {
this.undoHistory.stop();
};
LayoutEditor.prototype.onDestroy = function () {
this.undoHistory.destroy();
if (this.autoDestroyInt > 0) {
clearInterval(this.autoDestroyInt);
}
};
/**
* call whenever component is edited, event will not be fired if disable publicDataChange flag
*/
LayoutEditor.prototype.notifyDataChange = function () {
this.emit('change', {
type: 'change',
target: this
}, this);
};
LayoutEditor.prototype.createView = function () {
var self = this;
this.$view = _({
class: ['as-layout-editor'],
attr: {
tabindex: '1'
},
child: [{
class: 'as-layout-editor-left',
child: [{
class: 'as-layout-editor-header',
child: [{
class: 'as-layout-editor-cmd-tool-container',
child: this.CMDTool.getView()
}, {
class: 'as-layout-editor-quickpath-container',
child: {
tag: 'quickpath'
}
}]
}, {
class: 'as-layout-editor-body',
child: [{
class: 'as-layout-editor-measure-container',
child: [{
class: 'as-layout-editor-vrule-container',
child: 'vruler'
}, {
class: 'as-layout-editor-hrule-container',
child: 'hruler'
}, {
class: 'as-layout-editor-background-container'
}, {
class: ["as-layout-editor-space-container"],
child: [{
class: 'as-layout-editor-space',
child: [{
class: 'as-layout-editor-layout-container'
}, 'svg.as-layout-editor-overlay-graphic', {
class: 'as-layout-editor-foreground',
extendEvent: 'contextmenu',
on: {
contextmenu: this.ev_contextMenuLayout.bind(this)
}
}]
}, {
tag: _Scroller.VScrollbar,
class: 'as-layout-editor-v-scroll-bar'
}, {
tag: _Scroller.HScrollbar,
class: 'as-layout-editor-h-scroll-bar'
}]
}]
}]
}]
}],
on: {
keydown: this.ev_cmdKeyDown.bind(this)
}
});
this.$history = this.undoHistory.getView();
/**
*
* @type {OnScreenWindow}
*/
this.$historyCtn = _({
tag: _OnsScreenWindow.default,
class: 'as-undo-history-window',
child: this.$history,
props: {
windowTitle: 'History',
windowActions: [{
name: 'close',
icon: 'span.mdi.mdi-close'
}]
},
on: {
relocation: () => {
var bound = this.$historyCtn.getBoundingClientRect();
this.config.historyWindow = {
left: bound.left,
top: bound.top,
width: bound.width,
height: bound.height
};
this.saveConfig();
},
action: () => {
this.$historyCtn.remove();
}
}
});
this.$historyCtn.$header.hangOn = 4;
this.$header = $('.as-layout-editor-header', this.$view);
this.$editorSpace = $('.as-layout-editor-space', this.$view);
this.$layoutCtn = $('.as-layout-editor-layout-container', this.$view);
this.$foreground = $('.as-layout-editor-foreground', this.$view); // .on('mousedown', this.ev_mousedownForeground.bind(this));//todo
this.$overlayGraphic = $('svg.as-layout-editor-overlay-graphic', this.$view);
this.$vscrollbar = $('.as-layout-editor-v-scroll-bar', this.$view);
this.$hscrollbar = $('.as-layout-editor-h-scroll-bar', this.$view);
this.quickPathCtrl.onCreateView();
this.rulerCtrl.onCreateView();
this.toolTabCtrl.onCreateView();
this.viewportCtrl.onCreateView();
this.selectCtrl.onCreateView();
this.editingLayoutCtrl.onCreateView();
this.anchorEditorsCtrl.onCreateView();
this.boundViewCtrl.onCreateView();
this.$attachHook = _('attachhook').on('attached', function () {
this.updateSize = self.updateSize.bind(self);
_Dom.default.addToResizeSystem(this);
self.updateSize();
}).addTo(this.$view);
this.$editorSpaceCtn = $('.as-layout-editor-space-container', this.$view).on('click', this.ev_clickEditorSpaceCtn);
this.autoDestroyInt = setInterval(function () {
if (!self.$view.isDescendantOf(document.body)) {
self.destroy();
}
}, 6900);
this.$mouseSelectingBox = _('.as-layout-editor-mouse-selecting-box');
this.$measureCtn = $('.as-layout-editor-measure-container', this.$view); // this.$vscrollbar = $('.as-layout-editor-v-scroll-bar', this.$view);
this.$layoutCtn.requestUpdateSize = () => {// console.log('ctn request update')
};
this.$view.layoutEditor = this;
};
/**
*
* @param {UndoTypeNames} type
* @param {string} descriptor
*/
LayoutEditor.prototype.commitChange = function (type, descriptor) {
this.undoCtrl.commit(type, descriptor);
this.notifyUnsaved();
this.notifyDataChange();
};
LayoutEditor.prototype.ev_clickEditorSpaceCtn = function (event) {
if (event.target === this.$editorSpaceCtn) {
this.setActiveComponent();
}
};
LayoutEditor.prototype.ev_mousedownForeground = function (event) {
if (!_EventEmitter.default.isMouseLeft(event)) return;
if (event.target !== this.$foreground) return;
var hitComponent = this.findComponentsByMousePosition(event.clientX, event.clientY);
if (hitComponent) {
if (event.shiftKey) this.toggleActiveComponent(hitComponent);else this.setActiveComponent(hitComponent);
var anchorEditor = this.anchorEditors[this.anchorEditors.length - 1]; //cheating
var repeatedEvent = _EventEmitter.default.copyEvent(event, {
target: $('.as-resize-box-body', anchorEditor.$resizeBox),
preventDefault: event.preventDefault.bind(event)
});
anchorEditor.$resizeBox.eventHandler.mouseDownBody(repeatedEvent);
this.$view.focus(); // layouteditor may be not focus before, prevent default effect make it not focus
// prevent auto toggle with click event
anchorEditor.preventClick = true;
anchorEditor.once('click', function () {
setTimeout(function () {
anchorEditor.preventClick = false;
}, 1);
});
anchorEditor.$resizeBox.on('endmove', function () {
anchorEditor.preventClick = false;
});
} else {
$(document.body).on('mouseup', this.ev_mouseFinishForeground).on('mouseleave', this.ev_mouseFinishForeground).on('mousemove', this.ev_mouseMoveForeground);
this.$editorSpaceCtn.off('click', this.ev_clickEditorSpaceCtn);
this.$mouseSelectingBox.addTo(this.$foreground);
var foregroundBound = this.$foreground.getBoundingClientRect();
this._forgroundMovingData = {
left: event.clientX - foregroundBound.left,
top: event.clientY - foregroundBound.top,
width: 0,
height: 0,
event0: event
};
this.$mouseSelectingBox.addStyle({
left: this._forgroundMovingData.left + 'px',
top: this._forgroundMovingData.top + 'px',
width: '0',
height: '0'
});
}
};
LayoutEditor.prototype.ev_mouseMoveForeground = function (event) {
var foregroundBound = this.$foreground.getBoundingClientRect();
this._forgroundMovingData.width = event.clientX - foregroundBound.left - this._forgroundMovingData.left;
this._forgroundMovingData.height = event.clientY - foregroundBound.top - this._forgroundMovingData.top;
if (this._forgroundMovingData.width < 0) {
this.$mouseSelectingBox.addStyle({
left: this._forgroundMovingData.left + this._forgroundMovingData.width + 'px',
width: -this._forgroundMovingData.width + 'px'
});
} else {
this.$mouseSelectingBox.addStyle({
left: this._forgroundMovingData.left + 'px',
width: this._forgroundMovingData.width + 'px'
});
}
if (this._forgroundMovingData.height < 0) {
this.$mouseSelectingBox.addStyle({
top: this._forgroundMovingData.top + this._forgroundMovingData.height + 'px',
height: -this._forgroundMovingData.height + 'px'
});
} else {
this.$mouseSelectingBox.addStyle({
top: this._forgroundMovingData.top + 'px',
height: this._forgroundMovingData.height + 'px'
});
}
};
LayoutEditor.prototype.ev_mouseFinishForeground = function (event) {
$(document.body).off('mouseup', this.ev_mouseFinishForeground).off('mouseleave', this.ev_mouseFinishForeground).off('mousemove', this.ev_mouseMoveForeground);
setTimeout(this.$editorSpaceCtn.on.bind(this.$editorSpaceCtn, 'click', this.ev_clickEditorSpaceCtn), 10);
this.$mouseSelectingBox.remove(); //find all rectangle
var selectedComp = [];
var event0 = this._forgroundMovingData.event0;
var left = Math.min(event0.clientX, event.clientX);
var right = Math.max(event0.clientX, event.clientX);
var top = Math.min(event0.clientY, event.clientY);
var bottom = Math.max(event0.clientY, event.clientY);
var selectRect = new _Rectangle.default(left, top, right - left, bottom - top);
var children = this.editingLayout.children;
if (this.anchorEditors.length > 0) {
children = this.editingLayout.children;
}
var comp, compRect;
for (var i = 0; i < children.length; ++i) {
comp = children[i];
compRect = _Rectangle.default.fromClientRect(comp.view.getBoundingClientRect());
if (compRect.isCollapse(selectRect)) selectedComp.push(comp);
}
var self = this;
if (event.shiftKey) {
this.toggleActiveComponent.apply(this, selectedComp.filter(function (comp) {
return !self.findAnchorEditorByComponent(comp);
}));
} else {
this.setActiveComponent.apply(this, selectedComp);
}
};
LayoutEditor.prototype.ev_layoutCtnScroll = function () {
this.rulerCtrl.update();
};
LayoutEditor.prototype.ev_contextMenuLayout = function (event) {
var self = this;
if (event.target === this.$foreground) {
event.showContextMenu({
// play-box-outline
items: [{
text: 'Preview',
icon: 'span.mdi.mdi-pencil-box-multiple-outline',
cmd: 'preview'
}],
extendStyle: {
fontSize: '12px'
}
}, function (menuEvent) {
var cmd = menuEvent.menuItem.cmd;
self.execCmd(cmd);
});
}
};
LayoutEditor.prototype.ev_clipboardSet = function () {
this.notifyCmdDescriptorsChange();
};
LayoutEditor.prototype.updateEditing = function () {
this.rulerCtrl.updateEditing();
};
LayoutEditor.prototype.updateAnchor = function () {
this.anchorEditorsCtrl.updateAnchorEditors();
};
LayoutEditor.prototype.updateAnchorPosition = function () {
this.anchorEditorsCtrl.updateAnchorEditorPositions();
};
LayoutEditor.prototype.findComponentsByName = function (name, from) {
from = from || this.rootLayout;
if (!from) return;
var res = undefined;
if (from.attributes.name === name) {
return [from];
}
var self = this;
if (from.fragment !== this.rootFragment) return undefined;
if (from.children) res = from.children.reduce(function (ac, child) {
var found = self.findComponentsByName(name, child);
if (found) return ac.concat(found);
return ac;
}, []);
if (res.length > 0) return res;
return undefined;
};
LayoutEditor.prototype.findComponentsById = function (id, from) {
from = from || this.rootLayout;
if (!from) return undefined;
var res = undefined;
if (from.attributes.id === id) {
return [from];
}
if (from.fragment !== this.rootFragment) return undefined;
var self = this;
if (from.children) {
res = from.children.reduce(function (ac, child) {
var found = self.findComponentsById(id, child);
if (found) return ac.concat(found);
return ac;
}, []);
}
if (res.length > 0) return res;
return undefined;
};
LayoutEditor.prototype.updateSize = function () {
this.updateAnchorPosition();
var gBound = this.$overlayGraphic.getBoundingClientRect();
this.$overlayGraphic.attr('viewBox', [0, 0, gBound.width, gBound.height].join(' '));
this.boundViewCtrl.update();
this.viewportCtrl.updateScrollbar();
};
LayoutEditor.prototype.setActiveComponent = function () {
this.anchorEditorsCtrl.setActiveComponent.apply(this.anchorEditorsCtrl, arguments);
};
LayoutEditor.prototype.setActiveComponentByName = function () {
this.anchorEditorsCtrl.setActiveComponentByName.apply(this.anchorEditorsCtrl, arguments);
};
LayoutEditor.prototype.setActiveComponentById = function () {
this.anchorEditorsCtrl.setActiveComponentById.apply(this.anchorEditorsCtrl, arguments);
};
LayoutEditor.prototype.openComponentProperties = function (components) {
this.lastComponentPropertyDelegate = new LEComponentPropertyDelegate(this, components);
if (this.propertyEditor) {
this.propertyEditor.delegate = this.lastComponentPropertyDelegate;
}
};
LayoutEditor.prototype.findFocusAnchorEditor = function () {
// faster
for (var i = this.anchorEditors.length - 1; i >= 0; --i) {
if (this.anchorEditors[i].isFocus) return this.anchorEditors[i];
}
return null;
};
LayoutEditor.prototype.getActivatedComponents = function () {
return this.anchorEditors.map(function (e) {
return e.component;
}).filter(function (e) {
return !!e;
});
};
LayoutEditor.prototype.applyData = function (data) {
var FmClass = (0, _FmFragment.makeFmFragmentClass)({
tag: 'LayoutTest',
contentViewData: {
layout: data
}
});
this.rootFragment = new FmClass();
this.$layoutCtn.clearChild().addChild(this.rootLayout.domElt);
this.rootLayout.onAttached(this);
this.rulerCtrl.assignRoot();
this.editingLayoutCtrl.edit(this.rootLayout);
this.lcEmitter.emit(_Constants.EV_COMP_TREE_CHANGE);
this.emit('change', {
type: 'change',
target: this,
data: data
}, this);
};
LayoutEditor.prototype.setData = function (data) {
this.applyData(data);
this.undoCtrl.commit('set-data', "Set data");
this.boundViewCtrl.update();
};
LayoutEditor.prototype.autoExpandRootLayout = function () {
//?todo: check usage
if (this.rootLayout) {
var minSize = this.rootLayout.measureMinSize();
var isChange = false;
if (minSize.width > this.rootLayout.style.width) {
this.rootLayout.setStyle('width', minSize.width);
isChange = true;
}
if (minSize.height > this.rootLayout.style.height) {
this.rootLayout.setStyle('height', minSize.height);
isChange = true;
}
if (isChange) {
this.emit('layoutexpand', {
type: 'layoutexpand',
target: this,
layout: this.rootLayout
}, this);
this.notifyDataChange();
}
}
};
LayoutEditor.prototype.editLayout = function (layout) {
if (layout && layout.isLayout) {
this.anchorEditorsCtrl.setActiveComponent();
this.editingLayoutCtrl.edit(layout);
}
};
/***
*
* @param {BaseComponent} comp
*/
LayoutEditor.prototype.editComponent = function (comp) {
if (this.conponetEditTool) {
this.conponetEditTool.stop();
this.conponetEditTool = null;
}
if (comp.tag === 'Text' || comp.tag === 'Label') {
this.conponetEditTool = new _LETextEditTool.default(this, comp);
this.conponetEditTool.start();
}
};
LayoutEditor.prototype.editLayoutByName = function (name) {
var comps = this.findComponentsByName(name);
if (comps && comps.length > 0) this.editLayout(comps[0]);
};
LayoutEditor.prototype.getData = function () {
if (this.rootLayout) {
return this.rootLayout.getData();
}
return null;
};
LayoutEditor.prototype.getCmdDescriptor = function (name) {
var descriptor = null;
descriptor = descriptor || this.selectCtrl.getCmdDescriptor(name);
if (this.editingLayout) {
var anchorEditorConstructor = this.tag2AnchorEditorClass[this.editingLayout.tag];
if (anchorEditorConstructor.prototype.getCmdDescriptor) {
descriptor = descriptor || anchorEditorConstructor.prototype.getCmdDescriptor.call(null, name);
}
}
descriptor = descriptor || _LayoutEditorCmd.LayoutEditorCmdDescriptors[name];
var res = Object.assign({
type: 'trigger',
desc: 'command: ' + name,
icon: 'span.mdi.mdi-apple-keyboard-command'
}, descriptor);
if ((name.startsWith('align') || name.startsWith('equalise')) && this.anchorEditors.length < 2) {
res.disabled = true;
} else if (name.startsWith('distribute') && this.anchorEditors.length < 3) {
res.disabled = true;
} else if (name.match(/^(delete|copy|cut|horizontalAlign|verticalAlign)/) && this.anchorEditors.length < 1) {
res.disabled = true;
} else if (name === 'paste') {
res.disabled = !_ClipboardManager.default.get(_R.default.CLIPBOARD.COMPONENTS);
} else if (name === 'undo') {
res.disabled = this.undoHistory.lastItemIndex <= 0;
} else if (name === 'redo') {
res.disabled = this.undoHistory.lastItemIndex >= this.undoHistory.items.length - 1;
}
return res;
};
LayoutEditor.prototype.getCmdGroupTree = function () {
/**
*
* @type {CMDTabListNodeDeclaration}
*/
var res = (0, _generator.copyJSVariable)(_LayoutEditorCmd.LayoutEditorCmdTree);
res.children[res.children.length - 1].children = this.anchorEditorsCtrl.getCmdGroupTree();
return res;
};
LayoutEditor.prototype.findNearestLayoutParent = function (comp) {
while (comp) {
if (comp.addChildByPosition) {
break;
}
comp = comp.parent;
}
return comp;
};
/**
* @returns {BaseComponent}
*/
LayoutEditor.prototype.addNewComponent = function (constructor, posX, posY) {
var comps = this.layoutStructTool.makeNewComponents(constructor);
this.layoutStructTool.addComponentByPosition(comps, posX, posY);
};
LayoutEditor.prototype.notifyUnsaved = function () {
this.flexFormEditor.notifyUnsaved();
};
LayoutEditor.prototype.notifySaved = function () {
this.flexFormEditor.notifySaved();
};
LayoutEditor.prototype.getSelected = function () {
return this.anchorEditors.map(function (aed) {
return aed.component.attributes.id;
});
};
LayoutEditor.prototype.execCmd = function () {
try {
return _BaseEditor.default.prototype.execCmd.apply(this, arguments);
} catch (error) {
if (!error.message.startsWith('No command')) (0, _safeThrow.default)(error);
}
try {
var focusEditor = this.findFocusAnchorEditor();
if (focusEditor) {
return focusEditor.execCmd.apply(focusEditor, arguments);
}
} catch (error1) {
if (!error1.message.startsWith('No command')) (0, _safeThrow.default)(error1);
}
};
Object.defineProperty(LayoutEditor.prototype, 'editingLayout', {
get: function () {
return this.editingLayoutCtrl && this.editingLayoutCtrl.editingLayout;
}
});
Object.defineProperty(LayoutEditor.prototype, 'rootLayout', {
get: function () {
return this.rootFragment && this.rootFragment.view || null;
}
});
Object.defineProperty(LayoutEditor.prototype, 'anchorEditors', {
get: function () {
return this.anchorEditorsCtrl.anchorEditors;
}
});
var _default = LayoutEditor;
/***
* @extends OutlineDelegate
* @param {LayoutEditor} editor
* @constructor
*/
exports.default = _default;
function LayoutOutlineDelegate(editor) {
_FOutline.OutlineDelegate.call(this);
this.editor = editor;
}
_OOP.default.mixClass(LayoutOutlineDelegate, _FOutline.OutlineDelegate);
LayoutOutlineDelegate.prototype.getTreeData = function () {
var layout = this.editor.rootLayout;
if (!layout) return [];
var frag = layout.fragment;
var visit = compNode => {
var dataNode = {
name: compNode.attributes.displayName || compNode.attributes.name,
id: compNode.attributes.id,
icon: compNode.fragment === frag ? compNode.menuIcon : compNode.fragment.menuIcon
};
if (compNode.fragment === frag && compNode.children && compNode.children.length > 0) {
dataNode.children = compNode.children.map(c => visit(c));
}
return dataNode;
};
return visit(layout);
};
LayoutOutlineDelegate.prototype.onClickNode = function (nodeElt, event) {
var id = nodeElt.data.id;
var comp = this.editor.findComponentsById(id);
if (!comp) return;
comp = comp[0];
var parentLayout = this.editor.findNearestLayoutParent(comp.parent);
var newEditingLayout = parentLayout || this.editor.editingLayout;
if (event.altKey) {
if (comp.isLayout) {
newEditingLayout = comp;
}
}
if (newEditingLayout !== this.editor.editingLayout) {
this.editor.editLayout(newEditingLayout);
this.editor.anchorEditorsCtrl.setActiveComponent();
}
if (event.altKey) return;
if (event.shiftKey) {
this.editor.anchorEditorsCtrl.toggleActiveComponent(comp);
} else {
this.editor.setActiveComponent(comp);
}
};
LayoutOutlineDelegate.prototype.getSelectedIdList = function () {
return this.editor.anchorEditorsCtrl.getComponents().map(comp => comp.attributes.id);
};
LayoutOutlineDelegate.prototype.getNodeContextMenu = function (nodeElt) {
var id = nodeElt.data.id;
var comp = this.editor.findComponentsById(id)[0];
if (!comp) return null; //todo: check component can delete
var items = [];
items.push({
icon: 'span.mdi.mdi-delete-variant',
text: 'Delete',
cmd: 'delete',
extendStyle: {
color: 'red'
}
});
var anchorEditor = this.editor.anchorEditorsCtrl.findAnchorEditorByComponent(comp);
if (anchorEditor) {
anchorEditor.focus(); // this.updateComponentStatus();
} else {
this.editor.setActiveComponent(comp);
}
if (this.editor.anchorEditors.length === 1) {
items = [{
icon: 'span.mdi.mdi-chevron-double-up',
text: 'Move To First',
cmd: 'move-to-top'
}, {
icon: 'span.mdi.mdi-chevron-up',
text: 'Move To Previous',
cmd: 'move-up'
}, {
icon: 'span.mdi.mdi-chevron-down',
text: 'Move To Next',
cmd: 'move-down'
}, {
icon: 'span.mdi.mdi-chevron-double-down',
text: 'Move To Last',
cmd: 'move-to-bottom'
}, '================='].concat(items);
}
if (comp.isLayout && comp.fragment === this.editor.rootFragment) {
items = [{
icon: 'span.mdi.mdi-square-edit-outline',
text: comp.isFragmentView ? "Edit Fragment" : 'Edit Layout',
cmd: comp.isFragmentView ? 'edit_fragment' : 'edit_layout',
extendStyle: {
color: 'blue'
}
}, '=============='].concat(items);
}
return {
items: items
};
};
LayoutOutlineDelegate.prototype.onNodeSelectContextMenu = function (nodeElt, menuItem, event) {
var id = nodeElt.data.id;
var comp = this.editor.findComponentsById(id)[0];
if (!comp) return;
switch (event.menuItem.cmd) {
case "delete":
this.editor.execCmd('delete');
break;
case 'move-to-top':
this.editor.layoutStructTool.moveComponentToFirst(comp);
break;
case 'move-up':
this.editor.layoutStructTool.moveComponentToPrevious(comp);
break;
case 'move-down':
this.editor.layoutStructTool.moveComponentToNext(comp);
break;
case 'move-to-bottom':
this.editor.layoutStructTool.moveComponentToLast(comp);
break;
case 'edit_layout':
this.editor.editLayout(comp);
break;
case 'edit_fragment':
var toast = _Toast.default.make({
props: {
htitle: "TODO",
message: "Edit form"
}
});
setTimeout(toast.disappear.bind(toast), 2000);
break;
}
};
/***
* @extends MultiObjectPropertyDelegate
* @param {LayoutEditor} editor
* @param {Array<BaseComponent>} components
* @constructor
*/
function LEComponentPropertyDelegate(editor, components) {
this.editor = editor;
this.components = components;
_MultiObjectPropertyEditor.MultiObjectPropertyDelegate.call(this);
}
_OOP.default.mixClass(LEComponentPropertyDelegate, _MultiObjectPropertyEditor.MultiObjectPropertyDelegate);
LEComponentPropertyDelegate.prototype.getPropertyNames = function () {
if (this.components.length === 0) return [];
var descriptors = {};
var hasDependency = {};
this.components.forEach(comp => {
if (comp.fragment !== this.editor.rootFragment) {
descriptors['class'] = [{
type: 'enum',
values: [comp.fragment.tag] //
}];
}
Object.keys(comp.attributeHandlers).forEach(name => {
if (comp.fragment !== this.editor.rootFragment) {
if (!['id', 'name'].includes(name)) return;
}
var desc = comp.attributes.getPropertyDescriptor(name);
if (desc.dependency && desc.dependency.length > 0) hasDependency[name] = true;
descriptors[name] = descriptors[name] || [];
descriptors[name].push(desc);
});
Object.keys(Object.assign({}, comp.styleHandlers, comp.anchor && comp.anchor.styleHandlers)).forEach(name => {
var desc = comp.style.getPropertyDescriptor(name);
if (desc.dependency && desc.dependency.length > 0) hasDependency[name] = true;
descriptors[name] = descriptors[name] || [];
descriptors[name].push(desc);
});
});
var checkOKDescArr = arr => {
if (arr.length !== this.components.length) return false;
if (arr.length === 1) return true;
var first = arr[0];
return arr.every(it => it.sign && it.sign === first.sign);
};
var names = Object.keys(descriptors).filter(key => (!hasDependency[key] || this.components.length === 1) && checkOKDescArr(descriptors[key]));
names.sort((a, b) => {
var vA = _IndexedPropertyNames.default[a] + 1 || 10000;
var vB = _IndexedPropertyNames.default[b] + 1 || 10000;
if (vA === vB) {
if (a < b) vB += 1;else vA += 1;
}
return vA - vB;
});
return names;
};
LEComponentPropertyDelegate.prototype.getAllTagsByTypeId = function (typeId) {
var res = Object.keys(_Assembler.AssemblerInstance.classes['FRAGMENT']).map(formId => {
var clazz = _Assembler.AssemblerInstance.classes['FRAGMENT'][formId];
var cvd = clazz.prototype.contentViewData;
var layout = cvd.layout || cvd;
var id = layout.attributes && layout.attributes.typeId;
if (id === typeId) return formId;
return null;
}).filter(x => x !== null);
return res;
};
LEComponentPropertyDelegate.prototype.getPropertyDescriptor = function (key, ...args) {
if (key === 'class') return {
type: 'enum',
values: this.getAllTagsByTypeId(this.components[0].fragment.contentViewData.layout.attributes && this.components[0].fragment.contentViewData.layout.attributes.typeId) //
};
var obj = this.components[this.components.length - 1];
var disabled = ['name', 'disembark', 'dataBinding', 'value', 'values', 'list', 'treeList', 'disabled', 'text', 'checked', 'textType'].indexOf(key) >= 0 && this.components.some(function (obj) {
return obj.attributes && obj.attributes.permissions && obj.attributes.permissions.edit_attributes === 'GENERATOR';
});
var res = obj.attributeHandlers[key] ? obj.attributes.getPropertyDescriptor(key) : obj.style.getPropertyDescriptor(key);
res = Object.assign({}, res);
res.disabled = res.disabled || disabled;
return res;
};
LEComponentPropertyDelegate.prototype.getProperty = function (key, ...args) {
var _obj$attributes, _obj$style;
var obj = this.components[this.components.length - 1];
if (key === 'class') {
return this.components[0].fragment.contentViewData.layout.attributes && this.components[0].fragment.contentViewData.layout.attributes.typeId;
}
return obj.attributeHandlers[key] ? (_obj$attributes = obj.attributes).getProperty.apply(_obj$attributes, [key].concat(args)) : (_obj$style = obj.style).getProperty.apply(_obj$style, [key].concat(args));
};
LEComponentPropertyDelegate.prototype.mesureKeys = ['left', 'right', 'top', 'bottom', 'width', 'height', /^padding/, /^margin/];
LEComponentPropertyDelegate.prototype.setProperty = function (key, value, ...args) {
var isMeasure;
switch (key) {
case 'class':
this.components.forEach(obj => {
var style = obj.style.export();
var attributes = {
id: obj.attributes.id,
name: obj.attributes.name
};
if (obj.attributes.permissions) {
attributes.permissions = obj.attributes.permissions;
}
var newFrag = _Assembler.AssemblerInstance.build({
class: value,
style: style,
attributes: attributes
});
obj.parent.addChildBefore(newFrag.view, obj);
obj.fragment.parent.addChildBefore(newFrag, obj.fragment);
obj.parent.removeChild(obj);
obj.fragment.parent.removeChild(newFrag);
});
this.editor.anchorEditorsCtrl.setActiveComponent();
_ResizeSystem.default.update();
break;
case 'position':
this.components.forEach(obj => {
if (obj.style.position === 'absolute' && (value === 'relative' || value === 'static') || obj.style.position === 'relative' && value === 'static') {
obj.style.left = 0;
obj.style.top = 0;
obj.style.bottom = 0;
obj.style.right = 0;
}
obj.style.position = value;
});
this.editor.anchorEditorsCtrl.updateAnchorEditors();
break;
default:
this.components.forEach(obj => {
var _obj$attributes2, _obj$style2;
return obj.attributeHandlers[key] ? (_obj$attributes2 = obj.attributes).setProperty.apply(_obj$attributes2, [key, value].concat(args)) : (_obj$style2 = obj.style).setProperty.apply(_obj$style2, [key, value].concat(args));
});
isMeasure = this.mesureKeys.some(t => key === t || t.test && t.test(key));
if (isMeasure) {
this.editor.anchorEditorsCtrl.updateAnchorEditorPositions();
} else if (key.toLowerCase().indexOf('align')) {
this.editor.anchorEditorsCtrl.updateAnchorEditors();
}
}
};
LEComponentPropertyDelegate.prototype.onSetPropertyComplete = function (name) {
this.editor.commitChange('move', 'Set ' + name);
};
Server : Apache/2.4.41 (Ubuntu)