Connection to the device

Posted on Thu 30th, May 2019

• #1

user100558

Hi,

I create and small app using angular to connect to the device. It was working to test the LED. However, when I send the command Puck.mag it is getting the error that the function doesnt exit.

Should I import any other library than puck.js?

I'm not understand why this error.

Thanks
• #2

Robin

Thr 2019.05.30

Hi @user100558

There Isn't enough info there to assist you. Which device, (Puck?) what error, in response to what call?

Please post your code, the error as seen in the left-hand console side of the IDE, and the results of process.env

The link to a tutorial, if one was used.

Thank you

Does this help?

http://www.espruino.com/Puck.js+Door+Light
• #3

allObjects

@user100558, could please show the request you sent to puck for checking the LED, the request you sent for the magnetometer? ...and publish the code you loaded on puck, if you loaded any.

For the LED example, did you use this example from the Espruino site https://www.espruino.com/Web%20Bluetooth ?

I guess that the code you sent to puck as string to do something with the magnetometer has some JS syntax issue. What you send to the puck you can verify in the IDE when typing it into the console. Get the Espruino IDE going in Chrome browser on your computer, connect to puck and type it in the left hand side pane - the console, and you get what you asked for.

• #4

user100558

Hi Guys, sorry for my mistake and didn't place the code.

I'm using cordova with angular v 1.*.

Follow:

my head

<!DOCTYPE html> <html>
    <head>
        <!--
        Customize this policy to fit your own app's needs. For more guidance, see:
            https://github.com/apache/cordova-plugin-whitelist/blob/master/README.md#content-security-policy
        Some notes:
            * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
            * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
            * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
                * Enable inline JS: add 'unsafe-inline' to default-src
        -->
        <meta name="format-detection" content="telephone=no">
        <meta name="msapplication-tap-highlight" content="no">
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
        <link rel="stylesheet" type="text/css" href="js/bootstrap/css/bootstrap.min.css">
        <link rel="stylesheet" href="css/angular-material.min.css">
        <link rel="stylesheet" type="text/css" href="css/index.css">
        <link rel="stylesheet" type="text/css" href="css/specialinputs.css">
        <script type="text/javascript" src="js/jquery-2.2.1.min.js"></script>
        <script type="text/javascript" src="js/bootstrap/js/bootstrap.min.js"></script>
        <script src="js/angular.js"></script>
        <script src="js/angular-route.js"></script>
        <script src="js/angular-animate.js"></script>
        <script src="js/angular-aria.min.js"></script>
        <script src="js/angular-messages.min.js"></script>
        <script src="js/angular-material.min.js"></script>
        <script src="https://www.puck-js.com/puck.js"></script>
        <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDKO91w7TH8iP4MN1ziQT0BOqjsWtJtpqk&libraries=places,drawing,geometry" async defer></script>
        <title>Myspot</title>

Then, my code in the angular file.

scope.btnstatus = function(action) {
        if(action == 'on') {
            Puck.write('LED1.set();\n',function() {
            alert(Puck.getBatteryPercentage());
            initMap();
            });
        }
        else {
            Puck.write('LED1.reset();\n',function() {
                //Puck.magOff();
            });
        }
    };

    $scope.magOn = function() {
        Puck.magOn();
        Puck.on('mag', function(xyz) {
            console.log(xyz);
        });
    }

• #5

allObjects
@user100558, now I see where your are coming from.

I'll try to explain what is going on:

In Line 27 you are pulling in a piece of communication software so that your angular app running in the browser can use to connect to Puck via BLE and then send data - requests - to Puck and in return receive data - responses - from Puck - all via the BLE connection and Puck's console.

Think of puck's console like a command or terminal window of a computer. You can type something, and if the terminal / console program - understands it, it will respond. Similar you enter ls in the linux shell and you get the list of files of the current directory you are in, or dir in windows bat shell und you get the list files of the current directory you are in.

Puck's operating system - so to speak - though does not understand sh or bat shell commands, but it understands JavaScript. The data - or more precisely - source code you send to Puck as request is tried to be interpreted / executed and the response created in Puck's console is sent back to you.

Where the confusion comes is that in your browser you have an object referred to with the global variable Puck that understands certain commands / has certain methods. On the Puck there is also an object referred to with the global variable Puck with its methods, but ***these 'Puck' objects are not the same', and therefore, do not understand the same commands / have not the same methods.

Let's have a look at the key method of the Puck object residing in you browser. This key method is .write(arg1, arg2) and accepts two arguments:
LED1.set();
```
and
```
LED1.reset();
```
I'm sure you have the Espruino Web IDE installed and you have connected to the Puck via BLE. Enter any of these strings in the console - left pane - and you see the same effect by directly entering into Puck's console. The console of Espruino Web IDE is nothing else than a terminal that sends your key strokes - command - to Puck, and displays what Puck responds: echoing your key strokes and on pressing enter printing the response of your entered command.

Since there is no meaningful response to setting and resetting a LED and these methods on the LED objects return nothing - in this case ```undefined``` - you see 
```
undefinded
```
as response in the console - as the response to your command (beside the echo of what you typed).
```
arg2is a so calledcallbackfunction that is invoked with one argument - the response from Puck. Both of these callback functions inLine 3andLine 9are defined as anonymous functions and without accepting an argument (even though in the JavaScript environment passed arguments are available in the local and predefined variablearguments). There is nothing wrong with not providing an argument in this example of turning LED on and off, because the response is anyway the string"undefined"```. (If you though would have a syntax or interpretation error, you don't catch it.)

The arg2 is optional and could be dropped completely in your code. (Your try to read Puck's battery percentage throws actually an error, because it is directed towards your Puck object in the browser, but you meant to talk to the Puck object in Puck to return the battery percentage. Former Puck object does not understand, but latter one does, and you can get the battery percentage - just a little bit different - as I'll show later).

To be clear what the browser side Puck.write() method does, is:
- sending the JavaScript source as string as given as 1st argument to Puck
- receive Pucks response as string and then invoke the callback function - which runs in the browser - with the response string as sole argument.
To see these details look at https://www.puck-js.com/puck.js - the function beginning with
```
connection.write = function(data, callback) {
...
};
```
```
To use the ```callback``` with meaningful command ```data```,  let's head for the battery percentage:

Replace ```Lines 3 and 4``` with following lines:
```
```
        Puck.write('Puck.getBatteryPercentage();\n',function(batteryPercentage) {
            alert( batteryPercentage);
```
```
Since ```..getBatteryPercentage()``` is ***deprecated*** in the newest version of Espruino (Puck/Pixel/MDBT42Q) firmware, we do it right and use the ```E.getBattery()``` expression:
```
```
        Puck.write('E.getBattery();\n',function(batteryPercentage) {
           alert("Battery: "+batteryPercentage+"%");
```
```

Now you are able to get your Magnetometer example going in a similar way.

Recap:
- arg1 is javascript source that is to be executed on Puck/Pixel/MDBT42Q
- arg2 is callback function with argument 'to catch and process' the response created by execution of arg1 on Puck/Pixel/MDBT42Q
• #6

allObjects
The browser local Puck object is very helpful for essential and basic stuff, such as connectivity and sending data and receiving response back.

BUT: What if I want to execute something much more elaborate on my Puck and get the response back?

Response: create these elaborate code pieces in the Espruino IDE in the right hand side Editor pane as custom functions with your names and upload them to Puck (and save them there - so on re-power / restart, the functions are still there). Then just invoke these functions by the names in your local browser application.

For example, you create a function that responds in JSON battery percentage and BTN1 status - pressed or not.
```
function batAndBut() {
  var responseObject = { battery: E.getBattery(), but: digitalRead(BTN1) };
  var response = JSON.stringify(responseObject);
  console.log(response);
}
```
The example is intentionally made verbose.
Upload this code to Puck. Then test it with entering
```
batAndBut();
```
in the console. The response you should see is something like:
```
{"battery":85,"but": 0}  
```
Now, in your angular Web app you do something like that:
```
  Puck.write('echo(0);batAndBut();echo(1);\n',function(data) {
      var batAndBut = JSON.parse(data);
      alert("Battery: "+batAndBut.battery+"%,"
               +" BTN1"+((batAndBut.but)?"":" NOT")+" pressed."
                );
    });
```
Enjoy!

PS: since I could not test (yet), line 1 may need to be:
```
  Puck.write('echo(0);\nbatAndBut();\necho(1);\n',function(data) {
```
• #7

user100558

Thanks so much....I totally understand my mistakes.

Post a reply
- Bold
- Italics
- Link
- Image
- List
- Quote
- code
- Preview
Formatting Help

Don't worry about formatting, just type in the text and we'll take care of making sense of it. We will auto-convert links, and if you put asterisks around words we will make them bold.

Tips:

Create headers by underlining text with ==== or ----

To *italicise* text put one asterisk each side of the word

To **bold** text put two asterisks each side of the word

Embed images by entering:
![](https://www.google.co.uk/images/srpr/logo4w.png)
That's the hard one: exclamation, square brackets and then the URL to the image in brackets.

* Create lists by starting lines with asterisks

1. Create numbered lists by starting lines with a number and a dot

> Quote text by starting lines with >

Mention another user by @username

For syntax highlighting, surround the code block with three backticks:

```
Your code goes here
```
Just like Github, a blank line must precede a code block.

If you upload more than 5 files we will display all attachments as thumbnails.

For a full reference visit the Markdown syntax.

Connection to the device

About

Connection to the device

Actions

Connection to the device

Formatting Help

About

Connection to the device

Actions

Espruino