git.roojs.org Git - roojs1/blob - Roo/htmleditor/Block.js

   1
   2 /**
   3  * @class Roo.htmleditor.Block
   4  * Base class for html editor blocks - do not use it directly .. extend it..
   5  * @cfg {DomElement} node The node to apply stuff to.
   6  * @cfg {String} friendly_name the name that appears in the context bar about this block
   7  * @cfg {Object} Context menu - see Roo.form.HtmlEditor.ToolbarContext
   8
   9  * @constructor
  10  * Create a new Filter.
  11  * @param {Object} config Configuration options
  12  */
  13
  14 Roo.htmleditor.Block  = function(cfg)
  15 {
  16     // do nothing .. should not be called really.
  17 }
  18 /**
  19  * factory method to get the block from an element (using cache if necessary)
  20  * @static
  21  * @param {HtmlElement} the dom element
  22  */
  23 Roo.htmleditor.Block.factory = function(node)
  24 {
  25     var cc = Roo.htmleditor.Block.cache;
  26     var id = Roo.get(node).id;
  27     if (typeof(cc[id]) != 'undefined' && (!cc[id].node || cc[id].node.closest('body'))) {
  28         Roo.htmleditor.Block.cache[id].readElement(node);
  29         return Roo.htmleditor.Block.cache[id];
  30     }
  31     var db  = node.getAttribute('data-block');
  32     if (!db) {
  33         db = node.nodeName.toLowerCase().toUpperCaseFirst();
  34     }
  35     var cls = Roo.htmleditor['Block' + db];
  36     if (typeof(cls) == 'undefined') {
  37         //Roo.log(node.getAttribute('data-block'));
  38         Roo.log("OOps missing block : " + 'Block' + db);
  39         return false;
  40     }
  41     Roo.htmleditor.Block.cache[id] = new cls({ node: node });
  42     return Roo.htmleditor.Block.cache[id];  /// should trigger update element
  43 };
  44
  45 /**
  46  * initalize all Elements from content that are 'blockable'
  47  * @static
  48  * @param the body element
  49  */
  50 Roo.htmleditor.Block.initAll = function(body, type)
  51 {
  52     if (typeof(type) == 'undefined') {
  53         var ia = Roo.htmleditor.Block.initAll;
  54         ia(body,'table');
  55         ia(body,'td');
  56         ia(body,'figure');
  57         return;
  58     }
  59     Roo.each(Roo.get(body).query(type), function(e) {
  60         Roo.htmleditor.Block.factory(e);
  61     },this);
  62 };
  63 // question goes here... do we need to clear out this cache sometimes?
  64 // or show we make it relivant to the htmleditor.
  65 Roo.htmleditor.Block.cache = {};
  66
  67 Roo.htmleditor.Block.prototype = {
  68
  69     node : false,
  70
  71      // used by context menu
  72     friendly_name : 'Based Block',
  73
  74     // text for button to delete this element
  75     deleteTitle : false,
  76
  77     context : false,
  78     /**
  79      * Update a node with values from this object
  80      * @param {DomElement} node
  81      */
  82     updateElement : function(node)
  83     {
  84         Roo.DomHelper.update(node === undefined ? this.node : node, this.toObject());
  85     },
  86      /**
  87      * convert to plain HTML for calling insertAtCursor..
  88      */
  89     toHTML : function()
  90     {
  91         return Roo.DomHelper.markup(this.toObject());
  92     },
  93     /**
  94      * used by readEleemnt to extract data from a node
  95      * may need improving as it's pretty basic
  96
  97      * @param {DomElement} node
  98      * @param {String} tag - tag to find, eg. IMG ?? might be better to use DomQuery ?
  99      * @param {String} attribute (use html - for contents, style for using next param as style, or false to return the node)
 100      * @param {String} style the style property - eg. text-align
 101      */
 102     getVal : function(node, tag, attr, style)
 103     {
 104         var n = node;
 105         if (tag !== true && n.tagName != tag.toUpperCase()) {
 106             // in theory we could do figure[3] << 3rd figure? or some more complex search..?
 107             // but kiss for now.
 108             n = node.getElementsByTagName(tag).item(0);
 109         }
 110         if (!n) {
 111             return '';
 112         }
 113         if (attr === false) {
 114             return n;
 115         }
 116         if (attr == 'html') {
 117             return n.innerHTML;
 118         }
 119         if (attr == 'style') {
 120             return n.style[style];
 121         }
 122
 123         return n.hasAttribute(attr) ? n.getAttribute(attr) : '';
 124
 125     },
 126     /**
 127      * create a DomHelper friendly object - for use with
 128      * Roo.DomHelper.markup / overwrite / etc..
 129      * (override this)
 130      */
 131     toObject : function()
 132     {
 133         return {};
 134     },
 135       /**
 136      * Read a node that has a 'data-block' property - and extract the values from it.
 137      * @param {DomElement} node - the node
 138      */
 139     readElement : function(node)
 140     {
 141
 142     }
 143
 144
 145 };
 146