2017-01-18 16:12:50 +01:00
|
|
|
|
/**
|
|
|
|
|
* Toolbar settings
|
|
|
|
|
*
|
2017-01-25 23:41:18 +01:00
|
|
|
|
* @version 1.0.4
|
2017-01-18 16:12:50 +01:00
|
|
|
|
*/
|
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
module.exports = (function (settings) {
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-13 18:54:18 +01:00
|
|
|
|
let editor = codex.editor;
|
|
|
|
|
|
2016-12-07 19:25:31 +01:00
|
|
|
|
settings.opened = false;
|
|
|
|
|
|
|
|
|
|
settings.setting = null;
|
|
|
|
|
settings.actions = null;
|
|
|
|
|
|
|
|
|
|
settings.cover = null;
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Append and open settings
|
|
|
|
|
*/
|
2017-02-01 18:25:59 +01:00
|
|
|
|
settings.open = function (toolType) {
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Append settings content
|
|
|
|
|
* It's stored in tool.settings
|
|
|
|
|
*/
|
2017-02-01 18:25:59 +01:00
|
|
|
|
if (!editor.tools[toolType] || !editor.tools[toolType].makeSettings ) {
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
editor.core.log(`Plugin «${toolType}» has no settings`, 'warn');
|
|
|
|
|
// editor.nodes.pluginSettings.innerHTML = `Плагин «${toolType}» не имеет настроек`;
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
2017-01-18 16:12:50 +01:00
|
|
|
|
/**
|
|
|
|
|
* Draw settings block
|
|
|
|
|
*/
|
2017-02-01 18:25:59 +01:00
|
|
|
|
var settingsBlock = editor.tools[toolType].makeSettings();
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
editor.nodes.pluginSettings.appendChild(settingsBlock);
|
|
|
|
|
|
|
|
|
|
}
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
/** Open settings block */
|
2017-02-01 18:25:59 +01:00
|
|
|
|
editor.nodes.blockSettings.classList.add('opened');
|
|
|
|
|
editor.toolbar.settings.addDefaultSettings();
|
2016-12-07 19:25:31 +01:00
|
|
|
|
this.opened = true;
|
2017-02-01 18:25:59 +01:00
|
|
|
|
|
2016-12-07 19:25:31 +01:00
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Close and clear settings
|
|
|
|
|
*/
|
2017-02-01 18:25:59 +01:00
|
|
|
|
settings.close = function () {
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
editor.nodes.blockSettings.classList.remove('opened');
|
|
|
|
|
editor.nodes.pluginSettings.innerHTML = '';
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
this.opened = false;
|
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* @param {string} toolType - plugin type
|
|
|
|
|
*/
|
2017-02-01 18:25:59 +01:00
|
|
|
|
settings.toggle = function ( toolType ) {
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
if ( !this.opened ) {
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
this.open(toolType);
|
2017-02-08 07:39:07 +01:00
|
|
|
|
editor.anchors.settingsOpened(editor.content.currentNode);
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
|
|
this.close();
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* This function adds default core settings
|
|
|
|
|
*/
|
2017-02-01 18:25:59 +01:00
|
|
|
|
settings.addDefaultSettings = function () {
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
/** list of default settings */
|
2017-02-08 07:39:07 +01:00
|
|
|
|
var feedModeToggler,
|
|
|
|
|
anchorInput;
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
/** Clear block and append initialized settings */
|
2017-02-01 18:25:59 +01:00
|
|
|
|
editor.nodes.defaultSettings.innerHTML = '';
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** Init all default setting buttons */
|
2017-02-01 18:25:59 +01:00
|
|
|
|
feedModeToggler = editor.toolbar.settings.makeFeedModeToggler();
|
2017-02-08 07:39:07 +01:00
|
|
|
|
anchorInput = editor.toolbar.settings.makeAnchorInput();
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Fill defaultSettings
|
|
|
|
|
*/
|
|
|
|
|
|
2017-02-08 07:39:07 +01:00
|
|
|
|
/**
|
|
|
|
|
* Input for anchor for block
|
|
|
|
|
*/
|
|
|
|
|
editor.nodes.defaultSettings.appendChild(anchorInput);
|
|
|
|
|
|
2016-12-07 19:25:31 +01:00
|
|
|
|
/**
|
|
|
|
|
* Button that enables/disables Feed-mode
|
|
|
|
|
* Feed-mode means that block will be showed in articles-feed like cover
|
|
|
|
|
*/
|
2017-02-01 18:25:59 +01:00
|
|
|
|
editor.nodes.defaultSettings.appendChild(feedModeToggler);
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Cover setting.
|
|
|
|
|
* This tune highlights block, so that it may be used for showing target block on main page
|
|
|
|
|
* Draw different setting when block is marked for main page
|
|
|
|
|
* If TRUE, then we show button that removes this selection
|
|
|
|
|
* Also defined setting "Click" events will be listened and have separate callbacks
|
|
|
|
|
*
|
|
|
|
|
* @return {Element} node/button that we place in default settings block
|
|
|
|
|
*/
|
2017-02-01 18:25:59 +01:00
|
|
|
|
settings.makeFeedModeToggler = function () {
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
var isFeedModeActivated = editor.toolbar.settings.isFeedModeActivated(),
|
2016-12-07 19:25:31 +01:00
|
|
|
|
setting,
|
|
|
|
|
data;
|
|
|
|
|
|
|
|
|
|
if (!isFeedModeActivated) {
|
|
|
|
|
|
|
|
|
|
data = {
|
|
|
|
|
innerHTML : '<i class="ce-icon-newspaper"></i>Вывести в ленте'
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
|
|
data = {
|
|
|
|
|
innerHTML : '<i class="ce-icon-newspaper"></i>Не выводить в ленте'
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
setting = editor.draw.node('DIV', editor.ui.className.SETTINGS_ITEM, data);
|
2017-02-13 18:54:18 +01:00
|
|
|
|
editor.listeners.add(setting, 'click', editor.toolbar.settings.updateFeedMode, false);
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
return setting;
|
2017-02-01 18:25:59 +01:00
|
|
|
|
|
2016-12-07 19:25:31 +01:00
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Updates Feed-mode
|
|
|
|
|
*/
|
2017-02-01 18:25:59 +01:00
|
|
|
|
settings.updateFeedMode = function () {
|
|
|
|
|
|
|
|
|
|
var currentNode = editor.content.currentNode;
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
currentNode.classList.toggle(editor.ui.className.BLOCK_IN_FEED_MODE);
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
editor.toolbar.settings.close();
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
settings.isFeedModeActivated = function () {
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
var currentBlock = editor.content.currentNode;
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
if (currentBlock) {
|
2017-02-01 18:25:59 +01:00
|
|
|
|
|
|
|
|
|
return currentBlock.classList.contains(editor.ui.className.BLOCK_IN_FEED_MODE);
|
|
|
|
|
|
2016-12-07 19:25:31 +01:00
|
|
|
|
} else {
|
2017-02-01 18:25:59 +01:00
|
|
|
|
|
2016-12-07 19:25:31 +01:00
|
|
|
|
return false;
|
2017-02-01 18:25:59 +01:00
|
|
|
|
|
2016-12-07 19:25:31 +01:00
|
|
|
|
}
|
2017-02-01 18:25:59 +01:00
|
|
|
|
|
2016-12-07 19:25:31 +01:00
|
|
|
|
};
|
|
|
|
|
|
2017-02-08 07:39:07 +01:00
|
|
|
|
settings.makeAnchorInput = function () {
|
|
|
|
|
|
|
|
|
|
var anchorWrapper = editor.draw.node('div', 'ce-settings__anchor-wrapper ce-settings__item', {}),
|
|
|
|
|
hash = editor.draw.node('i', 'ce-settings__anchor-hash', {}),
|
|
|
|
|
anchor = editor.draw.node('input', 'ce-settings__anchor-input', { placeholder: 'Якорь' });
|
|
|
|
|
|
2017-02-13 18:54:18 +01:00
|
|
|
|
editor.listeners.add(anchor, 'keydown', editor.anchors.keyDownOnAnchorInput );
|
|
|
|
|
editor.listeners.add(anchor, 'keyup', editor.anchors.keyUpOnAnchorInput );
|
|
|
|
|
editor.listeners.add(anchor, 'input', editor.anchors.anchorChanged );
|
|
|
|
|
editor.listeners.add(anchor, 'blur', editor.anchors.anchorChanged );
|
2017-02-08 07:39:07 +01:00
|
|
|
|
|
|
|
|
|
anchorWrapper.appendChild(hash);
|
|
|
|
|
anchorWrapper.appendChild(anchor);
|
|
|
|
|
|
|
|
|
|
editor.anchors.input = anchor;
|
|
|
|
|
|
|
|
|
|
return anchorWrapper;
|
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
2016-12-07 19:25:31 +01:00
|
|
|
|
/**
|
|
|
|
|
* Here we will draw buttons and add listeners to components
|
|
|
|
|
*/
|
2017-02-01 18:25:59 +01:00
|
|
|
|
settings.makeRemoveBlockButton = function () {
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
var removeBlockWrapper = editor.draw.node('SPAN', 'ce-toolbar__remove-btn', {}),
|
|
|
|
|
settingButton = editor.draw.node('SPAN', 'ce-toolbar__remove-setting', { innerHTML : '<i class="ce-icon-trash"></i>' }),
|
|
|
|
|
actionWrapper = editor.draw.node('DIV', 'ce-toolbar__remove-confirmation', {}),
|
|
|
|
|
confirmAction = editor.draw.node('DIV', 'ce-toolbar__remove-confirm', { textContent : 'Удалить блок' }),
|
|
|
|
|
cancelAction = editor.draw.node('DIV', 'ce-toolbar__remove-cancel', { textContent : 'Отмена' });
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-13 18:54:18 +01:00
|
|
|
|
editor.listeners.add(settingButton, 'click', editor.toolbar.settings.removeButtonClicked, false);
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-13 18:54:18 +01:00
|
|
|
|
editor.listeners.add(confirmAction, 'click', editor.toolbar.settings.confirmRemovingRequest, false);
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-13 18:54:18 +01:00
|
|
|
|
editor.listeners.add(cancelAction, 'click', editor.toolbar.settings.cancelRemovingRequest, false);
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
actionWrapper.appendChild(confirmAction);
|
|
|
|
|
actionWrapper.appendChild(cancelAction);
|
|
|
|
|
|
|
|
|
|
removeBlockWrapper.appendChild(settingButton);
|
|
|
|
|
removeBlockWrapper.appendChild(actionWrapper);
|
|
|
|
|
|
|
|
|
|
/** Save setting */
|
2017-02-01 18:25:59 +01:00
|
|
|
|
editor.toolbar.settings.setting = settingButton;
|
|
|
|
|
editor.toolbar.settings.actions = actionWrapper;
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
return removeBlockWrapper;
|
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
settings.removeButtonClicked = function () {
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
var action = editor.toolbar.settings.actions;
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
if (action.classList.contains('opened')) {
|
2017-02-01 18:25:59 +01:00
|
|
|
|
|
|
|
|
|
editor.toolbar.settings.hideRemoveActions();
|
|
|
|
|
|
2016-12-07 19:25:31 +01:00
|
|
|
|
} else {
|
2017-02-01 18:25:59 +01:00
|
|
|
|
|
|
|
|
|
editor.toolbar.settings.showRemoveActions();
|
|
|
|
|
|
2016-12-07 19:25:31 +01:00
|
|
|
|
}
|
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
editor.toolbar.toolbox.close();
|
|
|
|
|
editor.toolbar.settings.close();
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
settings.cancelRemovingRequest = function () {
|
|
|
|
|
|
|
|
|
|
editor.toolbar.settings.actions.classList.remove('opened');
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
settings.confirmRemovingRequest = function () {
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
var currentBlock = editor.content.currentNode,
|
2016-12-07 19:25:31 +01:00
|
|
|
|
firstLevelBlocksCount;
|
|
|
|
|
|
|
|
|
|
currentBlock.remove();
|
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
firstLevelBlocksCount = editor.nodes.redactor.childNodes.length;
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* If all blocks are removed
|
|
|
|
|
*/
|
|
|
|
|
if (firstLevelBlocksCount === 0) {
|
|
|
|
|
|
|
|
|
|
/** update currentNode variable */
|
2017-02-01 18:25:59 +01:00
|
|
|
|
editor.content.currentNode = null;
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
/** Inserting new empty initial block */
|
2017-02-01 18:25:59 +01:00
|
|
|
|
editor.ui.addInitialBlock();
|
|
|
|
|
|
2016-12-07 19:25:31 +01:00
|
|
|
|
}
|
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
editor.ui.saveInputs();
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
editor.toolbar.close();
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
settings.showRemoveActions = function () {
|
|
|
|
|
|
|
|
|
|
editor.toolbar.settings.actions.classList.add('opened');
|
|
|
|
|
|
2016-12-07 19:25:31 +01:00
|
|
|
|
};
|
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
settings.hideRemoveActions = function () {
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
editor.toolbar.settings.actions.classList.remove('opened');
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
return settings;
|
2016-12-07 19:25:31 +01:00
|
|
|
|
|
2017-02-01 18:25:59 +01:00
|
|
|
|
})({});
|