How to add custom layout in cytoscape.js 2.6 version - cytoscape.js

Question

The API documentation (http://js.cytoscape.org/#extensions/api) says that cytoscape( type, name, extension ) whould register an extension.
It worked in v2.4 but doesn't work anymore in v2.6.
What is the right way to do it now ?
EDIT:
Here is what I do
;(function($$){ 'use strict';
var defaults = {
fit: true, // whether to fit the viewport to the graph
padding: 30, // the padding on fit
startAngle: 3/2 * Math.PI, // the position of the first node
counterclockwise: false, // whether the layout should go counterclockwise/anticlockwise (true) or clockwise (false)
minNodeSpacing: 10, // min spacing between outside of nodes (used for radius adjustment)
boundingBox: undefined, // constrain layout bounds; { x1, y1, x2, y2 } or { x1, y1, w, h }
avoidOverlap: true, // prevents node overlap, may overflow boundingBox if not enough space
height: undefined, // height of layout area (overrides container height)
width: undefined, // width of layout area (overrides container width)
concentric: function(node){ // returns numeric value for each node, placing higher nodes in levels towards the centre
return node.degree();
},
levelWidth: function(nodes){ // the variation of concentric values in each level
return nodes.maxDegree() / 4;
},
animate: false, // whether to transition the node positions
animationDuration: 500, // duration of animation in ms if enabled
ready: undefined, // callback on layoutready
stop: undefined // callback on layoutstop
};
function ConcentricLayout( options ){
console.log('INIT');
this.options = $$.util.extend({}, defaults, options);
}
ConcentricLayout.prototype.run = function(){
console.log('RUNNING');
// Run code
};
$$('layout', 'customconcentric', ConcentricLayout);
})( cytoscape );
And how I use it
var cy = cytoscape({
container: document.getElementById('cy'),
boxSelectionEnabled: false,
autounselectify: true,
elements: p,
layout: {
name: 'null',
stop: function() {
cy.elements('node.group').forEach(function( ele ){
var eles = ele.children();
eles.layout({
name: 'customgrid',
fit: false,
avoidOverlapPadding: 0,
columns: 2
});
});
cy.elements('node.machine').forEach(function( ele ){
var elesleft = ele.children('node.mod');
var elesright = ele.children('node.group');
var descendants = elesright.descendants();
if (elesleft.length > 0) {
var relpos = getRelativePositions(descendants);
elesright.forEach(function( ele ){
ele.relativePosition('x', 200);
});
setRelativePositions(relpos, cy);
elesleft.layout({
name: 'customgrid',
fit: false,
avoidOverlapPadding: 0,
columns: 1
});
}
});
cy.elements('node.machine, node.env').layout({
name: 'customconcentric',
fit: true
});
}
}
});
With 2.4.9 I see this in my browser's javascript console.
cytoscape.layout.custom.js:41 INIT
cytoscape.layout.custom.js:46 RUNNING
With 2.6.2, nothing happens.

Answer 1

The registration API is fine. You're relying on a private object that is not accessible:
this.options = $$.util.extend({}, defaults, options);
Only reference public APIs in the docs if you want your code to be compatible with newer versions: http://js.cytoscape.org
Use a proper debugger, like in Chrome. Your debugger should show you an error message when you reference non-existent objects or otherwise cause exceptions.