Blame | Last modification | View Log | RSS feed
/*** Debug Toolbar Javascript.** Creates the DEBUGKIT namespace and provides methods for extending* and enhancing the Html toolbar. Includes library agnostic Event, Element,* Cookie and Request wrappers.*** CakePHP(tm) : Rapid Development Framework (http://cakephp.org)* Copyright (c) Cake Software Foundation, Inc. (http://cakefoundation.org)** Licensed under The MIT License* Redistributions of files must retain the above copyright notice.** @copyright Copyright (c) Cake Software Foundation, Inc. (http://cakefoundation.org)* @link http://cakephp.org CakePHP(tm) Project* @since DebugKit 0.1* @license http://www.opensource.org/licenses/mit-license.php MIT License*//* jshint jquery: true */var DEBUGKIT = function () {var undef;return {module: function (newmodule) {if (this[newmodule] === undef) {this[newmodule] = {};return this[newmodule];}return this[newmodule];}};}();(function () {function versionGTE(a, b) {var len = Math.min(a.length, b.length);for (var i = 0; i < len; i++) {a[i] = parseInt(a[i], 10);b[i] = parseInt(b[i], 10);if (a[i] > b[i]) {return true;}if (a[i] < b[i]) {return false;}}return true;}function versionWithin(version, min, max) {version = version.split('.');min = min.split('.');max = max.split('.');return versionGTE(version, min) && versionGTE(max, version);}// Look for existing jQuery that matches the requirements.if (window.jQuery && versionWithin(jQuery.fn.jquery, "1.8", "2.1")) {DEBUGKIT.$ = window.jQuery;} else {// sync load the file. Using document.write() does not block// in recent versions of chrome.var req = new XMLHttpRequest();req.onload = function () {eval(this.responseText);// Restore both $ and jQuery to the original values.DEBUGKIT.$ = jQuery.noConflict(true);};req.open('get', window.DEBUGKIT_JQUERY_URL, false);req.send();}})();DEBUGKIT.loader = function () {return {// List of methods to run on startup._startup: [],// Register a new method to be run on dom ready.register: function (method) {this._startup.push(method);},init: function () {for (var i = 0, callback; callback = this._startup[i]; i++) {callback.init();}}};}();DEBUGKIT.module('sqlLog');DEBUGKIT.sqlLog = function () {var $ = DEBUGKIT.$;return {init : function () {var sqlPanel = $('#sql_log-tab');var buttons = sqlPanel.find('input');// Button handling code for explain links.// Performs XHR request to get explain query.var handleButton = function (event) {event.preventDefault();var form = $(this.form),data = form.serialize(),dbName = form.find('input[name*=ds]').val() || 'default';var fetch = $.ajax({url: this.form.action,data: data,type: 'POST',success : function (response) {$('#sql-log-explain-' + dbName).html(response);},error : function () {alert('Could not fetch EXPLAIN for query.');}});};buttons.filter('.sql-explain-link').on('click', handleButton);}};}();DEBUGKIT.loader.register(DEBUGKIT.sqlLog);//// NOTE DEBUGKIT.Util.Element is Deprecated.//// Util module and Element utility class.DEBUGKIT.module('Util');DEBUGKIT.Util.Element = {// Test if an element is a name node.nodeName: function (element, name) {return element.nodeName && element.nodeName.toLowerCase() === name.toLowerCase();},// Return a boolean if the element has the classnamehasClass: function (element, className) {if (!element.className) {return false;}return element.className.indexOf(className) > -1;},addClass: function (element, className) {if (!element.className) {element.className = className;return;}element.className = element.className.replace(/^(.*)$/, '$1 ' + className);},removeClass: function (element, className) {if (DEBUGKIT.Util.isArray(element)) {DEBUGKIT.Util.Collection.apply(element, function (element) {DEBUGKIT.Util.Element.removeClass(element, className);});}if (!element.className) {return false;}element.className = element.className.replace(new RegExp(' ?(' + className + ') ?'), '');},swapClass: function (element, removeClass, addClass) {if (!element.className) {return false;}element.className = element.className.replace(removeClass, addClass);},show: function (element) {element.style.display = 'block';},hide: function (element) {element.style.display = 'none';},// Go between hide() and show() depending on element.style.displaytoggle: function (element) {if (element.style.display === 'none') {this.show(element);return;}this.hide(element);},_walk: function (element, walk) {var sibling = element[walk];while (true) {if (sibling.nodeType == 1) {break;}sibling = sibling[walk];}return sibling;},getNext: function (element) {return this._walk(element, 'nextSibling');},getPrevious: function (element) {return this._walk(element, 'previousSibling');},// Get or set an element's height, omit value to get, add value (integer) to set.height: function (element, value) {// Get valueif (value === undefined) {return parseInt(this.getStyle(element, 'height'), 10);}element.style.height = value + 'px';},// Gets the style in css format for propertygetStyle: function (element, property) {if (element.currentStyle) {property = property.replace(/-[a-z]/g, function (match) {return match.charAt(1).toUpperCase();});return element.currentStyle[property];}if (window.getComputedStyle) {return document.defaultView.getComputedStyle(element, null).getPropertyValue(property);}}};//// NOTE DEBUGKIT.Util.Collection is Deprecated.//DEBUGKIT.Util.Collection = {/*** Apply the passed function to each item in the collection.* The current element in the collection will be `this` in the callback* The callback is also passed the element and the index as arguments.* Optionally you can supply a binding parameter to change `this` in the callback.*/apply: function (collection, callback, binding) {var name, thisVar, i = 0, len = collection.length;if (len === undefined) {for (name in collection) {thisVar = (binding === undefined) ? collection[name] : binding;callback.apply(thisVar, [collection[name], name]);}} else {for (; i < len; i++) {thisVar = (binding === undefined) ? collection[i] : binding;callback.apply(thisVar, [collection[i], i]);}}}};//// NOTE DEBUGKIT.Util.Event is Deprecated.//// Event bindingDEBUGKIT.Util.Event = function () {var _listeners = {},_eventId = 0;var preventDefault = function () {this.returnValue = false;};var stopPropagation = function () {this.cancelBubble = true;};// Fixes IE's broken event object, adds in common methods + properties.var fixEvent = function (event) {if (!event.preventDefault) {event.preventDefault = preventDefault;}if (!event.stopPropagation) {event.stopPropagation = stopPropagation;}if (!event.target) {event.target = event.srcElement || document;}if (event.pageX === null && event.clientX !== null) {var doc = document.body;event.pageX = event.clientX + (doc.scrollLeft || 0) - (doc.clientLeft || 0);event.pageY = event.clientY + (doc.scrollTop || 0) - (doc.clientTop || 0);}return event;};return {// Bind an event listener of type to element, handler is your method.addEvent: function (element, type, handler, capture) {capture = (capture === undefined) ? false : capture;var callback = function (event) {event = fixEvent(event || window.event);handler.apply(element, [event]);};if (element.addEventListener) {element.addEventListener(type, callback, capture);} else if (element.attachEvent) {type = 'on' + type;element.attachEvent(type, callback);} else {type = 'on' + type;element[type] = callback;}_listeners[++_eventId] = {element: element, type: type, handler: callback};},// Destroy an event listener. requires the exact same function as was used for attaching// the event.removeEvent: function (element, type, handler) {if (element.removeEventListener) {element.removeEventListener(type, handler, false);} else if (element.detachEvent) {type = 'on' + type;element.detachEvent(type, handler);} else {type = 'on' + type;element[type] = null;}},// Bind an event to the DOMContentLoaded or other similar event.domready: function (callback) {if (document.addEventListener) {return document.addEventListener('DOMContentLoaded', callback, false);}if (document.all && !window.opera) {// Define a "blank" external JavaScript tagdocument.write('<script type="text/javascript" id="__domreadywatcher" defer="defer" src="javascript:void(0)"><\/script>');var contentloadtag = document.getElementById('__domreadywatcher');contentloadtag.onreadystatechange = function () {if (this.readyState === 'complete') {callback();}};contentloadtag = null;return;}if (/Webkit/i.test(navigator.userAgent)) {var _timer = setInterval(function () {if (/loaded|complete/.test(document.readyState)) {clearInterval(_timer);callback();}}, 10);}},// Unload all the events attached by DebugKit. Fix any memory leaks.unload: function () {var listener;for (var i in _listeners) {listener = _listeners[i];try {this.removeEvent(listener.element, listener.type, listener.handler);} catch (e) {}delete _listeners[i];}delete _listeners;}};}();// Cookie utilityDEBUGKIT.Util.Cookie = function () {var cookieLife = 60;// Public methodsreturn {/*** Write to cookie.** @param [string] name Name of cookie to write.* @param [mixed] value Value to write to cookie.*/write: function (name, value) {var date = new Date();date.setTime(date.getTime() + (cookieLife * 24 * 60 * 60 * 1000));var expires = '; expires=' + date.toGMTString();document.cookie = name + '=' + value + expires + '; path=/';return true;},/*** Read from the cookie.** @param [string] name Name of cookie to read.*/read: function (name) {name = name + '=';var cookieJar = document.cookie.split(';');var cookieJarLength = cookieJar.length;for (var i = 0; i < cookieJarLength; i++) {var chips = cookieJar[i];// Trim leading spaceswhile (chips.charAt(0) === ' ') {chips = chips.substring(1, chips.length);}if (chips.indexOf(name) === 0) {return chips.substring(name.length, chips.length);}}return false;},/*** Delete a cookie by name.** @param [string] name of cookie to delete.*/del: function (name) {var date = new Date();date.setFullYear(2000, 0, 1);var expires = ' ; expires=' + date.toGMTString();document.cookie = name + '=' + expires + '; path=/';}};}();//// NOTE DEBUGKIT.Util.merge is Deprecated.///*** Object merge takes any number of arguments and glues them together.** @param [Object] one first object* @return object*/DEBUGKIT.Util.merge = function () {var out = {};var argumentsLength = arguments.length;for (var i = 0; i < argumentsLength; i++) {var current = arguments[i];for (var prop in current) {if (current[prop] !== undefined) {out[prop] = current[prop];}}}return out;};//// NOTE DEBUGKIT.Util.isArray is Deprecated.///*** Check if the given object is an array.*/DEBUGKIT.Util.isArray = function (test) {return Object.prototype.toString.call(test) === '[object Array]';};//// NOTE DEBUGKIT.Util.Request is Deprecated.//// Simple wrapper for XmlHttpRequest objects.DEBUGKIT.Util.Request = function (options) {var _defaults = {onComplete : function () {},onRequest : function () {},onFail : function () {},method : 'GET',async : true,headers : {'X-Requested-With': 'XMLHttpRequest','Accept': 'text/javascript, text/html, application/xml, text/xml, */*'}};var self = this;this.options = DEBUGKIT.Util.merge(_defaults, options);this.options.method = this.options.method.toUpperCase();var ajax = this.createObj();this.transport = ajax;// Event assignmentthis.onComplete = this.options.onComplete;this.onRequest = this.options.onRequest;this.onFail = this.options.onFail;this.send = function (url, data) {if (this.options.method === 'GET' && data) {url = url + ((url.charAt(url.length - 1) === '?') ? '&' : '?') + data; //check for ? at the end of the stringdata = null;}// Open connectionthis.transport.open(this.options.method, url, this.options.async);// Set statechange and pass the active XHR object to it. From here it handles all status changes.this.transport.onreadystatechange = function () {self.onReadyStateChange.apply(self, arguments);};for (var key in this.options.headers) {this.transport.setRequestHeader(key, this.options.headers[key]);}if (typeof data === 'object') {data = this.serialize(data);}if (data) {this.transport.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');}this.onRequest();this.transport.send(data);};};DEBUGKIT.Util.Request.prototype.onReadyStateChange = function () {if (this.transport.readyState !== 4) {return;}if (this.transport.status === 200 || this.transport.status > 300 && this.transport.status < 400) {this.response = {xml: this.transport.responseXML,text: this.transport.responseText};if (typeof this.onComplete === 'function') {this.onComplete.apply(this, [this, this.response]);} else {return this.response;}} else if (this.transport.status > 400) {if (typeof this.onFail === 'function') {this.onFail.apply(this, []);} else {console.error('Request failed');}}};/*** Creates cross-broswer XHR object used for requests.* Tries using the standard XmlHttpRequest, then IE's wacky ActiveX Objects.*/DEBUGKIT.Util.Request.prototype.createObj = function () {var request = null;try {request = new XMLHttpRequest();} catch (MS) {try {request = new ActiveXObject('Msxml2.XMLHTTP');} catch (old_MS) {try {request = new ActiveXObject('Microsoft.XMLHTTP');} catch (failure) {request = null;}}}return request;};/*** Serializes an object literal into a querystring.*/DEBUGKIT.Util.Request.prototype.serialize = function (data) {var out = '';for (var name in data) {if (data.hasOwnProperty(name)) {out += name + '=' + data[name] + '&';}}return out.substring(0, out.length - 1);};// Basic toolbar module.DEBUGKIT.toolbar = function () {// Shortcutsvar Cookie = DEBUGKIT.Util.Cookie,$ = DEBUGKIT.$,toolbarHidden = false;return {elements: {},panels: {},init: function () {var i, element, lists, index, _this = this;this.elements.toolbar = $('#debug-kit-toolbar');if (this.elements.toolbar.length === 0) {throw new Error('Toolbar not found, make sure you loaded it.');}this.elements.panel = $('#panel-tabs');this.elements.panel.find('.panel-tab').each(function (i, panel) {_this.addPanel(panel);});lists = this.elements.toolbar.find('.depth-0');this.makeNeatArray(lists);this.deactivatePanel(true);},// Add a panel to the toolbaraddPanel: function (tab) {var button, content, _this = this;var panel = {id : false,element : tab,button : undefined,content : undefined,active : false};tab = $(tab);button = tab.children('a');panel.id = button.attr('href').replace(/^#/, '');panel.button = button;panel.content = tab.find('.panel-content');if (!panel.id || panel.content.length === 0) {return false;}this.makePanelDraggable(panel);this.makePanelMinMax(panel);button.on('click', function (event) {event.preventDefault();_this.togglePanel(panel.id);});this.panels[panel.id] = panel;return panel.id;},// Find the handle element and make the panel drag resizable.makePanelDraggable: function (panel) {// Create a variable in the enclosing scope, for scope tricks.var currentElement = null;// Use the elements startHeight stored Event.pageY and current Event.pageY to// resize the panel.var mouseMoveHandler = function (event) {event.preventDefault();if (!currentElement) {return;}var newHeight = currentElement.data('startHeight') + (event.pageY - currentElement.data('startY'));currentElement.parent().height(newHeight);};// Handle the mouseup event, remove the other listeners so the panel// doesn't continue to resize.var mouseUpHandler = function (event) {currentElement = null;$(document).off('mousemove', mouseMoveHandler).off('mouseup', mouseUpHandler);};var mouseDownHandler = function (event) {event.preventDefault();currentElement = $(this);currentElement.data('startY', event.pageY);currentElement.data('startHeight', currentElement.parent().height());// Attach to document so mouse doesn't have to stay precisely on the 'handle'.$(document).on('mousemove', mouseMoveHandler).on('mouseup', mouseUpHandler);};panel.content.find('.panel-resize-handle').on('mousedown', mouseDownHandler);},// Make the maximize button work on the panels.makePanelMinMax: function (panel) {var _oldHeight;var maximize = function () {if (!_oldHeight) {_oldHeight = this.parentNode.offsetHeight;}var windowHeight = window.innerHeight;var panelHeight = windowHeight - this.parentNode.offsetTop;$(this.parentNode).height(panelHeight);$(this).text('-');};var minimize = function () {$(this.parentNode).height(_oldHeight);$(this).text('+');_oldHeight = null;};var state = 1;var toggle = function (event) {event.preventDefault();if (state === 1) {maximize.call(this);state = 0;} else {state = 1;minimize.call(this);}};panel.content.find('.panel-toggle').on('click', toggle);},// Toggle a paneltogglePanel: function (id) {if (this.panels[id] && this.panels[id].active) {this.deactivatePanel(true);} else {this.deactivatePanel(true);this.activatePanel(id);}},// Make a panel active.activatePanel: function (id, unique) {if (this.panels[id] !== undefined && !this.panels[id].active) {var panel = this.panels[id];if (panel.content.length > 0) {panel.content.css('display', 'block');}var contentHeight = panel.content.find('.panel-content-data').height() + 70;if (contentHeight <= (window.innerHeight / 2)) {panel.content.height(contentHeight);}panel.button.addClass('active');panel.active = true;return true;}return false;},// Deactivate a panel. use true to hide all panels.deactivatePanel: function (id) {if (id === true) {for (var i in this.panels) {this.deactivatePanel(i);}return true;}if (this.panels[id] !== undefined) {var panel = this.panels[id];if (panel.content !== undefined) {panel.content.hide();}panel.button.removeClass('active');panel.active = false;return true;}return false;},// Bind events for all the collapsible arrays.makeNeatArray: function (lists) {lists.find('ul').hide().parent().addClass('expandable collapsed');lists.on('click', 'li', function (event) {event.stopPropagation();$(this).children('ul').toggle().toggleClass('expanded collapsed');});}};}();DEBUGKIT.loader.register(DEBUGKIT.toolbar);DEBUGKIT.module('historyPanel');DEBUGKIT.historyPanel = function () {var toolbar = DEBUGKIT.toolbar,$ = DEBUGKIT.$,historyLinks;// Private methods to handle JSON response and insertion of// new content.var switchHistory = function (response) {historyLinks.removeClass('loading');$.each(toolbar.panels, function (id, panel) {if (panel.content === undefined || response[id] === undefined) {return;}var regionDiv = panel.content.find('.panel-resize-region');if (!regionDiv.length) {return;}var regionDivs = regionDiv.children();regionDivs.filter('div').hide();regionDivs.filter('.panel-history').each(function (i, panelContent) {var panelId = panelContent.id.replace('-history', '');if (response[panelId]) {panelContent = $(panelContent);panelContent.html(response[panelId]);var lists = panelContent.find('.depth-0');toolbar.makeNeatArray(lists);}panelContent.show();});});};// Private method to handle restoration to current request.var restoreCurrentState = function () {var id, i, panelContent, tag;historyLinks.removeClass('loading');$.each(toolbar.panels, function (panel, id) {if (panel.content === undefined) {return;}var regionDiv = panel.content.find('.panel-resize-region');if (!regionDiv.length) {return;}var regionDivs = regionDiv.children();regionDivs.filter('div').show().end().filter('.panel-history').hide();});};function handleHistoryLink(event) {event.preventDefault();historyLinks.removeClass('active');$(this).addClass('active loading');if (this.id === 'history-restore-current') {restoreCurrentState();return false;}var xhr = $.ajax({url: this.href,type: 'GET',dataType: 'json'});xhr.success(switchHistory).fail(function () {alert('History retrieval failed');});}return {init : function () {if (toolbar.panels.history === undefined) {return;}historyLinks = toolbar.panels.history.content.find('.history-link');historyLinks.on('click', handleHistoryLink);}};}();DEBUGKIT.loader.register(DEBUGKIT.historyPanel);//Add events + behaviors for toolbar collapser.DEBUGKIT.toolbarToggle = function () {var toolbar = DEBUGKIT.toolbar,$ = DEBUGKIT.$,Cookie = DEBUGKIT.Util.Cookie,toolbarHidden = false;return {init: function () {var button = $('#hide-toolbar'),self = this;button.on('click', function (event) {event.preventDefault();self.toggleToolbar();});var toolbarState = Cookie.read('toolbarDisplay');if (toolbarState !== 'show') {toolbarHidden = false;this.toggleToolbar();}},toggleToolbar: function () {var display = toolbarHidden ? 'show' : 'hide';$.each(toolbar.panels, function (i, panel) {$(panel.element)[display]();Cookie.write('toolbarDisplay', display);});toolbarHidden = !toolbarHidden;if (toolbarHidden) {$('#debug-kit-toolbar').addClass('minimized');} else {$('#debug-kit-toolbar').removeClass('minimized');}return false;}};}();DEBUGKIT.loader.register(DEBUGKIT.toolbarToggle);DEBUGKIT.$(document).ready(function () {DEBUGKIT.loader.init();});