in same block by SHIFT+ENTER and forbids to prevent default browser behaviour\r\n */\r\n if ( event.shiftKey && !enableLineBreaks) {\r\n codex.callback.enterPressedOnBlock(codex.content.currentBlock, event);\r\n event.preventDefault();\r\n\r\n } else if ( (event.shiftKey && !enableLineBreaks) || (!event.shiftKey && enableLineBreaks) ){\r\n /** XOR */\r\n return;\r\n }\r\n\r\n var isLastTextNode = false,\r\n currentSelection = window.getSelection(),\r\n currentSelectedNode = currentSelection.anchorNode,\r\n caretAtTheEndOfText = codex.caret.position.atTheEnd(),\r\n isTextNodeHasParentBetweenContenteditable = false;\r\n\r\n /**\r\n * Workaround situation when caret at the Text node that has some wrapper Elements\r\n * Split block cant handle this.\r\n * We need to save default behavior\r\n */\r\n isTextNodeHasParentBetweenContenteditable = currentSelectedNode && currentSelectedNode.parentNode.contentEditable != \"true\";\r\n\r\n /**\r\n * Split blocks when input has several nodes and caret placed in textNode\r\n */\r\n if (\r\n currentSelectedNode.nodeType == codex.core.nodeTypes.TEXT &&\r\n !isTextNodeHasParentBetweenContenteditable &&\r\n !caretAtTheEndOfText\r\n ){\r\n\r\n event.preventDefault();\r\n\r\n codex.core.log('Splitting Text node...');\r\n\r\n codex.content.splitBlock(currentInputIndex);\r\n\r\n /** Show plus button when next input after split is empty*/\r\n if (!codex.state.inputs[currentInputIndex + 1].textContent.trim()) {\r\n codex.toolbar.showPlusButton();\r\n }\r\n\r\n } else {\r\n\r\n if ( currentSelectedNode && currentSelectedNode.parentNode) {\r\n\r\n isLastTextNode = !currentSelectedNode.parentNode.nextSibling;\r\n\r\n }\r\n\r\n if ( isLastTextNode && caretAtTheEndOfText ) {\r\n\r\n event.preventDefault();\r\n\r\n codex.core.log('ENTER clicked in last textNode. Create new BLOCK');\r\n\r\n codex.content.insertBlock({\r\n type : NEW_BLOCK_TYPE,\r\n block : codex.tools[NEW_BLOCK_TYPE].render()\r\n }, true );\r\n\r\n codex.toolbar.move();\r\n codex.toolbar.open();\r\n\r\n /** Show plus button with empty block */\r\n codex.toolbar.showPlusButton();\r\n\r\n } else {\r\n\r\n codex.core.log('Default ENTER behavior.');\r\n\r\n }\r\n\r\n }\r\n\r\n /** get all inputs after new appending block */\r\n codex.ui.saveInputs();\r\n\r\n };\r\n\r\n callbacks.escapeKeyPressed = function(event){\r\n\r\n /** Close all toolbar */\r\n codex.toolbar.close();\r\n\r\n /** Close toolbox */\r\n codex.toolbar.toolbox.close();\r\n\r\n event.preventDefault();\r\n\r\n };\r\n\r\n callbacks.arrowKeyPressed = function(event){\r\n\r\n codex.content.workingNodeChanged();\r\n\r\n /* Closing toolbar */\r\n codex.toolbar.close();\r\n codex.toolbar.move();\r\n\r\n };\r\n\r\n callbacks.defaultKeyPressed = function(event) {\r\n\r\n codex.toolbar.close();\r\n\r\n if (!codex.toolbar.inline.actionsOpened) {\r\n codex.toolbar.inline.close();\r\n codex.content.clearMark();\r\n }\r\n };\r\n\r\n callbacks.redactorClicked = function (event) {\r\n\r\n codex.content.workingNodeChanged(event.target);\r\n\r\n codex.ui.saveInputs();\r\n\r\n var selectedText = codex.toolbar.inline.getSelectionText();\r\n\r\n /**\r\n * If selection range took off, then we hide inline toolbar\r\n */\r\n if (selectedText.length === 0) {\r\n codex.toolbar.inline.close();\r\n }\r\n\r\n /** Update current input index in memory when caret focused into existed input */\r\n if (event.target.contentEditable == 'true') {\r\n\r\n codex.caret.saveCurrentInputIndex();\r\n\r\n }\r\n\r\n if (codex.content.currentNode === null) {\r\n\r\n /**\r\n * If inputs in redactor does not exits, then we put input index 0 not -1\r\n */\r\n var indexOfLastInput = codex.state.inputs.length > 0 ? codex.state.inputs.length - 1 : 0;\r\n\r\n /** If we have any inputs */\r\n if (codex.state.inputs.length) {\r\n\r\n /** getting firstlevel parent of input */\r\n var firstLevelBlock = codex.content.getFirstLevelBlock(codex.state.inputs[indexOfLastInput]);\r\n }\r\n\r\n /** If input is empty, then we set caret to the last input */\r\n if (codex.state.inputs.length && codex.state.inputs[indexOfLastInput].textContent === '' && firstLevelBlock.dataset.tool == 'paragraph') {\r\n\r\n codex.caret.setToBlock(indexOfLastInput);\r\n\r\n } else {\r\n\r\n /** Create new input when caret clicked in redactors area */\r\n var NEW_BLOCK_TYPE = 'paragraph';\r\n\r\n codex.content.insertBlock({\r\n type : NEW_BLOCK_TYPE,\r\n block : codex.tools[NEW_BLOCK_TYPE].render()\r\n });\r\n\r\n /** If there is no inputs except inserted */\r\n if (codex.state.inputs.length === 1) {\r\n\r\n codex.caret.setToBlock(indexOfLastInput);\r\n\r\n } else {\r\n\r\n /** Set caret to this appended input */\r\n codex.caret.setToNextBlock(indexOfLastInput);\r\n }\r\n }\r\n\r\n /**\r\n * Move toolbar to the right position and open\r\n */\r\n codex.toolbar.move();\r\n\r\n\r\n codex.toolbar.open();\r\n\r\n } else {\r\n\r\n /**\r\n * Move toolbar to the new position and open\r\n */\r\n codex.toolbar.move();\r\n\r\n codex.toolbar.open();\r\n\r\n /** Close all panels */\r\n codex.toolbar.settings.close();\r\n codex.toolbar.toolbox.close();\r\n }\r\n\r\n\r\n var inputIsEmpty = !codex.content.currentNode.textContent.trim();\r\n\r\n if (inputIsEmpty) {\r\n\r\n /** Show plus button */\r\n codex.toolbar.showPlusButton();\r\n\r\n } else {\r\n\r\n /** Hide plus buttons */\r\n codex.toolbar.hidePlusButton();\r\n\r\n }\r\n\r\n var currentNodeType = codex.content.currentNode.dataset.tool;\r\n\r\n /** Mark current block*/\r\n if (currentNodeType != 'paragraph' || !inputIsEmpty) {\r\n\r\n codex.content.markBlock();\r\n\r\n }\r\n\r\n };\r\n\r\n /**\r\n * This method allows to define, is caret in contenteditable element or not.\r\n * Otherwise, if we get TEXT node from range container, that will means we have input index.\r\n * In this case we use default browsers behaviour (if plugin allows that) or overwritten action.\r\n * Therefore, to be sure that we've clicked first-level block area, we should have currentNode, which always\r\n * specifies to the first-level block. Other cases we just ignore.\r\n */\r\n callbacks.clickedOnFirstLevelBlockArea = function() {\r\n\r\n var selection = window.getSelection(),\r\n anchorNode = selection.anchorNode,\r\n flag = false;\r\n\r\n\r\n if (selection.rangeCount == 0) {\r\n\r\n return true;\r\n\r\n } else {\r\n\r\n if (!codex.core.isDomNode(anchorNode)) {\r\n anchorNode = anchorNode.parentNode;\r\n }\r\n\r\n /** Already founded, without loop */\r\n if (anchorNode.contentEditable == 'true') {\r\n flag = true;\r\n }\r\n\r\n while (anchorNode.contentEditable != 'true') {\r\n anchorNode = anchorNode.parentNode;\r\n\r\n if (anchorNode.contentEditable == 'true') {\r\n flag = true;\r\n }\r\n\r\n if (anchorNode == document.body) {\r\n break;\r\n }\r\n }\r\n\r\n /** If editable element founded, flag is \"TRUE\", Therefore we return \"FALSE\" */\r\n return flag ? false : true;\r\n }\r\n\r\n };\r\n\r\n /**\r\n * Toolbar button click handler\r\n * @param this - cursor to the button\r\n */\r\n callbacks.toolbarButtonClicked = function (event) {\r\n\r\n var button = this;\r\n\r\n codex.toolbar.current = button.dataset.type;\r\n\r\n codex.toolbar.toolbox.toolClicked(event);\r\n codex.toolbar.close();\r\n\r\n };\r\n\r\n callbacks.redactorInputEvent = function (event) {\r\n\r\n /**\r\n * Clear previous sync-timeout\r\n */\r\n if (this.redactorSyncTimeout){\r\n clearTimeout(this.redactorSyncTimeout);\r\n }\r\n\r\n /**\r\n * Start waiting to input finish and sync redactor\r\n */\r\n this.redactorSyncTimeout = setTimeout(function() {\r\n\r\n codex.content.sync();\r\n\r\n }, 500);\r\n\r\n };\r\n\r\n /** Show or Hide toolbox when plus button is clicked */\r\n callbacks.plusButtonClicked = function() {\r\n\r\n if (!codex.nodes.toolbox.classList.contains('opened')) {\r\n\r\n codex.toolbar.toolbox.open();\r\n\r\n } else {\r\n\r\n codex.toolbar.toolbox.close();\r\n\r\n }\r\n };\r\n\r\n /**\r\n * Block handlers for KeyDown events\r\n */\r\n callbacks.blockKeydown = function(event, block) {\r\n\r\n switch (event.keyCode){\r\n\r\n case codex.core.keys.DOWN:\r\n case codex.core.keys.RIGHT:\r\n codex.callback.blockRightOrDownArrowPressed(block);\r\n break;\r\n\r\n case codex.core.keys.BACKSPACE:\r\n codex.callback.backspacePressed(block);\r\n break;\r\n\r\n case codex.core.keys.UP:\r\n case codex.core.keys.LEFT:\r\n codex.callback.blockLeftOrUpArrowPressed(block);\r\n break;\r\n\r\n }\r\n };\r\n\r\n /**\r\n * RIGHT or DOWN keydowns on block\r\n */\r\n callbacks.blockRightOrDownArrowPressed = function (block) {\r\n\r\n var selection = window.getSelection(),\r\n inputs = codex.state.inputs,\r\n focusedNode = selection.anchorNode,\r\n focusedNodeHolder;\r\n\r\n /** Check for caret existance */\r\n if (!focusedNode){\r\n return false;\r\n }\r\n\r\n /** Looking for closest (parent) contentEditable element of focused node */\r\n while (focusedNode.contentEditable != 'true') {\r\n\r\n focusedNodeHolder = focusedNode.parentNode;\r\n focusedNode = focusedNodeHolder;\r\n }\r\n\r\n /** Input index in DOM level */\r\n var editableElementIndex = 0;\r\n while (focusedNode != inputs[editableElementIndex]) {\r\n editableElementIndex ++;\r\n }\r\n\r\n /**\r\n * Founded contentEditable element doesn't have childs\r\n * Or maybe New created block\r\n */\r\n if (!focusedNode.textContent)\r\n {\r\n codex.caret.setToNextBlock(editableElementIndex);\r\n return;\r\n }\r\n\r\n /**\r\n * Do nothing when caret doesn not reaches the end of last child\r\n */\r\n var caretInLastChild = false,\r\n caretAtTheEndOfText = false;\r\n\r\n var lastChild,\r\n deepestTextnode;\r\n\r\n lastChild = focusedNode.childNodes[focusedNode.childNodes.length - 1 ];\r\n\r\n if (codex.core.isDomNode(lastChild)) {\r\n\r\n deepestTextnode = codex.content.getDeepestTextNodeFromPosition(lastChild, lastChild.childNodes.length);\r\n\r\n } else {\r\n\r\n deepestTextnode = lastChild;\r\n\r\n }\r\n\r\n caretInLastChild = selection.anchorNode == deepestTextnode;\r\n caretAtTheEndOfText = deepestTextnode.length == selection.anchorOffset;\r\n\r\n if ( !caretInLastChild || !caretAtTheEndOfText ) {\r\n codex.core.log('arrow [down|right] : caret does not reached the end');\r\n return false;\r\n }\r\n\r\n codex.caret.setToNextBlock(editableElementIndex);\r\n\r\n };\r\n\r\n /**\r\n * LEFT or UP keydowns on block\r\n */\r\n callbacks.blockLeftOrUpArrowPressed = function (block) {\r\n\r\n var selection = window.getSelection(),\r\n inputs = codex.state.inputs,\r\n focusedNode = selection.anchorNode,\r\n focusedNodeHolder;\r\n\r\n /** Check for caret existance */\r\n if (!focusedNode){\r\n return false;\r\n }\r\n\r\n /**\r\n * LEFT or UP not at the beginning\r\n */\r\n if ( selection.anchorOffset !== 0) {\r\n return false;\r\n }\r\n\r\n /** Looking for parent contentEditable block */\r\n while (focusedNode.contentEditable != 'true') {\r\n focusedNodeHolder = focusedNode.parentNode;\r\n focusedNode = focusedNodeHolder;\r\n }\r\n\r\n /** Input index in DOM level */\r\n var editableElementIndex = 0;\r\n while (focusedNode != inputs[editableElementIndex]) {\r\n editableElementIndex ++;\r\n }\r\n\r\n /**\r\n * Do nothing if caret is not at the beginning of first child\r\n */\r\n var caretInFirstChild = false,\r\n caretAtTheBeginning = false;\r\n\r\n var firstChild,\r\n deepestTextnode;\r\n\r\n /**\r\n * Founded contentEditable element doesn't have childs\r\n * Or maybe New created block\r\n */\r\n if (!focusedNode.textContent) {\r\n codex.caret.setToPreviousBlock(editableElementIndex);\r\n return;\r\n }\r\n\r\n firstChild = focusedNode.childNodes[0];\r\n\r\n if (codex.core.isDomNode(firstChild)) {\r\n\r\n deepestTextnode = codex.content.getDeepestTextNodeFromPosition(firstChild, 0);\r\n\r\n } else {\r\n\r\n deepestTextnode = firstChild;\r\n\r\n }\r\n\r\n caretInFirstChild = selection.anchorNode == deepestTextnode;\r\n caretAtTheBeginning = selection.anchorOffset === 0;\r\n\r\n if ( caretInFirstChild && caretAtTheBeginning ) {\r\n\r\n codex.caret.setToPreviousBlock(editableElementIndex);\r\n\r\n }\r\n\r\n };\r\n\r\n /**\r\n * Callback for enter key pressing in first-level block area\r\n */\r\n callbacks.enterPressedOnBlock = function (event) {\r\n\r\n var NEW_BLOCK_TYPE = 'paragraph';\r\n\r\n codex.content.insertBlock({\r\n type : NEW_BLOCK_TYPE,\r\n block : codex.tools[NEW_BLOCK_TYPE].render()\r\n }, true );\r\n\r\n codex.toolbar.move();\r\n codex.toolbar.open();\r\n\r\n };\r\n\r\n callbacks.backspacePressed = function (block) {\r\n\r\n var currentInputIndex = codex.caret.getCurrentInputIndex(),\r\n range,\r\n selectionLength,\r\n firstLevelBlocksCount;\r\n\r\n if (block.textContent.trim()) {\r\n\r\n range = codex.content.getRange();\r\n selectionLength = range.endOffset - range.startOffset;\r\n\r\n\r\n if (codex.caret.position.atStart() && !selectionLength && codex.state.inputs[currentInputIndex - 1]) {\r\n\r\n codex.content.mergeBlocks(currentInputIndex);\r\n\r\n } else {\r\n\r\n return;\r\n\r\n }\r\n }\r\n\r\n if (!selectionLength) {\r\n block.remove();\r\n }\r\n\r\n\r\n firstLevelBlocksCount = codex.nodes.redactor.childNodes.length;\r\n\r\n /**\r\n * If all blocks are removed\r\n */\r\n if (firstLevelBlocksCount === 0) {\r\n\r\n /** update currentNode variable */\r\n codex.content.currentNode = null;\r\n\r\n /** Inserting new empty initial block */\r\n codex.ui.addInitialBlock();\r\n\r\n /** Updating inputs state after deleting last block */\r\n codex.ui.saveInputs();\r\n\r\n /** Set to current appended block */\r\n setTimeout(function () {\r\n\r\n codex.caret.setToPreviousBlock(1);\r\n\r\n }, 10);\r\n\r\n } else {\r\n\r\n if (codex.caret.inputIndex !== 0) {\r\n\r\n /** Target block is not first */\r\n codex.caret.setToPreviousBlock(codex.caret.inputIndex);\r\n\r\n } else {\r\n\r\n /** If we try to delete first block */\r\n codex.caret.setToNextBlock(codex.caret.inputIndex);\r\n\r\n }\r\n }\r\n\r\n codex.toolbar.move();\r\n\r\n if (!codex.toolbar.opened) {\r\n codex.toolbar.open();\r\n }\r\n\r\n /** Updating inputs state */\r\n codex.ui.saveInputs();\r\n\r\n /** Prevent default browser behaviour */\r\n event.preventDefault();\r\n\r\n };\r\n\r\n callbacks.blockPaste = function(event) {\r\n\r\n var currentInputIndex = codex.caret.getCurrentInputIndex(),\r\n node = codex.state.inputs[currentInputIndex];\r\n\r\n setTimeout(function() {\r\n\r\n codex.content.sanitize(node);\r\n\r\n }, 10);\r\n\r\n };\r\n\r\n callbacks._blockPaste = function(event) {\r\n\r\n var currentInputIndex = codex.caret.getCurrentInputIndex();\r\n\r\n /**\r\n * create an observer instance\r\n */\r\n var observer = new MutationObserver(codex.callback.handlePasteEvents);\r\n\r\n /**\r\n * configuration of the observer:\r\n */\r\n var config = { attributes: true, childList: true, characterData: false };\r\n\r\n // pass in the target node, as well as the observer options\r\n observer.observe(codex.state.inputs[currentInputIndex], config);\r\n };\r\n\r\n /**\r\n * Sends all mutations to paste handler\r\n */\r\n callbacks.handlePasteEvents = function(mutations) {\r\n mutations.forEach(codex.content.paste);\r\n };\r\n\r\n /**\r\n * Clicks on block settings button\r\n */\r\n callbacks.showSettingsButtonClicked = function(){\r\n\r\n /**\r\n * Get type of current block\r\n * It uses to append settings from tool.settings property.\r\n * ...\r\n * Type is stored in data-type attribute on block\r\n */\r\n var currentToolType = codex.content.currentNode.dataset.tool;\r\n\r\n codex.toolbar.settings.toggle(currentToolType);\r\n\r\n /** Close toolbox when settings button is active */\r\n codex.toolbar.toolbox.close();\r\n codex.toolbar.settings.hideRemoveActions();\r\n\r\n };\r\n\r\n return callbacks;\r\n\r\n})({});\r\n\r\nmodule.exports = callbacks;\r\n\n\n\n// WEBPACK FOOTER //\n// ./modules/callbacks.js","var draw = (function(draw) {\r\n\r\n /**\r\n * Base editor wrapper\r\n */\r\n draw.wrapper = function () {\r\n\r\n var wrapper = document.createElement('div');\r\n\r\n wrapper.className += 'codex-editor';\r\n\r\n return wrapper;\r\n\r\n };\r\n\r\n /**\r\n * Content-editable holder\r\n */\r\n draw.redactor = function () {\r\n\r\n var redactor = document.createElement('div');\r\n\r\n redactor.className += 'ce-redactor';\r\n\r\n return redactor;\r\n\r\n };\r\n\r\n draw.ceBlock = function() {\r\n\r\n var block = document.createElement('DIV');\r\n\r\n block.className += 'ce_block';\r\n\r\n return block;\r\n\r\n };\r\n\r\n /**\r\n * Empty toolbar with toggler\r\n */\r\n draw.toolbar = function () {\r\n\r\n var bar = document.createElement('div');\r\n\r\n bar.className += 'ce-toolbar';\r\n\r\n return bar;\r\n };\r\n\r\n draw.toolbarContent = function() {\r\n\r\n var wrapper = document.createElement('DIV');\r\n wrapper.classList.add('ce-toolbar__content');\r\n\r\n return wrapper;\r\n };\r\n\r\n /**\r\n * Inline toolbar\r\n */\r\n draw.inlineToolbar = function() {\r\n\r\n var bar = document.createElement('DIV');\r\n\r\n bar.className += 'ce-toolbar-inline';\r\n\r\n return bar;\r\n\r\n };\r\n\r\n /**\r\n * Wrapper for inline toobar buttons\r\n */\r\n draw.inlineToolbarButtons = function() {\r\n\r\n var wrapper = document.createElement('DIV');\r\n\r\n wrapper.className += 'ce-toolbar-inline__buttons';\r\n\r\n return wrapper;\r\n };\r\n\r\n /**\r\n * For some actions\r\n */\r\n draw.inlineToolbarActions = function() {\r\n\r\n var wrapper = document.createElement('DIV');\r\n\r\n wrapper.className += 'ce-toolbar-inline__actions';\r\n\r\n return wrapper;\r\n\r\n };\r\n\r\n draw.inputForLink = function() {\r\n\r\n var input = document.createElement('INPUT');\r\n\r\n input.type = 'input';\r\n input.className += 'inputForLink';\r\n input.placeholder = 'Type URL ...';\r\n input.setAttribute('form', 'defaultForm');\r\n\r\n input.setAttribute('autofocus', 'autofocus');\r\n\r\n return input;\r\n\r\n };\r\n\r\n /**\r\n * Block with notifications\r\n */\r\n draw.alertsHolder = function() {\r\n\r\n var block = document.createElement('div');\r\n\r\n block.classList.add('ce_notifications-block');\r\n\r\n return block;\r\n\r\n };\r\n\r\n /**\r\n * @todo Desc\r\n */\r\n draw.blockButtons = function() {\r\n\r\n var block = document.createElement('div');\r\n\r\n block.className += 'ce-toolbar__actions';\r\n\r\n return block;\r\n };\r\n\r\n /**\r\n * Block settings panel\r\n */\r\n draw.blockSettings = function () {\r\n\r\n var settings = document.createElement('div');\r\n\r\n settings.className += 'ce-settings';\r\n\r\n return settings;\r\n };\r\n\r\n draw.defaultSettings = function() {\r\n\r\n var div = document.createElement('div');\r\n\r\n div.classList.add('ce-settings_default');\r\n\r\n return div;\r\n },\r\n\r\n draw.pluginsSettings = function() {\r\n\r\n var div = document.createElement('div');\r\n\r\n div.classList.add('ce-settings_plugin');\r\n\r\n return div;\r\n\r\n };\r\n\r\n draw.plusButton = function() {\r\n\r\n var button = document.createElement('span');\r\n\r\n button.className = 'ce-toolbar__plus';\r\n // button.innerHTML = '';\r\n\r\n return button;\r\n };\r\n\r\n /**\r\n * Settings button in toolbar\r\n */\r\n draw.settingsButton = function () {\r\n\r\n var toggler = document.createElement('span');\r\n\r\n toggler.className = 'ce-toolbar__settings-btn';\r\n\r\n /** Toggler button*/\r\n toggler.innerHTML = '';\r\n\r\n return toggler;\r\n };\r\n\r\n /**\r\n * Redactor tools wrapper\r\n */\r\n\r\n draw.toolbox = function() {\r\n\r\n var wrapper = document.createElement('div');\r\n\r\n wrapper.className = 'ce-toolbar__tools';\r\n\r\n return wrapper;\r\n };\r\n\r\n /**\r\n * @protected\r\n *\r\n * Draws tool buttons for toolbox\r\n *\r\n * @param {String} type\r\n * @param {String} classname\r\n * @returns {Element}\r\n */\r\n draw.toolbarButton = function (type, classname) {\r\n\r\n var button = document.createElement(\"li\"),\r\n tool_icon = document.createElement(\"i\"),\r\n tool_title = document.createElement(\"span\");\r\n\r\n button.dataset.type = type;\r\n button.setAttribute('title', type);\r\n\r\n tool_icon.classList.add(classname);\r\n tool_title.classList.add('ce_toolbar_tools--title');\r\n\r\n\r\n button.appendChild(tool_icon);\r\n button.appendChild(tool_title);\r\n\r\n return button;\r\n\r\n };\r\n\r\n /**\r\n * @protected\r\n *\r\n * Draws tools for inline toolbar\r\n *\r\n * @param {String} type\r\n * @param {String} classname\r\n */\r\n draw.toolbarButtonInline = function(type, classname) {\r\n var button = document.createElement(\"BUTTON\"),\r\n tool_icon = document.createElement(\"I\");\r\n\r\n button.type = \"button\";\r\n button.dataset.type = type;\r\n tool_icon.classList.add(classname);\r\n\r\n button.appendChild(tool_icon);\r\n\r\n return button;\r\n };\r\n\r\n /**\r\n * Redactor block\r\n */\r\n draw.block = function (tagName, content) {\r\n\r\n var node = document.createElement(tagName);\r\n\r\n node.innerHTML = content || '';\r\n\r\n return node;\r\n\r\n };\r\n\r\n /**\r\n * Creates Node with passed tagName and className\r\n * @param {string} tagName\r\n * @param {string} className\r\n * @param {object} properties - allow to assign properties\r\n */\r\n draw.node = function( tagName , className , properties ){\r\n\r\n var el = document.createElement( tagName );\r\n\r\n if ( className ) el.className = className;\r\n\r\n if ( properties ) {\r\n\r\n for (var name in properties){\r\n el[name] = properties[name];\r\n }\r\n }\r\n\r\n return el;\r\n };\r\n\r\n draw.pluginsRender = function(type, content) {\r\n\r\n return {\r\n type : type,\r\n block : cEditor.tools[type].render({\r\n text : content\r\n })\r\n };\r\n };\r\n\r\n return draw;\r\n\r\n})({});\r\n\r\nmodule.exports = draw;\r\n\r\n\r\n\n\n\n// WEBPACK FOOTER //\n// ./modules/draw.js","var caret = (function(caret) {\r\n\r\n /**\r\n * @var {int} InputIndex - editable element in DOM\r\n */\r\n caret.inputIndex = null;\r\n\r\n /**\r\n * @var {int} offset - caret position in a text node.\r\n */\r\n caret.offset = null;\r\n\r\n /**\r\n * @var {int} focusedNodeIndex - we get index of child node from first-level block\r\n */\r\n caret.focusedNodeIndex = null;\r\n\r\n /**\r\n * Creates Document Range and sets caret to the element.\r\n * @protected\r\n * @uses caret.save — if you need to save caret position\r\n * @param {Element} el - Changed Node.\r\n */\r\n caret.set = function( el , index, offset) {\r\n\r\n offset = offset || this.offset || 0;\r\n index = index || this.focusedNodeIndex || 0;\r\n\r\n var childs = el.childNodes,\r\n nodeToSet;\r\n\r\n if ( childs.length === 0 ) {\r\n\r\n nodeToSet = el;\r\n\r\n } else {\r\n\r\n nodeToSet = childs[index];\r\n\r\n }\r\n\r\n /** If Element is INPUT */\r\n if (el.tagName == 'INPUT') {\r\n el.focus();\r\n return;\r\n }\r\n\r\n if (codex.core.isDomNode(nodeToSet)) {\r\n\r\n nodeToSet = codex.content.getDeepestTextNodeFromPosition(nodeToSet, nodeToSet.childNodes.length);\r\n }\r\n\r\n var range = document.createRange(),\r\n selection = window.getSelection();\r\n\r\n setTimeout(function() {\r\n\r\n range.setStart(nodeToSet, offset);\r\n range.setEnd(nodeToSet, offset);\r\n\r\n selection.removeAllRanges();\r\n selection.addRange(range);\r\n\r\n codex.caret.saveCurrentInputIndex();\r\n\r\n }, 20);\r\n };\r\n\r\n /**\r\n * @protected\r\n * Updates index of input and saves it in caret object\r\n */\r\n caret.saveCurrentInputIndex = function () {\r\n\r\n /** Index of Input that we paste sanitized content */\r\n var selection = window.getSelection(),\r\n inputs = codex.state.inputs,\r\n focusedNode = selection.anchorNode,\r\n focusedNodeHolder;\r\n\r\n if (!focusedNode){\r\n return;\r\n }\r\n\r\n /** Looking for parent contentEditable block */\r\n while (focusedNode.contentEditable != 'true') {\r\n focusedNodeHolder = focusedNode.parentNode;\r\n focusedNode = focusedNodeHolder;\r\n }\r\n\r\n /** Input index in DOM level */\r\n var editableElementIndex = 0;\r\n\r\n while (focusedNode != inputs[editableElementIndex]) {\r\n editableElementIndex ++;\r\n }\r\n\r\n this.inputIndex = editableElementIndex;\r\n };\r\n\r\n /**\r\n * Returns current input index (caret object)\r\n */\r\n caret.getCurrentInputIndex = function() {\r\n return this.inputIndex;\r\n };\r\n\r\n /**\r\n * @param {int} index - index of first-level block after that we set caret into next input\r\n */\r\n caret.setToNextBlock = function(index) {\r\n\r\n var inputs = codex.state.inputs,\r\n nextInput = inputs[index + 1];\r\n\r\n if (!nextInput) {\r\n codex.core.log('We are reached the end');\r\n return;\r\n }\r\n\r\n /**\r\n * When new Block created or deleted content of input\r\n * We should add some text node to set caret\r\n */\r\n if (!nextInput.childNodes.length) {\r\n var emptyTextElement = document.createTextNode('');\r\n nextInput.appendChild(emptyTextElement);\r\n }\r\n\r\n codex.caret.inputIndex = index + 1;\r\n codex.caret.set(nextInput, 0, 0);\r\n codex.content.workingNodeChanged(nextInput);\r\n\r\n };\r\n\r\n /**\r\n * @param {int} index - index of target input.\r\n * Sets caret to input with this index\r\n */\r\n caret.setToBlock = function(index) {\r\n\r\n var inputs = codex.state.inputs,\r\n targetInput = inputs[index];\r\n\r\n console.assert( targetInput , 'caret.setToBlock: target input does not exists');\r\n\r\n if ( !targetInput ) {\r\n return;\r\n }\r\n\r\n /**\r\n * When new Block created or deleted content of input\r\n * We should add some text node to set caret\r\n */\r\n if (!targetInput.childNodes.length) {\r\n var emptyTextElement = document.createTextNode('');\r\n targetInput.appendChild(emptyTextElement);\r\n }\r\n\r\n codex.caret.inputIndex = index;\r\n codex.caret.set(targetInput, 0, 0);\r\n codex.content.workingNodeChanged(targetInput);\r\n\r\n };\r\n\r\n /**\r\n * @param {int} index - index of input\r\n */\r\n caret.setToPreviousBlock = function(index) {\r\n\r\n index = index || 0;\r\n\r\n var inputs = codex.state.inputs,\r\n previousInput = inputs[index - 1],\r\n lastChildNode,\r\n lengthOfLastChildNode,\r\n emptyTextElement;\r\n\r\n\r\n if (!previousInput) {\r\n codex.core.log('We are reached first node');\r\n return;\r\n }\r\n\r\n lastChildNode = codex.content.getDeepestTextNodeFromPosition(previousInput, previousInput.childNodes.length);\r\n lengthOfLastChildNode = lastChildNode.length;\r\n\r\n /**\r\n * When new Block created or deleted content of input\r\n * We should add some text node to set caret\r\n */\r\n if (!previousInput.childNodes.length) {\r\n\r\n emptyTextElement = document.createTextNode('');\r\n previousInput.appendChild(emptyTextElement);\r\n }\r\n codex.caret.inputIndex = index - 1;\r\n codex.caret.set(previousInput, previousInput.childNodes.length - 1, lengthOfLastChildNode);\r\n codex.content.workingNodeChanged(inputs[index - 1]);\r\n };\r\n\r\n caret.position = {\r\n\r\n atStart : function() {\r\n\r\n var selection = window.getSelection(),\r\n anchorOffset = selection.anchorOffset,\r\n anchorNode = selection.anchorNode,\r\n firstLevelBlock = codex.content.getFirstLevelBlock(anchorNode),\r\n pluginsRender = firstLevelBlock.childNodes[0];\r\n\r\n if (!codex.core.isDomNode(anchorNode)) {\r\n anchorNode = anchorNode.parentNode;\r\n }\r\n\r\n var isFirstNode = anchorNode === pluginsRender.childNodes[0],\r\n isOffsetZero = anchorOffset === 0;\r\n\r\n return isFirstNode && isOffsetZero;\r\n\r\n },\r\n\r\n atTheEnd : function() {\r\n\r\n var selection = window.getSelection(),\r\n anchorOffset = selection.anchorOffset,\r\n anchorNode = selection.anchorNode;\r\n\r\n /** Caret is at the end of input */\r\n return !anchorNode || !anchorNode.length || anchorOffset === anchorNode.length;\r\n }\r\n };\r\n\r\n return caret;\r\n\r\n})({});\r\n\r\nmodule.exports = caret;\n\n\n// WEBPACK FOOTER //\n// ./modules/caret.js","var notifications = (function(notifications) {\r\n\r\n /**\r\n * Error notificator. Shows block with message\r\n * @protected\r\n */\r\n notifications.errorThrown = function(errorMsg, event) {\r\n\r\n codex.notifications.send('This action is not available currently', event.type, false);\r\n\r\n };\r\n\r\n /**\r\n * Appends notification with different types\r\n * @param message {string} - Error or alert message\r\n * @param type {string} - Type of message notification. Ex: Error, Warning, Danger ...\r\n * @param append {boolean} - can be True or False when notification should be inserted after\r\n */\r\n notifications.send = function(message, type, append) {\r\n\r\n var notification = codex.draw.block('div');\r\n\r\n notification.textContent = message;\r\n notification.classList.add('ce_notification-item', 'ce_notification-' + type, 'flipInX');\r\n\r\n if (!append) {\r\n codex.nodes.notifications.innerHTML = '';\r\n }\r\n\r\n codex.nodes.notifications.appendChild(notification);\r\n\r\n setTimeout(function () {\r\n notification.remove();\r\n }, 3000);\r\n\r\n };\r\n\r\n return notifications;\r\n\r\n})({});\r\n\r\nmodule.exports = notifications;\n\n\n// WEBPACK FOOTER //\n// ./modules/notifications.js","var parser = (function(parser) {\r\n\r\n /**\r\n * Splits content by `\\n` and returns blocks\r\n */\r\n parser.getSeparatedTextFromContent = function(content) {\r\n return content.split('\\n');\r\n };\r\n\r\n /** inserting text */\r\n parser.insertPastedContent = function(content) {\r\n\r\n var blocks = this.getSeparatedTextFromContent(content),\r\n i,\r\n inputIndex = cEditor.caret.getCurrentInputIndex(),\r\n textNode,\r\n parsedTextContent;\r\n\r\n for(i = 0; i < blocks.length; i++) {\r\n\r\n blocks[i].trim();\r\n\r\n if (blocks[i]) {\r\n var data = cEditor.draw.pluginsRender('paragraph', blocks[i]);\r\n cEditor.content.insertBlock(data);\r\n }\r\n }\r\n\r\n };\r\n\r\n /**\r\n * Asynchronously parses textarea input string to HTML editor blocks\r\n */\r\n parser.parseTextareaContent = function () {\r\n\r\n var initialContent = cEditor.nodes.textarea.value;\r\n\r\n if ( initialContent.trim().length === 0 ) return true;\r\n\r\n\r\n cEditor.parser\r\n\r\n /** Get child nodes async-aware */\r\n .getNodesFromString(initialContent)\r\n\r\n /** Then append nodes to the redactor */\r\n .then(cEditor.parser.appendNodesToRedactor)\r\n\r\n /** Write log if something goes wrong */\r\n .catch(function(error) {\r\n cEditor.core.log('Error while parsing content: %o', 'warn', error);\r\n });\r\n\r\n };\r\n\r\n /**\r\n * Parses string to nodeList\r\n * @param string inputString\r\n * @return Primise -> nodeList\r\n */\r\n parser.getNodesFromString = function (inputString) {\r\n\r\n return Promise.resolve().then(function() {\r\n\r\n var contentHolder = document.createElement('div');\r\n\r\n contentHolder.innerHTML = inputString;\r\n\r\n /**\r\n * Returning childNodes will include:\r\n * - Elements (html-tags),\r\n * - Texts (empty-spaces or non-wrapped strings )\r\n * - Comments and other\r\n */\r\n return contentHolder.childNodes;\r\n\r\n });\r\n };\r\n\r\n /**\r\n * Appends nodes to the redactor\r\n * @param nodeList nodes - list for nodes to append\r\n */\r\n parser.appendNodesToRedactor = function(nodes) {\r\n\r\n /**\r\n * Sequence of one-by-one nodes appending\r\n * Uses to save blocks order after async-handler\r\n */\r\n var nodeSequence = Promise.resolve();\r\n\r\n\r\n for (var index = 0; index < nodes.length ; index++ ) {\r\n\r\n /** Add node to sequence at specified index */\r\n cEditor.parser.appendNodeAtIndex(nodeSequence, nodes, index);\r\n\r\n }\r\n\r\n };\r\n\r\n /**\r\n * Append node at specified index\r\n */\r\n parser.appendNodeAtIndex = function (nodeSequence, nodes, index) {\r\n\r\n /** We need to append node to sequence */\r\n nodeSequence\r\n\r\n /** first, get node async-aware */\r\n .then(function() {\r\n\r\n return cEditor.parser.getNodeAsync(nodes , index);\r\n\r\n })\r\n\r\n /**\r\n * second, compose editor-block from node\r\n * and append it to redactor\r\n */\r\n .then(function(node){\r\n\r\n var block = cEditor.parser.createBlockByDomNode(node);\r\n\r\n if ( cEditor.core.isDomNode(block) ) {\r\n\r\n block.contentEditable = \"true\";\r\n\r\n /** Mark node as redactor block*/\r\n block.classList.add('ce-block');\r\n\r\n /** Append block to the redactor */\r\n cEditor.nodes.redactor.appendChild(block);\r\n\r\n /** Save block to the cEditor.state array */\r\n cEditor.state.blocks.push(block);\r\n\r\n return block;\r\n\r\n }\r\n return null;\r\n })\r\n\r\n .then(cEditor.ui.addBlockHandlers)\r\n\r\n /** Log if something wrong with node */\r\n .catch(function(error) {\r\n cEditor.core.log('Node skipped while parsing because %o', 'warn', error);\r\n });\r\n\r\n };\r\n\r\n /**\r\n * Asynchronously returns node from nodeList by index\r\n * @return Promise to node\r\n */\r\n parser.getNodeAsync = function (nodeList, index) {\r\n\r\n return Promise.resolve().then(function() {\r\n\r\n return nodeList.item(index);\r\n\r\n });\r\n };\r\n\r\n /**\r\n * Creates editor block by DOM node\r\n *\r\n * First-level blocks (see cEditor.settings.blockTags) saves as-is,\r\n * other wrapps with
-tag\r\n *\r\n * @param DOMnode node\r\n * @return First-level node (paragraph)\r\n */\r\n parser.createBlockByDomNode = function (node) {\r\n\r\n /** First level nodes already appears as blocks */\r\n if ( cEditor.parser.isFirstLevelBlock(node) ){\r\n\r\n /** Save plugin type in data-type */\r\n node = this.storeBlockType(node);\r\n\r\n return node;\r\n }\r\n\r\n /** Other nodes wraps into parent block (paragraph-tag) */\r\n var parentBlock,\r\n nodeContent = node.textContent.trim(),\r\n isPlainTextNode = node.nodeType != cEditor.core.nodeTypes.TAG;\r\n\r\n\r\n /** Skip empty textNodes with space-symbols */\r\n if (isPlainTextNode && !nodeContent.length) return null;\r\n\r\n /** Make
tag */\r\n parentBlock = cEditor.draw.block('P');\r\n\r\n if (isPlainTextNode){\r\n parentBlock.textContent = nodeContent.replace(/(\\s){2,}/, '$1'); // remove double spaces\r\n } else {\r\n parentBlock.appendChild(node);\r\n }\r\n\r\n /** Save plugin type in data-type */\r\n parentBlock = this.storeBlockType(parentBlock);\r\n\r\n return parentBlock;\r\n\r\n };\r\n\r\n /**\r\n * It's a crutch\r\n * - - - - - - -\r\n * We need block type stored as data-attr\r\n * Now supports only simple blocks : P, HEADER, QUOTE, CODE\r\n * Remove it after updating parser module for the block-oriented structure:\r\n * - each block must have stored type\r\n * @param {Element} node\r\n */\r\n parser.storeBlockType = function (node) {\r\n\r\n switch (node.tagName) {\r\n case 'P' : node.dataset.tool = 'paragraph'; break;\r\n case 'H1':\r\n case 'H2':\r\n case 'H3':\r\n case 'H4':\r\n case 'H5':\r\n case 'H6': node.dataset.tool = 'header'; break;\r\n case 'BLOCKQUOTE': node.dataset.tool = 'quote'; break;\r\n case 'CODE': node.dataset.tool = 'code'; break;\r\n }\r\n\r\n return node;\r\n\r\n };\r\n\r\n /**\r\n * Check DOM node for display style: separated block or child-view\r\n */\r\n parser.isFirstLevelBlock = function (node) {\r\n\r\n return node.nodeType == cEditor.core.nodeTypes.TAG &&\r\n node.classList.contains(cEditor.ui.className.BLOCK_CLASSNAME);\r\n\r\n };\r\n\r\n return parser;\r\n\r\n})({});\r\n\r\nmodule.exports = parser;\r\n\n\n\n// WEBPACK FOOTER //\n// ./modules/parser.js"],"sourceRoot":""}