1. Introduction
Welcome to Genie. Genie is Profound Logic Software’s intuitive, non-intrusive, 100% browser-based tool that modernizes and enhances RPG, CL, COBOL, menu, or i5/OS system screens. Genie produces standard HTML with no need for PC Clients, ActiveX Controls, or Applets. This means you can deploy Genie to hundreds of users without installing anything on their machine.
Because Genie runs natively on the System i and does not use costly interactive CPW, you can save on hardware costs and experience fast performance just by deploying your green-screens to an enhanced browser interface. In addition, Genie uses the system’s built-in HTTP server, which ensures that your applications are running at the fastest speeds possible. It does not require proprietary Web servers or the IBM Websphere Application Server (WAS).
Genie also offers a powerful Rich Internet Application (RIA) platform with an abundance of graphical elements such as Tab Panels, Field Set Panels, Dynamic Charts, Date Fields with pop-up calendars, and many other advanced Graphical User Interface (GUI) controls that can be implemented without manual programming. Developers can add new functionality to their existing applications with ease. They can also integrate individual screens, entire menus, or complete programs into an existing Web application.
In addition, Genie comes with various prepackaged skins. The skins are comprised of HTML templates to control content for headers and footers, as well as Cascading Style Sheet (CSS) files to control default colors, fonts, sizes, and shapes. Customers can modify theses skins or create their own to include company logos, colors, and templates.
Figure 1.1: System i Main Menu presented with Genie Designer
Genie is bundled with 2 main browser-based development tools:
- The Genie Visual Designer
- The Genie Administrator
The Genie Visual Designer allows developers to customize their green-screen applications into interactive web applications while removing the limitations of legacy systems. By default, without any developer intervention, Genie automatically translates all of your system’s screens to a browser equivalent. Some of your screens may need additional enhancements, in which case the Visual Designer is used to perform tasks such as adding images, database-driven dropdowns, charts or calendars to existing screens. The Genie Visual Designer has a simple point-and-click, drag-and-drop interface.
Figure 1.2: Cluttered green-screens become intuitive web interfaces
Figure 1.3: The Genie Designer’s Toolbar
Additionally, many settings can be controlled globally using the Genie Administrator. For example, you can stripe alternating rows in all of your subfiles with certain colors, convert all function key labels into buttons, or turn menu options into hyperlinks. Just like the Genie Visual Designer, you access the Genie Administrator through a browser window.
Figure 1.4: The Genie Administrator
With the Administrator, you can also manage screen enhancement definitions, and promote them from test to production when necessary.
1.1 Advantages and Features
- 100% Browser-Based - Genie is 100% browser-based and produces standard HTML with no need for PC Clients, ActiveX Controls, or Applets. This makes it a very low maintenance product. Your users will never need to install any software. They will access Genie applications using a hyperlink to an Intranet, Extranet, or Internet site. Thus, system updates can occur with complete transparency to the user.
- Cross-Browser - All major browsers as as well as mobile devices are supported, including Internet Explorer, FireFox, Opera, Safari, Chrome, and iPad.
- Accurate WYSIWYG View - The designer tool produces a completely accurate WYSIWYG (What-You-See-Is-What-You-Get) view of all application screens. Unlike Windows-based tools, the Genie designer runs within the same browser window as the final output, so it can produce accurate results.
- Automatic Screen Discovery - Identifying and modifying application screens is easy with Genie. Screens are automatically discovered by navigating the original application in the browser.
- Integrated Development - All tasks are integrated into one browser session, making it easy to prototype, develop, test, and deploy.
- Dynamic Architecture - Genie’s browser interface is built to handle modifications in real-time. That means your GUI and backend changes will instantly merge. You never have to recompile, reconvert, or run complicated processes.
- Zero Interactive - When Genie web-enables your applications, it completely eliminates interactive CPW. This capability, known as the Genie Accelerator, makes modernization much more affordable. You no longer have to worry about upgrading your systems or buying a more powerful server to modernize. With Genie Accelerator, all your applications will run entirely in batch, eliminating the need for expensive 5250 OLTP and unlocking the full processing power of the system for 5250 applications
- System i charting - Genie offers single-series, multi-series, and combination charting capabilities with more than 60 different chart types to visually enhance your applications. You can pick from 2D or 3D Column Charts, Bar Charts, Line Charts, Area Charts, Pie Charts, Doughnut Charts, and more. Your chart data can come directly from a Genie screen or from any other source.
- Flexible Integration Capabilities - Genie has a number of unique features that allow you to integrate it with other applications. Using simple scripting techniques, you can single-out specific green-screens and integrate them into other browser applications. Alternatively, Genie gives you the capability to embed other Web applications directly into your green-screen programs. Genie applications also give you the ability to integrate with any other modernization approaches, such as automated conversions and redevelopment. Additionally, Genie can integrate with web services and offers a Simple Object Access Protocol (SOAP) client for web services.
- No Double Maintenance - Genie gives you the capability to seamlessly merge all of your backend changes with existing front-end enhancements. Adding or removing fields from your green-screen applications will not break your graphical interface, and Genie screens will not have to be rebuilt or recompiled after changes. Instead, all backend changes are automatically incorporated into Genie, and you can easily customize any new fields with the designer.
- No Programming Required - Coding is hidden from the user through a visual point-and-click environment. In fact, some customers allow their end-users and non-developer business analysts to prototype and help develop their own interfaces.
- Flexibility - Although custom programming is not required to achieve great results, it is fully supported by Genie and can be done using a variety of server-side and client-side languages, such as RPG, PHP, .NET, Java, as well as HTML, CSS, and JavaScript.
- Global Enhancements - Global customization capabilities and enhancements are taken even further with Genie's client-side scripting. The scripting capabilities in Genie are incredibly powerful, and you can automate any customization on a global level. For example, you can define one or more rules such as the following:
- Whenever there is a question mark on the screen, turn it into a button which sends the F4 key to the System i application.
- Whenever there is a Y/N displayed on the screen as Yes or No options, turn them into a checkbox or a dropdown box.
- Many more rule types are possible as well. The Genie scripting language is a superset of JavaScript, which is a scripting language that is widely used for client-side web development. This makes it a very capable and comprehensive high-level language.
- Secure - Your modernization efforts with Genie will not jeopardize your system's security. You will be able to secure your applications with SSL and take advantage of all the security provided by the i5/OS. It is a completely native solution and does not require any extra servers. You will be able to securely deploy your applications to the Web. Unlike other solutions, Genie will never expose critical ports such as telnet.
1.2 Graphical WYSIWYG Elements
The Genie Visual Designer provides you with codeless point-and-click support for dozens of graphical elements. Below are some of the GUI elements included in the designer:
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
With each of the elements, you have complete control over the look and feel, as well as functionality. The elements have hundreds of properties that you can modify, and all of these changes can be made with the designer’s user-friendly properties panel.
Figure 1.5 Properties Panel
In Genie, most element properties are self-explanatory. You can modify colors, fonts, backgrounds, borders, hover tooltips, and much more. If you are not sure what a property is supposed to do, simply refer to the help text at the bottom of the panel. There you will find a detailed description of each property, as well as some examples of how it is used. The properties panel in the Genie Designer allows you to modify all HTML attributes and CSS styles without any coding. If you have worked with HTML and CSS code in the past, you will immediately appreciate how much effort the Genie Designer saves you.
Genie ensures that you are getting the most from your system. With Genie, you can go from starting your modernization efforts to having a partially modernized system in less than a day. You have all the tools necessary, however, to take it as far as you need. You will be able to reap the benefits of modernization without investing a lot of time, effort, and money into the process.