-
Notifications
You must be signed in to change notification settings - Fork 27
Merlin
Merlin is the custom JS framework built for CBU by TC. Merlin is named for because it is meant to help creating wizards. The idea is to provide the TC application with a Merlin component object that defines the wizard based on a complex configuration object.
The main Merlin file is in static/js/tc.gam.merlin.js.
This section will go through making a Merlin Wizard.
The best way to understand making a Merlin wizard is to read the in-depth example in the code.
- The HTML template can is located at:
static/js/merlin/merlin_example.html - In-depth look at the Merlin basics:
tc.gam.example_widget.js - You can navigate to the example in a browser, when the application is running, at http://localhost:8080/static/js/merlin/merlin_example.html.
The app_page variable stores a feature, a feature is a function that runs an app.components. For example, the following will get a Merlin wizard going. Note that tc.gam.widgets.example_widget is defined in the example files described above.
jQuery(document).ready(function(e) {
// Create object for the page application, which is the container
// for Features. Features are functions that accept the app object.
var app_page = {
data: {},
features: [],
prevent_logging: false
};
// Push a feature. This feature contains an app.component that is a
// new merlin object. This merlin object is defined above.
app_page.features.push(function(app) {
// Add the example component (merlin example widget) here.
app.components.example_component = new tc.merlin(app, tc.gam.widgets.example_widget);
});
// Create app.
tc.app(app_page);
});
There is a fair amount of inline documentation in the code. Please see Documentation
/* Magic!!
__________________
.-' \ _.-''-._ / '-.
.-/\ .'. .'. /\-.
_'/ \.' '. .' './ \'_
:======:======::======:======:
'. '. \ '' / .' .'
'. . \ : : / . .'
'.' \ ' ' / '.'
': \: :/ :'
'. \ / .'
'.\ /.'
'\/'
*/