You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@tapestry.apache.org by ccureau <cm...@gmail.com> on 2012/08/20 04:59:47 UTC

javascript component questions

I have created a new component based on freecalendar and inserted it into the
tapestry5-jquery tree.  For those who work with that project, it is
implemented in much the same way as the google calendar component.  I'm
happy with my progress, but I need to pass a lot of parameters to the
javascript code with the AfterRender parameter.

I'm thinking that I need to either make the component into an abstract class
or do some other magic to pass variables such as calendar event location
URL, headers, and whatever else needed for the initial rendering.  I'm just
not sure at this point how to do that.  

If anyone has some suggestions, I'd be quite happy to hear them.

Thanks!



--
View this message in context: http://tapestry.1045711.n5.nabble.com/javascript-component-questions-tp5715582.html
Sent from the Tapestry - User mailing list archive at Nabble.com.

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org


Re: javascript component questions

Posted by Chris Cureau <cm...@gmail.com>.
Sorry...probably do need to be more specific.  It was late last night and I
was already frustrated with it...

Lots of parameters == items that need to be specific to the page being
rendered at the time rather than common to all components of type
freecalendar.  For example, each page will probably need a different event
source.  A person may want to arrange the header on the calendar
differently on different pages.  Different colors could be requested for
different types of events.  There's a myriad of options available.

Trouble is, a lot of this needs to be set up during the afterRender portion
of the component.  That basically removes the hard coding option.  I have
been passing them in afterRender, and I'll need to keep doing that I'm
sure.  My problem is that for each bit that is specific to the instance of
fullcalendar for that page (lets say event source for the sake of the
argument), I need to pass that information from the page to the component
so it can be included in the afterRender function.

So that's really my question in a nutshell...how do I get my parameters
passed to the component when I am not instantiating the component?

On Mon, Aug 20, 2012 at 8:17 AM, Ray Nicholus <rn...@widen.com> wrote:

> What is the problem with passing "a lot" of parameters into your javascript
> in afterRender()?  Maybe I'm just not sure what your specific question is.
>  You have several ways to pick up such values in your javascript, such as:
>
>
>    1. Pass them in afterRender using JavascriptSupport.
>    2. Hardcode them in your js
>    3. Make use of data attributes on associated elements, and reference
>    these values using jQuery's data function
>
>
>
> On Sun, Aug 19, 2012 at 9:59 PM, ccureau <cm...@gmail.com> wrote:
>
> > I have created a new component based on freecalendar and inserted it into
> > the
> > tapestry5-jquery tree.  For those who work with that project, it is
> > implemented in much the same way as the google calendar component.  I'm
> > happy with my progress, but I need to pass a lot of parameters to the
> > javascript code with the AfterRender parameter.
> >
> > I'm thinking that I need to either make the component into an abstract
> > class
> > or do some other magic to pass variables such as calendar event location
> > URL, headers, and whatever else needed for the initial rendering.  I'm
> just
> > not sure at this point how to do that.
> >
> > If anyone has some suggestions, I'd be quite happy to hear them.
> >
> > Thanks!
> >
> >
> >
> > --
> > View this message in context:
> >
> http://tapestry.1045711.n5.nabble.com/javascript-component-questions-tp5715582.html
> > Sent from the Tapestry - User mailing list archive at Nabble.com.
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> > For additional commands, e-mail: users-help@tapestry.apache.org
> >
> >
>

Re: javascript component questions

Posted by Ray Nicholus <rn...@widen.com>.
What is the problem with passing "a lot" of parameters into your javascript
in afterRender()?  Maybe I'm just not sure what your specific question is.
 You have several ways to pick up such values in your javascript, such as:


   1. Pass them in afterRender using JavascriptSupport.
   2. Hardcode them in your js
   3. Make use of data attributes on associated elements, and reference
   these values using jQuery's data function



On Sun, Aug 19, 2012 at 9:59 PM, ccureau <cm...@gmail.com> wrote:

> I have created a new component based on freecalendar and inserted it into
> the
> tapestry5-jquery tree.  For those who work with that project, it is
> implemented in much the same way as the google calendar component.  I'm
> happy with my progress, but I need to pass a lot of parameters to the
> javascript code with the AfterRender parameter.
>
> I'm thinking that I need to either make the component into an abstract
> class
> or do some other magic to pass variables such as calendar event location
> URL, headers, and whatever else needed for the initial rendering.  I'm just
> not sure at this point how to do that.
>
> If anyone has some suggestions, I'd be quite happy to hear them.
>
> Thanks!
>
>
>
> --
> View this message in context:
> http://tapestry.1045711.n5.nabble.com/javascript-component-questions-tp5715582.html
> Sent from the Tapestry - User mailing list archive at Nabble.com.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> For additional commands, e-mail: users-help@tapestry.apache.org
>
>

Re: javascript component questions

Posted by Chris Cureau <cm...@gmail.com>.
Emmanuel,

This will work very well for the events, provided as you said they come
from the same location throughout the application.  For my current project
they will be.  Thanks!

I'd still like to figure out an easy (read: lazy programmer ;) ) way to get
the dynamic settings included in the afterRender function.  I'd love to be
able to do something like

FullCalendar fc = new FullCalendar;
fc.setHeader(...);
fc.setEventLocation(...);

and so on.  I still need to figure out how to get a JSONObject from a page
class sent to the component class...wasn't able to work on it last night.

Cheers,
Chris

On Tue, Aug 21, 2012 at 2:13 AM, Emmanuel DEMEY <de...@gmail.com>wrote:

> Hi Chris,
>
> At the same time, a not well-known feature of Tapestry5-jQuery. If you want
> to specify a default JSONObject for your fullcalendar (that will be used
> for each fullcalendar), you should contribute to the WidgetParams service
> in your AppModule :
> Please have a look to the AppModule of the demo website :
>
> https://github.com/got5/tapestry5-jquery-demo/blob/master/src/main/java/org/got5/tapestry5/jquery/services/AppModule.java
>
>
> This default JSON will be merged with the one that you will define as a
> parameter of your component.
>
> Emmanuel
>
> 2012/8/20 Chris Cureau <cm...@gmail.com>
>
> > Thanks, François...that might solve the issue.  I want to contribute this
> > back to tapestry5-jquery, and the easier I can make it to use the better
> > IMHO.
> >
> > This component is created from fullcalendar (
> > http://arshaw.com/fullcalendar/).
> > It's a javascript utility that displays a calendar in the browser and
> > allows the programmer to write code to interact with it.  As it comes, it
> > only gives enough functionality to display events (json, xml, or google
> > calendar with additional javascript) but it gives the hooks necessary to
> > allow for a good amount of customization.  Exactly the component I need
> for
> > a scheduling utility.
> >
> > I think I mistakenly typed freecalendar instead of fullcalendar
> > earlier...my apologies. :)
> >
> > On Mon, Aug 20, 2012 at 9:17 AM, François Facon <francois.facon@atos.net
> > >wrote:
> >
> > > Hi Chris,
> > >
> > > In order to avoid having so much makup in your tml you can generate a
> > > JSon array in java class and pass it as property  to your calendar
> > > component parameter.
> > >
> > > By way could you give us more details about the jQuery plugin you are
> > > using?
> > >
> > >
> > > Regards
> > > François
> > >
> > > 2012/8/20 Chris Cureau <cm...@gmail.com>:
> > > > I could do this, yes...I guess I was just trying to avoid having
> quite
> > so
> > > > much markup in the tml file...
> > > >
> > > > On Mon, Aug 20, 2012 at 8:34 AM, trsvax <tr...@gmail.com> wrote:
> > > >
> > > >> Most jQuery components can be implemented by simply extending the
> > Widget
> > > >> mixin
> > > >>
> > > >> for example
> > > >>
> > > >> @Import (library={"your js file"})
> > > >> public Class FreeCalendar extends Widget {
> > > >> }
> > > >>
> > > >> Then in your tml file
> > > >>
> > > >> <t:any mixins="FreeCalendar" options="JSON String of options"/>
> > > >>
> > > >>
> > > >>
> > > >>
> > > >> --
> > > >> View this message in context:
> > > >>
> > >
> >
> http://tapestry.1045711.n5.nabble.com/javascript-component-questions-tp5715582p5715594.html
> > > >> Sent from the Tapestry - User mailing list archive at Nabble.com.
> > > >>
> > > >>
> ---------------------------------------------------------------------
> > > >> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> > > >> For additional commands, e-mail: users-help@tapestry.apache.org
> > > >>
> > > >>
> > >
> > > ---------------------------------------------------------------------
> > > To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> > > For additional commands, e-mail: users-help@tapestry.apache.org
> > >
> > >
> >
>
>
>
> --
> Emmanuel DEMEY
> Ingénieur Etude et Développement
> ATOS Worldline
> +33 (0)6 47 47 42 02
> demey.emmanuel@gmail.com
> http://emmanueldemey.fr/
>
> Twitter : @EmmanuelDemey
>

Re: javascript component questions

Posted by Chris Cureau <cm...@gmail.com>.
I just read Emmanuel's reply a second time...sharing the JSONObject between
all Component instances as he has described will do pretty much just what I
was looking for without having to pass the JSONObject.  Not enough coffee
yet. :)  Sorry for the chatter...

On Tue, Aug 21, 2012 at 2:13 AM, Emmanuel DEMEY <de...@gmail.com>wrote:

> Hi Chris,
>
> At the same time, a not well-known feature of Tapestry5-jQuery. If you want
> to specify a default JSONObject for your fullcalendar (that will be used
> for each fullcalendar), you should contribute to the WidgetParams service
> in your AppModule :
> Please have a look to the AppModule of the demo website :
>
> https://github.com/got5/tapestry5-jquery-demo/blob/master/src/main/java/org/got5/tapestry5/jquery/services/AppModule.java
>
>
> This default JSON will be merged with the one that you will define as a
> parameter of your component.
>
> Emmanuel
>
> 2012/8/20 Chris Cureau <cm...@gmail.com>
>
> > Thanks, François...that might solve the issue.  I want to contribute this
> > back to tapestry5-jquery, and the easier I can make it to use the better
> > IMHO.
> >
> > This component is created from fullcalendar (
> > http://arshaw.com/fullcalendar/).
> > It's a javascript utility that displays a calendar in the browser and
> > allows the programmer to write code to interact with it.  As it comes, it
> > only gives enough functionality to display events (json, xml, or google
> > calendar with additional javascript) but it gives the hooks necessary to
> > allow for a good amount of customization.  Exactly the component I need
> for
> > a scheduling utility.
> >
> > I think I mistakenly typed freecalendar instead of fullcalendar
> > earlier...my apologies. :)
> >
> > On Mon, Aug 20, 2012 at 9:17 AM, François Facon <francois.facon@atos.net
> > >wrote:
> >
> > > Hi Chris,
> > >
> > > In order to avoid having so much makup in your tml you can generate a
> > > JSon array in java class and pass it as property  to your calendar
> > > component parameter.
> > >
> > > By way could you give us more details about the jQuery plugin you are
> > > using?
> > >
> > >
> > > Regards
> > > François
> > >
> > > 2012/8/20 Chris Cureau <cm...@gmail.com>:
> > > > I could do this, yes...I guess I was just trying to avoid having
> quite
> > so
> > > > much markup in the tml file...
> > > >
> > > > On Mon, Aug 20, 2012 at 8:34 AM, trsvax <tr...@gmail.com> wrote:
> > > >
> > > >> Most jQuery components can be implemented by simply extending the
> > Widget
> > > >> mixin
> > > >>
> > > >> for example
> > > >>
> > > >> @Import (library={"your js file"})
> > > >> public Class FreeCalendar extends Widget {
> > > >> }
> > > >>
> > > >> Then in your tml file
> > > >>
> > > >> <t:any mixins="FreeCalendar" options="JSON String of options"/>
> > > >>
> > > >>
> > > >>
> > > >>
> > > >> --
> > > >> View this message in context:
> > > >>
> > >
> >
> http://tapestry.1045711.n5.nabble.com/javascript-component-questions-tp5715582p5715594.html
> > > >> Sent from the Tapestry - User mailing list archive at Nabble.com.
> > > >>
> > > >>
> ---------------------------------------------------------------------
> > > >> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> > > >> For additional commands, e-mail: users-help@tapestry.apache.org
> > > >>
> > > >>
> > >
> > > ---------------------------------------------------------------------
> > > To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> > > For additional commands, e-mail: users-help@tapestry.apache.org
> > >
> > >
> >
>
>
>
> --
> Emmanuel DEMEY
> Ingénieur Etude et Développement
> ATOS Worldline
> +33 (0)6 47 47 42 02
> demey.emmanuel@gmail.com
> http://emmanueldemey.fr/
>
> Twitter : @EmmanuelDemey
>

Re: javascript component questions

Posted by Emmanuel DEMEY <de...@gmail.com>.
Hi Chris,

At the same time, a not well-known feature of Tapestry5-jQuery. If you want
to specify a default JSONObject for your fullcalendar (that will be used
for each fullcalendar), you should contribute to the WidgetParams service
in your AppModule :
Please have a look to the AppModule of the demo website :
https://github.com/got5/tapestry5-jquery-demo/blob/master/src/main/java/org/got5/tapestry5/jquery/services/AppModule.java


This default JSON will be merged with the one that you will define as a
parameter of your component.

Emmanuel

2012/8/20 Chris Cureau <cm...@gmail.com>

> Thanks, François...that might solve the issue.  I want to contribute this
> back to tapestry5-jquery, and the easier I can make it to use the better
> IMHO.
>
> This component is created from fullcalendar (
> http://arshaw.com/fullcalendar/).
> It's a javascript utility that displays a calendar in the browser and
> allows the programmer to write code to interact with it.  As it comes, it
> only gives enough functionality to display events (json, xml, or google
> calendar with additional javascript) but it gives the hooks necessary to
> allow for a good amount of customization.  Exactly the component I need for
> a scheduling utility.
>
> I think I mistakenly typed freecalendar instead of fullcalendar
> earlier...my apologies. :)
>
> On Mon, Aug 20, 2012 at 9:17 AM, François Facon <francois.facon@atos.net
> >wrote:
>
> > Hi Chris,
> >
> > In order to avoid having so much makup in your tml you can generate a
> > JSon array in java class and pass it as property  to your calendar
> > component parameter.
> >
> > By way could you give us more details about the jQuery plugin you are
> > using?
> >
> >
> > Regards
> > François
> >
> > 2012/8/20 Chris Cureau <cm...@gmail.com>:
> > > I could do this, yes...I guess I was just trying to avoid having quite
> so
> > > much markup in the tml file...
> > >
> > > On Mon, Aug 20, 2012 at 8:34 AM, trsvax <tr...@gmail.com> wrote:
> > >
> > >> Most jQuery components can be implemented by simply extending the
> Widget
> > >> mixin
> > >>
> > >> for example
> > >>
> > >> @Import (library={"your js file"})
> > >> public Class FreeCalendar extends Widget {
> > >> }
> > >>
> > >> Then in your tml file
> > >>
> > >> <t:any mixins="FreeCalendar" options="JSON String of options"/>
> > >>
> > >>
> > >>
> > >>
> > >> --
> > >> View this message in context:
> > >>
> >
> http://tapestry.1045711.n5.nabble.com/javascript-component-questions-tp5715582p5715594.html
> > >> Sent from the Tapestry - User mailing list archive at Nabble.com.
> > >>
> > >> ---------------------------------------------------------------------
> > >> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> > >> For additional commands, e-mail: users-help@tapestry.apache.org
> > >>
> > >>
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> > For additional commands, e-mail: users-help@tapestry.apache.org
> >
> >
>



-- 
Emmanuel DEMEY
Ingénieur Etude et Développement
ATOS Worldline
+33 (0)6 47 47 42 02
demey.emmanuel@gmail.com
http://emmanueldemey.fr/

Twitter : @EmmanuelDemey

Re: javascript component questions

Posted by Chris Cureau <cm...@gmail.com>.
Thanks, François...that might solve the issue.  I want to contribute this
back to tapestry5-jquery, and the easier I can make it to use the better
IMHO.

This component is created from fullcalendar (http://arshaw.com/fullcalendar/).
It's a javascript utility that displays a calendar in the browser and
allows the programmer to write code to interact with it.  As it comes, it
only gives enough functionality to display events (json, xml, or google
calendar with additional javascript) but it gives the hooks necessary to
allow for a good amount of customization.  Exactly the component I need for
a scheduling utility.

I think I mistakenly typed freecalendar instead of fullcalendar
earlier...my apologies. :)

On Mon, Aug 20, 2012 at 9:17 AM, François Facon <fr...@atos.net>wrote:

> Hi Chris,
>
> In order to avoid having so much makup in your tml you can generate a
> JSon array in java class and pass it as property  to your calendar
> component parameter.
>
> By way could you give us more details about the jQuery plugin you are
> using?
>
>
> Regards
> François
>
> 2012/8/20 Chris Cureau <cm...@gmail.com>:
> > I could do this, yes...I guess I was just trying to avoid having quite so
> > much markup in the tml file...
> >
> > On Mon, Aug 20, 2012 at 8:34 AM, trsvax <tr...@gmail.com> wrote:
> >
> >> Most jQuery components can be implemented by simply extending the Widget
> >> mixin
> >>
> >> for example
> >>
> >> @Import (library={"your js file"})
> >> public Class FreeCalendar extends Widget {
> >> }
> >>
> >> Then in your tml file
> >>
> >> <t:any mixins="FreeCalendar" options="JSON String of options"/>
> >>
> >>
> >>
> >>
> >> --
> >> View this message in context:
> >>
> http://tapestry.1045711.n5.nabble.com/javascript-component-questions-tp5715582p5715594.html
> >> Sent from the Tapestry - User mailing list archive at Nabble.com.
> >>
> >> ---------------------------------------------------------------------
> >> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> >> For additional commands, e-mail: users-help@tapestry.apache.org
> >>
> >>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> For additional commands, e-mail: users-help@tapestry.apache.org
>
>

Re: javascript component questions

Posted by François Facon <fr...@atos.net>.
Hi Chris,

In order to avoid having so much makup in your tml you can generate a
JSon array in java class and pass it as property  to your calendar
component parameter.

By way could you give us more details about the jQuery plugin you are using?


Regards
François

2012/8/20 Chris Cureau <cm...@gmail.com>:
> I could do this, yes...I guess I was just trying to avoid having quite so
> much markup in the tml file...
>
> On Mon, Aug 20, 2012 at 8:34 AM, trsvax <tr...@gmail.com> wrote:
>
>> Most jQuery components can be implemented by simply extending the Widget
>> mixin
>>
>> for example
>>
>> @Import (library={"your js file"})
>> public Class FreeCalendar extends Widget {
>> }
>>
>> Then in your tml file
>>
>> <t:any mixins="FreeCalendar" options="JSON String of options"/>
>>
>>
>>
>>
>> --
>> View this message in context:
>> http://tapestry.1045711.n5.nabble.com/javascript-component-questions-tp5715582p5715594.html
>> Sent from the Tapestry - User mailing list archive at Nabble.com.
>>
>> ---------------------------------------------------------------------
>> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
>> For additional commands, e-mail: users-help@tapestry.apache.org
>>
>>

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org


Re: javascript component questions

Posted by Chris Cureau <cm...@gmail.com>.
I could do this, yes...I guess I was just trying to avoid having quite so
much markup in the tml file...

On Mon, Aug 20, 2012 at 8:34 AM, trsvax <tr...@gmail.com> wrote:

> Most jQuery components can be implemented by simply extending the Widget
> mixin
>
> for example
>
> @Import (library={"your js file"})
> public Class FreeCalendar extends Widget {
> }
>
> Then in your tml file
>
> <t:any mixins="FreeCalendar" options="JSON String of options"/>
>
>
>
>
> --
> View this message in context:
> http://tapestry.1045711.n5.nabble.com/javascript-component-questions-tp5715582p5715594.html
> Sent from the Tapestry - User mailing list archive at Nabble.com.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> For additional commands, e-mail: users-help@tapestry.apache.org
>
>

Re: javascript component questions

Posted by trsvax <tr...@gmail.com>.
Most jQuery components can be implemented by simply extending the Widget
mixin

for example

@Import (library={"your js file"})
public Class FreeCalendar extends Widget {
}

Then in your tml file

<t:any mixins="FreeCalendar" options="JSON String of options"/>




--
View this message in context: http://tapestry.1045711.n5.nabble.com/javascript-component-questions-tp5715582p5715594.html
Sent from the Tapestry - User mailing list archive at Nabble.com.

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org