Reusing Template

[ussmoss]

I was wondering if it possible to reuse a template on the page without
having to refresh? I have a page with a template that I populate with
some JSON. This data can be refined by the user. I was hoping to do
this without having to refresh but I cannot seem to revert the
template back to its base state. Will compiling the template get
around this or do I need to save the skeleton HTML, replace it, and
then re-render? Thanks.

[Mic Cvilic]

Both options are ok for multiple rendering.
The compile approach is slightly better as you compile your template
just once.
While re-using an HTML will need some compiling time for each render.

Cheers,
Mic

> Thanks.
> >
>

[ussmoss]

Thanks for the quick response. Just to make sure I understand
correctly, I would save the HTML to JS variable and then swap out the
DOM element that I am using for the template and call the render
function. If I do the compile option just makes the process faster, I
still need to replace the DOM element with the template skeleton.

One last quesiton would it be possible to give the steps on how to
compile and save out on the templates. I was trying to go over the
examples but since I am new to this I am not quite sure that I see how
to do that. Thanks again for the help and making such a great template
engine in JS>

[Mic Cvilic]

ussmoss wrote:

Thanks for the quick response. Just to make sure I understand
correctly, I would save the HTML to JS variable and then swap out the
DOM element that I am using for the template and call the render
function. If I do the compile option just makes the process faster, I
still need to replace the DOM element with the template skeleton.

One last quesiton would it be possible to give the steps on how to
compile and save out on the templates. I was trying to go over the
examples but since I am new to this I am not quite sure that I see how
to do that. Thanks again for the help and making such a great template
engine in JS>
  

Have a look at: http://wiki.github.com/pure/pure/optimize-your-response-time
The optimisation1 paragraph.

In the coming release things are changing about compile. You can read as well:
http://wiki.github.com/pure/pure/pure-version-2-release-notes
Look for the $p.compile paragrap

[ToddG]

I am trying to solve the same problem. I have a polling ajax loop
that is updating a status area which is hopefully going to be a pure
template. it works fine for the first try but after that it seems
that the div has gone away. I really want to use the compile / render
option. Could anyone provide an example that simply compiles a
template then goes into a loop and renders the template perhaps with a
counter or something. I am so close, just need a little kick.

A trival example would be something that downloads the current time
once a second. Basically i am having issues replacing the html in
the destination div the second time.
-

-Todd

[ToddG]

Note, I am using the pure 2 release and would like to utilize that
API.

[ToddG]

After looking a bit through the group, this seems to be a simplified
example. How would this look with the pure2 api?

http://www.friendpaste.com/4tGeYDtu9ih8VqoM6PQiKU

-Todd

[Mic Cvilic]

Hi Todd,

I took your clock idea, found a json time service and here is the result:
http://www.friendpaste.com/6TxTxnXf9sPl53lB6ym6sM

It is now added as well in the example page of PURE 2.

Cheers,
Mic

[Todd Gruben]

Awesome.  That is perfect.  Thanks for you help.  

Would it be difficult to use the same clock template, compiled once, and rendered in 2 different destination divs?   From this example perhaps displaying 2 timezones?

The example would be useful to me in describing  template reuse.

I am really starting to like your tool.  I am new to both javascript and jquery so there is a bit of learning curve.

-Todd

[Mic Cvilic]

Todd Gruben wrote:

Awesome.  That is perfect.  Thanks for you help.  

Would it be difficult to use the same clock template, compiled once, and rendered in 2 different destination divs?   From this example perhaps displaying 2 timezones?

You can call multiple times the "template" function that you get from the html.compile(...) call.
And passing as a parameter the data you want to render.

div1.innerHTML = template(data1);
...
div2.innerHTML = template(data2);

The example would be useful to me in describing  template reuse.

I am really starting to like your tool.

I hope so, with all these efforts ;)

[ibec]

A sample using a table or list would even be more representative,
where a new payload replaces/overwrites the existing rendering.

-Ivo

[Mic Cvilic]

Hi Ivo,
Do you have an idea what would be an interesting (and changing) json
feed that could be useful to show?
A twitter account is trendy, but do not get many records through feeds.
Blog feeds are rather static either.
Cheers,
Mic

[ibec]

Mic,

Financial indices always work fine as fluid content. Here's a sample
YQL query (don't forget to enable the "community tables"):

select symbol, Name, Change, LastTradePriceOnly from
yahoo.finance.quotes where symbol in
("^n225","^hsi","^gdaxi","^fchi","^aex","^ftse","^dji","^ixic")

And here's the full REST request for JSONP use:

http://query.yahooapis.com/v1/public/yql?q=select%20symbol%2C%20Name%2C%20Change%2C%20LastTradePriceOnly%20from%20yahoo.finance.quotes%20where%20symbol%20in%20(%22%5En225%22%2C%22%5Ehsi%22%2C%22%5Egdaxi%22%2C%22%5Efchi%22%2C%22%5Eaex%22%2C%22%5Eftse%22%2C%22%5Edji%22%2C%22%5Eixic%22)&format=json&env=http%3A%2F%2Fdatatables.org%2Falltables.env&diagnostics=false&callback=

The real payload is in results.quote

-Ivo

[ToddG]

if that is true, why don't i see 2 copies of the output in this
example?

http://www.friendpaste.com/2Wu3Ys1umMxZ95wnLpgoxP

I think this is the last hurdle i have to conquer.

-Todd

> >>     On Jul 5, 2:47 pm, ToddG <tgru...@gmail.com> <mailto:tgru...@gmail.com> wrote:
>
> >>>     Note, I am using the pure 2 release and would like to utilize that
> >>>     API.
>

> >>>     On Jul 5, 2:45 pm, ToddG <tgru...@gmail.com> <mailto:tgru...@gmail.com> wrote:
>
> >>>>     I am trying to solve the same problem.  I have a polling ajax loop
> >>>>     that is updating a status area which is hopefully going to be a pure
> >>>>     template.  it works fine for the first try but after that it seems
> >>>>     that the div has gone away.  I really want to use the compile / render
> >>>>     option.  Could anyone provide an example that simply compiles a
> >>>>     template then goes into a loop and renders the template perhaps with a
> >>>>     counter or something.  I am so close, just need a little kick.
>
> >>>>     A trival example would be something that downloads the current time
> >>>>     once a second.  Basically i am having issues replacing  the html in
> >>>>     the destination div the second time.
> >>>>     -
>
> >>>>     -Todd
>

> >>>>     On Jul 2, 4:33 am, Mic Cvilic <tch...@gmail.com> <mailto:tch...@gmail.com> wrote:
>
> >>>>>     ussmoss wrote:
>
> >>>>>>     Thanks for the quick response. Just to make sure I understand
> >>>>>>     correctly, I would save the HTML to JS variable and then swap out the
> >>>>>>     DOM element that I am using for the template and call the render
> >>>>>>     function. If I do the compile option just makes the process faster, I
> >>>>>>     still need to replace the DOM element with the template skeleton.
>
> >>>>>>     One last quesiton would it be possible to give the steps on how to
> >>>>>>     compile and save out on the templates. I was trying to go over the
> >>>>>>     examples but since I am new to this I am not quite sure that I see how
> >>>>>>     to do that. Thanks again for the help and making such a great template
> >>>>>>     engine in JS>
>
> >>>>>     Have a look at:http://wiki.github.com/pure/pure/optimize-your-response-time
> >>>>>     The optimisation1 paragraph.
>
> >>>>>     In the coming release things are changing about compile. You can read as
> >>>>>     well:http://wiki.github.com/pure/pure/pure-version-2-release-notes
> >>>>>     Look for the $p.compile paragrap
>

[Mic Cvilic]

ToddG wrote:

if that is true, why don't i see 2 copies of the output in this
example?

http://www.friendpaste.com/2Wu3Ys1umMxZ95wnLpgoxP
  

Place "div#extra" before the script tag and it should be ok.

[Todd Gruben]

so if it doesn't work then there is a bug?

Currently with this modified with the div code, I only see one copy of the Timestamp

-todd

[Tchvil]

Almost there...
I've posted a working example at http://www.friendpaste.com/2Wu3Ys1umMxZ95wnLpgoxP

On Jul 8, 6:25 pm, Todd Gruben <tgru...@gmail.com> wrote:
> so if it doesn't work then there is a bug?
>
> Currently with this modified with the div code, I only see one copy of the
> Timestamp
>
> -todd
>
>
>
> On Wed, Jul 8, 2009 at 11:04 AM, Mic Cvilic <tch...@gmail.com> wrote:
> >  ToddG wrote:
>
> > if that is true, why don't i see 2 copies of the output in this
> > example?
> >http://www.friendpaste.com/2Wu3Ys1umMxZ95wnLpgoxP
>
> > Place "div#extra" before the script tag and it should be ok.
>
> >  I think this is the last hurdle i have to conquer.
>
> > -Todd
>

> > On Jul 6, 2:02 pm, Mic Cvilic <tch...@gmail.com> <tch...@gmail.com> wrote:
>
> >  Todd Gruben wrote:
>
> >  Awesome.  That is perfect.  Thanks for you help.
>
> >  Would it be difficult to use the same clock template, compiled once,
> > and rendered in 2 different destination divs?   From this example
> > perhaps displaying 2 timezones?
>
> >  You can call multiple times the "template" function that you get from
> > the html.compile(...) call.
> > And passing as a parameter the data you want to render.
>
> > div1.innerHTML = template(data1);
> > ...
> > div2.innerHTML = template(data2);
>
> >  The example would be useful to me in describing  template reuse.
>
> >  I am really starting to like your tool.
>
> >  I hope so, with all these efforts ;)
>
> >    I am new to both javascript and jquery so there is a bit of learning
> > curve.
>
> >  -Todd
>

> >  On Mon, Jul 6, 2009 at 10:48 AM, Mic Cvilic <tch...@gmail.com<mailto:tch...@gmail.com> <tch...@gmail.com>> wrote:
>
> >      Hi Todd,
>
> >      I took your clock idea, found a json time service and here is the
> >     result:
> >    http://www.friendpaste.com/6TxTxnXf9sPl53lB6ym6sM
>
> >      It is now added as well in the example page of PURE 2.
>
> >      Cheers,
> >     Mic
>
> >      ToddG wrote:
>
> >      After looking a bit through the group,  this seems to be a simplified
> >     example.  How would this look with the pure2 api?
>
> >      http://www.friendpaste.com/4tGeYDtu9ih8VqoM6PQiKU
>
> >       -Todd
>

> >       On Jul 5, 2:47 pm, ToddG <tgru...@gmail.com> <tgru...@gmail.com> <mailto:tgru...@gmail.com> <tgru...@gmail.com> wrote:
>
> >        Note, I am using the pure 2 release and would like to utilize that
> >     API.
>

> >        On Jul 5, 2:45 pm, ToddG <tgru...@gmail.com> <tgru...@gmail.com> <mailto:tgru...@gmail.com> <tgru...@gmail.com> wrote:
>
> >         I am trying to solve the same problem.  I have a polling ajax loop
> >     that is updating a status area which is hopefully going to be a pure
> >     template.  it works fine for the first try but after that it seems
> >     that the div has gone away.  I really want to use the compile / render
> >     option.  Could anyone provide an example that simply compiles a
> >     template then goes into a loop and renders the template perhaps with a
> >     counter or something.  I am so close, just need a little kick.
>
> >         A trival example would be something that downloads the current time
> >     once a second.  Basically i am having issues replacing  the html in
> >     the destination div the second time.
> >     -
>
> >         -Todd
>

> >         On Jul 2, 4:33 am, Mic Cvilic <tch...@gmail.com> <tch...@gmail.com> <mailto:tch...@gmail.com> <tch...@gmail.com> wrote:
>
> >          ussmoss wrote:
>
> >           Thanks for the quick response. Just to make sure I understand
> >     correctly, I would save the HTML to JS variable and then swap out the
> >     DOM element that I am using for the template and call the render
> >     function. If I do the compile option just makes the process faster, I
> >     still need to replace the DOM element with the template skeleton.
>
> >           One last quesiton would it be possible to give the steps on how to
> >     compile and save out on the templates. I was trying to go over the
> >     examples but since I am new to this I am not quite sure that I see how
> >     to do that. Thanks again for the help and making such a great template
> >     engine in JS>
>
> >           Have a look at:http://wiki.github.com/pure/pure/optimize-your-response-time
> >     The optimisation1 paragraph.
>
> >          In the coming release things are changing about compile. You can read as
> >     well:http://wiki.github.com/pure/pure/pure-version-2-release-notes
> >     Look for the $p.compile paragrap
>

[Todd Gruben]

great..thanks

-Todd