diff --git a/plugins/quiqqer/quiqqerBricks/plugin.js b/plugins/quiqqer/quiqqerBricks/plugin.js index 53297f4b395b03958e2a642a999ec580c7e63776..1e2c54c3f4d0fb8533e733875db135b53f9fc4fb 100644 --- a/plugins/quiqqer/quiqqerBricks/plugin.js +++ b/plugins/quiqqer/quiqqerBricks/plugin.js @@ -115,17 +115,24 @@ return; } + var sel = new CKEDITOR.dom.selection(editor.document); + // edit element.addEventListener('click', function (e) { var Target = e.target; + var Brick = Target; + + if (!Brick.classList.contains('quiqqer_bricks_placeholder')) { + Brick = Target.closest('.quiqqer_bricks_placeholder'); + } // delete brick if (Target.name === 'delete') { e.preventDefault(); - - var Brick = e.target.closest('.quiqqer_bricks_placeholder'); - Brick.parentNode.removeChild(Brick); + Brick.parentNode.removeChild(Brick) } + + //sel.selectElement(editor.document.body); }); // element.addEventListener('focus', function () { @@ -150,15 +157,17 @@ if (!Info) { Info = doc.createElement('div'); Info.classList.add('quiqqer_bricks_placeholder_info'); + Info.contentEditable = false; element.appendChild(Info); } if (!Settings) { - Settings = doc.createElement('div'); - Settings.innerHTML = '<button name="delete">x</button>'; - Settings.classList.add('quiqqer_bricks_placeholder_settings'); + Settings = doc.createElement('div'); + Settings.innerHTML = '<button name="delete">x</button>'; + Settings.contentEditable = false; + Settings.classList.add('quiqqer_bricks_placeholder_settings'); element.appendChild(Settings); } @@ -183,13 +192,13 @@ }; // add ckeditor - window.CKEDITOR.plugins.add('quiqqerBricks', { + CKEDITOR.plugins.add('quiqqerBricks', { icons: "icon", lang : ['en', 'de'], onLoad: function () { // Register styles for placeholder widget frame. - window.CKEDITOR.addCss( + CKEDITOR.addCss( '.quiqqer_bricks_placeholder {' + ' cursor: pointer;' + ' display: inline-block;' + @@ -207,6 +216,9 @@ ' position: absolute;' + ' pointer-events: none;' + ' top: 10px;' + + ' user-select: none;' + + ' -webkit-user-select:none;' + + ' -moz-user-select:none;' + '}' + '' + '.quiqqer_bricks_placeholder_settings {' + @@ -273,7 +285,7 @@ result = data.replace( /{{brick ([^}}]*)}}/g, function (match) { - match = match.replace('{{brick ', ''); + match = match.replace('{{brick ', '') match = match.replace('}}', ''); match = match.trim(); match = match.split(' '); @@ -288,7 +300,10 @@ } if ("id" in attributes) { - return '<cke:object class="quiqqer_bricks_placeholder" ' + + return '<cke:object ' + + 'contenteditable="false" ' + + 'data-cke-widget-wrapper="1" ' + + 'class="quiqqer_bricks_placeholder cke_widget_wrapper cke_widget_inline" ' + 'data-brickid="' + attributes.id + '"' + '></cke:object>'; } @@ -342,7 +357,8 @@ editor.insertHtml( '<div class="quiqqer_bricks_placeholder" ' + ' data-brickid="' + brickId + '"' + - '> </div>' + '> </div>' + + '<p> </p>' ); var i, len, o; @@ -352,7 +368,12 @@ for (i = 0, len = nodes.length; i < len; i++) { o = doc.createElement('cke:object'); o.setAttribute('data-brickid', nodes[i].getAttribute('data-brickid')); + o.setAttribute('data-cke-widget-wrapper', 1); + o.classList.add('quiqqer_bricks_placeholder'); + o.classList.add('cke_widget_wrapper'); + o.classList.add('cke_widget_inline'); + o.contenteditable = false; nodes[i].parentNode.replaceChild(o, nodes[i]); }