* @cfg {Boolean} can_build_overlaid True if element can be rebuild from a HTML page
* @cfg {string} dataId cutomer id
* @cfg {string} name Specifies name attribute
+ * @cfg {string} tooltip Text for the tooltip
*
* @constructor
* Do not use directly - it does not do anything..
/**
* Initialize Events for the element
*/
- initEvents : function()
- {
- Roo.log("------------ component init events ----------");
- Roo.log(this.tooltip);
- if (this.tooltip) {
- this.getTooltipEl().attr('tooltip', this.tooltip);
- }
- },
+ initEvents : function() { },
xattr : false,
if(this.name){
cfg.name = this.name;
}
-
+
+
this.el = ct.createChild(cfg, position);
+ if (this.tooltip) {
+ this.tooltipEl().attr('tooltip', this.tooltip);
+ }
+
if(this.tabIndex !== undefined){
this.el.dom.setAttribute('tabIndex', this.tabIndex);
}
* Fetch the element to display the tooltip on.
* @return {Roo.Element} defaults to this.el
*/
- getTooltipEl : function()
+ tooltipEl : function()
{
return this.el;
},
addxtypeChild : function (tree, cntr)
{
- Roo.log('addxtypeChild:' + cntr);
+ Roo.debug && Roo.log('addxtypeChild:' + cntr);
var cn = this;
cntr = (typeof(cntr) == 'undefined' ) ? 'getChildContainer' : cntr;
// Roo.log("GOT");
//echild.dom.removeAttribute('xtype');
} else {
- Roo.log("MISSING " + cn.xtype + " on child of " + (this.el ? this.el.attr('xbuilderid') : 'no parent'));
- Roo.log(self_cntr_el);
- Roo.log(echild);
- Roo.log(cn);
+ Roo.debug && Roo.log("MISSING " + cn.xtype + " on child of " + (this.el ? this.el.attr('xbuilderid') : 'no parent'));
+ Roo.debug && Roo.log(self_cntr_el);
+ Roo.debug && Roo.log(echild);
+ Roo.debug && Roo.log(cn);
}
}
// if object has flexy:if - then it may or may not be rendered.
if (build_from_html && has_flexy && !cn.el && cn.can_build_overlaid) {
// skip a flexy if element.
- Roo.log('skipping render');
- Roo.log(tree);
+ Roo.debug && Roo.log('skipping render');
+ Roo.debug && Roo.log(tree);
if (!cn.el) {
- Roo.log('skipping all children');
+ Roo.debug && Roo.log('skipping all children');
skip_children = true;
}
},
initEvents : function()
{
- Roo.bootstrap.Input.superclass.initEvents();
-
+
this.inputEl().on("keydown" , this.fireKey, this);
this.inputEl().on("focus", this.onFocus, this);
this.inputEl().on("blur", this.onBlur, this);
// scroll to?
this.view.select(match);
var sn = Roo.get(this.view.getSelectedNodes()[0])
- //sn.scrollIntoView(sn.dom.parentNode, false);
+ sn.scrollIntoView(sn.dom.parentNode, false);
},
onViewScroll : function(e, t){
if(!keepExisting){
this.clearSelections(true);
}
+
if(this.fireEvent("beforeselect", this, node, this.selections) !== false){
Roo.fly(node).addClass(this.selectedClass);
this.selections.push(node);
* @extends Roo.bootstrap.Input
* Bootstrap DateField class
* @cfg {Number} weekStart default 0
- * @cfg {Number} weekStart default 0
- * @cfg {Number} viewMode default empty, (months|years)
- * @cfg {Number} minViewMode default empty, (months|years)
+ * @cfg {String} viewMode default empty, (months|years)
+ * @cfg {String} minViewMode default empty, (months|years)
* @cfg {Number} startDate default -Infinity
* @cfg {Number} endDate default Infinity
* @cfg {Boolean} todayHighlight default false
* @cfg {Boolean} todayBtn default false
* @cfg {Boolean} calendarWeeks default false
* @cfg {Object} daysOfWeekDisabled default empty
+ * @cfg {Boolean} singleMode default false (true | false)
*
* @cfg {Boolean} keyboardNavigation default true
* @cfg {String} language default en
_events: [],
+ singleMode : false,
+
UTCDate: function()
{
return new Date(Date.UTC.apply(Date, arguments));
this.startViewMode = this.viewMode;
+ if(this.singleMode){
+ Roo.each(this.picker().select('thead > tr > th', true).elements, function(v){
+ v.setVisibilityMode(Roo.Element.DISPLAY)
+ v.hide();
+ })
+
+ Roo.each(this.picker().select('tbody > tr > td', true).elements, function(v){
+ v.setStyle('width', '189px');
+ });
+ }
Roo.each(this.picker().select('tfoot th.today', true).elements, function(v){
if(!this.calendarWeeks){
if (dir) {
this.viewMode = Math.max(this.minViewMode, Math.min(2, this.viewMode + dir));
}
+
Roo.each(this.picker().select('>div',true).elements, function(v){
v.setVisibilityMode(Roo.Element.DISPLAY).originalDisplay = 'block';
v.hide();
},
formatDate : function(date, fmt)
- {
+ {
return (!date || !(date instanceof Date)) ?
date : date.dateFormat(fmt || this.format);
},
var d = new Date(this.parseDate(v) ).clearTime();
- Roo.log(d);
- Roo.log(d);
if(isNaN(d.getTime())){
this.date = this.viewDate = '';
Roo.bootstrap.DateField.superclass.setValue.call(this, '');
this.viewDate.setUTCFullYear(year);
}
+
+ if(this.singleMode){
+ this.setValue(this.formatDate(this.viewDate));
+ this.hide();
+ return;
+ }
+
this.showMode(-1);
this.fill();
}
updateNavArrows: function()
{
+ if(this.singleMode){
+ return;
+ }
+
var d = new Date(this.viewDate),
year = d.getUTCFullYear(),
month = d.getUTCMonth();
+ /*
+ * - LGPL
+ *
+ * Tooltip
+ *
+ */
+
+/**
+ * @class Roo.bootstrap.Tooltip
+ * Bootstrap Tooltip class
+ * This is basic at present - all componets support it by default, however they should add tooltipEl() method
+ * to determine which dom element triggers the tooltip.
+ *
+ * It needs to add support for additional attributes like tooltip-position
+ *
+ * @constructor
+ * Create a new Toolti
+ * @param {Object} config The config object
+ */
+
+Roo.bootstrap.Tooltip = function(config){
+ Roo.bootstrap.Tooltip.superclass.constructor.call(this, config);
+};
+
+Roo.apply(Roo.bootstrap.Tooltip, {
+ /**
+ * @function init initialize tooltip monitoring.
+ * @static
+ */
+ currentEl : false,
+ currentTip : false,
+ currentRegion : false,
+
+ // init : delay?
+
+ init : function()
+ {
+ Roo.get(document).on('mouseover', this.enter ,this);
+ Roo.get(document).on('mouseout', this.leave, this);
+
+
+ this.currentTip = new Roo.bootstrap.Tooltip();
+ },
+
+ enter : function(ev)
+ {
+ var dom = ev.getTarget();
+ //Roo.log(['enter',dom]);
+ var el = Roo.fly(dom);
+ if (this.currentEl) {
+ //Roo.log(dom);
+ //Roo.log(this.currentEl);
+ //Roo.log(this.currentEl.contains(dom));
+ if (this.currentEl == el) {
+ return;
+ }
+ if (dom != this.currentEl.dom && this.currentEl.contains(dom)) {
+ return;
+ }
+
+ }
+
+
+
+ if (this.currentTip.el) {
+ this.currentTip.el.hide(); // force hiding...
+ }
+ //Roo.log(el);
+ if (!el.attr('tooltip')) { // parents who have tip?
+ return;
+ }
+ this.currentEl = el;
+ this.currentTip.bind(el);
+ this.currentRegion = Roo.lib.Region.getRegion(dom);
+ this.currentTip.enter();
+
+ },
+ leave : function(ev)
+ {
+ var dom = ev.getTarget();
+ //Roo.log(['leave',dom]);
+ if (!this.currentEl) {
+ return;
+ }
+
+
+ if (dom != this.currentEl.dom) {
+ return;
+ }
+ var xy = ev.getXY();
+ if (this.currentRegion.contains( new Roo.lib.Region( xy[1], xy[0] ,xy[1], xy[0] ))) {
+ return;
+ }
+ // only activate leave if mouse cursor is outside... bounding box..
+
+
+
+
+ if (this.currentTip) {
+ this.currentTip.leave();
+ }
+ //Roo.log('clear currentEl');
+ this.currentEl = false;
+
+
+ },
+ alignment : {
+ 'left' : ['r-l', [-2,0], 'right'],
+ 'right' : ['l-r', [2,0], 'left'],
+ 'bottom' : ['t-b', [0,2], 'top'],
+ 'top' : [ 'b-t', [0,-2], 'bottom']
+ }
+
+});
+
+
+Roo.extend(Roo.bootstrap.Tooltip, Roo.bootstrap.Component, {
+
+
+ bindEl : false,
+
+ delay : null, // can be { show : 300 , hide: 500}
+
+ timeout : null,
+
+ hoverState : null, //???
+
+ placement : 'bottom',
+
+ getAutoCreate : function(){
+
+ var cfg = {
+ cls : 'tooltip',
+ role : 'tooltip',
+ cn : [
+ {
+ cls : 'tooltip-arrow'
+ },
+ {
+ cls : 'tooltip-inner'
+ }
+ ]
+ };
+
+ return cfg;
+ },
+ bind : function(el)
+ {
+ this.bindEl = el;
+ },
+
+
+ enter : function () {
+
+ if (this.timeout != null) {
+ clearTimeout(this.timeout);
+ }
+
+ this.hoverState = 'in'
+ //Roo.log("enter - show");
+ if (!this.delay || !this.delay.show) {
+ this.show();
+ return;
+ }
+ var _t = this;
+ this.timeout = setTimeout(function () {
+ if (_t.hoverState == 'in') {
+ _t.show();
+ }
+ }, this.delay.show);
+ },
+ leave : function()
+ {
+ clearTimeout(this.timeout);
+
+ this.hoverState = 'out'
+ if (!this.delay || !this.delay.hide) {
+ this.hide();
+ return
+ }
+
+ var _t = this;
+ this.timeout = setTimeout(function () {
+ //Roo.log("leave - timeout");
+
+ if (_t.hoverState == 'out') {
+ _t.hide();
+ Roo.bootstrap.Tooltip.currentEl = false;
+ }
+ }, delay)
+ },
+
+ show : function ()
+ {
+ if (!this.el) {
+ this.render(document.body);
+ }
+ // set content.
+ //Roo.log([this.bindEl, this.bindEl.attr('tooltip')]);
+ this.el.select('.tooltip-inner',true).first().dom.innerHTML = this.bindEl.attr('tooltip');
+
+ this.el.removeClass(['fade','top','bottom', 'left', 'right','in']);
+
+ var placement = typeof this.placement == 'function' ?
+ this.placement.call(this, this.el, on_el) :
+ this.placement;
+
+ var autoToken = /\s?auto?\s?/i;
+ var autoPlace = autoToken.test(placement);
+ if (autoPlace) {
+ placement = placement.replace(autoToken, '') || 'top';
+ }
+
+ //this.el.detach()
+ //this.el.setXY([0,0]);
+ this.el.show();
+ //this.el.dom.style.display='block';
+ this.el.addClass(placement);
+
+ //this.el.appendTo(on_el);
+
+ var p = this.getPosition();
+ var box = this.el.getBox();
+
+ if (autoPlace) {
+ // fixme..
+ }
+ var align = Roo.bootstrap.Tooltip.alignment[placement]
+ this.el.alignTo(this.bindEl, align[0],align[1]);
+ //var arrow = this.el.select('.arrow',true).first();
+ //arrow.set(align[2],
+
+ this.el.addClass('in fade');
+ this.hoverState = null;
+
+ if (this.el.hasClass('fade')) {
+ // fade it?
+ }
+
+ },
+ hide : function()
+ {
+
+ if (!this.el) {
+ return;
+ }
+ //this.el.setXY([0,0]);
+ this.el.removeClass('in');
+ //this.el.hide();
+
+ }
+
+});
+
+
\ No newline at end of file