From: Aleksander Ɓukasz Date: Tue, 16 Apr 2013 08:51:16 +0000 (+0200) Subject: WIP: selection, highlighting, some styling for visual editor X-Git-Url: https://git.mdrn.pl/fnpeditor.git/commitdiff_plain/3185249361cacf28b88b00093f8b262795c8fa3c?ds=sidebyside WIP: selection, highlighting, some styling for visual editor --- diff --git a/editor.css b/editor.css index a1c743d..3691738 100644 --- a/editor.css +++ b/editor.css @@ -19,12 +19,53 @@ body { list-style-type: none; } -#rng-visualEditor-content { +#rng-visualEditor-contentWrapper { + border-color: grey; + border-style: solid; + border-width: 1px; float:left; - width: 540px; + width: 620px; height: 500px; + overflow-y: scroll; + padding: 5px 10px; +} + +#rng-visualEditor-content { + + outline: 0px solid transparent; } #rng-visualEditor-meta { float:right; +} + +.rng { + float: none !important; /* temporaty workaround for Bootstrap's influence via [class*="span"] { float: left; } */ + border-color: white; + border-style:solid; + border-width:1px; +} + +.rng-header { + font-size: 19px; + font-style: bold; + margin-bottom: 10px; +} + +.rng-section { + margin-top: 10px; + margin-bottom: 10px; +} + +.rng-hover { + border-color: red; + border-style:solid; + border-width:1px; +} + +.rng-current { + background: #fffacd; + border-color: grey; + border-style:dashed; + border-width:1px; } \ No newline at end of file diff --git a/modules/visualEditor.js b/modules/visualEditor.js index 08085de..ce62c6a 100644 --- a/modules/visualEditor.js +++ b/modules/visualEditor.js @@ -12,6 +12,13 @@ rng.modules.visualEditor = function(sandbox) { node.find('#rng-visualEditor-meta').on('keyup', function() { isDirty = true; }); + + this.node.on('mouseover', '.rng', function(e) { $(e.target).addClass('rng-hover')}); + this.node.on('mouseout', '.rng', function(e) { $(e.target).removeClass('rng-hover')}); + this.node.on('click', '.rng', function(e) { + node.find('.rng').removeClass('rng-current'); + $(e.target).addClass('rng-current'); + }); }, getMetaData: function() { var toret = {}; diff --git a/modules/visualEditor.transformations.js b/modules/visualEditor.transformations.js index 22deba5..cfb5877 100644 --- a/modules/visualEditor.transformations.js +++ b/modules/visualEditor.transformations.js @@ -14,14 +14,14 @@ if(typeof module !== 'undefined' && module.exports) { toret.find('metadata').remove(); var toBlock = ['div', 'document', 'section', 'header']; - var toInline = ['aside']; + var toInline = ['aside', 'span']; toBlock.forEach(function(tagName) { tagName = tagName.toLowerCase(); console.log('running ' + tagName); toret.find(tagName).replaceWith(function() { var suffix = tagName !== 'div' ? tagName : 'block'; - return $('
').addClass('rng-' + suffix).append($(this).contents()); + return $('
').addClass('rng rng-' + suffix).append($(this).contents()); }); }); @@ -29,7 +29,7 @@ if(typeof module !== 'undefined' && module.exports) { tagName = tagName.toLowerCase(); toret.find(tagName).replaceWith(function() { var node = this; - return $('').addClass('rng-' + tagName).append($(this).contents()); + return $('').addClass('rng rng-' + tagName).append($(this).contents()); }); }); return toret.children();