Browse Source

Fix lint style

pull/4312/head
Alex Ritter 4 years ago
parent
commit
cf86ded06f
  1. 32
      src/abstract/Module.ts
  2. 2
      src/asset_manager/config/config.js
  3. 2
      src/asset_manager/model/AssetImage.js
  4. 2
      src/block_manager/config/config.js
  5. 2
      src/code_manager/config/config.js
  6. 6
      src/code_manager/index.js
  7. 2
      src/commands/config/config.js
  8. 2
      src/commands/view/CanvasClear.js
  9. 2
      src/commands/view/ComponentEnter.js
  10. 2
      src/commands/view/ComponentExit.js
  11. 2
      src/commands/view/ComponentNext.js
  12. 2
      src/commands/view/ComponentPrev.js
  13. 2
      src/commands/view/CopyComponent.js
  14. 8
      src/commands/view/DeleteComponent.js
  15. 8
      src/commands/view/ExportTemplate.js
  16. 13
      src/commands/view/Fullscreen.js
  17. 8
      src/commands/view/OpenAssets.js
  18. 4
      src/commands/view/OpenBlocks.js
  19. 2
      src/commands/view/OpenLayers.js
  20. 19
      src/commands/view/OpenTraitManager.js
  21. 2
      src/commands/view/Preview.js
  22. 21
      src/commands/view/SelectPosition.js
  23. 2
      src/commands/view/SwitchVisibility.js
  24. 2
      src/css_composer/config/config.js
  25. 212
      src/dom_components/index.ts
  26. 8
      src/dom_components/model/ComponentComment.js
  27. 6
      src/dom_components/model/ComponentFrame.js
  28. 10
      src/dom_components/model/ComponentImage.js
  29. 6
      src/dom_components/model/ComponentLabel.js
  30. 27
      src/dom_components/model/ComponentMap.js
  31. 6
      src/dom_components/model/ComponentScript.js
  32. 6
      src/dom_components/model/ComponentSvg.js
  33. 6
      src/dom_components/model/ComponentSvgIn.js
  34. 6
      src/dom_components/model/ComponentTable.js
  35. 10
      src/dom_components/model/ComponentTableBody.js
  36. 6
      src/dom_components/model/ComponentTableCell.js
  37. 6
      src/dom_components/model/ComponentTableFoot.js
  38. 6
      src/dom_components/model/ComponentTableHead.js
  39. 6
      src/dom_components/model/ComponentTableRow.js
  40. 8
      src/dom_components/model/ComponentTextNode.js
  41. 41
      src/dom_components/model/ComponentVideo.js
  42. 2
      src/dom_components/view/ComponentTableView.js
  43. 280
      src/editor/model/Editor.ts
  44. 60
      src/i18n/locale/ca.js
  45. 38
      src/i18n/locale/el.js
  46. 42
      src/i18n/locale/es.js
  47. 38
      src/i18n/locale/fa.js
  48. 38
      src/i18n/locale/it.js
  49. 234
      src/i18n/locale/ko.js
  50. 42
      src/i18n/locale/nl.js
  51. 42
      src/i18n/locale/pl.js
  52. 392
      src/i18n/locale/pt.js
  53. 26
      src/i18n/locale/tr.js
  54. 36
      src/i18n/locale/zh.js
  55. 2
      src/modal_dialog/config/config.js
  56. 8
      src/modal_dialog/index.js
  57. 2
      src/navigator/config/config.js
  58. 30
      src/panels/config/config.js
  59. 4
      src/panels/index.js
  60. 20
      src/parser/model/BrowserParserCss.js
  61. 9
      src/parser/model/ParserCss.js
  62. 2
      src/plugin_manager/config/config.js
  63. 2
      src/plugin_manager/index.js
  64. 9
      src/rich_text_editor/model/RichTextEditor.js
  65. 26
      src/style_manager/index.js
  66. 5
      src/style_manager/model/PropertyComposite.js
  67. 75
      src/style_manager/model/PropertyFactory.js
  68. 8
      src/style_manager/model/PropertyStack.js
  69. 12
      src/style_manager/view/PropertyColorView.js
  70. 2
      src/trait_manager/config/config.js
  71. 2
      src/trait_manager/model/TraitFactory.js
  72. 4
      src/utils/Sorter.js
  73. 364
      src/utils/cash-dom.js
  74. 13
      src/utils/dom.js
  75. 2
      src/utils/index.js
  76. 5
      src/utils/polyfills.js
  77. 2
      test/specs/asset_manager/view/AssetImageView.js
  78. 6
      test/specs/asset_manager/view/AssetView.js
  79. 12
      test/specs/asset_manager/view/AssetsView.js
  80. 12
      test/specs/asset_manager/view/FileUploader.js
  81. 8
      test/specs/block_manager/view/BlocksView.js
  82. 8
      test/specs/commands/index.js
  83. 36
      test/specs/commands/view/CommandAbstract.js
  84. 6
      test/specs/commands/view/SwitchVisibility.js
  85. 36
      test/specs/css_composer/e2e/CssComposer.js
  86. 10
      test/specs/css_composer/view/CssRuleView.js
  87. 26
      test/specs/css_composer/view/CssRulesView.js
  88. 8
      test/specs/device_manager/view/DevicesView.js
  89. 1
      test/specs/dom_components/index.js
  90. 2
      test/specs/dom_components/view/ComponentImageView.js
  91. 2
      test/specs/modal/view/ModalView.js
  92. 18
      test/specs/panels/e2e/PanelsE2e.js
  93. 4
      test/specs/panels/model/PanelModels.js
  94. 8
      test/specs/panels/view/ButtonView.js
  95. 2
      test/specs/panels/view/ButtonsView.js
  96. 6
      test/specs/panels/view/PanelView.js
  97. 2
      test/specs/panels/view/PanelsView.js
  98. 37
      test/specs/selector_manager/e2e/ClassManager.js
  99. 41
      test/specs/selector_manager/index.js
  100. 8
      test/specs/selector_manager/model/SelectorModels.js

32
src/abstract/Module.ts

@ -1,7 +1,7 @@
import { isElement, isUndefined } from "underscore";
import { Collection, View } from "../common";
import EditorModel from "../editor/model/Editor";
import { createId, isDef } from "../utils/mixins";
import { isElement, isUndefined } from 'underscore';
import { Collection, View } from '../common';
import EditorModel from '../editor/model/Editor';
import { createId, isDef } from '../utils/mixins';
export interface IModule<TConfig extends any = any>
extends IBaseModule<TConfig> {
@ -48,7 +48,7 @@ export default abstract class Module<T extends ModuleConfig = ModuleConfig>
? em.config[name]
: em.config[this.name];
const cfg = cfgParent === true ? {} : cfgParent || {};
cfg.pStylePrefix = em.config.pStylePrefix || "";
cfg.pStylePrefix = em.config.pStylePrefix || '';
if (!isUndefined(cfgParent) && !cfgParent) {
cfg._disable = 1;
@ -121,15 +121,15 @@ export abstract class ItemManagerModule<
) {
const { all, onResult, reset } = param;
const key = this.storageKey;
const opts: any = { action: "load" };
const opts: any = { action: 'load' };
const coll = all || this.all;
let result = data[key];
if (typeof result == "string") {
if (typeof result == 'string') {
try {
result = JSON.parse(result);
} catch (err) {
this.__logWarn("Data parsing failed", { input: result });
this.__logWarn('Data parsing failed', { input: result });
}
}
@ -168,19 +168,19 @@ export abstract class ItemManagerModule<
all &&
em &&
all
.on("add", (m: any, c: any, o: any) => em.trigger(events.add, m, o))
.on("remove", (m: any, c: any, o: any) =>
.on('add', (m: any, c: any, o: any) => em.trigger(events.add, m, o))
.on('remove', (m: any, c: any, o: any) =>
em.trigger(events.remove, m, o)
)
.on("change", (p: any, c: any) =>
.on('change', (p: any, c: any) =>
em.trigger(events.update, p, p.changedAttributes(), c)
)
.on("all", this.__catchAllEvent, this);
.on('all', this.__catchAllEvent, this);
// Register collections
this.cls = [all].concat(opts.collections || []);
// Propagate events
((opts.propagate as any[]) || []).forEach(({ entity, event }) => {
entity.on("all", (ev: any, model: any, coll: any, opts: any) => {
entity.on('all', (ev: any, model: any, coll: any, opts: any) => {
const options = opts || coll;
const opt = { event: ev, ...options };
[em, all].map((md) => md.trigger(event, model, opt));
@ -234,15 +234,15 @@ export abstract class ItemManagerModule<
}
__listenAdd(model: TCollection, event: string) {
model.on("add", (m, c, o) => this.em.trigger(event, m, o));
model.on('add', (m, c, o) => this.em.trigger(event, m, o));
}
__listenRemove(model: TCollection, event: string) {
model.on("remove", (m, c, o) => this.em.trigger(event, m, o));
model.on('remove', (m, c, o) => this.em.trigger(event, m, o));
}
__listenUpdate(model: TCollection, event: string) {
model.on("change", (p, c) =>
model.on('change', (p, c) =>
this.em.trigger(event, p, p.changedAttributes(), c)
);
}

2
src/asset_manager/config/config.js

@ -106,5 +106,5 @@ export default {
openAssetsOnDrop: 1,
// Any dropzone content to append inside dropzone element
dropzoneContent: ''
dropzoneContent: '',
};

2
src/asset_manager/model/AssetImage.js

@ -7,7 +7,7 @@ export default class AssetImage extends Asset {
type: 'image',
unitDim: 'px',
height: 0,
width: 0
width: 0,
};
}
}

2
src/block_manager/config/config.js

@ -20,5 +20,5 @@ export default {
blocks: [],
// Avoid rendering the default block manager.
custom: false
custom: false,
};

2
src/code_manager/config/config.js

@ -2,5 +2,5 @@ export default {
// Style prefix
stylePrefix: 'cm-',
inlineCss: false
inlineCss: false,
};

6
src/code_manager/index.js

@ -222,9 +222,7 @@ export default () => {
},
destroy() {
[c, generators, defGenerators, viewers, defViewers].forEach(
i => (i = {})
);
}
[c, generators, defGenerators, viewers, defViewers].forEach(i => (i = {}));
},
};
};

2
src/commands/config/config.js

@ -6,5 +6,5 @@ export default {
// If true, stateful commands (with `run` and `stop` methods) can't be runned multiple times.
// So, if the command is already active, running it again will not execute the `run` method
strict: 1
strict: 1,
};

2
src/commands/view/CanvasClear.js

@ -2,5 +2,5 @@ export default {
run(ed) {
ed.DomComponents.clear();
ed.CssComposer.clear();
}
},
};

2
src/commands/view/ComponentEnter.js

@ -10,5 +10,5 @@ export default {
});
toSelect.length && ed.select(toSelect);
}
},
};

2
src/commands/view/ComponentExit.js

@ -15,5 +15,5 @@ export default {
});
toSelect.length && ed.select(toSelect);
}
},
};

2
src/commands/view/ComponentNext.js

@ -23,5 +23,5 @@ export default {
});
toSelect.length && ed.select(toSelect);
}
},
};

2
src/commands/view/ComponentPrev.js

@ -22,5 +22,5 @@ export default {
});
toSelect.length && ed.select(toSelect);
}
},
};

2
src/commands/view/CopyComponent.js

@ -3,5 +3,5 @@ export default {
const em = ed.getModel();
const models = [...ed.getSelectedAll()];
models.length && em.set('clipboard', models);
}
},
};

8
src/commands/view/DeleteComponent.js

@ -13,11 +13,7 @@ export default extend({}, SelectComponent, {
enable() {
var that = this;
this.$el
.find('*')
.mouseover(this.startDelete)
.mouseout(this.stopDelete)
.click(this.onDelete);
this.$el.find('*').mouseover(this.startDelete).mouseout(this.stopDelete).click(this.onDelete);
},
/**
@ -74,5 +70,5 @@ export default extend({}, SelectComponent, {
* */
updateBadgeLabel(model) {
this.badge.html('Remove ' + model.getName());
}
},
});

8
src/commands/view/ExportTemplate.js

@ -22,7 +22,7 @@ export default {
modal
.open({
title: config.textViewCode,
content: this.$editors
content: this.$editors,
})
.getModel()
.once('change:open', () => editor.stopCommand(this.id));
@ -43,16 +43,16 @@ export default {
label,
codeName,
theme,
input
input,
});
const $el = new this.cm.EditorView({
model: el,
config: this.cm.getConfig()
config: this.cm.getConfig(),
}).render().$el;
el.init(input);
return { el, $el };
}
},
};

13
src/commands/view/Fullscreen.js

@ -7,12 +7,7 @@ export default {
*/
isEnabled() {
var d = document;
if (
d.fullscreenElement ||
d.webkitFullscreenElement ||
d.mozFullScreenElement
)
return 1;
if (d.fullscreenElement || d.webkitFullscreenElement || d.mozFullScreenElement) return 1;
else return 0;
},
@ -66,9 +61,7 @@ export default {
run(editor, sender, opts = {}) {
this.sender = sender;
const { target } = opts;
const targetEl = isElement(target)
? target
: document.querySelector(target);
const targetEl = isElement(target) ? target : document.querySelector(target);
const pfx = this.enable(targetEl || editor.getContainer());
this.fsChanged = this.fsChanged.bind(this, pfx);
document.addEventListener(pfx + 'fullscreenchange', this.fsChanged);
@ -79,5 +72,5 @@ export default {
if (sender && sender.set) sender.set('active', false);
this.disable();
if (editor) editor.trigger('change:canvasOffset');
}
},
};

8
src/commands/view/OpenAssets.js

@ -37,7 +37,7 @@ export default {
am.__behaviour({
select,
types,
options: opts
options: opts,
});
if (config.custom) {
@ -58,9 +58,7 @@ export default {
}
if (accept) {
const uploadEl = this.rendered.querySelector(
`input#${config.stylePrefix}uploadFile`
);
const uploadEl = this.rendered.querySelector(`input#${config.stylePrefix}uploadFile`);
uploadEl && uploadEl.setAttribute('accept', accept);
}
}
@ -72,5 +70,5 @@ export default {
stop(editor) {
this.editor = editor;
this.close(this.rendered);
}
},
};

4
src/commands/view/OpenBlocks.js

@ -41,7 +41,7 @@ export default {
this.bm = bm;
const { container } = this;
bm.__behaviour({
container
container,
});
if (this.config.custom) {
@ -53,5 +53,5 @@ export default {
stop() {
this.close();
}
},
};

2
src/commands/view/OpenLayers.js

@ -20,5 +20,5 @@ export default {
stop() {
const { layers } = this;
layers && (layers.style.display = 'none');
}
},
};

19
src/commands/view/OpenTraitManager.js

@ -19,25 +19,16 @@ export default {
this.$cn = $('<div></div>');
this.$cn2 = $('<div></div>');
this.$cn.append(this.$cn2);
this.$header = $('<div>').append(
`<div class="${confTm.stylePrefix}header">${em.t(
'traitManager.empty'
)}</div>`
);
this.$header = $('<div>').append(`<div class="${confTm.stylePrefix}header">${em.t('traitManager.empty')}</div>`);
this.$cn.append(this.$header);
this.$cn2.append(
`<div class="${pfx}traits-label">${em.t('traitManager.label')}</div>`
);
this.$cn2.append(`<div class="${pfx}traits-label">${em.t('traitManager.label')}</div>`);
this.$cn2.append(tm.render());
var panels = editor.Panels;
if (!panels.getPanel('views-container'))
panelC = panels.addPanel({ id: 'views-container' });
if (!panels.getPanel('views-container')) panelC = panels.addPanel({ id: 'views-container' });
else panelC = panels.getPanel('views-container');
panelC
.set('appendContent', this.$cn.get(0))
.trigger('change:appendContent');
panelC.set('appendContent', this.$cn.get(0)).trigger('change:appendContent');
this.target = editor.getModel();
this.listenTo(this.target, 'component:toggled', this.toggleTm);
@ -66,5 +57,5 @@ export default {
stop() {
this.$cn2 && this.$cn2.hide();
this.$header && this.$header.hide();
}
},
};

2
src/commands/view/Preview.js

@ -93,5 +93,5 @@ export default {
editor.refresh();
this.tglEffects();
}
},
};

21
src/commands/view/SelectPosition.js

@ -25,7 +25,7 @@ export default {
nested: 1,
em: this.editorModel,
canvasRelative: 1,
scale: () => this.em.getZoomDecimal()
scale: () => this.em.getZoomDecimal(),
});
if (opts.onStart) this.sorter.onStart = opts.onStart;
@ -51,19 +51,13 @@ export default {
* */
stopSelectPosition() {
this.posTargetCollection = null;
this.posIndex =
this.posMethod == 'after' && this.cDim.length !== 0
? this.posIndex + 1
: this.posIndex; //Normalize
this.posIndex = this.posMethod == 'after' && this.cDim.length !== 0 ? this.posIndex + 1 : this.posIndex; //Normalize
if (this.sorter) {
this.sorter.moved = 0;
this.sorter.endMove();
}
if (this.cDim) {
this.posIsLastEl =
this.cDim.length !== 0 &&
this.posMethod == 'after' &&
this.posIndex == this.cDim.length;
this.posIsLastEl = this.cDim.length !== 0 && this.posMethod == 'after' && this.posIndex == this.cDim.length;
this.posTargetEl =
this.cDim.length === 0
? $(this.outsideElem)
@ -96,12 +90,7 @@ export default {
var m = method || 'before';
var len = dims.length;
var isLast = len !== 0 && m == 'after' && i == len;
if (
len !== 0 &&
((!isLast && !dims[i][4]) ||
(dims[i - 1] && !dims[i - 1][4]) ||
(isLast && !dims[i - 1][4]))
)
if (len !== 0 && ((!isLast && !dims[i][4]) || (dims[i - 1] && !dims[i - 1][4]) || (isLast && !dims[i - 1][4])))
return 1;
return 0;
},
@ -114,5 +103,5 @@ export default {
this.stopSelectPosition();
this.$wrapper.css('cursor', '');
this.$wrapper.unbind();
}
},
};

2
src/commands/view/SwitchVisibility.js

@ -29,5 +29,5 @@ export default {
_upFrame(frame, active) {
const method = active ? 'add' : 'remove';
frame.view.getBody().classList[method](`${this.ppfx}dashed`);
}
},
};

2
src/css_composer/config/config.js

@ -18,5 +18,5 @@ export default {
* return style;
* }
*/
onBeforeStyle: null
onBeforeStyle: null,
};

212
src/dom_components/index.ts

@ -59,152 +59,152 @@ import {
isString,
result,
debounce,
} from "underscore";
import defaults from "./config/config";
import Component, { keyUpdate, keyUpdateInside } from "./model/Component";
import Components from "./model/Components";
import ComponentView from "./view/ComponentView";
import ComponentWrapperView from "./view/ComponentWrapperView";
import ComponentsView from "./view/ComponentsView";
import ComponentTableCell from "./model/ComponentTableCell";
import ComponentTableCellView from "./view/ComponentTableCellView";
import ComponentTableRow from "./model/ComponentTableRow";
import ComponentTableRowView from "./view/ComponentTableRowView";
import ComponentTable from "./model/ComponentTable";
import ComponentTableView from "./view/ComponentTableView";
import ComponentTableHead from "./model/ComponentTableHead";
import ComponentTableHeadView from "./view/ComponentTableHeadView";
import ComponentTableBody from "./model/ComponentTableBody";
import ComponentTableBodyView from "./view/ComponentTableBodyView";
import ComponentTableFoot from "./model/ComponentTableFoot";
import ComponentTableFootView from "./view/ComponentTableFootView";
import ComponentMap from "./model/ComponentMap";
import ComponentMapView from "./view/ComponentMapView";
import ComponentLink from "./model/ComponentLink";
import ComponentLinkView from "./view/ComponentLinkView";
import ComponentLabel from "./model/ComponentLabel";
import ComponentLabelView from "./view/ComponentLabelView";
import ComponentVideo from "./model/ComponentVideo";
import ComponentVideoView from "./view/ComponentVideoView";
import ComponentImage from "./model/ComponentImage";
import ComponentImageView from "./view/ComponentImageView";
import ComponentScript from "./model/ComponentScript";
import ComponentScriptView from "./view/ComponentScriptView";
import ComponentSvg from "./model/ComponentSvg";
import ComponentSvgIn from "./model/ComponentSvgIn";
import ComponentSvgView from "./view/ComponentSvgView";
import ComponentComment from "./model/ComponentComment";
import ComponentCommentView from "./view/ComponentCommentView";
import ComponentTextNode from "./model/ComponentTextNode";
import ComponentTextNodeView from "./view/ComponentTextNodeView";
import ComponentText from "./model/ComponentText";
import ComponentTextView from "./view/ComponentTextView";
import ComponentWrapper from "./model/ComponentWrapper";
import ComponentFrame from "./model/ComponentFrame";
import ComponentFrameView from "./view/ComponentFrameView";
import { ItemManagerModule } from "../abstract/Module";
import EditorModel from "../editor/model/Editor";
import { Model } from "backbone";
} from 'underscore';
import defaults from './config/config';
import Component, { keyUpdate, keyUpdateInside } from './model/Component';
import Components from './model/Components';
import ComponentView from './view/ComponentView';
import ComponentWrapperView from './view/ComponentWrapperView';
import ComponentsView from './view/ComponentsView';
import ComponentTableCell from './model/ComponentTableCell';
import ComponentTableCellView from './view/ComponentTableCellView';
import ComponentTableRow from './model/ComponentTableRow';
import ComponentTableRowView from './view/ComponentTableRowView';
import ComponentTable from './model/ComponentTable';
import ComponentTableView from './view/ComponentTableView';
import ComponentTableHead from './model/ComponentTableHead';
import ComponentTableHeadView from './view/ComponentTableHeadView';
import ComponentTableBody from './model/ComponentTableBody';
import ComponentTableBodyView from './view/ComponentTableBodyView';
import ComponentTableFoot from './model/ComponentTableFoot';
import ComponentTableFootView from './view/ComponentTableFootView';
import ComponentMap from './model/ComponentMap';
import ComponentMapView from './view/ComponentMapView';
import ComponentLink from './model/ComponentLink';
import ComponentLinkView from './view/ComponentLinkView';
import ComponentLabel from './model/ComponentLabel';
import ComponentLabelView from './view/ComponentLabelView';
import ComponentVideo from './model/ComponentVideo';
import ComponentVideoView from './view/ComponentVideoView';
import ComponentImage from './model/ComponentImage';
import ComponentImageView from './view/ComponentImageView';
import ComponentScript from './model/ComponentScript';
import ComponentScriptView from './view/ComponentScriptView';
import ComponentSvg from './model/ComponentSvg';
import ComponentSvgIn from './model/ComponentSvgIn';
import ComponentSvgView from './view/ComponentSvgView';
import ComponentComment from './model/ComponentComment';
import ComponentCommentView from './view/ComponentCommentView';
import ComponentTextNode from './model/ComponentTextNode';
import ComponentTextNodeView from './view/ComponentTextNodeView';
import ComponentText from './model/ComponentText';
import ComponentTextView from './view/ComponentTextView';
import ComponentWrapper from './model/ComponentWrapper';
import ComponentFrame from './model/ComponentFrame';
import ComponentFrameView from './view/ComponentFrameView';
import { ItemManagerModule } from '../abstract/Module';
import EditorModel from '../editor/model/Editor';
import { Model } from 'backbone';
export default class ComponentManager extends ItemManagerModule {
componentTypes = [
{
id: "cell",
id: 'cell',
model: ComponentTableCell,
view: ComponentTableCellView,
},
{
id: "row",
id: 'row',
model: ComponentTableRow,
view: ComponentTableRowView,
},
{
id: "table",
id: 'table',
model: ComponentTable,
view: ComponentTableView,
},
{
id: "thead",
id: 'thead',
model: ComponentTableHead,
view: ComponentTableHeadView,
},
{
id: "tbody",
id: 'tbody',
model: ComponentTableBody,
view: ComponentTableBodyView,
},
{
id: "tfoot",
id: 'tfoot',
model: ComponentTableFoot,
view: ComponentTableFootView,
},
{
id: "map",
id: 'map',
model: ComponentMap,
view: ComponentMapView,
},
{
id: "link",
id: 'link',
model: ComponentLink,
view: ComponentLinkView,
},
{
id: "label",
id: 'label',
model: ComponentLabel,
view: ComponentLabelView,
},
{
id: "video",
id: 'video',
model: ComponentVideo,
view: ComponentVideoView,
},
{
id: "image",
id: 'image',
model: ComponentImage,
view: ComponentImageView,
},
{
id: "script",
id: 'script',
model: ComponentScript,
view: ComponentScriptView,
},
{
id: "svg-in",
id: 'svg-in',
model: ComponentSvgIn,
view: ComponentSvgView,
},
{
id: "svg",
id: 'svg',
model: ComponentSvg,
view: ComponentSvgView,
},
{
id: "iframe",
id: 'iframe',
model: ComponentFrame,
view: ComponentFrameView,
},
{
id: "comment",
id: 'comment',
model: ComponentComment,
view: ComponentCommentView,
},
{
id: "textnode",
id: 'textnode',
model: ComponentTextNode,
view: ComponentTextNodeView,
},
{
id: "text",
id: 'text',
model: ComponentText,
view: ComponentTextView,
},
{
id: "wrapper",
id: 'wrapper',
model: ComponentWrapper,
view: ComponentWrapperView,
},
{
id: "default",
id: 'default',
model: Component,
view: ComponentView,
},
@ -226,7 +226,7 @@ export default class ComponentManager extends ItemManagerModule {
*/
//name = "DomComponents";
storageKey = "components";
storageKey = 'components';
shallow?: Component;
@ -237,7 +237,7 @@ export default class ComponentManager extends ItemManagerModule {
* @private
*/
constructor(em: EditorModel) {
super(em, "DomComponents", new Components(undefined, { em }));
super(em, 'DomComponents', new Components(undefined, { em }));
if (em) {
this.config.components = em.config.components || this.config.components;
@ -253,16 +253,16 @@ export default class ComponentManager extends ItemManagerModule {
// Load dependencies
if (em) {
this.config.modal = em.get("Modal") || "";
this.config.am = em.get("AssetManager") || "";
em.get("Parser").compTypes = this.componentTypes;
em.on("change:componentHovered", this.componentHovered, this);
this.config.modal = em.get('Modal') || '';
this.config.am = em.get('AssetManager') || '';
em.get('Parser').compTypes = this.componentTypes;
em.on('change:componentHovered', this.componentHovered, this);
const selected = em.get("selected");
em.listenTo(selected, "add", (sel, c, opts) =>
const selected = em.get('selected');
em.listenTo(selected, 'add', (sel, c, opts) =>
this.selectAdd(selected.getComponent(sel), opts)
);
em.listenTo(selected, "remove", (sel, c, opts) =>
em.listenTo(selected, 'remove', (sel, c, opts) =>
this.selectRemove(selected.getComponent(sel), opts)
);
}
@ -276,7 +276,7 @@ export default class ComponentManager extends ItemManagerModule {
let wrapper = this.getWrapper();
if (!wrapper) {
this.em.get("PageManager").add({}, { select: true });
this.em.get('PageManager').add({}, { select: true });
wrapper = this.getWrapper();
}
@ -302,7 +302,7 @@ export default class ComponentManager extends ItemManagerModule {
* @private
*/
getComponent(): Component {
const sel = this.em.get("PageManager").getSelected();
const sel = this.em.get('PageManager').getSelected();
const frame = sel && sel.getMainFrame();
return frame && frame.getComponent();
}
@ -350,7 +350,7 @@ export default class ComponentManager extends ItemManagerModule {
*/
getComponents(): Components {
const wrp = this.getWrapper();
return wrp && wrp.get("components");
return wrp && wrp.get('components');
}
/**
@ -444,7 +444,7 @@ export default class ComponentManager extends ItemManagerModule {
? extendType
: compType
? compType
: this.getType("default");
: this.getType('default');
const modelToExt = typeToExtend.model;
const viewToExt = extendViewType ? extendViewType.view : typeToExtend.view;
@ -463,14 +463,14 @@ export default class ComponentManager extends ItemManagerModule {
}, {});
// If the model/view is a simple object I need to extend it
if (typeof model === "object") {
if (typeof model === 'object') {
methods.model = modelToExt.extend(
{
...model,
...getExtendedObj(extendFn, model, modelToExt),
defaults: {
...(result(modelToExt.prototype, "defaults") || {}),
...(result(model, "defaults") || {}),
...(result(modelToExt.prototype, 'defaults') || {}),
...(result(model, 'defaults') || {}),
},
},
{
@ -482,7 +482,7 @@ export default class ComponentManager extends ItemManagerModule {
);
}
if (typeof view === "object") {
if (typeof view === 'object') {
methods.view = viewToExt.extend({
...view,
...getExtendedObj(extendFnView, view, viewToExt),
@ -497,7 +497,7 @@ export default class ComponentManager extends ItemManagerModule {
this.componentTypes.unshift(methods);
}
const event = `component:type:${compType ? "update" : "add"}`;
const event = `component:type:${compType ? 'update' : 'add'}`;
em?.trigger(event, compType || methods);
return this;
@ -509,7 +509,7 @@ export default class ComponentManager extends ItemManagerModule {
* @param {string} type Component ID
* @return {Object} Component type definition, eg. `{ model: ..., view: ... }`
*/
getType(type: "default"): { id: string; model: any; view: any };
getType(type: 'default'): { id: string; model: any; view: any };
getType(type: string): { id: string; model: any; view: any } | undefined;
getType(type: string) {
var df = this.componentTypes;
@ -548,9 +548,9 @@ export default class ComponentManager extends ItemManagerModule {
selectAdd(component: Component, opts = {}) {
if (component) {
component.set({
status: "selected",
status: 'selected',
});
["component:selected", "component:toggled"].forEach((event) =>
['component:selected', 'component:toggled'].forEach((event) =>
this.em.trigger(event, component, opts)
);
}
@ -560,10 +560,10 @@ export default class ComponentManager extends ItemManagerModule {
if (component) {
const { em } = this;
component.set({
status: "",
state: "",
status: '',
state: '',
});
["component:deselected", "component:toggled"].forEach((event) =>
['component:deselected', 'component:toggled'].forEach((event) =>
this.em.trigger(event, component, opts)
);
}
@ -575,19 +575,19 @@ export default class ComponentManager extends ItemManagerModule {
*/
componentHovered() {
const { em } = this;
const model = em.get("componentHovered");
const previous = em.previous("componentHovered");
const state = "hovered";
const model = em.get('componentHovered');
const previous = em.previous('componentHovered');
const state = 'hovered';
// Deselect the previous component
previous &&
previous.get("status") == state &&
previous.get('status') == state &&
previous.set({
status: "",
state: "",
status: '',
state: '',
});
model && isEmpty(model.get("status")) && model.set("status", state);
model && isEmpty(model.get('status')) && model.set('status', state);
}
getShallowWrapper() {
@ -596,14 +596,14 @@ export default class ComponentManager extends ItemManagerModule {
if (!shallow && em) {
const shallowEm = em.shallow;
if (!shallowEm) return;
const domc = shallowEm.get("DomComponents");
const domc = shallowEm.get('DomComponents');
domc.componentTypes = this.componentTypes;
shallow = domc.getWrapper();
if (shallow) {
const events = [keyUpdate, keyUpdateInside].join(" ");
const events = [keyUpdate, keyUpdateInside].join(' ');
shallow.on(
events,
debounce(() => shallow?.components(""), 100)
debounce(() => shallow?.components(''), 100)
);
}
this.shallow = shallow;
@ -648,33 +648,33 @@ export default class ComponentManager extends ItemManagerModule {
if (!srcModel) return result;
// Check if the source is draggable in the target
let draggable = srcModel.get("draggable");
let draggable = srcModel.get('draggable');
if (isFunction(draggable)) {
draggable = !!draggable(srcModel, target, at);
} else {
const el = target.getEl();
draggable = isArray(draggable) ? draggable.join(",") : draggable;
draggable = isArray(draggable) ? draggable.join(',') : draggable;
draggable = isString(draggable) ? el?.matches(draggable) : draggable;
}
if (!draggable) return { ...result, reason: 1 };
// Check if the target accepts the source
let droppable = target.get("droppable");
let droppable = target.get('droppable');
if (isFunction(droppable)) {
droppable = !!droppable(srcModel, target, at);
} else {
if (
droppable === false &&
target.isInstanceOf("text") &&
srcModel.get("textable")
target.isInstanceOf('text') &&
srcModel.get('textable')
) {
droppable = true;
} else {
const el = srcModel.getEl();
droppable = isArray(droppable) ? droppable.join(",") : droppable;
droppable = isArray(droppable) ? droppable.join(',') : droppable;
droppable = isString(droppable) ? el?.matches(droppable) : droppable;
}
}

8
src/dom_components/model/ComponentComment.js

@ -3,12 +3,12 @@ import Component from './ComponentTextNode';
export default Component.extend(
{
defaults: {
...Component.prototype.defaults
...Component.prototype.defaults,
},
toHTML() {
return `<!--${this.get('content')}-->`;
}
},
},
{
isComponent(el) {
@ -16,9 +16,9 @@ export default Component.extend(
return {
tagName: 'NULL',
type: 'comment',
content: el.textContent
content: el.textContent,
};
}
}
},
}
);

6
src/dom_components/model/ComponentFrame.js

@ -13,11 +13,11 @@ export default Component.extend(
droppable: false,
resizable: true,
traits: ['id', 'title', 'src'],
attributes: { frameborder: '0' }
attributes: { frameborder: '0' },
};
}
},
},
{
isComponent: el => toLowerCase(el.tagName) === type
isComponent: el => toLowerCase(el.tagName) === type,
}
);

10
src/dom_components/model/ComponentImage.js

@ -29,7 +29,7 @@ export default Component.extend(
</svg>`,
// File to load asynchronously once the model is rendered
file: ''
file: '',
},
initialize(o, opt) {
@ -61,7 +61,7 @@ export default Component.extend(
if (!hasButtonBool) {
tb.push({
attributes: { class: 'fa fa-pencil' },
command: cmdName
command: cmdName,
});
this.set('toolbar', tb);
}
@ -134,11 +134,11 @@ export default Component.extend(
search: el.search,
hash: el.hash,
port: el.port,
query
query,
};
}
},
},
{
isComponent: el => toLowerCase(el.tagName) === 'img'
isComponent: el => toLowerCase(el.tagName) === 'img',
}
);

6
src/dom_components/model/ComponentLabel.js

@ -9,10 +9,10 @@ export default Component.extend(
...Component.prototype.defaults,
type,
tagName: type,
traits: ['id', 'title', 'for']
}
traits: ['id', 'title', 'for'],
},
},
{
isComponent: el => toLowerCase(el.tagName) === type
isComponent: el => toLowerCase(el.tagName) === type,
}
);

27
src/dom_components/model/ComponentMap.js

@ -21,7 +21,7 @@ export default Component.extend(
label: 'Address',
name: 'address',
placeholder: 'eg. London, UK',
changeProp: 1
changeProp: 1,
},
{
type: 'select',
@ -30,8 +30,8 @@ export default Component.extend(
changeProp: 1,
options: [
{ value: 'q', name: 'Roadmap' },
{ value: 'w', name: 'Satellite' }
]
{ value: 'w', name: 'Satellite' },
],
},
{
label: 'Zoom',
@ -39,20 +39,16 @@ export default Component.extend(
type: 'range',
min: '1',
max: '20',
changeProp: 1
}
]
changeProp: 1,
},
],
},
initialize(o, opt) {
if (this.get('src')) this.parseFromSrc();
else this.updateSrc();
Component.prototype.initialize.apply(this, arguments);
this.listenTo(
this,
'change:address change:zoom change:mapType',
this.updateSrc
);
this.listenTo(this, 'change:address change:zoom change:mapType', this.updateSrc);
},
updateSrc() {
@ -88,7 +84,7 @@ export default Component.extend(
if (qr.q) this.set('address', qr.q);
if (qr.z) this.set('zoom', qr.z);
if (qr.t) this.set('mapType', qr.t);
}
},
},
{
/**
@ -101,13 +97,10 @@ export default Component.extend(
*/
isComponent(el) {
var result = '';
if (
toLowerCase(el.tagName) == 'iframe' &&
/maps\.google\.com/.test(el.src)
) {
if (toLowerCase(el.tagName) == 'iframe' && /maps\.google\.com/.test(el.src)) {
result = { type: 'map', src: el.src };
}
return result;
}
},
}
);

6
src/dom_components/model/ComponentScript.js

@ -11,8 +11,8 @@ export default Component.extend(
tagName: type,
droppable: false,
draggable: false,
layerable: false
}
layerable: false,
},
},
{
isComponent(el) {
@ -26,6 +26,6 @@ export default Component.extend(
return result;
}
}
},
}
);

6
src/dom_components/model/ComponentSvg.js

@ -10,7 +10,7 @@ export default Component.extend(
type,
tagName: type,
highlightable: 0,
resizable: { ratioDefault: 1 }
resizable: { ratioDefault: 1 },
},
getName() {
@ -18,9 +18,9 @@ export default Component.extend(
let customName = this.get('custom-name');
name = name.charAt(0).toUpperCase() + name.slice(1);
return customName || name;
}
},
},
{
isComponent: el => toLowerCase(el.tagName) === type
isComponent: el => toLowerCase(el.tagName) === type,
}
);

6
src/dom_components/model/ComponentSvgIn.js

@ -9,10 +9,10 @@ export default Component.extend(
...Component.prototype.defaults,
selectable: false,
hoverable: false,
layerable: false
}
layerable: false,
},
},
{
isComponent: (el, opts = {}) => !!opts.inSvg
isComponent: (el, opts = {}) => !!opts.inSvg,
}
);

6
src/dom_components/model/ComponentTable.js

@ -9,16 +9,16 @@ export default Component.extend(
...Component.prototype.defaults,
type,
tagName: type,
droppable: ['tbody', 'thead', 'tfoot']
droppable: ['tbody', 'thead', 'tfoot'],
},
initialize(o, opt) {
Component.prototype.initialize.apply(this, arguments);
const components = this.get('components');
!components.length && components.add({ type: 'tbody' });
}
},
},
{
isComponent: el => toLowerCase(el.tagName) === type
isComponent: el => toLowerCase(el.tagName) === type,
}
);

10
src/dom_components/model/ComponentTableBody.js

@ -12,7 +12,7 @@ export default Component.extend(
draggable: ['table'],
droppable: ['tr'],
columns: 1,
rows: 1
rows: 1,
},
initialize(o, opt) {
@ -32,22 +32,22 @@ export default Component.extend(
while (clm--) {
columnsToAdd.push({
type: 'cell',
classes: ['cell']
classes: ['cell'],
});
}
rowsToAdd.push({
type: 'row',
classes: ['row'],
components: columnsToAdd
components: columnsToAdd,
});
}
components.add(rowsToAdd);
}
}
},
},
{
isComponent: el => toLowerCase(el.tagName) === type
isComponent: el => toLowerCase(el.tagName) === type,
}
);

6
src/dom_components/model/ComponentTableCell.js

@ -7,10 +7,10 @@ export default Component.extend(
...Component.prototype.defaults,
type: 'cell',
tagName: 'td',
draggable: ['tr']
}
draggable: ['tr'],
},
},
{
isComponent: el => ['td', 'th'].indexOf(toLowerCase(el.tagName)) >= 0
isComponent: el => ['td', 'th'].indexOf(toLowerCase(el.tagName)) >= 0,
}
);

6
src/dom_components/model/ComponentTableFoot.js

@ -8,10 +8,10 @@ export default ComponentTableBody.extend(
defaults: {
...ComponentTableBody.prototype.defaults,
type,
tagName: type
}
tagName: type,
},
},
{
isComponent: el => toLowerCase(el.tagName) === type
isComponent: el => toLowerCase(el.tagName) === type,
}
);

6
src/dom_components/model/ComponentTableHead.js

@ -8,10 +8,10 @@ export default ComponentTableBody.extend(
defaults: {
...ComponentTableBody.prototype.defaults,
type,
tagName: type
}
tagName: type,
},
},
{
isComponent: el => toLowerCase(el.tagName) === type
isComponent: el => toLowerCase(el.tagName) === type,
}
);

6
src/dom_components/model/ComponentTableRow.js

@ -9,10 +9,10 @@ export default Component.extend(
...Component.prototype.defaults,
tagName,
draggable: ['thead', 'tbody', 'tfoot'],
droppable: ['th', 'td']
}
droppable: ['th', 'td'],
},
},
{
isComponent: el => toLowerCase(el.tagName) === tagName
isComponent: el => toLowerCase(el.tagName) === tagName,
}
);

8
src/dom_components/model/ComponentTextNode.js

@ -9,14 +9,14 @@ export default Component.extend(
droppable: false,
layerable: false,
selectable: false,
editable: true
editable: true,
},
toHTML() {
const parent = this.parent();
const cnt = this.get('content');
return parent && parent.is('script') ? cnt : escape(cnt);
}
},
},
{
isComponent(el) {
@ -24,10 +24,10 @@ export default Component.extend(
if (el.nodeType === 3) {
result = {
type: 'textnode',
content: el.textContent
content: el.textContent,
};
}
return result;
}
},
}
);

41
src/dom_components/model/ComponentVideo.js

@ -28,7 +28,7 @@ export default Component.extend(
rel: 1, // YT related videos
modestbranding: 0, // YT modest branding
sources: [],
attributes: { allowfullscreen: 'allowfullscreen' }
attributes: { allowfullscreen: 'allowfullscreen' },
},
initialize(o, opt) {
@ -153,8 +153,8 @@ export default Component.extend(
{ value: 'so', name: 'HTML5 Source' },
{ value: yt, name: 'Youtube' },
{ value: ytnc, name: 'Youtube (no cookie)' },
{ value: vi, name: 'Vimeo' }
]
{ value: vi, name: 'Vimeo' },
],
};
},
@ -170,17 +170,17 @@ export default Component.extend(
label: 'Source',
name: 'src',
placeholder: 'eg. ./media/video.mp4',
changeProp: 1
changeProp: 1,
},
{
label: 'Poster',
name: 'poster',
placeholder: 'eg. ./media/image.jpg'
placeholder: 'eg. ./media/image.jpg',
// changeProp: 1
},
this.getAutoplayTrait(),
this.getLoopTrait(),
this.getControlsTrait()
this.getControlsTrait(),
];
},
/**
@ -195,7 +195,7 @@ export default Component.extend(
label: 'Video ID',
name: 'videoId',
placeholder: 'eg. jNQXAC9IVRw',
changeProp: 1
changeProp: 1,
},
this.getAutoplayTrait(),
this.getLoopTrait(),
@ -204,14 +204,14 @@ export default Component.extend(
type: 'checkbox',
label: 'Related',
name: 'rel',
changeProp: 1
changeProp: 1,
},
{
type: 'checkbox',
label: 'Modest',
name: 'modestbranding',
changeProp: 1
}
changeProp: 1,
},
];
},
@ -227,16 +227,16 @@ export default Component.extend(
label: 'Video ID',
name: 'videoId',
placeholder: 'eg. 123456789',
changeProp: 1
changeProp: 1,
},
{
label: 'Color',
name: 'color',
placeholder: 'eg. FF0000',
changeProp: 1
changeProp: 1,
},
this.getAutoplayTrait(),
this.getLoopTrait()
this.getLoopTrait(),
];
},
@ -250,7 +250,7 @@ export default Component.extend(
type: 'checkbox',
label: 'Autoplay',
name: 'autoplay',
changeProp: 1
changeProp: 1,
};
},
@ -264,7 +264,7 @@ export default Component.extend(
type: 'checkbox',
label: 'Loop',
name: 'loop',
changeProp: 1
changeProp: 1,
};
},
@ -278,7 +278,7 @@ export default Component.extend(
type: 'checkbox',
label: 'Controls',
name: 'controls',
changeProp: 1
changeProp: 1,
};
},
@ -327,7 +327,7 @@ export default Component.extend(
url += !this.get('controls') ? '&title=0&portrait=0&badge=0' : '';
url += this.get('color') ? '&color=' + this.get('color') : '';
return url;
}
},
},
{
/**
@ -345,10 +345,7 @@ export default Component.extend(
const isYtncProv = /youtube-nocookie\.com\/embed/.test(src);
const isViProv = /player\.vimeo\.com\/video/.test(src);
const isExtProv = isYtProv || isYtncProv || isViProv;
if (
toLowerCase(tagName) == type ||
(toLowerCase(tagName) == 'iframe' && isExtProv)
) {
if (toLowerCase(tagName) == type || (toLowerCase(tagName) == 'iframe' && isExtProv)) {
result = { type: 'video' };
if (src) result.src = src;
if (isExtProv) {
@ -358,6 +355,6 @@ export default Component.extend(
}
}
return result;
}
},
}
);

2
src/dom_components/view/ComponentTableView.js

@ -1,5 +1,5 @@
import ComponentView from './ComponentView';
export default ComponentView.extend({
events: {}
events: {},
});

280
src/editor/model/Editor.ts

@ -5,44 +5,44 @@ import {
toArray,
keys,
bindAll,
} from "underscore";
import Backbone from "backbone";
import $ from "../../utils/cash-dom";
import Extender from "../../utils/extender";
import { getModel, hasWin, isEmptyObj } from "../../utils/mixins";
import { Model } from "../../common";
import Selected from "./Selected";
import FrameView from "../../canvas/view/FrameView";
import EditorModule from "..";
import EditorView from "../view/EditorView";
import { IModule } from "../../abstract/Module";
} from 'underscore';
import Backbone from 'backbone';
import $ from '../../utils/cash-dom';
import Extender from '../../utils/extender';
import { getModel, hasWin, isEmptyObj } from '../../utils/mixins';
import { Model } from '../../common';
import Selected from './Selected';
import FrameView from '../../canvas/view/FrameView';
import EditorModule from '..';
import EditorView from '../view/EditorView';
import { IModule } from '../../abstract/Module';
//@ts-ignore
Backbone.$ = $;
const deps = [
require("utils"),
require("i18n"),
require("keymaps"),
require("undo_manager"),
require("storage_manager"),
require("device_manager"),
require("parser"),
require("style_manager"),
require("selector_manager"),
require("modal_dialog"),
require("code_manager"),
require("panels"),
require("rich_text_editor"),
require("asset_manager"),
require("css_composer"),
require("pages"),
require("trait_manager"),
require("dom_components"),
require("navigator"),
require("canvas"),
require("commands"),
require("block_manager"),
require('utils'),
require('i18n'),
require('keymaps'),
require('undo_manager'),
require('storage_manager'),
require('device_manager'),
require('parser'),
require('style_manager'),
require('selector_manager'),
require('modal_dialog'),
require('code_manager'),
require('panels'),
require('rich_text_editor'),
require('asset_manager'),
require('css_composer'),
require('pages'),
require('trait_manager'),
require('dom_components'),
require('navigator'),
require('canvas'),
require('commands'),
require('block_manager'),
];
const ts_deps: any[] = [];
@ -74,7 +74,7 @@ export default class EditorModel extends Model {
modules: [],
toLoad: [],
opened: {},
device: "",
device: '',
};
}
@ -88,38 +88,38 @@ export default class EditorModel extends Model {
view?: EditorView;
get storables(): any[] {
return this.get("storables");
return this.get('storables');
}
get modules(): IModule[] {
return this.get("modules");
return this.get('modules');
}
get toLoad(): any[] {
return this.get("toLoad");
return this.get('toLoad');
}
get selected(): Selected {
return this.get("selected");
return this.get('selected');
}
get shallow(): EditorModel {
return this.get("shallow");
return this.get('shallow');
}
constructor(conf = {}) {
super();
this._config = conf;
const { config } = this;
this.set("Config", conf);
this.set("modules", []);
this.set("toLoad", []);
this.set("storables", []);
this.set("selected", new Selected());
this.set("dmode", config.dragMode);
this.set('Config', conf);
this.set('modules', []);
this.set('toLoad', []);
this.set('storables', []);
this.set('selected', new Selected());
this.set('dmode', config.dragMode);
const { el, log } = config;
const toLog = log === true ? keys(logs) : isArray(log) ? log : [];
bindAll(this, "initBaseColorPicker");
bindAll(this, 'initBaseColorPicker');
if (el && config.fromElement) {
config.components = el.innerHTML;
@ -130,7 +130,7 @@ export default class EditorModel extends Model {
res[next.nodeName] = next.nodeValue;
return res;
}, {})
: "";
: '';
// Move components to pages
if (config.components && !config.pageManager) {
@ -140,13 +140,13 @@ export default class EditorModel extends Model {
// Load modules
deps.forEach((name) => this.loadModule(name));
ts_deps.forEach((name) => this.tsLoadModule(name));
this.on("change:componentHovered", this.componentHovered, this);
this.on("change:changesCount", this.updateChanges, this);
this.on("change:readyLoad change:readyCanvas", this._checkReady, this);
this.on('change:componentHovered', this.componentHovered, this);
this.on('change:changesCount', this.updateChanges, this);
this.on('change:readyLoad change:readyCanvas', this._checkReady, this);
toLog.forEach((e) => this.listenLog(e));
// Deprecations
[{ from: "change:selectedComponent", to: "component:toggled" }].forEach(
[{ from: 'change:selectedComponent', to: 'component:toggled' }].forEach(
(event) => {
const eventFrom = event.from;
const eventTo = event.to;
@ -162,11 +162,11 @@ export default class EditorModel extends Model {
_checkReady() {
if (
this.get("readyLoad") &&
this.get("readyCanvas") &&
!this.get("ready")
this.get('readyLoad') &&
this.get('readyCanvas') &&
!this.get('ready')
) {
this.set("ready", true);
this.set('ready', true);
}
}
@ -200,7 +200,7 @@ export default class EditorModel extends Model {
*/
loadOnStart() {
const { projectData, headless } = this.config;
const sm = this.get("StorageManager");
const sm = this.get('StorageManager');
// In `onLoad`, the module will try to load the data from its configurations.
this.toLoad.forEach((mdl) => mdl.onLoad());
@ -208,7 +208,7 @@ export default class EditorModel extends Model {
// Stuff to do post load
const postLoad = () => {
this.modules.forEach((mdl) => mdl.postLoad && mdl.postLoad(this));
this.set("readyLoad", 1);
this.set('readyLoad', 1);
};
if (headless) {
@ -238,8 +238,8 @@ export default class EditorModel extends Model {
undoManager: false,
});
// We only need to load a few modules
["PageManager", "Canvas"].forEach((key) => shallow.get(key).onLoad());
this.set("shallow", shallow);
['PageManager', 'Canvas'].forEach((key) => shallow.get(key).onLoad());
this.set('shallow', shallow);
}
/**
@ -248,11 +248,11 @@ export default class EditorModel extends Model {
* @private
*/
updateChanges() {
const stm = this.get("StorageManager");
const stm = this.get('StorageManager');
const changes = this.getDirtyCount();
this.updateItr && clearTimeout(this.updateItr);
//@ts-ignore
this.updateItr = setTimeout(() => this.trigger("update"));
this.updateItr = setTimeout(() => this.trigger('update'));
if (this.config.noticeOnUnload) {
window.onbeforeunload = changes ? () => true : null;
@ -278,7 +278,7 @@ export default class EditorModel extends Model {
? config[name]
: config[Mod.name];
const cfg = cfgParent === true ? {} : cfgParent || {};
cfg.pStylePrefix = config.pStylePrefix || "";
cfg.pStylePrefix = config.pStylePrefix || '';
if (!isUndefined(cfgParent) && !cfgParent) {
cfg._disable = 1;
@ -329,11 +329,11 @@ export default class EditorModel extends Model {
this.initialize(opts);
this.destroyed = false;
}
this.set("Editor", editor);
this.set('Editor', editor);
}
getEditor() {
return this.get("Editor");
return this.get('Editor');
}
/**
@ -351,7 +351,7 @@ export default class EditorModel extends Model {
opt.temporary ||
opt.noCount ||
opt.avoidStore ||
!this.get("ready")
!this.get('ready')
) {
return;
}
@ -361,7 +361,7 @@ export default class EditorModel extends Model {
this.timedInterval = setTimeout(() => {
const curr = this.getDirtyCount() || 0;
const { unset, ...opts } = opt;
this.set("changesCount", curr + 1, opts);
this.set('changesCount', curr + 1, opts);
}, 0);
}
@ -377,9 +377,9 @@ export default class EditorModel extends Model {
* @private
* */
componentHovered(editor: any, component: any, options: any) {
const prev = this.previous("componentHovered");
prev && this.trigger("component:unhovered", prev, options);
component && this.trigger("component:hovered", component, options);
const prev = this.previous('componentHovered');
prev && this.trigger('component:unhovered', prev, options);
component && this.trigger('component:hovered', component, options);
}
/**
@ -424,13 +424,13 @@ export default class EditorModel extends Model {
let model = getModel(el, undefined);
if (model) {
this.trigger("component:select:before", model, opts);
this.trigger('component:select:before', model, opts);
// Check for valid selectable
if (!model.get("selectable") || opts.abort) {
if (!model.get('selectable') || opts.abort) {
if (opts.useValid) {
let parent = model.parent();
while (parent && !parent.get("selectable"))
while (parent && !parent.get('selectable'))
parent = parent.parent();
model = parent;
} else {
@ -443,7 +443,7 @@ export default class EditorModel extends Model {
if (ctrlKey && mltSel) {
return this.toggleSelected(model);
} else if (shiftKey && mltSel) {
this.clearSelection(this.get("Canvas").getWindow());
this.clearSelection(this.get('Canvas').getWindow());
const coll = model.collection;
const index = model.index();
let min: number | undefined, max: number | undefined;
@ -497,11 +497,11 @@ export default class EditorModel extends Model {
const models = isArray(model) ? model : [model];
models.forEach((model) => {
if (model && !model.get("selectable")) return;
if (model && !model.get('selectable')) return;
const { selected } = this;
opts.forceChange && this.removeSelected(model, opts);
selected.addComponent(model, opts);
model && this.trigger("component:select", model, opts);
model && this.trigger('component:select', model, opts);
});
}
@ -541,21 +541,21 @@ export default class EditorModel extends Model {
* @private
*/
setHovered(el: any, opts: any = {}) {
if (!el) return this.set("componentHovered", "");
if (!el) return this.set('componentHovered', '');
const ev = "component:hover";
const ev = 'component:hover';
let model = getModel(el, undefined);
if (!model) return;
opts.forceChange && this.set("componentHovered", "");
opts.forceChange && this.set('componentHovered', '');
this.trigger(`${ev}:before`, model, opts);
// Check for valid hoverable
if (!model.get("hoverable")) {
if (!model.get('hoverable')) {
if (opts.useValid && !opts.abort) {
let parent = model && model.parent();
while (parent && !parent.get("hoverable")) parent = parent.parent();
while (parent && !parent.get('hoverable')) parent = parent.parent();
model = parent;
} else {
return;
@ -563,13 +563,13 @@ export default class EditorModel extends Model {
}
if (!opts.abort) {
this.set("componentHovered", model, opts);
this.set('componentHovered', model, opts);
this.trigger(ev, model, opts);
}
}
getHovered() {
return this.get("componentHovered");
return this.get('componentHovered');
}
/**
@ -580,7 +580,7 @@ export default class EditorModel extends Model {
* @public
*/
setComponents(components: any, opt = {}) {
return this.get("DomComponents").setComponents(components, opt);
return this.get('DomComponents').setComponents(components, opt);
}
/**
@ -589,13 +589,13 @@ export default class EditorModel extends Model {
* @private
*/
getComponents() {
var cmp = this.get("DomComponents");
var cm = this.get("CodeManager");
var cmp = this.get('DomComponents');
var cm = this.get('CodeManager');
if (!cmp || !cm) return;
var wrp = cmp.getComponents();
return cm.getCode(wrp, "json");
return cm.getCode(wrp, 'json');
}
/**
@ -606,7 +606,7 @@ export default class EditorModel extends Model {
* @public
*/
setStyle(style: any, opt = {}) {
const cssc = this.get("CssComposer");
const cssc = this.get('CssComposer');
cssc.clear(opt);
cssc.getAll().add(style, opt);
return this;
@ -629,7 +629,7 @@ export default class EditorModel extends Model {
* @private
*/
getStyle() {
return this.get("CssComposer").getAll();
return this.get('CssComposer').getAll();
}
/**
@ -638,7 +638,7 @@ export default class EditorModel extends Model {
* @returns {this}
*/
setState(value: string) {
this.set("state", value);
this.set('state', value);
return this;
}
@ -647,7 +647,7 @@ export default class EditorModel extends Model {
* @returns {String}
*/
getState() {
return this.get("state") || "";
return this.get('state') || '';
}
/**
@ -659,15 +659,15 @@ export default class EditorModel extends Model {
getHtml(opts: any = {}) {
const { config } = this;
const { optsHtml } = config;
const js = config.jsInHtml ? this.getJs(opts) : "";
const cmp = opts.component || this.get("DomComponents").getComponent();
const js = config.jsInHtml ? this.getJs(opts) : '';
const cmp = opts.component || this.get('DomComponents').getComponent();
let html = cmp
? this.get("CodeManager").getCode(cmp, "html", {
? this.get('CodeManager').getCode(cmp, 'html', {
...optsHtml,
...opts,
})
: "";
html += js ? `<script>${js}</script>` : "";
: '';
html += js ? `<script>${js}</script>` : '';
return html;
}
@ -684,18 +684,18 @@ export default class EditorModel extends Model {
const keepUnusedStyles = !isUndefined(opts.keepUnusedStyles)
? opts.keepUnusedStyles
: config.keepUnusedStyles;
const cssc = this.get("CssComposer");
const wrp = opts.component || this.get("DomComponents").getComponent();
const protCss = !avoidProt ? config.protectedCss : "";
const cssc = this.get('CssComposer');
const wrp = opts.component || this.get('DomComponents').getComponent();
const protCss = !avoidProt ? config.protectedCss : '';
const css =
wrp &&
this.get("CodeManager").getCode(wrp, "css", {
this.get('CodeManager').getCode(wrp, 'css', {
cssc,
keepUnusedStyles,
...optsCss,
...opts,
});
return wrp ? (opts.json ? css : protCss + css) : "";
return wrp ? (opts.json ? css : protCss + css) : '';
}
/**
@ -704,8 +704,8 @@ export default class EditorModel extends Model {
* @public
*/
getJs(opts: any = {}) {
var wrp = opts.component || this.get("DomComponents").getWrapper();
return wrp ? this.get("CodeManager").getCode(wrp, "js").trim() : "";
var wrp = opts.component || this.get('DomComponents').getWrapper();
return wrp ? this.get('CodeManager').getCode(wrp, 'js').trim() : '';
}
/**
@ -714,7 +714,7 @@ export default class EditorModel extends Model {
*/
async store(options?: any) {
const data = this.storeData();
await this.get("StorageManager").store(data, options);
await this.get('StorageManager').store(data, options);
this.clearDirtyCount();
return data;
}
@ -724,7 +724,7 @@ export default class EditorModel extends Model {
* @public
*/
async load(options?: any) {
const result = await this.get("StorageManager").load(options);
const result = await this.get('StorageManager').load(options);
this.loadData(result);
return result;
}
@ -733,7 +733,7 @@ export default class EditorModel extends Model {
let result = {};
// Sync content if there is an active RTE
const editingCmp = this.getEditing();
editingCmp && editingCmp.trigger("sync:content", { noCount: true });
editingCmp && editingCmp.trigger('sync:content', { noCount: true });
this.storables.forEach((m) => {
result = { ...result, ...m.store(1) };
@ -755,8 +755,8 @@ export default class EditorModel extends Model {
* @private
*/
getDeviceModel() {
var name = this.get("device");
return this.get("DeviceManager").get(name);
var name = this.get('device');
return this.get('DeviceManager').get(name);
}
/**
@ -765,7 +765,7 @@ export default class EditorModel extends Model {
* @private
*/
runDefault(opts = {}) {
var command = this.get("Commands").get(this.config.defaultCommand);
var command = this.get('Commands').get(this.config.defaultCommand);
if (!command || this.defaultRunning) return;
command.stop(this, this, opts);
command.run(this, this, opts);
@ -778,7 +778,7 @@ export default class EditorModel extends Model {
* @private
*/
stopDefault(opts = {}) {
const commands = this.get("Commands");
const commands = this.get('Commands');
const command = commands.get(this.config.defaultCommand);
if (!command || !this.defaultRunning) return;
command.stop(this, this, opts);
@ -790,9 +790,9 @@ export default class EditorModel extends Model {
* @public
*/
refreshCanvas(opts: any = {}) {
this.set("canvasOffset", null);
this.set("canvasOffset", this.get("Canvas").getOffset());
opts.tools && this.trigger("canvas:updateTools");
this.set('canvasOffset', null);
this.set('canvasOffset', this.get('Canvas').getOffset());
opts.tools && this.trigger('canvas:updateTools');
}
/**
@ -815,8 +815,8 @@ export default class EditorModel extends Model {
const device = this.getDeviceModel();
const condition = config.mediaCondition;
const preview = config.devicePreviewMode;
const width = device && device.get("widthMedia");
return device && width && !preview ? `(${condition}: ${width})` : "";
const width = device && device.get('widthMedia');
return device && width && !preview ? `(${condition}: ${width})` : '';
}
/**
@ -824,15 +824,15 @@ export default class EditorModel extends Model {
* @return {Component}
*/
getWrapper() {
return this.get("DomComponents").getWrapper();
return this.get('DomComponents').getWrapper();
}
setCurrentFrame(frameView: FrameView) {
return this.set("currentFrame", frameView);
return this.set('currentFrame', frameView);
}
getCurrentFrame(): FrameView {
return this.get("currentFrame");
return this.get('currentFrame');
}
getCurrentFrameModel() {
@ -841,7 +841,7 @@ export default class EditorModel extends Model {
getIcon(icon: string) {
const icons = this.config.icons || {};
return icons[icon] || "";
return icons[icon] || '';
}
/**
@ -850,27 +850,27 @@ export default class EditorModel extends Model {
* @return {number}
*/
getDirtyCount(): number {
return this.get("changesCount");
return this.get('changesCount');
}
clearDirtyCount() {
return this.set("changesCount", 0);
return this.set('changesCount', 0);
}
getZoomDecimal() {
return this.get("Canvas").getZoomDecimal();
return this.get('Canvas').getZoomDecimal();
}
getZoomMultiplier() {
return this.get("Canvas").getZoomMultiplier();
return this.get('Canvas').getZoomMultiplier();
}
setDragMode(value: string) {
return this.set("dmode", value);
return this.set('dmode', value);
}
t(...args: any[]) {
const i18n = this.get("I18n");
const i18n = this.get('I18n');
return i18n?.t(...args);
}
@ -879,7 +879,7 @@ export default class EditorModel extends Model {
* @returns {Boolean}
*/
inAbsoluteMode() {
return this.get("dmode") === "absolute";
return this.get('dmode') === 'absolute';
}
/**
@ -889,7 +889,7 @@ export default class EditorModel extends Model {
const { config, view } = this;
const editor = this.getEditor();
const { editors = [] } = config.grapesjs || {};
const shallow = this.get("shallow");
const shallow = this.get('shallow');
shallow?.destroyAll();
this.stopListening();
this.stopDefault();
@ -900,7 +900,7 @@ export default class EditorModel extends Model {
view && view.remove();
this.clear({ silent: true });
this.destroyed = true;
["_config", "view", "_previousAttributes", "_events", "_listeners"].forEach(
['_config', 'view', '_previousAttributes', '_events', '_listeners'].forEach(
//@ts-ignore
(i) => (this[i] = {})
);
@ -910,22 +910,22 @@ export default class EditorModel extends Model {
}
getEditing() {
const res = this.get("editing");
const res = this.get('editing');
return (res && res.model) || null;
}
setEditing(value: boolean) {
this.set("editing", value);
this.set('editing', value);
return this;
}
isEditing() {
return !!this.get("editing");
return !!this.get('editing');
}
log(msg: string, opts: any = {}) {
const { ns, level = "debug" } = opts;
this.trigger("log", msg, opts);
const { ns, level = 'debug' } = opts;
this.trigger('log', msg, opts);
level && this.trigger(`log:${level}`, msg, opts);
if (ns) {
@ -936,15 +936,15 @@ export default class EditorModel extends Model {
}
logInfo(msg: string, opts?: any) {
this.log(msg, { ...opts, level: "info" });
this.log(msg, { ...opts, level: 'info' });
}
logWarning(msg: string, opts?: any) {
this.log(msg, { ...opts, level: "warning" });
this.log(msg, { ...opts, level: 'warning' });
}
logError(msg: string, opts?: any) {
this.log(msg, { ...opts, level: "error" });
this.log(msg, { ...opts, level: 'error' });
}
initBaseColorPicker(el: any, opts = {}) {
@ -956,13 +956,13 @@ export default class EditorModel extends Model {
//@ts-ignore
return $(el).spectrum({
containerClassName: `${ppfx}one-bg ${ppfx}two-color`,
appendTo: elToAppend || "body",
appendTo: elToAppend || 'body',
maxSelectionSize: 8,
showPalette: true,
palette: [],
showAlpha: true,
chooseText: "Ok",
cancelText: "⨯",
chooseText: 'Ok',
cancelText: '⨯',
...opts,
...colorPicker,
});
@ -975,7 +975,7 @@ export default class EditorModel extends Model {
*/
skip(clb: Function) {
this.__skip = true;
const um = this.get("UndoManager");
const um = this.get('UndoManager');
um ? um.skip(clb) : clb();
this.__skip = false;
}
@ -989,7 +989,7 @@ export default class EditorModel extends Model {
* @private
*/
data(el: any, name: string, value: any) {
const varName = "_gjs-data";
const varName = '_gjs-data';
if (!el[varName]) {
el[varName] = {};

60
src/i18n/locale/ca.js

@ -5,7 +5,7 @@ export default {
addButton: 'Afegir imatge',
inputPlh: 'http://ruta/a/la/imatge.jpg',
modalTitle: 'Escollir imatge',
uploadTitle: 'Arrossega els fitxers aquí o fes clic per a pujar-ne'
uploadTitle: 'Arrossega els fitxers aquí o fes clic per a pujar-ne',
},
// Here just as a reference, GrapesJS core doesn't contain any block,
// so this should be omitted from other local files
@ -15,7 +15,7 @@ export default {
},
categories: {
// 'category-id': 'Category Label',
}
},
},
domComponents: {
names: {
@ -33,8 +33,8 @@ export default {
thead: 'Capçalera de la taula',
table: 'Taula',
row: 'Fila de la taula',
cell: 'Cel·la de la taula'
}
cell: 'Cel·la de la taula',
},
},
deviceManager: {
device: 'Dispositius',
@ -42,8 +42,8 @@ export default {
desktop: 'Escriptori',
tablet: 'Tauleta',
mobileLandscape: 'Mòbil en horitzontal',
mobilePortrait: 'Mòbil en vertical'
}
mobilePortrait: 'Mòbil en vertical',
},
},
panels: {
buttons: {
@ -52,12 +52,12 @@ export default {
fullscreen: 'Pantalla sencera',
'sw-visibility': 'Veure components',
'export-template': 'Veure codi',
'open-sm': 'Obrir Administrador d\'estils',
'open-sm': "Obrir Administrador d'estils",
'open-tm': 'Configuració',
'open-layers': 'Obrir Aministrador de capes',
'open-blocks': 'Obrir Blocs'
}
}
'open-blocks': 'Obrir Blocs',
},
},
},
selectorManager: {
label: 'Classes',
@ -66,11 +66,11 @@ export default {
states: {
hover: 'A sobre',
active: 'Clic',
'nth-of-type(2n)': 'Parell/Senar'
}
'nth-of-type(2n)': 'Parell/Senar',
},
},
styleManager: {
empty: 'Escull un element abans d\'utilitzar l\'Administrador d\'estils',
empty: "Escull un element abans d'utilitzar l'Administrador d'estils",
layer: 'Capa',
fileButton: 'Imatges',
sectors: {
@ -80,7 +80,7 @@ export default {
decorations: 'Decoracions',
extra: 'Extres',
flex: 'Flex',
dimension: 'Tamany'
dimension: 'Tamany',
},
// The core library generates the name by their `property` name
properties: {
@ -115,8 +115,8 @@ export default {
'text-shadow': 'Ombra del text',
'text-shadow-h': 'Ombra del text: horizontal',
'text-shadow-v': 'Ombra del text: vertical',
'text-shadow-blur': 'Desenfocament de l\'ombra del text',
'text-shadow-color': 'Color de l\'ombra del text',
'text-shadow-blur': "Desenfocament de l'ombra del text",
'text-shadow-color': "Color de l'ombra del text",
'border-top-left': 'Marc superior esquerra',
'border-top-right': 'Marc superior dret',
'border-bottom-left': 'Marc inferior esquerra',
@ -133,10 +133,10 @@ export default {
'box-shadow': 'Ombra de la capsa',
'box-shadow-h': 'Ombra de la capsa: horizontal',
'box-shadow-v': 'Ombra de la capsa: vertical',
'box-shadow-blur': 'Desenfocament de l\'ombra de la capsa',
'box-shadow-spread': 'Propagació de l\'ombra de la capsa',
'box-shadow-color': 'Color de l\'ombra de la capsa',
'box-shadow-type': 'Tipus de l\'ombra de la capsa',
'box-shadow-blur': "Desenfocament de l'ombra de la capsa",
'box-shadow-spread': "Propagació de l'ombra de la capsa",
'box-shadow-color': "Color de l'ombra de la capsa",
'box-shadow-type': "Tipus de l'ombra de la capsa",
background: 'Fons',
'background-image': 'Imatge de fons',
'background-repeat': 'Repetir fons',
@ -165,11 +165,11 @@ export default {
'flex-grow': 'Creixement flex',
'flex-shrink': 'Contracció flex',
'align-self': 'Alineació pròpia',
'background-color': 'Color de fons'
}
'background-color': 'Color de fons',
},
},
traitManager: {
empty: 'Escull un element abans d\'usar l\'Administrador de característiques',
empty: "Escull un element abans d'usar l'Administrador de característiques",
label: 'Configuració de components',
traits: {
// The core library generates the name by their `name` property
@ -177,22 +177,22 @@ export default {
id: 'Identificador',
alt: 'Títol alternatiu',
title: 'Títol',
href: 'Enllaç'
href: 'Enllaç',
},
// In a simple trait, like text input, these are used on input attributes
attributes: {
id: traitInputAttr,
alt: traitInputAttr,
title: traitInputAttr,
href: { placeholder: 'ex. https://google.com' }
href: { placeholder: 'ex. https://google.com' },
},
// In a trait like select, these are used to translate option names
options: {
target: {
false: 'Mateixa pestanya/finestra',
_blank: 'Nova pestanya/finestra'
}
}
}
}
_blank: 'Nova pestanya/finestra',
},
},
},
},
};

38
src/i18n/locale/el.js

@ -5,7 +5,7 @@ export default {
addButton: 'Προσθήκη Εικόνας',
inputPlh: 'http://διαδρομή/μέχρι/την/εικόνα.jpg',
modalTitle: 'Επιλογή Εικόνας',
uploadTitle: 'Αφήστε τα αρχεία εδώ ή κάντε κλικ για ανέβασμα'
uploadTitle: 'Αφήστε τα αρχεία εδώ ή κάντε κλικ για ανέβασμα',
},
// Εδώ υπάρχει απλά αναφορά, ο πυρήνας του GrapesJS δεν διαθέτει κανένα πλαίσιο,
// οπότε αυτό θα πρέπει να αγνοηθεί από τα υπόλοιπα αρχεία μετάφρασης
@ -15,7 +15,7 @@ export default {
},
categories: {
// 'category-id': 'Ετικέτα Κατηγορίας',
}
},
},
domComponents: {
names: {
@ -33,8 +33,8 @@ export default {
thead: 'Κεφαλίδα πίνακα',
table: 'Πίνακας',
row: 'Γραμμή πίνακα',
cell: 'Κελί πίνακα'
}
cell: 'Κελί πίνακα',
},
},
deviceManager: {
device: 'Συσκευή',
@ -42,8 +42,8 @@ export default {
desktop: 'Σθαθερός Υπολογιστής',
tablet: 'Τάμπλετ',
mobileLandscape: 'Κινητό Οριζόντια',
mobilePortrait: 'Κινητό Κάθετα'
}
mobilePortrait: 'Κινητό Κάθετα',
},
},
panels: {
buttons: {
@ -55,9 +55,9 @@ export default {
'open-sm': 'Άνοιγμα Του Διαχειριστή Μορφοποίησης',
'open-tm': 'Ρυθμίσεις',
'open-layers': 'Άνοιγμα Του Διαχειριστή Επιπέδων',
'open-blocks': 'Άνοιγμα Πλαισίων'
}
}
'open-blocks': 'Άνοιγμα Πλαισίων',
},
},
},
selectorManager: {
label: 'Κλάσεις',
@ -66,8 +66,8 @@ export default {
states: {
hover: 'Αιώρηση',
active: 'Κλικ',
'nth-of-type(2n)': 'Μονές/Ζυγές'
}
'nth-of-type(2n)': 'Μονές/Ζυγές',
},
},
styleManager: {
empty: 'Επιλέξτε ένα στοιχεία πριν χρησιμοποιήσετε τον διαχειριστή μορφοποίησης',
@ -80,12 +80,12 @@ export default {
decorations: 'Μορφοποίηση',
extra: 'Επιπρόσθετα',
flex: 'Φλεξ',
dimension: 'Διάσταση'
dimension: 'Διάσταση',
},
// Η βασική βιβλιοθήκη παράγει το όνομα από την δικού του `ιδιότητα` name
properties: {
// float: 'Float',
}
},
},
traitManager: {
empty: 'Επιλέξτε ένα στοιχεία πριν χρησιμοποιήσετε τον Διαχειριστή Χαρακτηριστικών',
@ -103,15 +103,15 @@ export default {
id: traitInputAttr,
alt: traitInputAttr,
title: traitInputAttr,
href: { placeholder: 'πχ. https://google.gr' }
href: { placeholder: 'πχ. https://google.gr' },
},
// Σε χαρακτηριστικό όπως το select, αυτά χρησιμοποιούνται για την μετάφραση των ονομάτων των επιλογών
options: {
target: {
false: 'Στο ίδιο παράθυρο',
_blank: 'Σε νέο παράθυρο'
}
}
}
}
_blank: 'Σε νέο παράθυρο',
},
},
},
},
};

42
src/i18n/locale/es.js

@ -5,7 +5,7 @@ export default {
addButton: 'Añadir imagen',
inputPlh: 'http://camino/a/la/imagen.jpg',
modalTitle: 'Seleccionar imagen',
uploadTitle: 'Arrastre los archivos aquí o haga clic para cargar'
uploadTitle: 'Arrastre los archivos aquí o haga clic para cargar',
},
// Here just as a reference, GrapesJS core doesn't contain any block,
// so this should be omitted from other local files
@ -15,7 +15,7 @@ export default {
},
categories: {
// 'category-id': 'Category Label',
}
},
},
domComponents: {
names: {
@ -33,8 +33,8 @@ export default {
thead: 'Encabezado de lista',
table: 'Lista',
row: 'Fila de lista',
cell: 'Celda de lista'
}
cell: 'Celda de lista',
},
},
deviceManager: {
device: 'Dispositivos',
@ -42,8 +42,8 @@ export default {
desktop: 'Escritorio',
tablet: 'Tableta',
mobileLandscape: 'Mobile Landscape',
mobilePortrait: 'Mobile Portrait'
}
mobilePortrait: 'Mobile Portrait',
},
},
panels: {
buttons: {
@ -55,9 +55,9 @@ export default {
'open-sm': 'Abrir Administrador de estilos',
'open-tm': 'Ajustes',
'open-layers': 'Abrir Aministrador de capas',
'open-blocks': 'Abrir Bloques'
}
}
'open-blocks': 'Abrir Bloques',
},
},
},
selectorManager: {
label: 'Clases',
@ -66,8 +66,8 @@ export default {
states: {
hover: 'Hover',
active: 'Click',
'nth-of-type(2n)': 'Par/Impar'
}
'nth-of-type(2n)': 'Par/Impar',
},
},
styleManager: {
empty: 'Seleccione un elemento antes de usar el Administrador de estilos',
@ -80,7 +80,7 @@ export default {
decorations: 'Decoraciones',
extra: 'Extras',
flex: 'Flex',
dimension: 'Dimensión'
dimension: 'Dimensión',
},
// The core library generates the name by their `property` name
properties: {
@ -165,8 +165,8 @@ export default {
'flex-grow': 'Crecimiento Flex',
'flex-shrink': 'Contracción Flex',
'align-self': 'Alinearse',
'background-color': 'Color de fondo'
}
'background-color': 'Color de fondo',
},
},
traitManager: {
empty: 'Seleccione un elemento antes de usar el Administrador de rasgos',
@ -177,22 +177,22 @@ export default {
id: 'Identificador',
alt: 'Título alterno',
title: 'Título',
href: 'Vínculo'
href: 'Vínculo',
},
// In a simple trait, like text input, these are used on input attributes
attributes: {
id: traitInputAttr,
alt: traitInputAttr,
title: traitInputAttr,
href: { placeholder: 'ej. https://google.com' }
href: { placeholder: 'ej. https://google.com' },
},
// In a trait like select, these are used to translate option names
options: {
target: {
false: 'Esta ventana',
_blank: 'Nueva ventana'
}
}
}
}
_blank: 'Nueva ventana',
},
},
},
},
};

38
src/i18n/locale/fa.js

@ -5,7 +5,7 @@ export default {
addButton: 'افزودن تصویر',
inputPlh: 'http://path/to/the/image.jpg',
modalTitle: 'انتخاب تصویر',
uploadTitle: 'فایل را انتخاب کنید یا در این مکان رها کنید'
uploadTitle: 'فایل را انتخاب کنید یا در این مکان رها کنید',
},
// Here just as a reference, GrapesJS core doesn't contain any block,
// so this should be omitted from other local files
@ -15,7 +15,7 @@ export default {
},
categories: {
// 'category-id': 'Category Label',
}
},
},
domComponents: {
names: {
@ -33,8 +33,8 @@ export default {
thead: 'سر جدول',
table: 'جدول',
row: 'ردیف جدول',
cell: 'سلول جدول'
}
cell: 'سلول جدول',
},
},
deviceManager: {
device: 'دستگاه',
@ -42,8 +42,8 @@ export default {
desktop: 'دسک تاپ',
tablet: 'تبلت',
mobileLandscape: 'موبایل خوابیده',
mobilePortrait: 'موبایل ایستاده'
}
mobilePortrait: 'موبایل ایستاده',
},
},
panels: {
buttons: {
@ -55,9 +55,9 @@ export default {
'open-sm': 'باز کردن مدیریت استایل',
'open-tm': 'تنظیمات',
'open-layers': 'باز کردن مدیریت لایه‌ها',
'open-blocks': 'باز کردن مدیریت بلوک‌ها'
}
}
'open-blocks': 'باز کردن مدیریت بلوک‌ها',
},
},
},
selectorManager: {
label: 'کلاس‌ها',
@ -66,8 +66,8 @@ export default {
states: {
hover: 'هاور',
active: 'کلیک',
'nth-of-type(2n)': 'زوج/فرد'
}
'nth-of-type(2n)': 'زوج/فرد',
},
},
styleManager: {
empty: 'قبل از استفاده از مدیریت استایل یک عنصر را انتخاب کنید',
@ -80,7 +80,7 @@ export default {
decorations: 'تزئینات',
extra: 'اضافی',
flex: 'فلکس',
dimension: 'ابعاد'
dimension: 'ابعاد',
},
// The core library generates the name by their `property` name
properties: {
@ -102,16 +102,16 @@ export default {
id: traitInputAttr,
alt: traitInputAttr,
title: traitInputAttr,
href: { placeholder: 'مثال: https://google.com' }
href: { placeholder: 'مثال: https://google.com' },
},
// In a trait like select, these are used to translate option names
options: {
target: {
false: 'پنجره فعلی',
_blank: 'پنجره جدید'
}
}
}
}
}
_blank: 'پنجره جدید',
},
},
},
},
},
};

38
src/i18n/locale/it.js

@ -5,7 +5,7 @@ export default {
addButton: 'Aggiungi immagine',
inputPlh: 'http://percorso/immagine.jpg',
modalTitle: 'Seleziona immagine',
uploadTitle: 'Trascina qui i tuoi file o clicca per caricarli'
uploadTitle: 'Trascina qui i tuoi file o clicca per caricarli',
},
domComponents: {
names: {
@ -23,8 +23,8 @@ export default {
thead: 'Tabella testa',
table: 'Tabella',
row: 'Tabella riga',
cell: 'Tabella colonna'
}
cell: 'Tabella colonna',
},
},
deviceManager: {
device: 'Dispositivo',
@ -32,8 +32,8 @@ export default {
desktop: 'Desktop',
tablet: 'Tablet',
mobileLandscape: 'Mobile panoramica',
mobilePortrait: 'Mobile'
}
mobilePortrait: 'Mobile',
},
},
panels: {
buttons: {
@ -45,9 +45,9 @@ export default {
'open-sm': 'Mostra Style Manager',
'open-tm': 'Configurazioni',
'open-layers': 'Mostra Livelli',
'open-blocks': 'Mostra Blocchi'
}
}
'open-blocks': 'Mostra Blocchi',
},
},
},
selectorManager: {
label: 'Classi',
@ -56,8 +56,8 @@ export default {
states: {
hover: 'Hover',
active: 'Click',
'nth-of-type(2n)': 'Pari/Dispari'
}
'nth-of-type(2n)': 'Pari/Dispari',
},
},
styleManager: {
empty: 'Seleziona un elemento prima di usare il Style Manager',
@ -70,12 +70,12 @@ export default {
decorations: 'Decorazioni',
extra: 'Extra',
flex: 'Flex',
dimension: 'Dimensioni'
dimension: 'Dimensioni',
},
// The core library generates the name by their `property` name
properties: {
// float: 'Float',
}
},
},
traitManager: {
empty: 'Seleziona un elemento prima di usare il Trait Manager',
@ -84,20 +84,20 @@ export default {
labels: {
id: 'Id',
alt: 'Alt',
title: 'Titolo'
title: 'Titolo',
},
attributes: {
id: traitInputAttr,
alt: traitInputAttr,
title: traitInputAttr,
href: { placeholder: 'es. https://google.com' }
href: { placeholder: 'es. https://google.com' },
},
options: {
target: {
false: 'Questa finestra',
_blank: 'Nuova finestra'
}
}
}
}
_blank: 'Nuova finestra',
},
},
},
},
};

234
src/i18n/locale/ko.js

@ -1,117 +1,117 @@
const traitInputAttr = { placeholder: 'eg. 텍스트 입력' };
export default {
assetManager: {
addButton: '이미지 추가',
inputPlh: 'http://path/to/the/image.jpg',
modalTitle: '이미지 선택',
uploadTitle: '원하는 파일을 여기에 놓거나 업로드를 위해 클릭'
},
// Here just as a reference, GrapesJS core doesn't contain any block,
// so this should be omitted from other local files
blockManager: {
labels: {
// 'block-id': 'Block Label',
},
categories: {
// 'category-id': 'Category Label',
}
},
domComponents: {
names: {
'': '상자',
wrapper: 'Body',
text: '텍스트',
comment: 'Comment',
image: '이미지',
video: '동영상',
label: 'Label',
link: '링크',
map: '지도',
tfoot: 'Table foot',
tbody: 'Table body',
thead: 'Table head',
table: 'Table',
row: 'Table row',
cell: 'Table cell'
}
},
deviceManager: {
device: 'Device',
devices: {
desktop: '데스크탑',
tablet: '태블릿',
mobileLandscape: '모바일 환경',
mobilePortrait: '모바일 Portrait'
}
},
panels: {
buttons: {
titles: {
preview: '미리보기',
fullscreen: '전체화면',
'sw-visibility': 'components 보기',
'export-template': '코드 보기',
'open-sm': 'Style Manager 열기',
'open-tm': '설정',
'open-layers': 'Layer Manager 열기',
'open-blocks': 'Blocks 열기'
}
}
},
selectorManager: {
label: 'Classes',
selected: '선택된',
emptyState: '- 상태 -',
states: {
hover: 'Hover',
active: 'Click',
'nth-of-type(2n)': '짝수/홀수'
}
},
styleManager: {
empty: 'Style Manager 사용하려면, 먼저 element를 선택해주세요',
layer: '레이어',
fileButton: 'Images',
sectors: {
general: '기본설정',
layout: '레이아웃',
typography: '글꼴',
decorations: '꾸미기',
extra: 'Extra',
flex: 'Flex',
dimension: '크기 및 위치'
},
// The core library generates the name by their `property` name
properties: {
// float: 'Float',
}
},
traitManager: {
empty: 'Trait Manager 사용하려면, 먼저 element를 선택해주세요',
label: 'Component 설정',
traits: {
// The core library generates the name by their `name` property
labels: {
// id: 'Id',
// alt: 'Alt',
// title: 'Title',
// href: 'Href',
},
// In a simple trait, like text input, these are used on input attributes
attributes: {
id: traitInputAttr,
alt: traitInputAttr,
title: traitInputAttr,
href: { placeholder: 'eg. https://google.com' }
},
// In a trait like select, these are used to translate option names
options: {
target: {
false: '현재 창',
_blank: '새 창'
}
}
}
}
};
const traitInputAttr = { placeholder: 'eg. 텍스트 입력' };
export default {
assetManager: {
addButton: '이미지 추가',
inputPlh: 'http://path/to/the/image.jpg',
modalTitle: '이미지 선택',
uploadTitle: '원하는 파일을 여기에 놓거나 업로드를 위해 클릭',
},
// Here just as a reference, GrapesJS core doesn't contain any block,
// so this should be omitted from other local files
blockManager: {
labels: {
// 'block-id': 'Block Label',
},
categories: {
// 'category-id': 'Category Label',
},
},
domComponents: {
names: {
'': '상자',
wrapper: 'Body',
text: '텍스트',
comment: 'Comment',
image: '이미지',
video: '동영상',
label: 'Label',
link: '링크',
map: '지도',
tfoot: 'Table foot',
tbody: 'Table body',
thead: 'Table head',
table: 'Table',
row: 'Table row',
cell: 'Table cell',
},
},
deviceManager: {
device: 'Device',
devices: {
desktop: '데스크탑',
tablet: '태블릿',
mobileLandscape: '모바일 환경',
mobilePortrait: '모바일 Portrait',
},
},
panels: {
buttons: {
titles: {
preview: '미리보기',
fullscreen: '전체화면',
'sw-visibility': 'components 보기',
'export-template': '코드 보기',
'open-sm': 'Style Manager 열기',
'open-tm': '설정',
'open-layers': 'Layer Manager 열기',
'open-blocks': 'Blocks 열기',
},
},
},
selectorManager: {
label: 'Classes',
selected: '선택된',
emptyState: '- 상태 -',
states: {
hover: 'Hover',
active: 'Click',
'nth-of-type(2n)': '짝수/홀수',
},
},
styleManager: {
empty: 'Style Manager 사용하려면, 먼저 element를 선택해주세요',
layer: '레이어',
fileButton: 'Images',
sectors: {
general: '기본설정',
layout: '레이아웃',
typography: '글꼴',
decorations: '꾸미기',
extra: 'Extra',
flex: 'Flex',
dimension: '크기 및 위치',
},
// The core library generates the name by their `property` name
properties: {
// float: 'Float',
},
},
traitManager: {
empty: 'Trait Manager 사용하려면, 먼저 element를 선택해주세요',
label: 'Component 설정',
traits: {
// The core library generates the name by their `name` property
labels: {
// id: 'Id',
// alt: 'Alt',
// title: 'Title',
// href: 'Href',
},
// In a simple trait, like text input, these are used on input attributes
attributes: {
id: traitInputAttr,
alt: traitInputAttr,
title: traitInputAttr,
href: { placeholder: 'eg. https://google.com' },
},
// In a trait like select, these are used to translate option names
options: {
target: {
false: '현재 창',
_blank: '새 창',
},
},
},
},
};

42
src/i18n/locale/nl.js

@ -5,7 +5,7 @@ export default {
addButton: 'Afbeelding toevoegen',
inputPlh: 'http://path/to/the/image.jpg',
modalTitle: 'Selecteer afbeelding',
uploadTitle: 'Zet bestanden hier neer of klik om te uploaden'
uploadTitle: 'Zet bestanden hier neer of klik om te uploaden',
},
// Here just as a reference, GrapesJS core doesn't contain any block,
// so this should be omitted from other local files
@ -15,7 +15,7 @@ export default {
},
categories: {
// 'category-id': 'Categorie Label',
}
},
},
domComponents: {
names: {
@ -33,8 +33,8 @@ export default {
thead: 'Tabel head',
table: 'Tabel',
row: 'Tabel rij',
cell: 'Tabel cel'
}
cell: 'Tabel cel',
},
},
deviceManager: {
device: 'Apparaat',
@ -42,8 +42,8 @@ export default {
desktop: 'Desktop',
tablet: 'Tablet',
mobileLandscape: 'Mobile Landscape',
mobilePortrait: 'Mobile Portrait'
}
mobilePortrait: 'Mobile Portrait',
},
},
panels: {
buttons: {
@ -55,9 +55,9 @@ export default {
'open-sm': 'Open Stijl Manager',
'open-tm': 'Instellingen',
'open-layers': 'Open Laag Manager',
'open-blocks': 'Open Blocks'
}
}
'open-blocks': 'Open Blocks',
},
},
},
selectorManager: {
label: 'Classes',
@ -66,8 +66,8 @@ export default {
states: {
hover: 'Zweven',
active: 'Klik',
'nth-of-type(2n)': 'Even/oneven'
}
'nth-of-type(2n)': 'Even/oneven',
},
},
styleManager: {
empty: 'Selecteer een element voordat je Stijl Manager kan gebruiken.',
@ -80,7 +80,7 @@ export default {
decorations: 'Decoraties',
extra: 'Extra',
flex: 'Flex',
dimension: 'Afmetingen'
dimension: 'Afmetingen',
},
// The core library generates the name by their `property` name
properties: {
@ -165,8 +165,8 @@ export default {
'flex-basis': 'Flex basis',
'flex-grow': 'Flex groei',
'flex-shrink': 'Flex krimp',
'align-self': 'Lijn jezelf uit'
}
'align-self': 'Lijn jezelf uit',
},
},
traitManager: {
empty: 'Selecteer een element voordat je Trait Manager kan gebruiken.',
@ -177,22 +177,22 @@ export default {
id: 'ID',
alt: 'Tekst alternatief',
title: 'Titel',
href: 'Link'
href: 'Link',
},
// In a simple trait, like text input, these are used on input attributes
attributes: {
id: traitInputAttr,
alt: traitInputAttr,
title: traitInputAttr,
href: { placeholder: 'Bijv. https://google.com' }
href: { placeholder: 'Bijv. https://google.com' },
},
// In a trait like select, these are used to translate option names
options: {
target: {
false: 'Dit scherm',
_blank: 'Nieuw scherm'
}
}
}
}
_blank: 'Nieuw scherm',
},
},
},
},
};

42
src/i18n/locale/pl.js

@ -5,7 +5,7 @@ export default {
addButton: 'Dodaj obrazek',
inputPlh: 'http://path/to/the/image.jpg',
modalTitle: 'Wybierz obrazek',
uploadTitle: 'Wybierz lub przeciągnij plik z dysku'
uploadTitle: 'Wybierz lub przeciągnij plik z dysku',
},
// Here just as a reference, GrapesJS core doesn't contain any block,
// so this should be omitted from other local files
@ -15,7 +15,7 @@ export default {
},
categories: {
// 'category-id': 'Category Label',
}
},
},
domComponents: {
names: {
@ -33,8 +33,8 @@ export default {
thead: 'Nagłówek tabeli',
table: 'Tabela',
row: 'Wiersz',
cell: 'Komórka'
}
cell: 'Komórka',
},
},
deviceManager: {
device: 'Urządzenie',
@ -42,8 +42,8 @@ export default {
desktop: 'Desktop',
tablet: 'Tablet',
mobileLandscape: 'Telefon Poziomo',
mobilePortrait: 'Telefon Pionowo'
}
mobilePortrait: 'Telefon Pionowo',
},
},
panels: {
buttons: {
@ -55,9 +55,9 @@ export default {
'open-sm': 'Edytuj style i atrybuty CSS',
'open-tm': 'Ustawienia elementu',
'open-layers': 'Warstwy szablonu',
'open-blocks': 'Komponenty'
}
}
'open-blocks': 'Komponenty',
},
},
},
selectorManager: {
label: 'Klasy CSS',
@ -66,8 +66,8 @@ export default {
states: {
hover: 'Hover',
active: 'Click',
'nth-of-type(2n)': 'Tylko parzyste'
}
'nth-of-type(2n)': 'Tylko parzyste',
},
},
styleManager: {
empty: 'Wybierz element aby edytować jego atrybuty',
@ -80,7 +80,7 @@ export default {
decorations: 'Dekoracje',
extra: 'Dodatki',
flex: 'Flex',
dimension: 'Wymiary'
dimension: 'Wymiary',
},
// The core library generates the name by their `property` name
properties: {
@ -153,8 +153,8 @@ export default {
'transform-rotate-z': 'Obrót osi Z',
'transform-scale-x': 'Skala osi X',
'transform-scale-y': 'Skala osi Y',
'transform-scale-z': 'Skala osi Z'
}
'transform-scale-z': 'Skala osi Z',
},
},
traitManager: {
empty: 'Wybierz element aby edytować jego ustawienia',
@ -166,22 +166,22 @@ export default {
alt: 'Tekst alternatywny',
title: 'Tytuł',
href: 'Adres odnośnika',
target: 'Cel'
target: 'Cel',
},
// In a simple trait, like text input, these are used on input attributes
attributes: {
id: traitInputAttr,
alt: traitInputAttr,
title: traitInputAttr,
href: { placeholder: 'np. https://google.com' }
href: { placeholder: 'np. https://google.com' },
},
// In a trait like select, these are used to translate option names
options: {
target: {
false: 'Te okno',
_blank: 'Nowe okno'
}
}
}
}
_blank: 'Nowe okno',
},
},
},
},
};

392
src/i18n/locale/pt.js

@ -1,200 +1,200 @@
const traitInputAttr = { placeholder: 'ex: Insira o texto' };
export default {
assetManager: {
addButton: 'Adicionar imagem',
inputPlh: 'http://caminho/para/a/imagem.jpg',
modalTitle: 'Selecionar imagem',
uploadTitle: 'Solte os arquivos aqui ou clique para enviar'
},
// Here just as a reference, GrapesJS core doesn't contain any block,
// so this should be omitted from other local files
blockManager: {
labels: {
// 'block-id': 'Block Label',
},
categories: {
// 'category-id': 'Category Label',
}
},
domComponents: {
names: {
'': 'Box',
wrapper: 'Corpo',
text: 'Texto',
comment: 'Comentário',
image: 'Imagem',
video: 'Vídeo',
label: 'Label',
link: 'Link',
map: 'Mapa',
tfoot: 'Rodapé da tabela',
tbody: 'Corpo da tabela',
thead: 'Cabeçalho da tabela',
table: 'Tabela',
row: 'Linha da tabela',
cell: 'Célula da tabela',
section: 'Seção',
body: 'Corpo'
}
},
deviceManager: {
device: 'Dispositivo',
devices: {
desktop: 'Desktop',
tablet: 'Tablet',
mobileLandscape: 'Celular, modo panorâmico',
mobilePortrait: 'Celular, modo retrato'
}
},
panels: {
buttons: {
titles: {
preview: 'Pré-visualização',
fullscreen: 'Tela cheia',
'sw-visibility': 'Ver componentes',
'export-template': 'Ver código',
'open-sm': 'Abrir gerenciador de estilos',
'open-tm': 'Configurações',
'open-layers': 'Abrir gerenciador de camadas',
'open-blocks': 'Abrir blocos'
}
}
},
selectorManager: {
label: 'Classes',
selected: 'Selecionado',
emptyState: '- Estado -',
states: {
hover: 'Hover',
active: 'Click',
'nth-of-type(2n)': 'Even/Odd'
}
},
styleManager: {
empty: 'Selecione um elemento para usar o gerenciador de estilos',
layer: 'Camada',
fileButton: 'Imagens',
sectors: {
general: 'Geral',
layout: 'Disposição',
typography: 'Tipografia',
decorations: 'Decorações',
extra: 'Extra',
flex: 'Flex',
dimension: 'Dimensão'
},
// The core library generates the name by their `property` name
properties: {
float: 'Float',
display: 'Exibição',
position: 'Posição',
top: 'Topo',
right: 'Direita',
left: 'Esquerda',
bottom: 'Inferior',
width: 'Largura',
height: 'Altura',
'max-width': 'Largura Max.',
'max-height': 'Altura Max.',
margin: 'Margem',
'margin-top': 'Margem Superior',
'margin-right': 'Margem a Direita',
'margin-left': 'Margem a Esquerda',
'margin-bottom': 'Margem Inferior',
padding: 'Padding',
'padding-top': 'Padding Superior',
'padding-left': 'Padding a Esquerda',
'padding-right': 'Padding a Direita',
'padding-bottom': 'Padding Inferior',
'font-family': 'Tipo de letra',
'font-size': 'Tamanho da fonte',
'font-weight': 'Espessura da fonte',
'letter-spacing': 'Espaço entre letras',
color: 'Cor',
'line-height': 'Altura da linha',
'text-align': 'Alinhamento do texto',
'text-shadow': 'Sombra do texto',
'text-shadow-h': 'Sombra do texto: horizontal',
'text-shadow-v': 'Sombra do texto: vertical',
'text-shadow-blur': 'Desfoque da sombra do texto',
'text-shadow-color': 'Cor da sombra da fonte',
'border-top-left': 'Borda superior a esquerda',
'border-top-right': 'Borda superior a direita',
'border-bottom-left': 'Borda inferior a esquerda',
'border-bottom-right': 'Borda inferior a direita',
'border-radius-top-left': 'Raio da borda superior esquerda',
'border-radius-top-right': 'Raio da borda superior direita',
'border-radius-bottom-left': 'Raio da borda inferior esquerda',
'border-radius-bottom-right': 'Raio da borda inferior direita',
'border-radius': 'Raio da borda',
border: 'Borda',
'border-width': 'Largura da borda',
'border-style': 'Estilo da borda',
'border-color': 'Cor da borda',
'box-shadow': 'Sombra da box',
'box-shadow-h': 'Sombra da box: horizontal',
'box-shadow-v': 'Sombra da box: vertical',
'box-shadow-blur': 'Desfoque da sombra da box',
'box-shadow-spread': 'Extensão da sombra da box',
'box-shadow-color': 'Cor da sombra da box',
'box-shadow-type': 'Tipo de sombra da box',
background: 'Fundo',
'background-color': 'Cor de fundo',
'background-image': 'Imagem de fundo',
'background-repeat': 'Repetir fundo',
'background-position': 'Posição do fundo',
'background-attachment': 'Plugin de fundo',
'background-size': 'Tamanho do fundo',
transition: 'Transição',
'transition-property': 'Tipo de transição',
'transition-duration': 'Tempo de transição',
'transition-timing-function': 'Função do tempo da transição',
perspective: 'Perspectiva',
transform: 'Transformação',
'transform-rotate-x': 'Rotacionar horizontalmente',
'transform-rotate-y': 'Rotacionar verticalmente',
'transform-rotate-z': 'Rotacionar profundidade',
'transform-scale-x': 'Escalar horizontalmente',
'transform-scale-y': 'Escalar verticalmente',
'transform-scale-z': 'Escalar profundidade',
'flex-direction': 'Direção Flex',
'flex-wrap': 'Flex wrap',
'justify-content': 'Ajustar conteúdo',
'align-items': 'Alinhar elementos',
'align-content': 'Alinhar conteúdo',
order: 'Ordem',
'flex-basis': 'Base Flex',
'flex-grow': 'Crescimento Flex',
'flex-shrink': 'Contração Flex',
'align-self': 'Alinhar-se',
}
},
traitManager: {
empty: 'Selecione um elemento para usar o gerenciador de características',
label: 'Configurações do componente',
traits: {
// The core library generates the name by their `name` property
labels: {
// id: 'Id',
// alt: 'Alt',
// title: 'Title',
// href: 'Href',
},
// In a simple trait, like text input, these are used on input attributes
attributes: {
id: traitInputAttr,
alt: traitInputAttr,
title: traitInputAttr,
href: { placeholder: 'ex: https://google.com' }
},
// In a trait like select, these are used to translate option names
options: {
target: {
false: 'Esta janela',
_blank: 'Nova janela'
}
}
}
}
assetManager: {
addButton: 'Adicionar imagem',
inputPlh: 'http://caminho/para/a/imagem.jpg',
modalTitle: 'Selecionar imagem',
uploadTitle: 'Solte os arquivos aqui ou clique para enviar',
},
// Here just as a reference, GrapesJS core doesn't contain any block,
// so this should be omitted from other local files
blockManager: {
labels: {
// 'block-id': 'Block Label',
},
categories: {
// 'category-id': 'Category Label',
},
},
domComponents: {
names: {
'': 'Box',
wrapper: 'Corpo',
text: 'Texto',
comment: 'Comentário',
image: 'Imagem',
video: 'Vídeo',
label: 'Label',
link: 'Link',
map: 'Mapa',
tfoot: 'Rodapé da tabela',
tbody: 'Corpo da tabela',
thead: 'Cabeçalho da tabela',
table: 'Tabela',
row: 'Linha da tabela',
cell: 'Célula da tabela',
section: 'Seção',
body: 'Corpo',
},
},
deviceManager: {
device: 'Dispositivo',
devices: {
desktop: 'Desktop',
tablet: 'Tablet',
mobileLandscape: 'Celular, modo panorâmico',
mobilePortrait: 'Celular, modo retrato',
},
},
panels: {
buttons: {
titles: {
preview: 'Pré-visualização',
fullscreen: 'Tela cheia',
'sw-visibility': 'Ver componentes',
'export-template': 'Ver código',
'open-sm': 'Abrir gerenciador de estilos',
'open-tm': 'Configurações',
'open-layers': 'Abrir gerenciador de camadas',
'open-blocks': 'Abrir blocos',
},
},
},
selectorManager: {
label: 'Classes',
selected: 'Selecionado',
emptyState: '- Estado -',
states: {
hover: 'Hover',
active: 'Click',
'nth-of-type(2n)': 'Even/Odd',
},
},
styleManager: {
empty: 'Selecione um elemento para usar o gerenciador de estilos',
layer: 'Camada',
fileButton: 'Imagens',
sectors: {
general: 'Geral',
layout: 'Disposição',
typography: 'Tipografia',
decorations: 'Decorações',
extra: 'Extra',
flex: 'Flex',
dimension: 'Dimensão',
},
// The core library generates the name by their `property` name
properties: {
float: 'Float',
display: 'Exibição',
position: 'Posição',
top: 'Topo',
right: 'Direita',
left: 'Esquerda',
bottom: 'Inferior',
width: 'Largura',
height: 'Altura',
'max-width': 'Largura Max.',
'max-height': 'Altura Max.',
margin: 'Margem',
'margin-top': 'Margem Superior',
'margin-right': 'Margem a Direita',
'margin-left': 'Margem a Esquerda',
'margin-bottom': 'Margem Inferior',
padding: 'Padding',
'padding-top': 'Padding Superior',
'padding-left': 'Padding a Esquerda',
'padding-right': 'Padding a Direita',
'padding-bottom': 'Padding Inferior',
'font-family': 'Tipo de letra',
'font-size': 'Tamanho da fonte',
'font-weight': 'Espessura da fonte',
'letter-spacing': 'Espaço entre letras',
color: 'Cor',
'line-height': 'Altura da linha',
'text-align': 'Alinhamento do texto',
'text-shadow': 'Sombra do texto',
'text-shadow-h': 'Sombra do texto: horizontal',
'text-shadow-v': 'Sombra do texto: vertical',
'text-shadow-blur': 'Desfoque da sombra do texto',
'text-shadow-color': 'Cor da sombra da fonte',
'border-top-left': 'Borda superior a esquerda',
'border-top-right': 'Borda superior a direita',
'border-bottom-left': 'Borda inferior a esquerda',
'border-bottom-right': 'Borda inferior a direita',
'border-radius-top-left': 'Raio da borda superior esquerda',
'border-radius-top-right': 'Raio da borda superior direita',
'border-radius-bottom-left': 'Raio da borda inferior esquerda',
'border-radius-bottom-right': 'Raio da borda inferior direita',
'border-radius': 'Raio da borda',
border: 'Borda',
'border-width': 'Largura da borda',
'border-style': 'Estilo da borda',
'border-color': 'Cor da borda',
'box-shadow': 'Sombra da box',
'box-shadow-h': 'Sombra da box: horizontal',
'box-shadow-v': 'Sombra da box: vertical',
'box-shadow-blur': 'Desfoque da sombra da box',
'box-shadow-spread': 'Extensão da sombra da box',
'box-shadow-color': 'Cor da sombra da box',
'box-shadow-type': 'Tipo de sombra da box',
background: 'Fundo',
'background-color': 'Cor de fundo',
'background-image': 'Imagem de fundo',
'background-repeat': 'Repetir fundo',
'background-position': 'Posição do fundo',
'background-attachment': 'Plugin de fundo',
'background-size': 'Tamanho do fundo',
transition: 'Transição',
'transition-property': 'Tipo de transição',
'transition-duration': 'Tempo de transição',
'transition-timing-function': 'Função do tempo da transição',
perspective: 'Perspectiva',
transform: 'Transformação',
'transform-rotate-x': 'Rotacionar horizontalmente',
'transform-rotate-y': 'Rotacionar verticalmente',
'transform-rotate-z': 'Rotacionar profundidade',
'transform-scale-x': 'Escalar horizontalmente',
'transform-scale-y': 'Escalar verticalmente',
'transform-scale-z': 'Escalar profundidade',
'flex-direction': 'Direção Flex',
'flex-wrap': 'Flex wrap',
'justify-content': 'Ajustar conteúdo',
'align-items': 'Alinhar elementos',
'align-content': 'Alinhar conteúdo',
order: 'Ordem',
'flex-basis': 'Base Flex',
'flex-grow': 'Crescimento Flex',
'flex-shrink': 'Contração Flex',
'align-self': 'Alinhar-se',
},
},
traitManager: {
empty: 'Selecione um elemento para usar o gerenciador de características',
label: 'Configurações do componente',
traits: {
// The core library generates the name by their `name` property
labels: {
// id: 'Id',
// alt: 'Alt',
// title: 'Title',
// href: 'Href',
},
// In a simple trait, like text input, these are used on input attributes
attributes: {
id: traitInputAttr,
alt: traitInputAttr,
title: traitInputAttr,
href: { placeholder: 'ex: https://google.com' },
},
// In a trait like select, these are used to translate option names
options: {
target: {
false: 'Esta janela',
_blank: 'Nova janela',
},
},
},
},
};

26
src/i18n/locale/tr.js

@ -2,7 +2,7 @@ export default {
assetManager: {
addButton: 'Görsel Ekle',
modalTitle: 'Görsel Seçin',
uploadTitle: 'Dosya yüklemek için buraya sürükleyin veya tıklayın'
uploadTitle: 'Dosya yüklemek için buraya sürükleyin veya tıklayın',
},
deviceManager: {
device: 'Cihaz',
@ -10,8 +10,8 @@ export default {
desktop: 'Masaüstü',
tablet: 'Tablet',
mobileLandscape: 'Mobil Yatay',
mobilePortrait: 'Mobil Dikey'
}
mobilePortrait: 'Mobil Dikey',
},
},
panels: {
buttons: {
@ -23,14 +23,14 @@ export default {
'open-sm': 'Stil Düzenleyiciyi Aç',
'open-tm': 'Ayarlar',
'open-layers': 'Katmanlar',
'open-blocks': 'Bloklar'
}
}
'open-blocks': 'Bloklar',
},
},
},
selectorManager: {
selected: 'Seçili',
emptyState: '- DURUM -',
label: 'Sınıflar'
label: 'Sınıflar',
},
styleManager: {
empty: 'Stilini düzenlemek istediğiniz öğeyi seçiniz',
@ -42,7 +42,7 @@ export default {
decorations: 'Dekorasyon',
extra: 'Ekstra',
flex: 'Flex',
dimension: 'Boyut'
dimension: 'Boyut',
},
properties: {
float: 'Kaydır',
@ -126,8 +126,8 @@ export default {
'flex-grow': 'Flex Büyüme',
'flex-shrink': 'Flex Küçülme',
'align-self': 'Kendini Hizala',
'background-color': 'Arkaplan Rengi'
}
'background-color': 'Arkaplan Rengi',
},
},
traitManager: {
empty: 'Özelliklerini düzenlemek istediğiniz öğeyi seçiniz',
@ -135,7 +135,7 @@ export default {
traits: {
labels: {},
attributes: {},
options: {}
}
}
options: {},
},
},
};

36
src/i18n/locale/zh.js

@ -5,7 +5,7 @@ export default {
addButton: '添加图片',
inputPlh: 'http://path/to/the/image.jpg',
modalTitle: '选择图片',
uploadTitle: '点击或者拖拽图片上传'
uploadTitle: '点击或者拖拽图片上传',
},
domComponents: {
names: {
@ -23,8 +23,8 @@ export default {
thead: '表头',
table: '表格',
row: '行',
cell: '单元格'
}
cell: '单元格',
},
},
deviceManager: {
device: '设备',
@ -32,8 +32,8 @@ export default {
desktop: '桌面',
tablet: '平板',
mobileLandscape: 'Mobile Landscape',
mobilePortrait: 'Mobile Portrait'
}
mobilePortrait: 'Mobile Portrait',
},
},
panels: {
buttons: {
@ -45,9 +45,9 @@ export default {
'open-sm': '打开样式管理器',
'open-tm': '设置',
'open-layers': '打开布局管理器',
'open-blocks': '打开块'
}
}
'open-blocks': '打开块',
},
},
},
selectorManager: {
label: 'Classes',
@ -56,8 +56,8 @@ export default {
states: {
hover: 'Hover',
active: 'Click',
'nth-of-type(2n)': 'Even/Odd'
}
'nth-of-type(2n)': 'Even/Odd',
},
},
styleManager: {
empty: '设置样式前选择请一个元素',
@ -70,12 +70,12 @@ export default {
decorations: '装饰',
extra: '扩展',
flex: '盒子模型',
dimension: '尺寸'
dimension: '尺寸',
},
// The core library generates the name by their `property` name
properties: {
// float: 'Float',
}
},
},
traitManager: {
empty: '用设置项前选择一个组件',
@ -86,15 +86,15 @@ export default {
id: traitInputAttr,
alt: traitInputAttr,
title: traitInputAttr,
href: { placeholder: 'eg. https://google.com' }
href: { placeholder: 'eg. https://google.com' },
},
// In a trait like select, these are used to translate option names
options: {
target: {
false: '本窗口',
_blank: '新窗口'
}
}
}
}
_blank: '新窗口',
},
},
},
},
};

2
src/modal_dialog/config/config.js

@ -19,5 +19,5 @@ export default {
* },
* },
*/
extend: {}
extend: {},
};

8
src/modal_dialog/index.js

@ -67,7 +67,7 @@ export default () => {
init(config = {}) {
c = {
...defaults,
...config
...config,
};
const em = c.em;
@ -99,7 +99,7 @@ export default () => {
attributes,
title: isString(titl) ? createText(titl) : titl,
content: isString(cnt) ? createText(cnt) : cnt.get ? cnt.get(0) : cnt,
close: () => this.close()
close: () => this.close(),
};
},
@ -269,7 +269,7 @@ export default () => {
modal = new View({
el,
model,
config: c
config: c,
});
return modal.render().$el;
},
@ -278,6 +278,6 @@ export default () => {
modal && modal.remove();
[c, model, modal].forEach(i => (i = {}));
this.em = {};
}
},
};
};

2
src/navigator/config/config.js

@ -70,5 +70,5 @@ export default {
* },
* },
*/
extend: {}
extend: {},
};

30
src/panels/config/config.js

@ -14,7 +14,7 @@ export default {
defaults: [
{
id: 'commands',
buttons: [{}]
buttons: [{}],
},
{
id: 'options',
@ -25,29 +25,29 @@ export default {
className: 'fa fa-square-o',
command: swv,
context: swv,
attributes: { title: 'View components' }
attributes: { title: 'View components' },
},
{
id: prv,
className: 'fa fa-eye',
command: prv,
context: prv,
attributes: { title: 'Preview' }
attributes: { title: 'Preview' },
},
{
id: ful,
className: 'fa fa-arrows-alt',
command: ful,
context: ful,
attributes: { title: 'Fullscreen' }
attributes: { title: 'Fullscreen' },
},
{
id: expt,
className: 'fa fa-code',
command: expt,
attributes: { title: 'View code' }
}
]
attributes: { title: 'View code' },
},
],
},
{
id: 'views',
@ -58,36 +58,36 @@ export default {
command: osm,
active: true,
togglable: 0,
attributes: { title: 'Open Style Manager' }
attributes: { title: 'Open Style Manager' },
},
{
id: otm,
className: 'fa fa-cog',
command: otm,
togglable: 0,
attributes: { title: 'Settings' }
attributes: { title: 'Settings' },
},
{
id: ola,
className: 'fa fa-bars',
command: ola,
togglable: 0,
attributes: { title: 'Open Layer Manager' }
attributes: { title: 'Open Layer Manager' },
},
{
id: obl,
className: 'fa fa-th-large',
command: obl,
togglable: 0,
attributes: { title: 'Open Blocks' }
}
]
}
attributes: { title: 'Open Blocks' },
},
],
},
],
// Editor model
em: null,
// Delay before show children buttons (in milliseconds)
delayBtnsShow: 300
delayBtnsShow: 300,
};

4
src/panels/index.js

@ -204,7 +204,7 @@ export default () => {
PanelsViewObj && PanelsViewObj.remove();
PanelsViewObj = new PanelsView({
collection: panels,
config: c
config: c,
});
return PanelsViewObj.render().el;
},
@ -240,6 +240,6 @@ export default () => {
[c, panels, PanelsViewObj].forEach(i => (i = {}));
},
Panel
Panel,
};
};

20
src/parser/model/BrowserParserCss.js

@ -11,7 +11,7 @@ const atRules = {
12: 'supports',
13: 'document',
14: 'font-feature-values',
15: 'viewport'
15: 'viewport',
};
const atRuleKeys = keys(atRules);
const singleAtRules = ['5', '6', '11', '15'];
@ -44,10 +44,7 @@ export const parseSelector = (str = '') => {
// class might be with state (eg. :hover), nothing else.
// Can also accept SINGLE ID selectors, eg. `#myid`, `#myid:hover`
// Composed are not valid: `#myid.some-class`, `#myid.some-class:hover`
if (
/^(\.{1}[\w\-]+)+(:{1,2}[\w\-()]+)?$/gi.test(sel) ||
/^(#{1}[\w\-]+){1}(:{1,2}[\w\-()]+)?$/gi.test(sel)
) {
if (/^(\.{1}[\w\-]+)+(:{1,2}[\w\-()]+)?$/gi.test(sel) || /^(#{1}[\w\-]+){1}(:{1,2}[\w\-()]+)?$/gi.test(sel)) {
var cls = sel.split('.').filter(Boolean);
result.push(cls);
} else {
@ -57,7 +54,7 @@ export const parseSelector = (str = '') => {
return {
result,
add
add,
};
};
@ -86,12 +83,7 @@ export const parseStyle = node => {
* @return {string}
*/
export const parseCondition = node => {
const condition =
node.conditionText ||
(node.media && node.media.mediaText) ||
node.name ||
node.selectorText ||
'';
const condition = node.conditionText || (node.media && node.media.mediaText) || node.name || node.selectorText || '';
return condition.trim();
};
@ -173,7 +165,7 @@ export const parseNode = el => {
// For each group of selectors
for (var k = 0, len3 = sels.length; k < len3; k++) {
const model = createNode(sels[k], style, {
atRule: atRules[type]
atRule: atRules[type],
});
result.push(model);
lastRule = model;
@ -189,7 +181,7 @@ export const parseNode = el => {
const model = {
selectors: [],
selectorsAdd: selsAddStr,
style
style,
};
singleAtRule && (model.singleAtRule = singleAtRule);
atRuleType && (model.atRuleType = atRuleType);

9
src/parser/model/ParserCss.js

@ -1,8 +1,5 @@
import { isString } from 'underscore';
import BrowserCssParser, {
parseSelector,
createNode
} from './BrowserParserCss';
import BrowserCssParser, { parseSelector, createNode } from './BrowserParserCss';
export default (config = {}) => ({
/**
@ -36,7 +33,7 @@ export default (config = {}) => ({
const selectorsAdd = selsParsed.add.join(', ');
const opts = {
atRule: node.atRule,
mediaText: node.params
mediaText: node.params,
};
if (classSets.length) {
@ -56,5 +53,5 @@ export default (config = {}) => ({
}
return node;
}
},
});

2
src/plugin_manager/config/config.js

@ -1,3 +1,3 @@
export default {
plugins: []
plugins: [],
};

2
src/plugin_manager/index.js

@ -52,6 +52,6 @@ export default config => {
*/
getAll() {
return plugins;
}
},
};
};

9
src/rich_text_editor/model/RichTextEditor.js

@ -61,7 +61,9 @@ const defActions = {
if (isValidTag(rte)) {
rte.exec('unlink');
} else {
rte.insertHTML(`<a href="" ${customElAttr}>${rte.selection()}</a>`, { select: true });
rte.insertHTML(`<a href="" ${customElAttr}>${rte.selection()}</a>`, {
select: true,
});
}
},
},
@ -74,7 +76,10 @@ const defActions = {
return rte?.selection() && isValidTag(rte, 'SPAN') ? btnState.DISABLED : btnState.INACTIVE;
},
result: rte => {
!isValidTag(rte, 'SPAN') && rte.insertHTML(`<span ${customElAttr}>${rte.selection()}</span>`, { select: true });
!isValidTag(rte, 'SPAN') &&
rte.insertHTML(`<span ${customElAttr}>${rte.selection()}</span>`, {
select: true,
});
},
},
};

26
src/style_manager/index.js

@ -371,7 +371,10 @@ export default () => {
targets = targets.map(t => this.getModelToStyle(t));
const state = em.getState();
const lastTarget = targets.slice().reverse()[0];
const lastTargetParents = this.getParentRules(lastTarget, { state, component });
const lastTargetParents = this.getParentRules(lastTarget, {
state,
component,
});
let stateTarget = this.__getStateTarget();
// Handle the creation and update of the state rule, if enabled.
@ -379,7 +382,12 @@ export default () => {
if (state && lastTarget?.getState?.()) {
const style = lastTarget.getStyle();
if (!stateTarget) {
stateTarget = cssc.getAll().add({ selectors: 'gjs-selected', style, shallow: true, important: true });
stateTarget = cssc.getAll().add({
selectors: 'gjs-selected',
style,
shallow: true,
important: true,
});
} else {
stateTarget.setStyle(style);
}
@ -389,7 +397,13 @@ export default () => {
}
});
this.model.set({ targets, lastTarget, lastTargetParents, stateTarget, component });
this.model.set({
targets,
lastTarget,
lastTargetParents,
stateTarget,
component,
});
this.__upProps(opts);
return targets;
@ -691,7 +705,11 @@ export default () => {
sectors.forEach(sector => {
const props = sector.getProperties();
props.forEach(prop => {
const isVisible = prop.__checkVisibility({ target: lastTarget, component, sectors });
const isVisible = prop.__checkVisibility({
target: lastTarget,
component,
sectors,
});
prop.set('visible', isVisible);
});
const sectorVisible = props.some(p => p.isVisible());

5
src/style_manager/model/PropertyComposite.js

@ -55,7 +55,10 @@ export default class PropertyComposite extends Property {
initialize(props = {}, opts = {}) {
Property.callParentInit(Property, this, props, opts);
const { em } = this;
const properties = new Properties(this.get('properties') || [], { em, parentProp: this });
const properties = new Properties(this.get('properties') || [], {
em,
parentProp: this,
});
this.set('properties', properties, { silent: 1 });
this.listenTo(properties, 'change', this.__upProperties);
Property.callInit(this, props, opts);

75
src/style_manager/model/PropertyFactory.js

@ -196,7 +196,15 @@ export default class PropertyFactory {
['background-color', { default: 'none' }, 'color'],
// File type
['background-image', { type: this.typeFile, functionName: 'url', default: 'none', full: true }],
[
'background-image',
{
type: this.typeFile,
functionName: 'url',
default: 'none',
full: true,
},
],
// Slider type
['opacity', { type: this.typeSlider, default: '1', min: 0, max: 1, step: 0.01 }],
@ -208,7 +216,15 @@ export default class PropertyFactory {
['justify-content', { default: 'flex-start', options: this.optsJustCont }, 'flex-wrap'],
['align-items', { default: 'stretch', options: this.optsFlexAlign }, 'flex-wrap'],
['align-content', { options: this.optsAlignCont }, 'align-items'],
['align-self', { default: 'auto', options: this.optsAlignSelf, requiresParent: requireFlex }, 'display'],
[
'align-self',
{
default: 'auto',
options: this.optsAlignSelf,
requiresParent: requireFlex,
},
'display',
],
['font-family', { default: 'Arial, Helvetica, sans-serif', options: this.optsFonts }, 'display'],
['font-weight', { default: '400', options: this.optsWeight }, 'display'],
['border-style', { default: 'solid', options: this.optsBorderStyle }, 'display'],
@ -264,10 +280,22 @@ export default class PropertyFactory {
'border-radius',
{
properties: this.__sub([
{ extend: 'border-top-left-radius', id: 'border-top-left-radius-sub' },
{ extend: 'border-top-right-radius', id: 'border-top-right-radius-sub' },
{ extend: 'border-bottom-right-radius', id: 'border-bottom-right-radius-sub' },
{ extend: 'border-bottom-left-radius', id: 'border-bottom-left-radius-sub' },
{
extend: 'border-top-left-radius',
id: 'border-top-left-radius-sub',
},
{
extend: 'border-top-right-radius',
id: 'border-top-right-radius-sub',
},
{
extend: 'border-bottom-right-radius',
id: 'border-bottom-right-radius-sub',
},
{
extend: 'border-bottom-left-radius',
id: 'border-bottom-left-radius-sub',
},
]),
},
'margin',
@ -281,7 +309,10 @@ export default class PropertyFactory {
properties: this.__sub([
{ extend: 'transition-property', id: 'transition-property-sub' },
{ extend: 'transition-duration', id: 'transition-duration-sub' },
{ extend: 'transition-timing-function', id: 'transition-timing-function-sub' },
{
extend: 'transition-timing-function',
id: 'transition-timing-function-sub',
},
]),
},
],
@ -336,7 +367,10 @@ export default class PropertyFactory {
{ extend: 'background-image', id: 'background-image-sub' },
{ extend: 'background-repeat', id: 'background-repeat-sub' },
{ extend: 'background-position', id: 'background-position-sub' },
{ extend: 'background-attachment', id: 'background-attachment-sub' },
{
extend: 'background-attachment',
id: 'background-attachment-sub',
},
{ extend: 'background-size', id: 'background-size-sub' },
]),
},
@ -371,11 +405,26 @@ export default class PropertyFactory {
{ id: 'scaleX', propValue: { units: [''], step: 0.01 } },
{ id: 'scaleY', propValue: { units: [''], step: 0.01 } },
{ id: 'scaleZ', propValue: { units: [''], step: 0.01 } },
{ id: 'rotateX', propValue: { units: this.unitsAngle, step: 1 } },
{ id: 'rotateY', propValue: { units: this.unitsAngle, step: 1 } },
{ id: 'rotateZ', propValue: { units: this.unitsAngle, step: 1 } },
{ id: 'translateX', propValue: { units: this.unitsSize, step: 1 } },
{ id: 'translateY', propValue: { units: this.unitsSize, step: 1 } },
{
id: 'rotateX',
propValue: { units: this.unitsAngle, step: 1 },
},
{
id: 'rotateY',
propValue: { units: this.unitsAngle, step: 1 },
},
{
id: 'rotateZ',
propValue: { units: this.unitsAngle, step: 1 },
},
{
id: 'translateX',
propValue: { units: this.unitsSize, step: 1 },
},
{
id: 'translateY',
propValue: { units: this.unitsSize, step: 1 },
},
],
onChange({ property, to }) {
if (to.value) {

8
src/style_manager/model/PropertyStack.js

@ -221,7 +221,13 @@ export default class PropertyStack extends PropertyComposite {
let style;
if (toStyle) {
style = toStyle(values, { join, joinLayers, name, layer, property: this });
style = toStyle(values, {
join,
joinLayers,
name,
layer,
property: this,
});
} else {
const result = this.getProperties().map(prop => {
const name = prop.getName();

12
src/style_manager/view/PropertyColorView.js

@ -3,7 +3,10 @@ import InputColor from '../../domain_abstract/ui/InputColor';
export default class PropertyColorView extends PropertyNumberView {
setValue(value) {
this.inputInst?.setValue(value, { fromTarget: 1, def: this.model.getDefaultValue() });
this.inputInst?.setValue(value, {
fromTarget: 1,
def: this.model.getDefaultValue(),
});
}
remove() {
@ -21,7 +24,12 @@ export default class PropertyColorView extends PropertyNumberView {
if (!this.inputInst) {
this.__handleChange = this.__handleChange.bind(this);
const { ppfx, model, em, el } = this;
const inputColor = new InputColor({ target: em, model, ppfx, onChange: this.__handleChange });
const inputColor = new InputColor({
target: em,
model,
ppfx,
onChange: this.__handleChange,
});
const input = inputColor.render();
el.querySelector(`.${ppfx}fields`).appendChild(input.el);
this.input = input.inputEl.get(0);

2
src/trait_manager/config/config.js

@ -6,5 +6,5 @@ export default {
appendTo: '',
// Default options for the target input
optionsTarget: [{ value: false }, { value: '_blank' }]
optionsTarget: [{ value: false }, { value: '_blank' }],
};

2
src/trait_manager/model/TraitFactory.js

@ -26,5 +26,5 @@ export default (config = {}) => ({
}
return objs;
}
},
});

4
src/utils/Sorter.js

@ -1137,7 +1137,9 @@ export default Backbone.View.extend({
const canRemove = !sameCollection || !sameIndex || isTextable;
if (canRemove) {
modelToDrop = srcModel.collection.remove(srcModel, { temporary: true });
modelToDrop = srcModel.collection.remove(srcModel, {
temporary: true,
});
if (sameCollection && index > srcIndex) {
opts.at = index - 1;
}

364
src/utils/cash-dom.js

@ -64,45 +64,49 @@ function cash(selector, context) {
}
/* PROTOTYPE */
var fn = (cash.fn = cash.prototype = Cash.prototype = {
constructor: cash,
__cash: true,
length: 0,
splice: splice // Ensures a cash collection gets printed as array-like in Chrome
}); // @require core/cash.js
var fn =
(cash.fn =
cash.prototype =
Cash.prototype =
{
constructor: cash,
__cash: true,
length: 0,
splice: splice, // Ensures a cash collection gets printed as array-like in Chrome
}); // @require core/cash.js
// @require core/variables.js
fn.get = function(index) {
fn.get = function (index) {
if (index === undefined) return slice.call(this);
return this[index < 0 ? index + this.length : index];
}; // @require core/cash.js
// @require ./get.js
fn.eq = function(index) {
fn.eq = function (index) {
return cash(this.get(index));
}; // @require core/cash.js
// @require ./eq.js
fn.first = function() {
fn.first = function () {
return this.eq(0);
}; // @require core/cash.js
// @require ./eq.js
fn.last = function() {
fn.last = function () {
return this.eq(-1);
}; // @require core/cash.js
// @require core/variables.js
fn.map = function(callback) {
fn.map = function (callback) {
return cash(
map.call(this, function(ele, i) {
map.call(this, function (ele, i) {
return callback.call(ele, i, ele);
})
);
}; // @require core/cash.js
// @require core/variables.js
fn.slice = function() {
fn.slice = function () {
return cash(slice.apply(this, arguments));
}; // @require ./cash.js
@ -111,7 +115,7 @@ var camelCaseRe = /(?:^\w|[A-Z]|\b\w)/g,
function camelCase(str) {
return str
.replace(camelCaseRe, function(letter, index) {
.replace(camelCaseRe, function (letter, index) {
return letter[!index ? 'toLowerCase' : 'toUpperCase']();
})
.replace(camelCaseWhitespaceRe, '');
@ -128,16 +132,16 @@ function each(arr, callback) {
cash.each = each; // @require core/cash.js
// @require core/each.js
fn.each = function(callback) {
each(this, function(ele, i) {
fn.each = function (callback) {
each(this, function (ele, i) {
return callback.call(ele, i, ele);
});
return this;
}; // @require core/cash.js
// @require collection/each.js
fn.removeProp = function(prop) {
return this.each(function(i, ele) {
fn.removeProp = function (prop) {
return this.each(function (i, ele) {
delete ele[prop];
});
}; // @require ./cash.js
@ -199,12 +203,12 @@ cash.isArray = isArray; // @require core/cash.js
// @require core/type_checking.js
// @require collection/each.js
fn.prop = function(prop, value) {
fn.prop = function (prop, value) {
if (!prop) return;
if (isString(prop)) {
if (arguments.length < 2) return this[0] && this[0][prop];
return this.each(function(i, ele) {
return this.each(function (i, ele) {
ele[prop] = value;
});
}
@ -219,14 +223,14 @@ fn.prop = function(prop, value) {
function getCompareFunction(selector) {
return isString(selector)
? function(i, ele) {
? function (i, ele) {
return matches(ele, selector);
}
: selector.__cash
? function(i, ele) {
? function (i, ele) {
return selector.is(ele);
}
: function(i, ele, selector) {
: function (i, ele, selector) {
return ele === selector;
};
} // @require core/cash.js
@ -235,13 +239,11 @@ function getCompareFunction(selector) {
// @require core/variables.js
// @require collection/get.js
fn.filter = function(selector) {
fn.filter = function (selector) {
if (!selector) return cash();
var comparator = isFunction(selector)
? selector
: getCompareFunction(selector);
var comparator = isFunction(selector) ? selector : getCompareFunction(selector);
return cash(
filter.call(this, function(ele, i) {
filter.call(this, function (ele, i) {
return comparator.call(ele, i, ele, selector);
})
);
@ -255,12 +257,12 @@ function getSplitValues(str) {
// @require core/get_split_values.js
// @require collection/each.js
fn.hasClass = function(cls) {
fn.hasClass = function (cls) {
var classes = getSplitValues(cls);
var check = false;
if (classes.length) {
this.each(function(i, ele) {
this.each(function (i, ele) {
check = ele.classList.contains(classes[0]);
return !check;
});
@ -271,11 +273,11 @@ fn.hasClass = function(cls) {
// @require core/get_split_values.js
// @require collection/each.js
fn.removeAttr = function(attr) {
fn.removeAttr = function (attr) {
var attrs = getSplitValues(attr);
if (!attrs.length) return this;
return this.each(function(i, ele) {
each(attrs, function(a) {
return this.each(function (i, ele) {
each(attrs, function (a) {
ele.removeAttribute(a);
});
});
@ -284,7 +286,7 @@ fn.removeAttr = function(attr) {
// @require collection/each.js
// @require ./remove_attr.js
fn.attr = function(attr, value) {
fn.attr = function (attr, value) {
if (!attr) return;
if (isString(attr)) {
@ -297,7 +299,7 @@ fn.attr = function(attr, value) {
}
if (value === null) return this.removeAttr(attr);
return this.each(function(i, ele) {
return this.each(function (i, ele) {
ele.setAttribute(attr, value);
});
}
@ -312,12 +314,12 @@ fn.attr = function(attr, value) {
// @require core/get_split_values.js
// @require collection/each.js
fn.toggleClass = function(cls, force) {
fn.toggleClass = function (cls, force) {
var classes = getSplitValues(cls),
isForce = force !== undefined;
if (!classes.length) return this;
return this.each(function(i, ele) {
each(classes, function(c) {
return this.each(function (i, ele) {
each(classes, function (c) {
if (isForce) {
force ? ele.classList.add(c) : ele.classList.remove(c);
} else {
@ -328,16 +330,14 @@ fn.toggleClass = function(cls, force) {
}; // @require core/cash.js
// @require ./toggle_class.js
fn.addClass = function(cls) {
fn.addClass = function (cls) {
return this.toggleClass(cls, true);
}; // @require core/cash.js
// @require ./attr.js
// @require ./toggle_class.js
fn.removeClass = function(cls) {
return !arguments.length
? this.attr('class', '')
: this.toggleClass(cls, false);
fn.removeClass = function (cls) {
return !arguments.length ? this.attr('class', '') : this.toggleClass(cls, false);
}; // @optional ./add_class.js
// @optional ./attr.js
// @optional ./has_class.js
@ -349,7 +349,7 @@ fn.removeClass = function(cls) {
// @require ./cash.js
function unique(arr) {
return arr.filter(function(item, index, self) {
return arr.filter(function (item, index, self) {
return self.indexOf(item) === index;
});
}
@ -358,18 +358,14 @@ cash.unique = unique; // @require core/cash.js
// @require core/unique.js
// @require ./get.js
fn.add = function(selector, context) {
fn.add = function (selector, context) {
return cash(unique(this.get().concat(cash(selector, context).get())));
}; // @require core/variables.js
function computeStyle(ele, prop, isVariable) {
if (ele.nodeType !== 1) return;
var style = win.getComputedStyle(ele, null);
return prop
? isVariable
? style.getPropertyValue(prop)
: style[prop]
: style;
return prop ? (isVariable ? style.getPropertyValue(prop) : style[prop]) : style;
} // @require ./compute_style.js
function computeStyleInt(ele, prop) {
@ -401,13 +397,8 @@ function getPrefixedProp(prop, isVariable) {
if (!prefixedProps[prop]) {
var propCC = camelCase(prop),
propUC = '' + propCC.charAt(0).toUpperCase() + propCC.slice(1),
props = (
propCC +
' ' +
vendorsPrefixes.join(propUC + ' ') +
propUC
).split(' ');
each(props, function(p) {
props = (propCC + ' ' + vendorsPrefixes.join(propUC + ' ') + propUC).split(' ');
each(props, function (p) {
if (p in style) {
prefixedProps[prop] = p;
return false;
@ -432,7 +423,7 @@ var numericProps = {
order: true,
orphans: true,
widows: true,
zIndex: true
zIndex: true,
};
function getSuffixedValue(prop, value, isVariable) {
@ -440,9 +431,7 @@ function getSuffixedValue(prop, value, isVariable) {
isVariable = isCSSVariable(prop);
}
return !isVariable && !numericProps[prop] && isNumeric(value)
? value + 'px'
: value;
return !isVariable && !numericProps[prop] && isNumeric(value) ? value + 'px' : value;
} // @require core/cash.js
// @require core/type_checking.js
// @require collection/each.js
@ -451,15 +440,14 @@ function getSuffixedValue(prop, value, isVariable) {
// @require ./helpers/get_suffixed_value.js
// @require ./helpers/is_css_variable.js
fn.css = function(prop, value) {
fn.css = function (prop, value) {
if (isString(prop)) {
var isVariable = isCSSVariable(prop);
prop = getPrefixedProp(prop, isVariable);
if (arguments.length < 2)
return this[0] && computeStyle(this[0], prop, isVariable);
if (arguments.length < 2) return this[0] && computeStyle(this[0], prop, isVariable);
if (!prop) return this;
value = getSuffixedValue(prop, value, isVariable);
return this.each(function(i, ele) {
return this.each(function (i, ele) {
if (ele.nodeType !== 1) return;
if (isVariable) {
@ -481,7 +469,7 @@ var dataNamespace = '__cashData',
dataAttributeRe = /^data-(.*)/; // @require core/cash.js
// @require ./helpers/variables.js
cash.hasData = function(ele) {
cash.hasData = function (ele) {
return dataNamespace in ele;
}; // @require ./variables.js
@ -495,9 +483,7 @@ function getData(ele, key) {
if (key) {
if (!(key in cache)) {
var value = ele.dataset
? ele.dataset[key] || ele.dataset[camelCase(key)]
: cash(ele).attr('data-' + key);
var value = ele.dataset ? ele.dataset[key] || ele.dataset[camelCase(key)] : cash(ele).attr('data-' + key);
if (value !== undefined) {
try {
@ -532,12 +518,12 @@ function setData(ele, key, value) {
// @require ./helpers/set_data.js
// @require ./helpers/variables.js
fn.data = function(name, value) {
fn.data = function (name, value) {
var _this = this;
if (!name) {
if (!this[0]) return;
each(this[0].attributes, function(attr) {
each(this[0].attributes, function (attr) {
var match = attr.name.match(dataAttributeRe);
if (!match) return;
@ -548,7 +534,7 @@ fn.data = function(name, value) {
if (isString(name)) {
if (value === undefined) return this[0] && getData(this[0], name);
return this.each(function(i, ele) {
return this.each(function (i, ele) {
return setData(ele, name, value);
});
}
@ -562,8 +548,8 @@ fn.data = function(name, value) {
// @require collection/each.js
// @require ./helpers/remove_data.js
fn.removeData = function(key) {
return this.each(function(i, ele) {
fn.removeData = function (key) {
return this.each(function (i, ele) {
return removeData(ele, key);
});
}; // @optional ./data.js
@ -581,8 +567,8 @@ function getExtraSpace(ele, xAxis) {
// @require core/each.js
// @require core/variables.js
each(['Width', 'Height'], function(prop) {
fn['inner' + prop] = function() {
each(['Width', 'Height'], function (prop) {
fn['inner' + prop] = function () {
if (!this[0]) return;
if (this[0] === win) return win['inner' + prop];
return this[0]['client' + prop];
@ -595,25 +581,20 @@ each(['Width', 'Height'], function(prop) {
// @require css/helpers/get_suffixed_value.js
// @require ./helpers/get_extra_space.js
each(['width', 'height'], function(prop, index) {
fn[prop] = function(value) {
each(['width', 'height'], function (prop, index) {
fn[prop] = function (value) {
if (!this[0]) return value === undefined ? undefined : this;
if (!arguments.length) {
if (this[0] === win) return this[0][camelCase('outer-' + prop)];
return (
this[0].getBoundingClientRect()[prop] - getExtraSpace(this[0], !index)
);
return this[0].getBoundingClientRect()[prop] - getExtraSpace(this[0], !index);
}
value = parseInt(value, 10);
return this.each(function(i, ele) {
return this.each(function (i, ele) {
if (ele.nodeType !== 1) return;
var boxSizing = computeStyle(ele, 'boxSizing');
ele.style[prop] = getSuffixedValue(
prop,
value + (boxSizing === 'border-box' ? getExtraSpace(ele, !index) : 0)
);
ele.style[prop] = getSuffixedValue(prop, value + (boxSizing === 'border-box' ? getExtraSpace(ele, !index) : 0));
});
};
}); // @require core/cash.js
@ -621,8 +602,8 @@ each(['width', 'height'], function(prop, index) {
// @require core/variables.js
// @require css/helpers/compute_style_int.js
each(['Width', 'Height'], function(prop, index) {
fn['outer' + prop] = function(includeMargins) {
each(['Width', 'Height'], function (prop, index) {
fn['outer' + prop] = function (includeMargins) {
if (!this[0]) return;
if (this[0] === win) return win['outer' + prop];
return (
@ -646,7 +627,7 @@ function hasNamespaces(ns1, ns2) {
} // @require core/each.js
function removeEventListeners(cache, ele, name) {
each(cache[name], function(_ref) {
each(cache[name], function (_ref) {
var namespaces = _ref[0],
callback = _ref[1];
ele.removeEventListener(name, callback);
@ -696,14 +677,10 @@ function removeEvent(ele, name, namespaces, callback) {
var eventCache = cache[name];
if (!eventCache) return;
if (callback) callback.guid = callback.guid || guid++;
cache[name] = eventCache.filter(function(_ref2) {
cache[name] = eventCache.filter(function (_ref2) {
var ns = _ref2[0],
cb = _ref2[1];
if (
(callback && cb.guid !== callback.guid) ||
!hasNamespaces(ns, namespaces)
)
return true;
if ((callback && cb.guid !== callback.guid) || !hasNamespaces(ns, namespaces)) return true;
ele.removeEventListener(name, cb);
});
}
@ -713,20 +690,20 @@ function removeEvent(ele, name, namespaces, callback) {
// @require ./helpers/parse_event_name.js
// @require ./helpers/remove_event.js
fn.off = function(eventFullName, callback) {
fn.off = function (eventFullName, callback) {
var _this2 = this;
if (eventFullName === undefined) {
this.each(function(i, ele) {
this.each(function (i, ele) {
return removeEvent(ele);
});
} else {
each(getSplitValues(eventFullName), function(eventFullName) {
each(getSplitValues(eventFullName), function (eventFullName) {
var _parseEventName = parseEventName(eventFullName),
name = _parseEventName[0],
namespaces = _parseEventName[1];
_this2.each(function(i, ele) {
_this2.each(function (i, ele) {
return removeEvent(ele, name, namespaces, callback);
});
});
@ -745,7 +722,7 @@ fn.off = function(eventFullName, callback) {
// @require ./helpers/parse_event_name.js
// @require ./helpers/remove_event.js
fn.on = function(eventFullName, selector, callback, _one) {
fn.on = function (eventFullName, selector, callback, _one) {
var _this3 = this;
if (!isString(eventFullName)) {
@ -761,21 +738,14 @@ fn.on = function(eventFullName, selector, callback, _one) {
selector = false;
}
each(getSplitValues(eventFullName), function(eventFullName) {
each(getSplitValues(eventFullName), function (eventFullName) {
var _parseEventName2 = parseEventName(eventFullName),
name = _parseEventName2[0],
namespaces = _parseEventName2[1];
_this3.each(function(i, ele) {
_this3.each(function (i, ele) {
var finalCallback = function finalCallback(event) {
if (
event.namespace &&
!hasNamespaces(
namespaces,
event.namespace.split(eventsNamespacesSeparator)
)
)
return;
if (event.namespace && !hasNamespaces(namespaces, event.namespace.split(eventsNamespacesSeparator))) return;
var thisArg = ele;
if (selector) {
@ -811,12 +781,12 @@ fn.on = function(eventFullName, selector, callback, _one) {
}; // @require core/cash.js
// @require ./on.js
fn.one = function(eventFullName, delegate, callback) {
fn.one = function (eventFullName, delegate, callback) {
return this.on(eventFullName, delegate, callback, true);
}; // @require core/cash.js
// @require core/variables.js
fn.ready = function(callback) {
fn.ready = function (callback) {
var finalCallback = function finalCallback() {
return callback(cash);
};
@ -835,7 +805,7 @@ fn.ready = function(callback) {
// @require ./helpers/parse_event_name.js
// @require ./helpers/variables.js
fn.trigger = function(eventFullName, data) {
fn.trigger = function (eventFullName, data) {
var evt = eventFullName;
if (isString(eventFullName)) {
@ -849,7 +819,7 @@ fn.trigger = function(eventFullName, data) {
}
evt.data = data;
return this.each(function(i, ele) {
return this.each(function (i, ele) {
ele.dispatchEvent(evt);
});
}; // @optional ./off.js
@ -861,7 +831,7 @@ fn.trigger = function(eventFullName, data) {
function getValueSelectMultiple(ele) {
var values = [];
each(ele.options, function(option) {
each(ele.options, function (option) {
if (option.selected && !option.disabled && !option.parentNode.disabled) {
values.push(option.value);
}
@ -887,12 +857,7 @@ function getValue(ele) {
var queryEncodeSpaceRe = /%20/g;
function queryEncode(prop, value) {
return (
'&' +
encodeURIComponent(prop) +
'=' +
encodeURIComponent(value).replace(queryEncodeSpaceRe, '+')
);
return '&' + encodeURIComponent(prop) + '=' + encodeURIComponent(value).replace(queryEncodeSpaceRe, '+');
} // @require core/cash.js
// @require core/each.js
// @require core/type_checking.js
@ -902,17 +867,17 @@ function queryEncode(prop, value) {
var skippableRe = /file|reset|submit|button|image/i,
checkableRe = /radio|checkbox/i;
fn.serialize = function() {
fn.serialize = function () {
var query = '';
this.each(function(i, ele) {
each(ele.elements || [ele], function(ele) {
this.each(function (i, ele) {
each(ele.elements || [ele], function (ele) {
if (ele.disabled || !ele.name || ele.tagName === 'FIELDSET') return;
if (skippableRe.test(ele.type)) return;
if (checkableRe.test(ele.type) && !ele.checked) return;
var value = getValue(ele);
if (value === undefined) return;
var values = isArray(value) ? value : [value];
each(values, function(value) {
each(values, function (value) {
query += queryEncode(ele.name, value);
});
});
@ -924,14 +889,14 @@ fn.serialize = function() {
// @require collection/each.js
// @require ./helpers/get_value.js
fn.val = function(value) {
fn.val = function (value) {
if (value === undefined) return this[0] && getValue(this[0]);
return this.each(function(i, ele) {
return this.each(function (i, ele) {
var isMultiple = selectMultipleRe.test(ele.type),
eleValue = value === null ? (isMultiple ? [] : '') : value;
if (isMultiple && isArray(eleValue)) {
each(ele.options, function(option) {
each(ele.options, function (option) {
option.selected = eleValue.indexOf(option.value) >= 0;
});
} else {
@ -943,15 +908,15 @@ fn.val = function(value) {
// @require core/cash.js
// @require collection/map.js
fn.clone = function() {
return this.map(function(i, ele) {
fn.clone = function () {
return this.map(function (i, ele) {
return ele.cloneNode(true);
});
}; // @require core/cash.js
// @require collection/each.js
fn.detach = function() {
return this.each(function(i, ele) {
fn.detach = function () {
return this.each(function (i, ele) {
if (ele.parentNode) {
ele.parentNode.removeChild(ele);
}
@ -977,7 +942,7 @@ function initContainers() {
th: tr,
thead: table,
tbody: table,
tfoot: table
tfoot: table,
};
}
@ -988,9 +953,7 @@ function parseHTML(html) {
var fragment = fragmentRe.test(html) && RegExp.$1,
container = containers[fragment] || containers['*'];
container.innerHTML = html;
return cash(container.childNodes)
.detach()
.get();
return cash(container.childNodes).detach().get();
}
cash.parseHTML = parseHTML; // @optional ./camel_case.js
@ -1009,7 +972,7 @@ cash.parseHTML = parseHTML; // @optional ./camel_case.js
// @require ./type_checking.js
// @require core/cash.js
fn.empty = function() {
fn.empty = function () {
var ele = this[0];
if (ele) {
@ -1036,22 +999,18 @@ function insertContent(parent, child, prepend) {
var isStr = isString(child);
if (!isStr && child.length) {
each(child, function(ele) {
each(child, function (ele) {
return insertContent(parent, ele, prepend);
});
} else {
each(
parent,
isStr
? function(ele) {
? function (ele) {
ele.insertAdjacentHTML(prepend ? 'afterbegin' : 'beforeend', child);
}
: function(ele, index) {
return insertElement(
ele,
!index ? child : child.cloneNode(true),
prepend
);
: function (ele, index) {
return insertElement(ele, !index ? child : child.cloneNode(true), prepend);
}
);
}
@ -1059,38 +1018,38 @@ function insertContent(parent, child, prepend) {
// @require core/each.js
// @require ./helpers/insert_content.js
fn.append = function() {
fn.append = function () {
var _this4 = this;
each(arguments, function(content) {
each(arguments, function (content) {
insertContent(_this4, content);
});
return this;
}; // @require core/cash.js
// @require ./helpers/insert_content.js
fn.appendTo = function(parent) {
fn.appendTo = function (parent) {
insertContent(cash(parent), this);
return this;
}; // @require core/cash.js
// @require collection/each.js
fn.html = function(content) {
fn.html = function (content) {
if (content === undefined) return this[0] && this[0].innerHTML;
var source = content.nodeType ? content[0].outerHTML : content;
return this.each(function(i, ele) {
return this.each(function (i, ele) {
ele.innerHTML = source;
});
}; // @require core/cash.js
// @require collection/each.js
fn.insertAfter = function(content) {
fn.insertAfter = function (content) {
var _this5 = this;
cash(content).each(function(index, ele) {
cash(content).each(function (index, ele) {
var parent = ele.parentNode;
_this5.each(function(i, e) {
_this5.each(function (i, e) {
parent.insertBefore(!index ? e : e.cloneNode(true), ele.nextSibling);
});
});
@ -1101,23 +1060,23 @@ fn.insertAfter = function(content) {
// @require collection/slice.js
// @require ./insert_after.js
fn.after = function() {
fn.after = function () {
var _this6 = this;
each(reverse.apply(arguments), function(content) {
each(reverse.apply(arguments), function (content) {
reverse.apply(cash(content).slice()).insertAfter(_this6);
});
return this;
}; // @require core/cash.js
// @require collection/each.js
fn.insertBefore = function(selector) {
fn.insertBefore = function (selector) {
var _this7 = this;
cash(selector).each(function(index, ele) {
cash(selector).each(function (index, ele) {
var parent = ele.parentNode;
_this7.each(function(i, e) {
_this7.each(function (i, e) {
parent.insertBefore(!index ? e : e.cloneNode(true), ele);
});
});
@ -1126,10 +1085,10 @@ fn.insertBefore = function(selector) {
// @require core/each.js
// @require ./insert_before.js
fn.before = function() {
fn.before = function () {
var _this8 = this;
each(arguments, function(content) {
each(arguments, function (content) {
cash(content).insertBefore(_this8);
});
return this;
@ -1137,10 +1096,10 @@ fn.before = function() {
// @require core/each.js
// @require ./helpers/insert_content.js
fn.prepend = function() {
fn.prepend = function () {
var _this9 = this;
each(arguments, function(content) {
each(arguments, function (content) {
insertContent(_this9, content, true);
});
return this;
@ -1149,14 +1108,14 @@ fn.prepend = function() {
// @require collection/slice.js
// @require ./helpers/insert_content.js
fn.prependTo = function(parent) {
fn.prependTo = function (parent) {
insertContent(cash(parent), reverse.apply(this.slice()), true);
return this;
}; // @require core/cash.js
// @require events/off.js
// @require ./detach.js
fn.remove = function() {
fn.remove = function () {
return this.detach().off();
}; // @require core/cash.js
// @require collection/each.js
@ -1164,10 +1123,10 @@ fn.remove = function() {
// @require ./after.js
// @require ./remove.js
fn.replaceWith = function(content) {
fn.replaceWith = function (content) {
var _this10 = this;
return this.each(function(i, ele) {
return this.each(function (i, ele) {
var parent = ele.parentNode;
if (!parent) return;
var $eles = i ? cash(content).clone() : cash(content);
@ -1184,15 +1143,15 @@ fn.replaceWith = function(content) {
}; // @require core/cash.js
// @require ./replace_with.js
fn.replaceAll = function(content) {
fn.replaceAll = function (content) {
cash(content).replaceWith(this);
return this;
}; // @require core/cash.js
// @require collection/each.js
fn.text = function(content) {
fn.text = function (content) {
if (content === undefined) return this[0] ? this[0].textContent : '';
return this.each(function(i, ele) {
return this.each(function (i, ele) {
ele.textContent = content;
});
}; // @optional ./after.js
@ -1216,26 +1175,26 @@ fn.text = function(content) {
var docEle = doc && doc.documentElement;
fn.offset = function() {
fn.offset = function () {
var ele = this[0];
if (!ele) return;
var rect = ele.getBoundingClientRect();
return {
top: rect.top + win.pageYOffset - docEle.clientTop,
left: rect.left + win.pageXOffset - docEle.clientLeft
left: rect.left + win.pageXOffset - docEle.clientLeft,
};
}; // @require core/cash.js
fn.offsetParent = function() {
fn.offsetParent = function () {
return cash(this[0] && this[0].offsetParent);
}; // @require core/cash.js
fn.position = function() {
fn.position = function () {
var ele = this[0];
if (!ele) return;
return {
left: ele.offsetLeft,
top: ele.offsetTop
top: ele.offsetTop,
};
}; // @optional ./offset.js
// @optional ./offset_parent.js
@ -1246,27 +1205,24 @@ fn.position = function() {
// @require collection/each.js
// @require collection/filter.js
fn.children = function(selector) {
fn.children = function (selector) {
var result = [];
this.each(function(i, ele) {
this.each(function (i, ele) {
push.apply(result, ele.children);
});
result = cash(unique(result));
if (!selector) return result;
return result.filter(function(i, ele) {
return result.filter(function (i, ele) {
return matches(ele, selector);
});
}; // @require core/cash.js
// @require core/unique.js
// @require collection/each.js
fn.contents = function() {
fn.contents = function () {
var result = [];
this.each(function(i, ele) {
push.apply(
result,
ele.tagName === 'IFRAME' ? [ele.contentDocument] : ele.childNodes
);
this.each(function (i, ele) {
push.apply(result, ele.tagName === 'IFRAME' ? [ele.contentDocument] : ele.childNodes);
});
return cash(result.length && unique(result));
}; // @require core/cash.js
@ -1274,7 +1230,7 @@ fn.contents = function() {
// @require core/find.js
// @require core/variables.js
fn.find = function(selector) {
fn.find = function (selector) {
var result = [];
for (var i = 0, l = this.length; i < l; i++) {
@ -1291,12 +1247,12 @@ fn.find = function(selector) {
// @require core/type_checking.js
// @require collection/filter.js
fn.has = function(selector) {
fn.has = function (selector) {
var comparator = isString(selector)
? function(i, ele) {
? function (i, ele) {
return !!find(selector, ele).length;
}
: function(i, ele) {
: function (i, ele) {
return ele.contains(selector);
};
return this.filter(comparator);
@ -1304,36 +1260,36 @@ fn.has = function(selector) {
// @require core/get_compare_function.js
// @require collection/each.js
fn.is = function(selector) {
fn.is = function (selector) {
if (!selector || !this[0]) return false;
var comparator = getCompareFunction(selector);
var check = false;
this.each(function(i, ele) {
this.each(function (i, ele) {
check = comparator(i, ele, selector);
return !check;
});
return check;
}; // @require core/cash.js
fn.next = function() {
fn.next = function () {
return cash(this[0] && this[0].nextElementSibling);
}; // @require core/cash.js
// @require core/get_compare_function.js
// @require collection/filter.js
fn.not = function(selector) {
fn.not = function (selector) {
if (!selector || !this[0]) return this;
var comparator = getCompareFunction(selector);
return this.filter(function(i, ele) {
return this.filter(function (i, ele) {
return !comparator(i, ele, selector);
});
}; // @require core/cash.js
// @require core/unique.js
// @require collection/each.js
fn.parent = function() {
fn.parent = function () {
var result = [];
this.each(function(i, ele) {
this.each(function (i, ele) {
if (ele && ele.parentNode) {
result.push(ele.parentNode);
}
@ -1346,13 +1302,9 @@ fn.parent = function() {
// @require ./get.js
//FIXME Ugly file name, is there a better option?
fn.index = function(ele) {
fn.index = function (ele) {
var child = ele ? cash(ele)[0] : this[0],
collection = ele
? this
: cash(child)
.parent()
.children();
collection = ele ? this : cash(child).parent().children();
return indexOf.call(collection, child);
}; // @optional ./add.js
// @optional ./each.js
@ -1369,7 +1321,7 @@ fn.index = function(ele) {
// @require ./is.js
// @require ./parent.js
fn.closest = function(selector) {
fn.closest = function (selector) {
if (!selector || !this[0]) return cash();
if (this.is(selector)) return this.filter(selector);
return this.parent().closest(selector);
@ -1379,10 +1331,10 @@ fn.closest = function(selector) {
// @require core/variables.js
// @require collection/each.js
fn.parents = function(selector) {
fn.parents = function (selector) {
var result = [];
var last;
this.each(function(i, ele) {
this.each(function (i, ele) {
last = ele;
while (last && last.parentNode && last !== doc.body.parentNode) {
@ -1396,18 +1348,18 @@ fn.parents = function(selector) {
return cash(unique(result));
}; // @require core/cash.js
fn.prev = function() {
fn.prev = function () {
return cash(this[0] && this[0].previousElementSibling);
}; // @require core/cash.js
// @require collection/filter.js
// @require ./children.js
// @require ./parent.js
fn.siblings = function() {
fn.siblings = function () {
var ele = this[0];
return this.parent()
.children()
.filter(function(i, child) {
.filter(function (i, child) {
return child !== ele;
});
}; // @optional ./children.js

13
src/utils/dom.js

@ -5,8 +5,7 @@ const KEY_TAG = 'tag';
const KEY_ATTR = 'attributes';
const KEY_CHILD = 'children';
export const motionsEv =
'transitionend oTransitionEnd transitionend webkitTransitionEnd';
export const motionsEv = 'transitionend oTransitionEnd transitionend webkitTransitionEnd';
export const isDoc = el => el && el.nodeType === 9;
@ -18,14 +17,10 @@ export const removeEl = el => {
export const find = (el, query) => el.querySelectorAll(query);
export const attrUp = (el, attrs = {}) =>
el &&
el.setAttribute &&
each(attrs, (value, key) => el.setAttribute(key, value));
el && el.setAttribute && each(attrs, (value, key) => el.setAttribute(key, value));
export const isVisible = el => {
return (
el && !!(el.offsetWidth || el.offsetHeight || el.getClientRects().length)
);
return el && !!(el.offsetWidth || el.offsetHeight || el.getClientRects().length);
};
export const empty = node => {
@ -90,7 +85,7 @@ export const createCustomEvent = (e, cls) => {
Object.defineProperty(oEvent, prop, {
get() {
return this.keyCodeVal;
}
},
});
});
}

2
src/utils/index.js

@ -24,6 +24,6 @@ export default () => {
Sorter,
Resizer,
Dragger,
helpers: { ...mixins }
helpers: { ...mixins },
};
};

5
src/utils/polyfills.js

@ -16,7 +16,7 @@ export default () => {
['edge', /Edge\/([0-9\._]+)/],
['ie', /MSIE\s(7\.0)/],
['ie', /MSIE\s([0-9\.]+);.*Trident\/[4-7].0/],
['ie', /Trident\/7\.0.*rv\:([0-9\.]+).*\).*Gecko$/]
['ie', /Trident\/7\.0.*rv\:([0-9\.]+).*\).*Gecko$/],
];
for (let i = 0; i < rules.length; i++) {
@ -29,8 +29,7 @@ export default () => {
};
if (hasWin() && isIE()) {
const originalCreateHTMLDocument =
DOMImplementation.prototype.createHTMLDocument;
const originalCreateHTMLDocument = DOMImplementation.prototype.createHTMLDocument;
DOMImplementation.prototype.createHTMLDocument = title => {
if (!title) title = '';
return originalCreateHTMLDocument.apply(document.implementation, [title]);

2
test/specs/asset_manager/view/AssetImageView.js

@ -10,7 +10,7 @@ describe('AssetImageView', () => {
obj = new AssetImageView({
collection: new Assets(),
config: {},
model
model,
});
document.body.innerHTML = '<div id="fixtures"></div>';
document.body.querySelector('#fixtures').appendChild(obj.render().el);

6
test/specs/asset_manager/view/AssetView.js

@ -13,12 +13,10 @@ describe('AssetView', () => {
var model = coll.add({ src: 'test' });
testContext.view = new AssetView({
config: {},
model
model,
});
document.body.innerHTML = '<div id="fixtures"></div>';
document.body
.querySelector('#fixtures')
.appendChild(testContext.view.render().el);
document.body.querySelector('#fixtures').appendChild(testContext.view.render().el);
});
afterEach(() => {

12
test/specs/asset_manager/view/AssetsView.js

@ -12,7 +12,7 @@ describe('AssetsView', () => {
config: {},
collection: coll,
globalCollection: new Assets([]),
fu: new FileUploader({})
fu: new FileUploader({}),
});
document.body.innerHTML = '<div id="fixtures"></div>';
obj.render();
@ -74,14 +74,14 @@ describe('AssetsView', () => {
beforeEach(() => {
var config = {
showUrlInput: true
showUrlInput: true,
};
obj = new AssetsView({
config: config,
collection: coll,
globalCollection: new Assets([]),
fu: new FileUploader({})
fu: new FileUploader({}),
});
document.body.innerHTML = '<div id="fixtures"></div>';
obj.render();
@ -95,7 +95,7 @@ describe('AssetsView', () => {
test('Add image asset from input string', () => {
obj.getAddInput().value = 'test';
obj.handleSubmit({
preventDefault() {}
preventDefault() {},
});
var asset = obj.options.globalCollection.at(0);
expect(asset.get('src')).toEqual('test');
@ -108,7 +108,7 @@ describe('AssetsView', () => {
beforeEach(() => {
var config = {
showUrlInput: false
showUrlInput: false,
};
coll = new Assets([]);
@ -116,7 +116,7 @@ describe('AssetsView', () => {
config: config,
collection: coll,
globalCollection: new Assets([]),
fu: new FileUploader({})
fu: new FileUploader({}),
});
document.body.innerHTML = '<div id="fixtures"></div>';
obj.render();

12
test/specs/asset_manager/view/FileUploader.js

@ -44,8 +44,8 @@ describe('File Uploader', () => {
var view = new FileUploader({
config: {
disableUpload: true,
upload: 'something'
}
upload: 'something',
},
});
view.render();
expect(view.$el.find('input[type=file]').prop('disabled')).toEqual(true);
@ -54,8 +54,8 @@ describe('File Uploader', () => {
test('Handles multiUpload false', () => {
var view = new FileUploader({
config: {
multiUpload: false
}
multiUpload: false,
},
});
view.render();
expect(view.$el.find('input[type=file]').prop('multiple')).toBeFalsy();
@ -64,8 +64,8 @@ describe('File Uploader', () => {
test('Handles embedAsBase64 parameter', () => {
var view = new FileUploader({
config: {
embedAsBase64: true
}
embedAsBase64: true,
},
});
view.render();
expect(view.$el.find('input[type=file]').prop('disabled')).toEqual(false);

8
test/specs/block_manager/view/BlocksView.js

@ -50,10 +50,10 @@ describe('BlocksView', () => {
model = new Blocks([{ name: 'test1' }, { name: 'test2' }]);
view = new BlocksView(
{
collection: model
collection: model,
},
{
pStylePrefix: ppfx
pStylePrefix: ppfx,
}
);
document.body.innerHTML = '<div id="fixtures"></div>';
@ -65,9 +65,7 @@ describe('BlocksView', () => {
});
test('Render container', () => {
expect(view.getBlocksEl().getAttribute('class')).toEqual(
ppfx + 'blocks-c'
);
expect(view.getBlocksEl().getAttribute('class')).toEqual(ppfx + 'blocks-c');
});
});
});

8
test/specs/commands/index.js

@ -21,7 +21,7 @@ describe('Commands', () => {
getWrapperEl: () => ({}),
getFrameEl: () => ({}),
getToolsEl: () => ({}),
getBody: () => ({})
getBody: () => ({}),
};
case 'Editor':
return { ...Backbone.Events };
@ -29,16 +29,16 @@ describe('Commands', () => {
}
return null;
},
logWarning() {}
logWarning() {},
};
beforeEach(() => {
commSimple = {
run: () => commResultRun,
stop: () => commResultStop
stop: () => commResultStop,
};
commRunOnly = {
run: () => commResultRun
run: () => commResultRun,
};
commFunc = () => commResultRun;
obj = new Commands().init({ em: mockEditor });

36
test/specs/commands/view/CommandAbstract.js

@ -24,17 +24,8 @@ describe('CommandAbstract', () => {
const result = command.callRun(editor);
expect(editorTriggerSpy.callCount).toEqual(3);
expect(editorTriggerSpy.getCall(0).args).toEqual(['run:test:before', {}]);
expect(editorTriggerSpy.getCall(1).args).toEqual([
'run:test',
'result',
{}
]);
expect(editorTriggerSpy.getCall(2).args).toEqual([
'run',
'test',
'result',
{}
]);
expect(editorTriggerSpy.getCall(1).args).toEqual(['run:test', 'result', {}]);
expect(editorTriggerSpy.getCall(2).args).toEqual(['run', 'test', 'result', {}]);
expect(result).toEqual('result');
expect(runStub.calledOnce).toEqual(true);
@ -46,14 +37,8 @@ describe('CommandAbstract', () => {
const result = command.callRun(editor, { abort: true });
expect(editorTriggerSpy.calledTwice).toEqual(true);
expect(editorTriggerSpy.getCall(0).args).toEqual([
'run:test:before',
{ abort: true }
]);
expect(editorTriggerSpy.getCall(1).args).toEqual([
'abort:test',
{ abort: true }
]);
expect(editorTriggerSpy.getCall(0).args).toEqual(['run:test:before', { abort: true }]);
expect(editorTriggerSpy.getCall(1).args).toEqual(['abort:test', { abort: true }]);
expect(result).toEqual(undefined);
expect(runStub.notCalled).toEqual(true);
@ -66,17 +51,8 @@ describe('CommandAbstract', () => {
expect(editorTriggerSpy.callCount).toEqual(3);
expect(editorTriggerSpy.getCall(0).args).toEqual(['stop:test:before', {}]);
expect(editorTriggerSpy.getCall(1).args).toEqual([
'stop:test',
'stopped',
{}
]);
expect(editorTriggerSpy.getCall(2).args).toEqual([
'stop',
'test',
'stopped',
{}
]);
expect(editorTriggerSpy.getCall(1).args).toEqual(['stop:test', 'stopped', {}]);
expect(editorTriggerSpy.getCall(2).args).toEqual(['stop', 'test', 'stopped', {}]);
expect(result).toEqual('stopped');
expect(stopStub.calledOnce).toEqual(true);

6
test/specs/commands/view/SwitchVisibility.js

@ -9,12 +9,12 @@ describe('SwitchVisibility command', () => {
fakeEditor = {
Canvas: {
getFrames: jest.fn(() => fakeFrames)
getFrames: jest.fn(() => fakeFrames),
},
Commands: {
isActive: jest.fn(() => fakeIsActive)
}
isActive: jest.fn(() => fakeIsActive),
},
};
});

36
test/specs/css_composer/e2e/CssComposer.js

@ -21,7 +21,7 @@ describe('E2E tests', () => {
stylePrefix: '',
storageManager: { autoload: 0, type: 'none' },
assetManager: { storageType: 'none' },
container: 'csscomposer-fixture'
container: 'csscomposer-fixture',
});
cssc = gjs.CssComposer;
clsm = gjs.SelectorManager;
@ -30,15 +30,15 @@ describe('E2E tests', () => {
rulesSet = [
{ selectors: [{ name: 'test1' }, { name: 'test2' }] },
{ selectors: [{ name: 'test2' }, { name: 'test3' }] },
{ selectors: [{ name: 'test3' }] }
{ selectors: [{ name: 'test3' }] },
];
rulesSet2 = [
{
selectors: [{ name: 'test1' }, { name: 'test2' }],
state: ':active'
state: ':active',
},
{ selectors: [{ name: 'test2' }, { name: 'test3' }] },
{ selectors: [{ name: 'test3' }], mediaText: '(max-width: 900px)' }
{ selectors: [{ name: 'test3' }], mediaText: '(max-width: 900px)' },
];
done();
});
@ -58,7 +58,7 @@ describe('E2E tests', () => {
stylePrefix: '',
storageManager: { autoload: 0, type: 'none' },
cssComposer: { rules: rulesSet },
container: 'csscomposer-fixture'
container: 'csscomposer-fixture',
});
var cssc = gj.editor.get('CssComposer');
expect(cssc.getAll().length).toEqual(rulesSet.length);
@ -89,9 +89,7 @@ describe('E2E tests', () => {
test('Add rules from the new component added as a string with style tag', () => {
var comps = domc.getComponents();
var rules = cssc.getAll();
comps.add(
'<div>Test</div><style>.test{color: red} .test2{color: blue}</style>'
);
comps.add('<div>Test</div><style>.test{color: red} .test2{color: blue}</style>');
expect(comps.length).toEqual(1);
expect(rules.length).toEqual(2);
});
@ -116,11 +114,11 @@ describe('E2E tests', () => {
var style2 = { height: '20px', width: '20px' };
var rule1 = {
selectors: ['test1'],
style: style1
style: style1,
};
var rule2 = {
selectors: ['test1'],
style: style2
style: style2,
};
var ruleOut = cssc.addCollection(rule1)[0];
// ruleOut is a Model
@ -129,8 +127,8 @@ describe('E2E tests', () => {
selectors: ['test1'],
style: {
color: 'red',
width: '10px'
}
width: '10px',
},
};
expect(ruleOut).toEqual(ruleResult);
var ruleOut = cssc.addCollection(rule2, { extend: 1 })[0];
@ -138,7 +136,7 @@ describe('E2E tests', () => {
ruleResult.style = {
color: 'red',
height: '20px',
width: '20px'
width: '20px',
};
expect(ruleOut).toEqual(ruleResult);
});
@ -149,12 +147,12 @@ describe('E2E tests', () => {
var rule1 = {
selectors: [],
selectorsAdd: '*',
style: style1
style: style1,
};
var rule2 = {
selectors: [],
selectorsAdd: 'p',
style: style2
style: style2,
};
var rule1Out = cssc.addCollection(rule1, { extend: 1 })[0];
var rule2Out = cssc.addCollection(rule2, { extend: 1 })[0];
@ -165,16 +163,16 @@ describe('E2E tests', () => {
selectorsAdd: '*',
style: {
color: 'red',
width: '10px'
}
width: '10px',
},
};
var rule2Result = {
selectors: [],
selectorsAdd: 'p',
style: {
height: '20px',
width: '20px'
}
width: '20px',
},
};
expect(rule1Out).toEqual(rule1Result);
expect(rule2Out).toEqual(rule2Result);

10
test/specs/css_composer/view/CssRuleView.js

@ -8,7 +8,7 @@ describe('CssRuleView', () => {
beforeEach(() => {
var m = new CssRule();
obj = new CssRuleView({
model: m
model: m,
});
document.body.innerHTML = '<div id="fixtures"></div>';
fixtures = document.body.querySelector('#fixtures');
@ -37,10 +37,10 @@ describe('CssRuleView', () => {
beforeEach(() => {
var m = new CssRule({
selectors: [{ name: 'test1' }, { name: 'test2' }]
selectors: [{ name: 'test1' }, { name: 'test2' }],
});
objReg = new CssRuleView({
model: m
model: m,
});
objReg.render();
document.body.innerHTML = '<div id="fixtures"></div>';
@ -77,9 +77,7 @@ describe('CssRuleView', () => {
test('Render media queries', () => {
objReg.model.set('style', { prop: 'value' });
objReg.model.set('mediaText', '(max-width: 999px)');
expect(objReg.$el.html()).toEqual(
'@media (max-width: 999px){.test1.test2{prop:value;}}'
);
expect(objReg.$el.html()).toEqual('@media (max-width: 999px){.test1.test2{prop:value;}}');
});
test('Empty on clear', () => {

26
test/specs/css_composer/view/CssRulesView.js

@ -9,18 +9,18 @@ describe('CssRulesView', () => {
{
name: 'Mobile portrait',
width: '320px',
widthMedia: '480px'
widthMedia: '480px',
},
{
name: 'Tablet',
width: '768px',
widthMedia: '992px'
widthMedia: '992px',
},
{
name: 'Desktop',
width: '',
widthMedia: ''
}
widthMedia: '',
},
];
beforeEach(() => {
@ -30,10 +30,10 @@ describe('CssRulesView', () => {
config: {
em: new Editor({
deviceManager: {
devices
}
})
}
devices,
},
}),
},
});
document.body.innerHTML = '<div id="fixtures"></div>';
document.body.querySelector('#fixtures').appendChild(obj.render().el);
@ -78,20 +78,20 @@ describe('CssRulesView', () => {
const foundStylesContainers = obj.$el.find('div');
const rules = [
{
selectorsAdd: '#testid'
selectorsAdd: '#testid',
},
{
selectorsAdd: '#testid2',
mediaText: '(max-width: 1000px)'
mediaText: '(max-width: 1000px)',
},
{
selectorsAdd: '#testid3',
mediaText: '(min-width: 900px)'
mediaText: '(min-width: 900px)',
},
{
selectorsAdd: '#testid4',
mediaText: 'screen and (max-width: 900px) and (min-width: 600px)'
}
mediaText: 'screen and (max-width: 900px) and (min-width: 600px)',
},
];
obj.collection.add(rules);
const stylesCont = obj.el.querySelector(`#${obj.className}`);

8
test/specs/device_manager/view/DevicesView.js

@ -12,7 +12,7 @@ describe('DevicesView', () => {
model = new Devices([]);
view = new DevicesView({
collection: model,
config: { em: new Model() }
config: { em: new Model() },
});
document.body.innerHTML = '<div id="fixtures"></div>';
document.body.querySelector('#fixtures').appendChild(view.render().el);
@ -41,7 +41,7 @@ describe('DevicesView', () => {
model = new Devices([{ name: 'test1' }, { name: 'test2' }]);
view = new DevicesView({
collection: model,
config: { em: editorModel }
config: { em: editorModel },
});
document.body.innerHTML = '<div id="fixtures"></div>';
document.body.querySelector('#fixtures').appendChild(view.render().el);
@ -54,9 +54,7 @@ describe('DevicesView', () => {
});
test('Render options', () => {
expect(view.getOptions()).toEqual(
'<option value="test1">test1</option><option value="test2">test2</option>'
);
expect(view.getOptions()).toEqual('<option value="test1">test1</option><option value="test2">test2</option>');
});
});
});

1
test/specs/dom_components/index.js

@ -56,7 +56,6 @@ describe('DOM Components', () => {
obj = em.get('DomComponents');
// obj = new DomComponents(em).init(config);
});
afterEach(() => {
obj = null;
});

2
test/specs/dom_components/view/ComponentImageView.js

@ -8,7 +8,7 @@ describe('ComponentImageView', () => {
beforeEach(() => {
model = new Component();
view = new ComponentImageView({
model
model,
});
document.body.innerHTML = '<div id="fixtures"></div>';
document.body.querySelector('#fixtures').appendChild(view.render().el);

2
test/specs/modal/view/ModalView.js

@ -9,7 +9,7 @@ describe('ModalView', () => {
beforeEach(() => {
model = new Modal();
view = new ModalView({
model
model,
});
document.body.innerHTML = '<div id="fixtures"></div>';
document.body.querySelector('#fixtures').appendChild(view.render().el);

18
test/specs/panels/e2e/PanelsE2e.js

@ -13,7 +13,7 @@ describe('E2E tests', () => {
obj = grapesjs;
config = {
container: '#' + editorName,
storageManager: { autoload: 0, type: 'none' }
storageManager: { autoload: 0, type: 'none' },
};
fixture = $('<div id="' + editorName + '"></div>');
fixture.empty().appendTo(fixtures);
@ -38,9 +38,9 @@ describe('E2E tests', () => {
run(ed, caller) {
ed.testValue = 'testValue';
caller.set('active', false);
}
}
]
},
},
],
};
config.panels = {
defaults: [
@ -50,11 +50,11 @@ describe('E2E tests', () => {
{
id: 'button-test',
className: 'fa fa-smile-o',
command: commandId
}
]
}
]
command: commandId,
},
],
},
],
};
var editor = obj.init(config);
editor.testValue = '';

4
test/specs/panels/model/PanelModels.js

@ -23,7 +23,7 @@ describe('Button', () => {
test('Init with other buttons inside correctly', () => {
obj = new Button({
buttons: [{}]
buttons: [{}],
});
expect(obj.get('buttons') instanceof Buttons).toEqual(true);
expect(obj.get('buttons').length).toEqual(1);
@ -110,7 +110,7 @@ describe('Panel', () => {
test('Init with buttons inside correctly', () => {
obj = new Panel({
buttons: [{}]
buttons: [{}],
});
expect(obj.get('buttons') instanceof Buttons).toEqual(true);
expect(obj.get('buttons').length).toEqual(1);

8
test/specs/panels/view/ButtonView.js

@ -10,7 +10,7 @@ describe('ButtonView', () => {
beforeEach(() => {
model = new Button({ command: 'fake-command' });
view = new ButtonView({
model: model
model: model,
});
document.body.innerHTML = '<div id="fixtures"></div>';
fixtures = document.body.querySelector('#fixtures');
@ -22,9 +22,7 @@ describe('ButtonView', () => {
});
test('Button empty', () => {
expect(fixtures.innerHTML).toEqual(
'<span class="' + btnClass + '"></span>'
);
expect(fixtures.innerHTML).toEqual('<span class="' + btnClass + '"></span>');
});
test('Update class', () => {
@ -34,7 +32,7 @@ describe('ButtonView', () => {
test('Update attributes', () => {
model.set('attributes', {
'data-test': 'test-value'
'data-test': 'test-value',
});
expect(view.el.getAttribute('data-test')).toEqual('test-value');
});

2
test/specs/panels/view/ButtonsView.js

@ -9,7 +9,7 @@ describe('ButtonsView', () => {
beforeEach(() => {
model = new Buttons([]);
view = new ButtonsView({
collection: model
collection: model,
});
document.body.innerHTML = '<div id="fixtures"></div>';
fixtures = document.body.querySelector('#fixtures');

6
test/specs/panels/view/PanelView.js

@ -9,7 +9,7 @@ describe('PanelView', () => {
beforeEach(() => {
model = new Panel();
view = new PanelView({
model
model,
});
document.body.innerHTML = '<div id="fixtures"></div>';
fixtures = document.body.querySelector('#fixtures');
@ -53,10 +53,10 @@ describe('PanelView', () => {
describe('Init with options', () => {
beforeEach(() => {
model = new Panel({
buttons: [{}]
buttons: [{}],
});
view = new PanelView({
model
model,
});
document.body.innerHTML = '<div id="fixtures"></div>';
fixtures = document.body.querySelector('#fixtures');

2
test/specs/panels/view/PanelsView.js

@ -10,7 +10,7 @@ describe('PanelsView', () => {
beforeEach(() => {
model = new Panels([]);
view = new PanelsView({
collection: model
collection: model,
});
document.body.innerHTML = '<div id="fixtures"></div>';
fixtures = document.body.querySelector('#fixtures');

37
test/specs/selector_manager/e2e/ClassManager.js

@ -9,14 +9,13 @@ describe('E2E tests', () => {
describe('Interaction with Components', () => {
beforeEach(() => {
document.body.innerHTML =
'<div id="fixtures"><div id="SelectorManager-fixture"></div></div>';
document.body.innerHTML = '<div id="fixtures"><div id="SelectorManager-fixture"></div></div>';
fixtures = document.body.firstChild;
gjs = grapesjs.init({
stylePrefix: '',
storageManager: { autoload: 0, type: 0 },
assetManager: { storageType: 'none' },
container: '#SelectorManager-fixture'
container: '#SelectorManager-fixture',
});
components = gjs.getComponents();
module = gjs.Selectors;
@ -34,18 +33,13 @@ describe('E2E tests', () => {
gjs.select(model);
tagEl.addNewTag('test');
expect(model.get('classes').length).toEqual(1);
expect(
model
.get('classes')
.at(0)
.get('name')
).toEqual('test');
expect(model.get('classes').at(0).get('name')).toEqual('test');
});
test('Classes from components are correctly imported inside main container', () => {
var model = components.add([
{ classes: ['test11', 'test12', 'test13'] },
{ classes: ['test11', 'test22', 'test22'] }
{ classes: ['test11', 'test22', 'test22'] },
]);
expect(gjs.editor.get('SelectorManager').getAll().length).toEqual(4);
});
@ -53,10 +47,7 @@ describe('E2E tests', () => {
test('Class imported into component is the same model from main container', () => {
var model = components.add({ classes: ['test1'] });
var clModel = model.get('classes').at(0);
var clModel2 = gjs.editor
.get('SelectorManager')
.getAll()
.at(0);
var clModel2 = gjs.editor.get('SelectorManager').getAll().at(0);
expect(clModel).toEqual(clModel2);
});
@ -71,22 +62,14 @@ describe('E2E tests', () => {
expect(sels.at(0).get('name')).toEqual('test');
// One only selector added
expect(module.getAll().length).toEqual(1);
expect(
module
.getAll()
.at(0)
.get('name')
).toEqual('test');
expect(module.getAll().at(0).get('name')).toEqual('test');
});
test('Removing from container removes also from selected component', () => {
var model = components.add({});
gjs.editor.setSelected(model);
tagEl.addNewTag('test');
tagEl
.getClasses()
.find('.tag #close')
.trigger('click');
tagEl.getClasses().find('.tag #close').trigger('click');
setTimeout(() => expect(model.get('classes').length).toEqual(0));
});
@ -117,8 +100,8 @@ describe('E2E tests', () => {
{ name: 'test9', type: Selector.TYPE_ID, protected: 1 },
{ label: 'test10' },
{ label: 'test11', type: Selector.TYPE_ID },
{ label: 'test12', protected: 1 }
]
{ label: 'test12', protected: 1 },
],
});
const modelTr = JSON.parse(JSON.stringify(model));
@ -135,7 +118,7 @@ describe('E2E tests', () => {
{ name: 'test9', type: Selector.TYPE_ID, protected: 1 },
'test10',
'#test11',
{ name: 'test12', protected: 1 }
{ name: 'test12', protected: 1 },
]);
});
});

41
test/specs/selector_manager/index.js

@ -28,7 +28,7 @@ describe('SelectorManager', () => {
test('Able to add default selectors', () => {
var cm = new SelectorManager().init({
em,
selectors: ['test1', 'test2', 'test3']
selectors: ['test1', 'test2', 'test3'],
});
expect(cm.getAll().length).toEqual(3);
});
@ -81,16 +81,7 @@ describe('SelectorManager', () => {
});
test('Add multiple selectors', () => {
const cls = [
'.test1',
'test1',
'.test2',
'.test2',
'#test3',
'test3',
'test3',
'#test3'
];
const cls = ['.test1', 'test1', '.test2', '.test2', '#test3', 'test3', 'test3', '#test3'];
const result = obj.add(cls);
expect(Array.isArray(result)).toEqual(true);
const concat = obj
@ -99,30 +90,10 @@ describe('SelectorManager', () => {
.join('');
expect(concat).toEqual('.test1.test2#test3.test3');
expect(obj.getAll().length).toEqual(4);
expect(
obj
.getAll()
.at(0)
.getFullName()
).toEqual('.test1');
expect(
obj
.getAll()
.at(1)
.getFullName()
).toEqual('.test2');
expect(
obj
.getAll()
.at(2)
.getFullName()
).toEqual('#test3');
expect(
obj
.getAll()
.at(3)
.getFullName()
).toEqual('.test3');
expect(obj.getAll().at(0).getFullName()).toEqual('.test1');
expect(obj.getAll().at(1).getFullName()).toEqual('.test2');
expect(obj.getAll().at(2).getFullName()).toEqual('#test3');
expect(obj.getAll().at(3).getFullName()).toEqual('.test3');
expect(obj.get(cls).length).toEqual(4);
expect(

8
test/specs/selector_manager/model/SelectorModels.js

@ -67,7 +67,7 @@ describe('Selectors', () => {
expect(
obj.getFullName({
combination: true,
array: true
array: true,
})
).toEqual(['.a', '.a.b', '.b']);
@ -81,7 +81,7 @@ describe('Selectors', () => {
expect(
obj.getFullName({
combination: true,
array: true
array: true,
})
).toEqual(['.a', '.a.b', '.a.b.c', '.a.c', '.b', '.b.c', '.c']);
});
@ -91,7 +91,7 @@ describe('Selectors', () => {
expect(
obj.getFullName({
combination: true,
array: true
array: true,
})
).toEqual([
'.a',
@ -108,7 +108,7 @@ describe('Selectors', () => {
'.b.d',
'.c',
'.c.d',
'.d'
'.d',
]);
});
});

Some files were not shown because too many files changed in this diff

Loading…
Cancel
Save