indexSeparator = ' '; // Add one line per slide, using // addSlide ('filename', 'caption', 'index text'); // The third parameter is optional and will default to the number // of the slide if not provided. //addSlide('nap-time.jpg', 'After a hosedown its time for a nap!', ''); addSlide('presentations/images/aspnetintro/Slide01.gif', "This slide show presents the CTC ASP.NET WebForms Generator, which enables you to get more benefit from the features available with ASP.NET and AJAX."); addSlide('presentations/images/aspnetintro/Slide02.gif', "The CTC Environment adds value by allowing the user to take full advantage of the capabilities of ASP.NET and to use 3rd party controls to provide for today's End User needs."); addSlide('presentations/images/aspnetintro/Slide03.gif', "For example, instead of a User Interface, as shown here on the left, with the grey background, ..."); addSlide('presentations/images/aspnetintro/Slide04.gif', "... you will be able to generate something like this, shown on the right hand side, with very little effort."); addSlide('presentations/images/aspnetintro/Slide05.gif', "Using the CTC environment, the standard dynamic list created in EAE and AB Suite can be presented in different formats."); addSlide('presentations/images/aspnetintro/Slide06.gif', "For example, instead of the standard ListBox, as shown here on the left, ..."); addSlide('presentations/images/aspnetintro/Slide07.gif', "... you can present the data in a grid using the ASP.NET GridView control with images ..."); addSlide('presentations/images/aspnetintro/Slide08.gif', "... or you can present the data as a chart using 3rd party WebChart controls."); addSlide('presentations/images/aspnetintro/Slide09.gif', "The following sequence of slides shows how easily the painted forms can be enhanced to improve the user interface."); addSlide('presentations/images/aspnetintro/Slide10.gif', "This is the default look and feel of a standard Customer Inquiry screen from the Sample system, before any enhancements are applied ..."); addSlide('presentations/images/aspnetintro/Slide11.gif', "Using calendar controls is a high priority requirement and in this screen, the Date Effective field has been replaced with a drop down Calendar control ..."); addSlide('presentations/images/aspnetintro/Slide12.gif', "Clicking on the Calendar Icon causes the calendar to drop down. On selection of a date, the TextBox is updated with the selection and the Calendar disappears. There are many varieties of calendar control that can be used, depending on the user needs and the usage of the date field ..."); addSlide('presentations/images/aspnetintro/Slide13.gif', "The CTC solution is based on the principle that you should be able to specify any required enhancements to the user interface with little and in most cases no programming at all. The CTC Configurator is a central tool for achieving this and makes the configuration process easy.

In this example, a Control Substitution has been added to the configuration of the bundle ..."); addSlide('presentations/images/aspnetintro/Slide14.gif', "The TextBox Control has then been selected from the dropdown list and ..."); addSlide('presentations/images/aspnetintro/Slide15.gif', "... the TextBox Control has been substituted with the DatePicker Control selected from the dropdown list ..."); addSlide('presentations/images/aspnetintro/Slide16.gif', "As this substitution of the TextBox is added at the bundle level, it would be applied to all TextBoxes on all ispecs within this bundle by default.

However, in this example it is only to be applied to date fields. Therefore a match condition will be specified using the expression editor ..."); addSlide('presentations/images/aspnetintro/Slide17.gif', "Using the Expression Editor, you can specify conditions as complex as required. In this case the match is only required on fields that are of type date.

That's all it takes to replace date fields with a Calendar control and there is no programming involved."); addSlide('presentations/images/aspnetintro/Slide18.gif', "In this screen the standard List Box has been replaced with the standard ASP.NET GridView control.

The GridView control is very popular and is used in many internet applications because it allows for a much better user interface. As seen here, things like column headings and colors on individual rows can be specified."); addSlide('presentations/images/aspnetintro/Slide19.gif', "This shows how the CTC Generator fits in with the normal Component Enabler Environment.

The Component Enabler Generate Environment and the way all of its various generators plug-in to this is familiar to all.

That's a great architecture, as it provides one generic interface between the EAE and AB Suite Development Environments and all types of User Interface generators."); addSlide('presentations/images/aspnetintro/Slide20.gif', "The CTC Generator behaves in the same way. It is a normal plug-in generator to the CE Environment and therefore it is run in exactly the same way as you run any other Component Enabler Generator.

However, the architecture and design of the CTC Generator is very different in order to achieve the high degree of flexibility that's necessary to generate rich User Interface applications.

As shown in the previous slides, the Configurator is an essential part of the solution.

With the Configurator, your specify what needs to be enhanced on the painted forms and the generator figures out how to generate it. That gives you full control over what is generated.

This is an open and very flexible solution that allows you to take advantage of all the features of ASP.NET and to use 3rd party controls.

The generator is an all inclusive generator, so when the generate is finished, you are done. There is nothing more to do. There is no post-processing or any manual steps required to further manipulate the generated forms. Just run the User Interface. This makes the whole process simple, reliable and repeatable."); addSlide('presentations/images/aspnetintro/Slide21.gif', "The ASP.NET environment from Microsoft is very popular and has attracted a large number of third parties that offer many different and exciting controls for ASP.NET.

The CTC solution is designed to allow you to take advantage of any of these controls to suit your requirements.

Each of these controls is different. They each have their own unique set of properties and therefore a translation of the controls as they are painted on the forms in EAE and AB Suite to which ever 3rd party control is necessary."); addSlide('presentations/images/aspnetintro/Slide22.gif', "Custom Controls in CTC is how this mapping is achieved.

A number of Custom Controls are included with the generator.

However, you are not limited to just these custom controls. The CTC solution allows you to include any you require.

The source code of the included custom controls is provided with the generator. This can be used as a starting point for creation of new controls.

Client Tools Consultancy can also create additional custom controls to suit any specific requirements."); addSlide('presentations/images/aspnetintro/Slide23.gif', "From working with ASP.NET Controls in Visual Studio, it is clear that each of the ASP.NET controls has many properties that allow a high degree of customization.

However, the controls on the painted forms only use a subset of these properties.

The CTC Configurator allows you to specify any property on any control to suit your User Interface.

This can be simple things such as Background color, Background Images, and Borders. Often it is the simple things that have a huge effect on how the application is received by the users."); addSlide('presentations/images/aspnetintro/Slide24.gif', "The following sequence shows an example of how to utilize the ASP.NET properties."); addSlide('presentations/images/aspnetintro/Slide25.gif', "This is the look and feel of standard default generated buttons as often seen ..."); addSlide('presentations/images/aspnetintro/Slide26.gif', "In this example the buttons are displayed with rounded corners which is achieved simply by removing the grey background color on the buttons ..."); addSlide('presentations/images/aspnetintro/Slide27.gif', "Using the Configurator, a control specification of the Button control has been added to the configuration. This has been added high in the hierarchy at the bundle level, which means this look and feel of the button will be applied to all buttons on all ispecs within this bundle by the generator ..."); addSlide('presentations/images/aspnetintro/Slide28.gif', "The Push Button control is selected as the control to configure from the dropdown list of all available controls ..."); addSlide('presentations/images/aspnetintro/Slide29.gif', "Selection of a control means the system automatically adds the default template specification of the control as it will be generated ..."); addSlide('presentations/images/aspnetintro/Slide30.gif', "The properties of the control are edited by opening the Properties Editor. This shows the default template of the Push Button control as it will be generated. This template is provided automatically by the system, so all you have to do is to edit the template to suit your requirements

The square brackets represent the information coming from the form painted in EAE or AB Suite Developer.

Using the Properties Editor to edit the template means you have full control over exactly what is generated.

The editor provides a preview of what the control will look like when it is generated ..."); addSlide('presentations/images/aspnetintro/Slide31.gif', "The rounded corners are achieved by removing the background color property from the button.

It is so easy to configure a control to take advantage of all properties offered by ASP.NET, with no programming at all."); addSlide('presentations/images/aspnetintro/Slide32.gif', "The CTC solution includes its own Context Menu control with some great features.

It allows dynamic creation of items on the menu that reflect the true context in which it is requested.

As this example shows, you can create the list of ispecs that is currently generated for the interface and allow the user to easily navigate to these ispecs. This example is part of the generator when you install it and can be modified as you like to suit any local requirements.

This context menu is only sent to the browser when the user requests the menu, ensuring efficient processing of the menu."); addSlide('presentations/images/aspnetintro/Slide33.gif', "The CTC Generator includes a large number of options that make it very flexible and easy to use.

They are all configured using the CTC Configurator.

Some options eliminate manual processes.

Others improve the efficiency of the runtime application.

Where specific code that executes at runtime is needed, an option is provided for adding a Custom Code Module to any generated form. This allows addition of own code to a form to do things such as setting properties on controls depending on values returned from the host system, or validating user input before the data is sent to the host system."); addSlide('presentations/images/aspnetintro/Slide34.gif', "All the runtime parameters can be configured using the CTC Configurator.

This is more convenient than editing the Web.config file with Notepad, as all prior configurations are kept, for both Generate configurations and Runtime configurations, in one directory and use just one tool for maintaining the configuration.

The CTC Configurator provides a graphical interface for setting the runtime parameters. This includes extensive help text for each parameter and drop down selections where appropriate."); addSlide('presentations/images/aspnetintro/Slide35.gif', "Version 2.0 of the CTC ASP.NET Generator was released in July 2008.

It has been enhanced to support AJAX as well as the standard ASP.NET.

It utilizes partial rendering to create a user interface that is more efficient and gives a better user experience.

It is very easy to include AJAX in the user interface. There is just one option to select and the generator will automatically do the rest."); addSlide('presentations/images/aspnetintro/Slide36.gif', "These are some of the benefits of using AJAX."); addSlide('presentations/images/aspnetintro/Slide37.gif', "With the advent of AJAX , there is a whole range of new controls available and the ASP.NET AJAX Control Toolkit is one example.

This toolkit is a joint effort between Microsoft and the ASP.NET AJAX community. Currently it includes around 35 different controls and it is a free download.

Version 2.0 of the CTC ASP.NET Generator provides support for the ASP.NET AJAX Control Toolkit.

Initially, CTC has included 6 controls from the toolkit, from which EAE and AB Suite applications can benefit. Others can be added on request."); addSlide('presentations/images/aspnetintro/Slide38.gif', "The following sequence shows a few sample screens utilizing AJAX."); addSlide('presentations/images/aspnetintro/Slide39.gif', "This shows a completely different look and feel.

On the left hand side the ASP.NET Menu control has been used to create a list of ispecs. This list is created dynamically so it reflects the ispecs that are currently part of this generated system. Having the menu here makes it more accessible for the user.

The green section is where the WebForm Renderer runs and displays the ispec forms.

While a look and feel like this can be achieved without AJAX, it is more efficient when you do use AJAX. This is because the WebForm Renderer has been enhanced to support AJAX and partial rendering. When the user transacts with the host system, only controls on the ispec form are updated, not the complete page ..."); addSlide('presentations/images/aspnetintro/Slide40.gif', "When the user navigates to the next customer record, the browser does not get a full page back, only the controls in the green section of the form are returned and updated.

This is more efficient and avoids the annoying screen flicker ..."); addSlide('presentations/images/aspnetintro/Slide41.gif', "With the CTC solution, controls like the Calendar and GridView are generated to be AJAX aware.

This means, when using the dropdown calendar and selecting a date, only the textbox control is updated ..."); addSlide('presentations/images/aspnetintro/Slide42.gif', "The Calendar is dropped when clicking on the calendar icon and when selecting the date, the calendar disappears ..."); addSlide('presentations/images/aspnetintro/Slide43.gif', "The date field is updated immediately when selecting a date from the calendar.

This makes the interface much more efficient and more responsive to user actions ..."); addSlide('presentations/images/aspnetintro/Slide44.gif', "When an item is selected from the GridView, only the GridView is updated to show the selection ..."); addSlide('presentations/images/aspnetintro/Slide45.gif', "This shows the use of the Slider control and the Up/Down control from the AJAX Toolkit.

Using controls like these may not be appropriate for all applications, but it shows the flexibility of the CTC Generator. Any control that conforms to the standards set by ASP.NET can be used in the CTC solution ..."); addSlide('presentations/images/aspnetintro/Slide46.gif', "This shows that the TextBox on the Credit Limit field has been configured to be replaced by the AJAX Slider Extender."); addSlide('presentations/images/aspnetintro/Slide47.gif', "The last demo sequence shows how a standard dynamic List created in EAE and AB Suite can be used for presenting information in different formats to the end user to achieve greater effect."); addSlide('presentations/images/aspnetintro/Slide48.gif', "This is an ispec showing the product sales as a standard ListBox."); addSlide('presentations/images/aspnetintro/Slide49.gif', "This is the same List, but replaced with the GridView to show the data in a column formatted list.

The GridView is a control with many capabilities. For example, column sorting allows the user to sort the data in ascending or descending order by clicking on the column header."); addSlide('presentations/images/aspnetintro/Slide50.gif', "Here the end user has sorted the data in descending order on 'Units Sold', to easily see which product is selling best."); addSlide('presentations/images/aspnetintro/Slide51.gif', "The GridView also allows inclusion of images. Here the Product Number has been used as the key to show product images."); addSlide('presentations/images/aspnetintro/Slide52.gif', "Here, a second list box has been added as a copy of the first one."); addSlide('presentations/images/aspnetintro/Slide53.gif', "Here, the second list box has been replaced with a 3rd party control from the company called ComponentArt (see: www.componentart.com/charting/). They provide a WebChart control that produces some stunning charts.

All of this has been achieved without any programming. Just configuration. The 3rd party control simply takes the normal list as input and creates the chart from that."); addSlide('presentations/images/aspnetintro/Slide54.gif', "And finally, this shows a completely different type of chart from the same list."); addSlide('presentations/images/aspnetintro/Slide55.gif', "If you are considering taking advantage of any of the other Microsoft user Interface technologies, such as WPF, XAML and SilverLight, please contact CTC.

The design CTC solution is based around a framework that allows CTC to easily create new generators with similar capabilities as the CTC ASP.NET WebForms Generator for any of the User Interface technologies from Microsoft."); addSlide('presentations/images/aspnetintro/Slide56.gif', "Listed here are some of the benefits the CTC solution provides.

This presentation has shown a small sample of the capabilities of the CTC solution. To get a better idea of the capabilities and benefits, the free trial version can be downloaded from this web site and trialed with your own applications.");