You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@tapestry.apache.org by Hristo Stoyanov <ai...@yahoo.com.INVALID> on 2020/10/09 07:51:42 UTC
Fw: Communication between Tapestry and Angular(inside of an iframe)
Hello everyone!
I have been brought onboard to an Tapestry project(never heard of it before) and I would like to create a 'communication channel' between the tapestry and an iframe(displaying Angular application).
Both projects are on the same domain and the Angular app inside the iframe works as expected, but I would like to send data to the Angular project and vice versa.
I found out that you can communicate between parent window and iframe by using cross-document messaging (https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage)
My question is:
How could I possibly make an event listener inside Java? The javascript for doing so should look something like this "window.document.addEventListener("myEvent", 'JS function to handle', false);"
And also how to actually call a method inside Java from the JavaScript code.
I asked here and there and nobody was able to help me with that so far...
I will be very thankful if you can help me with that.
There is a small image that can helpfully help you understand my idea:
Thank you in advance!
Re: Communication between Tapestry and Angular(inside of an iframe)
Posted by Emmanuel Sowah <es...@gmail.com>.
That is a very good decision, Hristo. Probably even better is to ask your
company to re-write all that Tapestry shit in Angular. Tapestry is so
arcane and has a very few cult-like followers. Even the founder, Howard
Lewis Ship, realized how bad the framework is and is now using Angular on
all his projects.He abandoned this ship long ago.
On Sun, Oct 25, 2020 at 11:46 AM Hristo Stoyanov
<ai...@yahoo.com.invalid> wrote:
> Thank you everyone,
> I made an adjustment to the project and now the Angular project will not
> need to call tapestry code anymore.
>
> Thank you for the good help! :)
>
> Best regards
> On Wednesday, October 21, 2020, 04:08:16 PM GMT+2, Thiago H. de Paula
> Figueiredo <th...@gmail.com> wrote:
>
> On Fri, Oct 9, 2020 at 7:55 AM Dmitry Gusev <dm...@gmail.com>
> wrote:
>
> > Hi Hristo,
> >
>
> Hello, everyone!
>
>
> > > How could I possibly make an event listener inside Java?
> >
>
> Both options provided by Dmitry are good, but I'd prefer the Tapestry-only
> (i.e. not REST framework needed) one.
>
> If you're using Tapestry 5.4.2 or later, you don't even need to create and
> pass the event URL to JavaScript. Check the documentation at
>
> https://tapestry.apache.org/ajax-and-zones.html#AjaxandZones-Invokingserver-sideeventhandlermethodsfromJavaScript
> .
> If you're not using zones, dom.getEventUrl(eventName, null) will give you
> the URL for an event name in the page class.
>
> >
> > What events should the listener listen to, is it a client-side or
> > server-side event?
> >
> > To call Java methods from JS you usually build an API endpoint, i.e. with
> > Resteasy or GraphQL.
> > I presume you'll need access to the Tapestry context, you can use on of
> the
> > ready-to-use integrations,
> > e.g. http://www.tynamo.org/tapestry-resteasy+guide/
> >
> > Alternatively, if you need to call a Tapestry page/component and
> > potentially render some markup in response
> > you can generate an event link from the page/component and pass it to JS
> > via the initialiser, for example, in your page/component class:
> >
> > @Inject ComponentResources componentResources;
> >
> > public void afterRender()
> > {
> > JSONObject json = new JSONObject()
> >
> > .put("myEventURL",
> > componentResources.createEventLink("myEvent").toRedirectURI());
> >
> > // this will invoke a client-side function with arguments
> >
> > javaScriptSupport.require("myJSModule").invoke("myInit").with(json);
> > }
> >
> > @OnEvent("myEvent")
> > public void onMyEvent() {
> > // TODO Handle event on the server-side
> > }
> >
> > and then create META-INF/modules/myJSModule.js and put the following code
> > to receive the call on client-side:
> >
> > (function () {
> >
> > // you can define module dependencies if you need them
> > define(["t5/core/ajax"], function (ajax) {
> >
> > function init(spec) {
> > // read argument here, and when needed use the URL to call it
> > with `ajax`
> > alert(spec.myEventURL);
> > }
> >
> > return {
> > init: init
> > };
> > });
> > })();
> >
> >
> >
> >
> > On Fri, Oct 9, 2020 at 8:51 AM Hristo Stoyanov
> > <ai...@yahoo.com.invalid>
> > wrote:
> >
> > > Hello everyone!
> > >
> > > I have been brought onboard to an Tapestry project(never heard of it
> > > before) and I would like to create a 'communication channel' between
> the
> > > tapestry and an iframe(displaying Angular application).
> > >
> > > Both projects are on the same domain and the Angular app inside the
> > iframe
> > > works as expected, but I would like to send data to the Angular project
> > and
> > > vice versa.
> > >
> > > I found out that you can communicate between parent window and iframe
> by
> > > using cross-document messaging (
> > > https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage)
> > >
> > > My question is:
> > > How could I possibly make an event listener inside Java? The javascript
> > > for doing so should look something like this
> > > "window.document.addEventListener("myEvent", 'JS function to handle',
> > > false);"
> > > And also how to actually call a method inside Java from the JavaScript
> > > code.
> > >
> > > I asked here and there and nobody was able to help me with that so
> far...
> > > I will be very thankful if you can help me with that.
> > >
> > > There is a small image that can helpfully help you understand my idea:
> > > [image: Inline image]
> > >
> > > Thank you in advance!
> > >
> > > ---------------------------------------------------------------------
> > > To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> > > For additional commands, e-mail: users-help@tapestry.apache.org
> >
> >
> >
> > --
> > Dmitry Gusev
> >
> > AnjLab Team
> > http://anjlab.com
> >
>
>
> --
> Thiago
>
Re: Communication between Tapestry and Angular(inside of an iframe)
Posted by Hristo Stoyanov <ai...@yahoo.com.INVALID>.
Thank you everyone,
I made an adjustment to the project and now the Angular project will not need to call tapestry code anymore.
Thank you for the good help! :)
Best regards
On Wednesday, October 21, 2020, 04:08:16 PM GMT+2, Thiago H. de Paula Figueiredo <th...@gmail.com> wrote:
On Fri, Oct 9, 2020 at 7:55 AM Dmitry Gusev <dm...@gmail.com> wrote:
> Hi Hristo,
>
Hello, everyone!
> > How could I possibly make an event listener inside Java?
>
Both options provided by Dmitry are good, but I'd prefer the Tapestry-only
(i.e. not REST framework needed) one.
If you're using Tapestry 5.4.2 or later, you don't even need to create and
pass the event URL to JavaScript. Check the documentation at
https://tapestry.apache.org/ajax-and-zones.html#AjaxandZones-Invokingserver-sideeventhandlermethodsfromJavaScript.
If you're not using zones, dom.getEventUrl(eventName, null) will give you
the URL for an event name in the page class.
>
> What events should the listener listen to, is it a client-side or
> server-side event?
>
> To call Java methods from JS you usually build an API endpoint, i.e. with
> Resteasy or GraphQL.
> I presume you'll need access to the Tapestry context, you can use on of the
> ready-to-use integrations,
> e.g. http://www.tynamo.org/tapestry-resteasy+guide/
>
> Alternatively, if you need to call a Tapestry page/component and
> potentially render some markup in response
> you can generate an event link from the page/component and pass it to JS
> via the initialiser, for example, in your page/component class:
>
> @Inject ComponentResources componentResources;
>
> public void afterRender()
> {
> JSONObject json = new JSONObject()
>
> .put("myEventURL",
> componentResources.createEventLink("myEvent").toRedirectURI());
>
> // this will invoke a client-side function with arguments
>
> javaScriptSupport.require("myJSModule").invoke("myInit").with(json);
> }
>
> @OnEvent("myEvent")
> public void onMyEvent() {
> // TODO Handle event on the server-side
> }
>
> and then create META-INF/modules/myJSModule.js and put the following code
> to receive the call on client-side:
>
> (function () {
>
> // you can define module dependencies if you need them
> define(["t5/core/ajax"], function (ajax) {
>
> function init(spec) {
> // read argument here, and when needed use the URL to call it
> with `ajax`
> alert(spec.myEventURL);
> }
>
> return {
> init: init
> };
> });
> })();
>
>
>
>
> On Fri, Oct 9, 2020 at 8:51 AM Hristo Stoyanov
> <ai...@yahoo.com.invalid>
> wrote:
>
> > Hello everyone!
> >
> > I have been brought onboard to an Tapestry project(never heard of it
> > before) and I would like to create a 'communication channel' between the
> > tapestry and an iframe(displaying Angular application).
> >
> > Both projects are on the same domain and the Angular app inside the
> iframe
> > works as expected, but I would like to send data to the Angular project
> and
> > vice versa.
> >
> > I found out that you can communicate between parent window and iframe by
> > using cross-document messaging (
> > https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage)
> >
> > My question is:
> > How could I possibly make an event listener inside Java? The javascript
> > for doing so should look something like this
> > "window.document.addEventListener("myEvent", 'JS function to handle',
> > false);"
> > And also how to actually call a method inside Java from the JavaScript
> > code.
> >
> > I asked here and there and nobody was able to help me with that so far...
> > I will be very thankful if you can help me with that.
> >
> > There is a small image that can helpfully help you understand my idea:
> > [image: Inline image]
> >
> > Thank you in advance!
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> > For additional commands, e-mail: users-help@tapestry.apache.org
>
>
>
> --
> Dmitry Gusev
>
> AnjLab Team
> http://anjlab.com
>
--
Thiago
Re: Fw: Communication between Tapestry and Angular(inside of an iframe)
Posted by "Thiago H. de Paula Figueiredo" <th...@gmail.com>.
On Fri, Oct 9, 2020 at 7:55 AM Dmitry Gusev <dm...@gmail.com> wrote:
> Hi Hristo,
>
Hello, everyone!
> > How could I possibly make an event listener inside Java?
>
Both options provided by Dmitry are good, but I'd prefer the Tapestry-only
(i.e. not REST framework needed) one.
If you're using Tapestry 5.4.2 or later, you don't even need to create and
pass the event URL to JavaScript. Check the documentation at
https://tapestry.apache.org/ajax-and-zones.html#AjaxandZones-Invokingserver-sideeventhandlermethodsfromJavaScript.
If you're not using zones, dom.getEventUrl(eventName, null) will give you
the URL for an event name in the page class.
>
> What events should the listener listen to, is it a client-side or
> server-side event?
>
> To call Java methods from JS you usually build an API endpoint, i.e. with
> Resteasy or GraphQL.
> I presume you'll need access to the Tapestry context, you can use on of the
> ready-to-use integrations,
> e.g. http://www.tynamo.org/tapestry-resteasy+guide/
>
> Alternatively, if you need to call a Tapestry page/component and
> potentially render some markup in response
> you can generate an event link from the page/component and pass it to JS
> via the initialiser, for example, in your page/component class:
>
> @Inject ComponentResources componentResources;
>
> public void afterRender()
> {
> JSONObject json = new JSONObject()
>
> .put("myEventURL",
> componentResources.createEventLink("myEvent").toRedirectURI());
>
> // this will invoke a client-side function with arguments
>
> javaScriptSupport.require("myJSModule").invoke("myInit").with(json);
> }
>
> @OnEvent("myEvent")
> public void onMyEvent() {
> // TODO Handle event on the server-side
> }
>
> and then create META-INF/modules/myJSModule.js and put the following code
> to receive the call on client-side:
>
> (function () {
>
> // you can define module dependencies if you need them
> define(["t5/core/ajax"], function (ajax) {
>
> function init(spec) {
> // read argument here, and when needed use the URL to call it
> with `ajax`
> alert(spec.myEventURL);
> }
>
> return {
> init: init
> };
> });
> })();
>
>
>
>
> On Fri, Oct 9, 2020 at 8:51 AM Hristo Stoyanov
> <ai...@yahoo.com.invalid>
> wrote:
>
> > Hello everyone!
> >
> > I have been brought onboard to an Tapestry project(never heard of it
> > before) and I would like to create a 'communication channel' between the
> > tapestry and an iframe(displaying Angular application).
> >
> > Both projects are on the same domain and the Angular app inside the
> iframe
> > works as expected, but I would like to send data to the Angular project
> and
> > vice versa.
> >
> > I found out that you can communicate between parent window and iframe by
> > using cross-document messaging (
> > https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage)
> >
> > My question is:
> > How could I possibly make an event listener inside Java? The javascript
> > for doing so should look something like this
> > "window.document.addEventListener("myEvent", 'JS function to handle',
> > false);"
> > And also how to actually call a method inside Java from the JavaScript
> > code.
> >
> > I asked here and there and nobody was able to help me with that so far...
> > I will be very thankful if you can help me with that.
> >
> > There is a small image that can helpfully help you understand my idea:
> > [image: Inline image]
> >
> > Thank you in advance!
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> > For additional commands, e-mail: users-help@tapestry.apache.org
>
>
>
> --
> Dmitry Gusev
>
> AnjLab Team
> http://anjlab.com
>
--
Thiago
Re: Fw: Communication between Tapestry and Angular(inside of an iframe)
Posted by Dmitry Gusev <dm...@gmail.com>.
Hi Hristo,
This mailing list isn't allowing attachments, we cannot see it, so it's a
bit unclear what you need.
> How could I possibly make an event listener inside Java?
What events should the listener listen to, is it a client-side or
server-side event?
To call Java methods from JS you usually build an API endpoint, i.e. with
Resteasy or GraphQL.
I presume you'll need access to the Tapestry context, you can use on of the
ready-to-use integrations,
e.g. http://www.tynamo.org/tapestry-resteasy+guide/
Alternatively, if you need to call a Tapestry page/component and
potentially render some markup in response
you can generate an event link from the page/component and pass it to JS
via the initialiser, for example, in your page/component class:
@Inject ComponentResources componentResources;
public void afterRender()
{
JSONObject json = new JSONObject()
.put("myEventURL",
componentResources.createEventLink("myEvent").toRedirectURI());
// this will invoke a client-side function with arguments
javaScriptSupport.require("myJSModule").invoke("myInit").with(json);
}
@OnEvent("myEvent")
public void onMyEvent() {
// TODO Handle event on the server-side
}
and then create META-INF/modules/myJSModule.js and put the following code
to receive the call on client-side:
(function () {
// you can define module dependencies if you need them
define(["t5/core/ajax"], function (ajax) {
function init(spec) {
// read argument here, and when needed use the URL to call it
with `ajax`
alert(spec.myEventURL);
}
return {
init: init
};
});
})();
On Fri, Oct 9, 2020 at 8:51 AM Hristo Stoyanov <ai...@yahoo.com.invalid>
wrote:
> Hello everyone!
>
> I have been brought onboard to an Tapestry project(never heard of it
> before) and I would like to create a 'communication channel' between the
> tapestry and an iframe(displaying Angular application).
>
> Both projects are on the same domain and the Angular app inside the iframe
> works as expected, but I would like to send data to the Angular project and
> vice versa.
>
> I found out that you can communicate between parent window and iframe by
> using cross-document messaging (
> https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage)
>
> My question is:
> How could I possibly make an event listener inside Java? The javascript
> for doing so should look something like this
> "window.document.addEventListener("myEvent", 'JS function to handle',
> false);"
> And also how to actually call a method inside Java from the JavaScript
> code.
>
> I asked here and there and nobody was able to help me with that so far...
> I will be very thankful if you can help me with that.
>
> There is a small image that can helpfully help you understand my idea:
> [image: Inline image]
>
> Thank you in advance!
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> For additional commands, e-mail: users-help@tapestry.apache.org
--
Dmitry Gusev
AnjLab Team
http://anjlab.com