Adapt Learning Community: Plugin - without registration

Is is possible to use a plugin without the public registry on the heroku? e.g. from a local folder or a private repo? If it is possible then what are the steps to get the plugin into a course (assuming Adapt-CLI not the AF)

Absolutely, you just copy it in manually.

You just have to make sure it goes in the correct folder based on whether it's a:

component
extension
menu
theme

If you have a look at the existing structure within the src folder it should be fairly obvious.

The only other thing you might want to do is update adapt.json but that's by no means essential, I rarely bother.

Show parent | Reply

Thanks, made some progress. Now i am trying to get a Hello World printed on console log, could you tell me what am i doing wrong, this is the code i have for my basic js file:

bower.json has:

"main": "js/ppjplugin.js"

and ppjplugin.js has:

define([

"core/js/adapt",
"core/js/views/componentView",
"core/js/models/componentModel"
], function(Adapt, ComponentView, ComponentModel) {

var MyPluginView = ComponentView.extend({
// implement your component view
initialize: function(){
console.log("Hello world from View Init");
}
});

var MyPluginModel = ComponentModel.extend({
// implement your component model
initialize: function(){
console.log("Hello world from Model Init");
}
});

return Adapt.register("ppjplugin", {
view: MyPluginView,
model: MyPluginModel
});

});

Show parent | Reply

I'm not sure, because you haven't really said what's not working or been clear about what steps you've taken to actually run this or included any information about console errors (if any).

One thing I can say: you're overriding the initialize function of both ComponentView and ComponentModel there, which probably isn't a good idea.

If you want to extend those functions you can do so but you must ensure you include ComponentModel.prototype.initialize.call(this); in your model's initialize function and ComponentView.prototype.initialize.call(this); in your view's initialize function.

But really I would say you shouldn't include an initialize function in your code unless you know you need to.

I would also start with just a view and only add a model if and when you actually need one.

Have you had a look at https://github.com/adaptlearning/adapt-component ? That's probably the best place to start. You can run adapt create component my-component-name if you want the adapt-cli to use this as a template for a new component, equally you can do so manually by copying and changing all the relevant bits.

Show parent | Reply

Thank you for your reply. I do not need to extend initialize actually. Just need a simple plugin which does not necessarily have a visible aspect to it. I will be using this plugin to enable fetching learner-specific json data from the LMS and show it in the placeholders in components. Eg if the text inside a text component has a placeholder [[admin-contact]] then this will be replaced with appropriate value from the json key/value for this specific learner. I would like to add things like learner organization logo in the course, etc.

So as a first step I was just trying to get some sample code going that shows some signs of execution hence the console.log attempt. Next step would be to get learner id from the query string which the LMS will provide in the URL. And with this learner id I will get the json. So on and so forth.

In summary, the code needs to run as soon as the course is launched and on every component it needs to scan and search replace the [[placeholder]] with data retrieved as json call.

I'd love to hear your thoughts on how to go about this. I feel like I'm stuck at getting any code to execute at all. But I'm hoping with this context you may be able to guide me down a more optimized solution.

Thanks

Show parent | Reply

If I'm understanding what you're trying to do (which sounds quite challenging if you've never worked with Adapt before) then you don't want to be building a component - as a component typically ALWAYS has a visible aspect to it. it also won't typically execute as a component unless you include it in components.json

You need to build an extension as that doesn't necessarily need to include a visual aspect and the code in it can be made to execute at pretty much any point, you just need to pick the right event to hook into to have your code execute at the right moment.

it's worth noting that Adapt already includes code to read in the learner/student id. The 'placeholder' info you can see here will get replaced when the course is run from a SCORM LMS with the actual data from the LMS. You can also see here an example of that data being included in JSON via the use of the compile handlebars helper.

hope this helps get you started.

Show parent | Reply

Thank you for the pointers and looks very promising. Two questions:

1- could I extend this placeholder setup to more than the basic ones listed here? I will have a dynamic list of 20 placeholders in the content and will need a way to get the values at run time (Ajax most likely) to present to the learner. Values will vary be learner. So the learner ID suggestion is very helpful

2- extension is what I was trying to get going and need help to get code to execute. The extension sample code I posted, what would I need to do to get the code to run when course load then again at component load I will need to get. Do I need to instantiate or initialize the extension in any particular way? Having Bower main pointing at the js file doesn't seem sufficient

Show parent | Reply

1 - yes you might well be able to. most of the core handlebars templates now have {{import_globals}} in them - this handlebars helper makes all the data that's in Adapt.course._globals available to that template, the {{compile}} helper then allows that data to be added into the output. See assessmentResults.hbs for a good example.

2 - the sample code you posted was for a component not an extension. have a look in src/extensions for other examples of extensions.

Once you've got your head round the concept of extensions (you'll need to look at a few) you just need to pick the right event to hook into to have your extension code execute at the right moment.

Show parent | Reply

I was able to make a lot of progress - extension setup, it pulls data from the Adapt.course._globals using Adapt.course.get("_globals")._learnerInfo.my_variable and the compile helper puts the value in where it is needed. Thrilled to come this far!!!! who says this is challenging :)

Question - my goal is to get data via ajax call so that at runtime {{{compile my_variable}}} can pick it up. Is it possible to set a _globals variable dynamically? or some other creative way to get the data into a placeholder.

thanks

Show parent | Reply

Yes, _globals is just an object so you can add whatever you need to it.

You can test this stuff for yourself quite easily using the browser's console. If you have the adapt-devtools plugin installed you can just do:

var globals = a.course.get('_globals');
globals.hello = "hello world!";

If you don't have devtools plugin installed you'll need to do var a = require('core/js/adapt'); first.

Using the console in this way is a really good technique for having a bit of a poke around in the code I find.

As I mentioned earlier, the trick will be to hook into the right event so that you can execute your extension at the optimal time, load your data and add it into _globals before anything needs to use it. The Adapt.wait API may come in handy here.

Show parent | Reply