el.insertBefore(node, before);
return node;
};
+
+ // this is a bit like the react update code...
+ //
+
+ var updateNode = function(from, to)
+ {
+ // should we handle non-standard elements?
+
+ if (from.nodeType != to.nodeType) {
+ from.parentNode.replaceChild(to, from);
+ }
+
+ if (from.nodeType == 3) {
+ // assume it's text?!
+ if (from.data == to.data) {
+ return;
+ }
+ from.data = to.data;
+ return;
+ }
+
+ // assume 'to' doesnt have '1/3 nodetypes!
+ if (from.nodeType !=1 || from.tagName != to.tagName) {
+ from.parentNode.replaceChild(to, from);
+ return;
+ }
+ // compare attributes
+ var ar = Array.from(from.attributes);
+ for(var i = 0; i< ar.length;i++) {
+ if (to.hasAttribute(ar[i].name)) {
+ continue;
+ }
+ from.removeAttribute(ar[i].name);
+ }
+ ar = to.attributes;
+ for(var i = 0; i< ar.length;i++) {
+ if (from.getAttribute(ar[i].name) == to.getAttribute(ar[i].name)) {
+ continue;
+ }
+ from.setAttribute(ar[i].name, to.getAttribute(ar[i].name));
+ }
+ // children
+ var far = Array.from(from.childNodes);
+ var tar = Array.from(to.childNodes);
+ // if the lengths are different.. then it's probably a editable content change, rather than
+ // a change of the block definition..
+ if (from.innerHTML == to.innerHTML) {
+ return;
+ }
+ if (far.length != tar.length) {
+ from.innerHTML = to.innerHTML;
+ return;
+ }
+
+ for(var i = 0; i < far.length; i++) {
+ updateNode(far[i], tar[i]);
+ }
+
+
+ };
+
+
return {
- /** True to force the use of DOM instead of html fragments @type Boolean */
- useDom : false,
-
- /**
- * Returns the markup for the passed Element(s) config
- * @param {Object} o The Dom object spec (and children)
- * @return {String}
- */
- markup : function(o){
- return createHtml(o);
- },
-
- /**
- * Applies a style specification to an element
- * @param {String/HTMLElement} el The element to apply styles to
- * @param {String/Object/Function} styles A style specification string eg "width:100px", or object in the form {width:"100px"}, or
- * a function which returns such a specification.
- */
- applyStyles : function(el, styles){
- if(styles){
- el = Roo.fly(el);
- if(typeof styles == "string"){
- var re = /\s?([a-z\-]*)\:\s?([^;]*);?/gi;
- var matches;
- while ((matches = re.exec(styles)) != null){
- el.setStyle(matches[1], matches[2]);
- }
- }else if (typeof styles == "object"){
- for (var style in styles){
- el.setStyle(style, styles[style]);
+ /** True to force the use of DOM instead of html fragments @type Boolean */
+ useDom : false,
+
+ /**
+ * Returns the markup for the passed Element(s) config
+ * @param {Object} o The Dom object spec (and children)
+ * @return {String}
+ */
+ markup : function(o){
+ return createHtml(o);
+ },
+
+ /**
+ * Applies a style specification to an element
+ * @param {String/HTMLElement} el The element to apply styles to
+ * @param {String/Object/Function} styles A style specification string eg "width:100px", or object in the form {width:"100px"}, or
+ * a function which returns such a specification.
+ */
+ applyStyles : function(el, styles){
+ if(styles){
+ el = Roo.fly(el);
+ if(typeof styles == "string"){
+ var re = /\s?([a-z\-]*)\:\s?([^;]*);?/gi;
+ var matches;
+ while ((matches = re.exec(styles)) != null){
+ el.setStyle(matches[1], matches[2]);
+ }
+ }else if (typeof styles == "object"){
+ for (var style in styles){
+ el.setStyle(style, styles[style]);
+ }
+ }else if (typeof styles == "function"){
+ Roo.DomHelper.applyStyles(el, styles.call());
}
- }else if (typeof styles == "function"){
- Roo.DomHelper.applyStyles(el, styles.call());
- }
- }
- },
-
- /**
- * Inserts an HTML fragment into the Dom
- * @param {String} where Where to insert the html in relation to el - beforeBegin, afterBegin, beforeEnd, afterEnd.
- * @param {HTMLElement} el The context element
- * @param {String} html The HTML fragmenet
- * @return {HTMLElement} The new node
- */
- insertHtml : function(where, el, html){
- where = where.toLowerCase();
- if(el.insertAdjacentHTML){
- if(tableRe.test(el.tagName)){
- var rs;
- if(rs = insertIntoTable(el.tagName.toLowerCase(), where, el, html)){
- return rs;
+ }
+ },
+
+ /**
+ * Inserts an HTML fragment into the Dom
+ * @param {String} where Where to insert the html in relation to el - beforeBegin, afterBegin, beforeEnd, afterEnd.
+ * @param {HTMLElement} el The context element
+ * @param {String} html The HTML fragmenet
+ * @return {HTMLElement} The new node
+ */
+ insertHtml : function(where, el, html){
+ where = where.toLowerCase();
+ if(el.insertAdjacentHTML){
+ if(tableRe.test(el.tagName)){
+ var rs;
+ if(rs = insertIntoTable(el.tagName.toLowerCase(), where, el, html)){
+ return rs;
+ }
}
+ switch(where){
+ case "beforebegin":
+ el.insertAdjacentHTML('BeforeBegin', html);
+ return el.previousSibling;
+ case "afterbegin":
+ el.insertAdjacentHTML('AfterBegin', html);
+ return el.firstChild;
+ case "beforeend":
+ el.insertAdjacentHTML('BeforeEnd', html);
+ return el.lastChild;
+ case "afterend":
+ el.insertAdjacentHTML('AfterEnd', html);
+ return el.nextSibling;
+ }
+ throw 'Illegal insertion point -> "' + where + '"';
}
+ var range = el.ownerDocument.createRange();
+ var frag;
switch(where){
- case "beforebegin":
- el.insertAdjacentHTML('BeforeBegin', html);
+ case "beforebegin":
+ range.setStartBefore(el);
+ frag = range.createContextualFragment(html);
+ el.parentNode.insertBefore(frag, el);
return el.previousSibling;
- case "afterbegin":
- el.insertAdjacentHTML('AfterBegin', html);
- return el.firstChild;
+ case "afterbegin":
+ if(el.firstChild){
+ range.setStartBefore(el.firstChild);
+ frag = range.createContextualFragment(html);
+ el.insertBefore(frag, el.firstChild);
+ return el.firstChild;
+ }else{
+ el.innerHTML = html;
+ return el.firstChild;
+ }
case "beforeend":
- el.insertAdjacentHTML('BeforeEnd', html);
- return el.lastChild;
+ if(el.lastChild){
+ range.setStartAfter(el.lastChild);
+ frag = range.createContextualFragment(html);
+ el.appendChild(frag);
+ return el.lastChild;
+ }else{
+ el.innerHTML = html;
+ return el.lastChild;
+ }
case "afterend":
- el.insertAdjacentHTML('AfterEnd', html);
- return el.nextSibling;
- }
- throw 'Illegal insertion point -> "' + where + '"';
- }
- var range = el.ownerDocument.createRange();
- var frag;
- switch(where){
- case "beforebegin":
- range.setStartBefore(el);
- frag = range.createContextualFragment(html);
- el.parentNode.insertBefore(frag, el);
- return el.previousSibling;
- case "afterbegin":
- if(el.firstChild){
- range.setStartBefore(el.firstChild);
+ range.setStartAfter(el);
frag = range.createContextualFragment(html);
- el.insertBefore(frag, el.firstChild);
- return el.firstChild;
- }else{
- el.innerHTML = html;
- return el.firstChild;
+ el.parentNode.insertBefore(frag, el.nextSibling);
+ return el.nextSibling;
}
- case "beforeend":
- if(el.lastChild){
- range.setStartAfter(el.lastChild);
- frag = range.createContextualFragment(html);
- el.appendChild(frag);
- return el.lastChild;
- }else{
- el.innerHTML = html;
- return el.lastChild;
+ throw 'Illegal insertion point -> "' + where + '"';
+ },
+
+ /**
+ * Creates new Dom element(s) and inserts them before el
+ * @param {String/HTMLElement/Element} el The context element
+ * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
+ * @param {Boolean} returnElement (optional) true to return a Roo.Element
+ * @return {HTMLElement/Roo.Element} The new node
+ */
+ insertBefore : function(el, o, returnElement){
+ return this.doInsert(el, o, returnElement, "beforeBegin");
+ },
+
+ /**
+ * Creates new Dom element(s) and inserts them after el
+ * @param {String/HTMLElement/Element} el The context element
+ * @param {Object} o The Dom object spec (and children)
+ * @param {Boolean} returnElement (optional) true to return a Roo.Element
+ * @return {HTMLElement/Roo.Element} The new node
+ */
+ insertAfter : function(el, o, returnElement){
+ return this.doInsert(el, o, returnElement, "afterEnd", "nextSibling");
+ },
+
+ /**
+ * Creates new Dom element(s) and inserts them as the first child of el
+ * @param {String/HTMLElement/Element} el The context element
+ * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
+ * @param {Boolean} returnElement (optional) true to return a Roo.Element
+ * @return {HTMLElement/Roo.Element} The new node
+ */
+ insertFirst : function(el, o, returnElement){
+ return this.doInsert(el, o, returnElement, "afterBegin");
+ },
+
+ // private
+ doInsert : function(el, o, returnElement, pos, sibling){
+ el = Roo.getDom(el);
+ var newNode;
+ if(this.useDom || o.ns){
+ newNode = createDom(o, null);
+ el.parentNode.insertBefore(newNode, sibling ? el[sibling] : el);
+ }else{
+ var html = createHtml(o);
+ newNode = this.insertHtml(pos, el, html);
+ }
+ return returnElement ? Roo.get(newNode, true) : newNode;
+ },
+
+ /**
+ * Creates new Dom element(s) and appends them to el
+ * @param {String/HTMLElement/Element} el The context element
+ * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
+ * @param {Boolean} returnElement (optional) true to return a Roo.Element
+ * @return {HTMLElement/Roo.Element} The new node
+ */
+ append : function(el, o, returnElement){
+ el = Roo.getDom(el);
+ var newNode;
+ if(this.useDom || o.ns){
+ newNode = createDom(o, null);
+ el.appendChild(newNode);
+ }else{
+ var html = createHtml(o);
+ newNode = this.insertHtml("beforeEnd", el, html);
+ }
+ return returnElement ? Roo.get(newNode, true) : newNode;
+ },
+
+ /**
+ * Creates new Dom element(s) and overwrites the contents of el with them
+ * @param {String/HTMLElement/Element} el The context element
+ * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
+ * @param {Boolean} returnElement (optional) true to return a Roo.Element
+ * @return {HTMLElement/Roo.Element} The new node
+ */
+ overwrite : function(el, o, returnElement)
+ {
+ el = Roo.getDom(el);
+ if (o.ns) {
+
+ while (el.childNodes.length) {
+ el.removeChild(el.firstChild);
}
- case "afterend":
- range.setStartAfter(el);
- frag = range.createContextualFragment(html);
- el.parentNode.insertBefore(frag, el.nextSibling);
- return el.nextSibling;
+ createDom(o, el);
+ } else {
+ el.innerHTML = createHtml(o);
}
- throw 'Illegal insertion point -> "' + where + '"';
- },
-
- /**
- * Creates new Dom element(s) and inserts them before el
- * @param {String/HTMLElement/Element} el The context element
- * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
- * @param {Boolean} returnElement (optional) true to return a Roo.Element
- * @return {HTMLElement/Roo.Element} The new node
- */
- insertBefore : function(el, o, returnElement){
- return this.doInsert(el, o, returnElement, "beforeBegin");
- },
-
- /**
- * Creates new Dom element(s) and inserts them after el
- * @param {String/HTMLElement/Element} el The context element
- * @param {Object} o The Dom object spec (and children)
- * @param {Boolean} returnElement (optional) true to return a Roo.Element
- * @return {HTMLElement/Roo.Element} The new node
- */
- insertAfter : function(el, o, returnElement){
- return this.doInsert(el, o, returnElement, "afterEnd", "nextSibling");
- },
-
- /**
- * Creates new Dom element(s) and inserts them as the first child of el
- * @param {String/HTMLElement/Element} el The context element
- * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
- * @param {Boolean} returnElement (optional) true to return a Roo.Element
- * @return {HTMLElement/Roo.Element} The new node
- */
- insertFirst : function(el, o, returnElement){
- return this.doInsert(el, o, returnElement, "afterBegin");
- },
-
- // private
- doInsert : function(el, o, returnElement, pos, sibling){
- el = Roo.getDom(el);
- var newNode;
- if(this.useDom || o.ns){
- newNode = createDom(o, null);
- el.parentNode.insertBefore(newNode, sibling ? el[sibling] : el);
- }else{
- var html = createHtml(o);
- newNode = this.insertHtml(pos, el, html);
- }
- return returnElement ? Roo.get(newNode, true) : newNode;
- },
-
- /**
- * Creates new Dom element(s) and appends them to el
- * @param {String/HTMLElement/Element} el The context element
- * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
- * @param {Boolean} returnElement (optional) true to return a Roo.Element
- * @return {HTMLElement/Roo.Element} The new node
- */
- append : function(el, o, returnElement){
- el = Roo.getDom(el);
- var newNode;
- if(this.useDom || o.ns){
- newNode = createDom(o, null);
- el.appendChild(newNode);
- }else{
+
+ return returnElement ? Roo.get(el.firstChild, true) : el.firstChild;
+ },
+
+ /**
+ * Creates a new Roo.DomHelper.Template from the Dom object spec
+ * @param {Object} o The Dom object spec (and children)
+ * @return {Roo.DomHelper.Template} The new template
+ */
+ createTemplate : function(o){
var html = createHtml(o);
- newNode = this.insertHtml("beforeEnd", el, html);
- }
- return returnElement ? Roo.get(newNode, true) : newNode;
- },
-
- /**
- * Creates new Dom element(s) and overwrites the contents of el with them
- * @param {String/HTMLElement/Element} el The context element
- * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
- * @param {Boolean} returnElement (optional) true to return a Roo.Element
- * @return {HTMLElement/Roo.Element} The new node
- */
- overwrite : function(el, o, returnElement){
- el = Roo.getDom(el);
- if (o.ns) {
-
- while (el.childNodes.length) {
- el.removeChild(el.firstChild);
- }
- createDom(o, el);
- } else {
- el.innerHTML = createHtml(o);
+ return new Roo.Template(html);
+ },
+ /**
+ * Updates the first element with the spec from the o (replacing if necessary)
+ * This iterates through the children, and updates attributes / children etc..
+ * @param {String/HTMLElement/Element} el The context element
+ * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
+ */
+
+ update : function(el, o)
+ {
+ updateNode(Roo.getDom(el), createDom(o));
+
}
- return returnElement ? Roo.get(el.firstChild, true) : el.firstChild;
- },
-
- /**
- * Creates a new Roo.DomHelper.Template from the Dom object spec
- * @param {Object} o The Dom object spec (and children)
- * @return {Roo.DomHelper.Template} The new template
- */
- createTemplate : function(o){
- var html = createHtml(o);
- return new Roo.Template(html);
- }
+
};
}();
// update attributes
- if (db) {
- var dbo = new cls({node : sel});
+ if (block) {
+
this.tb.fields.each(function(e) {
- e.setValue(dob[e.attrname]);
+ e.setValue(block[e.attrname]);
});
}
this.updateToolbarStyles(sel);
- // flag our selected Node.
- this.tb.selectedNode = sel;
-
+
Roo.menu.MenuMgr.hideAll();
width: item.width ? item.width : 130,
listeners : {
'select': function(c, r, i) {
- if (tb.selectedNode.hasClass('data-block')) {
+ if (tb.selectedNode.hasAttribute('data-block')) {
var b = Roo.htmleditor.Block.factory(tb.selectedNode);
b[c.attrname] = r.get('val');
b.updateElement(tb.selectedNode);
listeners: {
'change' : function(f, nv, ov) {
- if (tb.selectedNode.hasClass('data-block')) {
+ if (tb.selectedNode.hasAttribute('data-block')) {
var b = Roo.htmleditor.Block.factory(tb.selectedNode);
- b[c.attrname] = nv;
+ b[f.attrname] = nv;
b.updateElement(tb.selectedNode);
editorcore.syncValue();
return;
// remove
// undo does not work.
var sn = tb.selectedNode;
- var stn = sn.childNodes[0] || sn.nextSibling || sn.previousSibling || pn;
+ var stn = sn.childNodes[0] || sn.nextSibling || sn.previousSibling || sn.parentNode;
if (sn.hasAttribute('data-block')) {
+ stn = sn.nextSibling || sn.previousSibling || sn.parentNode;
sn.parentNode.removeChild(sn);
+
} else {
// remove and keep parents.
a = new Roo.htmleditor.FilterKeepChildren({tag : false});
Roo.htmleditor.Block.factory = function(node)
{
- var cls = Roo.htmleditor['Block' + Roo.get(e).attr('data-block')];
+ var cls = Roo.htmleditor['Block' + Roo.get(node).attr('data-block')];
if (typeof(cls) == 'undefined') {
- Roo.log("OOps missing block : " + 'Block' + Roo.get(e).attr('data-block'));
+ Roo.log("OOps missing block : " + 'Block' + Roo.get(node).attr('data-block'));
return false;
}
- return new cls({ node: e }); /// should trigger update element
+ return new cls({ node: node }); /// should trigger update element
}
},
align: {
title: "Align",
- opts : [ [""],[ "left"],[ "right"],[ "center"],[ "top"]],
+ opts : [[ "left"],[ "right"]],
width : 80
},
text_align: {
title: "Caption Align",
- opts : [ [""],[ "left"],[ "right"],[ "center"],[ "top"]],
+ opts : [ [ "left"],[ "right"],[ "center"]],
width : 80
},
*/
toObject : function()
{
+ var d = document.createElement('div');
+ d.innerHTML = this.caption;
var img = {
tag : 'img',
src : this.image_src,
- alt : this.caption
+ alt : d.innerText.replace(/\n/g, " ") // removeHTML..
};
- if ((''+this.image_width).length) {
+ if ((''+this.image_width).length > 0) {
img.width = this.image_width;
}
- if ((''+ this.height).length) {
+ if ((''+ this.image_height).length > 0) {
img.height = this.image_height;
}
return {
tag: 'figure',
'data-block' : 'Figure',
contenteditable : 'false',
- style : 'text-align:' + this.align,
+ style : 'display:table; float:' + this.align,
cn : [
img,
{
tag: 'figcaption',
contenteditable : true,
- style : 'text-align:left',
+ style : 'text-align:' + this.text_align,
html : this.caption
}
]
readElement : function(node)
{
this.image_src = this.getVal(node, 'img', 'src');
- this.align = this.getVal(node, 'figure', 'style', 'text-align');
+ this.align = this.getVal(node, 'figure', 'style', 'float');
this.caption = this.getVal(node, 'figcaption', 'html');
this.text_align = this.getVal(node, 'figcaption', 'style','text-align');
}
Roo.htmleditor.FilterKeepChildren = function(cfg)
{
Roo.apply(this, cfg);
+ if (this.tag === false) {
+ return; // dont walk.. (you can use this to use this just to do a child removal on a single tag )
+ }
this.walk(cfg.node);
}
node.removeChild(ar[i]);
// what if we need to walk these???
node.parentNode.insertBefore(ar[i], node);
- this.walk(ar[i]);
+ if (this.tag !== false) {
+ this.walk(ar[i]);
+ }
}
node.parentNode.removeChild(node);
return false; // don't walk children
-i buildSDK/dependancy_svg.txt \
--doc-target=docs -D
+#build old ROOJS css
+seed buildSDK/cssmini.js
+
+
# SCSS (really uses the C scss)
php buildSDK/scss-bootstrap.php
\ No newline at end of file
Roo.htmleditor.Tidy
Roo.htmleditor.KeyEnter
+Roo.htmleditor.Block
Roo.htmleditor.BlockFigure
/* Pre */
.undoreset pre, .undoreset code { display: block; font-family: Courier New; white-space: pre; margin: 1em 0; }
+
+/** sneaked in here - as this file is used by editor */
+.roo-htmleditor-body [contenteditable=true]:focus-visible {
+ background-color: #fafafa;
+ padding: 0 5px;;
+}
+.roo-htmleditor-body [contenteditable=true]:hover {
+ border: 1px solid #ccc;
+}
\ No newline at end of file
"desc" : "The new node"
}
]
+ },
+ {
+ "name" : "update",
+ "type" : "function",
+ "desc" : "Updates the first element with the spec from the o (replacing if necessary)\nThis iterates through the children, and updates attributes / children etc..",
+ "sig" : "(el, o)",
+ "static" : false,
+ "memberOf" : "",
+ "isStatic" : false,
+ "isConstructor" : false,
+ "isPrivate" : false,
+ "example" : "",
+ "deprecated" : "",
+ "since" : "",
+ "see" : "",
+ "exceptions" : "",
+ "requires" : "",
+ "params" : [
+ {
+ "name" : "el",
+ "type" : "String/HTMLElement/Element",
+ "desc" : "The context element",
+ "isOptional" : false
+ },
+ {
+ "name" : "o",
+ "type" : "Object/String",
+ "desc" : "The Dom object spec (and children) or raw HTML blob",
+ "isOptional" : false
+ }
+ ],
+ "returns" : []
}
],
"isAbstract" : false,
"tree_children" : [],
"tree_parent" : []
},
+ "Roo.htmleditor.BlockFigure" : {
+ "props" : [
+ {
+ "name" : "align",
+ "type" : "String",
+ "desc" : "t) alignment for the block default left",
+ "memberOf" : ""
+ },
+ {
+ "name" : "caption",
+ "type" : "String",
+ "desc" : "the text to appear below (and in the alt tag)",
+ "memberOf" : ""
+ },
+ {
+ "name" : "image_height",
+ "type" : "String|number",
+ "desc" : "the height of the image number or %?",
+ "memberOf" : ""
+ },
+ {
+ "name" : "image_src",
+ "type" : "String",
+ "desc" : "the url for the image",
+ "memberOf" : ""
+ },
+ {
+ "name" : "image_width",
+ "type" : "String|number",
+ "desc" : "the width of the image number or %?",
+ "memberOf" : ""
+ },
+ {
+ "name" : "text_align",
+ "type" : "String",
+ "desc" : "t) alignment for the text caption default left.",
+ "memberOf" : ""
+ }
+ ],
+ "events" : [],
+ "methods" : [
+ {
+ "name" : "toObject",
+ "type" : "function",
+ "desc" : "create a DomHelper friendly object - for use with\nRoo.DomHelper.markup / overwrite / etc..",
+ "sig" : "()\n{\n\n}",
+ "static" : false,
+ "memberOf" : "",
+ "isStatic" : false,
+ "isConstructor" : false,
+ "isPrivate" : false,
+ "example" : "",
+ "deprecated" : "",
+ "since" : "",
+ "see" : "",
+ "exceptions" : "",
+ "requires" : "",
+ "params" : [],
+ "returns" : []
+ }
+ ],
+ "isAbstract" : false,
+ "isBuilderTop" : false,
+ "implementations" : [],
+ "tree_children" : [],
+ "tree_parent" : []
+ },
"Roo.htmleditor.Filter" : {
"props" : [
{
</span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">;
};
+ </span><span class="jsdoc-comment">// this is a bit like the react update code...
+ //
+
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">updateNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">from</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">to</span><span class="jsdoc-syntax">)
+ {
+ </span><span class="jsdoc-comment">// should we handle non-standard elements?
+
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">from.nodeType </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">to.nodeType</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">from.parentNode.replaceChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">to</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">from</span><span class="jsdoc-syntax">);
+ }
+
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">from.nodeType </span><span class="jsdoc-syntax">== 3) {
+ </span><span class="jsdoc-comment">// assume it's text?!
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">from.data </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">to.data</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
+ }
+ </span><span class="jsdoc-var">from.data </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">to.data</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
+ }
+
+ </span><span class="jsdoc-comment">// assume 'to' doesnt have '1/3 nodetypes!
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">from.nodeType </span><span class="jsdoc-syntax">!=1 || </span><span class="jsdoc-var">from.tagName </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">to.tagName</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">from.parentNode.replaceChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">to</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">from</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
+ }
+ </span><span class="jsdoc-comment">// compare attributes
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ar </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Array.from</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">from.attributes</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">< </span><span class="jsdoc-var">ar.length</span><span class="jsdoc-syntax">;</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">to.hasAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ar</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.name</span><span class="jsdoc-syntax">)) {
+ </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
+ }
+ </span><span class="jsdoc-var">from.removeAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ar</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.name</span><span class="jsdoc-syntax">);
+ }
+ </span><span class="jsdoc-var">ar </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">to.attributes</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">< </span><span class="jsdoc-var">ar.length</span><span class="jsdoc-syntax">;</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">from.getAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ar</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.name</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-var">to.getAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ar</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.name</span><span class="jsdoc-syntax">)) {
+ </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
+ }
+ </span><span class="jsdoc-var">from.setAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ar</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.name</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">to.getAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ar</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.name</span><span class="jsdoc-syntax">));
+ }
+ </span><span class="jsdoc-comment">// children
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">far </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Array.from</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">from.childNodes</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tar </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Array.from</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">to.childNodes</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">< </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">far.length</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">tar.length</span><span class="jsdoc-syntax">); </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">< </span><span class="jsdoc-var">far.length </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">< </span><span class="jsdoc-var">tar.length</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">updateNode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">far</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">tar</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]);
+ </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
+ }
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">< </span><span class="jsdoc-var">far.length</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-comment">// have from // but no 'to'
+ </span><span class="jsdoc-var">from.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">far</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]);
+ </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
+ }
+ </span><span class="jsdoc-var">from.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tar</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]);
+ </span><span class="jsdoc-comment">// have 'to' but no from
+ </span><span class="jsdoc-syntax">}
+
+
+ };
+
+
+
</span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
- </span><span class="jsdoc-comment">/** True to force the use of DOM instead of html fragments @type Boolean */
- </span><span class="jsdoc-var">useDom </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
+ </span><span class="jsdoc-comment">/** True to force the use of DOM instead of html fragments @type Boolean */
+ </span><span class="jsdoc-var">useDom </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
- </span><span class="jsdoc-comment">/**
- * Returns the markup for the passed Element(s) config
- * @param {Object} o The Dom object spec (and children)
- * @return {String}
- */
- </span><span class="jsdoc-var">markup </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">createHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">);
- },
+ </span><span class="jsdoc-comment">/**
+ * Returns the markup for the passed Element(s) config
+ * @param {Object} o The Dom object spec (and children)
+ * @return {String}
+ */
+ </span><span class="jsdoc-var">markup </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">createHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">);
+ },
- </span><span class="jsdoc-comment">/**
- * Applies a style specification to an element
- * @param {String/HTMLElement} el The element to apply styles to
- * @param {String/Object/Function} styles A style specification string eg "width:100px", or object in the form {width:"100px"}, or
- * a function which returns such a specification.
- */
- </span><span class="jsdoc-var">applyStyles </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">styles</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">styles</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">styles </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">"string"</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">re </span><span class="jsdoc-syntax">= /\s?([a-z\-]*)\:\s?([^;]*);?/gi;
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">matches</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-keyword">while </span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">matches </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">re.exec</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">styles</span><span class="jsdoc-syntax">)) != </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-var">el.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">matches</span><span class="jsdoc-syntax">[1], </span><span class="jsdoc-var">matches</span><span class="jsdoc-syntax">[2]);
+ </span><span class="jsdoc-comment">/**
+ * Applies a style specification to an element
+ * @param {String/HTMLElement} el The element to apply styles to
+ * @param {String/Object/Function} styles A style specification string eg "width:100px", or object in the form {width:"100px"}, or
+ * a function which returns such a specification.
+ */
+ </span><span class="jsdoc-var">applyStyles </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">styles</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">styles</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">styles </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">"string"</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">re </span><span class="jsdoc-syntax">= /\s?([a-z\-]*)\:\s?([^;]*);?/gi;
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">matches</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">while </span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">matches </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">re.exec</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">styles</span><span class="jsdoc-syntax">)) != </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-var">el.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">matches</span><span class="jsdoc-syntax">[1], </span><span class="jsdoc-var">matches</span><span class="jsdoc-syntax">[2]);
+ }
+ }</span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">styles </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">"object"</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">style </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">styles</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-var">el.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">]);
+ }
+ }</span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">styles </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">"function"</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-var">Roo.DomHelper.applyStyles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">styles.call</span><span class="jsdoc-syntax">());
}
- }</span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">styles </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">"object"</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">style </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">styles</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-var">el.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">]);
- }
- }</span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">styles </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">"function"</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-var">Roo.DomHelper.applyStyles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">styles.call</span><span class="jsdoc-syntax">());
- }
- }
- },
+ }
+ },
- </span><span class="jsdoc-comment">/**
- * Inserts an HTML fragment into the Dom
- * @param {String} where Where to insert the html in relation to el - beforeBegin, afterBegin, beforeEnd, afterEnd.
- * @param {HTMLElement} el The context element
- * @param {String} html The HTML fragmenet
- * @return {HTMLElement} The new node
- */
- </span><span class="jsdoc-var">insertHtml </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">where</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-var">where </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">where.toLowerCase</span><span class="jsdoc-syntax">();
- </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.insertAdjacentHTML</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tableRe.test</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.tagName</span><span class="jsdoc-syntax">)){
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rs</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">insertIntoTable</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.tagName.toLowerCase</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">where</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">)){
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">rs</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-comment">/**
+ * Inserts an HTML fragment into the Dom
+ * @param {String} where Where to insert the html in relation to el - beforeBegin, afterBegin, beforeEnd, afterEnd.
+ * @param {HTMLElement} el The context element
+ * @param {String} html The HTML fragmenet
+ * @return {HTMLElement} The new node
+ */
+ </span><span class="jsdoc-var">insertHtml </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">where</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-var">where </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">where.toLowerCase</span><span class="jsdoc-syntax">();
+ </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.insertAdjacentHTML</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tableRe.test</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.tagName</span><span class="jsdoc-syntax">)){
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rs</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">insertIntoTable</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.tagName.toLowerCase</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">where</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">)){
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">rs</span><span class="jsdoc-syntax">;
+ }
+ }
+ </span><span class="jsdoc-keyword">switch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">where</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">"beforebegin"</span><span class="jsdoc-syntax">:
+ </span><span class="jsdoc-var">el.insertAdjacentHTML</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'BeforeBegin'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.previousSibling</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">"afterbegin"</span><span class="jsdoc-syntax">:
+ </span><span class="jsdoc-var">el.insertAdjacentHTML</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'AfterBegin'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">"beforeend"</span><span class="jsdoc-syntax">:
+ </span><span class="jsdoc-var">el.insertAdjacentHTML</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'BeforeEnd'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.lastChild</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">"afterend"</span><span class="jsdoc-syntax">:
+ </span><span class="jsdoc-var">el.insertAdjacentHTML</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'AfterEnd'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.nextSibling</span><span class="jsdoc-syntax">;
}
+ </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">'Illegal insertion point -> "' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">where </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'"'</span><span class="jsdoc-syntax">;
}
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.ownerDocument.createRange</span><span class="jsdoc-syntax">();
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">frag</span><span class="jsdoc-syntax">;
</span><span class="jsdoc-keyword">switch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">where</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">"beforebegin"</span><span class="jsdoc-syntax">:
- </span><span class="jsdoc-var">el.insertAdjacentHTML</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'BeforeBegin'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">"beforebegin"</span><span class="jsdoc-syntax">:
+ </span><span class="jsdoc-var">range.setStartBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">frag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">range.createContextualFragment</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">el.parentNode.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">frag</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
</span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.previousSibling</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">"afterbegin"</span><span class="jsdoc-syntax">:
- </span><span class="jsdoc-var">el.insertAdjacentHTML</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'AfterBegin'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">"afterbegin"</span><span class="jsdoc-syntax">:
+ </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-var">range.setStartBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">frag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">range.createContextualFragment</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">el.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">frag</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">;
+ }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+ </span><span class="jsdoc-var">el.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">;
+ }
</span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">"beforeend"</span><span class="jsdoc-syntax">:
- </span><span class="jsdoc-var">el.insertAdjacentHTML</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'BeforeEnd'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.lastChild</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.lastChild</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-var">range.setStartAfter</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.lastChild</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">frag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">range.createContextualFragment</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">el.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">frag</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.lastChild</span><span class="jsdoc-syntax">;
+ }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+ </span><span class="jsdoc-var">el.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.lastChild</span><span class="jsdoc-syntax">;
+ }
</span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">"afterend"</span><span class="jsdoc-syntax">:
- </span><span class="jsdoc-var">el.insertAdjacentHTML</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'AfterEnd'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.nextSibling</span><span class="jsdoc-syntax">;
- }
- </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">'Illegal insertion point -> "' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">where </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'"'</span><span class="jsdoc-syntax">;
- }
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.ownerDocument.createRange</span><span class="jsdoc-syntax">();
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">frag</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-keyword">switch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">where</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">"beforebegin"</span><span class="jsdoc-syntax">:
- </span><span class="jsdoc-var">range.setStartBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">frag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">range.createContextualFragment</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">el.parentNode.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">frag</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.previousSibling</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">"afterbegin"</span><span class="jsdoc-syntax">:
- </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-var">range.setStartBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">frag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">range.createContextualFragment</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">el.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">frag</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">;
- }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
- </span><span class="jsdoc-var">el.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">;
- }
- </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">"beforeend"</span><span class="jsdoc-syntax">:
- </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.lastChild</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-var">range.setStartAfter</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.lastChild</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">range.setStartAfter</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
</span><span class="jsdoc-var">frag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">range.createContextualFragment</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">el.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">frag</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.lastChild</span><span class="jsdoc-syntax">;
- }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
- </span><span class="jsdoc-var">el.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.lastChild</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-var">el.parentNode.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">frag</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el.nextSibling</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.nextSibling</span><span class="jsdoc-syntax">;
}
- </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">"afterend"</span><span class="jsdoc-syntax">:
- </span><span class="jsdoc-var">range.setStartAfter</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">frag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">range.createContextualFragment</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">el.parentNode.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">frag</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el.nextSibling</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el.nextSibling</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">'Illegal insertion point -> "' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">where </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'"'</span><span class="jsdoc-syntax">;
+ },
+
+ </span><span class="jsdoc-comment">/**
+ * Creates new Dom element(s) and inserts them before el
+ * @param {String/HTMLElement/Element} el The context element
+ * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
+ * @param {Boolean} returnElement (optional) true to return a Roo.Element
+ * @return {HTMLElement/Roo.Element} The new node
+ */
+ </span><span class="jsdoc-var">insertBefore </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.doInsert</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">"beforeBegin"</span><span class="jsdoc-syntax">);
+ },
+
+ </span><span class="jsdoc-comment">/**
+ * Creates new Dom element(s) and inserts them after el
+ * @param {String/HTMLElement/Element} el The context element
+ * @param {Object} o The Dom object spec (and children)
+ * @param {Boolean} returnElement (optional) true to return a Roo.Element
+ * @return {HTMLElement/Roo.Element} The new node
+ */
+ </span><span class="jsdoc-var">insertAfter </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.doInsert</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">"afterEnd"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">"nextSibling"</span><span class="jsdoc-syntax">);
+ },
+
+ </span><span class="jsdoc-comment">/**
+ * Creates new Dom element(s) and inserts them as the first child of el
+ * @param {String/HTMLElement/Element} el The context element
+ * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
+ * @param {Boolean} returnElement (optional) true to return a Roo.Element
+ * @return {HTMLElement/Roo.Element} The new node
+ */
+ </span><span class="jsdoc-var">insertFirst </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.doInsert</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">"afterBegin"</span><span class="jsdoc-syntax">);
+ },
+
+ </span><span class="jsdoc-comment">// private
+ </span><span class="jsdoc-var">doInsert </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sibling</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.useDom </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">o.ns</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-var">newNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">createDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">el.parentNode.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sibling </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">sibling</span><span class="jsdoc-syntax">] : </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
+ }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">createHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">newNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.insertHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
}
- </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">'Illegal insertion point -> "' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">where </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'"'</span><span class="jsdoc-syntax">;
- },
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">returnElement </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">;
+ },
- </span><span class="jsdoc-comment">/**
- * Creates new Dom element(s) and inserts them before el
- * @param {String/HTMLElement/Element} el The context element
- * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
- * @param {Boolean} returnElement (optional) true to return a Roo.Element
- * @return {HTMLElement/Roo.Element} The new node
- */
- </span><span class="jsdoc-var">insertBefore </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.doInsert</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">"beforeBegin"</span><span class="jsdoc-syntax">);
- },
+ </span><span class="jsdoc-comment">/**
+ * Creates new Dom element(s) and appends them to el
+ * @param {String/HTMLElement/Element} el The context element
+ * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
+ * @param {Boolean} returnElement (optional) true to return a Roo.Element
+ * @return {HTMLElement/Roo.Element} The new node
+ */
+ </span><span class="jsdoc-var">append </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.useDom </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">o.ns</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-var">newNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">createDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">el.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">);
+ }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">createHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">newNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.insertHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"beforeEnd"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
+ }
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">returnElement </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">;
+ },
- </span><span class="jsdoc-comment">/**
- * Creates new Dom element(s) and inserts them after el
- * @param {String/HTMLElement/Element} el The context element
- * @param {Object} o The Dom object spec (and children)
- * @param {Boolean} returnElement (optional) true to return a Roo.Element
- * @return {HTMLElement/Roo.Element} The new node
- */
- </span><span class="jsdoc-var">insertAfter </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.doInsert</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">"afterEnd"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">"nextSibling"</span><span class="jsdoc-syntax">);
- },
+ </span><span class="jsdoc-comment">/**
+ * Creates new Dom element(s) and overwrites the contents of el with them
+ * @param {String/HTMLElement/Element} el The context element
+ * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
+ * @param {Boolean} returnElement (optional) true to return a Roo.Element
+ * @return {HTMLElement/Roo.Element} The new node
+ */
+ </span><span class="jsdoc-var">overwrite </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">)
+ {
+ </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o.ns</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-comment">/**
- * Creates new Dom element(s) and inserts them as the first child of el
- * @param {String/HTMLElement/Element} el The context element
- * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
- * @param {Boolean} returnElement (optional) true to return a Roo.Element
- * @return {HTMLElement/Roo.Element} The new node
- */
- </span><span class="jsdoc-var">insertFirst </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.doInsert</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">"afterBegin"</span><span class="jsdoc-syntax">);
- },
-
- </span><span class="jsdoc-comment">// private
- </span><span class="jsdoc-var">doInsert </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sibling</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.useDom </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">o.ns</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-var">newNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">createDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">el.parentNode.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sibling </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">sibling</span><span class="jsdoc-syntax">] : </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
- }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">createHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">newNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.insertHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
- }
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">returnElement </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">;
- },
+ </span><span class="jsdoc-keyword">while </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.childNodes.length</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">el.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">);
+ }
+ </span><span class="jsdoc-var">createDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
+ } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
+ </span><span class="jsdoc-var">el.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">createHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">);
+ }
- </span><span class="jsdoc-comment">/**
- * Creates new Dom element(s) and appends them to el
- * @param {String/HTMLElement/Element} el The context element
- * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
- * @param {Boolean} returnElement (optional) true to return a Roo.Element
- * @return {HTMLElement/Roo.Element} The new node
- */
- </span><span class="jsdoc-var">append </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.useDom </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">o.ns</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-var">newNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">createDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">el.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">);
- }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">returnElement </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">;
+ },
+
+ </span><span class="jsdoc-comment">/**
+ * Creates a new Roo.DomHelper.Template from the Dom object spec
+ * @param {Object} o The Dom object spec (and children)
+ * @return {Roo.DomHelper.Template} The new template
+ */
+ </span><span class="jsdoc-var">createTemplate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">){
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">createHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">newNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.insertHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"beforeEnd"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
- }
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">returnElement </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">newNode</span><span class="jsdoc-syntax">;
- },
+ </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">Roo.Template</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
+ },
+ </span><span class="jsdoc-comment">/**
+ * Updates the first element with the spec from the o (replacing if necessary)
+ * This iterates through the children, and updates attributes / children etc..
+ * @param {String/HTMLElement/Element} el The context element
+ * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
+ */
- </span><span class="jsdoc-comment">/**
- * Creates new Dom element(s) and overwrites the contents of el with them
- * @param {String/HTMLElement/Element} el The context element
- * @param {Object/String} o The Dom object spec (and children) or raw HTML blob
- * @param {Boolean} returnElement (optional) true to return a Roo.Element
- * @return {HTMLElement/Roo.Element} The new node
- */
- </span><span class="jsdoc-var">overwrite </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnElement</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o.ns</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">update </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">)
+ {
+ </span><span class="jsdoc-var">updateNode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">), </span><span class="jsdoc-var">createDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">));
- </span><span class="jsdoc-keyword">while </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.childNodes.length</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-var">el.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">);
- }
- </span><span class="jsdoc-var">createDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
- } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
- </span><span class="jsdoc-var">el.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">createHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">);
}
- </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">returnElement </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">el.firstChild</span><span class="jsdoc-syntax">;
- },
- </span><span class="jsdoc-comment">/**
- * Creates a new Roo.DomHelper.Template from the Dom object spec
- * @param {Object} o The Dom object spec (and children)
- * @return {Roo.DomHelper.Template} The new template
- */
- </span><span class="jsdoc-var">createTemplate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">){
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">createHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">Roo.Template</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
- }
};
}();
</span></code></body></html>
\ No newline at end of file
* Protected method that will not generally be called directly. Syncs the contents
* of the editor iframe with the textarea.
*/
- </span><span class="jsdoc-var">syncValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+ </span><span class="jsdoc-var">syncValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+ {
+ </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"HtmlEditorCore:syncValue (EDITOR->TEXT)"</span><span class="jsdoc-syntax">);
</span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.initialized</span><span class="jsdoc-syntax">){
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bd </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.doc.body </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.doc.documentElement</span><span class="jsdoc-syntax">);
</span><span class="jsdoc-comment">//this.cleanUpPaste(); -- this is done else where and causes havoc..
- // remove content editable. (blocks)
- </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.htmleditor.FilterAttributes</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">node </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">bd</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">attrib_black</span><span class="jsdoc-syntax">: [ </span><span class="jsdoc-string">'contenteditable' </span><span class="jsdoc-syntax">] });
+ // not sure if this is really the place for this
+ // the blocks are synced occasionaly - since we currently dont add listeners on the blocks
+ // this has to update attributes that get duped.. like alt and caption..
+
+ </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.doc.body</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.query</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'*[data-block]'</span><span class="jsdoc-syntax">), </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">Roo.htmleditor.Block.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
+ },</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+
+
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">div </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.createElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">div.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">bd.innerHTML</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-comment">// remove content editable. (blocks)
+
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">bd.innerHTML</span><span class="jsdoc-syntax">;
+
+ </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.htmleditor.FilterAttributes</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">node </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">div</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">attrib_black</span><span class="jsdoc-syntax">: [ </span><span class="jsdoc-string">'contenteditable' </span><span class="jsdoc-syntax">] });
+ </span><span class="jsdoc-comment">//?? tidy?
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">div.innerHTML</span><span class="jsdoc-syntax">;
</span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isSafari</span><span class="jsdoc-syntax">){
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">bd.getAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'style'</span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">// Safari puts text-align styles on the body element!
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">m </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">bs </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">bs.match</span><span class="jsdoc-syntax">(/text-align:(.*?);/i) : </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
*/
</span><span class="jsdoc-var">pushValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
{
+ </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"HtmlEditorCore:pushValue (TEXT->EDITOR)"</span><span class="jsdoc-syntax">);
</span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.initialized</span><span class="jsdoc-syntax">){
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.dom.value.trim</span><span class="jsdoc-syntax">();
}
</span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.doc.body</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.query</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'*[data-block]'</span><span class="jsdoc-syntax">), </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.htmleditor</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'Block' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.attr</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'data-block'</span><span class="jsdoc-syntax">)];
- </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"OOps missing block : " </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'Block' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.attr</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'data-block'</span><span class="jsdoc-syntax">));
- </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
- }
- </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">/// should trigger update element
- </span><span class="jsdoc-syntax">},</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">)
+
+ </span><span class="jsdoc-var">Roo.htmleditor.Block.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
+
+ },</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">lc </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.doc.body.lastChild</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">lc </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">lc.nodeType </span><span class="jsdoc-syntax">== 1 && </span><span class="jsdoc-var">lc.getAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"contenteditable"</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">"false"</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-comment">// add an extra line at the end.
+ </span><span class="jsdoc-var">this.doc.body.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.doc.createChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'br'</span><span class="jsdoc-syntax">));
+ }
}
*
* Note you can force an update by calling on('editorevent', scope, false)
*/
- </span><span class="jsdoc-var">updateToolbar</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">editor</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">ev</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">){
+ </span><span class="jsdoc-var">updateToolbar</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">editor </span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">ev</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">){
</span><span class="jsdoc-comment">//Roo.log(ev);
// capture mouse up - this is handy for selecting images..
</span><span class="jsdoc-comment">// http://developer.yahoo.com/yui/docs/simple-editor.js.html
// selectNode - might want to handle IE?
+
+
+
</span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ev </span><span class="jsdoc-syntax">&&
(</span><span class="jsdoc-var">ev.type </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'mouseup' </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">ev.type </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'click' </span><span class="jsdoc-syntax">) &&
</span><span class="jsdoc-var">ev.target </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">ev.target.tagName </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'IMG'</span><span class="jsdoc-syntax">) {
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ans </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.editorcore.getAllAncestors</span><span class="jsdoc-syntax">();
</span><span class="jsdoc-comment">// pick
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ty</span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.form.HtmlEditor.ToolbarContext.types</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ty </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.form.HtmlEditor.ToolbarContext.types</span><span class="jsdoc-syntax">;
</span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">) {
</span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ans.length </span><span class="jsdoc-syntax">? (</span><span class="jsdoc-var">ans</span><span class="jsdoc-syntax">[0] ? </span><span class="jsdoc-var">ans</span><span class="jsdoc-syntax">[0] : </span><span class="jsdoc-var">ans</span><span class="jsdoc-syntax">[1]) : </span><span class="jsdoc-var">this.editorcore.doc.body</span><span class="jsdoc-syntax">;
</span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel.tagName.length </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">sel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.editorcore.doc.body</span><span class="jsdoc-syntax">;
}
- </span><span class="jsdoc-comment">// pick a menu that exists..
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel.tagName.toUpperCase</span><span class="jsdoc-syntax">();
- </span><span class="jsdoc-comment">//sel = typeof(ty[tn]) != 'undefined' ? sel : this.editor.doc.body;
-
- </span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel.tagName.toUpperCase</span><span class="jsdoc-syntax">();
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel.tagName.toUpperCase</span><span class="jsdoc-syntax">();
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">lastSel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.tb.selectedNode</span><span class="jsdoc-syntax">;
-
</span><span class="jsdoc-var">this.tb.selectedNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">left_label </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">;
+
+ </span><span class="jsdoc-comment">// ok see if we are editing a block?
+
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">db </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.findParent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'[data-block]'</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">block </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">db</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">block </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.htmleditor.Block.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">db</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">block</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'BLOCK.' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">db.getAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'data-block'</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">this.tb.selectedNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">db</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.toolbars</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">]) == </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">this.toolbars</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">this.buildToolbar</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">block.context</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">block.friendly_name</span><span class="jsdoc-syntax">);
+ }
+ </span><span class="jsdoc-var">left_label </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">block.friendly_name</span><span class="jsdoc-syntax">;
+ }
- </span><span class="jsdoc-comment">// if current menu does not match..
- </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">this.tb.name </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">) || (</span><span class="jsdoc-var">lastSel </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">this.tb.selectedNode</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">ev </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-var">this.tb.el.hide</span><span class="jsdoc-syntax">();
- </span><span class="jsdoc-comment">///console.log("show: " + tn);
- </span><span class="jsdoc-var">this.tb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ty</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">]) != </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.toolbars</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">] : </span><span class="jsdoc-var">this.toolbars</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'*'</span><span class="jsdoc-syntax">];
- </span><span class="jsdoc-var">this.tb.el.show</span><span class="jsdoc-syntax">();
- </span><span class="jsdoc-comment">// update name
- </span><span class="jsdoc-var">this.tb.items.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.el.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">':&nbsp;'</span><span class="jsdoc-syntax">;
+ }
- </span><span class="jsdoc-comment">// update attributes
- </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tb.fields</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-var">this.tb.fields.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.stylename</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-var">e.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sel.style</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">e.stylename</span><span class="jsdoc-syntax">]);
- </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
- }
- </span><span class="jsdoc-var">e.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sel.getAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.attrname</span><span class="jsdoc-syntax">));
- });
- }
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tb.name </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">tn </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">lastSel </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">this.tb.selectedNode </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">ev </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// no change?
+ </span><span class="jsdoc-syntax">}
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hasStyles </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-var">hasStyles </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
- }
- </span><span class="jsdoc-comment">// update styles
- </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hasStyles</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">st </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.tb.fields.item</span><span class="jsdoc-syntax">(0);
- </span><span class="jsdoc-var">st.store.removeAll</span><span class="jsdoc-syntax">();
+ </span><span class="jsdoc-var">this.tb.el.hide</span><span class="jsdoc-syntax">();
+ </span><span class="jsdoc-comment">///console.log("show: " + tn);
+ </span><span class="jsdoc-var">this.tb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.toolbars</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">]) != </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.toolbars</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">] : </span><span class="jsdoc-var">this.toolbars</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'*'</span><span class="jsdoc-syntax">];
+ </span><span class="jsdoc-var">this.tb.el.show</span><span class="jsdoc-syntax">();
+ </span><span class="jsdoc-comment">// update name
+ </span><span class="jsdoc-var">this.tb.items.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.el.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">left_label </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">':&nbsp;'</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel.className.split</span><span class="jsdoc-syntax">(/\s+/);
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">avs </span><span class="jsdoc-syntax">= [];
- </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'*'</span><span class="jsdoc-syntax">]) {
+ </span><span class="jsdoc-comment">// update attributes
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">db</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dbo </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">node </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">});
+ </span><span class="jsdoc-var">this.tb.fields.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">e.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dob</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">e.attrname</span><span class="jsdoc-syntax">]);
+ });
- </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'*'</span><span class="jsdoc-syntax">], </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-var">avs.push</span><span class="jsdoc-syntax">( [ </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cn.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) > -1 ? 1 : 0 ] );
- });
- }
- </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">]) {
- </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">], </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-var">avs.push</span><span class="jsdoc-syntax">( [ </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cn.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) > -1 ? 1 : 0 ] );
- });
+
+ } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tb.fields</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">this.tb.fields.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.stylename</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">e.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sel.style</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">e.stylename</span><span class="jsdoc-syntax">]);
+ </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
}
+ </span><span class="jsdoc-var">e.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sel.getAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.attrname</span><span class="jsdoc-syntax">));
+ });
+ }
+ </span><span class="jsdoc-var">this.updateToolbarStyles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">st.store.loadData</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">avs</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">st.collapse</span><span class="jsdoc-syntax">();
- </span><span class="jsdoc-var">st.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">);
- }
- </span><span class="jsdoc-comment">// flag our selected Node.
- </span><span class="jsdoc-var">this.tb.selectedNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-comment">// flag our selected Node.
+ </span><span class="jsdoc-var">this.tb.selectedNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-var">Roo.menu.MenuMgr.hideAll</span><span class="jsdoc-syntax">();
+ </span><span class="jsdoc-var">Roo.menu.MenuMgr.hideAll</span><span class="jsdoc-syntax">();
+
- }
- </span><span class="jsdoc-comment">///if (!updateFooter) {
- //this.footDisp.dom.innerHTML = '';
- // return;
- //}
- // update the footer
+
+ </span><span class="jsdoc-comment">// update the footer
//
+ </span><span class="jsdoc-var">this.updateFooter</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ans</span><span class="jsdoc-syntax">);
+
+ },
+
+ </span><span class="jsdoc-var">updateToolbarStyles </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sel</span><span class="jsdoc-syntax">)
+ {
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hasStyles </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">hasStyles </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
+ }
+
+ </span><span class="jsdoc-comment">// update styles
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hasStyles</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">st </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.tb.fields.item</span><span class="jsdoc-syntax">(0);
+
+ </span><span class="jsdoc-var">st.store.removeAll</span><span class="jsdoc-syntax">();
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sel.className.split</span><span class="jsdoc-syntax">(/\s+/);
+
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">avs </span><span class="jsdoc-syntax">= [];
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'*'</span><span class="jsdoc-syntax">]) {
+
+ </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'*'</span><span class="jsdoc-syntax">], </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">avs.push</span><span class="jsdoc-syntax">( [ </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cn.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) > -1 ? 1 : 0 ] );
+ });
+ }
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">]) {
+ </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">tn</span><span class="jsdoc-syntax">], </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">avs.push</span><span class="jsdoc-syntax">( [ </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cn.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) > -1 ? 1 : 0 ] );
+ });
+ }
+
+ </span><span class="jsdoc-var">st.store.loadData</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">avs</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">st.collapse</span><span class="jsdoc-syntax">();
+ </span><span class="jsdoc-var">st.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">);
+ }
+ },
+
+
+ </span><span class="jsdoc-var">updateFooter </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ans</span><span class="jsdoc-syntax">)
+ {
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ans </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">this.footDisp.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
+ }
</span><span class="jsdoc-var">this.footerEls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ans.reverse</span><span class="jsdoc-syntax">();
</span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.footerEls</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">) {
</span><span class="jsdoc-var">this.footDisp.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-comment">//this.editorsyncValue();
- </span><span class="jsdoc-syntax">},
-
+ },
</span><span class="jsdoc-comment">// private
</span><span class="jsdoc-var">item.enable</span><span class="jsdoc-syntax">();
});
},
- </span><span class="jsdoc-var">buildToolbar</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tlist</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">nm</span><span class="jsdoc-syntax">)
+ </span><span class="jsdoc-var">buildToolbar</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tlist</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">nm</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">friendly_name</span><span class="jsdoc-syntax">)
{
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">editor </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.editor</span><span class="jsdoc-syntax">;
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">editorcore </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.editorcore</span><span class="jsdoc-syntax">;
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.Toolbar</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">wdiv</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-comment">// add the name..
+ </span><span class="jsdoc-var">tb.name </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">nm</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-var">tb.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">nm</span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">":&nbsp;"</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">tb.add</span><span class="jsdoc-syntax">((</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">friendly_name</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">nm </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">friendly_name</span><span class="jsdoc-syntax">) + </span><span class="jsdoc-string">":&nbsp;"</span><span class="jsdoc-syntax">);
+
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">styles </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Array.from</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">styles </span><span class="jsdoc-syntax">= [];
- </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">this.styles</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-var">styles.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">);
- }
</span><span class="jsdoc-comment">// styles...
</span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">styles </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">styles.length</span><span class="jsdoc-syntax">) {
}
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tbc </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.form.HtmlEditor.ToolbarContext</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tbops </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">tbc.options</span><span class="jsdoc-syntax">;
+
</span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">tlist</span><span class="jsdoc-syntax">) {
</span><span class="jsdoc-comment">//optname == used so you can configure the options available..
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">opts </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">item.opts </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">item.opts </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
- </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item.optname</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-var">opts </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">tbops</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">item.optname</span><span class="jsdoc-syntax">];
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item.optname</span><span class="jsdoc-syntax">) { </span><span class="jsdoc-comment">// use the b
+ </span><span class="jsdoc-var">opts </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.form.HtmlEditor.ToolbarContext.options</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">item.optname</span><span class="jsdoc-syntax">];
}
</span><span class="jsdoc-var">data </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">opts
</span><span class="jsdoc-syntax">}),
</span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'-roo-edit-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">,
+
</span><span class="jsdoc-var">attrname </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">,
</span><span class="jsdoc-var">stylename </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">item.style </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">item.style </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
+
</span><span class="jsdoc-var">displayField</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">item.displayField </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">item.displayField </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">,
</span><span class="jsdoc-var">valueField </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">,
</span><span class="jsdoc-var">typeAhead</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">item.width </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">item.width </span><span class="jsdoc-syntax">: 130,
</span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
</span><span class="jsdoc-string">'select'</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tb.selectedNode.hasClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'data-block'</span><span class="jsdoc-syntax">)) {
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.htmleditor.Block.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tb.selectedNode</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">c.attrname</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">r.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">b.updateElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tb.selectedNode</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">editorcore.syncValue</span><span class="jsdoc-syntax">();
+ </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
+ }
+
</span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c.stylename</span><span class="jsdoc-syntax">) {
</span><span class="jsdoc-var">tb.selectedNode.style</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">c.stylename</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">r.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">editorcore.syncValue</span><span class="jsdoc-syntax">();
</span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
}
</span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) {
</span><span class="jsdoc-var">tb.selectedNode.removeAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c.attrname</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">editorcore.syncValue</span><span class="jsdoc-syntax">();
</span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
}
</span><span class="jsdoc-var">tb.selectedNode.setAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c.attrname</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">r.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'val'</span><span class="jsdoc-syntax">));
+ </span><span class="jsdoc-var">editorcore.syncValue</span><span class="jsdoc-syntax">();
}
}
</span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
-
- </span><span class="jsdoc-var">tb.addField</span><span class="jsdoc-syntax">( </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.form.TextField</span><span class="jsdoc-syntax">({
- </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">,
- </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: 100,
- </span><span class="jsdoc-comment">//allowBlank:false,
- </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''
- </span><span class="jsdoc-syntax">}));
- </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
- }
+ </span><span class="jsdoc-comment">/*
+ tb.addField( new Roo.form.TextField({
+ name: i,
+ width: 100,
+ //allowBlank:false,
+ value: ''
+ }));
+ continue;
+ */
+ </span><span class="jsdoc-syntax">}
</span><span class="jsdoc-var">tb.addField</span><span class="jsdoc-syntax">( </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.form.TextField</span><span class="jsdoc-syntax">({
</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'-roo-edit-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">,
</span><span class="jsdoc-var">attrname </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">,
</span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
</span><span class="jsdoc-var">listeners</span><span class="jsdoc-syntax">: {
</span><span class="jsdoc-string">'change' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">nv</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ov</span><span class="jsdoc-syntax">) {
+
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tb.selectedNode.hasClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'data-block'</span><span class="jsdoc-syntax">)) {
+ </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.htmleditor.Block.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tb.selectedNode</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">c.attrname</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">nv</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-var">b.updateElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tb.selectedNode</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">editorcore.syncValue</span><span class="jsdoc-syntax">();
+ </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
+ }
+
</span><span class="jsdoc-var">tb.selectedNode.setAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">f.attrname</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">nv</span><span class="jsdoc-syntax">);
</span><span class="jsdoc-var">editorcore.syncValue</span><span class="jsdoc-syntax">();
}
}
</span><span class="jsdoc-var">tb.addFill</span><span class="jsdoc-syntax">();
- </span><span class="jsdoc-var">tb.addButton</span><span class="jsdoc-syntax">( {
- </span><span class="jsdoc-var">text</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Remove Tag'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// remove the tag, and puts the children outside...
+ </span><span class="jsdoc-var">tb.addButton</span><span class="jsdoc-syntax">({
+ </span><span class="jsdoc-var">text</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'Remove'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// remove the tag, and puts the children outside...
</span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: {
</span><span class="jsdoc-var">click </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">()
{
</span><span class="jsdoc-comment">// remove
// undo does not work.
-
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">tb.selectedNode</span><span class="jsdoc-syntax">;
-
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sn.parentNode</span><span class="jsdoc-syntax">;
-
- </span><span class="jsdoc-comment">// what i'm going to select after deleting..
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">stn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sn.childNodes</span><span class="jsdoc-syntax">[0] || </span><span class="jsdoc-var">sn.nextSibling </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">sn.previousSibling </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">pn</span><span class="jsdoc-syntax">;
-
- </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">stn</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-var">stn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sn.nextSibling</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn.hasAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'data-block'</span><span class="jsdoc-syntax">)) {
+ </span><span class="jsdoc-var">sn.parentNode.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">);
+ } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
+ </span><span class="jsdoc-comment">// remove and keep parents.
+ </span><span class="jsdoc-var">a </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.htmleditor.FilterKeepChildren</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">});
+ </span><span class="jsdoc-var">a.removeTag</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">);
}
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">en </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sn.childNodes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">sn.childNodes.length </span><span class="jsdoc-syntax">- 1 ];
- </span><span class="jsdoc-keyword">while </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn.childNodes.length</span><span class="jsdoc-syntax">) {
- </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">node </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">sn.childNodes</span><span class="jsdoc-syntax">[0];
- </span><span class="jsdoc-var">sn.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-comment">//Roo.log(node);
- </span><span class="jsdoc-var">pn.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">);
- }
- </span><span class="jsdoc-var">pn.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sn</span><span class="jsdoc-syntax">);
+
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">editorcore.createRange</span><span class="jsdoc-syntax">();
</span><span class="jsdoc-var">range.setStart</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">stn</span><span class="jsdoc-syntax">,0);
</span><span class="jsdoc-var">range.setEnd</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">en</span><span class="jsdoc-syntax">,0); </span><span class="jsdoc-comment">//????
- //range.selectNode(sel);
-
-
</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">selection </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">editorcore.getSelection</span><span class="jsdoc-syntax">();
</span><span class="jsdoc-var">selection.removeAllRanges</span><span class="jsdoc-syntax">();
</span><span class="jsdoc-var">selection.addRange</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">range</span><span class="jsdoc-syntax">);
-
</span><span class="jsdoc-comment">//_this.updateToolbar(null, null, pn);
</span><span class="jsdoc-var">_this.updateToolbar</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">_this.footDisp.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-var">_this.updateFooter</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
+
}
}
</span><span class="jsdoc-syntax">});
</span><span class="jsdoc-var">tb.el.setVisibilityMode</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">);
</span><span class="jsdoc-var">tb.el.hide</span><span class="jsdoc-syntax">();
- </span><span class="jsdoc-var">tb.name </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">nm</span><span class="jsdoc-syntax">;
+
</span><span class="jsdoc-comment">// dont need to disable them... as they will get hidden
</span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">tb</span><span class="jsdoc-syntax">;
</span><span class="jsdoc-var">Roo.htmleditor.FilterKeepChildren </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">)
{
</span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tag </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// dont walk.. (you can use this to use this just to do a child removal on a single tag )
+ </span><span class="jsdoc-syntax">}
</span><span class="jsdoc-var">this.walk</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg.node</span><span class="jsdoc-syntax">);
}
</span><span class="jsdoc-var">node.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ar</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]);
</span><span class="jsdoc-comment">// what if we need to walk these???
</span><span class="jsdoc-var">node.parentNode.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ar</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">);
- </span><span class="jsdoc-var">this.walk</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ar</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]);
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tag </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">this.walk</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ar</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]);
+ }
}
</span><span class="jsdoc-var">node.parentNode.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">node</span><span class="jsdoc-syntax">);
</span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// don't walk children
],
"returns" : []
},
+ {
+ "name" : "update",
+ "type" : "function",
+ "desc" : "Updates the first element with the spec from the o (replacing if necessary)\nThis iterates through the children, and updates attributes / children etc..",
+ "sig" : "(el, o)",
+ "static" : false,
+ "memberOf" : "",
+ "isStatic" : false,
+ "isConstructor" : false,
+ "isPrivate" : false,
+ "example" : "",
+ "deprecated" : "",
+ "since" : "",
+ "see" : "",
+ "exceptions" : "",
+ "requires" : "",
+ "params" : [
+ {
+ "name" : "el",
+ "type" : "String/HTMLElement/Element",
+ "desc" : "The context element",
+ "isOptional" : false
+ },
+ {
+ "name" : "o",
+ "type" : "Object/String",
+ "desc" : "The Dom object spec (and children) or raw HTML blob",
+ "isOptional" : false
+ }
+ ],
+ "returns" : []
+ },
{
"name" : "markup",
"type" : "function",
{
"name" : "Roo.htmleditor",
"cn" : [
+ {
+ "name" : "Roo.htmleditor.BlockFigure",
+ "cn" : [],
+ "is_class" : true
+ },
{
"name" : "Roo.htmleditor.Filter",
"cn" : [],
}Q=G(4,J,P,K);}}else if(N=='tbody'){if(O=='beforebegin'){R=el;el=el.parentNode;Q=G(2,ts,P,te);}else if(O=='afterend'){R=el.nextSibling;el=el.parentNode;Q=G(2,ts,P,te);}else{if(O=='afterbegin'){R=el.firstChild;}Q=G(3,H,P,I);}}else{if(O=='beforebegin'||O=='afterend'){return;
}if(O=='afterbegin'){R=el.firstChild;}Q=G(2,ts,P,te);}el.insertBefore(Q,R);return Q;};var M=function(N,to){if(N.nodeType!=to.nodeType){N.parentNode.replaceChild(to,N);}if(N.nodeType==3){if(N.data==to.data){return;}N.data=to.data;return;}if(N.nodeType!=1||N.tagName!=to.tagName){N.parentNode.replaceChild(to,N);
return;}var ar=Array.from(N.attributes);for(var i=0;i<ar.length;i++){if(to.hasAttribute(ar[i].name)){continue;}N.removeAttribute(ar[i].name);}ar=to.attributes;for(var i=0;i<ar.length;i++){if(N.getAttribute(ar[i].name)==to.getAttribute(ar[i].name)){continue;
-}N.setAttribute(ar[i].name,to.getAttribute(ar[i].name));}var O=Array.from(N.childNodes);var P=Array.from(to.childNodes);for(var i=0;i<Math.max(O.length,P.length);i++){if(i<O.length&&i<P.length){M(O[i],P[i]);continue;}if(i<O.length){N.removeChild(O[i]);continue;
-}N.appendChild(P[i]);}};return {useDom:false,markup:function(o){return E(o);},applyStyles:function(el,N){if(N){el=Roo.fly(el);if(typeof N=="string"){var re=/\s?([a-z\-]*)\:\s?([^;]*);?/gi;var O;while((O=re.exec(N))!=null){el.setStyle(O[1],O[2]);}}else if(typeof N=="object"){for(var P in N){el.setStyle(P,N[P]);
+}N.setAttribute(ar[i].name,to.getAttribute(ar[i].name));}var O=Array.from(N.childNodes);var P=Array.from(to.childNodes);if(N.innerHTML==to.innerHTML){return;}if(O.length!=P.length){N.innerHTML=to.innerHTML;return;}for(var i=0;i<O.length;i++){M(O[i],P[i]);
+}};return {useDom:false,markup:function(o){return E(o);},applyStyles:function(el,N){if(N){el=Roo.fly(el);if(typeof N=="string"){var re=/\s?([a-z\-]*)\:\s?([^;]*);?/gi;var O;while((O=re.exec(N))!=null){el.setStyle(O[1],O[2]);}}else if(typeof N=="object"){for(var P in N){el.setStyle(P,N[P]);
}}else if(typeof N=="function"){Roo.DomHelper.applyStyles(el,N.call());}}},insertHtml:function(N,el,O){N=N.toLowerCase();if(el.insertAdjacentHTML){if(C.test(el.tagName)){var rs;if(rs=L(el.tagName.toLowerCase(),N,el,O)){return rs;}}switch(N){case "beforebegin":el.insertAdjacentHTML('BeforeBegin',O);
return el.previousSibling;case "afterbegin":el.insertAdjacentHTML('AfterBegin',O);return el.firstChild;case "beforeend":el.insertAdjacentHTML('BeforeEnd',O);return el.lastChild;case "afterend":el.insertAdjacentHTML('AfterEnd',O);return el.nextSibling;}throw 'Illegal insertion point -> "'+N+'"';
}var P=el.ownerDocument.createRange();var Q;switch(N){case "beforebegin":P.setStartBefore(el);Q=P.createContextualFragment(O);el.parentNode.insertBefore(Q,el);return el.previousSibling;case "afterbegin":if(el.firstChild){P.setStartBefore(el.firstChild);Q=P.createContextualFragment(O);
Roo.htmleditor.KeyEnter=function(A){Roo.apply(this,A);Roo.get(this.core.doc.body).on('keypress',this.keypress,this);};Roo.htmleditor.KeyEnter.prototype={core:false,keypress:function(e){if(e.charCode!=13){return true;}e.preventDefault();var A=this.core.doc;
var B=A.createDocumentFragment();var C=A.createTextNode('\n');B.appendChild(C);C=A.createElement('br');B.appendChild(C);var D=this.core.win.getSelection().getRangeAt(0);D.deleteContents();D.insertNode(B);D=A.createRange();D.setStartAfter(C);D.collapse(true);
var E=this.core.win.getSelection();E.removeAllRanges();E.addRange(D);return false;}};
+// Roo/htmleditor/Block.js
+Roo.htmleditor.Block=function(A){};Roo.htmleditor.Block.factory=function(A){var B=Roo.htmleditor['Block'+Roo.get(A).attr('data-block')];if(typeof(B)=='undefined'){Roo.log("OOps missing block : "+'Block'+Roo.get(A).attr('data-block'));return false;}return new B({node:A}
+);};Roo.htmleditor.Block.prototype={friendly_name:'Image with caption',context:false,updateElement:function(A){Roo.DomHelper.update(A,this.toObject());},toHTML:function(){return Roo.DomHelper.markup(this.toObject());},getVal:function(A,B,C,D){var n=A;if(n.tagName!=B.toUpperCase()){n=A.getElementsByTagName(B).item(0);
+}if(C=='html'){return n.innerHTML;}if(C=='style'){return Roo.get(n).getStyle(D);}return Roo.get(n).attr(C);},toObject:function(){return {};},readElement:function(A){}};
// Roo/htmleditor/BlockFigure.js
Roo.htmleditor.BlockFigure=function(A){if(A.node){this.readElement(A.node);this.updateElement(A.node);}Roo.apply(this,A);};Roo.extend(Roo.htmleditor.BlockFigure,Roo.htmleditor.Block,{image_src:'',align:'left',caption:'',text_align:'left',image_width:'',image_height:'',friendly_name:'Image with caption',context:{image_width:{title:"Width",width:40}
-,image_height:{title:"Height",width:40},align:{title:"Align",opts:[[""],["left"],["right"],["center"],["top"]],width:80},text_align:{title:"Caption Align",opts:[[""],["left"],["right"],["center"],["top"]],width:80},image_src:{title:"Src",width:220}},toObject:function(){var A={tag:'img',src:this.image_src,alt:this.caption}
-;if((''+this.image_width).length){A.width=this.image_width;}if((''+this.height).length){A.height=this.image_height;}return {tag:'figure','data-block':'Figure',contenteditable:'false',style:'text-align:'+this.align,cn:[A,{tag:'figcaption',contenteditable:true,style:'text-align:left',html:this.caption}
-]};},readElement:function(A){this.image_src=this.getVal(A,'img','src');this.align=this.getVal(A,'figure','style','text-align');this.caption=this.getVal(A,'figcaption','html');this.text_align=this.getVal(A,'figcaption','style','text-align');}})
+,image_height:{title:"Height",width:40},align:{title:"Align",opts:[["left"],["right"]],width:80},text_align:{title:"Caption Align",opts:[["left"],["right"],["center"]],width:80},image_src:{title:"Src",width:220}},toObject:function(){var d=document.createElement('div');
+d.innerHTML=this.caption;var A={tag:'img',src:this.image_src,alt:d.innerText.replace(/\n/g," ")};if((''+this.image_width).length){A.width=this.image_width;}if((''+this.height).length){A.height=this.image_height;}return {tag:'figure','data-block':'Figure',contenteditable:'false',style:'display:table; float:'+this.align,cn:[A,{tag:'figcaption',contenteditable:true,style:'text-align:'+this.text_align,html:this.caption}
+]};},readElement:function(A){this.image_src=this.getVal(A,'img','src');this.align=this.getVal(A,'figure','style','float');this.caption=this.getVal(A,'figcaption','html');this.text_align=this.getVal(A,'figcaption','style','text-align');}})
// Roo/HtmlEditorCore.js
Roo.HtmlEditorCore=function(A){Roo.HtmlEditorCore.superclass.constructor.call(this,A);this.addEvents({initialize:true,activate:true,beforesync:true,beforepush:true,sync:true,push:true,editorevent:true});this.applyBlacklists();};Roo.extend(Roo.HtmlEditorCore,Roo.Component,{owner:false,resizable:false,height:300,width:500,stylesheets:false,allowComments:false,frameId:false,validationEvent:false,deferHeight:true,initialized:false,activated:false,sourceEditMode:false,onFocus:Roo.emptyFn,iframePad:3,hideMode:'offsets',clearUp:true,black:false,white:false,bodyCls:'',getDocMarkup:function(){var st='';
if(this.stylesheets===false){Roo.get(document.head).select('style').each(function(B){st+=B.dom.outerHTML||new XMLSerializer().serializeToString(B.dom);});Roo.get(document.head).select('link').each(function(B){st+=B.dom.outerHTML||new XMLSerializer().serializeToString(B.dom);
var C=B.ownerDocument.createRange();try{C.selectNode(B);}catch(e){C.selectNodeContents(B);}var s=this.editorcore.win.getSelection();s.removeAllRanges();s.addRange(C);}var D=this.editorcore.getAllAncestors();var ty=Roo.form.HtmlEditor.ToolbarContext.types;
if(!B){B=D.length?(D[0]?D[0]:D[1]):this.editorcore.doc.body;B=B?B:this.editorcore.doc.body;B=B.tagName.length?B:this.editorcore.doc.body;}var tn=B.tagName.toUpperCase();var E=this.tb.selectedNode;this.tb.selectedNode=B;var F=tn;var db=Roo.get(B).findParent('[data-block]');
var G=false;if(db){G=Roo.htmleditor.Block.factory(db);if(G){tn='BLOCK.'+db.getAttribute('data-block');this.tb.selectedNode=db;if(typeof(this.toolbars[tn])=='undefined'){this.toolbars[tn]=this.buildToolbar(G.context,tn,G.friendly_name);}F=G.friendly_name;}
-}if(this.tb.name==tn&&E==this.tb.selectedNode&&ev!==false){return;}this.tb.el.hide();this.tb=typeof(this.toolbars[tn])!='undefined'?this.toolbars[tn]:this.toolbars['*'];this.tb.el.show();this.tb.items.first().el.innerHTML=F+': ';if(db){var H=new cls({node:B}
-);this.tb.fields.each(function(e){e.setValue(dob[e.attrname]);});}else if(this.tb.fields){this.tb.fields.each(function(e){if(e.stylename){e.setValue(B.style[e.stylename]);return;}e.setValue(B.getAttribute(e.attrname));});}this.updateToolbarStyles(B);this.tb.selectedNode=B;
-Roo.menu.MenuMgr.hideAll();this.updateFooter(D);},updateToolbarStyles:function(A){var B=false;for(var i in this.styles){B=true;break;}if(B){var st=this.tb.fields.item(0);st.store.removeAll();var cn=A.className.split(/\s+/);var C=[];if(this.styles['*']){Roo.each(this.styles['*'],function(v){C.push([v,cn.indexOf(v)>-1?1:0]);
-});}if(this.styles[tn]){Roo.each(this.styles[tn],function(v){C.push([v,cn.indexOf(v)>-1?1:0]);});}st.store.loadData(C);st.collapse();st.setValue(cn);}},updateFooter:function(A){var B='';if(A===false){this.footDisp.dom.innerHTML='';return;}this.footerEls=A.reverse();
-Roo.each(this.footerEls,function(a,i){if(!a){return;}B+=B.length?' > ':'';B+='<span class="x-ed-loc-'+i+'">'+a.tagName+'</span>';});var sz=this.footDisp.up('td').getSize();this.footDisp.dom.style.width=(sz.width-10)+'px';this.footDisp.dom.style.marginLeft='5px';
-this.footDisp.dom.style.overflow='hidden';this.footDisp.dom.innerHTML=B;},onDestroy:function(){if(this.rendered){this.tb.items.each(function(A){if(A.menu){A.menu.removeAll();if(A.menu.el){A.menu.el.destroy();}}A.destroy();});}},onFirstFocus:function(){this.tb.items.each(function(A){A.enable();
-});},buildToolbar:function(A,nm,B){var C=this.editor;var D=this.editorcore;var E=C.wrap.createChild({tag:'div'},C.wrap.dom.firstChild.nextSibling,true);var tb=new Roo.Toolbar(E);tb.name=nm;tb.add((typeof(B)=='undefined'?nm:B)+": ");var F=Array.from(this.styles);
-if(F&&F.length){tb.addField(new Roo.form.ComboBox({store:new Roo.data.SimpleStore({id:'val',fields:['val','selected'],data:[]}),name:'-roo-edit-className',attrname:'className',displayField:'val',typeAhead:false,mode:'local',editable:false,triggerAction:'all',emptyText:'Select Style',selectOnFocus:true,width:130,listeners:{'select':function(c,r,i){tb.selectedNode.className=r?r.get('val'):'';
+}if(this.tb.name==tn&&E==this.tb.selectedNode&&ev!==false){return;}this.tb.el.hide();this.tb=typeof(this.toolbars[tn])!='undefined'?this.toolbars[tn]:this.toolbars['*'];this.tb.el.show();this.tb.items.first().el.innerHTML=F+': ';if(G){this.tb.fields.each(function(e){e.setValue(G[e.attrname]);
+});}else if(this.tb.fields){this.tb.fields.each(function(e){if(e.stylename){e.setValue(B.style[e.stylename]);return;}e.setValue(B.getAttribute(e.attrname));});}this.updateToolbarStyles(B);Roo.menu.MenuMgr.hideAll();this.updateFooter(D);},updateToolbarStyles:function(A){var B=false;
+for(var i in this.styles){B=true;break;}if(B){var st=this.tb.fields.item(0);st.store.removeAll();var cn=A.className.split(/\s+/);var C=[];if(this.styles['*']){Roo.each(this.styles['*'],function(v){C.push([v,cn.indexOf(v)>-1?1:0]);});}if(this.styles[tn]){Roo.each(this.styles[tn],function(v){C.push([v,cn.indexOf(v)>-1?1:0]);
+});}st.store.loadData(C);st.collapse();st.setValue(cn);}},updateFooter:function(A){var B='';if(A===false){this.footDisp.dom.innerHTML='';return;}this.footerEls=A.reverse();Roo.each(this.footerEls,function(a,i){if(!a){return;}B+=B.length?' > ':'';B+='<span class="x-ed-loc-'+i+'">'+a.tagName+'</span>';
+});var sz=this.footDisp.up('td').getSize();this.footDisp.dom.style.width=(sz.width-10)+'px';this.footDisp.dom.style.marginLeft='5px';this.footDisp.dom.style.overflow='hidden';this.footDisp.dom.innerHTML=B;},onDestroy:function(){if(this.rendered){this.tb.items.each(function(A){if(A.menu){A.menu.removeAll();
+if(A.menu.el){A.menu.el.destroy();}}A.destroy();});}},onFirstFocus:function(){this.tb.items.each(function(A){A.enable();});},buildToolbar:function(A,nm,B){var C=this.editor;var D=this.editorcore;var E=C.wrap.createChild({tag:'div'},C.wrap.dom.firstChild.nextSibling,true);
+var tb=new Roo.Toolbar(E);tb.name=nm;tb.add((typeof(B)=='undefined'?nm:B)+": ");var F=Array.from(this.styles);if(F&&F.length){tb.addField(new Roo.form.ComboBox({store:new Roo.data.SimpleStore({id:'val',fields:['val','selected'],data:[]}),name:'-roo-edit-className',attrname:'className',displayField:'val',typeAhead:false,mode:'local',editable:false,triggerAction:'all',emptyText:'Select Style',selectOnFocus:true,width:130,listeners:{'select':function(c,r,i){tb.selectedNode.className=r?r.get('val'):'';
D.syncValue();}}}));}var G=Roo.form.HtmlEditor.ToolbarContext;for(var i in A){var H=A[i];tb.add(H.title+": ");var I=H.opts?H.opts:false;if(H.optname){I=Roo.form.HtmlEditor.ToolbarContext.options[H.optname];}if(I){tb.addField(new Roo.form.ComboBox({store:typeof(G.stores[i])!='undefined'?Roo.factory(G.stores[i],Roo.data):new Roo.data.SimpleStore({id:'val',fields:['val','display'],data:I}
-),name:'-roo-edit-'+i,attrname:i,stylename:H.style?H.style:false,displayField:H.displayField?H.displayField:'val',valueField:'val',typeAhead:false,mode:typeof(G.stores[i])!='undefined'?'remote':'local',editable:false,triggerAction:'all',emptyText:'Select',selectOnFocus:true,width:H.width?H.width:130,listeners:{'select':function(c,r,i){if(tb.selectedNode.hasClass('data-block')){var b=Roo.htmleditor.Block.factory(tb.selectedNode);
+),name:'-roo-edit-'+i,attrname:i,stylename:H.style?H.style:false,displayField:H.displayField?H.displayField:'val',valueField:'val',typeAhead:false,mode:typeof(G.stores[i])!='undefined'?'remote':'local',editable:false,triggerAction:'all',emptyText:'Select',selectOnFocus:true,width:H.width?H.width:130,listeners:{'select':function(c,r,i){if(tb.selectedNode.hasAttribute('data-block')){var b=Roo.htmleditor.Block.factory(tb.selectedNode);
b[c.attrname]=r.get('val');b.updateElement(tb.selectedNode);D.syncValue();return;}if(c.stylename){tb.selectedNode.style[c.stylename]=r.get('val');D.syncValue();return;}if(r===false){tb.selectedNode.removeAttribute(c.attrname);D.syncValue();return;}tb.selectedNode.setAttribute(c.attrname,r.get('val'));
-D.syncValue();}}}));continue;}tb.addField(new Roo.form.TextField({name:'-roo-edit-'+i,attrname:i,width:H.width,value:'',listeners:{'change':function(f,nv,ov){if(tb.selectedNode.hasClass('data-block')){var b=Roo.htmleditor.Block.factory(tb.selectedNode);b[c.attrname]=nv;
-b.updateElement(tb.selectedNode);D.syncValue();return;}tb.selectedNode.setAttribute(f.attrname,nv);D.syncValue();}}}));}var J=this;if(nm=='BODY'){tb.addSeparator();tb.addButton({text:'Stylesheets',listeners:{click:function(){J.editor.fireEvent('stylesheetsclick',J.editor);
-}}});}tb.addFill();tb.addButton({text:'Remove',listeners:{click:function(){var sn=tb.selectedNode;var K=sn.childNodes[0]||sn.nextSibling||sn.previousSibling||pn;if(sn.hasAttribute('data-block')){sn.parentNode.removeChild(sn);}else{a=new Roo.htmleditor.FilterKeepChildren({tag:false}
-);a.removeTag(sn);}var L=D.createRange();L.setStart(K,0);L.setEnd(en,0);var M=D.getSelection();M.removeAllRanges();M.addRange(L);J.updateToolbar(null,null,null);J.updateFooter(false);}}});tb.el.on('click',function(e){e.preventDefault();});tb.el.setVisibilityMode(Roo.Element.DISPLAY);
-tb.el.hide();return tb;},buildFooter:function(){var A=this.editor.wrap.createChild();this.footer=new Roo.Toolbar(A);var B=new Roo.Toolbar.Fill();var _t=this;this.footer.add({text:'<',xtype:'Button',handler:function(){_t.footDisp.scrollTo('left',0,true)}
-});this.footer.add(B);this.footer.add({text:'>',xtype:'Button',handler:function(){_t.footDisp.select('span').last().scrollIntoView(_t.footDisp,true);}});var A=Roo.get(B.el);A.addClass('x-editor-context');this.footDispWrap=A;this.footDispWrap.overflow='hidden';
-this.footDisp=A.createChild();this.footDispWrap.on('click',this.onContextClick,this)},onContextClick:function(ev,A){ev.preventDefault();var cn=A.className;if(!cn.match(/x-ed-loc-/)){return;}var n=cn.split('-').pop();var B=this.footerEls;var C=B[n];var D=this.editorcore.createRange();
-D.selectNodeContents(C);var E=this.editorcore.getSelection();E.removeAllRanges();E.addRange(D);this.updateToolbar(null,null,C);}});
+D.syncValue();}}}));continue;}tb.addField(new Roo.form.TextField({name:'-roo-edit-'+i,attrname:i,width:H.width,value:'',listeners:{'change':function(f,nv,ov){if(tb.selectedNode.hasAttribute('data-block')){var b=Roo.htmleditor.Block.factory(tb.selectedNode);
+b[f.attrname]=nv;b.updateElement(tb.selectedNode);D.syncValue();return;}tb.selectedNode.setAttribute(f.attrname,nv);D.syncValue();}}}));}var J=this;if(nm=='BODY'){tb.addSeparator();tb.addButton({text:'Stylesheets',listeners:{click:function(){J.editor.fireEvent('stylesheetsclick',J.editor);
+}}});}tb.addFill();tb.addButton({text:'Remove',listeners:{click:function(){var sn=tb.selectedNode;var K=sn.childNodes[0]||sn.nextSibling||sn.previousSibling||sn.parentNode;if(sn.hasAttribute('data-block')){K=sn.nextSibling||sn.previousSibling||sn.parentNode;
+sn.parentNode.removeChild(sn);}else{a=new Roo.htmleditor.FilterKeepChildren({tag:false});a.removeTag(sn);}var L=D.createRange();L.setStart(K,0);L.setEnd(en,0);var M=D.getSelection();M.removeAllRanges();M.addRange(L);J.updateToolbar(null,null,null);J.updateFooter(false);
+}}});tb.el.on('click',function(e){e.preventDefault();});tb.el.setVisibilityMode(Roo.Element.DISPLAY);tb.el.hide();return tb;},buildFooter:function(){var A=this.editor.wrap.createChild();this.footer=new Roo.Toolbar(A);var B=new Roo.Toolbar.Fill();var _t=this;
+this.footer.add({text:'<',xtype:'Button',handler:function(){_t.footDisp.scrollTo('left',0,true)}});this.footer.add(B);this.footer.add({text:'>',xtype:'Button',handler:function(){_t.footDisp.select('span').last().scrollIntoView(_t.footDisp,true);}});
+var A=Roo.get(B.el);A.addClass('x-editor-context');this.footDispWrap=A;this.footDispWrap.overflow='hidden';this.footDisp=A.createChild();this.footDispWrap.on('click',this.onContextClick,this)},onContextClick:function(ev,A){ev.preventDefault();var cn=A.className;
+if(!cn.match(/x-ed-loc-/)){return;}var n=cn.split('-').pop();var B=this.footerEls;var C=B[n];var D=this.editorcore.createRange();D.selectNodeContents(C);var E=this.editorcore.getSelection();E.removeAllRanges();E.addRange(D);this.updateToolbar(null,null,C);
+}});
// Roo/form/BasicForm.js
Roo.form.BasicForm=function(el,A){this.allItems=[];this.childForms=[];Roo.apply(this,A);this.items=new Roo.util.MixedCollection(false,function(o){return o.id||(o.id=Roo.id());});this.addEvents({beforeaction:true,actionfailed:true,actioncomplete:true});if(el){this.initEl(el);
}Roo.form.BasicForm.superclass.constructor.call(this);Roo.form.BasicForm.popover.apply();};Roo.extend(Roo.form.BasicForm,Roo.util.Observable,{timeout:30,activeAction:null,trackResetOnLoad:false,childForms:false,allItems:false,waitMsgTarget:false,disableMask:false,errorMask:false,maskOffset:100,initEl:function(el){this.el=Roo.get(el);
// children
var far = Array.from(from.childNodes);
var tar = Array.from(to.childNodes);
- for(var i = 0; i < Math.max(far.length, tar.length); i++) {
- if (i < far.length && i < tar.length) {
- updateNode(far[i], tar[i]);
- continue;
- }
- if (i < far.length) {
- // have from // but no 'to'
- from.removeChild(far[i]);
- continue;
- }
- from.appendChild(tar[i]);
- // have 'to' but no from
+ // if the lengths are different.. then it's probably a editable content change, rather than
+ // a change of the block definition..
+ if (from.innerHTML == to.innerHTML) {
+ return;
+ }
+ if (far.length != tar.length) {
+ from.innerHTML = to.innerHTML;
+ return;
+ }
+
+ for(var i = 0; i < far.length; i++) {
+ updateNode(far[i], tar[i]);
}
}Q=G(4,J,P,K);}}else if(N=='tbody'){if(O=='beforebegin'){R=el;el=el.parentNode;Q=G(2,ts,P,te);}else if(O=='afterend'){R=el.nextSibling;el=el.parentNode;Q=G(2,ts,P,te);}else{if(O=='afterbegin'){R=el.firstChild;}Q=G(3,H,P,I);}}else{if(O=='beforebegin'||O=='afterend'){return;
}if(O=='afterbegin'){R=el.firstChild;}Q=G(2,ts,P,te);}el.insertBefore(Q,R);return Q;};var M=function(N,to){if(N.nodeType!=to.nodeType){N.parentNode.replaceChild(to,N);}if(N.nodeType==3){if(N.data==to.data){return;}N.data=to.data;return;}if(N.nodeType!=1||N.tagName!=to.tagName){N.parentNode.replaceChild(to,N);
return;}var ar=Array.from(N.attributes);for(var i=0;i<ar.length;i++){if(to.hasAttribute(ar[i].name)){continue;}N.removeAttribute(ar[i].name);}ar=to.attributes;for(var i=0;i<ar.length;i++){if(N.getAttribute(ar[i].name)==to.getAttribute(ar[i].name)){continue;
-}N.setAttribute(ar[i].name,to.getAttribute(ar[i].name));}var O=Array.from(N.childNodes);var P=Array.from(to.childNodes);for(var i=0;i<Math.max(O.length,P.length);i++){if(i<O.length&&i<P.length){M(O[i],P[i]);continue;}if(i<O.length){N.removeChild(O[i]);continue;
-}N.appendChild(P[i]);}};return {useDom:false,markup:function(o){return E(o);},applyStyles:function(el,N){if(N){el=Roo.fly(el);if(typeof N=="string"){var re=/\s?([a-z\-]*)\:\s?([^;]*);?/gi;var O;while((O=re.exec(N))!=null){el.setStyle(O[1],O[2]);}}else if(typeof N=="object"){for(var P in N){el.setStyle(P,N[P]);
+}N.setAttribute(ar[i].name,to.getAttribute(ar[i].name));}var O=Array.from(N.childNodes);var P=Array.from(to.childNodes);if(N.innerHTML==to.innerHTML){return;}if(O.length!=P.length){N.innerHTML=to.innerHTML;return;}for(var i=0;i<O.length;i++){M(O[i],P[i]);
+}};return {useDom:false,markup:function(o){return E(o);},applyStyles:function(el,N){if(N){el=Roo.fly(el);if(typeof N=="string"){var re=/\s?([a-z\-]*)\:\s?([^;]*);?/gi;var O;while((O=re.exec(N))!=null){el.setStyle(O[1],O[2]);}}else if(typeof N=="object"){for(var P in N){el.setStyle(P,N[P]);
}}else if(typeof N=="function"){Roo.DomHelper.applyStyles(el,N.call());}}},insertHtml:function(N,el,O){N=N.toLowerCase();if(el.insertAdjacentHTML){if(C.test(el.tagName)){var rs;if(rs=L(el.tagName.toLowerCase(),N,el,O)){return rs;}}switch(N){case "beforebegin":el.insertAdjacentHTML('BeforeBegin',O);
return el.previousSibling;case "afterbegin":el.insertAdjacentHTML('AfterBegin',O);return el.firstChild;case "beforeend":el.insertAdjacentHTML('BeforeEnd',O);return el.lastChild;case "afterend":el.insertAdjacentHTML('AfterEnd',O);return el.nextSibling;}throw 'Illegal insertion point -> "'+N+'"';
}var P=el.ownerDocument.createRange();var Q;switch(N){case "beforebegin":P.setStartBefore(el);Q=P.createContextualFragment(O);el.parentNode.insertBefore(Q,el);return el.previousSibling;case "afterbegin":if(el.firstChild){P.setStartBefore(el.firstChild);Q=P.createContextualFragment(O);
// children
var far = Array.from(from.childNodes);
var tar = Array.from(to.childNodes);
- for(var i = 0; i < Math.max(far.length, tar.length); i++) {
- if (i < far.length && i < tar.length) {
- updateNode(far[i], tar[i]);
- continue;
- }
- if (i < far.length) {
- // have from // but no 'to'
- from.removeChild(far[i]);
- continue;
- }
- from.appendChild(tar[i]);
- // have 'to' but no from
+ // if the lengths are different.. then it's probably a editable content change, rather than
+ // a change of the block definition..
+ if (from.innerHTML == to.innerHTML) {
+ return;
+ }
+ if (far.length != tar.length) {
+ from.innerHTML = to.innerHTML;
+ return;
+ }
+
+ for(var i = 0; i < far.length; i++) {
+ updateNode(far[i], tar[i]);
}
}
};
+
+/**
+ * @class Roo.htmleditor.Block
+ * Base class for html editor blocks - do not use it directly .. extend it..
+ * @cfg {DomElement} node The node to apply stuff to.
+ * @cfg {String} friendly_name the name that appears in the context bar about this block
+ * @cfg {Object} Context menu - see Roo.form.HtmlEditor.ToolbarContext
+
+ * @constructor
+ * Create a new Filter.
+ * @param {Object} config Configuration options
+ */
+
+Roo.htmleditor.Block = function(cfg)
+{
+ // do nothing .. should not be called really.
+}
+
+Roo.htmleditor.Block.factory = function(node)
+{
+ var cls = Roo.htmleditor['Block' + Roo.get(node).attr('data-block')];
+ if (typeof(cls) == 'undefined') {
+ Roo.log("OOps missing block : " + 'Block' + Roo.get(node).attr('data-block'));
+ return false;
+ }
+ return new cls({ node: node }); /// should trigger update element
+}
+
+
+Roo.htmleditor.Block.prototype = {
+
+ // used by context menu
+ friendly_name : 'Image with caption',
+
+ context : false,
+ /**
+ * Update a node with values from this object
+ * @param {DomElement} node
+ */
+ updateElement : function(node)
+ {
+ Roo.DomHelper.update(node, this.toObject());
+ },
+ /**
+ * convert to plain HTML for calling insertAtCursor..
+ */
+ toHTML : function()
+ {
+ return Roo.DomHelper.markup(this.toObject());
+ },
+ /**
+ * used by readEleemnt to extract data from a node
+ * may need improving as it's pretty basic
+
+ * @param {DomElement} node
+ * @param {String} tag - tag to find, eg. IMG ?? might be better to use DomQuery ?
+ * @param {String} attribute (use html - for contents, or style for using next param as style)
+ * @param {String} style the style property - eg. text-align
+ */
+ getVal : function(node, tag, attr, style)
+ {
+ var n = node;
+ if (n.tagName != tag.toUpperCase()) {
+ // in theory we could do figure[3] << 3rd figure? or some more complex search..?
+ // but kiss for now.
+ n = node.getElementsByTagName(tag).item(0);
+ }
+ if (attr == 'html') {
+ return n.innerHTML;
+ }
+ if (attr == 'style') {
+ return Roo.get(n).getStyle(style);
+ }
+
+ return Roo.get(n).attr(attr);
+
+ },
/**
+ * create a DomHelper friendly object - for use with
+ * Roo.DomHelper.markup / overwrite / etc..
+ * (override this)
+ */
+ toObject : function()
+ {
+ return {};
+ },
+ /**
+ * Read a node that has a 'data-block' property - and extract the values from it.
+ * @param {DomElement} node - the node
+ */
+ readElement : function(node)
+ {
+
+ }
+
+
+}
+
+/**
*
* <figure data-block="BlockFigure" contenteditable="false" role="group" style="text-align:left">' +
<img data-name="image" src="{SRC}">' +
},
align: {
title: "Align",
- opts : [ [""],[ "left"],[ "right"],[ "center"],[ "top"]],
+ opts : [[ "left"],[ "right"]],
width : 80
},
text_align: {
title: "Caption Align",
- opts : [ [""],[ "left"],[ "right"],[ "center"],[ "top"]],
+ opts : [ [ "left"],[ "right"],[ "center"]],
width : 80
},
*/
toObject : function()
{
+ var d = document.createElement('div');
+ d.innerHTML = this.caption;
var img = {
tag : 'img',
src : this.image_src,
- alt : this.caption
+ alt : d.innerText.replace(/\n/g, " ") // removeHTML..
};
if ((''+this.image_width).length) {
img.width = this.image_width;
tag: 'figure',
'data-block' : 'Figure',
contenteditable : 'false',
- style : 'text-align:' + this.align,
+ style : 'display:table; float:' + this.align,
cn : [
img,
{
tag: 'figcaption',
contenteditable : true,
- style : 'text-align:left',
+ style : 'text-align:' + this.text_align,
html : this.caption
}
]
readElement : function(node)
{
this.image_src = this.getVal(node, 'img', 'src');
- this.align = this.getVal(node, 'figure', 'style', 'text-align');
+ this.align = this.getVal(node, 'figure', 'style', 'float');
this.caption = this.getVal(node, 'figcaption', 'html');
this.text_align = this.getVal(node, 'figcaption', 'style','text-align');
}
// update attributes
- if (db) {
- var dbo = new cls({node : sel});
+ if (block) {
+
this.tb.fields.each(function(e) {
- e.setValue(dob[e.attrname]);
+ e.setValue(block[e.attrname]);
});
}
this.updateToolbarStyles(sel);
- // flag our selected Node.
- this.tb.selectedNode = sel;
-
+
Roo.menu.MenuMgr.hideAll();
width: item.width ? item.width : 130,
listeners : {
'select': function(c, r, i) {
- if (tb.selectedNode.hasClass('data-block')) {
+ if (tb.selectedNode.hasAttribute('data-block')) {
var b = Roo.htmleditor.Block.factory(tb.selectedNode);
b[c.attrname] = r.get('val');
b.updateElement(tb.selectedNode);
listeners: {
'change' : function(f, nv, ov) {
- if (tb.selectedNode.hasClass('data-block')) {
+ if (tb.selectedNode.hasAttribute('data-block')) {
var b = Roo.htmleditor.Block.factory(tb.selectedNode);
- b[c.attrname] = nv;
+ b[f.attrname] = nv;
b.updateElement(tb.selectedNode);
editorcore.syncValue();
return;
// remove
// undo does not work.
var sn = tb.selectedNode;
- var stn = sn.childNodes[0] || sn.nextSibling || sn.previousSibling || pn;
+ var stn = sn.childNodes[0] || sn.nextSibling || sn.previousSibling || sn.parentNode;
if (sn.hasAttribute('data-block')) {
+ stn = sn.nextSibling || sn.previousSibling || sn.parentNode;
sn.parentNode.removeChild(sn);
+
} else {
// remove and keep parents.
a = new Roo.htmleditor.FilterKeepChildren({tag : false});
}
};
+
+/**
+ * @class Roo.htmleditor.Block
+ * Base class for html editor blocks - do not use it directly .. extend it..
+ * @cfg {DomElement} node The node to apply stuff to.
+ * @cfg {String} friendly_name the name that appears in the context bar about this block
+ * @cfg {Object} Context menu - see Roo.form.HtmlEditor.ToolbarContext
+
+ * @constructor
+ * Create a new Filter.
+ * @param {Object} config Configuration options
+ */
+
+Roo.htmleditor.Block = function(cfg)
+{
+ // do nothing .. should not be called really.
+}
+
+Roo.htmleditor.Block.factory = function(node)
+{
+ var cls = Roo.htmleditor['Block' + Roo.get(node).attr('data-block')];
+ if (typeof(cls) == 'undefined') {
+ Roo.log("OOps missing block : " + 'Block' + Roo.get(node).attr('data-block'));
+ return false;
+ }
+ return new cls({ node: node }); /// should trigger update element
+}
+
+
+Roo.htmleditor.Block.prototype = {
+
+ // used by context menu
+ friendly_name : 'Image with caption',
+
+ context : false,
+ /**
+ * Update a node with values from this object
+ * @param {DomElement} node
+ */
+ updateElement : function(node)
+ {
+ Roo.DomHelper.update(node, this.toObject());
+ },
+ /**
+ * convert to plain HTML for calling insertAtCursor..
+ */
+ toHTML : function()
+ {
+ return Roo.DomHelper.markup(this.toObject());
+ },
/**
+ * used by readEleemnt to extract data from a node
+ * may need improving as it's pretty basic
+
+ * @param {DomElement} node
+ * @param {String} tag - tag to find, eg. IMG ?? might be better to use DomQuery ?
+ * @param {String} attribute (use html - for contents, or style for using next param as style)
+ * @param {String} style the style property - eg. text-align
+ */
+ getVal : function(node, tag, attr, style)
+ {
+ var n = node;
+ if (n.tagName != tag.toUpperCase()) {
+ // in theory we could do figure[3] << 3rd figure? or some more complex search..?
+ // but kiss for now.
+ n = node.getElementsByTagName(tag).item(0);
+ }
+ if (attr == 'html') {
+ return n.innerHTML;
+ }
+ if (attr == 'style') {
+ return Roo.get(n).getStyle(style);
+ }
+
+ return Roo.get(n).attr(attr);
+
+ },
+ /**
+ * create a DomHelper friendly object - for use with
+ * Roo.DomHelper.markup / overwrite / etc..
+ * (override this)
+ */
+ toObject : function()
+ {
+ return {};
+ },
+ /**
+ * Read a node that has a 'data-block' property - and extract the values from it.
+ * @param {DomElement} node - the node
+ */
+ readElement : function(node)
+ {
+
+ }
+
+
+}
+
+/**
*
* <figure data-block="BlockFigure" contenteditable="false" role="group" style="text-align:left">' +
<img data-name="image" src="{SRC}">' +
},
align: {
title: "Align",
- opts : [ [""],[ "left"],[ "right"],[ "center"],[ "top"]],
+ opts : [[ "left"],[ "right"]],
width : 80
},
text_align: {
title: "Caption Align",
- opts : [ [""],[ "left"],[ "right"],[ "center"],[ "top"]],
+ opts : [ [ "left"],[ "right"],[ "center"]],
width : 80
},
*/
toObject : function()
{
+ var d = document.createElement('div');
+ d.innerHTML = this.caption;
var img = {
tag : 'img',
src : this.image_src,
- alt : this.caption
+ alt : d.innerText.replace(/\n/g, " ") // removeHTML..
};
if ((''+this.image_width).length) {
img.width = this.image_width;
tag: 'figure',
'data-block' : 'Figure',
contenteditable : 'false',
- style : 'text-align:' + this.align,
+ style : 'display:table; float:' + this.align,
cn : [
img,
{
tag: 'figcaption',
contenteditable : true,
- style : 'text-align:left',
+ style : 'text-align:' + this.text_align,
html : this.caption
}
]
readElement : function(node)
{
this.image_src = this.getVal(node, 'img', 'src');
- this.align = this.getVal(node, 'figure', 'style', 'text-align');
+ this.align = this.getVal(node, 'figure', 'style', 'float');
this.caption = this.getVal(node, 'figcaption', 'html');
this.text_align = this.getVal(node, 'figcaption', 'style','text-align');
}
// update attributes
- if (db) {
- var dbo = new cls({node : sel});
+ if (block) {
+
this.tb.fields.each(function(e) {
- e.setValue(dob[e.attrname]);
+ e.setValue(block[e.attrname]);
});
}
this.updateToolbarStyles(sel);
- // flag our selected Node.
- this.tb.selectedNode = sel;
-
+
Roo.menu.MenuMgr.hideAll();
width: item.width ? item.width : 130,
listeners : {
'select': function(c, r, i) {
- if (tb.selectedNode.hasClass('data-block')) {
+ if (tb.selectedNode.hasAttribute('data-block')) {
var b = Roo.htmleditor.Block.factory(tb.selectedNode);
b[c.attrname] = r.get('val');
b.updateElement(tb.selectedNode);
listeners: {
'change' : function(f, nv, ov) {
- if (tb.selectedNode.hasClass('data-block')) {
+ if (tb.selectedNode.hasAttribute('data-block')) {
var b = Roo.htmleditor.Block.factory(tb.selectedNode);
- b[c.attrname] = nv;
+ b[f.attrname] = nv;
b.updateElement(tb.selectedNode);
editorcore.syncValue();
return;
// remove
// undo does not work.
var sn = tb.selectedNode;
- var stn = sn.childNodes[0] || sn.nextSibling || sn.previousSibling || pn;
+ var stn = sn.childNodes[0] || sn.nextSibling || sn.previousSibling || sn.parentNode;
if (sn.hasAttribute('data-block')) {
+ stn = sn.nextSibling || sn.previousSibling || sn.parentNode;
sn.parentNode.removeChild(sn);
+
} else {
// remove and keep parents.
a = new Roo.htmleditor.FilterKeepChildren({tag : false});
Roo.htmleditor.KeyEnter=function(A){Roo.apply(this,A);Roo.get(this.core.doc.body).on('keypress',this.keypress,this);};Roo.htmleditor.KeyEnter.prototype={core:false,keypress:function(e){if(e.charCode!=13){return true;}e.preventDefault();var A=this.core.doc;
var B=A.createDocumentFragment();var C=A.createTextNode('\n');B.appendChild(C);C=A.createElement('br');B.appendChild(C);var D=this.core.win.getSelection().getRangeAt(0);D.deleteContents();D.insertNode(B);D=A.createRange();D.setStartAfter(C);D.collapse(true);
var E=this.core.win.getSelection();E.removeAllRanges();E.addRange(D);return false;}};
+// Roo/htmleditor/Block.js
+Roo.htmleditor.Block=function(A){};Roo.htmleditor.Block.factory=function(A){var B=Roo.htmleditor['Block'+Roo.get(A).attr('data-block')];if(typeof(B)=='undefined'){Roo.log("OOps missing block : "+'Block'+Roo.get(A).attr('data-block'));return false;}return new B({node:A}
+);};Roo.htmleditor.Block.prototype={friendly_name:'Image with caption',context:false,updateElement:function(A){Roo.DomHelper.update(A,this.toObject());},toHTML:function(){return Roo.DomHelper.markup(this.toObject());},getVal:function(A,B,C,D){var n=A;if(n.tagName!=B.toUpperCase()){n=A.getElementsByTagName(B).item(0);
+}if(C=='html'){return n.innerHTML;}if(C=='style'){return Roo.get(n).getStyle(D);}return Roo.get(n).attr(C);},toObject:function(){return {};},readElement:function(A){}};
// Roo/htmleditor/BlockFigure.js
Roo.htmleditor.BlockFigure=function(A){if(A.node){this.readElement(A.node);this.updateElement(A.node);}Roo.apply(this,A);};Roo.extend(Roo.htmleditor.BlockFigure,Roo.htmleditor.Block,{image_src:'',align:'left',caption:'',text_align:'left',image_width:'',image_height:'',friendly_name:'Image with caption',context:{image_width:{title:"Width",width:40}
-,image_height:{title:"Height",width:40},align:{title:"Align",opts:[[""],["left"],["right"],["center"],["top"]],width:80},text_align:{title:"Caption Align",opts:[[""],["left"],["right"],["center"],["top"]],width:80},image_src:{title:"Src",width:220}},toObject:function(){var A={tag:'img',src:this.image_src,alt:this.caption}
-;if((''+this.image_width).length){A.width=this.image_width;}if((''+this.height).length){A.height=this.image_height;}return {tag:'figure','data-block':'Figure',contenteditable:'false',style:'text-align:'+this.align,cn:[A,{tag:'figcaption',contenteditable:true,style:'text-align:left',html:this.caption}
-]};},readElement:function(A){this.image_src=this.getVal(A,'img','src');this.align=this.getVal(A,'figure','style','text-align');this.caption=this.getVal(A,'figcaption','html');this.text_align=this.getVal(A,'figcaption','style','text-align');}})
+,image_height:{title:"Height",width:40},align:{title:"Align",opts:[["left"],["right"]],width:80},text_align:{title:"Caption Align",opts:[["left"],["right"],["center"]],width:80},image_src:{title:"Src",width:220}},toObject:function(){var d=document.createElement('div');
+d.innerHTML=this.caption;var A={tag:'img',src:this.image_src,alt:d.innerText.replace(/\n/g," ")};if((''+this.image_width).length){A.width=this.image_width;}if((''+this.height).length){A.height=this.image_height;}return {tag:'figure','data-block':'Figure',contenteditable:'false',style:'display:table; float:'+this.align,cn:[A,{tag:'figcaption',contenteditable:true,style:'text-align:'+this.text_align,html:this.caption}
+]};},readElement:function(A){this.image_src=this.getVal(A,'img','src');this.align=this.getVal(A,'figure','style','float');this.caption=this.getVal(A,'figcaption','html');this.text_align=this.getVal(A,'figcaption','style','text-align');}})
// Roo/HtmlEditorCore.js
Roo.HtmlEditorCore=function(A){Roo.HtmlEditorCore.superclass.constructor.call(this,A);this.addEvents({initialize:true,activate:true,beforesync:true,beforepush:true,sync:true,push:true,editorevent:true});this.applyBlacklists();};Roo.extend(Roo.HtmlEditorCore,Roo.Component,{owner:false,resizable:false,height:300,width:500,stylesheets:false,allowComments:false,frameId:false,validationEvent:false,deferHeight:true,initialized:false,activated:false,sourceEditMode:false,onFocus:Roo.emptyFn,iframePad:3,hideMode:'offsets',clearUp:true,black:false,white:false,bodyCls:'',getDocMarkup:function(){var st='';
if(this.stylesheets===false){Roo.get(document.head).select('style').each(function(B){st+=B.dom.outerHTML||new XMLSerializer().serializeToString(B.dom);});Roo.get(document.head).select('link').each(function(B){st+=B.dom.outerHTML||new XMLSerializer().serializeToString(B.dom);
var C=B.ownerDocument.createRange();try{C.selectNode(B);}catch(e){C.selectNodeContents(B);}var s=this.editorcore.win.getSelection();s.removeAllRanges();s.addRange(C);}var D=this.editorcore.getAllAncestors();var ty=Roo.form.HtmlEditor.ToolbarContext.types;
if(!B){B=D.length?(D[0]?D[0]:D[1]):this.editorcore.doc.body;B=B?B:this.editorcore.doc.body;B=B.tagName.length?B:this.editorcore.doc.body;}var tn=B.tagName.toUpperCase();var E=this.tb.selectedNode;this.tb.selectedNode=B;var F=tn;var db=Roo.get(B).findParent('[data-block]');
var G=false;if(db){G=Roo.htmleditor.Block.factory(db);if(G){tn='BLOCK.'+db.getAttribute('data-block');this.tb.selectedNode=db;if(typeof(this.toolbars[tn])=='undefined'){this.toolbars[tn]=this.buildToolbar(G.context,tn,G.friendly_name);}F=G.friendly_name;}
-}if(this.tb.name==tn&&E==this.tb.selectedNode&&ev!==false){return;}this.tb.el.hide();this.tb=typeof(this.toolbars[tn])!='undefined'?this.toolbars[tn]:this.toolbars['*'];this.tb.el.show();this.tb.items.first().el.innerHTML=F+': ';if(db){var H=new cls({node:B}
-);this.tb.fields.each(function(e){e.setValue(dob[e.attrname]);});}else if(this.tb.fields){this.tb.fields.each(function(e){if(e.stylename){e.setValue(B.style[e.stylename]);return;}e.setValue(B.getAttribute(e.attrname));});}this.updateToolbarStyles(B);this.tb.selectedNode=B;
-Roo.menu.MenuMgr.hideAll();this.updateFooter(D);},updateToolbarStyles:function(A){var B=false;for(var i in this.styles){B=true;break;}if(B){var st=this.tb.fields.item(0);st.store.removeAll();var cn=A.className.split(/\s+/);var C=[];if(this.styles['*']){Roo.each(this.styles['*'],function(v){C.push([v,cn.indexOf(v)>-1?1:0]);
-});}if(this.styles[tn]){Roo.each(this.styles[tn],function(v){C.push([v,cn.indexOf(v)>-1?1:0]);});}st.store.loadData(C);st.collapse();st.setValue(cn);}},updateFooter:function(A){var B='';if(A===false){this.footDisp.dom.innerHTML='';return;}this.footerEls=A.reverse();
-Roo.each(this.footerEls,function(a,i){if(!a){return;}B+=B.length?' > ':'';B+='<span class="x-ed-loc-'+i+'">'+a.tagName+'</span>';});var sz=this.footDisp.up('td').getSize();this.footDisp.dom.style.width=(sz.width-10)+'px';this.footDisp.dom.style.marginLeft='5px';
-this.footDisp.dom.style.overflow='hidden';this.footDisp.dom.innerHTML=B;},onDestroy:function(){if(this.rendered){this.tb.items.each(function(A){if(A.menu){A.menu.removeAll();if(A.menu.el){A.menu.el.destroy();}}A.destroy();});}},onFirstFocus:function(){this.tb.items.each(function(A){A.enable();
-});},buildToolbar:function(A,nm,B){var C=this.editor;var D=this.editorcore;var E=C.wrap.createChild({tag:'div'},C.wrap.dom.firstChild.nextSibling,true);var tb=new Roo.Toolbar(E);tb.name=nm;tb.add((typeof(B)=='undefined'?nm:B)+": ");var F=Array.from(this.styles);
-if(F&&F.length){tb.addField(new Roo.form.ComboBox({store:new Roo.data.SimpleStore({id:'val',fields:['val','selected'],data:[]}),name:'-roo-edit-className',attrname:'className',displayField:'val',typeAhead:false,mode:'local',editable:false,triggerAction:'all',emptyText:'Select Style',selectOnFocus:true,width:130,listeners:{'select':function(c,r,i){tb.selectedNode.className=r?r.get('val'):'';
+}if(this.tb.name==tn&&E==this.tb.selectedNode&&ev!==false){return;}this.tb.el.hide();this.tb=typeof(this.toolbars[tn])!='undefined'?this.toolbars[tn]:this.toolbars['*'];this.tb.el.show();this.tb.items.first().el.innerHTML=F+': ';if(G){this.tb.fields.each(function(e){e.setValue(G[e.attrname]);
+});}else if(this.tb.fields){this.tb.fields.each(function(e){if(e.stylename){e.setValue(B.style[e.stylename]);return;}e.setValue(B.getAttribute(e.attrname));});}this.updateToolbarStyles(B);Roo.menu.MenuMgr.hideAll();this.updateFooter(D);},updateToolbarStyles:function(A){var B=false;
+for(var i in this.styles){B=true;break;}if(B){var st=this.tb.fields.item(0);st.store.removeAll();var cn=A.className.split(/\s+/);var C=[];if(this.styles['*']){Roo.each(this.styles['*'],function(v){C.push([v,cn.indexOf(v)>-1?1:0]);});}if(this.styles[tn]){Roo.each(this.styles[tn],function(v){C.push([v,cn.indexOf(v)>-1?1:0]);
+});}st.store.loadData(C);st.collapse();st.setValue(cn);}},updateFooter:function(A){var B='';if(A===false){this.footDisp.dom.innerHTML='';return;}this.footerEls=A.reverse();Roo.each(this.footerEls,function(a,i){if(!a){return;}B+=B.length?' > ':'';B+='<span class="x-ed-loc-'+i+'">'+a.tagName+'</span>';
+});var sz=this.footDisp.up('td').getSize();this.footDisp.dom.style.width=(sz.width-10)+'px';this.footDisp.dom.style.marginLeft='5px';this.footDisp.dom.style.overflow='hidden';this.footDisp.dom.innerHTML=B;},onDestroy:function(){if(this.rendered){this.tb.items.each(function(A){if(A.menu){A.menu.removeAll();
+if(A.menu.el){A.menu.el.destroy();}}A.destroy();});}},onFirstFocus:function(){this.tb.items.each(function(A){A.enable();});},buildToolbar:function(A,nm,B){var C=this.editor;var D=this.editorcore;var E=C.wrap.createChild({tag:'div'},C.wrap.dom.firstChild.nextSibling,true);
+var tb=new Roo.Toolbar(E);tb.name=nm;tb.add((typeof(B)=='undefined'?nm:B)+": ");var F=Array.from(this.styles);if(F&&F.length){tb.addField(new Roo.form.ComboBox({store:new Roo.data.SimpleStore({id:'val',fields:['val','selected'],data:[]}),name:'-roo-edit-className',attrname:'className',displayField:'val',typeAhead:false,mode:'local',editable:false,triggerAction:'all',emptyText:'Select Style',selectOnFocus:true,width:130,listeners:{'select':function(c,r,i){tb.selectedNode.className=r?r.get('val'):'';
D.syncValue();}}}));}var G=Roo.form.HtmlEditor.ToolbarContext;for(var i in A){var H=A[i];tb.add(H.title+": ");var I=H.opts?H.opts:false;if(H.optname){I=Roo.form.HtmlEditor.ToolbarContext.options[H.optname];}if(I){tb.addField(new Roo.form.ComboBox({store:typeof(G.stores[i])!='undefined'?Roo.factory(G.stores[i],Roo.data):new Roo.data.SimpleStore({id:'val',fields:['val','display'],data:I}
-),name:'-roo-edit-'+i,attrname:i,stylename:H.style?H.style:false,displayField:H.displayField?H.displayField:'val',valueField:'val',typeAhead:false,mode:typeof(G.stores[i])!='undefined'?'remote':'local',editable:false,triggerAction:'all',emptyText:'Select',selectOnFocus:true,width:H.width?H.width:130,listeners:{'select':function(c,r,i){if(tb.selectedNode.hasClass('data-block')){var b=Roo.htmleditor.Block.factory(tb.selectedNode);
+),name:'-roo-edit-'+i,attrname:i,stylename:H.style?H.style:false,displayField:H.displayField?H.displayField:'val',valueField:'val',typeAhead:false,mode:typeof(G.stores[i])!='undefined'?'remote':'local',editable:false,triggerAction:'all',emptyText:'Select',selectOnFocus:true,width:H.width?H.width:130,listeners:{'select':function(c,r,i){if(tb.selectedNode.hasAttribute('data-block')){var b=Roo.htmleditor.Block.factory(tb.selectedNode);
b[c.attrname]=r.get('val');b.updateElement(tb.selectedNode);D.syncValue();return;}if(c.stylename){tb.selectedNode.style[c.stylename]=r.get('val');D.syncValue();return;}if(r===false){tb.selectedNode.removeAttribute(c.attrname);D.syncValue();return;}tb.selectedNode.setAttribute(c.attrname,r.get('val'));
-D.syncValue();}}}));continue;}tb.addField(new Roo.form.TextField({name:'-roo-edit-'+i,attrname:i,width:H.width,value:'',listeners:{'change':function(f,nv,ov){if(tb.selectedNode.hasClass('data-block')){var b=Roo.htmleditor.Block.factory(tb.selectedNode);b[c.attrname]=nv;
-b.updateElement(tb.selectedNode);D.syncValue();return;}tb.selectedNode.setAttribute(f.attrname,nv);D.syncValue();}}}));}var J=this;if(nm=='BODY'){tb.addSeparator();tb.addButton({text:'Stylesheets',listeners:{click:function(){J.editor.fireEvent('stylesheetsclick',J.editor);
-}}});}tb.addFill();tb.addButton({text:'Remove',listeners:{click:function(){var sn=tb.selectedNode;var K=sn.childNodes[0]||sn.nextSibling||sn.previousSibling||pn;if(sn.hasAttribute('data-block')){sn.parentNode.removeChild(sn);}else{a=new Roo.htmleditor.FilterKeepChildren({tag:false}
-);a.removeTag(sn);}var L=D.createRange();L.setStart(K,0);L.setEnd(en,0);var M=D.getSelection();M.removeAllRanges();M.addRange(L);J.updateToolbar(null,null,null);J.updateFooter(false);}}});tb.el.on('click',function(e){e.preventDefault();});tb.el.setVisibilityMode(Roo.Element.DISPLAY);
-tb.el.hide();return tb;},buildFooter:function(){var A=this.editor.wrap.createChild();this.footer=new Roo.Toolbar(A);var B=new Roo.Toolbar.Fill();var _t=this;this.footer.add({text:'<',xtype:'Button',handler:function(){_t.footDisp.scrollTo('left',0,true)}
-});this.footer.add(B);this.footer.add({text:'>',xtype:'Button',handler:function(){_t.footDisp.select('span').last().scrollIntoView(_t.footDisp,true);}});var A=Roo.get(B.el);A.addClass('x-editor-context');this.footDispWrap=A;this.footDispWrap.overflow='hidden';
-this.footDisp=A.createChild();this.footDispWrap.on('click',this.onContextClick,this)},onContextClick:function(ev,A){ev.preventDefault();var cn=A.className;if(!cn.match(/x-ed-loc-/)){return;}var n=cn.split('-').pop();var B=this.footerEls;var C=B[n];var D=this.editorcore.createRange();
-D.selectNodeContents(C);var E=this.editorcore.getSelection();E.removeAllRanges();E.addRange(D);this.updateToolbar(null,null,C);}});
+D.syncValue();}}}));continue;}tb.addField(new Roo.form.TextField({name:'-roo-edit-'+i,attrname:i,width:H.width,value:'',listeners:{'change':function(f,nv,ov){if(tb.selectedNode.hasAttribute('data-block')){var b=Roo.htmleditor.Block.factory(tb.selectedNode);
+b[f.attrname]=nv;b.updateElement(tb.selectedNode);D.syncValue();return;}tb.selectedNode.setAttribute(f.attrname,nv);D.syncValue();}}}));}var J=this;if(nm=='BODY'){tb.addSeparator();tb.addButton({text:'Stylesheets',listeners:{click:function(){J.editor.fireEvent('stylesheetsclick',J.editor);
+}}});}tb.addFill();tb.addButton({text:'Remove',listeners:{click:function(){var sn=tb.selectedNode;var K=sn.childNodes[0]||sn.nextSibling||sn.previousSibling||sn.parentNode;if(sn.hasAttribute('data-block')){K=sn.nextSibling||sn.previousSibling||sn.parentNode;
+sn.parentNode.removeChild(sn);}else{a=new Roo.htmleditor.FilterKeepChildren({tag:false});a.removeTag(sn);}var L=D.createRange();L.setStart(K,0);L.setEnd(en,0);var M=D.getSelection();M.removeAllRanges();M.addRange(L);J.updateToolbar(null,null,null);J.updateFooter(false);
+}}});tb.el.on('click',function(e){e.preventDefault();});tb.el.setVisibilityMode(Roo.Element.DISPLAY);tb.el.hide();return tb;},buildFooter:function(){var A=this.editor.wrap.createChild();this.footer=new Roo.Toolbar(A);var B=new Roo.Toolbar.Fill();var _t=this;
+this.footer.add({text:'<',xtype:'Button',handler:function(){_t.footDisp.scrollTo('left',0,true)}});this.footer.add(B);this.footer.add({text:'>',xtype:'Button',handler:function(){_t.footDisp.select('span').last().scrollIntoView(_t.footDisp,true);}});
+var A=Roo.get(B.el);A.addClass('x-editor-context');this.footDispWrap=A;this.footDispWrap.overflow='hidden';this.footDisp=A.createChild();this.footDispWrap.on('click',this.onContextClick,this)},onContextClick:function(ev,A){ev.preventDefault();var cn=A.className;
+if(!cn.match(/x-ed-loc-/)){return;}var n=cn.split('-').pop();var B=this.footerEls;var C=B[n];var D=this.editorcore.createRange();D.selectNodeContents(C);var E=this.editorcore.getSelection();E.removeAllRanges();E.addRange(D);this.updateToolbar(null,null,C);
+}});
// Roo/form/BasicForm.js
Roo.form.BasicForm=function(el,A){this.allItems=[];this.childForms=[];Roo.apply(this,A);this.items=new Roo.util.MixedCollection(false,function(o){return o.id||(o.id=Roo.id());});this.addEvents({beforeaction:true,actionfailed:true,actioncomplete:true});if(el){this.initEl(el);
}Roo.form.BasicForm.superclass.constructor.call(this);Roo.form.BasicForm.popover.apply();};Roo.extend(Roo.form.BasicForm,Roo.util.Observable,{timeout:30,activeAction:null,trackResetOnLoad:false,childForms:false,allItems:false,waitMsgTarget:false,disableMask:false,errorMask:false,maskOffset:100,initEl:function(el){this.el=Roo.get(el);
projects / roojs1 / commitdiff