modules/documentCanvas/canvas.js

   1 define([\r
   2 'libs/jquery-1.9.1.min',\r
   3 'libs/underscore-min',\r
   4 'modules/documentCanvas/transformations',\r
   5 'modules/documentCanvas/wlxmlNode',\r
   6 'libs/text!./template.html'\r
   7 ], function($, _, transformations, wlxmlNode, template) {\r
   8 \r
   9 'use strict';\r
  10 \r
  11 var Canvas = function(xml) {\r
  12     this.xml = xml;\r
  13     this.dom = $(template);\r
  14     \r
  15     this.content = this.dom.find('#rng-module-documentCanvas-content')\r
  16     \r
  17     \r
  18     this.content.html(transformations.fromXML.getHTMLTree(xml));\r
  19 }\r
  20 \r
  21 Canvas.prototype.toXML = function() {\r
  22     return transformations.toXML.getXML(this.content.html());\r
  23 }\r
  24 \r
  25 Canvas.prototype.getNode = function(desc) {\r
  26     var selector = '';\r
  27     if(desc.klass)\r
  28         selector += '[wlxml-class=' + desc.klass + ']';\r
  29     if(desc.tag)\r
  30         selector += '[wlxml-tag=' + desc.tag + ']';\r
  31     var toret = [];\r
  32     this.content.find(selector).each(function() {\r
  33         toret.push(new wlxmlNode.Node($(this)));\r
  34     });\r
  35     return toret;\r
  36 }\r
  37 \r
  38 Canvas.prototype._createNode = function(wlxmlTag, wlxmlClass) {\r
  39             var toBlock = ['div', 'document', 'section', 'header'];\r
  40             var htmlTag = _.contains(toBlock, wlxmlTag) ? 'div' : 'span';\r
  41             var toret = $('<' + htmlTag + '>');\r
  42             toret.attr('wlxml-tag', wlxmlTag);\r
  43             if(wlxmlClass)\r
  44                 toret.attr('wlxml-class', wlxmlClass);\r
  45             toret.attr('id', 'xxxxxxxx-xxxx-xxxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {var r = Math.random()*16|0,v=c=='x'?r:r&0x3|0x8;return v.toString(16);}));\r
  46             return toret;\r
  47         };\r
  48 \r
  49 Canvas.prototype.insertNode = function(options) {\r
  50     var element = $(this.content.find('#' + options.context.id).get(0));\r
  51     if(options.place == 'after')\r
  52         element[options.place](this._createNode(options.tag, options.klass));\r
  53     else if(options.place == 'wrapText') {\r
  54         var elementContents = element.contents();\r
  55         if(elementContents.length !== 1 || elementContents.get(0).nodeType != 3)\r
  56             return false;\r
  57         var textElement = elementContents.get(0);\r
  58 \r
  59         var prefix = textElement.data.substr(0, options.offsetStart);\r
  60         var suffix = textElement.data.substr(options.offsetEnd);\r
  61         var core = textElement.data.substr(options.offsetStart, options.offsetEnd - options.offsetStart);\r
  62         var newNode = this._createNode(options.tag, options.klass);\r
  63         newNode.text(core);\r
  64         $(textElement).replaceWith(newNode);\r
  65         newNode.before(prefix);\r
  66         newNode.after(suffix);\r
  67     }\r
  68 }\r
  69 \r
  70 Canvas.prototype.splitNode = function(options) {\r
  71     var element = $(this.content.find('#' + options.node.id).get(0));\r
  72     \r
  73     var elementContents = element.contents();\r
  74     if(elementContents.length !== 1 || elementContents.get(0).nodeType != 3)\r
  75         return false;\r
  76     var textElement = elementContents.get(0);\r
  77     \r
  78     var prefix = textElement.data.substr(0, options.offset);\r
  79     var suffix = textElement.data.substr(options.offset);\r
  80     var prefixNode = this._createNode(element.attr('wlxml-tag'), element.attr('wlxml-class'));\r
  81     var suffixNode = this._createNode(element.attr('wlxml-tag'), element.attr('wlxml-class'));\r
  82     prefixNode.text(prefix);\r
  83     suffixNode.text(suffix);\r
  84     element.before(prefixNode);\r
  85     element.after(suffixNode);\r
  86     element.remove();\r
  87 }\r
  88 \r
  89 Canvas.prototype.createList = function(options) {\r
  90     var element1 = $(this.content.find('#' + options.start.id).get(0));\r
  91     var element2 = $(this.content.find('#' + options.end.id).get(0));\r
  92     if(!element1.parent().get(0).isSameNode(element2.parent().get(0)))\r
  93         return false;\r
  94         \r
  95     var parent = element1.parent();\r
  96     var nodesToWrap = [];\r
  97     \r
  98     var place = 'before';\r
  99     var canvas = this;\r
 100     parent.contents().each(function() {\r
 101         var node = this;\r
 102         if(node.isSameNode(element1.get(0)))\r
 103             place = 'inside';\r
 104         if(place === 'inside') {\r
 105             var $node;\r
 106             if(node.nodeType === 3) {\r
 107                 $node = canvas._createNode('div').text(node.data);\r
 108                 $(node).remove();\r
 109             }\r
 110             else {\r
 111                 $node = $(node);\r
 112             }\r
 113             $node.attr('wlxml-class', 'list.item');\r
 114             nodesToWrap.push($node);\r
 115         }\r
 116         if(node.isSameNode(element2.get(0)))\r
 117             return;\r
 118     });\r
 119     \r
 120     var list = this._createNode('div', 'list');\r
 121     element1.before(list);\r
 122     \r
 123     nodesToWrap.forEach(function(node) {\r
 124         node.remove();\r
 125         list.append(node);\r
 126     });\r
 127     \r
 128     \r
 129     \r
 130 }\r
 131 \r
 132 \r
 133 return {Canvas: Canvas, Node: Node};\r
 134 \r
 135 });