timer primefaces javascript

Bonjour,
j'ai crée un timer avec la bibliotheque
je veux lorsque j'appuie sur le bouton, le timer s'arrête et m'affiche dans input le time courant

voila code javascript:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
            <script type="text/javascript">
                $(function() {
                    var clock = $("#clock").FlipClock(3000, {
                        countdown: true,
                        clockFace: 'MinuteCounter'
                    });
 
                    $("#btnStopCounter").on("click", function() {
                        clock.stop();
                        var time = clock.getTime();
                        $('#int').val(time.time);
                    });
                });
            </script>

le code html fonctionne bien

Code:

1
2
3
4
 
<div id="clock" style="margin:2em;"></div>
<button id="btnStopCounter">Stop counter</button> 
<input id="int" type="text" name="lname">

le pobleme lorsque j'utilise primefaces, le timer s'affiche mais lorsque j'appuie sur le bouton le timer ne s'arrete pas :/

Code:

1
2
3
4
5
6
7
8
 
<p:layout>
                <p:layoutUnit position="center">
                    <div id="clock" style="margin:2em;"></div>
                    <p:commandButton id="btnStopCounter" value="Stop counter"/>
                    <p:inputText id="int" />
                </p:layoutUnit>
            </p:layout>