X-Git-Url: http://git.roojs.org/?p=roojs1;a=blobdiff_plain;f=Roo%2Fbootstrap%2FCard.js;h=dfc6a394e52fd472aa22744d13d57e02fa377e31;hp=08f1a9526122db3808959edc2d3e14e542bc5f54;hb=41a76ad00f5fc61e2452862ddf6908ae45d7fd73;hpb=405704c45feb8165614b274cf3797b4e1291dd45 diff --git a/Roo/bootstrap/Card.js b/Roo/bootstrap/Card.js index 08f1a95261..dfc6a394e5 100644 --- a/Roo/bootstrap/Card.js +++ b/Roo/bootstrap/Card.js @@ -44,6 +44,10 @@ * @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) + * @config {Boolean} dragable if this card can be dragged. + * @config {Boolean} drag_group group for drag + * + * @constructor * Create a new Container * @param {Object} config The config object @@ -91,7 +95,10 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { title : '', subtitle : '', html : '', + footer: '', + dragable : false, + drag_group : false, childContainer : false, @@ -99,21 +106,21 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { { 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) { + 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) { + 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].length + if (('' + t['display' + (v.length ? '_' : '') + v]).length) { + cls += ' d' + (v.length ? '-' : '') + v + '-' + t['margin' + (v.length ? '_' : '') + v] } }); @@ -158,7 +165,9 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { }; if (this.weight.length && this.weight != 'light') { - cfg.cls += ' text-white' + cfg.cls += ' text-white'; + } else { + cfg.cls += ' text-dark'; // need as it's nested.. } if (this.weight.length) { cfg.cls += ' bg-' + this.weight; @@ -186,7 +195,7 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { cls : 'card-body', cn : [] }; - cfg.push(body); + cfg.cn.push(body); if (this.title.length) { body.cn.push({ @@ -209,9 +218,15 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { 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({ + cfg.cn.push({ tag : 'div', cls : 'card-footer', html: this.footer // escape? @@ -230,7 +245,42 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { return false; } return this.el.select('.roo-card-body-ctr',true).first(); - } + }, + + initEvents: function() + { + if(this.dragable){ + this.dragZone = new Roo.dd.DragZone(this.getEl(), { + containerScroll: true, + ddGroup: this.drag_group || 'default_card_drag_group' + }); + this.dragZone.getDragData = this.getDragData.createDelegate(this); + } + + + + }, + getDragData : function(e) { + var target = this.getEl(); + if (target) { + //this.handleSelection(e); + + var dragData = { + source: this, + copy: false, + nodes: this.getEl(), + records: [] + }; + + + dragData.ddel = target.dom ; // the div element + Roo.log(target.getWidth( )); + dragData.ddel.style.width = target.getWidth() + 'px'; + + return dragData; + } + return false; + }, });