SystemJS / jspm course components that might need updates

System.tap.js

var normalize = System.normalize;
System.normalize = function (name, parentName, parentAddress) {
  console.log("normalize: " + JSON.stringify({
      name: name,
      parentName: parentName,
      parentAddress: parentAddress
    }));
  return normalize.call(this, name, parentName, parentAddress);
};

var systemLocate = System.locate;
System.locate = function (load) {
  console.log("locating: " + JSON.stringify(load));
  return systemLocate.call(this, load);
};

var systemFetch = System.fetch;
System.fetch = function (load) {
  console.log("fetching: " + JSON.stringify(load));
  return systemFetch.call(this, load);
};

var systemTranslate = System.translate;
System.translate = function (load) {
  console.log("translating: " + JSON.stringify(load));
  return systemTranslate.call(this, load);
};

var systemInstantiate = System.instantiate;
System.instantiate = function (load) {
  console.log("before instantiate: " + JSON.stringify(load));
  return systemInstantiate.call(this, load);
};

System.yuml.js

System.trace = true;

window.showModuleRelationships = function () {
  var modules = Object.keys(System.loads)
    .map(function (moduleName) {
      return System.loads[moduleName];
    });

  function displayName(module) {
    return module
      .replace("http://127.0.0.1:8080/app/", "");
  }

  var moduleDefinitions = modules.map(function (module) {
    var name = displayName(module.name);
    return "[" + name + "]";
  });

  var dependencyDefinitions = [];

  modules
    .filter(function (module) {
      return module.deps.length > 0;
    })
    .forEach(function (module) {
      var name = displayName(module.name);

      var dependencies = module.deps
        .map(displayName)
        .map(function (dependencyName) {
          return "[" + name + "]->[" + dependencyName + "]"
        });

      dependencyDefinitions = dependencyDefinitions.concat(dependencies);
    });

  var definitions = moduleDefinitions.concat(dependencyDefinitions);

  window.open("http://yuml.me/diagram/plain/class/" + definitions);

};

@g0t4 Do you have the final version of this you used?

Thanks you so much @g0t4 for your Pluralsight course on Modern, Modular JavaScript with SystemJS and jspm.

Instead of having a fixed replacement of http://127.0.0.1:8080/app/, I suggest to use this approach:

function displayName(module) {
  var begin = module.lastIndexOf("/") + 1;
  var fileName = module.substr(begin);
  var name = (fileName) ? fileName : module;
  var matchExtension = /(.+?)(?:\.[^\.]*$|$)/;
  return name.match(matchExtension)[1];
}

It will just show the pure filename of a module (without a path or extension).

For me it turned:

Into: