Home » Eclipse Projects » Remote Application Platform (RAP) » JS Libraries in RAP
| JS Libraries in RAP [message #39110] |
Tue, 17 July 2007 11:31  |
Eclipse User |
|
|
|
Originally posted by: andreasruempel.gmx.net
Hi,
I am experimenting with integrating a simple graphical editor in RAP.
Thererfore I wanted to include a javascript graphic library using the
resource mechanism. For little js-files containing custom widgets this
works fine, but e.g. using the Draw2d library
(http://www.openjacob.org/draw2d.html) causes (even without using its
functionality) the workbench not to appear in the browser window. There
is only the blue-white background visible. That is very bad, because
there is no js error message or log entry in the server console.
Does anyone have any experiences with js graphic libraries in connection
with RAP or knows about some further logging, so that the debugging
could become more convenient?
Thanks in advance.
Andi
|
|
| | |
| Re: JS Libraries in RAP [message #42161 is a reply to message #41331] |
Mon, 20 August 2007 06:43  |
| Eclipse User |
|
|
|
Originally posted by: andreasruempel.gmx.net
Hi,
I also thought about a naming conflict, but then I took the jsGraphics
library from Walter Zorn: http://walterzorn.de/jsgraphics/jsgraphics.htm
(it is also used by OpenJacob/Draw2D) to render my graphic primitives.
This works fine in some cases. The jsGraphics lib needs a kind of canvas
(a div element) specified to render into: "new jsGraphics(div_id);". I
simply passed an id (e.g. "w23") of a previously constructed RAP widget
for this purpose. In Firefox the lib-generated graphics are rendered
fine (in some of the cases), but in Opera it is never rendered.
In my eyes, the graphics rendering function depends on the existence of
the specified div element, but you cannot ensure this. It works only
"randomly" and looks like a race condition. In the "bad" cases the
graphics have no div element to be rendered into.
Does anybody see the chance to "force" the existence of a div element
representing a specific RAP widget or knows some other solution, to get
the described graphics rendering work?
Thanks!
Andi
FreeGroup schrieb:
> Hi,
>
> can you post your result.
>
> Maybe it is a problem of the namespace of the different JavaScript classes.
> Open-jACOB Draw2d has a class called Rectangle, Line, ArrayList....
> these classes are very common. Maybe it is possible to change the
> namespace of Draw2D.
>
> It is very interesting to integrate Draw2D into RAP......ok,ok it is
> absolute not compareable to the GEF/Draw2D!
> GEF/Draw2D is absolute greate!!
>
>
> greetings
>
> Andreas
>
>
> Andreas Rümpel schrieb:
>> Hi,
>>
>> I am experimenting with integrating a simple graphical editor in RAP.
>> Thererfore I wanted to include a javascript graphic library using the
>> resource mechanism. For little js-files containing custom widgets this
>> works fine, but e.g. using the Draw2d library
>> (http://www.openjacob.org/draw2d.html) causes (even without using its
>> functionality) the workbench not to appear in the browser window.
>> There is only the blue-white background visible. That is very bad,
>> because there is no js error message or log entry in the server console.
>>
>> Does anyone have any experiences with js graphic libraries in
>> connection with RAP or knows about some further logging, so that the
>> debugging could become more convenient?
>>
>> Thanks in advance.
>>
>> Andi
|
|
|
| Re: JS Libraries in RAP [message #42231 is a reply to message #42161] |
Mon, 20 August 2007 13:55 |
| Eclipse User |
|
|
|
Originally posted by: rherrmann.innoopract.com
Hi Andreas,
if I got your posting right, the main problem seems to be the id.
qooxdoo does mark its widgets with an (HTML) id attribute. You might
have seen some widget id's but these solely map server-side widget
instances to qooxdoo widgets (the JavaScript objects, not the
corresponding HTML elements).
To integrate a third-party component I would suggest to wrap it into a
qx.ui.embed.HtmlEmbed widget. Within the qooxdoo widget you can set an
id attribute and pass this to the third-party component.
The client-side code could look like this (no tested):
qx.Class.define("org.demo.Canvas", {
extend: qx.ui.embed.HtmlEmbed,
construct : function( canvasId ) {
this.base( arguments );
this.setHtml( "<div id=\"" + canvasId + "\" />" );
this.graphics = new jsGraphics( canvasId );
},
members {
drawLine : function( fromX, fromY, toX, toY ) {
// call whatever is required to draw a line on 'this.graphics'
}
}
...
}
However, this is just a raw sketch in the hope to get you started.
Cheers,
Rüdiger
Andreas Rümpel wrote:
> Hi,
>
> I also thought about a naming conflict, but then I took the jsGraphics
> library from Walter Zorn: http://walterzorn.de/jsgraphics/jsgraphics.htm
> (it is also used by OpenJacob/Draw2D) to render my graphic primitives.
> This works fine in some cases. The jsGraphics lib needs a kind of canvas
> (a div element) specified to render into: "new jsGraphics(div_id);". I
> simply passed an id (e.g. "w23") of a previously constructed RAP widget
> for this purpose. In Firefox the lib-generated graphics are rendered
> fine (in some of the cases), but in Opera it is never rendered.
>
> In my eyes, the graphics rendering function depends on the existence of
> the specified div element, but you cannot ensure this. It works only
> "randomly" and looks like a race condition. In the "bad" cases the
> graphics have no div element to be rendered into.
>
> Does anybody see the chance to "force" the existence of a div element
> representing a specific RAP widget or knows some other solution, to get
> the described graphics rendering work?
>
> Thanks!
>
> Andi
>
>
> FreeGroup schrieb:
>> Hi,
>>
>> can you post your result.
>>
>> Maybe it is a problem of the namespace of the different JavaScript
>> classes.
>> Open-jACOB Draw2d has a class called Rectangle, Line, ArrayList....
>> these classes are very common. Maybe it is possible to change the
>> namespace of Draw2D.
>>
>> It is very interesting to integrate Draw2D into RAP......ok,ok it is
>> absolute not compareable to the GEF/Draw2D!
>> GEF/Draw2D is absolute greate!!
>>
>>
>> greetings
>>
>> Andreas
>>
>>
>> Andreas Rümpel schrieb:
>>> Hi,
>>>
>>> I am experimenting with integrating a simple graphical editor in RAP.
>>> Thererfore I wanted to include a javascript graphic library using the
>>> resource mechanism. For little js-files containing custom widgets
>>> this works fine, but e.g. using the Draw2d library
>>> (http://www.openjacob.org/draw2d.html) causes (even without using its
>>> functionality) the workbench not to appear in the browser window.
>>> There is only the blue-white background visible. That is very bad,
>>> because there is no js error message or log entry in the server console.
>>>
>>> Does anyone have any experiences with js graphic libraries in
>>> connection with RAP or knows about some further logging, so that the
>>> debugging could become more convenient?
>>>
>>> Thanks in advance.
>>>
>>> Andi
|
|
|
| Re: JS Libraries in RAP [message #42259 is a reply to message #42231] |
Mon, 20 August 2007 14:07 |
| Eclipse User |
|
|
|
Originally posted by: rherrmann.innoopract.com
confuse the cat ... there is a mistake in the previous post:
qooxdoo does *not* mark its widgets with an (HTML) id attribute
(see the asterisk marked line below)
Sorry for the noise
Rüdiger
Rüdiger Herrmann wrote:
> Hi Andreas,
>
> if I got your posting right, the main problem seems to be the id.
> qooxdoo does ***not*** mark its widgets with an (HTML) id attribute. You might
> have seen some widget id's but these solely map server-side widget
> instances to qooxdoo widgets (the JavaScript objects, not the
> corresponding HTML elements).
> To integrate a third-party component I would suggest to wrap it into a
> qx.ui.embed.HtmlEmbed widget. Within the qooxdoo widget you can set an
> id attribute and pass this to the third-party component.
>
> The client-side code could look like this (no tested):
> qx.Class.define("org.demo.Canvas", {
> extend: qx.ui.embed.HtmlEmbed,
>
> construct : function( canvasId ) {
> this.base( arguments );
> this.setHtml( "<div id=\"" + canvasId + "\" />" );
>
> this.graphics = new jsGraphics( canvasId );
> },
>
> members {
> drawLine : function( fromX, fromY, toX, toY ) {
> // call whatever is required to draw a line on 'this.graphics'
> }
> }
>
> ...
> }
>
> However, this is just a raw sketch in the hope to get you started.
>
> Cheers,
> Rüdiger
>
>
>
> Andreas Rümpel wrote:
>> Hi,
>>
>> I also thought about a naming conflict, but then I took the jsGraphics
>> library from Walter Zorn:
>> http://walterzorn.de/jsgraphics/jsgraphics.htm (it is also used by
>> OpenJacob/Draw2D) to render my graphic primitives. This works fine in
>> some cases. The jsGraphics lib needs a kind of canvas (a div element)
>> specified to render into: "new jsGraphics(div_id);". I simply passed
>> an id (e.g. "w23") of a previously constructed RAP widget for this
>> purpose. In Firefox the lib-generated graphics are rendered fine (in
>> some of the cases), but in Opera it is never rendered.
>>
>> In my eyes, the graphics rendering function depends on the existence
>> of the specified div element, but you cannot ensure this. It works
>> only "randomly" and looks like a race condition. In the "bad" cases
>> the graphics have no div element to be rendered into.
>>
>> Does anybody see the chance to "force" the existence of a div element
>> representing a specific RAP widget or knows some other solution, to
>> get the described graphics rendering work?
>>
>> Thanks!
>>
>> Andi
>>
>>
>> FreeGroup schrieb:
>>> Hi,
>>>
>>> can you post your result.
>>>
>>> Maybe it is a problem of the namespace of the different JavaScript
>>> classes.
>>> Open-jACOB Draw2d has a class called Rectangle, Line, ArrayList....
>>> these classes are very common. Maybe it is possible to change the
>>> namespace of Draw2D.
>>>
>>> It is very interesting to integrate Draw2D into RAP......ok,ok it is
>>> absolute not compareable to the GEF/Draw2D!
>>> GEF/Draw2D is absolute greate!!
>>>
>>>
>>> greetings
>>>
>>> Andreas
>>>
>>>
>>> Andreas Rümpel schrieb:
>>>> Hi,
>>>>
>>>> I am experimenting with integrating a simple graphical editor in
>>>> RAP. Thererfore I wanted to include a javascript graphic library
>>>> using the resource mechanism. For little js-files containing custom
>>>> widgets this works fine, but e.g. using the Draw2d library
>>>> (http://www.openjacob.org/draw2d.html) causes (even without using
>>>> its functionality) the workbench not to appear in the browser
>>>> window. There is only the blue-white background visible. That is
>>>> very bad, because there is no js error message or log entry in the
>>>> server console.
>>>>
>>>> Does anyone have any experiences with js graphic libraries in
>>>> connection with RAP or knows about some further logging, so that the
>>>> debugging could become more convenient?
>>>>
>>>> Thanks in advance.
>>>>
>>>> Andi
|
|
|
| Re: JS Libraries in RAP [message #42310 is a reply to message #42231] |
Mon, 20 August 2007 14:13 |
| Eclipse User |
|
|
|
Originally posted by: andreasruempel.gmx.net
Hi,
thanks for the hint. I think the problem was, that I wanted to render
some graphical stuff while or directly after constructing the widget.
But when starting the rendering later, e.g. caused by a mouse event, the
graphics are rendered well in all browsers.
Andi
Rüdiger Herrmann wrote:
> Hi Andreas,
>
> if I got your posting right, the main problem seems to be the id.
> qooxdoo does mark its widgets with an (HTML) id attribute. You might
> have seen some widget id's but these solely map server-side widget
> instances to qooxdoo widgets (the JavaScript objects, not the
> corresponding HTML elements).
> To integrate a third-party component I would suggest to wrap it into a
> qx.ui.embed.HtmlEmbed widget. Within the qooxdoo widget you can set an
> id attribute and pass this to the third-party component.
>
> The client-side code could look like this (no tested):
> qx.Class.define("org.demo.Canvas", {
> extend: qx.ui.embed.HtmlEmbed,
>
> construct : function( canvasId ) {
> this.base( arguments );
> this.setHtml( "<div id=\"" + canvasId + "\" />" );
>
> this.graphics = new jsGraphics( canvasId );
> },
>
> members {
> drawLine : function( fromX, fromY, toX, toY ) {
> // call whatever is required to draw a line on 'this.graphics'
> }
> }
>
> ...
> }
>
> However, this is just a raw sketch in the hope to get you started.
>
> Cheers,
> Rüdiger
>
>
>
> Andreas Rümpel wrote:
>> Hi,
>>
>> I also thought about a naming conflict, but then I took the jsGraphics
>> library from Walter Zorn:
>> http://walterzorn.de/jsgraphics/jsgraphics.htm (it is also used by
>> OpenJacob/Draw2D) to render my graphic primitives. This works fine in
>> some cases. The jsGraphics lib needs a kind of canvas (a div element)
>> specified to render into: "new jsGraphics(div_id);". I simply passed
>> an id (e.g. "w23") of a previously constructed RAP widget for this
>> purpose. In Firefox the lib-generated graphics are rendered fine (in
>> some of the cases), but in Opera it is never rendered.
>>
>> In my eyes, the graphics rendering function depends on the existence
>> of the specified div element, but you cannot ensure this. It works
>> only "randomly" and looks like a race condition. In the "bad" cases
>> the graphics have no div element to be rendered into.
>>
>> Does anybody see the chance to "force" the existence of a div element
>> representing a specific RAP widget or knows some other solution, to
>> get the described graphics rendering work?
>>
>> Thanks!
>>
>> Andi
|
|
|
| Re: JS Libraries in RAP [message #42381 is a reply to message #42310] |
Tue, 21 August 2007 03:32 |
| Eclipse User |
|
|
|
Originally posted by: rherrmann.innoopract.com
when your code relies on the fact that a qooxdoo widget was created
completely, you might use a workaround like the on in the 'focus'
function in WidgetManager.js (starts in line 251).
Cheers
Rüdiger
Andreas Rümpel wrote:
> Hi,
>
> thanks for the hint. I think the problem was, that I wanted to render
> some graphical stuff while or directly after constructing the widget.
> But when starting the rendering later, e.g. caused by a mouse event, the
> graphics are rendered well in all browsers.
>
> Andi
>
>
> Rüdiger Herrmann wrote:
>> Hi Andreas,
>>
>> if I got your posting right, the main problem seems to be the id.
>> qooxdoo does mark its widgets with an (HTML) id attribute. You might
>> have seen some widget id's but these solely map server-side widget
>> instances to qooxdoo widgets (the JavaScript objects, not the
>> corresponding HTML elements).
>> To integrate a third-party component I would suggest to wrap it into a
>> qx.ui.embed.HtmlEmbed widget. Within the qooxdoo widget you can set an
>> id attribute and pass this to the third-party component.
>>
>> The client-side code could look like this (no tested):
>> qx.Class.define("org.demo.Canvas", {
>> extend: qx.ui.embed.HtmlEmbed,
>>
>> construct : function( canvasId ) {
>> this.base( arguments );
>> this.setHtml( "<div id=\"" + canvasId + "\" />" );
>>
>> this.graphics = new jsGraphics( canvasId );
>> },
>>
>> members {
>> drawLine : function( fromX, fromY, toX, toY ) {
>> // call whatever is required to draw a line on 'this.graphics'
>> }
>> }
>>
>> ...
>> }
>>
>> However, this is just a raw sketch in the hope to get you started.
>>
>> Cheers,
>> Rüdiger
>>
>>
>>
>> Andreas Rümpel wrote:
>>> Hi,
>>>
>>> I also thought about a naming conflict, but then I took the
>>> jsGraphics library from Walter Zorn:
>>> http://walterzorn.de/jsgraphics/jsgraphics.htm (it is also used by
>>> OpenJacob/Draw2D) to render my graphic primitives. This works fine in
>>> some cases. The jsGraphics lib needs a kind of canvas (a div element)
>>> specified to render into: "new jsGraphics(div_id);". I simply passed
>>> an id (e.g. "w23") of a previously constructed RAP widget for this
>>> purpose. In Firefox the lib-generated graphics are rendered fine (in
>>> some of the cases), but in Opera it is never rendered.
>>>
>>> In my eyes, the graphics rendering function depends on the existence
>>> of the specified div element, but you cannot ensure this. It works
>>> only "randomly" and looks like a race condition. In the "bad" cases
>>> the graphics have no div element to be rendered into.
>>>
>>> Does anybody see the chance to "force" the existence of a div element
>>> representing a specific RAP widget or knows some other solution, to
>>> get the described graphics rendering work?
>>>
>>> Thanks!
>>>
>>> Andi
|
|
| | | |
| Re: JS Libraries in RAP [message #45591 is a reply to message #42381] |
Thu, 06 September 2007 22:54 |
| Eclipse User |
|
|
|
Hi,
I attempt to create a widget use OpenJacob/Draw2D(with_namespace), There was
no Javascript errors and no figure was showed.
Waiting replys online, Thanks.
qx.Class.define( "org.eclipse.org.rap.rwt.draw2d.Draw2D", {
extend: qx.ui.embed.HtmlEmbed,
//extend: qx.ui.layout.CanvasLayout,
construct: function( id ) {
this.base( arguments );
this.setHtml( "<div id=\"" + id + "\" />" );
//this.setHtmlAttribute( "id", id );
this._id = id;
this._canvas = null;
},
destruct : function() {
},
members : {
load : function() {
qx.ui.core.Widget.flushGlobalQueues();
if( this._canvas == null ) {
this._canvas = new draw2d.Canvas( document.getElementById( this._id ) );
}
var canvas = this._canvas;
var oval= new draw2d.Oval();
oval.setDimension(100,40);
oval.setBackgroundColor(new draw2d.Color(255,0,0));
canvas.addFigure(oval,130,180);
},
}
} );
"R
|
|
|
| Re: JS Libraries in RAP [message #45651 is a reply to message #45591] |
Fri, 07 September 2007 04:30 |
| Eclipse User |
|
|
|
Hi, why don't you extend CanvasLayout insted of HtmlEmbed? I personaly had
more success with CanvasLayout when creating a widget. Also I don't know the
draw2d framework but wouldn't the following line
new draw2d.Canvas( document.getElementById( this._id ) );
be
new draw2d.Canvas( this._id );
Hope it helps.
Tiago
"toolang" <toolang@gmail.com> wrote in message
news:fbqeh9$a1r$1@build.eclipse.org...
> Hi,
>
> I attempt to create a widget use OpenJacob/Draw2D(with_namespace), There
> was no Javascript errors and no figure was showed.
> Waiting replys online, Thanks.
>
> qx.Class.define( "org.eclipse.org.rap.rwt.draw2d.Draw2D", {
> extend: qx.ui.embed.HtmlEmbed,
>
> //extend: qx.ui.layout.CanvasLayout,
>
> construct: function( id ) {
> this.base( arguments );
> this.setHtml( "<div id=\"" + id + "\" />" );
> //this.setHtmlAttribute( "id", id );
> this._id = id;
> this._canvas = null;
> },
>
> destruct : function() {
>
> },
>
> members : {
>
> load : function() {
> qx.ui.core.Widget.flushGlobalQueues();
> if( this._canvas == null ) {
> this._canvas = new draw2d.Canvas( document.getElementById(
> this._id ) );
> }
>
> var canvas = this._canvas;
> var oval= new draw2d.Oval();
> oval.setDimension(100,40);
> oval.setBackgroundColor(new draw2d.Color(255,0,0));
> canvas.addFigure(oval,130,180);
> },
> }
>
> } );
>
>
> "R
|
|
| |
| Re: JS Libraries in RAP [message #45710 is a reply to message #45591] |
Fri, 07 September 2007 09:14 |
| Eclipse User |
|
|
|
Originally posted by: rherrmann.innoopract.com
Hi,
just from reading the code there are two things that look suspicious.
First I would think you need to set the size and position of the
manually created div element. As it has no connection to qooxdoo you
also would have to resize it when the qooxdoo widget changes its size.
The JSDoc of draw2d lacks documentation for teh constructor but lists it
like "draw2d.Canvas( canvasId )". It seems that draw2d expects the
element id, not the element itself to be passed to the constructor:
this._canvas = new draw2d.Canvas( this._id ) );
Given this you could also switch back to using CanvasLayout as this
would free you from maintaining the size of your self-created div
element. Creating the draw2d Canvas then could look like this
this._canvas = new draw2d.Canvas( this.getElement() ) );
Cheers,
Rüdiger
toolang wrote:
> Hi,
>
> I attempt to create a widget use OpenJacob/Draw2D(with_namespace), There was
> no Javascript errors and no figure was showed.
> Waiting replys online, Thanks.
>
> qx.Class.define( "org.eclipse.org.rap.rwt.draw2d.Draw2D", {
> extend: qx.ui.embed.HtmlEmbed,
>
> //extend: qx.ui.layout.CanvasLayout,
>
> construct: function( id ) {
> this.base( arguments );
> this.setHtml( "<div id=\"" + id + "\" />" );
> //this.setHtmlAttribute( "id", id );
> this._id = id;
> this._canvas = null;
> },
>
> destruct : function() {
>
> },
>
> members : {
>
> load : function() {
> qx.ui.core.Widget.flushGlobalQueues();
> if( this._canvas == null ) {
> this._canvas = new draw2d.Canvas( document.getElementById( this._id ) );
> }
>
> var canvas = this._canvas;
> var oval= new draw2d.Oval();
> oval.setDimension(100,40);
> oval.setBackgroundColor(new draw2d.Color(255,0,0));
> canvas.addFigure(oval,130,180);
> },
> }
>
> } );
>
>
> "Rüdiger Herrmann" <rherrmann@innoopract.com> ????
> news:fae4f9$2f3$1@build.eclipse.org...
>> when your code relies on the fact that a qooxdoo widget was created
>> completely, you might use a workaround like the on in the 'focus' function
>> in WidgetManager.js (starts in line 251).
>>
>> Cheers
>> Rüdiger
>>
>>
>> Andreas Rümpel wrote:
>>> Hi,
>>>
>>> thanks for the hint. I think the problem was, that I wanted to render
>>> some graphical stuff while or directly after constructing the widget. But
>>> when starting the rendering later, e.g. caused by a mouse event, the
>>> graphics are rendered well in all browsers.
>>>
>>> Andi
>>>
>>>
>>> Rüdiger Herrmann wrote:
>>>> Hi Andreas,
>>>>
>>>> if I got your posting right, the main problem seems to be the id.
>>>> qooxdoo does mark its widgets with an (HTML) id attribute. You might
>>>> have seen some widget id's but these solely map server-side widget
>>>> instances to qooxdoo widgets (the JavaScript objects, not the
>>>> corresponding HTML elements).
>>>> To integrate a third-party component I would suggest to wrap it into a
>>>> qx.ui.embed.HtmlEmbed widget. Within the qooxdoo widget you can set an
>>>> id attribute and pass this to the third-party component.
>>>>
>>>> The client-side code could look like this (no tested):
>>>> qx.Class.define("org.demo.Canvas", {
>>>> extend: qx.ui.embed.HtmlEmbed,
>>>>
>>>> construct : function( canvasId ) {
>>>> this.base( arguments );
>>>> this.setHtml( "<div id=\"" + canvasId + "\" />" );
>>>>
>>>> this.graphics = new jsGraphics( canvasId );
>>>> },
>>>>
>>>> members {
>>>> drawLine : function( fromX, fromY, toX, toY ) {
>>>> // call whatever is required to draw a line on 'this.graphics'
>>>> }
>>>> }
>>>>
>>>> ...
>>>> }
>>>>
>>>> However, this is just a raw sketch in the hope to get you started.
>>>>
>>>> Cheers,
>>>> Rüdiger
>>>>
>>>>
>>>>
>>>> Andreas Rümpel wrote:
>>>>> Hi,
>>>>>
>>>>> I also thought about a naming conflict, but then I took the jsGraphics
>>>>> library from Walter Zorn:
>>>>> http://walterzorn.de/jsgraphics/jsgraphics.htm (it is also used by
>>>>> OpenJacob/Draw2D) to render my graphic primitives. This works fine in
>>>>> some cases. The jsGraphics lib needs a kind of canvas (a div element)
>>>>> specified to render into: "new jsGraphics(div_id);". I simply passed an
>>>>> id (e.g. "w23") of a previously constructed RAP widget for this
>>>>> purpose. In Firefox the lib-generated graphics are rendered fine (in
>>>>> some of the cases), but in Opera it is never rendered.
>>>>>
>>>>> In my eyes, the graphics rendering function depends on the existence of
>>>>> the specified div element, but you cannot ensure this. It works only
>>>>> "randomly" and looks like a race condition. In the "bad" cases the
>>>>> graphics have no div element to be rendered into.
>>>>>
>>>>> Does anybody see the chance to "force" the existence of a div element
>>>>> representing a specific RAP widget or knows some other solution, to get
>>>>> the described graphics rendering work?
>>>>>
>>>>> Thanks!
>>>>>
>>>>> Andi
>
>
|
|
|
| Re: JS Libraries in RAP [message #45740 is a reply to message #45710] |
Fri, 07 September 2007 09:19 |
| Eclipse User |
|
|
|
Originally posted by: rherrmann.innoopract.com
sorry, there is a mistake in the previous post. Please see below.
Rüdiger Herrmann wrote:
> Hi,
>
> just from reading the code there are two things that look suspicious.
> First I would think you need to set the size and position of the
> manually created div element. As it has no connection to qooxdoo you
> also would have to resize it when the qooxdoo widget changes its size.
> The JSDoc of draw2d lacks documentation for teh constructor but lists it
> like "draw2d.Canvas( canvasId )". It seems that draw2d expects the
> element id, not the element itself to be passed to the constructor:
> this._canvas = new draw2d.Canvas( this._id ) );
> Given this you could also switch back to using CanvasLayout as this
> would free you from maintaining the size of your self-created div
> element. Creating the draw2d Canvas then could look like this
> this._canvas = new draw2d.Canvas( this.getElement() ) );
the line above is wrong, instead:
this.setHtmlProperty( "id", this._id );
this._canvas = new draw2d.Canvas( this._id );
>
> Cheers,
> Rüdiger
>
> toolang wrote:
>> Hi,
>>
>> I attempt to create a widget use OpenJacob/Draw2D(with_namespace),
>> There was no Javascript errors and no figure was showed.
>> Waiting replys online, Thanks.
>>
>> qx.Class.define( "org.eclipse.org.rap.rwt.draw2d.Draw2D", {
>> extend: qx.ui.embed.HtmlEmbed,
>>
>> //extend: qx.ui.layout.CanvasLayout,
>>
>> construct: function( id ) {
>> this.base( arguments );
>> this.setHtml( "<div id=\"" + id + "\" />" );
>> //this.setHtmlAttribute( "id", id );
>> this._id = id;
>> this._canvas = null;
>> },
>>
>> destruct : function() {
>>
>> },
>>
>> members : {
>>
>> load : function() {
>> qx.ui.core.Widget.flushGlobalQueues();
>> if( this._canvas == null ) {
>> this._canvas = new draw2d.Canvas( document.getElementById(
>> this._id ) );
>> }
>>
>> var canvas = this._canvas;
>> var oval= new draw2d.Oval();
>> oval.setDimension(100,40);
>> oval.setBackgroundColor(new draw2d.Color(255,0,0));
>> canvas.addFigure(oval,130,180);
>> },
>> }
>>
>> } );
>>
>>
>> "Rüdiger Herrmann" <rherrmann@innoopract.com> ????
>> news:fae4f9$2f3$1@build.eclipse.org...
>>> when your code relies on the fact that a qooxdoo widget was created
>>> completely, you might use a workaround like the on in the 'focus'
>>> function in WidgetManager.js (starts in line 251).
>>>
>>> Cheers
>>> Rüdiger
>>>
>>>
>>> Andreas Rümpel wrote:
>>>> Hi,
>>>>
>>>> thanks for the hint. I think the problem was, that I wanted to
>>>> render some graphical stuff while or directly after constructing the
>>>> widget. But when starting the rendering later, e.g. caused by a
>>>> mouse event, the graphics are rendered well in all browsers.
>>>>
>>>> Andi
>>>>
>>>>
>>>> Rüdiger Herrmann wrote:
>>>>> Hi Andreas,
>>>>>
>>>>> if I got your posting right, the main problem seems to be the id.
>>>>> qooxdoo does mark its widgets with an (HTML) id attribute. You might
>>>>> have seen some widget id's but these solely map server-side widget
>>>>> instances to qooxdoo widgets (the JavaScript objects, not the
>>>>> corresponding HTML elements).
>>>>> To integrate a third-party component I would suggest to wrap it
>>>>> into a qx.ui.embed.HtmlEmbed widget. Within the qooxdoo widget you
>>>>> can set an id attribute and pass this to the third-party component.
>>>>>
>>>>> The client-side code could look like this (no tested):
>>>>> qx.Class.define("org.demo.Canvas", {
>>>>> extend: qx.ui.embed.HtmlEmbed,
>>>>>
>>>>> construct : function( canvasId ) {
>>>>> this.base( arguments );
>>>>> this.setHtml( "<div id=\"" + canvasId + "\" />" );
>>>>>
>>>>> this.graphics = new jsGraphics( canvasId );
>>>>> },
>>>>>
>>>>> members {
>>>>> drawLine : function( fromX, fromY, toX, toY ) {
>>>>> // call whatever is required to draw a line on 'this.graphics'
>>>>> }
>>>>> }
>>>>>
>>>>> ...
>>>>> }
>>>>>
>>>>> However, this is just a raw sketch in the hope to get you started.
>>>>>
>>>>> Cheers,
>>>>> Rüdiger
>>>>>
>>>>>
>>>>>
>>>>> Andreas Rümpel wrote:
>>>>>> Hi,
>>>>>>
>>>>>> I also thought about a naming conflict, but then I took the
>>>>>> jsGraphics library from Walter Zorn:
>>>>>> http://walterzorn.de/jsgraphics/jsgraphics.htm (it is also used by
>>>>>> OpenJacob/Draw2D) to render my graphic primitives. This works fine
>>>>>> in some cases. The jsGraphics lib needs a kind of canvas (a div
>>>>>> element) specified to render into: "new jsGraphics(div_id);". I
>>>>>> simply passed an id (e.g. "w23") of a previously constructed RAP
>>>>>> widget for this purpose. In Firefox the lib-generated graphics are
>>>>>> rendered fine (in some of the cases), but in Opera it is never
>>>>>> rendered.
>>>>>>
>>>>>> In my eyes, the graphics rendering function depends on the
>>>>>> existence of the specified div element, but you cannot ensure
>>>>>> this. It works only "randomly" and looks like a race condition. In
>>>>>> the "bad" cases the graphics have no div element to be rendered into.
>>>>>>
>>>>>> Does anybody see the chance to "force" the existence of a div
>>>>>> element representing a specific RAP widget or knows some other
>>>>>> solution, to get the described graphics rendering work?
>>>>>>
>>>>>> Thanks!
>>>>>>
>>>>>> Andi
>>
>>
|
|
|
| Re: JS Libraries in RAP [message #47324 is a reply to message #45591] |
Mon, 17 September 2007 13:28 |
| Eclipse User |
|
|
|
Originally posted by: andreasruempel.gmx.net
Hi toolang,
I found a quite good solution for my graphical editor problem and maybe
it is also helpful for you.
First, I created a canvas widget extending qx.ui.layout.CanvasLayout and
gave it a special unique id using setHtmlAttribute(). Then, invisible
container widgets (also extending qx.ui.layout.CanvasLayout) are created
having special incremental ids. Those ids of the container widgets are
used to render the jsGraphics-shapes (from the wz library, that is used
in OpenJacob/Draw2D) into. Each of the containers is added via add() to
the "canvas". The trick is to "pool" one container in advance before the
next "graphical widget" is created, so that the graphics library can
render in the previously generated "container div" whose existence is
ensured then. This works, because the creation of the graphical widgets
in my application is triggered by mouse interaction. So the container
widgets have the "time they need" to be created as DIV elements, whose
existence is required by the graphical library.
The widget structure is the following:
canvas DIV with id="canvas"
+--container DIV with id="foobar1"
| +--graphical shape DIVs generated by library
+--container DIV with id="foobar2"
| +--graphical shape DIVs generated by library
....
"foobar1" is created during initialization. When the contents for
"foobar1" should be placed, it is existing already and in the same step
the "foobar2"-DIV is being prepared for its future contents.
Andi
|
|
|
Goto Forum:
Current Time: Sun May 11 20:04:10 EDT 2025
Powered by FUDForum. Page generated in 0.04941 seconds |
Home