Re: Single Page Web Web Apps -- WEB400

So is the "lots of extra typing and chances for things to get out of sync structurally" a symptom of the ExtJS approach, rather than model frameworks in general?

-----Original Message-----
From: web400-bounces@xxxxxxxxxxxx [mailto:web400-bounces@xxxxxxxxxxxx] On Behalf Of Henrik Rützou
Sent: 12 January 2013 12:32
To: Web Enabling the IBM i (AS/400 and iSeries)
Subject: Re: [WEB400] Single Page Web Web Apps

Kevin,

What I think Aaron means is that in EXT JS we have something called a Data Store. A Data Store is an object that not only holds the data but also has a lot of functionality like any other OO javascript object.

When you define a new Data Store you have to configure it with metadata that describes the JSON object it receives.

In an EXTJS Grid you point the grid to a Data Store but you also have to define your columns in the grid and in that process point to the Data Stores description of the JSON object that is within the Data Store Object.

So what you do is (very simplified) …

myDataStore = new ExtDataStore(ServerResource,JSONMetaData);

myGrid = new ExtGrid(JSONGridColumnDescription,myDataStore);

show(myGrid);

You have now coupled the Grid to the Data Store and thereby to the ServerResource so anything you do in the Grid will automatically be coupled to the Data Store that then communicates with the server without you need to do anything.

Let’s try to define the special elements in the above code:

ServerResource = URL to the REST/CRUD service on the server

JSONMetadata = a JSON metadata definition of the data that is communicated between the server and the Data Store

JSONGridColumnDescription = a JSON metadata definition that describes the columns in the grid (header, width, type etc.)

Now let’s try to make the above code into generic code:

First we don’t describe the metadata in the Data Store in the javascript code. In order to do so, we let the server describe the data it sends. So the server sends a JSON object with a Metadata section and a Data (row) section.

We also let the server send the URL to the Server Resource in a configuration object when it launches the initial code:

myDataStore = new ExtDataStore(Config(‘serverResource’,’URLerror’));

function Config(property,pdefault) {

switch (property) {

case 'serverResource' : return '/pextcgi/pxsvpxwa.pgm';

default : return pdefault;

}

}

We also let the server send a grid column description in an OO Javacript object that returns the JSON Grid Column description with a fixed function name, let’s call it “ServerGenGridDesc”

Now we can launch the grid with the following generic code:

myDataStore = new ExtDataStore(Config(‘serverResource’,’URLerror’));

myGrid = new ExtGrid(ServerGenGridDesc(),myDataStore);

show(myGrid);

// generated by server at launch

function Config(property,pdefault) {

switch (property) {

case 'serverResource' : return '/pextcgi/pxsvpxwa.pgm';

default : return pdefault;

}

}

function ServerGenGridDesc() {

return ([

// work around error in Crome 16+17+??? with LockingGridView

{

"header":""

,"width":1

,"hidden":false

,"locked":true

,"dataIndex":"*NONE*"

}

,

{header :
"Web User Id."

,locked : true

,width : 195

,dataIndex :
"WAWUSR"

,align :
"left"

,sortable : true

}

,

{header :
"Web User Name"

,locked : true

,width : 325

,dataIndex :
"WAWUNA"

,align :
"left"

,sortable : true

}

,

{header :
"Language Code"

,width : 84

,dataIndex :
"WALNGC"

,align :
"left"

,sortable : true

}

,

{header :
"Mail Address"

,width : 500

,dataIndex :
"WAMAIL"

,align :
"left"

,sortable : true

}

,

{header :
"Web User Class"

,width : 91

,dataIndex :
"WAWUSC"

,align :
"left"

,sortable : true

}

,

{header :
"Web User No."

,width : 80

,dataIndex :
"WAWUSN"

,align :
"right"

,sortable : true

,renderer :
function(v)

{return Ext.util.Format.formatNumber(v,{

decimalSeparator : "."

,decimalPrecision : 0

,groupingSeparator : ","

,groupingSize : 3

,currencySymbol : ""

})}

}

]);

}

By doing the above we can now put the javascript code – the controller in a generic javascript file and just refer to it in the page and we have also separated the Model (that runs on the server), The View and the Controller that runs in the Client:



<script
src="/powerEXT/pxStandardGridForm.js"></script>

This is of course not the PUSH technology (which should be the only reason for switching to websockets) but it is both SOA and extreme MVC since I have lifted EXT JS from predefined configurable UI components to predefined configurable Function components.

On Sat, Jan 12, 2013 at 11:53 AM, Kevin Turner <kevin.turner@xxxxxxxxxxxxxxx

wrote:

I must be being stupid, because your point is still completely lost on me.
I don't know how one would talk about ExtJS (which is a feature rich
UI library with model based functionality built in) in the same
context as dedicated MVC-type frameworks with a tiny footprint (like
ember.js, backbone.js and knockout.js).

Either you are using an MVC framework or you aren't - but if you are,
I still don't understand where the "lots of extra typing and chances
for things to get out of sync structurally" comes into play?

That said - the point is moot I guess. It is proving very useful and
efficient for us to use something that allows updates to a model to be
automatically reflected in the UI (and vice versa) without bloating
the JavaScript with bespoke code per function. Not everyone will see
this as a good thing for their own solutions.

-----Original Message-----
From: web400-bounces@xxxxxxxxxxxx [mailto:web400-bounces@xxxxxxxxxxxx]
On Behalf Of Aaron Bartell
Sent: 11 January 2013 20:46
To: Web Enabling the IBM i (AS/400 and iSeries)
Subject: Re: [WEB400] Single Page Web Web Apps

ExtJS. Basically I won't want to have to redefine my columns to any
extent in json stores except for mapping them to a column.

Aaron Bartell
www.MowYourLawn.com/blog
www.OpenRPGUI.com
www.SoftwareSavesLives.com

On Fri, Jan 11, 2013 at 2:38 PM, Kevin Turner
<kevin.turner@xxxxxxxxxxxxxxx>wrote:

I don't think I quite follow you Aaron. Under what circumstances do
you have to keep recreating model structures? Perhaps more to the
point, which model framework has caused you to do so?

On 11 Jan 2013, at 19:32, "Aaron Bartell"
<aaronbartell@xxxxxxxxxxxxxxx>
wrote:

The thing I don't like about some of the Javascript "model"
frameworks is that it isn't reflective in nature and instead I
have to recreate my

model

structure within Javascript (i.e. lots of extra typing and chances
for things to get out of sync structurally).

Aaron Bartell
www.MowYourLawn.com/blog
www.OpenRPGUI.com
www.SoftwareSavesLives.com

On Fri, Jan 11, 2013 at 1:18 PM, Kevin Turner
<kevin.turner@xxxxxxxxxxxxxxx>wrote:

Ajax = XHR = xmlhttprequest

To be honest I would be surprised to see any app these days that
don't

use

it,

Knockout looks similar to ember by the looks of it.

On 11 Jan 2013, at 17:56, "Vernon Hamberg"
<vhamberg@xxxxxxxxxxxxxxx>
wrote:

This can be done nicely with Ajax - a former colleague does it
all the time, as I recall.

On 1/11/2013 11:52 AM, Bradley Stone wrote:

Sounds like another case of complicating something to make it

easier.

:)

Brad
www.bvstools.com

On Fri, Jan 11, 2013 at 8:06 AM, Kevin Turner
<kevin.turner@xxxxxxxxxxxxxxx>wrote:

If you mean a web app that only has one initial page, then
just

replaces

the "viewport" area of the page as the user navigates around
(using

xhr or

websockets) then yes, Renaissance works that way. If you
don't mean

that,

then I don't know what you mean (until I read up on something
like

knockout

of course).

Renaissance 6.0 makes use of requirejs (http://requirejs.org/)
and

ember (

http://emberjs.com/)

-----Original Message-----
From: web400-bounces@xxxxxxxxxxxx [mailto:

web400-bounces@xxxxxxxxxxxx]

On

Behalf Of Richard Schoen
Sent: 11 January 2013 13:45
To: web400@xxxxxxxxxxxx
Subject: [WEB400] Single Page Web Web Apps

Has anyone adopted this style of developing tight web apps ?

Seems like there is a new js framework called knockout that
can be

used

for this.

jQueryMobile supports something similar.

Regards,
Richard Schoen
RJS Software Systems Inc.
Where Information Meets Innovation Document Management,
Workflow, Report Delivery, Forms and Business Intelligence
Email: richard@xxxxxxxxxxxxxxx<mailto:richard@xxxxxxxxxxxxxxx>
Web Site:
http://www.rjssoftware.com<http://www.rjssoftware.com/>
Tel: (952) 736-5800
Fax: (952) 736-5801
Toll Free: (888) RJSSOFT

--
This is the Web Enabling the IBM i (AS/400 and iSeries)
(WEB400)

mailing

list To post a message email: WEB400@xxxxxxxxxxxx To
subscribe, unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx Before posting, please
take a moment to review the archives at
http://archive.midrange.com/web400.

NOTICE: The information in this electronic mail transmission
is

intended

by CoralTree Systems Ltd for the use of the named individuals
or

entity to

which it is directed and may contain information that is
privileged

or

otherwise confidential. If you have received this electronic
mail transmission in error, please delete it from your system
without

copying or

forwarding it, and notify the sender of the error by reply
email or

by

telephone, so that the sender's address records can be corrected.

--------------------------------------------------------------------
--
----------

CoralTree Systems Limited
25 Barnes Wallis Road
Segensworth East, Fareham
PO15 5TT

Company Registration Number 5021022.
Registered Office:
12-14 Carlton Place
Southampton, UK
SO15 2EA
VAT Registration Number 834 1020 74.
--
This is the Web Enabling the IBM i (AS/400 and iSeries)
(WEB400)

mailing

list
To post a message email: WEB400@xxxxxxxxxxxx To subscribe,
unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx Before posting, please
take a moment to review the archives at
http://archive.midrange.com/web400.

--
This is the Web Enabling the IBM i (AS/400 and iSeries) (WEB400)

mailing

list

To post a message email: WEB400@xxxxxxxxxxxx To subscribe,
unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx Before posting, please
take a moment to review the archives at
http://archive.midrange.com/web400.

NOTICE: The information in this electronic mail transmission is
intended by CoralTree Systems Ltd for the use of the named
individuals or entity

to

which it is directed and may contain information that is
privileged or otherwise confidential. If you have received this
electronic mail transmission in error, please delete it from your
system without

copying or

forwarding it, and notify the sender of the error by reply email
or by telephone, so that the sender's address records can be corrected.

--------------------------------------------------------------------
--
----------

CoralTree Systems Limited
25 Barnes Wallis Road
Segensworth East, Fareham
PO15 5TT

Company Registration Number 5021022.
Registered Office:
12-14 Carlton Place
Southampton, UK
SO15 2EA
VAT Registration Number 834 1020 74.
--
This is the Web Enabling the IBM i (AS/400 and iSeries) (WEB400)
mailing list To post a message email: WEB400@xxxxxxxxxxxx To
subscribe, unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx Before posting, please take
a moment to review the archives at
http://archive.midrange.com/web400.

--
This is the Web Enabling the IBM i (AS/400 and iSeries) (WEB400)
mailing

list

To post a message email: WEB400@xxxxxxxxxxxx To subscribe,
unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx Before posting, please take
a moment to review the archives at http://archive.midrange.com/web400.

NOTICE: The information in this electronic mail transmission is
intended by CoralTree Systems Ltd for the use of the named
individuals or entity

to

which it is directed and may contain information that is privileged
or otherwise confidential. If you have received this electronic mail
transmission in error, please delete it from your system without
copying

or

forwarding it, and notify the sender of the error by reply email or
by telephone, so that the sender's address records can be corrected.

----------------------------------------------------------------------
----------

CoralTree Systems Limited
25 Barnes Wallis Road
Segensworth East, Fareham
PO15 5TT

Company Registration Number 5021022.
Registered Office:
12-14 Carlton Place
Southampton, UK
SO15 2EA
VAT Registration Number 834 1020 74.
--
This is the Web Enabling the IBM i (AS/400 and iSeries) (WEB400)
mailing list To post a message email: WEB400@xxxxxxxxxxxx To
subscribe, unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx Before posting, please take a
moment to review the archives at http://archive.midrange.com/web400.

--
This is the Web Enabling the IBM i (AS/400 and iSeries) (WEB400)
mailing list To post a message email: WEB400@xxxxxxxxxxxx To
subscribe, unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx
Before posting, please take a moment to review the archives at
http://archive.midrange.com/web400.

NOTICE: The information in this electronic mail transmission is
intended by CoralTree Systems Ltd for the use of the named individuals
or entity to which it is directed and may contain information that is
privileged or otherwise confidential. If you have received this
electronic mail transmission in error, please delete it from your
system without copying or forwarding it, and notify the sender of the
error by reply email or by telephone, so that the sender's address records can be corrected.

----------------------------------------------------------------------
----------

CoralTree Systems Limited
25 Barnes Wallis Road
Segensworth East, Fareham
PO15 5TT

Company Registration Number 5021022.
Registered Office:
12-14 Carlton Place
Southampton, UK
SO15 2EA
VAT Registration Number 834 1020 74.
--
This is the Web Enabling the IBM i (AS/400 and iSeries) (WEB400)
mailing list To post a message email: WEB400@xxxxxxxxxxxx To
subscribe, unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx
Before posting, please take a moment to review the archives at
http://archive.midrange.com/web400.

--
Regards,
Henrik Rützou

http://powerEXT.com <http://powerext.com/>
--
This is the Web Enabling the IBM i (AS/400 and iSeries) (WEB400) mailing list To post a message email: WEB400@xxxxxxxxxxxx To subscribe, unsubscribe, or change list options,
visit: http://lists.midrange.com/mailman/listinfo/web400
or email: WEB400-request@xxxxxxxxxxxx
Before posting, please take a moment to review the archives at http://archive.midrange.com/web400.

NOTICE: The information in this electronic mail transmission is intended by CoralTree Systems Ltd for the use of the named individuals or entity to which it is directed and may contain information that is privileged or otherwise confidential. If you have received this electronic mail transmission in error, please delete it from your system without copying or forwarding it, and notify the sender of the error by reply email or by telephone, so that the sender's address records can be corrected.

--------------------------------------------------------------------------------

CoralTree Systems Limited
25 Barnes Wallis Road
Segensworth East, Fareham
PO15 5TT

Company Registration Number 5021022.
Registered Office:
12-14 Carlton Place
Southampton, UK
SO15 2EA
VAT Registration Number 834 1020 74.