PDA

View Full Version : Joose.Bridge.Ext - 0.1 released



SamuraiJack1
24 Dec 2008, 6:48 AM
Joose.Bridge.Ext - bridge between native Ext and Joose class systems

Description

This package provides backward-compatible replacement for Ext.extend, which turns standard Ext classes into Joose (http://code.google.com/p/joose-js/) Classes.

Joose classes have many additional capabilities, please refer to Joose home page for complete manual.
I'll just mention, that you definitely should take a look at Roles (http://code.google.com/p/joose-js/wiki/BuildingARole). They provide a clean alternative for multiple inheritance and allows to change the behavior of already formed Classes (even deeply in hierarchy).


Documentation

For documentation and source code please refer repository:
http://extjs-ux.org/docs/?class=Joose.Bridge.Ext


Usage

This bridge can be used in 2 ways.
First, you can just include this package in your application and derive only your new classes with it, leaving standard Ext classes unchanged. This way Joose features will be naturally available only for your classes.

Second way allows to "joosify" the whole Ext hierarchy (see below)

Demo and test

To make sure that this extension work, we'll test it with "official Ext test suite" - its "examples" folder. We'll do it by replacing Ext.extend with Joose.Bridge.Ext.extend. So, step by step:

- Inserting joose.js (sources of Joose) to the top of ext-base.js
- Inserting Joose.Bridge.Ext sources right after the Joose, but before Ext.
- Changing Ext.extend refernce to Joose.Bridge.Ext.extend

After this preparations, each class in Ext hierarchy becomes Joose Class.

This result will be the demo and its available here:
http://symbie.org/sandbox/Ext22JoosifiedCopy/examples/samples.html

also as archive:
http://symbie.org/sandbox/Ext22JoosifiedCopy.tar.gz

These examples were slightly modified for testing:

http://symbie.org/sandbox/Ext22JoosifiedCopy/examples/window/hello.js
[note - deriving from standard Ext class with Role applied]

http://symbie.org/sandbox/Ext22JoosifiedCopy/examples/desktop/sample.js
[note - all Panels and Windows, were "Joosified" )]

Bug reports along with any ideas/suggestions are welcome.

tof
26 Dec 2008, 2:42 AM
This is great work !
Congrats.

I can't wait to play with it...

Btw, I prefer to include these JS files in this order, so I don't have to modify any ext file :


joose.js
ext-2.2/adapter/ext/ext-base.js
(your Ext Bridge File)
a file containing only :
Ext.extend = Joose.Bridge.Ext.extend
and at last ext-2.2/ext-all.js


Anyway, this seems to work very well.

Thanks again, a Lot.

SamuraiJack1
26 Dec 2008, 2:52 AM
Thanks )

Yeah, your deployment looks saner - I just wanted to Joosify the whole "examples" folder and that was the quick solution.

Will be great to hear about your experience with "Ext on Joose" ), I haven't play with it myself yet..

crp_spaeth
29 Dec 2008, 12:16 PM
I didn't hear about joose till now... Looks like a usefull conception. Can't wait to play with it.
Thanks you for sharing the bridge

tof
5 Jan 2009, 2:54 AM
Hi,

By now, the results of joose + ext are quite good !

There is a bug, however, with the "initialize" method, which should be called (constructor-like).

This works :

// new Class, no initialize method
Class("Foo", { } );

// sub class of Foo, with after-initialize
Class("Bar", {
isa : Foo,
after : {
initialize : function() {
console.log("Init of bar");
}
}
});

b = new Bar(); // Displays "Init of bar".

Of course, if Foo has an "initialize" method, it would be called before the "initialize" of Bar.


Now, the same when extending an ExtClass does not throw any error, but the initialize method is never called (whether used with "after", "before", "around" or "override" modifiers, even with "methods") :



Class("MyWindow", {
isa : Ext.Window,
after : {
// bug : never called !
initialize : function() { console.log("Init of my window"); }
}
});



Although, Ext.Window has an "initialize" method, which comes from the "addInitializer" method from joose.

Would you have some time to look at it ?

SamuraiJack1
5 Jan 2009, 3:15 AM
Glad to hear that!

About "initialize" - I specially removed the call to it and replaced it with call to parent's constructor (compare the defaultClassFunctionBody method of Joose.Class and Joose.ExtClass). The purpose was to follow the Ext spirit - there is an initComponent method in Ext with the same functionality.

But for now I think you are right, "initialize" is actually a constructor in Joose and calling it is an expecting behavior.
Try with this version:
http://extjs-ux.org/repo/authors/SamuraiJack/trunk/Joose/Bridge/Ext.js

tof
5 Jan 2009, 3:32 AM
About "initialize" - I specially removed the call to it and replaced it with call to parent's constructor (compare the defaultClassFunctionBody method of Joose.Class and Joose.ExtClass). The purpose was to follow the Ext spirit - there is an initComponent method in Ext with the same functionality.

But for now I think you are right, "initialize" is actually a constructor in Joose and calling it is an expecting behavior.

Actually I was thinking about this, too, but it applies only to components, it would be a problem for extending Ext.util.Observable, for example.



Try with this version:
http://extjs-ux.org/repo/authors/SamuraiJack/trunk/Joose/Bridge/Ext.js

Thanks, you're fast as a samurai !

tof
5 Jan 2009, 8:07 AM
After some tests, again, found a bug :/

It seems that the "if (parent) parent.apply(this, arguments);" line calls itself when a class inherits a class which inherits an ExtJs Class.

I've narrowed it to a simple :



Class("FooWindow", { isa : Ext.Window });
Class("BarWindow", { isa : FooWindow });
b = new BarWindow();


This throws a "Too much recursion", since parent keeps being "FooWindow" (or so it seems).

SamuraiJack1
5 Jan 2009, 8:43 AM
Thanks for pointing on this bug. Its now fixed and this example works (code from "Hello world" example):


ExtClass("FooWindow", { isa : Ext.Window });

ExtClass("BarWindow", { isa : FooWindow });

Ext.onReady(function(){
var win;
var button = Ext.get('show-btn');

button.on('click', function(){
// create the window on the first click and reuse on subsequent clicks
if(!win){
win = new BarWindow({
applyTo : 'hello-win',
layout : 'fit',
width : 500,
...
Latest version is here
http://extjs-ux.org/repo/authors/SamuraiJack/trunk/Joose/Bridge/Ext.js
Code in main trunk will be updated withing an hour.

The problem was that the "meta" property was used as a property of the object itself

var parent = this.meta.getSuperClass();- so during call to SuperClass's constructor it was the same..


I've corrected it to be used as a property of the constructor.

var parent = arguments.callee.meta.getSuperClass();

SamuraiJack1
5 Jan 2009, 8:58 AM
btw - can you please upload a skeleton of your deployment structure? - I'll include it in the 1st post as recommended usage and this will lower the entry barrier..

jmmills
13 Mar 2009, 2:55 AM
Hi there, really neat stuff.
I'm a big fan of both ExtJS and Moose (in the Perl world).
I've been using ExtJS for a while and have a pretty good idea on how to extend components to create custom (often application specific) components.
And I'm familiar with elements of Joose in relation to it's similarity to Moose, although I have to admit that I haven't done a whole lot of hacking with Joose yet.

I was wondering if you should me how you would for example using the Joose bridge provide a default value config value for an Ext component.
This isn't correct but I'm hoping you can decipher what I'm trying to get at through it:


Module('foo', function (m) {
ExtClass('Bar', {
isa: Ext.data.JsonStore,
has: {
root: {
is: 'ro',
init: 'beginofstuff'
}
});
);
What I'm trying to figure out how to do is provide default values for Ext class attributes via Joose.
Similar I think to setting default values via inherited attributes in Moose:


use Moose; extends 'SomeClass';
has '+someattr' => ( default => sub { 'stuff' } );
Thanks,
- J

SamuraiJack1
13 Mar 2009, 5:26 AM
Hi

This feature is not implemented yet. Currently superclass's (Ext.data.JsonStore) constructor will be called with the same arguments, as the subclass constructor (foo.Bar), and after that will be performed attributes initialization.

Probably I'll add this feature in next release of this bridge. It will be done against a new and muchly improved Joose kernel (http://joose-js.googlecode.com/svn/branches/mutability/). New kernel will be fully mutable, will have Roles implementation satisfying Traits spec (http://www.iam.unibe.ch/%7Escg/Archive/Papers/Scha03aTraits.pdf) (almost 1-to-1 compatible with Moose's one), and will have very advanced dependencies handling system (link1 (http://groups.google.com/group/joose-js/browse_thread/thread/90321e3e0daa3b1d), link2 (http://groups.google.com/group/joose-js/browse_thread/thread/62a2157b5636aa0e))

Stay tuned )

jmmills
13 Mar 2009, 5:36 AM
Hi

This feature is not implemented yet. Currently superclass's (Ext.data.JsonStore) constructor will be called with the same arguments, as the subclass constructor (foo.Bar), and after that will be performed attributes initialization.

Probably I'll add this feature in next release of this bridge. It will be done against a new and muchly improved Joose kernel (http://joose-js.googlecode.com/svn/branches/mutability/). New kernel will be fully mutable, will have Roles implementation satisfying Traits spec (http://www.iam.unibe.ch/%7Escg/Archive/Papers/Scha03aTraits.pdf) (almost 1-to-1 compatible with Moose's one), and will have very advanced dependencies handling system (link1 (http://groups.google.com/group/joose-js/browse_thread/thread/90321e3e0daa3b1d), link2 (http://groups.google.com/group/joose-js/browse_thread/thread/62a2157b5636aa0e))

Stay tuned )

Well okay, as a work around to providing immutable(ro) or at lease default constructor config attributes via the Joose bridge would you suggest maybe doing a 'before' on the constructor and setting default values there - or just use the Ext.extend() syntax (which would work with-out Joose 'suppose).

-J

SamuraiJack1
13 Mar 2009, 8:11 AM
Well, 'before' on constructor wouldn't work - its a system method, which do not allow modifiers.

Can you please specify what you are trying to achieve more detailed?
Actually the code snippet you posted

Module('foo', function (m) {
ExtClass('Bar', {
isa: Ext.data.JsonStore,
has: {
root: {
is: 'ro',
init: 'beginofstuff'
}
});
);will provide the default value 'beginofstuff' for 'root' property of 'foo.Bar' class - it will be installed into prototype. The same can be done with Ext.extend. Though it will not be a default property value in Joose terms - coz it will be a shared among all instances of class. To make it truly "default value" you need to wrap it in a function (like in Moose):


Module('foo', function (m) {
ExtClass('Bar', {
isa: Ext.data.JsonStore,
has: {
root: {
is: 'ro',
init: function (){ return 'beginofstuff' }
}
});
);but this notation will have no impact on Ext.data.JsonStore, because the actual initialization will be performed after the call to superclass constructor.

SamuraiJack1
20 Mar 2009, 8:31 AM
For those who are interested to know more about Roles and how they can be used here is an example:
http://www.extpaste.com/#2186
(taken from test file)

SamuraiJack1
22 Apr 2009, 1:46 AM
I'm glad to announce that new Joose kernel is ready (http://joose-js.blogspot.com/2009/04/joose-mutability-branch.html). It will be used in upcoming Joose 3, meanwhile early adopters are welcome )

Bridge from Ext to Joose was also updated. Its now from Ext3rc1 to Joose3 and can be obtained from:
http://joose-js.googlecode.com/svn/branches/mutability/
(dev version)

or

http://extjs-ux.org/docs/?class=JooseX.Bridge.Ext
(stable version)

Demo:
http://symbie.org/sandbox/Ext3rc1-on-Joose/examples/

SamuraiJack1
30 Sep 2009, 3:50 AM
Join the dedicated group:
http://www.extjs.com/forum/group.php?groupid=3

Welcome to IRC channel: #joose on freenode

SamuraiJack1
23 Dec 2009, 5:55 AM
Any questions about this extension can also be discussed on Joose forum:

http://joose.it/forum