Pebble Beginner Tutorial

2,841 views
Skip to first unread message

javalearner

unread,
Oct 29, 2014, 9:30:52 AM10/29/14
to pebble-templ...@googlegroups.com
Hi,
    I am very beginner in this template engine and I am learning how to implement it by using Pebble. I am trying to implement it but not yet successful. I am trying it by not using Spring MVC. I am following example and created a simple template inside /web-inf/  as templates/home.peb.   I managed to compile it by using the following

        PebbleEngine engine = new PebbleEngine();
        PebbleTemplate compiledTemplate = engine.getTemplate("web-inf/templates/home.peb");
        Writer writer = new StringWriter();

        Map<String, Object> context = new HashMap<>();
        context.put("websiteTitle", "Mitchell");
        context.put("content", "My Interesting Content");
        compiledTemplate.evaluate(writer, context);


But what should be my next step?  How can I display this compiled template to webpage in  .jsp/html format? Please provide me a simple example.  Apologies if this is a very very basic question but I am quite new to this technology.

Thank You,

Mitchell Bösecke

unread,
Oct 29, 2014, 12:00:42 PM10/29/14
to
Thanks for trying out Pebble; I'd be glad to help you out!

The key thing to understand is that during the "evaluate" method, Pebble writes the output to the "Writer" object that you provide to it. Your "writer" is now holding the final output; ready for you to use it however you want. There are all sorts of different Writer implementations (see the "Direct Known Subclasses" section in this java documentation) which allow different users to use the final output in different ways (eg. write to a file, display on a screen, send as http response, etc.). In your particular example you used a "StringWriter" which simply stores the output and returns it as a string if you call it's "toString()" method.

You mentioned you are NOT using Spring MVC but I'm not sure exactly which technologies you ARE using so it's difficult to help much further. If you are using servlets you can obtain a "PrintWriter" from the HttpServletResponse via it's "getWriter()" method. If you pass this PrintWriter to Pebble as an argument to the evaluate method (instead of a StringWriter) it will write the final output directly to the HttpServletResponse which gets returned to the end user of your web application.

Hopefully that helped but let me know if I can clarify any further.

Thanks,

Mitchell

javalearner

unread,
Oct 30, 2014, 9:45:37 AM10/30/14
to pebble-templ...@googlegroups.com
Hi Mitchell,
                Thank you for the suggestion. Yes, it worked well in my local.  I uploaded files to Live server and I got into errors.  The server is in Linux and java version there is
java version "1.7.0_72"
Java(TM) SE Runtime Environment (build 1.7.0_72-b14)

           
Following is the error. Please suggest if I am going wrong somewhere.


Caused by: java.lang.UnsupportedClassVersionError: com/mitchellbosecke/pebble/PebbleEngine : Unsupported major.minor version 51.0 (unable to load class com.mitchellbosecke.pebble.PebbleEngine)
        at org.apache.catalina.loader.WebappClassLoader.findClassInternal(WebappClassLoader.java:2840)
        at org.apache.catalina.loader.WebappClassLoader.findClass(WebappClassLoader.java:1160)
        at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1668)
        at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1546)
        at org.apache.jasper.servlet.JasperLoader.loadClass(JasperLoader.java:126)
        at org.apache.jasper.servlet.JasperLoader.loadClass(JasperLoader.java:63)


Thank You,
Madan

javalearner

unread,
Oct 30, 2014, 11:18:26 AM10/30/14
to pebble-templ...@googlegroups.com
Hi Mitchell,
                    Sorry to disturb.  I solved the above issue. Now, on pebble language.  It was java version mis-match.

javalearner

unread,
Oct 30, 2014, 12:16:15 PM10/30/14
to pebble-templ...@googlegroups.com
Hi Mitchell,
             Now a different problem. I created two html files.  base.html and footer.html.  in base.html I did
{% include 'footer' %}

          But I compiled only base.html. 

            PebbleEngine engine = new PebbleEngine();
           PebbleTemplate compiledTemplate = engine.getTemplate(getServletContext().getRealPath("templates/testtemplate/base.html"));


  I get the following error
Could not find template "footer"


                     Do I have to compile all the  .html file inside template folder? Please suggest.

Thank You,
Madan

Mitchell Bösecke

unread,
Oct 30, 2014, 11:36:36 PM10/30/14
to pebble-templ...@googlegroups.com
The problem is with the following line:

PebbleTemplate compiledTemplate = engine.getTemplate(getServletContext().getRealPath("templates/testtemplate/base.html"));

You're only supposed to pass the name of the template to the "getTemplate" method and let the Pebble engine find the template for you. So the above line should actually look like this:

PebbleTemplate compiledTemplate = engine.getTemplate("base");

The Pebble engine will find your "base" template for you and while it is compiling this template it will encounter your "{% include 'footer' %}"  line at which point it then finds your footer template for you (just by using its name) and compiles it on the fly. How does pebble know where to find your template? It finds your template by using an implementation of it's Loader interface. Pebble comes included with four different implementations (listed about half way down this page) and by default it uses it's DelegatingLoader implementation to find your templates. Advanced users may provide their own Loader implementation to help pebble find their templates if they store their templates in an atypical location such as a database. You can view the source code for the different loaders here if you want to see how they work; they are pretty simple. You can choose a particular loader if you want and customize it to your needs, which might look like the following:

ClasspathLoader loader = new ClasspathLoader();
loader.setPrefix("templates/testtemplate/");
loader.setSuffix(".html");
PebbleEngine engine = new PebbleEngine(loader);
PebbleTemplate compiledTemplate = engine.getTemplate("base");

And no you don't have to manually compile all your templates. You just compile the want you want to render and if it happens to have a dependency on another template (via the "include" or "extends" or "import" tags) then Pebble will automatically compile that other template for you. 

Hopefully that helps!

javalearner

unread,
Oct 31, 2014, 7:11:55 AM10/31/14
to pebble-templ...@googlegroups.com
Hi Mitchell,

is there a Pebble equivalent of the Twig dump() function? I really want to take a look at the context hash map, just between two pre tags so that I can see what I'm doing! What would you do?

Many thanks

javalearner

unread,
Nov 5, 2014, 9:42:00 AM11/5/14
to pebble-templ...@googlegroups.com
Hi Mitchell,
               Warm Greetings.  I tried my best to implement ClassLoader but it's not happening. When I write following , it shows me the template.

           PebbleEngine engine = new PebbleEngine();
           PebbleTemplate compiledTemplate = engine.getTemplate("/var/lib/tomcat7/webapps/ROOT/WEB-INF/templates/testtemplate/base.html");

But when I try the following it gives me error

        ClasspathLoader loader = new ClasspathLoader();
        loader.setPrefix("/var/lib/tomcat7/webapps/ROOT/WEB-INF/templates/testtemplate");

        loader.setSuffix(".html");
        PebbleEngine engine = new PebbleEngine(loader);
        PebbleTemplate compiledTemplate = engine.getTemplate("base");


Caused by: com.mitchellbosecke.pebble.error.LoaderException: Could not find template "/var/lib/tomcat7/webapps/ROOT/WEB-INF/templates/testtemplate/base.html" (null:null)

Am I missing something?  I am keeping templates inside WEB-INF.  Do I need to configure anything to activate this template?

Thank You,
Madan




javalearner

unread,
Nov 6, 2014, 8:31:52 AM11/6/14
to pebble-templ...@googlegroups.com
Hi Mitchell,
                  Sorry to disturb.  Yes I solved this issue. It was the classpath setting error. That's why classLoader wasn't working.  I might nudge you again for other problems.  real pebble programming starts now!

Thank You,
Madan

Mitchell Bösecke

unread,
Nov 6, 2014, 5:58:19 PM11/6/14
to pebble-templ...@googlegroups.com
Hi Madan,

I'm glad you were able to solve the problem! Hopefully you won't have too many more hurdles to tackle.

Definitely don't hesitate to post any and all issues you encounter; I'm more than willing to help you. Just be aware that I'm doing some travelling for the next couple of weeks so unfortunately my responses will be limited.

Thanks

javalearner

unread,
Nov 10, 2014, 8:13:29 AM11/10/14
to pebble-templ...@googlegroups.com
Hi Mitchell,
                No worries please have a safe trip.  If you get some time , please guide me how to use array.  I tried array[0],  array[1],  it didn't work out. 

Thank You,
Madan

javalearner

unread,
Dec 2, 2014, 5:49:10 AM12/2/14
to pebble-templ...@googlegroups.com
Hi Mitchell,
                   Are you back form your trip? Hope it was a successful one.  I am trying for Array implementation but not yet successful.  Any advice?

Thank You,
Madan

Mitchell Bösecke

unread,
Dec 2, 2014, 10:22:20 PM12/2/14
to pebble-templ...@googlegroups.com
Thank you Madan,

Unfortunately Pebble doesn't have the best support for arrays. In version 1.1.0 we added support for iterating over arrays via the `for` tag as follows:

{% for val in arr %}
  {{ val }}
{% endfor %}

but it does not yet support retrieving certain values from array by index, i.e. "{{ arr[0] }}". If that's what you're looking for, do you mind describing why you would want to do that so I could maybe start a task for it on github?

Thanks

Mitchell Bösecke

unread,
Dec 3, 2014, 1:57:16 PM12/3/14
to pebble-templ...@googlegroups.com
Hi Madan,

I created a task on github for the retrieval of array elements by index: https://github.com/mbosecke/pebble/issues/49

Hopefully either myself or someone else will be able to implement that fairly soon.


javalearner

unread,
Dec 31, 2014, 6:11:54 AM12/31/14
to pebble-templ...@googlegroups.com
Hi Mitchell,
                 Sorry for late response. I needed to take holiday (high work load pressure! ).  Also pebble designing is activated successfully and it's Live.  But it is UK adult site (sorry...! ),  If you want I can give only in private message.  We implemented a responsive design and the site looks cool.  All possible due to pebble brilliance! hehehe.. 

                     So, is Array issue solved now? I see this issue is closed now in github.  Will be in contact next week.

Happy New Year !


cheers,
                 
Message has been deleted

javalearner

unread,
Feb 6, 2015, 10:51:52 AM2/6/15
to pebble-templ...@googlegroups.com
Hi Mitchell,
                     Is it possible to get templates outside of tomcat directory?  The way I want to keep is  keep java related parts inside tomcat  and  template in some other directory so that front-end guy can modify-upload directly.  Is it possible?  If yes, please provide a sample example.

Thank You,

javalearner

unread,
Apr 9, 2015, 10:29:15 AM4/9/15
to pebble-templ...@googlegroups.com
Hi Mitchell ,
                  Solved this issue so far.   Another question related with loop

{% for popularvideo in popularvideoList %}

{% endfor %}


            how can I get a counter (index) value  here ?


Thank you,
Madan


Mitchell Bösecke

unread,
Apr 17, 2015, 9:52:47 PM4/17/15
to pebble-templ...@googlegroups.com
Hi,

Inside for loops there is a zero-based index variable that you can access. There are some examples in the documentation.

- Mitchell

javalearner

unread,
Apr 21, 2015, 12:38:15 PM4/21/15
to pebble-templ...@googlegroups.com
Hi Mitchell,
                   Thanks.  It worked.   Can I also call context variable inside javascript file?  like below?

 in jsp
context.put("myscript", " <script> alert(\"Hello there!  \"); </script> );

and  in   html file

<script src="testscript.js"></script>

and inside  testscript.js

{{ myscript }}



                        I am getting  no value of myscript inside .js.   Is this possible?

Thank You,
Madan

javalearner

unread,
Aug 24, 2015, 6:26:16 AM8/24/15
to Pebble Templating Engine
Hi Mitchell,
                 After a long time. Hope you are doing well.  Your template engine have been successful in our industry.  We have launched now more than 15 services using your engine.  Currently, we are trying to use a Language Property file.  Requirement is something like

if user visits from UK, we will show English text
if user visits from Italy, we will show Italian text.
if user visits from Spain, we will show Spanish text.

            Is this possible to implement? like loading properties file internally and and engine reads the message from that file..  something like  get("welcometext")  ?  And it will show accordingly ? 


Thank You,
Madan
Reply all
Reply to author
Forward
0 new messages