To create a landing page in SCA using the script.
Steps:
- Create a new module for the landing page with javascript, template, and Sass files as required. (Same creating the modules)
- In Javascript, add an entry point file and a router file.
- In the below image an example for entry point javascript file.
define(
'StaticPages'
, [
'StaticPages.Router'
]
, function (
Router
)
{
'use strict';
return {
mountToApp: function (application)
{
return new Router({application: application});
}
};
});
4. Add the router file. The landing page route will be added to this file. Javascript View and router details will be added in the file. Add the templates in the definition section. An example code is added below.
define(
'StaticPages.Router'
, [
'online_learning_module.tpl'
, 'Profile.Model'
, 'underscore'
, 'Backbone'
, 'Backbone.CompositeView'
, 'AjaxRequestsKiller'
, 'Utils'
, 'jQuery'
, 'sweetAlert'
, 'Session'
]
, function(
online_learning_module_tpl
, ProfileModel
, _
, Backbone
, BackboneCompositeView
, AjaxRequestsKiller
, Utils
, $
, swal
, Session
)
{
'use strict';
// VIEWS : auto-online-training
var onlinelearningmoduleView = Backbone.View.extend({
title: 'auto-online-training '
, page_header: 'auto-online-training '
, template: online_learning_module_tpl
, attributes: {
'id': 'auto-online-training '
, 'class': 'view online-learning-module static-pages'
}
, events: {
'click [data-action="some-Method"]': 'someMethod'
}
, initialize: function (options)
{
this.application = options.application;
BackboneCompositeView.add(this);
}
, showContent: function (options)
{
var self = this;
this.application.getLayout().showContent(this, options).done(function ()
{
});
}
, getContext: function ()
{
return {
model: { example: 'data'}
}
}
});
//////////////////////////////////////////////////////////////////////
// ROUTER IS RETURNED
return Backbone.Router.extend({
routes: {
'': 'goonlinelearningmoduleView'
}
, initialize: function (options)
{
this.application = options.application;
}
, goonlinelearningmoduleView: function (param)
{
var application = this.application;
var view = new onlinelearningmoduleView({
baseUrl: ''
, application: this.application
});
view.showContent();
}
});
});