{"id":37745,"date":"2014-12-02T05:55:42","date_gmt":"2014-12-02T13:55:42","guid":{"rendered":"http:\/\/localhost\/exoblog\/?p=8001"},"modified":"2023-06-05T16:49:50","modified_gmt":"2023-06-05T14:49:50","slug":"developing-juzu-portlets-step-4-adding-likes-and-comments-for-secret","status":"publish","type":"post","link":"https:\/\/www.exoplatform.com\/blog\/developing-juzu-portlets-step-4-adding-likes-and-comments-for-secret\/","title":{"rendered":"Developing Juzu portlets \u2013 Step 4: adding Likes and Comments for Secret"},"content":{"rendered":"

\"04-Juzu-tutorial-series\"<\/a><\/p>\n

Previous steps:
\n– Learn how to develop great Juzu portlets for eXo Platform!<\/a>
\n– Step 2: viewing and posting secrets<\/a>
\n– Step 3: Building a sexy secret wall<\/a>
\n<\/em><\/p>\n

In the previous blog post<\/a>, we implemented the UI of our JuZcret application. We are now able to look at Secret on the secret wall and share a new secret via the \u201cadd secret\u201d form. But what would a social feature<\/strong> be without any user interaction? Nothing\u2026<\/p>\n

That\u2019s why, during this step, we\u2019ll add two very original social features to our JuZcret<\/strong> application: the \u201ccomment\u201d feature and the “like” feature. Crazy! \ud83d\ude09<\/p>\n

By implementing these new features we will learn, among other things, how to use Ajax<\/strong> with Juzu, interact with Portlet Container<\/strong>, and add an EDIT mode<\/strong> to our Portlet.<\/p>\n

We are assuming that you have already implemented step 3. If not, you can still download the source code resulting from step 3 on Github<\/a> in order to start this step.<\/em>
\n
\nLet\u2019s start by improving the application models a little bit.<\/p>\n

Models<\/h2>\n

Here we don\u2019t need to use Juzu, we will just improve our current model<\/strong>. Let\u2019s add the top of the tree, Model<\/strong>. This class contains common attributes for Secret<\/strong> and Comment<\/strong>:<\/p>\n

\"01-Model\"<\/a><\/p>\n

In the org.juzu.tutorial.models<\/span> package, create a Model class as shown below:<\/p>\n

package org.juzu.tutorial.models;\n\nimport java.io.Serializable;\nimport java.util.Date;\n\npublic class Model implements Serializable {\n    private String id;\n    private Date createdDate;\n\n    public String getId() {\n        return id;\n    }\n\n    public void setId(String id) {\n        this.id = id;\n    }\n\n    public Date getCreatedDate() {\n        return createdDate;\n    }\n\n    public void setCreatedDate(Date createdDate) {\n        this.createdDate = createdDate;\n    }\n}<\/pre>\n
Then add a Comment<\/strong> class:<\/p>\n
package org.juzu.tutorial.models;\n\npublic class Comment extends Model {\n    private String userId;\n    private String content;\n\n    public String getUserId() {\n        return userId;\n    }\n\n    public void setUserId(String userId) {\n        this.userId = userId;\n    }\n\n    public String getContent() {\n        return content;\n    }\n\n    public void setContent(String content) {\n        this.content = content;\n    }\n}<\/pre>\n
We also need to improve Secret:<\/p>\n