JSF notifications (quick dirty tutorial)

Idea

Just simple idea, to use javascript api to jsf ajax events to show notifications from server on page after request or ajax.

<script>
jsf.ajax.addOnEvent(notifi);
<script>

and then use it for display notification on website.

First create bean class for storing messages

@Component
@Scope(value="session")
public class Notifi {
  public String msg;
  public String getMsg() {
    String tmp = msg;
    msg = ""; // reset msg
    return tmp;}
}

Next implement notifi javascript method

<script>
function notifi() {
jQuery.get(‘#{request.contextPath}’ + "/notifi.jsp", {}, function (data) {console.log(data)};
}
</script>

Then in main folder create file notifi.jsp, it will be page that will shows messages for ajax requests

<%@page contentType="text/html" pageEncoding="UTF-8"%>${widokKosci.powiadomienia.wiadomosc}

Last one, use notifi bean after first page render, for non ajax requests, for example at the bottom of template file

<script>
notifi();
</scrpt>

Finally just use Notifi bean

@Autowired
Notifi notifi;

public void action() {
notifi.msg = "Hello!";
}

..next

You could add extra data for notifications, exceptions etc.

You could use other method to show messages, rather than use “console.log” eg. pnotiffi

You could add stack for messages and other ways to manage messages.

Happy coding!

Advertisements

JSF 2.0 buttons click problems

Problem

It is not a discovery, but when you do not know this it can be frustrating.

If you notice that your buttons (h:commandButton or a4j:commandButton) do not response on first click, when you must click two time (double click) to perform an action, this may be a solution for you.

The problem may be caused by form you rendered earlier than click or you rendered element that contains that form.

The case can be like this

<h:form id="rendered"> <!--(1)-->
 <h:commandButton id="button" value="click me twice"/> <!--(2)-->
</h:form>
<h:form> <!--(3)-->
 <a4j:commandButton id="action" action="#{view.action}" render="rendered"/> <!--(4)-->
</h:form>

(1) – FORM THAT LOOSES ITS STATE AFTER “ACTION” BUTTON CLICK
(2) – BUTTON THAT MUST BE CLICKED TWICE TO SEND ACTION REQUEST
(3) – OTHER FORM
(4) – BUTTON THAT WILL RE-RENDER MAIN FORM

or other case

<h:panelGroup id="rendered"> <!--(1)-->
 <h:form><!--(2)-->
  <h:commandButton id="button" value="click me twice"/><!--(3)-->
 </h:form>
</h:panelGroup>
<h:form> <!--(4)-->
 <a4j:commandButton id="action" action="#{view.action}" render="rendered"/><!--(5)-->
</h:form>

(1) – ELEMENT THAT CONTAINS MAIN FORM BUT WILL BE RE-RENDER
(2) – FORM THAT LOOSES ITS STATE AFTER “ACTION” BUTTON CLICK
(3) – BUTTON THAT MUST BE CLICKED TWICE TO SEND ACTION REQUEST
(4) – OTHER FORM
(5) – BUTTON THAT WILL RE-RENDER ELEMENT THAT CONTAINS MAIN FORM

Analyze request

In firebug or other development tool that records requests you can analyze this problem in POST parameters of the request.
After form re-rendering first request on first click will not have javax.faces.ViewState parameter.

rendered rendered
rendered:button click me twice

second request on second click will have this parameter.

javax.faces.ViewState -7190851117743915418:1300621591202567154
rendered rendered
rendered:button click me twice

This is how you can diagnose problem tiwh view state.

Solution

Main cause of this problem is that h:form looses its view state (javax.faces.ViewState). You rendered it first time when page is loaded, and then you re-render this form when you clicked at “action” button, so it is not the same form “rendered” you wanted to react.

Solution is to load all forms (h:form) once per page load. In other words you must render elements elements that is inside form. To solve example problem I just add h:pandelGroup inside form, and named it with form id.

 <h:form>
  <h:panelGroup id="rendered">
   <h:commandButton id="button" value="click me twice"/>
  </h:panelGroup>
 </h:form>
<h:form>
 <a4j:commandButton id="action" action="#{view.action}" render="button"/>
</h:form>

References

http://balusc.blogspot.com/2011/09/communication-in-jsf-20.html#AjaxRenderingOfContentWhichContainsAnotherForm

Do not use $!

Do you develop web sites with jQuery? Do you follow official “$” for jQuery object? I do not.

When you develop application using Dojo, jQuery and Prototype (or other javascript framework) together, use of $ for all jQuery call will cause problems and misunderstandings.

To avoid it I recommend to use full name “jQuery” excessively inside of plugins.

Happy jQuerying!

Second Android Game “Chem-Quest”

Finally I have got a finished my second game. This one is created without AndEngine.

Most of UI is created in xml layout definition. Graphics is handled by classes that extends android.widget.Button.

In those I override onDraw method to draw graphics elements for all click-able sprites.

About the game

Game is another brain training game. You must collect specific amount of water in two tubes using simple steps : fill tube, pout into another tube and pour out.

It is avaible on GetJar:
http://www.getjar.com/mobile/165999/chem-quest

Happy gaming!

New game and app is comming …

Since last days I was working hard on my next game and first application.

Game
It is called “Chem-Quest”. I started working on this game 2 month ago, it was my first look on Android. There is no framework in this game. I combine XML layout and drawing on View’s Canvas.
I want to say that it wasn’t simple to handle graphics as using framework, but I want to try this way. Most problems is how to scale on different displays. Still game is not best on smallest devices (less than 180×160).

In this game graphics is more complex, almost beautiful I’d say 🙂 It was not created by me, but my friend.

Still I need to spend some time to test all paths. I hope it will be published tomorrow or day after tomorrow.

Application
First application, but it is almost like game. Actually it is based on other game called “Remember Me: Balls” – this game needs days to finish.

Application is called “Lotto-Blender”. It is a lottery randomiser or lottery number mixer. It is based on AndEngine and it was created in 3 days till now – yes only 3 days.

Graphics is simple but I think quite nice, all created in Gimp using some filters.

This is important application for me because I used AndEngine physics plugin for the first time. This plugin is a fast and free Android physics engine. It is based on JNI calls to Box2D engine.

The great about this engine is simple way to attach this engine to your AndEngine code.

Application is almost ready, but still I get some errors. I hope it will be published till Monday.

Future plans
In free time I was looking for good free engine for Android 3D games and I could not found any.
There is two or tree that simplified some work, but no full game engine or engine that is in final release.
Most advanced is JMonkeyEngine, but in alpha stage.
Most stable is libgdx and jpc – but without 3D physics and all configuration is on developer side.

So I decided to give up 3D games for now.

My topic for next week is more advanced physics in 2D game, with joins, maybe skeleton physics, and some more advanced graphics. And again I want to use AndEngine.

Did You heard that AndEngine creator is working now for some company called “Zynga”? It is looks that AndEngine become Zynga property, but it will stay an open source.

Happy codding!

GetJar no APK to download?

I don’t know why and when but in last 2 weeks GetJar changes it’s politics about download and install Android applications.

Now You must download it’s GetJar Download Helper, no APK to download!

For me this is worst than downloading APK, because:

First this Download Helper not working in my Phone – I try couple of times.
[update]
Finally it start to work, but still download site must be launched from default browser. It can’t be Opera.

Second I published Remember Me to GetJar because of simple APK to download.

I will look for some other places to publish my apps.