Call JavaScript function from dart - flutter

Is anyone know how to call JS function from dart ?
I followed steps which linked below.
Firstly, appear this error.
"Error: Not found: 'dart:js' import 'dart:js';"
I followed previous answer which comment this line from js.dart and fixed it.
[export 'dart:js' show allowInterop, allowInteropCaptureThis;].
But now I got another error below.
No top-level method 'callJsFunc' declared. Receiver: top-level Tried calling: callJsFunc()
Is anyone know how to fix this error ?
text
I tried other Flutter SDK version (latest one and 3.0.5) but got same error.

flutter uses dart not javascript.
so... actually you require a separate javascript engine if you want to use javascript with flutter and that can be done with dart ffi unless you are building a web app with flutter.
However, there is a library called flutter_js and you can use it if you need to run javascript.
On the other hand, if you are interested in using embeddable Javascript engine with your flutter project by yourself.
you should check this link out where it shows how to use ffi for attaching an embeddable Javascript engine called Duktape

Related

Firebase 9 & Flutter: How to initializeApp?

I am desperately trying to figure out how to initializeApp with Flutter (not React Native).
I know about the functions to use, but I can not find the firebaseConfig I need to pass into the function.
And no matter what I search for, every resources references to React Native, like as if nobody codes with Flutter since Firebase 9 has been released anymore (or I am the only dummy which is not able to resolve this by myself).
Can someone tell me where to get the firebaseConfig object from?
If I add a new app to my project, I only get the google-services.json, which does NOT include the firebaseConfig object I need to pass.
I understand your confusion now, let me explain. When the guy in the video talks about Firebase v9 he is talking about the SDK version which in the case of Javascript (which I suppose is his main topic in his channel) is currently 9.17.1 an the version 9 has been around since 2021 so it is not new. The different SDKs have their own versions for each platform so thinking it will be the same in every SDK is a mistake by itself. You can check the SDKS here. So there is no Firebase v9, there is a Firebase SDK for javascript version 9. They managed in that way in javascript and in flutter it is not the same. Being that the last update in the flutter SDK was literally yesterday I'm pretty sure they have their reasons to not implement the same functions in flutter since 2021.
Now, one of the thinks the guy talks in the video is deconstructing, which is something common in javascript. The way you do this in flutter is by using show.
So you would be doing this for example:
import 'package:cloud_firestore/cloud_firestore.dart' show FirebaseFirestore, QuerySnapshot; //Add everything you would be using
This way only the specific parts of the library will be imported and the amount of code the Dart VM has to load will be reduced.
As of the access to documents, it is still the same but you can easily create a helper class that contents your references to your collections and then just use that class to reduce the boilerplate code created by the firebase SDK.
You have to install the Firebase CLI and run firebase init.
You need to use the package firebase_core that will give you access to the class Firebase so you can use it to initialize your app Firebase.initializeApp() you can pass the default options for the current platform using Firebase.initilizeApp(options: DefaultFirebaseOptions.currentPlatform) usually your IDE will automatically import the corresponding package but in case it does not you would have to import 'firebase/firebase_options.dart';
An useful link to the documentation: Add Firebase to your Flutter App

Flutter Web Get Chrome Extension info from Polkadot.js web3Enable

I am hoping to confer on a strategy for a flutter web app (as can ignore mobile cases here) to get chrome extension info for a Polkadot.js wallet from the Polkadot browser extension.
My first thought is to use dart's JS library and use the Polkadot extension JS package and then try and pull the info from there. However, I'm not sure how to properly use this in flutter as it is a whole package full of dependencies, not just a single JS file. Also it is in TS not JS. Any thoughts here?
Eg., I need a JS file to be able to call this; and for flutter to in turn call the JS file:
import {
web3Enable,
} from '#polkadot/extension-dapp';
By writing out a "bridging" layer, you can do it easily.
Firstly, create a normal javascript (or typescript) application (nothing related to Flutter). You should be able to happily use the polkadot lib in your js/ts code without any problem. You may need to learn a bit about how to develop js code normally (e.g. you can depend on polkadot using npm, etc).
One small thing is that, you should "expose" some object publicly in your js/ts code. For example, your code may look like window.myFancyFunction = function() { call_some_polkadot_function(); }. Of course you can do more things like exposing other functions/objects/...
Then, you can bundle this normal js/ts application into a .js file. This is still very normal for js/ts developers and should have nothing special to deal with here, and you still do not need to touch Flutter at this stage.
Next, load this single-filed .js file when you are loading your Flutter Web application. You may simply do this by editing your Flutter Web's html file and add <script src="my_single_filed_js_mentioned_above.js" />. Notice that, when loading this script, it simply sets window.myFancyFunction and does not do anything more. Still very trivial here, should have no problem.
Lastly, in your Flutter Web code, i.e. Dart code, call that window.myFancyFunction function. For example, Flutter Web : How to run javascript using dart js says you can do import 'dart:js' as js; js.context.callMethod('myFancyFunction', ['some arguments']);

How to open a new tab in the browser using the package:js in flutter

I'm trying to open a new tab
I can do so by using dart:js
js.context.callMethod('open',
['$url', '_blank']);
But the above approach gave me this warning
Avoid using web-only libraries outside Flutter web plugin packages.dartavoid_web_libraries_in_flutter
Then I read about javascript interoperability with dart here at dart official documentation page.
It suggests to use the package js: ^0.6.3 ( link ) instead of dart:js
The problem is that I don't know how I can use js: ^0.6.3 to open a new tab in the browser. I couldn't find much documentation or tutorial.
Thank you in advance.

Binding native C library to dart using dart:ffi

I am trying to use dart:ffi to import a C library so I can use the functions in my dart code. I am following the instructions on the Flutter website to do this. I am currently on step 3, and the dart code is looking for a .so file, but it was not created from the previous steps. Does anyone know what to do in order to get that file? I am using a computer running WindowsOS.

how to show showBusyIndicator into xdk html5 hybrid application?

i added the cordova-notification plugin into intel-xdk appication, when try to show the indicator i get this error:
Uncaught TypeError: Cannot read property 'showBusyIndicator' of undefined
this is the code:
$(document).on("change","#sel_produttori", function(evt)
{
intel.xdk.notification.showBusyIndicator();
});
maybe it is strange the plugin is listed in the first window but not in the second one.
Many of the 'intel.xdk' plugins have been or are being deprecated in favor of their standard core Cordova counterparts. I would recommend using that instead.
The problem you're running into appears to be that you've included the standard Cordova notification plugin, but you're trying to access the intel.xdk notification plugin, which is not included and therefore doesn't exist in your app.
It looks like the corresponding method on the standard Cordova Notification plugin was deprecated some time back and isn't there anymore. You might want to try a plugin like this:
https://github.com/filfat-Studios-AB/cordova-plugin-spinnerdialog
It seems to work for me but, as always, use at your own risk.