src/editor/plugins/core/canvasElements.js

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