|
Basic Requirements For The Online-GUI-API
|
|
|
The following states the basic requirement that must be
satisfied to create a viable Online-GUI-API. The examples in the webpage prove that those requirements can be satisfied.
|
|
First
Invention:
Online
GUI-API to build graphics intensive Web Applications
|
|
|
The
Computer graphics and Graphical User Interfaces (or
“GUI”) is arguable one of the most successful
technologies in the software industry. The successes
of Apple computers and then Microsoft were mainly attributed
to their successful deployment of the Computer Graphics.
Due to the advancements of the Internet, it made those
GUI technologies obsolete. Today even Microsoft decisively
moving towards XML-graphics (called XAML/Avalon) in
the Wondows-2006 (code named Longhorn).
|
|
|
It
is very complex to present data driven large custom
graphics Components using bare XML instructions (e.g.
SVG, X3D, Microsoft’s Avalon/XAML or Macromedia’s
MXML/Flash, DHTML etc.), therefore, it costs many times
more than desktop application, to build online applications
that can barely match 50% of the GUI-capabilities of
the desktop GUI-applications. Our innovative GUI-API
technology leverages those XML-graphics technologies
(e.g. XAML or SVG) and provides simple and elegant GUI-API
(e.g. Java or C# class library) abstraction for the
developers to build superior next generation online
GUI-applications.
|
|
|
Our
GUI-technology consists of GUI-API (i.e. a class library),
akin to UNIX/X11/Motif, Windows-API or Java/Swing (but
simpler, highly flexible and not as much blotted). The
GUI class generates 2D or 3D XML-graphics code (e.g.
SVG, X3D, Microsoft’s XAML or Macromedia’s
MXML/Flash) to present the component. To build a GUI-application,
the GUI-Class system must support (i). Processes to
build GUI-component hierarchy; and (ii). Processes to
integrate the GUI-components. These
are the two basic requirements for any GUI-API to build
applications; and not much else.
|
|
|
Capabilities
supported by Windows-GUI-API to build applications:
To build desktop GUI-applications using Visual Basic,
one uses Windows GUI-class API to build the components
and places them in container components (to build component
hierarchy). The GUI components can be manually assembled
to build larger and larger interactive presentations
in the application.
|
|
|
Then
he needs to integrate the GUI-components. To accomplish
this, he would register event-listener (or callback)
functions for the control-components, and implements
the callback-functions, which (i.e. code in the body
of the function) request the services of other components.
When a given event occurs on the control-component,
the callback function will be invoked, which calls the
service functions of other components. This is the general
way two components communicate in the GUI-applications.
The developer repeats similar code to integrate all
the components in the application.
|
|
|
Pioneer-soft’s
Online-GUI Classes can support these capabilities:
In addition to generating 2D or 3D XML-graphics code,
the classes in our GUI-API support innovative special
characteristics (resulted from amazing discoveries),
which make it possible to seamlessly create complex
component hierarchies, than ever possible before, by
writing just few lines of simple code.
|
|
|
By
leveraging this capability (i.e. easily build complex
component hierarchies) one can (i) quickly assemble
fine-grained components to build large and highly customized
components; and (ii) quickly assemble fine-grained classes
to build large and highly flexible GUI classes (both
reusable or custom) then never possible before. These
processes would allow developers to build superior graphics
intensive applications than possible before, at far
less cost.
|
|
|
Furthermore,
the GUI objects not only generate components for the
application but also support special features, such
as, support methods, such as, to provide the function
names to access its services and many other elegant
innovative processes to integrate the component. Hence,
they make it possible to integrate the generated-components
in the application, so that the components in the hierarchy
could exchange messages and collaborate with each other.
|
|
Therefore, the online-GUI-API or class library satisfy both needs stated above, hence
can be used to build next generation online graphics intensive IT applications.
|
|
|
How
does this technology works? & How Pioneer-soft’s
GUI-API different from other technologies out there?
|
|
|
There
are thousands vendors selling reusable GUI-Classes to
present data-driven charts and graphs to include in
the web pages. They all basically work similarly. Developer
usually instantiate the reusable GUI-Class and supply
real-time data and the GUI-Class generated necessary
code (e.g. Flash or SVG) to present the component:
|
|
|
|
|
// The Data
variables: Variables could be initialized at run-time.
// (i.e. this data may be calculated at run-time, from the data
// accessed from databases, obtained live-wire or Web-services)
Double val[] = { 10000, 12000, 14000, 16000, 18000};
String names[] = {"Sun", "Microsoft", "IBM", "Intel", "Oracle"};
//Example for Reusable GUI Class:: ATPie is a Java Class for pie-chart
//It contains presentation logic to generate SVG code to display a chart.
//Sample code below, illustrates how to use the GUI-class for pie chart.
//Instantiate
& Initialize an Object for the Reusable GUI Class
ATPie Pie1 = new ATPie(" Portfolio at the end of 2dn
Quarter");
Pie1.setData(usr_data, 5, val, names); //Use
Class method to set Data
// Method writes SVG-code for Pie-chart to ‘OUT’ stream (e.g. webpage)
Pie1.CGM ( Out ); // Code generation Method
|
|
|
Pseudo-code listing#1
|
|
|
Using
this technique, any one could include one or more components
in his web page. But, if you notice how desktop applications
are build, it is absolutely essential that the components
in the application need to be integrated, for example,
to collaborate or to exchange data or notify events.
If we like to build full-fledged online-applications;
it is essential that the components in the web page
must be integrated, so that they can communicate with
each other.
|
|
|
JSP/Servilet
may instantiate & initialize GUI-Objects using respective reusable GUI Classes,
where each Object generates a 'code-block' for presenting a GUI component.
(Likewise, GUI Class for a larger GUI component may
use other GUI Classes to build subcomponents)
|
|
|
|
Figure#2
|
|
|
|
Note:
Due to the recent legacy of the Internet, we are calling
them web pages, but they can be millions of line of
source code (or even large compiled binaries, for example,
Flash or MAXL real-time compiler) of the complex applications.
|
|
|
If
you use the Reusable GUI-API (e.g. Java Classes in your
JSP file) to include two components in your web page,
how do you integrate the components that are placed
in the web page? Today it is not Possible!
|
|
Important
Note: Remember that the components are dynamically
generated using reusable-GUI-Classes (and may have used
real-time data from data sources). Of course, one might
integrate the components, if he hand written all the
code using bare DHTML/HTML, XAML, SVG or MXML/Flash instructions
to present each of the components and include the component
code in the web page (or online graphics application).
One may be able write bare X3D or XAML code for small
components. However, for many large components, this
may be impractical. It is highly desirable to use a reusable GUI Class as shown
in the listing#1. For example, the code for large
components (e.g. interactive
charts, trees, dials, meters
and maps), the bare XML graphics instructions/code runs
in to thousands of lines, which further may require
complex calculation based on the custom real-time data
(or for AJAX updates). Don’t forget, it might
require complex application logic to get the custom
data (e.g. based on each user's preferences and profile)
from databases or live data sources.
|
|
|
One
or more GUI components may be included in the webpage as shown in above Fig#2
Then implement
Simple Integration-logic code at server (e.g. in JSP) for generating
communication code, so that the GUI components can exchange data/events at
client
|
|
|
|
Figure#3
|
|
|
| How do you integrate any two GUI-Components? |
|
|
Imagine
that you display two GUI-components (which are created using Windows GUI-API
and VB or VC++) in your desktop application’s window.
If you cannot integrate (e.g. implement communication code) the components that are displayed
in the application window, how can you build any application?
Isn’t it impossible?
|
|
|
|
|
|
Imagine,
if there is no way that you could set a callback to
any GUI-component, how can you integrate any two GUI-components
in your VB/VC++ application. If you press the button,
nothing would happen, because it cannot communicate
the user event to any other component. Therefore, a
viable GUI-class must support a mechanism to integrate
the components.
|
|
|
Furthermore,
if the other component does not support a method to
accept the request, how can the callback-function send
the message? Therefore, the GUI-classes/components should
support (A) mechanisms to set callbacks (i.e. register
one or more event notify functions) and/or (B) export
methods for the external code to communicate, for example
to request its services.
|
|
|
Pioneer-soft
invented simple and elegant technique to integrate the
components in the web application (or subcomponents
in a large component). We have perfected the concepts
and process over the years to make it extremely simple.
The reusable GUI-Objects that run on the server can
provide necessary information and capabilities to integrate
the component.
|
|
|
One
such mechanism is given below (we have many other simpler
mechanisms). For Example, you have displayed Radio-button
group and wish to update the stock-quote, if user selects
a new ticker-symbol.
|
|
How do you integrate Two VB/VC++ Components?
Sample VB/VC++ pseudo code to integrate two GUI components
in the traditional GUI applications (e.g. Windows or Unix/Motif):
|
|
|
Write
a callback function as shown below, which calls the
service method of other component to update its status,
upon the user selection of new item.
|
|
Function VB_RadioGroup_callback(
new_selection_ticker) {
// The code to Communicate with other component: For example:
Stock_Quote_Obj.display_new_comp (new_selection_ticker);
}
// Then register the callback for the Radio Button Group.
// The code to register the function VB_RadioGroup_callback
// as a callback to the Radio-button group:
Radio_Group_obj.setCallback (VB_RadioGroup_callback);
|
|
|
| Likewise, our IL (Integration Logic) in the JSP file looks like the following; |
|
// The simple yet great innovative TWIST of IL ('Integration Logic') that runs at server:
// The JSP includes communication code, so that, components to collaborate with each other
<script>
Function Online_RadioGroup_callback( new_selection_ticker) {
// The code to Communicate with other component (e.g. inform the user selection).
//Request the name of the Service-function of the component (In the generated code)
<%=Stock_Quote_Obj.display_new_comp()%>(new_selection_ticker);%>
}
</script>
<% // Include the component-code in the web-page (Notice the double quotes)
Radio_Group_obj.setCallback(“Online_RadioGroup_callback”);
// This would make the Radio-button-group to call the Callback.
%>
|
|
|
|
The
online-GUI-classes support rich set of methods to set
callbacks. Also, the online-GUI-classes support rich
set of service-methods to request the services of the
components. Upon the user event, one component may call
the service method of the other component. This is not
that much different than the traditional-GUI component
integration. (See comparison table at the end of this webpage)
|
|
|
JSP Code runs at server
|
Webpage code runs at Client
|
|
|
Note:
Upon an event on AC2, the AC2 calls the callback
(Blue-dotter-arrow
in above figure). The callback calls the service method of AC1 (Red-dotter-arrow
in above figure)
|
|
|
|
|
Note:
The Integration-logic on server has only 4 lines code
(and rest is just comments to explain it). In fact,
in this case, it can be written in just one line: The
following line is equivalent to the above IL code. (a).Get service method of
Stick_Quote_obj, then (b) make the Radio_Group to call
the service-method. In this case, the GUI-Class includes necessary code in the
AC for the Radio-Group to call the given function. |
|
<% Radio_Group_obj.setCallback (
Stock_Quote_Obj.display_new_comp());%>
|
|
|
This
directly registers one component’s service method
as the callback for the other component. Therefore,
the process to integrate any two GUI-components in the
web page (that are generated using reusable GUI-API),
is not that much different from integrating any two
GUI-components in the traditional desktop GUI-applications. |
|
One
could use GUI-objects to create components and place
any number of GUI-components (e.g. 5 or 500) in the
web page as shown in the Fig#2. Then use the Integration
logic process outlined (e.g. Fig#3) to integrate them. |
|
Notice:
Raju's reusable GUI-Classes not only support a method to generate
code to present the component, but also support functions
to facilitate the integration of the generated components, so that the
components can collaborate with each other. |
|
|
Can you name any reason it won’t work?
|
|
We have many examples to prove this not only works,
|
|
but also offers far more flexible than traditional GUI paradigm.
|
|
|
SUMMARY:
Comparison between
Raju's GUI-API
Framework
and The
Traditional desktop GUI-API Frameworks |
|
Actions
In The Traditional
GUI-API Framework
|
Corresponding
Actions for
Our Online GUI-API Framework
|
|
The
application developers instantiate and initialize each GUI Object. Then request the GUI Objects to present their GUI Components
|
The
application developers instantiate and initialize each GUI Object (Listing#1). Then request the
GUI Objects to generate code-block to present their GUI Components (Fig#2)
|
|
If
two or more GUI components in the application need to collaborate or communicate,
the developers implement required communication code for
the components to collaborate with each other.
|
If
two or more GUI components in the application (e.g. webpage) need to collaborate or communicate,
the developers implement code at server, which generates communication code for the components
to collaborate with each other. (Please see Figures #3)
|
|
Therefore,
Raju's GUI-API is "functionally equivalent" to the traditional GUI-API
|
|
