X-Git-Url: http://git.roojs.org/?a=blobdiff_plain;f=roojs-bootstrap-debug.js;h=f670fba5b400c3104ee4a7344a7894a173d165b5;hb=3ac3969308fd60ccb370ce49b7ac94878d416ef1;hp=48a4704c89dd8038905967ab1a5abde65ce627f1;hpb=b0cc5a1d0a1a924e2417396e02ce8d36e75a72e5;p=roojs1 diff --git a/roojs-bootstrap-debug.js b/roojs-bootstrap-debug.js index 48a4704c89..f670fba5b4 100644 --- a/roojs-bootstrap-debug.js +++ b/roojs-bootstrap-debug.js @@ -7,7 +7,7 @@ Roo.bootstrap.version = ( function() { var ret=3; Roo.each(document.styleSheets, function(s) { - if (s.href.match(/css-bootstrap4/)) { + if ( s.href && s.href.match(/css-bootstrap4/)) { ret=4; } }); @@ -1488,6 +1488,248 @@ Roo.extend(Roo.bootstrap.Container, Roo.bootstrap.Component, { }); /* + * - LGPL + * + * This is BS4's Card element.. - similar to our containers probably.. + * + */ +/** + * @class Roo.bootstrap.Card + * @extends Roo.bootstrap.Component + * Bootstrap Card class + * + * + * possible... may not be implemented.. + * @cfg {String} header_image src url of image. + * @cfg {String} header + * @cfg {Number} header_size (0|1|2|3|4|5) H1 or H2 etc.. 0 indicates default + * + * @cfg {String} title + * @cfg {String} subtitle + * @cfg {String} html -- html contents - or just use children.. + * @cfg {String} footer + + * @cfg {String} weight (primary|warning|info|danger|secondary|success|light|dark) + * + * @cfg {String} margin (0|1|2|3|4|5|auto) + * @cfg {String} margin_top (0|1|2|3|4|5|auto) + * @cfg {String} margin_bottom (0|1|2|3|4|5|auto) + * @cfg {String} margin_left (0|1|2|3|4|5|auto) + * @cfg {String} margin_right (0|1|2|3|4|5|auto) + * @cfg {String} margin_x (0|1|2|3|4|5|auto) + * @cfg {String} margin_y (0|1|2|3|4|5|auto) + * + * @cfg {String} padding (0|1|2|3|4|5) + * @cfg {String} padding_top (0|1|2|3|4|5) + * @cfg {String} padding_bottom (0|1|2|3|4|5) + * @cfg {String} padding_left (0|1|2|3|4|5) + * @cfg {String} padding_right (0|1|2|3|4|5) + * @cfg {String} padding_x (0|1|2|3|4|5) + * @cfg {String} padding_y (0|1|2|3|4|5) + * + * @cfg {String} display (none|inline|inline-block|block|table|table-cell|table-row|flex|inline-flex) + * @cfg {String} display_xs (none|inline|inline-block|block|table|table-cell|table-row|flex|inline-flex) + * @cfg {String} display_sm (none|inline|inline-block|block|table|table-cell|table-row|flex|inline-flex) + * @cfg {String} display_lg (none|inline|inline-block|block|table|table-cell|table-row|flex|inline-flex) + * @cfg {String} display_xl (none|inline|inline-block|block|table|table-cell|table-row|flex|inline-flex) + + * @constructor + * Create a new Container + * @param {Object} config The config object + */ + +Roo.bootstrap.Card = function(config){ + Roo.bootstrap.Card.superclass.constructor.call(this, config); + + this.addEvents({ + + }); +}; + + +Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { + + + weight : '', + + margin: '', /// may be better in component? + margin_top: '', + margin_bottom: '', + margin_left: '', + margin_right: '', + margin_x: '', + margin_y: '', + + padding : '', + padding_top: '', + padding_bottom: '', + padding_left: '', + padding_right: '', + padding_x: '', + padding_y: '', + + display: '', + display_xs: '', + display_sm: '', + display_lg: '', + display_xl: '', + + header_image : '', + header : '', + header_size : 0, + title : '', + subtitle : '', + html : '', + footer: '', + + childContainer : false, + + layoutCls : function() + { + var cls = ''; + var t = this; + Roo.log(this.margin_bottom.length); + ['', 'top', 'bottom', 'left', 'right', 'x', 'y' ].forEach(function(v) { + // in theory these can do margin_top : ml-xs-3 ??? but we don't support that yet + + if (('' + t['margin' + (v.length ? '_' : '') + v]).length) { + cls += ' m' + (v.length ? v[0] : '') + '-' + t['margin' + (v.length ? '_' : '') + v]; + } + if (('' + t['padding' + (v.length ? '_' : '') + v]).length) { + cls += ' p' + (v.length ? v[0] : '') + '-' + t['padding' + (v.length ? '_' : '') + v]; + } + }); + + ['', 'xs', 'sm', 'lg', 'xl'].forEach(function(v) { + if (('' + t['display' + (v.length ? '_' : '') + v]).length) { + cls += ' d' + (v.length ? '-' : '') + v + '-' + t['margin' + (v.length ? '_' : '') + v] + } + }); + + // more generic support? + if (this.hidden) { + cls += ' d-none'; + } + + return cls; + }, + + // Roo.log("Call onRender: " + this.xtype); + /* We are looking at something like this. +
+ ... +
+
Card title
+
Card subtitle
+ + >> this bit is really the body... +
<< we will ad dthis in hopefully it will not break shit. + + ** card text does not actually have any styling... + +

This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.

+ +
<< + Card link + +
+
+ Last updated 3 mins ago +
+
+ */ + getAutoCreate : function(){ + + var cfg = { + tag : 'div', + cls : 'card', + cn : [ ] + }; + + if (this.weight.length && this.weight != 'light') { + cfg.cls += ' text-white' + } + if (this.weight.length) { + cfg.cls += ' bg-' + this.weight; + } + + cfg.cls += this.layoutCls(); + + if (this.header.length) { + cfg.cn.push({ + tag : this.header_size > 0 ? 'h' + this.header_size : 'div', + cls : 'card-header', + html : this.header // escape? + }); + } + if (this.header_image.length) { + cfg.cn.push({ + tag : 'img', + cls : 'card-img-top', + src: this.header_image // escape? + }); + } + + var body = { + tag : 'div', + cls : 'card-body', + cn : [] + }; + cfg.cn.push(body); + + if (this.title.length) { + body.cn.push({ + tag : 'div', + cls : 'card-title', + src: this.title // escape? + }); + } + + if (this.subtitle.length) { + body.cn.push({ + tag : 'div', + cls : 'card-title', + src: this.subtitle // escape? + }); + } + + body.cn.push({ + tag : 'div', + cls : 'roo-card-body-ctr' + }); + + if (this.html.length) { + body.cn.push({ + tag: 'div', + html : this.html + }); + } + // fixme ? handle objects? + if (this.footer.length) { + body.cn.push({ + tag : 'div', + cls : 'card-footer', + html: this.footer // escape? + }); + } + // footer... + + return cfg; + }, + + + getChildContainer : function() + { + + if(!this.el){ + return false; + } + return this.el.select('.roo-card-body-ctr',true).first(); + } + +}); + +/* * - LGPL * * image @@ -2651,6 +2893,8 @@ Roo.extend(Roo.bootstrap.MenuSeparator, Roo.bootstrap.Component, { * @cfg {Boolean} animate default true * @cfg {Boolean} allow_close default true * @cfg {Boolean} fitwindow default false + * @cfg {Number} width fixed width - usefull for chrome extension only really. + * @cfg {Number} height fixed height - usefull for chrome extension only really. * @cfg {String} size (sm|lg) default empty * @cfg {Number} max_width set the max width of modal * @@ -2801,8 +3045,9 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component, { getAutoCreate : function() { + // we will default to modal-body-overflow - might need to remove or make optional later. var bdy = { - cls : 'modal-body', + cls : 'modal-body enable-modal-body-overflow ', html : this.html || '' }; @@ -7317,9 +7562,12 @@ Roo.extend(Roo.bootstrap.Table, Roo.bootstrap.Component, { if (tbd) { - tbd.setSize(ctr.getWidth(), - ctr.getHeight() - ((thd ? thd.getHeight() : 0) + (tfd ? tfd.getHeight() : 0)) - ); + tbd.setWidth(ctr.getWidth()); + // if the body has a max height - and then scrolls - we should perhaps set up the height here + // this needs fixing for various usage - currently only hydra job advers I think.. + //tdb.setHeight( + // ctr.getHeight() - ((thd ? thd.getHeight() : 0) + (tfd ? tfd.getHeight() : 0)) + //); var barsize = (tbd.dom.offsetWidth - tbd.dom.clientWidth); cw -= barsize; } @@ -11822,6 +12070,16 @@ Roo.extend(Roo.data.Store, Roo.util.Observable, { var r = this.reader.readRecords(o); this.loadRecords(r, {add: append}, true); }, + + /** + * using 'cn' the nested child reader read the child array into it's child stores. + * @param {Object} rec The record with a 'children array + */ + loadDataFromChildren : function(rec) + { + this.loadData(this.reader.toLoadData(rec)); + }, + /** * Gets the number of cached records. @@ -12126,14 +12384,16 @@ Roo.extend(Roo.data.Store, Roo.util.Observable, { * Small helper class to make creating Stores from Array data easier. * @cfg {Number} id The array index of the record id. Leave blank to auto generate ids. * @cfg {Array} fields An array of field definition objects, or field name strings. + * @cfg {Object} an existing reader (eg. copied from another store) * @cfg {Array} data The multi-dimensional array of data * @constructor * @param {Object} config */ -Roo.data.SimpleStore = function(config){ +Roo.data.SimpleStore = function(config) +{ Roo.data.SimpleStore.superclass.constructor.call(this, { isLocal : true, - reader: new Roo.data.ArrayReader({ + reader: typeof(config.reader) != 'undefined' ? config.reader : new Roo.data.ArrayReader({ id: config.id }, Roo.data.Record.create(config.fields) @@ -12310,6 +12570,9 @@ Roo.data.DataReader = function(meta, recordType){ }; Roo.data.DataReader.prototype = { + + + readerType : 'Data', /** * Create an empty record * @param {Object} data (optional) - overlay some values @@ -12330,6 +12593,7 @@ Roo.data.DataReader.prototype = { return new this.recordType(Roo.apply(da, d)); } + };/* * Based on: * Ext JS Library 1.1.1 @@ -12868,6 +13132,8 @@ Roo.data.JsonReader = function(meta, recordType){ }; Roo.extend(Roo.data.JsonReader, Roo.data.DataReader, { + readerType : 'Json', + /** * @prop {Boolean} metaFromRemote - if the meta data was loaded from the remote source. * Used by Store query builder to append _requestMeta to params. @@ -13009,6 +13275,14 @@ Roo.extend(Roo.data.JsonReader, Roo.data.DataReader, { records : records, totalRecords : totalRecords }; + }, + // used when loading children.. @see loadDataFromChildren + toLoadData: function(rec) + { + // expect rec just to be an array.. eg [a,b,c, [...] << cn ] + var data = typeof(rec.data.cn) == 'undefined' ? [] : rec.data.cn; + return { data : data, total : data.length }; + } });/* * Based on: @@ -13058,44 +13332,54 @@ var myReader = new Roo.data.ArrayReader({ * * created using {@link Roo.data.Record#create}. */ -Roo.data.ArrayReader = function(meta, recordType){ - - +Roo.data.ArrayReader = function(meta, recordType) +{ Roo.data.ArrayReader.superclass.constructor.call(this, meta, recordType||meta.fields); }; Roo.extend(Roo.data.ArrayReader, Roo.data.JsonReader, { - /** + + /** * Create a data block containing Roo.data.Records from an XML document. * @param {Object} o An Array of row objects which represents the dataset. * @return {Object} A data block which is used by an {@link Roo.data.Store} object as * a cache of Roo.data.Records. */ - readRecords : function(o){ + readRecords : function(o) + { var sid = this.meta ? this.meta.id : null; var recordType = this.recordType, fields = recordType.prototype.fields; var records = []; var root = o; - for(var i = 0; i < root.length; i++){ - var n = root[i]; - var values = {}; - var id = ((sid || sid === 0) && n[sid] !== undefined && n[sid] !== "" ? n[sid] : null); - for(var j = 0, jlen = fields.length; j < jlen; j++){ - var f = fields.items[j]; - var k = f.mapping !== undefined && f.mapping !== null ? f.mapping : j; - var v = n[k] !== undefined ? n[k] : f.defaultValue; - v = f.convert(v); - values[f.name] = v; - } - var record = new recordType(values, id); - record.json = n; - records[records.length] = record; + for(var i = 0; i < root.length; i++){ + var n = root[i]; + var values = {}; + var id = ((sid || sid === 0) && n[sid] !== undefined && n[sid] !== "" ? n[sid] : null); + for(var j = 0, jlen = fields.length; j < jlen; j++){ + var f = fields.items[j]; + var k = f.mapping !== undefined && f.mapping !== null ? f.mapping : j; + var v = n[k] !== undefined ? n[k] : f.defaultValue; + v = f.convert(v); + values[f.name] = v; } - return { - records : records, - totalRecords : records.length - }; + var record = new recordType(values, id); + record.json = n; + records[records.length] = record; + } + return { + records : records, + totalRecords : records.length + }; + }, + // used when loading children.. @see loadDataFromChildren + toLoadData: function(rec) + { + // expect rec just to be an array.. eg [a,b,c, [...] << cn ] + return typeof(rec.data.cn) == 'undefined' ? [] : rec.data.cn; + } + + });/* * - LGPL * * @@ -20896,6 +21180,11 @@ Roo.extend(Roo.bootstrap.CheckBox, Roo.bootstrap.Input, { inline: false, tooltip : '', + // checkbox success does not make any sense really.. + invalidClass : "", + validClass : "", + + getAutoCreate : function() { var align = (!this.labelAlign) ? this.parentLabelAlign() : this.labelAlign; @@ -20996,6 +21285,22 @@ Roo.extend(Roo.bootstrap.CheckBox, Roo.bootstrap.Input, { } } + var boxLabelCfg = false; + + if(this.boxLabel){ + + boxLabelCfg = { + tag: 'label', + //'for': id, // box label is handled by onclick - so no for... + cls: 'box-label', + html: this.boxLabel + }; + if(this.tooltip){ + boxLabelCfg.tooltip = this.tooltip; + } + + } + if (align ==='left' && this.fieldLabel.length) { // Roo.log("left and has label"); @@ -21014,6 +21319,10 @@ Roo.extend(Roo.bootstrap.CheckBox, Roo.bootstrap.Input, { } ]; + if (boxLabelCfg) { + cfg.cn[1].cn.push(boxLabelCfg); + } + if(this.labelWidth > 12){ cfg.cn[0].style = "width: " + this.labelWidth + 'px'; } @@ -21057,29 +21366,22 @@ Roo.extend(Roo.bootstrap.CheckBox, Roo.bootstrap.Input, { inputblock ]; + if (boxLabelCfg) { + cfg.cn.push(boxLabelCfg); + } } else { // Roo.log(" no label && no align"); cfg.cn = [ inputblock ] ; - + if (boxLabelCfg) { + cfg.cn.push(boxLabelCfg); + } + } - if(this.boxLabel){ - var boxLabelCfg = { - tag: 'label', - //'for': id, // box label is handled by onclick - so no for... - cls: 'box-label', - html: this.boxLabel - }; - - if(this.tooltip){ - boxLabelCfg.tooltip = this.tooltip; - } - - cfg.cn.push(boxLabelCfg); - } + if(this.inputType != 'radio'){ cfg.cn.push(hidden); @@ -22318,17 +22620,32 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { html = this.cleanHtml(html); // fix up the special chars.. normaly like back quotes in word... // however we do not want to do this with chinese.. - html = html.replace(/([\x80-\uffff])/g, function (a, b) { - var cc = b.charCodeAt(); - if ( + html = html.replace(/[\uD800-\uDBFF][\uDC00-\uDFFF]|[\u0080-\uFFFF]/g, function(match) { + + var cc = match.charCodeAt(); + + // Get the character value, handling surrogate pairs + if (match.length == 2) { + // It's a surrogate pair, calculate the Unicode code point + var high = match.charCodeAt(0) - 0xD800; + var low = match.charCodeAt(1) - 0xDC00; + cc = (high * 0x400) + low + 0x10000; + } else if ( (cc >= 0x4E00 && cc < 0xA000 ) || (cc >= 0x3400 && cc < 0x4E00 ) || (cc >= 0xf900 && cc < 0xfb00 ) ) { - return b; - } - return "&#"+cc+";" + return match; + } + + // No, use a numeric entity. Here we brazenly (and possibly mistakenly) + return "&#" + cc + ";"; + + }); + + + if(this.owner.fireEvent('beforesync', this, html) !== false){ this.el.dom.value = html; this.owner.fireEvent('sync', this, html); @@ -22512,7 +22829,11 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { insertTag : function(tg) { // could be a bit smarter... -> wrap the current selected tRoo.. - if (tg.toLowerCase() == 'span' || tg.toLowerCase() == 'code') { + if (tg.toLowerCase() == 'span' || + tg.toLowerCase() == 'code' || + tg.toLowerCase() == 'sup' || + tg.toLowerCase() == 'sub' + ) { range = this.createRange(this.getSelection()); var wrappingNode = this.doc.createElement(tg.toLowerCase()); @@ -23008,6 +23329,11 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { var remove_keep_children= Roo.HtmlEditorCore.remove.indexOf(node.tagName.toLowerCase()) > -1; + // spans with no attributes - just remove them.. + if ((!node.attributes || !node.attributes.length) && lcname == 'span') { + remove_keep_children = true; + } + // remove as rendering on yahoo mailer is borked with this. // this will have to be flaged elsewhere - perhaps ablack=name... on the mailer.. @@ -23028,6 +23354,10 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { } if (!node.attributes || !node.attributes.length) { + + + + this.cleanUpChildren(node); return; } @@ -23124,11 +23454,11 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { if (a.name == 'class') { if (a.value.match(/^Mso/)) { - node.className = ''; + node.removeAttribute('class'); } if (a.value.match(/^body$/)) { - node.className = ''; + node.removeAttribute('class'); } continue; } @@ -23158,11 +23488,17 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { node.nodeName == 'SPAN' && !node.hasAttributes() && node.childNodes.length == 1 && - node.firstChild.nodeName == "#text" + node.firstChild.nodeName == "#text" ) { - var text = ' ' + node.innerHTML + ' '; - var textNode = document.createTextNode(text); + var textNode = node.firstChild; + node.removeChild(textNode); + if (node.getAttribute('lang') != 'zh-CN') { // do not space pad on chinese characters.. + node.parentNode.insertBefore(node.ownerDocument.createTextNode(" "), node); + } node.parentNode.insertBefore(textNode, node); + if (node.getAttribute('lang') != 'zh-CN') { // do not space pad on chinese characters.. + node.parentNode.insertBefore(node.ownerDocument.createTextNode(" ") , node); + } node.parentNode.removeChild(node); } @@ -23180,16 +23516,20 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { node.parentNode.removeChild(node); return; } - + //Roo.log(node.tagName); // remove - but keep children.. - if (node.tagName.toLowerCase().match(/^(meta|link|\\?xml:|st1:|o:|font)/)) { + if (node.tagName.toLowerCase().match(/^(meta|link|\\?xml:|st1:|o:|v:|font)/)) { + //Roo.log('-- removed'); while (node.childNodes.length) { var cn = node.childNodes[0]; node.removeChild(cn); node.parentNode.insertBefore(cn, node); + // move node to parent - and clean it.. + this.cleanWord(cn); } node.parentNode.removeChild(node); - this.iterateChildren(node, this.cleanWord); + /// no need to iterate chidlren = it's got none.. + //this.iterateChildren(node, this.cleanWord); return; } // clean styles