WebDev1

Style rules are then injected into the browser at run-time. /lib Any file with the "js" extension placed in this folder is automatically collected into the script block inside the buildset.

After processing, which may involve talking with shared services and/or running business logic, the result is component data that is serialized to JSON and collected into the page model.

Contents 1 Overview 2 Resources 2.1 Partial Scripts 3 Definition 3.1 Configuration 3.2 Runtime Methods 4 Model 5 Extending 6 State 7 Saving Data 7.1 Flags 7.2 Stateless Operation 7.3 Patch vs.

If the developer is using the events configuration object, or using jQuery delegates, then there will be no need to rebind DOM event handlers.

Resources The component view contains Javascript, css, and templates-- which are compiled, minified, and bundled together when the project is built.

These types of errors are returned as a specialized model that contains information such a message and error code-- and if running in debug mode, more low-level details such as a stack trace.

events: { "click button": "dothing" }, dothing: function(e) { //handle the button click here }, exports: { myfunction: function () { //register "myfunction" as a callable method return true; } }, initialize: function () { //do init stuff } }); Configuration These are properties and methods that you define as part of the class definition, and is used to control its behavior. name description Property type

However, some save operations send only a small bit of data, but expect a completely different amount of data or a completely different data structure in return.

The component is a full-fledged Backbone view, so please read the backbone documentation on what functionality is supplied out of the box.

Patch operations allow only a subset of data to be transferred back and forth instead of the entire model as dictated by REST standards.

The server will then push out the missing data as the page model.

This informs the server that the client is not expecting any json payload in the response.

"dothing" }, dothing: function(e) { //handle the button click here }, exports: { myfunction: function () { //register "myfunction" as a callable method return true; } }, initialize: function () { //do init stuff } }); Configuration These are properties and methods that you define as part of the class definition, and is used to control its behavior. name description Property type This name defines the contractual

These types of errors are returned as a specialized model that contains information such a message and error code-- and if running in debug mode, more low-level details such as a stack trace.

Wiki Jump to: navigation, search Part of a series on GDSI Development GDSI Architecture Environment Setup Build Processing Routing Page Controller Razor Module Provider State Management JSON Page Model Client Client Component Component Model Framework Scripts Buildsets DOM Restoration Component Zones Events Middleware Hostweb Route Mapping Templating v d e For the official GDSI development

The decision of how granular to break out the component code is left as a decision to each UI lead developer.

The models from all components are then collected into the page model and written out.

Each view project has the following layout: Gen view final.png

Events Main page: Events Each component is a specialized Backbone view], which automatically support binding jQuery event handlers to DOM elements and wiring up component-specific events on the view using .on() and .trigger().

Wiki Jump to: navigation, search Part of a series on GDSI Development GDSI Architecture Environment Setup Build Processing Routing Page Controller Razor Module Provider State Management JSON Page Model Client Client Component Component Model Framework Scripts Buildsets DOM Restoration Component Zones Events Middleware Hostweb Route Mapping Templating v d e For the official GDSI development

Wiki Jump to: navigation, search Part of a series on GDSI Development GDSI Architecture Environment Setup Build Processing Routing Page Controller Razor Module Provider State Management JSON Page Model Client Client Component Component Model Framework Scripts Buildsets DOM Restoration Component Zones Events Middleware Hostweb Route Mapping Templating v d e For the official GDSI development

Partial Scripts Script partials are code chunks that do not reside in the master script file.

Runtime Methods These methods are packaged with the component and are available to call at run-time.

If the event is interesting, it may be acted on by any one or more observers.

The decision of how granular to break out the component code is left as a decision to each UI lead developer.

These types of errors are returned as a specialized model that contains information such a message and error code-- and if running in debug mode, more low-level details such as a stack trace.

Method onerror Override only if you have special error handing needs for the entire zone Default: If an ajax error occurs in the main model, the entire zone is replaced by the template defined by this.tplerror or the generic "view.error" if not specified.

After the scaffolder runs for a bit, you will eventually get an options dialog to customize the component further.

Example DOM event handling: la.component.extend({ events: { 'click button' : 'dothing', }, dothing: function (e) { //handle button click here } } Public Events Public Events are broadcasted on a special bus that any component may subscribe to.

Gen view complete.png modify files only when this message appears!

Even though the code is downloaded to the browser, the component must still be "required" in for it to be usable. main.js

However, some save operations send only a small bit of data, but expect a completely different amount of data or a completely different data structure in return.

State Main pages: Model State and State Management Each component is given a Backbone model filled with data from the server.

Name Description /templates Any file with the "hbs" extension placed in this folder is automatically pre-compiled into a Handlebars template and then hydrated and registered as a partial at runtime.

Post 8 Events 8.1 Public Events 9 Error Handling 10 Generation Overview When the browser fetches a page, all modules associated with the URL route will wake up on the server and process the request.

However, some save operations send only a small bit of data, but expect a completely different amount of data or a completely different data structure in return.