/*
 * Ext Scheduler v2.0 beta
 * Copyright(c) 2009-2010 Mats Bryntse Consulting
 * mats@ext-scheduler.com
 * http://www.ext-scheduler.com/license.html
 *
 */

Ext.ns('Sch.plugins');
 
/**
 * @ignore
 * @class Sch.plugins.Tooltip
 * @extends Ext.util.Observable
 * Plugin enabling resizing of event items
 * @constructor
 * @param {Object} config The object containing the configuration of this model.
 */
Sch.plugins.Tooltip = function(config, grid) {
    Ext.apply(this, config);
    this.grid = grid;
    Sch.plugins.Tooltip.superclass.constructor.call(this);
};
 
Ext.extend(Sch.plugins.Tooltip, Ext.ToolTip, {
    
    showClock : false,
    
    startText : 'Starts: ',
    
    endText : 'Ends: ',
    
    initComponent : function() {    
       
        
        if (!this.template) {
            if (this.showClock) {
                this.template = new Ext.Template(
                    '<div class="sch-timetipwrap {cls}">',
                    '<div class="sch-clock">',
                        '<img src="' + Ext.BLANK_IMAGE_URL + '" class="sch-hourIndicator" style="-moz-transform: rotate({startHourDegrees}deg);-webkit-transform: rotate({startHourDegrees}deg)"/>',
                        '<img src="' + Ext.BLANK_IMAGE_URL + '" class="sch-minuteIndicator" style="-moz-transform: rotate({startMinuteDegrees}deg);-webkit-transform: rotate({startMinuteDegrees}deg)"/>',
                        '{startText}',
                    '</div>',
                     '<div class="sch-clock">',
                        '<img src="' + Ext.BLANK_IMAGE_URL + '" class="sch-hourIndicator" style="-moz-transform: rotate({endHourDegrees}deg);-webkit-transform: rotate({endHourDegrees}deg)"/>',
                        '<img src="' + Ext.BLANK_IMAGE_URL + '" class="sch-minuteIndicator" style="-moz-transform: rotate({endMinuteDegrees}deg);-webkit-transform: rotate({endMinuteDegrees}deg)"/>',
                        '{endText}',
                    '</div>',
                '</div>'
                );
            } else {
                this.template = new Ext.Template(
                    '<div class="sch-timetipwrap {cls}">',
                    '<div>',
                        this.startText + '{startText}',
                    '</div>',
                     '<div>',
                        this.endText + '{endText}',
                    '</div>',
                '</div>'
                );
            }
        }
        
        this.template.compile();
        Sch.plugins.Tooltip.superclass.initComponent.apply(this, arguments);
    },
    
    cls : 'sch-tip',
    width: 145,
    height:40,
    autoHide : false,
    anchor : 'b-tl',
    
    update : function(start, end, valid) {
        var data = this.getTipData(start, end, valid);
        Sch.plugins.Tooltip.superclass.update.call(this, this.template.apply(data));
    },
     
    // private
    getTipData : function(start, end, valid) {
        var g = this.grid,
            roundedStart = g.floorDate(start),
            roundedEnd = g.floorDate(end),
            formattedStart = g.getFormattedDate(start, 'floor'),
            formattedEnd = g.getFormattedEndDate(roundedEnd);
        
        return {
            cls : valid ? 'sch-tip-ok' : 'sch-tip-notok',
            startText : formattedStart,
            endText : formattedEnd,
            startHourDegrees : roundedStart.getHours() * 30, 
            startMinuteDegrees : roundedStart.getMinutes() * 6,
            endHourDegrees : roundedEnd.getHours() * 30, 
            endMinuteDegrees : roundedEnd.getMinutes() * 6
        };
    },
    
    show : function(el) {
        this.anchorTarget = el;
        
        // Rendering is weird if the initial tooltip is empty, prepopulate it with some dummy html
        if (!this.rendered) {
            var dummyDate = new Date();
            this.html = this.template.apply(this.getTipData(dummyDate, dummyDate, true));
        }
        Sch.plugins.Tooltip.superclass.show.call(this);
    }
});