From: Aleksander Łukasz Date: Fri, 25 Apr 2014 14:28:43 +0000 (+0200) Subject: fairly simple changes X-Git-Url: https://git.mdrn.pl/fnpeditor.git/commitdiff_plain/fc54b1e72b7ed4992bbc4a2ef3ae7f02393d174d?ds=sidebyside;hp=c031ffaa79a223a05a4a58de2854c9855e94cc18 fairly simple changes --- diff --git a/src/editor/modules/documentCanvas/canvas/documentElement.less b/src/editor/modules/documentCanvas/canvas/documentElement.less new file mode 100644 index 0000000..43a32f5 --- /dev/null +++ b/src/editor/modules/documentCanvas/canvas/documentElement.less @@ -0,0 +1,12 @@ +[document-node-element] { + .canvas-widgets { + display: inline; + text-indent: 0; + } + + .canvas-widget { + display: none; + } + + +} \ No newline at end of file diff --git a/src/editor/modules/documentCanvas/canvas/genericElement.less b/src/editor/modules/documentCanvas/canvas/genericElement.less new file mode 100644 index 0000000..c935a79 --- /dev/null +++ b/src/editor/modules/documentCanvas/canvas/genericElement.less @@ -0,0 +1,16 @@ +.canvas-widget-label { + position: absolute; + display: none; + top: -20px; + left:0; + background-color: red; + color: white; + font-size:12px; + font-weight: bold; + padding: 1px 3px; + //width:300px; + opacity: 0.65; + font-family: monospace; + z-index:9999; + white-space: nowrap; +} \ No newline at end of file diff --git a/src/editor/modules/documentCanvas/canvas/widgets.js b/src/editor/modules/documentCanvas/canvas/widgets.js deleted file mode 100644 index aecb199..0000000 --- a/src/editor/modules/documentCanvas/canvas/widgets.js +++ /dev/null @@ -1,65 +0,0 @@ -define([ -'libs/jquery', -'utils/wlxml' -], function($, wlxmlUtils) { - -'use strict'; - -return { - labelWidget: function(tag, klass) { - return $('') - .addClass('canvas-widget canvas-widget-label') - .text(wlxmlUtils.getTagLabel(tag) + (klass ? ' / ' + wlxmlUtils.getClassLabel(klass) : '')); - }, - - footnoteHandler: function(clickHandler) { - var mydom = $('') - .addClass('canvas-widget canvas-widget-footnote-handle') - .css('display', 'inline') - .show(); - - mydom.click(function(e) { - e.stopPropagation(); - clickHandler(); - }); - - return mydom; - }, - - hideButton: function(clickHandler) { - var mydom = $('x') - .addClass('canvas-widget canvas-widget-hide-button'); - mydom.click(function(e) { - e.stopPropagation(); - clickHandler(); - }); - return mydom; - }, - - commentAdnotation: function(node) { - var widget = { - DOM: $('
').addClass('canvas-widget canvas-widget-comment-adnotation'), - update: function(node) { - var parts = [], - metadata = node.getMetadata(), - dt; - metadata.forEach(function(row) { - parts.push(row.getValue()); - }, 'creator'); - metadata.some(function(row) { - dt = row.getValue(); - return true; // break - }, 'date'); - if(dt) { - parts.push(dt); - } - this.DOM.text(parts.join(', ')); - } - }; - widget.update(node); - return widget; - } - -}; - -}); \ No newline at end of file diff --git a/src/editor/modules/documentCanvas/canvas/widgets.less b/src/editor/modules/documentCanvas/canvas/widgets.less deleted file mode 100644 index 442af99..0000000 --- a/src/editor/modules/documentCanvas/canvas/widgets.less +++ /dev/null @@ -1,69 +0,0 @@ -[document-node-element] { - .canvas-widgets { - display: inline; - text-indent: 0; - } - - .canvas-widget { - display: none; - } - - .canvas-widget-label { - position: absolute; - display: none; - top: -20px; - left:0; - background-color: red; - color: white; - font-size:12px; - font-weight: bold; - padding: 1px 3px; - //width:300px; - opacity: 0.65; - font-family: monospace; - z-index:9999; - white-space: nowrap; - } - - - - .canvas-widget-footnote-handle { - display: inline; - outline: 0px solid transparent; - cursor: pointer; - counter-increment: footnote; - vertical-align: super; - color: blue; - font-size: .8em; - - &::before, { - content: "[" counter(footnote) "]"; - } - } - - .canvas-widget-hide-button { - @line_height: 12px; - @padding: 2px; - @temporary_footnote_hack: 10px; - - position: absolute; - top: -(@line_height + 2 * @padding) + @temporary_footnote_hack; - right: 0; - line-height: @line_height; - padding: @padding; - font-weight: bold; - color: white; - background-image: linear-gradient(to bottom,#ee5f5b,#bd362f); - border-radius: 1px; - cursor: pointer; - } - - .canvas-widget-comment-adnotation { - position:absolute; - top: 10px; - right:10px; - font-size: 10px; - color: lighten(@black, 10%); - z-index:1000; - } -} \ No newline at end of file diff --git a/src/editor/modules/documentCanvas/canvas/wlxmlManagers.js b/src/editor/modules/documentCanvas/canvas/wlxmlManagers.js deleted file mode 100644 index 6b8b5ff..0000000 --- a/src/editor/modules/documentCanvas/canvas/wlxmlManagers.js +++ /dev/null @@ -1,177 +0,0 @@ -define([ -'libs/jquery', -'modules/documentCanvas/canvas/widgets' -], function($, widgets) { - -'use strict'; - - -var DocumentElementWrapper = function(documentElement) { - - this.documentElement = documentElement; - - this.addWidget = function(widget) { - documentElement.dom().children('.canvas-widgets').append(widget.DOM ? widget.DOM : widget); - }; - - this.clearWidgets = function() { - documentElement.dom().children('.canvas-widgets').empty(); - }; - - this.setDisplayStyle = function(displayStyle) { - documentElement.dom().css('display', displayStyle || ''); - documentElement._container().css('display', displayStyle || ''); - }; - - this.tag = function() { - return documentElement.getWlxmlTag(); - }; - - this.klass = function() { - return documentElement.getWlxmlClass(); - }; - - this.toggle = function(toggle) { - documentElement._container().toggle(toggle); - }; - - var eventBus = documentElement.canvas ? documentElement.canvas.eventBus : - {trigger: function() {}}; - this.trigger = function() { - eventBus.trigger.apply(eventBus, arguments); - }; - - this.node = documentElement.wlxmlNode; -}; - -var getDisplayStyle = function(tag, klass) { - if(tag === 'metadata') { - return 'none'; - } - if(tag === 'span') { - return 'inline'; - } - if(klass && klass.substr(0, 4) === 'item') { - return null; - } - if(klass === 'gap') { - return 'inline'; - } - return 'block'; -}; - -var GenericManager = function(wlxmlElement) { - this.el = wlxmlElement; -}; - -$.extend(GenericManager.prototype, { - setup: function() { - this.el.setDisplayStyle(getDisplayStyle(this.el.tag(), this.el.klass())); - - this.el.clearWidgets(); - }, - toggle: function(toggle) { - this.el.toggle(toggle); - } - -}); - -var managers = { - _m: {}, - set: function(tag, klass, manager) { - if(!this._m[tag]) { - this._m[tag] = {}; - } - this._m[tag][klass] = manager; - }, - get: function(tag,klass) { - if(this._m[tag] && this._m[tag][klass]) { - return this._m[tag][klass]; - } - return GenericManager; - } -}; - -var FootnoteManager = function(wlxmlElement) { - this.el = wlxmlElement; -}; -$.extend(FootnoteManager.prototype, { - setup: function() { - this.el.clearWidgets(); - - var clickHandler = function() { - this.toggle(true); - }.bind(this); - this.footnoteHandler = widgets.footnoteHandler(clickHandler); - this.el.addWidget(this.footnoteHandler); - - var closeHandler = function() { - this.toggle(false); - - }.bind(this); - this.hideButton = widgets.hideButton(closeHandler); - this.el.addWidget(this.hideButton); - - this.toggle(false, {silent: true}); - }, - toggle: function(toggle, options) { - options = options || {}; - this.hideButton.toggle(toggle); - this.footnoteHandler.toggle(!toggle); - - this.el.setDisplayStyle(toggle ? 'block' : 'inline'); - this.el.toggle(toggle); - if(!options.silent) { - this.el.trigger('elementToggled', toggle, this.el.documentElement); - } - } -}); -managers.set('aside', 'footnote', FootnoteManager); - - -var ListItemManager = function(wlxmlElement) { - this.el = wlxmlElement; -}; -$.extend(ListItemManager.prototype, { - setup: function() { - this.el.clearWidgets(); - }, - toggleBullet: function(toggle) { - this.el.documentElement._container().css({display : toggle ? 'list-item' : 'block'}); - } -}); -managers.set('div', 'item', ListItemManager); - - -var CommentManager = function(wlxmlElement) { - this.el = wlxmlElement; -}; - -$.extend(CommentManager.prototype, { - setup: function() { - this.el.clearWidgets(); - - this.widget = widgets.commentAdnotation(this.el.node); - this.el.addWidget(this.widget); - this.widget.DOM.show(); - }, - updateMetadata: function() { - // var parts = []; - // this.el.node.getMetadata().forEach(function(row) { - // parts.push(row.getValue()); - // }, 'creator'); - // this.widget.text(parts.join(', ')); - this.widget.update(this.el.node); - } -}); -managers.set('aside', 'comment', CommentManager); - -return { - getFor: function(documentElement) { - var wlxmlElement = new DocumentElementWrapper(documentElement); - return new (managers.get(wlxmlElement.tag(), wlxmlElement.klass()))(wlxmlElement); - - } -}; - -}); \ No newline at end of file diff --git a/src/editor/modules/documentCanvas/documentCanvas.js b/src/editor/modules/documentCanvas/documentCanvas.js index 9a88b75..03b0cf7 100644 --- a/src/editor/modules/documentCanvas/documentCanvas.js +++ b/src/editor/modules/documentCanvas/documentCanvas.js @@ -14,7 +14,13 @@ var logger = logging.getLogger('documentCanvas'); return function(sandbox) { - var canvas = canvas3.fromXMLDocument(null); + var canvasElements; + + sandbox.getPlugins(function(plugin) { + canvasElements = canvasElements.concat(plugin.canvasElements || []); + }); + + var canvas = canvas3.fromXMLDocument(null, canvasElements); var canvasWrapper = $(template); var shownAlready = false; var scrollbarPosition = 0, diff --git a/src/editor/modules/documentCanvas/documentCanvas.less b/src/editor/modules/documentCanvas/documentCanvas.less index 9421482..bd39b6a 100644 --- a/src/editor/modules/documentCanvas/documentCanvas.less +++ b/src/editor/modules/documentCanvas/documentCanvas.less @@ -1,5 +1,6 @@ @import 'nodes.less'; -@import 'canvas/widgets.less'; +@import 'canvas/documentElement.less'; +@import 'canvas/genericElement.less'; #rng-module-documentCanvas { height: 100%; diff --git a/src/editor/plugins/core/canvasElements.less b/src/editor/plugins/core/canvasElements.less new file mode 100644 index 0000000..6003476 --- /dev/null +++ b/src/editor/plugins/core/canvasElements.less @@ -0,0 +1,39 @@ +.canvas-widget-footnote-handle { + display: inline; + outline: 0px solid transparent; + cursor: pointer; + counter-increment: footnote; + vertical-align: super; + color: blue; + font-size: .8em; + + &::before, { + content: "[" counter(footnote) "]"; + } +} + +.canvas-widget-hide-button { + @line_height: 12px; + @padding: 2px; + @temporary_footnote_hack: 10px; + + position: absolute; + top: -(@line_height + 2 * @padding) + @temporary_footnote_hack; + right: 0; + line-height: @line_height; + padding: @padding; + font-weight: bold; + color: white; + background-image: linear-gradient(to bottom,#ee5f5b,#bd362f); + border-radius: 1px; + cursor: pointer; +} + +.canvas-widget-comment-adnotation { + position:absolute; + top: 10px; + right:10px; + font-size: 10px; + color: lighten(@black, 10%); + z-index:1000; +} \ No newline at end of file diff --git a/src/editor/plugins/core/core.js b/src/editor/plugins/core/core.js index 38675fb..150464e 100644 --- a/src/editor/plugins/core/core.js +++ b/src/editor/plugins/core/core.js @@ -9,7 +9,9 @@ var _ = require('libs/underscore'), switchTo = require('plugins/core/switch'), lists = require('plugins/core/lists'), plugin = {name: 'core', actions: [], canvas: {}, documentExtension: {textNode: {}}}, - Dialog = require('views/dialog/dialog'); + Dialog = require('views/dialog/dialog'), + canvasElements = require('plugins/core/canvasElements'); + plugin.documentExtension.textNode.transformations = { @@ -374,6 +376,8 @@ plugin.config = function(config) { templates.actions[0].params.template.options = config.templates; }; +plugin.canvasElements = canvasElements; + return plugin; }); \ No newline at end of file diff --git a/src/editor/plugins/core/core.less b/src/editor/plugins/core/core.less new file mode 100644 index 0000000..0754e03 --- /dev/null +++ b/src/editor/plugins/core/core.less @@ -0,0 +1 @@ +@import 'canvasElements.less'; \ No newline at end of file diff --git a/src/editor/plugins/plugins.less b/src/editor/plugins/plugins.less new file mode 100644 index 0000000..a6ba84b --- /dev/null +++ b/src/editor/plugins/plugins.less @@ -0,0 +1 @@ +@import 'core/core.less'; \ No newline at end of file diff --git a/src/editor/styles/main.less b/src/editor/styles/main.less index 411a2aa..f9ae798 100644 --- a/src/editor/styles/main.less +++ b/src/editor/styles/main.less @@ -2,6 +2,7 @@ @import 'mixins.less'; @import 'common.less'; +@import '../plugins/plugins.less'; @import '../views/openSelect/openSelect.less'; @import '../views/dialog/dialog.less'; @import '../modules/rng/rng.less';