Benefiting from Kinetic Bundles

Ben ChristensonKinetic Data

22

About Me

Ben Christenson Employee at Kinetic Data for 12 years

and a member of the Product Development team for the past 6 years.

Co-developer of the Kinetic Bundles strategy and implementation.

33

What is a Kinetic Bundle?

Evolution of our theming strategy

44

How did Bundles come to be?

Evolution of themes Way to apply branding to Kinetic forms

Required to Simplify initial web presence implementation

Share work

Implement more complex interfaces

55

Disclaimer

Kinetic Data focuses on the most common tasks Implementing a theme typically occurs once

Developing or configuring a Bundle is simple, but… Requires familiarity with HTML/CSS/Javascript

May require familiarity with Java

66

Request Bundle - Klean

The first available Kinetic Bundle is named “Klean” Bare-bones sample

Heavily documented

Starting point for bottom-up development

NOT a drop in solution

Being used by professional services

77

Klean: Base Package

The base package is responsible for rendering Kinetic form content

88

Kinetic Request Primer

Kinetic Request is a Java Web Application Accessed from a Web Browser

Kinetic Request forms apply a Theme Specify a JSP to use for rendering the HTML

Are styled by CSS

Leverage Javascript for dynamic interaction

99

Deploying a Bundle

Download the bundle Copy the contents Configure the display page Open the form

1010

What is a Bundle, technically?

Self contained directory Stored within the /kinetic/themes directory

Includes four component subdirectories The common root package. The core root package. A collection of helpful libraries. A collection of additional packages.

Key Concept: Packages

1111

Klean: Catalog Package

The catalog package is responsible for rendering catalog content

1212

What is a Package, technically?

Root Packages Common Core

Packages Subdirectory Base Package (Display and Review logic) Service Catalog or Service Portal Fulfillment Console …

1313

What comprises a package?

Packages are organized into four types of files Configuration

Framework

Interface

Resources

1414

Package Organization: Config

Files in the config directory

Modify configurable behavior

Set variables used throughout the bundle

1515

Package Organization: Framework

Files in the framework directory implement the technical internals of the package.

Helpers IncludesModels

1616

Package Organization: Framework/Helpers

Used to wrap common functionality

1717

Package Organization: Framework/Includes

Load all of the framework files

1818

Package Organization: Framework/Models

Abstracted interface to backend data

1919

Package Organization: Interface

Files in the interface directory Specify the content that is displayed

Typically render HTML

May render JSON or XML

Includes the callbacks and fragments subdirectories

2020

Package Organization: Interface

Page JSPs (display.jsp, review.jsp) Includes common interface fragments

Includes Kinetic form content

Portal Page JSPs (catalog.jsp, login.jsp, etc) Includes common interface fragments

Typically has no Kinetic form content

2121

Package Organization: Interface/Callbacks

Specify content for asynchronous (AJAX) request Search results

User details

Submission details

2222

Package Organization: Interface/Fragments

Reusable fragments referenced from interface files Template page content (headers/footers)

2323

Package Organization: Resources

Files in the resources directory are referenced by the files in the interface directory. CSS

Images

Javascript

2424

What comprises a bundle?

Bundles are organized into four directories The common root package. The core root package. A collection of helpful libraries. A collection of additional packages.

2525

Bundle Organization: The Common Package

Origin – Need to share content Improves reusability and consistency Reduced duplication

Resources (CSS, Images, Javascript)

Similar UI

2626

Klean: Common Package

2727

Bundle Organization: The Core Package

Contains interface fragments required to make Request work

Core Models Catalog, Category, Submission, Template Task, TaskMessage

Wrappers bundle context customerRequest

2828

Klean: Core Package

2929

Documentation

3030

Bundle Organization: Libraries

Re-usable solutions Often highly technical or difficult to implement Examples:

Advanced Search

Server-side paginated tables

3131

Libraries: Advanced Search

Example of the power of callbacks

3232

Bundle Packages

Increase portability of consoles and interfaces Typically Include

A base package for rendering service items

A catalog package for rendering the service portal

May Include A submissions package for rendering submitted items

…

3333

Klean Package: Submissions

Provide users with access to their submissions

3434

Additional Packages

Distributed on Kinetic Community Can be dropped in to any bundle

Minor modifications to apply styles and branding

3535

Activity Package

Provide users with access to… everything

3636

Assignment Package

Example of the power of models

3737

Integration Packages

my-eService

3838

Bundle Benefits: Organization

Organizational consistency Easier to read and write

Easier re-use

Self-contained Exist side by side with existing themes

3939

Bundle Benefits: Portability

Everything is a relative reference Easier replication of packages or entire bundles

Zero effort migrations between Dev/QA/Prod

Packages and libraries are self contained Easier to share

4040

Bundle Benefits: Callbacks

More flexible than Simple Data Requests Can make multiple data queries

Can build complicated relationships

Can implement complicated data translations

4141

Bundle Benefits: Models

Simplify code Abstract backend interaction

Focus on the UI

Changing data backend

Provide a reasonable approach for full CRUD Synchronous processing

4242

Bundle Benefits: Performance

Fewer asynchronous requests Don’t see visible delay between page loading and data populating

Server side pagination Leveraging callbacks and Java

Model association loading Load all records in one query

4343

Conclusion

Questions?

Personal Contact Information: Ben Christenson ben.christenson@kineticdata.com 651.556.0937