Skip to content

Commit

Permalink
Work on ext-logger
Browse files Browse the repository at this point in the history
  • Loading branch information
@mar10
mar10 committed Oct 2, 2018
1 parent 96b9566 commit 6164164
Show file tree
Hide file tree
Showing 4 changed files with 74 additions and 45 deletions.
10 changes: 7 additions & 3 deletions demo/sample-ext-logger.html
View file
Expand Up @@ -28,16 +28,20 @@
// Attach the fancytree widget to an existing <div id="tree"> element
// and pass the tree options as an argument to the fancytree() function:
$("#tree").fancytree({
// extensions: ["logger"],
extensions: ["persist", "logger"],
checkbox: true,
selectMode: 3,
source: {url: "ajax-tree-products.json"},
ajax: {debugDelay: 1000},
logger: {
},
ajax: {
// debugDelay: [200, 1000] // don't use this in production code
// traceEvents: true,
traceUnhandledEvents: true,
// // traceHooks: true, // ["treeCreate", "treeInit"],
// timings: true
},
init: function(event, data) {
data.tree.info("Got init");
},
lazyLoad: function(event, data) {
data.result = {url: "ajax-sub2.json"};
Expand Down
15 changes: 8 additions & 7 deletions src/jquery.fancytree.js
View file
Expand Up @@ -5681,7 +5681,7 @@ $.extend($.ui.fancytree,
this.warn("keyEventToString() is deprecated: use eventToString()");
return this.eventToString(event);
},
/** Return a wrapped handler method, that provides `this.super`.
/** Return a wrapped handler method, that provides `this._super`.
*
* @example
// Implement `opts.createNode` event to add the 'draggable' attribute
Expand All @@ -5695,20 +5695,21 @@ $.extend($.ui.fancytree,
* @param {object} instance
* @param {string} methodName
* @param {function} handler
* @param {object} [self] optional context
*/
overrideMethod: function(instance, methodName, handler){
overrideMethod: function(instance, methodName, handler, self){
var prevSuper,
_super = instance[methodName] || $.noop;

// context = context || this;
self = self || this;

instance[methodName] = function() {
try {
prevSuper = this._super;
this._super = _super;
return handler.apply(this, arguments);
prevSuper = self._super;
self._super = _super;
return handler.apply(self, arguments);
} finally {
this._super = prevSuper;
self._super = prevSuper;
}
};
},
Expand Down
86 changes: 53 additions & 33 deletions src/jquery.fancytree.logger.js
View file
Expand Up @@ -35,8 +35,10 @@
*/
var i,
FT = $.ui.fancytree,
PREFIX = "ft-logger: ",
logLine = window.console.log,
HOOK_NAMES = "nodeClick nodeCollapseSiblings".split(" "),
TREE_EVENT_NAMES = "blurTree create init focusTree restore".split(" "),
TREE_EVENT_NAMES = "beforeRestore blurTree create init focusTree restore".split(" "),
NODE_EVENT_NAMES = "activate beforeActivate beforeExpand beforeSelect blur click collapse createNode dblclick deactivate expand enhanceTitle focus keydown keypress lazyLoad loadChildren loadError modifyChild postProcess renderNode renderTitle select".split(" "),
EVENT_NAMES = TREE_EVENT_NAMES.concat(NODE_EVENT_NAMES),
HOOK_NAME_MAP = {},
Expand Down Expand Up @@ -64,49 +66,59 @@ function getBrowserInfo() {

function logEvent(event, data) {
var res,
logName = "event." + event.type,
/* jshint validthis: true */
self = this,
// logName = PREFIX + "event." + event.type,
opts = data.options.logger,
obj = data.node || data.tree;
tree = data.tree,
// widget = data.widget,
obj = data.node || tree,
logName = PREFIX + "event." + event.type + " (" + obj + ")";

if( !opts.traceEvents || (opts.traceEvents !== true && $.inArray(name, opts.traceEvents) < 0) ) {
return;
return self._super.apply(self, arguments);
}
if( opts.timings === true || (opts.timings && $.inArray(name, opts.timings) >= 0 ) ) {
if( self._super && opts.timings === true || (opts.timings && $.inArray(name, opts.timings) >= 0 ) ) {
// if( name === "nodeRender" ) { logName += obj; } // allow timing for recursive calls
logName += " (" + obj + ")";
// logName += " (" + obj + ")";
window.console.time(logName);
res = self._super.apply(this, arguments);
res = self._super.apply(self, arguments);
window.console.timeEnd(logName);
} else {
obj.info(logName, data);
// obj.info(logName, data);
logLine(logName, event, data);
res = self._super.apply(self, arguments);
}
return res;
}

function logHook(name, self, args, extra) {
var res,
logName = "hook." + name,
ctx = args[0],
opts = ctx.options.logger,
obj = ctx.node || ctx.tree;
obj = ctx.node || ctx.tree,
logName = PREFIX + "hook." + name + " (" + obj + ")";

if( !opts.traceHooks || (opts.traceHooks !== true && $.inArray(name, opts.traceHooks) < 0) ) {
return self._superApply.call(self, args);
}
if( opts.timings === true || (opts.timings && $.inArray(name, opts.timings) >= 0 ) ) {
// if( name === "nodeRender" ) { logName += obj; } // allow timing for recursive calls
logName += " (" + obj + ")";
// logName += " (" + obj + ")";
window.console.time(logName);
res = self._superApply.call(self, args);
window.console.timeEnd(logName);
return res;
} else {
if( extra ) {
obj.info(logName, extra, ctx);
// obj.info(logName, extra, ctx);
logLine(logName, extra, ctx);
} else {
obj.info(logName, ctx);
// obj.info(logName, ctx);
logLine(logName, ctx);
}
return self._superApply.call(self, args);
res = self._superApply.call(self, args);
}
return res;
}


Expand All @@ -120,35 +132,40 @@ $.ui.fancytree.registerExtension({
options: {
logTarget: null, // optional redirect logging to this <div> tag
traceEvents: true, // `true`or list of hook names
traceUnhandledEvents: false,
traceHooks: false, // `true`or list of event names
timings: false // `true`or list of event names
},
// Overide virtual methods for this extension.
// `this` : is this Fancytree object
// `this._super`: the virtual function that was overridden (member of prev. extension or Fancytree)
treeInit: function(ctx) {
treeCreate: function(ctx) {
var tree = ctx.tree,
opts = ctx.options;

if( this.options.extensions[this.options.extensions.length-1] !== "logger" ) {
throw "Fancytree 'logger' extension must be listed as last entry.";
}
ctx.tree.warn("Fancytree logger extension is enabled (this may be slow).", ctx.options.logger);
tree.warn("Fancytree logger extension is enabled (this may be slow).", opts.logger);

console.info("Fancytree v" + $.ui.fancytree.version + ", buildType='" + $.ui.fancytree.buildType + "'");
console.info("jQuery UI " + jQuery.ui.version + " (uiBackCompat=" + $.uiBackCompat + ")");
console.info("jQuery " + jQuery.fn.jquery);
console.info("Browser: " + getBrowserInfo());
tree.debug("Fancytree v" + $.ui.fancytree.version + ", buildType='" + $.ui.fancytree.buildType + "'");
tree.debug("jQuery UI " + jQuery.ui.version + " (uiBackCompat=" + $.uiBackCompat + ")");
tree.debug("jQuery " + jQuery.fn.jquery);
tree.debug("Browser: " + getBrowserInfo());

function _log(event, data) {
logLine(PREFIX + "event." + event.type + " (unhandled)", event, data);
}
$.each(EVENT_NAMES, function(i, name){
// ctx.tree.overrideMethod(ctx.tree, name, logEvent);
$.ui.fancytree.overrideMethod(ctx.options, name, logEvent);
// $.ui.fancytree.overrideMethod(ctx.options, "createNode", function(event, data) {
// // Default processing if any
// this._super.apply(this, arguments);
// // Add 'draggable' attribute
// data.node.span.draggable = true;
// });
if( typeof opts[name] === "function" ) {
// tree.info(PREFIX + "override '" + name + "' event");
$.ui.fancytree.overrideMethod(opts, name, logEvent, ctx.widget);
} else if ( opts.logger.traceUnhandledEvents ) {
opts[name] = _log;
}
});

return logHook("treeInit", this, arguments);
return logHook("treeCreate", this, arguments);
},
nodeClick: function(ctx) {
return logHook("nodeClick", this, arguments, FT.eventToString(ctx.originalEvent));
Expand Down Expand Up @@ -204,12 +221,15 @@ $.ui.fancytree.registerExtension({
treeClear: function(ctx) {
return logHook("treeClear", this, arguments);
},
treeCreate: function(ctx) {
return logHook("treeCreate", this, arguments);
},
// treeCreate: function(ctx) {
// return logHook("treeCreate", this, arguments);
// },
treeDestroy: function(ctx) {
return logHook("treeDestroy", this, arguments);
},
treeInit: function(ctx) {
return logHook("treeInit", this, arguments);
},
treeLoad: function(ctx, source) {
return logHook("treeLoad", this, arguments);
},
Expand Down
8 changes: 6 additions & 2 deletions src/jsdoc-globals.js
View file
Expand Up @@ -262,7 +262,10 @@ var FancytreeOptions = {};
* @property {function} click `data.node` was clicked. `data.targetType` contains the region ("checkbox", "expander", "icon", "prefix", "title"). Return `false` to prevent default processing, i.e. activating, expanding, selecting, etc.
* @property {function} clickPaging `data.node` is a 'paging' status node and was activated. Use data.node.replaceWith() to load additional nodes.
* @property {function} collapse `data.node` was collapsed
* @property {function} create Widget was created (called only once, even if re-initialized).
* @property {function} create Widget was created.<br>
* Source data may *not* be loaded or rendered yet:
* see also the `init` event, which is fired later.<br>
* Note: called only once, but not when re-initialized.<br>
* @property {function} createNode Allow tweaking and binding, after node was created for the first time (NOTE: this event is only available as callback, but not for bind())
* @property {function} dblclick `data.node` was double-clicked. `data.targetType` contains the region ("checkbox", "expander", "icon", "prefix", "title"). Return `false` to prevent default processing, i.e. expanding, etc.
* @property {function} deactivate `data.node` was deactivated
Expand All @@ -275,7 +278,8 @@ var FancytreeOptions = {};
* @property {function} focusTree `data.tree` received keyboard focus
* @property {function} <del>iconClass</del> @deprecated use tree option `icon` instead.
* @property {function} init Widget was (re-)initialized.<br>
* Note: if ext-persist is used, see also the `restore` event.
* The tree widget was initialized, source data was loaded, and visible nodes are rendered.<br>
* Note: if ext-persist is used, see also the `restore` event, which is fired later.
* @property {function} keydown `data.node` received key. `event.which` contains the key. Return `false` to prevent default processing, i.e. navigation. Call `data.result = "preventNav";` to prevent navigation but still allow default handling inside embedded input controls.
* @property {function} keypress (currently unused)
* @property {function} lazyLoad `data.node` is a lazy node that is expanded for the first time. The new child data must be returned in the `data.result` property (see `source` option for available formats).
Expand Down

0 comments on commit 6164164

Please sign in to comment.