view release on metacpan or  search on metacpan

root/static/yui/profilerviewer/profilerviewer-debug.js  view on Meta::CPAN

     * @extends YAHOO.util.Element
     * @constructor
     * @param {HTMLElement | String | Object} el(optional) The html 
     * element into which the ProfileViewer should be rendered. 
     * An element will be created if none provided.
     * @param {Object} attr (optional) A key map of the ProfilerViewer's 
     * initial attributes.  Ignored if first arg is an attributes object.
     */
    YAHOO.widget.ProfilerViewer = function(el, attr) {
        attr = attr || {};
        if (arguments.length == 1 && !YAHOO.lang.isString(el) && !el.nodeName) {
            attr = el;
            el = attr.element || null;
        }
        if (!el && !attr.element) {
            el = this._createProfilerViewerElement();
        }

    	YAHOO.widget.ProfilerViewer.superclass.constructor.call(this, el, attr); 
		
		this._init();
		
		YAHOO.log("ProfilerViewer instantiated.", "info", "ProfilerViewer");
    };

    YAHOO.extend(YAHOO.widget.ProfilerViewer, YAHOO.util.Element);
	
	// Static members of YAHOO.widget.ProfilerViewer:
	YAHOO.lang.augmentObject(YAHOO.widget.ProfilerViewer, {
		/**
		 * Classname for ProfilerViewer containing element.
		 * @static
		 * @property CLASS
		 * @type string
		 * @public
		 * @default "yui-pv"
		 */
		CLASS: 'yui-pv',
	
		/**
		 * Classname for ProfilerViewer button dashboard. 
		 * @static
		 * @property CLASS_DASHBOARD
		 * @type string
		 * @public
		 * @default "yui-pv-dashboard"
		 */
		CLASS_DASHBOARD: 'yui-pv-dashboard',

		/**
		 * Classname for the "refresh data" button. 
		 * @static
		 * @property CLASS_REFRESH
		 * @type string
		 * @public
		 * @default "yui-pv-refresh"
		 */
		CLASS_REFRESH: 'yui-pv-refresh',

		/**
		 * Classname for busy indicator in the dashboard. 
		 * @static
		 * @property CLASS_BUSY
		 * @type string
		 * @public
		 * @default "yui-pv-busy"
		 */
		CLASS_BUSY: 'yui-pv-busy',
	
		/**
		 * Classname for element containing the chart and chart
		 * legend elements.
		 * @static
		 * @property CLASS_CHART_CONTAINER
		 * @type string
		 * @public
		 * @default "yui-pv-chartcontainer"
		 */
		CLASS_CHART_CONTAINER: 'yui-pv-chartcontainer',
	
		/**
		 * Classname for element containing the chart.
		 * @static
		 * @property CLASS_CHART
		 * @type string
		 * @public
		 * @default "yui-pv-chart"
		 */
		CLASS_CHART: 'yui-pv-chart',
		
		/**
		 * Classname for element containing the chart's legend. 
		 * @static
		 * @property CLASS_CHART_LEGEND
		 * @type string
		 * @public
		 * @default "yui-pv-chartlegend"
		 */
		CLASS_CHART_LEGEND: 'yui-pv-chartlegend',
		
		/**
		 * Classname for element containing the datatable. 
		 * @static
		 * @property CLASS_TABLE
		 * @type string
		 * @public
		 * @default "yui-pv-table"
		 */
		CLASS_TABLE: 'yui-pv-table',
		
		/**
		 * Strings used in the UI.
		 * @static
		 * @property STRINGS
		 * @object
		 * @public
		 * @default English language strings for UI.
		 */
		STRINGS: {
			title: "YUI Profiler (beta)",
			buttons: {
				viewprofiler: "View Profiler Data",
				hideprofiler: "Hide Profiler Report",
				showchart: "Show Chart",
				hidechart: "Hide Chart",
				refreshdata: "Refresh Data"
			},
			colHeads: {

root/static/yui/profilerviewer/profilerviewer-debug.js  view on Meta::CPAN

	 * @public
     */	
	proto.getBodyEl = function() {
		YAHOO.log("Body element requested via getBodyEl.", "info", "ProfilerViewer");
		return (this._bodyEl) ? Dom.get(this._bodyEl) : false;
	};

	 /**
     * Returns the element containing the console's chart.
     * @method getChartEl
     * @return HTMLElement
	 * @public
     */	
	proto.getChartEl = function() {
		YAHOO.log("Chart element requested via getChartEl.", "info", "ProfilerViewer");
		return (this._chartEl) ? Dom.get(this._chartEl) : false;
	};

	 /**
     * Returns the element containing the console's dataTable.
     * @method getTableEl
     * @return HTMLElement
	 * @public
     */	
	proto.getTableEl = function() {
		YAHOO.log("DataTable element requested via getTableEl.", "info", "ProfilerViewer");
		return (this._tableEl) ? Dom.get(this._tableEl) : false;
	};

	 /**
     * Returns the element containing the console's DataTable
	 * instance.
     * @method getDataTable
     * @return YAHOO.widget.DataTable
	 * @public
     */	
	proto.getDataTable = function() {
		YAHOO.log("DataTable instance requested via getDataTable.", "info", "ProfilerViewer");
		return this._dataTable;
	};

	 /**
     * Returns the element containing the console's Chart instance.
     * @method getChart
     * @return YAHOO.widget.BarChart
	 * @public
     */	
	proto.getChart = function() {
		YAHOO.log("Chart instance requested via getChart.", "info", "ProfilerViewer");
		return this._chart;
	};


    //
    // PRIVATE PROPERTIES
    //
    proto._rendered = false;
	proto._headEl = null;
	proto._bodyEl = null;
	proto._toggleVisibleEl = null;
	proto._busyEl = null;
	proto._busy = false;
	
	proto._tableEl = null;
	proto._dataTable = null;

	proto._chartEl = null;
	proto._chartLegendEl = null;
	proto._chartElHeight = 250;
	proto._chart = null;
	proto._chartInitialized = false;

    //
    // PRIVATE METHODS
    //

	proto._init = function() {
		/**
		 * CUSTOM EVENTS
		 **/
		
		/**
		 * Fired when a data refresh is requested. No arguments are passed
		 * with this event.
		 *
		 * @event refreshDataEvent
		 */
		this.createEvent("dataRefreshEvent");
		
		/**
		 * Fired when the viewer canvas first renders. No arguments are passed
		 * with this event.
		 *
		 * @event renderEvent
		 */
		this.createEvent("renderEvent");

		this.on("dataRefreshEvent", this._refreshDataTable, this, true);
		
		this._initLauncherDOM();
		
		if(this.get("showChart")) {
			this.on("sortedByChange", this._refreshChart);
		}

		YAHOO.log("ProfilerViewer instance initialization complete.", "info", "ProfilerViewer");
	};

	/**
	 * If no element is passed in, create it as the first element
	 * in the document.
	 * @method _createProfilerViewerElement
	 * @return HTMLElement
	 * @private
	 */
	proto._createProfilerViewerElement = function() {
		YAHOO.log("Creating root element...", "info", "ProfilerViewer");

		var el = document.createElement("div");
		document.body.insertBefore(el, document.body.firstChild);
		Dom.addClass(el, this.SKIN_CLASS);
		Dom.addClass(el, PV.CLASS);
		YAHOO.log(el);
		return el;
	};
			
    /**
     * Provides a readable name for the ProfilerViewer instance.
     * @method toString
     * @return String
	 * @private
	 */
    proto.toString = function() {
        return "ProfilerViewer " + (this.get('id') || this.get('tagName'));
    };

    /**
     * Toggles visibility of the viewer canvas.
     * @method _toggleVisible
     * @return void
	 * @private
     */	
	proto._toggleVisible = function() {
		YAHOO.log("Toggling visibility to " + !this.get("visible") + ".", "info", "ProfilerViewer");
		
		var newVis = (this.get("visible")) ? false : true;
		this.set("visible", newVis);
    };

    /**
     * Shows the viewer canvas.
     * @method show
     * @return void
	 * @private
     */	
	 proto._show = function() {
	 	if(!this._busy) {
			this._setBusyState(true);
			if(!this._rendered) {
				var loader = new YAHOO.util.YUILoader();
				if (this.get("base")) {
					loader.base = this.get("base");
				}
				
				var modules = ["datatable"];
				if(this.get("showChart")) {
					modules.push("charts");
				}
				
				loader.insert({ require: modules,
								onSuccess: function() {
									this._render();
								},
								scope: this});
			} else {
				var el = this.get("element");
				Dom.removeClass(el, "yui-pv-minimized");
				this._toggleVisibleEl.innerHTML = PV.STRINGS.buttons.hideprofiler;
				
				//The Flash Charts component can't be set to display:none,
				//and even after positioning it offscreen the screen
				//may fail to repaint in some browsers.  Adding an empty
				//style rule to the console body can help force a repaint:
				Dom.addClass(el, "yui-pv-null");
				Dom.removeClass(el, "yui-pv-null");
				
				//Always refresh data when changing to visible:
				this.refreshData();
			}
		}
    };

    /**
     * Hides the viewer canvas.
     * @method hide
     * @return void
	 * @private
     */	
	proto._hide = function() {
		this._toggleVisibleEl.innerHTML = PV.STRINGS.buttons.viewprofiler;
		Dom.addClass(this.get("element"), "yui-pv-minimized");
    };
	
	/**
	 * Render the viewer canvas
	 * @method _render
	 * @return void
	 * @private
	 */
	proto._render = function() {
		YAHOO.log("Beginning to render ProfilerViewer canvas...", "info", "ProfilerViewer");
		
		Dom.removeClass(this.get("element"), "yui-pv-minimized");
		
		this._initViewerDOM();
		this._initDataTable();
		if(this.get("showChart")) {
			this._initChartDOM();
			this._initChart();
		}
		this._rendered = true;
		this._toggleVisibleEl.innerHTML = PV.STRINGS.buttons.hideprofiler;
		
		this.fireEvent("renderEvent");

		YAHOO.log("ProfilerViewer rendering complete...", "info", "ProfilerViewer");
	};
	
	/**
	 * Set up the DOM structure for the ProfilerViewer launcher.
	 * @method _initLauncherDOM
	 * @private
	 */
	proto._initLauncherDOM = function() {
		YAHOO.log("Creating the launcher...", "info", "ProfilerViewer");
		
		var el = this.get("element");
		Dom.addClass(el, PV.CLASS);
		Dom.addClass(el, "yui-pv-minimized");

		this._headEl = document.createElement("div");
		Dom.addClass(this._headEl, "hd");
		
		var s = PV.STRINGS.buttons;
		var b = (this.get("visible")) ? s.hideprofiler : s.viewprofiler;
		
		this._toggleVisibleEl = this._createButton(b, this._headEl);
		
		this._refreshEl = this._createButton(s.refreshdata, this._headEl);
		Dom.addClass(this._refreshEl, PV.CLASS_REFRESH);
		
		this._busyEl = document.createElement("span");
		this._headEl.appendChild(this._busyEl);

		var title = document.createElement("h4");
		title.innerHTML = PV.STRINGS.title;
		this._headEl.appendChild(title);
		
		el.appendChild(this._headEl);
		
		Event.on(this._toggleVisibleEl, "click", this._toggleVisible, this, true);
		Event.on(this._refreshEl, "click", function() {
			if(!this._busy) {
				this._setBusyState(true);
				this.fireEvent("dataRefreshEvent");
			}
		}, this, true);
	};

	/**
	 * Set up the DOM structure for the ProfilerViewer canvas,
	 * including the holder for the DataTable.
	 * @method _initViewerDOM
	 * @private
	 */
	proto._initViewerDOM = function() {
		YAHOO.log("Creating DOM structure for viewer...", "info", "ProfilerViewer");
		
		var el = this.get("element");
		this._bodyEl = document.createElement("div");
		Dom.addClass(this._bodyEl, "bd");
	 	this._tableEl = document.createElement("div");
		Dom.addClass(this._tableEl, PV.CLASS_TABLE);
		this._bodyEl.appendChild(this._tableEl);
		el.appendChild(this._bodyEl);
	};

	/**
	 * Set up the DOM structure for the ProfilerViewer canvas.
	 * @method _initChartDOM
	 * @private
	 */
	proto._initChartDOM = function() {
		YAHOO.log("Adding DOM structure for chart...", "info", "ProfilerViewer");
		
		this._chartContainer = document.createElement("div");
		Dom.addClass(this._chartContainer, PV.CLASS_CHART_CONTAINER);
		
		var chl = document.createElement("div");
		Dom.addClass(chl, PV.CLASS_CHART_LEGEND);
		
		var chw = document.createElement("div");

		this._chartLegendEl = document.createElement("dl");
		this._chartLegendEl.innerHTML = "<dd>" + PV.STRINGS.initMessage + "</dd>";
		
		this._chartEl = document.createElement("div");
		Dom.addClass(this._chartEl, PV.CLASS_CHART);
		
		var msg = document.createElement("p");
		msg.innerHTML = PV.STRINGS.installFlashMessage;
		this._chartEl.appendChild(msg);
		
		this._chartContainer.appendChild(chl);
		chl.appendChild(chw);
		chw.appendChild(this._chartLegendEl);
		this._chartContainer.appendChild(this._chartEl);
		this._bodyEl.insertBefore(this._chartContainer,this._tableEl);
	};


	/**
	 * Create anchor elements for use as buttons. Args: label
	 * is text to appear on the face of the button, parentEl
	 * is the el to which the anchor will be attached, position
	 * is true for inserting as the first node and false for
	 * inserting as the last node of the parentEl.
	 * @method _createButton
	 * @private
	 */	
	proto._createButton = function(label, parentEl, position) {
		var b = document.createElement("a");
		b.innerHTML = b.title = label;
		if(parentEl) {
			if(!position) {
				parentEl.appendChild(b);
			} else {
				parentEl.insertBefore(b, parentEl.firstChild);	
			}
		}
		return b;
	};
	
	/**
	 * Set's console busy state.
	 * @method _setBusyState
	 * @private
	 **/
	proto._setBusyState = function(b) {
		if(b) {
			Dom.addClass(this._busyEl, PV.CLASS_BUSY);
			this._busy = true;
		} else {
			Dom.removeClass(this._busyEl, PV.CLASS_BUSY);
			this._busy = false;
		}
	};

	/**
	 * Generages a sorting function based on current sortedBy
	 * values.
	 * @method _createProfilerViewerElement
	 * @private
	 **/
	proto._genSortFunction = function(key, dir) {
		var by = key;
		var direction = dir;
		return function(a, b) {
			if (direction == YAHOO.widget.DataTable.CLASS_ASC) {
				return a[by] - b[by];	
			} else {
				return ((a[by] - b[by]) * -1);
			}
		};
	};

	/**
	 * Utility function for array sums.
	 * @method _arraySum
	 * @private
	 **/	
	 var _arraySum = function(arr){
		var ct = 0;
		for(var i = 0; i < arr.length; ct+=arr[i++]){}
		return ct;
	};
	
	/**
	 * Retrieves data from Profiler, filtering and sorting as needed
	 * based on current widget state.  Adds calculated percentage
	 * column and function name to data returned by Profiler.
	 * @method _getProfilerData
	 * @private
	 **/
	proto._getProfilerData = function() {
		YAHOO.log("Profiler data requested from function DataSource.", "info", "ProfilerViewer");
		
		var obj = Profiler.getFullReport();
		var arr = [];
		var totalTime = 0;
		for (name in obj) {
    		if (YAHOO.lang.hasOwnProperty(obj, name)) {
				var r = obj[name];
				var o = {};
				o.fn = name; //add function name to record
				o.points = r.points.slice(); //copy live array
				o.calls = r.calls;
				o.min = r.min;
				o.max = r.max;
				o.avg = r.avg;
				o.total = _arraySum(o.points);
				o.points = r.points;
				var f = this.get("filter");
				if((!f) || (f(o))) {
					arr.push(o);