Prime Community Forum

Posted: **01 Nov 2017, 20:35**

Do you mind posting more XHTML here on how you envision this component being used such as ...

<pe:speedtest  widgetVar="speedtest">
    <p:ajax listener="#{resultListener.results}" />
</pe:speedtest>

<p:button onclick="PF('speedtest').start()"/>

That will help me figure out how to help...

Posted: **01 Nov 2017, 20:52**

Yes, something like this, but i am thinking to keep it "small" to also add the listener direct to the component if it's possible:

Code: Select all

<pe:speedtest  widgetVar="speedtest" listener="#{resultListener.results}"/>

<p:button onclick="PF('speedtest').start()"/>

and on the Method-Expression on the managed bean should be something like:

Code: Select all

public void results(Double TimeMS, Double JitterMS, Double DownloadMbps, Double UploadMbps)

...

But i don't know how to implement this (In the right way)
in the primefaces extension's framework...

Posted: **01 Nov 2017, 20:58**

But also the way with the

Code: Select all

<p:ajax listener="..."/>

sound interesting if i can call this then from the javascript-part of my component
(when the measuring is done and the result's are displayed...)

Posted: **01 Nov 2017, 21:03**

Please use p:ajax listener... It's the preferred way and 95% of the components works with attached behaviors (p:ajax in this case).

Posted: **01 Nov 2017, 22:07**

OK set let's assume you do it like this...

Code: Select all

<pe:speedtest  widgetVar="speedtest">
    <p:ajax listener="#{resultListener.results}" />
</pe:speedtest>

<p:button onclick="PF('speedtest').start()"/>

Then in your resultListener code the java method will accept a POJO called SpeedTestEvent ...

Code: Select all

public void resultListener(final SpeedTestEvent speedTestEvent) {
       speedTestEvent.getTimeMs();
       ...
   }

Here is an example ClipboardSuccessEvent POJO when the clipboard copies successfully:

https://github.com/primefaces-extension ... Event.java

Then here is how to pass those values from Javascript to your Event POJO:

https://github.com/primefaces-extension ... get.js#L80

Posted: **02 Nov 2017, 08:33**

OK, I will try to do it in that way with ajax.
I then will also test the component against my real project to see if it's work right on each devices / modern browsers.
In the primefaces-extension showcase (locally) the component is already working.

Thank you for the code snippet's -
a good example is all what a developer need's

Posted: **02 Nov 2017, 15:28**

If you get stuck let me know. Make sure to look at the ClipboarRenderer the important lines are ...

Code: Select all

@Override
    public void decode(final FacesContext context, final UIComponent component) {
        decodeBehaviors(context, component);
    }

And...

Code: Select all

encodeClientBehaviors(context, clipboard);

wb.finish();

Posted: **02 Nov 2017, 17:47**

I currently got it running in the Primefaces-Extensions-Showcase by now
and added some optional Attributes to makes it more configurable.

The "optional" caption*-Attributes are needed for my project because i am using my own translation-service
(instead of the "static" msg[]-Tag's) which can (re)load resources
at runtime, automatically check's for new languages and so on...
Also the color of the single speed-test's can be changed by setting the optional attribute.

On the jsf-side i can use it by this simple example...

Code: Select all

	<!-- EXAMPLE-SOURCE-START -->
    <p:growl id="growl" autoUpdate="true" showDetail="true" showSummary="true" />

    <pe:speedtest id="speedtest" widgetVar="speedtest" captionDownload="Down" captionUpload="Up" captionJitter="Jit" captionPing="Pg">
        <p:ajax listener="#{speedTestController.SaveResults}" process="@this" update="growl" />
    </pe:speedtest>

    <div class="ui-g">
        <p:commandButton id="btnStart" value="Start Speedtest" icon="fa fa-tachometer" style="width:100%;" onclick="PF('speedtest').start();"/>
    </div>
	<!-- EXAMPLE-SOURCE-END -->

...and as bean i can now use:

Code: Select all

    public void SaveResults(SpeedTestEvent speedTestEvent)
    {
        String msg =    "PingTimeMS       ='"+String.valueOf(speedTestEvent.getPingTimeMS()) + "', \n"+
                        "Jitter           ='"+String.valueOf(speedTestEvent.getJitterTimeMS()) + "', \n" +
                        "SpeedMbpsDownload='"+String.valueOf(speedTestEvent.getSpeedMbpsDownload()) + "', \n" +
                        "SpeedMbpsUpload='"+String.valueOf(speedTestEvent.getSpeedMbpsUpload()) +"'";
        FacesMessage message =  new FacesMessage(FacesMessage.SEVERITY_INFO, "Saved your speed results:", msg);
        FacesContext.getCurrentInstance().addMessage(null, message);
    }

The only thing i don't get running is to build up the primefaces-extension libraries
in combination with the primefaces 6.2 SNAPSHOT
and get it running in my own application cause of multiple errors beginning on the start page
coming from javascript...
...here i need to analyze if it's a bug in Primefaces 6.2-SNAPSHOT or in my application...

If you want you can see/preview my fork of the primefaces-extensions-core at:
https://github.com/ssibitz/core

Feedback is welcome

Posted: **02 Nov 2017, 18:35**

I just reviewed it and the code is looking pretty clean thanks for following all the conventions!

Posted: **02 Nov 2017, 18:40**

Can you try and change

Code: Select all

 @ResourceDependency(library = "primefaces-extensions", name = "speedtest/raphael-min.js"),

to..

Code: Select all

@ResourceDependency(library="primefaces", name="raphael/raphael.js"),

And see if it still works? PrimeFaces includes raphael.js in their JAR.

Prime Community Forum

Component for Network Speedtest

Re: Component for Network Speedtest

Re: Component for Network Speedtest

Re: Component for Network Speedtest

Re: Component for Network Speedtest

Re: Component for Network Speedtest

Re: Component for Network Speedtest

Re: Component for Network Speedtest

Re: Component for Network Speedtest

Re: Component for Network Speedtest

Re: Component for Network Speedtest