Page 1 of 1

How to integrate 3rd party Javascript library in SmartClient

PostPosted: Fri Dec 14, 2018 6:21 pm
by LXS
Hi Servoy community,

i'd like to use Google Charts API in the Servoy 7 SmartClient.

Here is a simple quick start how to use the Charts API:

https://developers.google.com/chart/int ... uick_start

Is it possible to use this in SmartClient?

How do i load the Javascript file?
Code: Select all
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>


I'd like to display the chart in a HTML_AREA or in scopes.svyJFXWebView.WebViewPanel - is this possible?

Thanks for your help!
Alex

Re: How to integrate 3rd party Javascript library in SmartCl

PostPosted: Fri Dec 14, 2018 6:51 pm
by patrick
Maybe this can be helpful: https://github.com/Servoy/svyGCharts

Re: How to integrate 3rd party Javascript library in SmartCl

PostPosted: Fri Dec 14, 2018 11:32 pm
by sean
In theory this is possible. We have customers that run NG Client applications inside Smart Client via JavaFX.
It allows them to take advantage of components like charts, etc. You would build an NG Client solution and then direct the WebPanel to that endpoint (using any deeplink invocations needed)

Challenge is that it is difficult to debug because you cannot "see" inside the embedded browser
Also Java is removing built-in support for JavaFX, so if running on Java 11, things will be more tricky

Re: How to integrate 3rd party Javascript library in SmartCl

PostPosted: Mon Dec 17, 2018 9:32 am
by LXS
Thanks Patrick an Sean for your help!

Is it also possible to use Google Charts without the svyGCharts Module for the NG Client?

Can i load the resources from https://www.gstatic.com/charts/loader.js to use it directly in the Smart Client?

I saw in the old Google Charts "API" it was also possible to create an URL with parameters to create a chart - but this is deprecated.

Or do you know another Charts API to use in Smart Client?

Thanks!
Alex

P.S. @sean your webinars are awesome! ;-)

Re: How to integrate 3rd party Javascript library in SmartCl

PostPosted: Mon Dec 17, 2018 5:43 pm
by sean
Hi Alex,

Thanks for your feedback on the webinars - We do them for YOU!

It should be possible to do this w/o NG Client and just using the JavaFX WebView.
I guess it really depends if you need a dynamic/stateful session for the chart stuff.
You can pass content directly to the webview via
Code: Select all
webView.loadContent

So perhaps you can just send it the content to load dynamically. I would try a simple example from Google and pass it to the webview.

Let us know how you do

Re: How to integrate 3rd party Javascript library in SmartCl

PostPosted: Mon Dec 17, 2018 5:57 pm
by patrick
Ah, sorry. I linked to an NG client repo. I have made a module in the past that does that for smart and web client. I thought it was that one. Let me see if I can find it.

Re: How to integrate 3rd party Javascript library in SmartCl

PostPosted: Mon Dec 17, 2018 6:07 pm
by patrick
Found it... It requires a few modules (that are not included, because you may already have them): svyUtils, svyComponent, svyJFXWebView and svyUtils$webClient.

Provided as is. No guarantees, but for sure a nice starting point.

Re: How to integrate 3rd party Javascript library in SmartCl

PostPosted: Tue Dec 18, 2018 2:45 pm
by LXS
cool, thank you patrick and sean for your help! i'll have a look on it!

Re: How to integrate 3rd party Javascript library in SmartCl

PostPosted: Tue Dec 18, 2018 2:58 pm
by LXS
hmm i tried to import the solution svyGoogleCharts.servoy into my Servoy 7.4 Developer.

It fails with the following message:

Code: Select all
Could not import solution: The solution was exported with a newer version of Servoy than you are currently running. Upgrade to at least Servoy 8.2.2 -build 3107 to import this solution.


Is it possible to use it in Servoy 7.4?

Thanks!
Alex

Re: How to integrate 3rd party Javascript library in SmartCl

PostPosted: Tue Dec 18, 2018 3:05 pm
by LXS
i've tried to unzip the .servoy file and modify in the version_info.xml the <servoy_version> and <servoy_build>

But now i've a checksum error ;-)

Code: Select all
Could not import solution: Checksum failure

Re: How to integrate 3rd party Javascript library in SmartCl

PostPosted: Tue Dec 18, 2018 4:30 pm
by juan.cristobo
LXS wrote:Is it also possible to use Google Charts without the svyGCharts Module for the NG Client?


I use Google Charts in Web Client (with WebClientUtils plugin), I don't know if it can be used in Smart Client

Re: How to integrate 3rd party Javascript library in SmartCl

PostPosted: Tue Dec 18, 2018 4:35 pm
by patrick
7.4 :shock:

Please try the ones attached here

Re: How to integrate 3rd party Javascript library in SmartCl

PostPosted: Tue Dec 18, 2018 4:44 pm
by LXS
cool, thank you Patrick!
Now i've imported the module without problems.

The solution says the module svyAccordionMenu is missing.
Where can i download this module? I can't find it on the github/Servoy account.

Alex

Re: How to integrate 3rd party Javascript library in SmartCl

PostPosted: Tue Dec 18, 2018 4:52 pm
by patrick
Just remove it. I forgot to take it out.