Roo.bootstrap.Component = function(config){
Roo.bootstrap.Component.superclass.constructor.call(this, config);
+
+ this.addEvents({
+ /**
+ * @event childrenrendered
+ * Fires when the children have been rendered..
+ * @param {Roo.bootstrap.Component} this
+ */
+ "childrenrendered" : true
+
+
+
+ });
+
+
};
Roo.extend(Roo.bootstrap.Component, Roo.BoxComponent, {
}
var ret = false;
+ if (!build_from_html) {
+ return false;
+ }
+ // this i think handles overlaying multiple children of the same type
+ // with the sam eelement.. - which might be buggy..
while (true) {
var echild =self_cntr_el ? self_cntr_el.child('>*[xtype]') : false;
// that match this xtype..
// note - when we render we create these as well..
// so we should check to see if body has xtype set.
- if (Roo.get(document.body).attr('xtype') == 'Roo.bootstrap.Body') {
+ if (build_from_html && Roo.get(document.body).attr('xtype') == 'Roo.bootstrap.Body') {
var self_cntr_el = Roo.get(this[cntr](false));
var echild =self_cntr_el ? self_cntr_el.child('>*[xtype]') : false;
-
-
+ if (echild) {
+ Roo.log(Roo.XComponent.build_from_html);
+ Roo.log("got echild:");
+ Roo.log(echild);
+ }
// there is a scenario where some of the child elements are flexy:if (and all of the same type)
// and are not displayed -this causes this to use up the wrong element when matching.
// at present the only work around for this is to nest flexy:if elements in another element that is always rendered.
}
cn.items = nitems;
-
+
+ this.fireEvent('childrenrendered', this);
+
return cn;
- }
-
-
+ }
});
/**
* @event click
* When a butotn is pressed
+ * @param {Roo.bootstrap.Button} this
* @param {Roo.EventObject} e
*/
"click" : true,
getAutoCreate : function(){
+
+
var cfg = {
tag: 'h' + (1 *this.level),
- html: this.html || 'fill in html'
+ html: this.html || ''
} ;
return cfg;
/**
* @event click
* The raw click event for the entire grid.
+ * @param {Roo.bootstrap.MenuItem} this
* @param {Roo.EventObject} e
*/
"click" : true
/*
-<div class="modal fade">
- <div class="modal-dialog">
- <div class="modal-content">
- <div class="modal-header">
- <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
- <h4 class="modal-title">Modal title</h4>
- </div>
- <div class="modal-body">
- <p>One fine body…</p>
- </div>
- <div class="modal-footer">
- <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
- <button type="button" class="btn btn-primary">Save changes</button>
- </div>
- </div><!-- /.modal-content -->
- </div><!-- /.modal-dialog -->
-</div><!-- /.modal -->
+* Licence: LGPL
*/
-/*
- * - LGPL
- *
- * page contgainer.
- *
- */
/**
* @class Roo.bootstrap.Modal
* @extends Roo.bootstrap.Component
* Bootstrap Modal class
* @cfg {String} title Title of dialog
+ * @cfg {String} html - the body of the dialog (for simple ones) - you can also use template..
+ * @cfg {Roo.Template} tmpl - a template with variables. to use it, add a handler in show:method adn
* @cfg {Boolean} specificTitle default false
* @cfg {Array} buttons Array of buttons or standard button set..
* @cfg {String} buttonPosition (left|right|center) default right
"btnclick" : true
});
this.buttons = this.buttons || [];
+
+ if (this.tmpl) {
+ this.tmpl = Roo.factory(this.tmpl);
+ }
+
};
Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component, {
buttons : false,
// set on load...
- body: false,
+
+ html: false,
+
+ tmp: false,
specificTitle: false,
animate : true,
+
+ // private
+ bodyEl: false,
+ footerEl: false,
+ titleEl: false,
+ closeEl: false,
+
+
onRender : function(ct, position)
{
Roo.bootstrap.Component.superclass.onRender.call(this, ct, position);
}
//var type = this.el.dom.type;
+
+
+
if(this.tabIndex !== undefined){
this.el.dom.setAttribute('tabIndex', this.tabIndex);
}
+ this.bodyEl = this.el.select('.modal-body',true).first();
+ this.closeEl = this.el.select('.modal-header .close', true).first();
+ this.footerEl = this.el.select('.modal-footer',true).first();
+ this.titleEl = this.el.select('.modal-title',true).first();
+
+
this.maskEl = Roo.DomHelper.append(document.body, {tag: "div", cls:"x-dlg-mask"}, true);
this.maskEl.enableDisplayMode("block");
this.maskEl.hide();
this.items = nitems;
- this.body = this.el.select('.modal-body',true).first();
- this.close = this.el.select('.modal-header .close', true).first();
- this.footer = this.el.select('.modal-footer',true).first();
+ // where are these used - they used to be body/close/footer
+
+
this.initEvents();
//this.el.addClass([this.fieldClass, this.cls]);
},
getChildContainer : function() {
- return this.el.select('.modal-body',true).first();
+ return this.bodyEl;
},
getButtonContainer : function() {
},
initEvents : function()
{
- this.el.select('.modal-header .close').on('click', this.hide, this);
-//
-// this.addxtype(this);
+ if (this.allow_close) {
+ this.closeEl.on('click', this.hide, this);
+ }
+
},
show : function() {
this.el.addClass('in');
}
+ // not sure how we can show data in here..
+ //if (this.tmpl) {
+ // this.getChildContainer().dom.innerHTML = this.tmpl.applyTemplate(this);
+ //}
+
Roo.get(document.body).addClass("x-body-masked");
this.maskEl.setSize(Roo.lib.Dom.getViewWidth(true), Roo.lib.Dom.getViewHeight(true));
this.maskEl.show();
//Roo.log([a,b,c]);
this.fireEvent('btnclick', btn.name, e);
},
+ /**
+ * Set the title of the Dialog
+ * @param {String} str new Title
+ */
setTitle: function(str) {
- this.el.select('.modal-title',true).first().dom.innerHTML = str;
-
+ this.titleEl.dom.innerHTML = str;
+ },
+ /**
+ * Set the body of the Dialog
+ * @param {String} str new Title
+ */
+ setBody: function(str) {
+ this.bodyEl.dom.innerHTML = str;
+ },
+ /**
+ * Set the body of the Dialog using the template
+ * @param {Obj} data - apply this data to the template and replace the body contents.
+ */
+ applyBody: function(obj)
+ {
+ if (!this.tmpl) {
+ Roo.log("Error - using apply Body without a template");
+ //code
+ }
+ this.tmpl.overwrite(this.bodyEl, obj);
}
+
});
}
]
});
+
/*
* - LGPL
*
//dlg.footer.dom.style.display = 'none';
return width;
}
- dlg.footer.dom.style.display = '';
+ dlg.footerEl.dom.style.display = '';
for(var k in buttons){
if(typeof buttons[k] != "function"){
if(b[k]){
buttons["no"] = dlg.addButton(bt["no"], handleButton.createCallback("no"));
buttons["cancel"] = dlg.addButton(bt["cancel"], handleButton.createCallback("cancel"));
Roo.log(buttons)
- bodyEl = dlg.body.createChild({
+ bodyEl = dlg.bodyEl.createChild({
html:'<span class="roo-mb-text"></span><br /><input type="text" class="roo-mb-input" />' +
'<textarea class="roo-mb-textarea"></textarea>' +
var d = this.getDialog();
opt = options;
d.setTitle(opt.title || " ");
- d.close.setDisplayed(opt.closable !== false);
+ d.closeEl.setDisplayed(opt.closable !== false);
activeTextEl = textboxEl;
opt.prompt = opt.prompt || (opt.multiline ? true : false);
if(opt.prompt){
* @cfg {Boolean} preventDefault (true | false) default false
* @cfg {String} tabId the tab that this item activates.
* @cfg {String} tagtype (a|span) render as a href or span?
+ * @cfg {Boolean} animateRef (true|false) link to element default false
* @constructor
* Create a new Navbar Item
* @param {boolean} state the new state
*/
- 'changed': true
+ 'changed': true,
+ /**
+ * @event scrollto
+ * Fires when scroll to element
+ * @param {Roo.bootstrap.NavItem} this
+ * @param {Object} options
+ * @param {Roo.EventObject} e
+
+ */
+ 'scrollto': true
});
};
tabId : false,
tagtype : 'a',
disabled : false,
-
+ animateRef : false,
was_active : false,
getAutoCreate : function(){
onClick : function(e)
{
- if(this.preventDefault || this.href == '#'){
+ if(
+ this.preventDefault ||
+ this.href == '#' ||
+ (this.animateRef && this.href.charAt(0) == '#')
+ ){
e.preventDefault();
}
return;
}
+ if(this.animateRef && this.href.charAt(0) == '#'){
+ this.scrollToElement(e);
+ return;
+ }
+
var p = this.parent();
if (['tabs','pills'].indexOf(p.type)!==-1) {
if (typeof(p.setActiveItem) !== 'undefined') {
tooltipEl : function()
{
return this.el.select('' + this.tagtype + '', true).first();
+ },
+
+ scrollToElement : function(e)
+ {
+ var c = document.body;
+
+ var target = Roo.get(c).select('a[name=' + this.href.replace('#', '') +']', true).first();
+
+ if(!target){
+ return;
+ }
+
+ var o = target.calcOffsetsTo(c);
+
+ var options = {
+ target : target,
+ value : o[1]
+ }
+
+ this.fireEvent('scrollto', this, options, e);
+
+ Roo.get(c).scrollTo('top', options.value, true);
+
+ return;
}
});
return cfg;
+ },
+
+ getValue : function()
+ {
+ return this.el.dom.innerHTML;
+ },
+
+ setValue : function(value)
+ {
+ this.el.dom.innerHTML = value;
}
});
c.tooltip = config.tooltip;
}
+ if(typeof(config.colspan) != 'undefined'){
+ c.colspan = config.colspan;
+ }
+
if(typeof(config.hidden) != 'undefined' && config.hidden){
c.style += ' display:none;';
}
td.id = id;
}
+ if(typeof(config.colspan) != 'undefined'){
+ td.colspan = config.colspan;
+ }
+
if(typeof(config.hidden) != 'undefined' && config.hidden){
td.style += ' display:none;';
}
this.el.addClass(this.validClass);
- if(this.hasFeedback && this.inputType != 'hidden' && !this.allowBlank){
+ if(this.hasFeedback && this.inputType != 'hidden' && !this.allowBlank && this.getValue().length){
+
var feedback = this.el.select('.form-control-feedback', true).first();
if(feedback){
if(feedback){
this.el.select('.form-control-feedback', true).first().removeClass([this.invalidFeedbackClass, this.validFeedbackClass]);
- this.el.select('.form-control-feedback', true).first().addClass([this.invalidFeedbackClass]);
+
+ if(this.getValue().length){
+ this.el.select('.form-control-feedback', true).first().addClass([this.invalidFeedbackClass]);
+ }
+
}
}
* Fires when the remove value from the combobox array
* @param {Roo.bootstrap.ComboBox} combo This combo box
*/
- 'remove' : true
+ 'remove' : true,
+ /**
+ * @event specialfilter
+ * Fires when specialfilter
+ * @param {Roo.bootstrap.ComboBox} combo This combo box
+ */
+ 'specialfilter' : true
});
* mode = 'remote' or 'text' if mode = 'local')
*/
displayField: undefined,
+
/**
* @cfg {String} valueField The underlying data value name to bind to this CombBox (defaults to undefined if
* mode = 'remote' or 'value' if mode = 'local').
*/
validClass : "has-success",
+ /**
+ * @cfg {Boolean} specialFilter (true|false) special filter default false
+ */
+ specialFilter : false,
+
//private
addicon : false,
editicon: false,
cls : 'form-group roo-combobox-tickable' //input-group
};
-
var buttons = {
tag : 'div',
cls : 'tickable-buttons',
]
};
+ if(this.editable){
+ buttons.cn.unshift({
+ tag: 'input',
+ cls: 'select2-search-field-input'
+ });
+ }
+
var _this = this;
+
Roo.each(buttons.cn, function(c){
if (_this.size) {
c.cls += ' btn-' + _this.size;
this.store.on('load', this.onLoad, this);
this.store.on('loadexception', this.onLoadException, this);
-// this.keyNav = new Roo.KeyNav(this.inputEl(), {
-// "up" : function(e){
-// this.inKeyMode = true;
-// this.selectPrev();
-// },
-//
-// "down" : function(e){
-// if(!this.isExpanded()){
-// this.onTriggerClick();
-// }else{
-// this.inKeyMode = true;
-// this.selectNext();
-// }
-// },
-//
-// "enter" : function(e){
-//// this.onViewClick();
-// //return true;
-// this.collapse();
-//
-// if(this.fireEvent("specialkey", this, e)){
-// this.onViewClick(false);
-// }
-//
-// return true;
-// },
-//
-// "esc" : function(e){
-// this.collapse();
-// },
-//
-// "tab" : function(e){
-// this.collapse();
-//
-// if(this.fireEvent("specialkey", this, e)){
-// this.onViewClick(false);
-// }
-//
-// return true;
-// },
-//
-// scope : this,
-//
-// doRelay : function(foo, bar, hname){
-// if(hname == 'down' || this.scope.isExpanded()){
-// return Roo.KeyNav.prototype.doRelay.apply(this, arguments);
-// }
-// return true;
-// },
-//
-// forceKeyDown: true
-// });
-
+ if(this.editable){
+ this.keyNav = new Roo.KeyNav(this.tickableInputEl(), {
+ "up" : function(e){
+ this.inKeyMode = true;
+ this.selectPrev();
+ },
+
+ "down" : function(e){
+ this.inKeyMode = true;
+ this.selectNext();
+ },
+
+ "enter" : function(e){
+ if(this.fireEvent("specialkey", this, e)){
+ this.onViewClick(false);
+ }
+
+ return true;
+ },
+
+ "esc" : function(e){
+ this.onTickableFooterButtonClick(e, false, false);
+ },
+
+ "tab" : function(e){
+ this.fireEvent("specialkey", this, e);
+
+ this.onTickableFooterButtonClick(e, false, false);
+
+ return true;
+ },
+
+ scope : this,
+
+ doRelay : function(e, fn, key){
+ if(this.scope.isExpanded()){
+ return Roo.KeyNav.prototype.doRelay.apply(this, arguments);
+ }
+ return true;
+ },
+
+ forceKeyDown: true
+ });
+ }
this.queryDelay = Math.max(this.queryDelay || 10,
this.mode == 'local' ? 10 : 250);
this.taTask = new Roo.util.DelayedTask(this.onTypeAhead, this);
}
+ if(this.editable !== false){
+ this.tickableInputEl().on("keyup", this.onKeyUp, this);
+ }
+
},
onDestroy : function(){
if(typeof(this.loading) !== 'undefined' && this.loading !== null){
this.loading.hide();
}
-
+
if(this.store.getCount() > 0){
this.expand();
-// this.restrictHeight();
+ this.restrictHeight();
if(this.lastQuery == this.allQuery){
if(this.editable && !this.tickable){
this.inputEl().dom.select();
if(
!this.selectByValue(this.value, true) &&
- this.autoFocus && (typeof(this.store.lastOptions.add) == 'undefined' ||
- this.store.lastOptions.add != true)
+ this.autoFocus &&
+ (
+ !this.store.lastOptions ||
+ typeof(this.store.lastOptions.add) == 'undefined' ||
+ this.store.lastOptions.add != true
+ )
){
this.select(0, true);
}
this.loading.hide();
}
+ if(this.tickable && this.editable){
+ return;
+ }
+
this.collapse();
+
Roo.log(this.store.reader.jsonData);
if (this.store && typeof(this.store.reader.jsonData.errorMsg) != 'undefined') {
// fixme
// private
reset : function(){
// overridden so that last data is reset..
+
+ if(this.multiple){
+ this.clearItem();
+ return;
+ }
+
this.setValue(this.originalValue);
this.clearInvalid();
this.lastData = false;
if(this.tickable){
- if(e.getTarget().nodeName.toLowerCase() != 'input'){
+ if(typeof(e) != 'undefined' && e.getTarget().nodeName.toLowerCase() != 'input'){
return;
}
if(typeof(v) != 'undefined' && v[_this.valueField] == r.data[_this.valueField]){
_this.tickItems.splice(k, 1);
+
+ if(typeof(e) == 'undefined' && view == false){
+ Roo.get(_this.view.getNodes(index, index)[0]).select('input', true).first().dom.checked = false;
+ }
+
rm = true;
return;
}
}
this.tickItems.push(r.data);
+
+ if(typeof(e) == 'undefined' && view == false){
+ Roo.get(_this.view.getNodes(index, index)[0]).select('input', true).first().dom.checked = true;
+ }
+
return;
}
// private
onEmptyResults : function(){
+
+ if(this.tickable && this.editable){
+ this.restrictHeight();
+ return;
+ }
+
this.collapse();
},
this.view.select(index);
if(scrollIntoView !== false){
var el = this.view.getNode(index);
- if(el && !this.multiple && !this.tickable){
+ /*
+ * el && !this.multiple && !this.tickable // not sure why we disable multiple before..
+ */
+ if(el){
this.list.scrollChildIntoView(el, false);
}
}
// private
initQuery : function(){
- this.doQuery(this.getRawValue());
+
+ var v = this.getRawValue();
+
+ if(this.tickable && this.editable){
+ v = this.tickableInputEl().getValue();
+ }
+
+ this.doQuery(v);
},
// private
if(forceAll){
this.store.clearFilter();
}else{
+
+ if(this.specialFilter){
+ this.fireEvent('specialfilter', this);
+ this.onLoad();
+ return;
+ }
+
this.store.filter(this.displayField, q);
}
this.onLoad();
}else{
+
this.store.baseParams[this.queryParam] = q;
var options = {params : this.getParams(q)};
}
this.store.load(options);
+
/*
* this code will make the page width larger, at the beginning, the list not align correctly,
* we should expand the list on onLoad
this.loadNext = false;
},
-
+
// private
getParams : function(q){
var p = {};
this.okBtn.hide();
this.cancelBtn.hide();
this.trigger.show();
+
+ if(this.editable){
+ this.tickableInputEl().dom.value = '';
+ this.tickableInputEl().blur();
+ }
+
}
Roo.get(document).un('mousedown', this.collapseIf, this);
this.cancelBtn.show();
this.trigger.hide();
+ if(this.editable){
+ this.tickableInputEl().focus();
+ }
+
}
Roo.get(document).on('mousedown', this.collapseIf, this);
this.markInvalid();
return false;
+ },
+
+ tickableInputEl : function()
+ {
+ if(!this.tickable || !this.editable){
+ return this.inputEl();
+ }
+
+ return this.inputEl().select('.select2-search-field-input', true).first();
}
* Bootstrap Column class
* @cfg {String} navId the navigation id (for use with navbars) - will be auto generated if it does not exist..
* @cfg {Boolean} carousel true to make the group behave like a carousel
+ * @cfg {Number} bullets show the panel pointer.. default 0
+ * @cfg {Boolena} autoslide (true|false) auto slide .. default false
+ * @cfg {Number} timer auto slide timer .. default 0 millisecond
*
* @constructor
* Create a new TabGroup
carousel : false,
transition : false,
-
+ bullets : 0,
+ timer : 0,
+ autoslide : false,
+ slideFn : false,
+
getAutoCreate : function()
{
var cfg = Roo.apply({}, Roo.bootstrap.TabGroup.superclass.getAutoCreate.call(this));
if (this.carousel) {
cfg.cls += ' carousel slide';
+
cfg.cn = [{
cls : 'carousel-inner'
- }]
- }
+ }];
+ if(this.bullets > 0){
+
+ var bullets = {
+ cls : 'carousel-bullets',
+ cn : []
+ };
+
+ for (var i = 0; i < this.bullets; i++){
+ bullets.cn.push({
+ cls : 'bullet bullet-' + i
+ });
+ }
+
+ bullets.cn.push({
+ cls : 'clear'
+ });
+
+ cfg.cn[0].cn = bullets;
+ }
+ }
return cfg;
},
+
+ initEvents: function()
+ {
+ Roo.log('-------- init events on tab group ---------');
+
+ var _this = this;
+
+ if(this.bullets > 0){
+
+ for (var i = 0; i < this.bullets; i++){
+ var bullet = this.el.select('.bullet-' + i, true).first();
+
+ if(!bullet){
+ continue;
+ }
+
+ bullet.on('click', (function(e, el, o, ii, t){
+
+ e.preventDefault();
+
+ _this.showPanel(ii);
+
+ }).createDelegate(this, [i, bullet], true));
+
+ }
+ }
+
+ if(this.autoslide){
+ this.slideFn = window.setInterval(function() {
+ _this.showPanelNext();
+ }, this.timer);
+ }
+ },
+
getChildContainer : function()
{
return this.carousel ? this.el.select('.carousel-inner', true).first() : this.el;
*/
showPanel : function (pan)
{
+ if(this.transition){
+ Roo.log("waiting for the transitionend");
+ return;
+ }
if (typeof(pan) == 'number') {
pan = this.tabs[pan];
return false;
}
+ if(this.bullets > 0){
+ this.setActiveBullet(this.indexOfPanel(pan));
+ }
+
if (this.carousel && typeof(Roo.get(document.body).dom.style.transition) != 'undefined') {
this.transition = true;
_this.transition = false;
}, this, { single: true } );
+
return true;
}
cur.setActive(false);
pan.setActive(true);
+
return true;
},
showPanelNext : function()
{
var i = this.indexOfPanel(this.getActivePanel());
- if (i > this.tabs.length) {
+
+ if (i >= this.tabs.length - 1 && !this.autoslide) {
return;
}
+
+ if (i >= this.tabs.length - 1 && this.autoslide) {
+ i = -1;
+ }
+
this.showPanel(this.tabs[i+1]);
},
+
showPanelPrev : function()
{
var i = this.indexOfPanel(this.getActivePanel());
- if (i < 1) {
+
+ if (i < 1 && !this.autoslide) {
return;
}
+
+ if (i < 1 && this.autoslide) {
+ i = this.tabs.length;
+ }
+
this.showPanel(this.tabs[i-1]);
+ },
+
+ setActiveBullet : function(i)
+ {
+ Roo.each(this.el.select('.bullet', true).elements, function(el){
+ el.removeClass('selected');
+ });
+
+ var bullet = this.el.select('.bullet-' + i, true).first();
+
+ if(!bullet){
+ return;
+ }
+
+ bullet.addClass('selected');
}
var tg = Roo.bootstrap.TabGroup.get(this.navId);
Roo.log(['register', tg, this]);
tg.register(this);
+
+ var i = tg.tabs.length - 1;
+
+ if(this.active && tg.bullets > 0 && i < tg.bullets){
+ tg.setActiveBullet(i);
+ }
}
+
},
} else if (!this.el.hasClass('active')) {
this.el.addClass('active');
}
+
this.fireEvent('changed', this, state);
}
* @event select
* Fires when select a date.
* @param {Roo.bootstrap.MonthField} this
- * @param {Mixed} date The date value
+ * @param {String} oldvalue The old value
+ * @param {String} newvalue The new value
*/
select : true
});
},
- setValue: function(v)
+ setValue: function(v, suppressEvent)
{
+ var o = this.getValue();
+
Roo.bootstrap.MonthField.superclass.setValue.call(this, v);
this.update();
- this.fireEvent('select', this, this.date);
+ if(suppressEvent !== true){
+ this.fireEvent('select', this, o, v);
+ }
},
{
if(
this.disabled ||
- (this.inputType == 'radio' && this.getValue().length) ||
- (this.inputType == 'checkbox' && this.validateGroup())
+ (this.inputType == 'radio' && this.validateRadio()) ||
+ (this.inputType == 'checkbox' && this.validateCheckbox())
){
this.markValid();
return true;
return false;
},
- validateGroup : function()
+ validateRadio : function()
+ {
+ var valid = false;
+
+ Roo.each(this.el.up('form').select('input[name='+this.name+']', true).elements, function(e){
+ if(!e.dom.checked){
+ return;
+ }
+
+ valid = true;
+
+ return false;
+ });
+
+ return valid;
+ },
+
+ validateCheckbox : function()
{
if(!this.groupId){
return (this.getValue() == this.inputValue || this.allowBlank) ? true : false;
*/
markValid : function()
{
+ if(this.allowBlank){
+ return;
+ }
+
var _this = this;
this.fireEvent('valid', this);
*/
markInvalid : function(msg)
{
+ if(this.allowBlank){
+ return;
+ }
+
var _this = this;
this.fireEvent('invalid', this, msg);
enter : function(ev)
{
var dom = ev.getTarget();
+
//Roo.log(['enter',dom]);
var el = Roo.fly(dom);
if (this.currentEl) {
if (this.currentTip.el) {
this.currentTip.el.hide(); // force hiding...
}
- //Roo.log(el);
- if (!el.attr('tooltip')) { // parents who have tip?
- return;
+ //Roo.log(ev);
+ var bindEl = el;
+
+ // you can not look for children, as if el is the body.. then everythign is the child..
+ if (!el.attr('tooltip')) { //
+ if (!el.select("[tooltip]").elements.length) {
+ return;
+ }
+ // is the mouse over this child...?
+ bindEl = el.select("[tooltip]").first();
+ var xy = ev.getXY();
+ if (!bindEl.getRegion().contains( { top : xy[1] ,right : xy[0] , bottom : xy[1], left : xy[0]})) {
+ //Roo.log("not in region.");
+ return;
+ }
+ //Roo.log("child element over..");
+
}
- this.currentEl = el;
- this.currentTip.bind(el);
+ this.currentEl = bindEl;
+ this.currentTip.bind(bindEl);
this.currentRegion = Roo.lib.Region.getRegion(dom);
this.currentTip.enter();
this.hoverState = 'out';
if (!this.delay || !this.delay.hide) {
this.hide();
- return
+ return;
}
var _t = this;
_t.hide();
Roo.bootstrap.Tooltip.currentEl = false;
}
- }, delay)
+ }, delay);
},
show : function ()
}
// set content.
//Roo.log([this.bindEl, this.bindEl.attr('tooltip')]);
- this.el.select('.tooltip-inner',true).first().dom.innerHTML = this.bindEl.attr('tooltip');
+
+ var tip = this.bindEl.attr('tooltip') || this.bindEl.select("[tooltip]").first().attr('tooltip');
+
+ this.el.select('.tooltip-inner',true).first().dom.innerHTML = tip;
this.el.removeClass(['fade','top','bottom', 'left', 'right','in']);
GMapContext: function()
{
- var _map = new google.maps.Map(this.el.dom, this);
+ var position = new google.maps.LatLng(this.latitude, this.longitude);
+
+ var _map = new google.maps.Map(this.el.dom, {
+ center: position,
+ zoom: this.zoom,
+ mapTypeId: this.mapTypeId,
+ mapTypeControl: this.mapTypeControl,
+ disableDoubleClickZoom: this.disableDoubleClickZoom,
+ scrollwheel: this.scrollwheel,
+ streetViewControl: this.streetViewControl,
+ locationName: this.locationName,
+ draggable: this.draggable,
+ enableAutocomplete: this.enableAutocomplete,
+ enableReverseGeocode: this.enableReverseGeocode
+ });
+
var _marker = new google.maps.Marker({
- position: new google.maps.LatLng(this.latitude, this.longitude),
+ position: position,
map: _map,
title: this.markerTitle,
draggable: this.draggable
map: _map,
marker: _marker,
circle: null,
- location: _marker.position,
+ location: position,
radius: this.radius,
locationName: this.locationName,
addressComponents: {