src/editor/plugins/core/canvasElements.js

   1 define(function(require) {
   2
   3 'use strict';
   4 var $ = require('libs/jquery'),
   5     genericElement = require('modules/documentCanvas/canvas/genericElement'); // TODO: This should be accessible via plugin infrastructure
   6
   7
   8 var widgets = {
   9     footnoteHandler: function(clickHandler) {
  10         var mydom = $('<span>')
  11             .addClass('canvas-widget canvas-widget-footnote-handle')
  12             .css('display', 'inline')
  13             .show();
  14
  15         mydom.click(function(e) {
  16             e.stopPropagation();
  17             clickHandler();
  18         });
  19
  20         return mydom;
  21     },
  22     commentAdnotation: function(node) {
  23         var widget = {
  24             DOM: $('<div>').addClass('canvas-widget canvas-widget-comment-adnotation'),
  25             update: function(node) {
  26                 var parts = [],
  27                     metadata = node.getMetadata(),
  28                     dt;
  29                 metadata.forEach(function(row) {
  30                     parts.push(row.getValue());
  31                 }, 'creator');
  32                 metadata.some(function(row) {
  33                     dt = row.getValue();
  34                     return true; // break
  35                 }, 'date');
  36                 if(dt) {
  37                     parts.push(dt);
  38                 }
  39                 this.DOM.text(parts.join(', '));
  40             }
  41         };
  42         widget.update(node);
  43         return widget;
  44     },
  45     hideButton: function(clickHandler) {
  46         var mydom = $('<span>x</span>')
  47             .addClass('canvas-widget canvas-widget-hide-button');
  48         mydom.click(function(e) {
  49             e.stopPropagation();
  50             clickHandler();
  51         });
  52         return mydom;
  53     }
  54 };
  55
  56
  57 var comment = Object.create(genericElement);
  58 $.extend(comment, {
  59     init: function() {
  60         genericElement.init.call(this);
  61         this.commentAdnotation = widgets.commentAdnotation(this.wlxmlNode);
  62         this.addWidget(this.commentAdnotation, 'show');
  63         this.commentAdnotation.DOM.show();
  64     },
  65
  66     onMetadataChanged: function(event) {
  67         this.commentAdnotation.update(event.meta.node);
  68     },
  69     onMetadataAdded: function(event) {
  70         return this.onMetadataChanged(event);
  71     },
  72     onMetadataRemoved: function(event) {
  73         return this.onMetadataChanged(event);
  74     }
  75 });
  76
  77 var footnote = Object.create(genericElement);
  78 $.extend(footnote, {
  79     init: function() {
  80         genericElement.init.call(this);
  81         var clickHandler = function() {
  82             this.toggle(true);
  83         }.bind(this);
  84         this.footnoteHandler = widgets.footnoteHandler(clickHandler);
  85         this.addWidget(this.footnoteHandler);
  86
  87         var closeHandler = function() {
  88             this.toggle(false);
  89         }.bind(this);
  90         this.hideButton = widgets.hideButton(closeHandler);
  91         this.addWidget(this.hideButton);
  92         this.toggle(false, {silent: true});
  93     },
  94     toggle: function(toggle, options) {
  95         options = options || {};
  96         this.hideButton.toggle(toggle);
  97         this.footnoteHandler.toggle(!toggle);
  98
  99         if(toggle) {
 100             this.displayAsBlock();
 101         } else {
 102             this.displayInline();
 103         }
 104         this._container().toggle(toggle);
 105         if(!options.silent) {
 106             this.trigger('elementToggled', toggle, this);
 107         }
 108     }
 109 });
 110
 111
 112 return [
 113     {tag: 'aside', klass: 'comment', prototype: comment},
 114     {tag: 'aside', klass: 'footnote', prototype: footnote}
 115 ];
 116
 117
 118 });