Well, this is not the first time I have done something about controlling spider robot. You can find my previous project here https://forum.phpoc.com/blogs/homer-s-iot/371-phpoc-control-spider-robot.
This time, I will show you how to program a spider robot controller using Scratch..

For someone who doesn't know about Scratch, it is a free educational platform developed by MIT Media Lab's Lifelong Kindergarten group. It is designed to help everyone, especially children, to learn programming and creative thinking.
Scratch provides a graphical way to program: instructions are represented as colorful blocks, instead of boring textual lines. Sounds interesting yet? You can read more here https://scratch.mit.edu/about
So with Scratch programming, it seems that there would be a lot of fun playing with PHPoC board.

Click image for larger version  Name:	Scratch Editor.png Views:	1 Size:	74.6 KB ID:	897

I. Demo

1) Simple demonstration

2. Setup guide:

II. Spider Robot and PHPoC board:

Actually, this setting-up part is similar to my previous project. You can find out here: https://forum.phpoc.com/blogs/homer-s-iot/371-phpoc-control-spider-robot

III. Connect Scratch with PHPoC:

1. An overview of architecture:
Due to security restrictions, Scratch editor cannot interact with hardware devices directly. Instead, Scratch provides a method to connect to hardware devices: HTTP extensions with a helper app.
  • Extension file for hardware: loaded to Scratch editor, specifies interaction protocol with hardware devices.
  • Helper app: a separate application that the users must run on their computer (localhost)
Here is the overview architecture:
Click image for larger version  Name:	Overview.png Views:	2 Size:	176.0 KB ID:	902

You can check the official document here https://en.scratch-wiki.info/w/images/ExtensionsDoc.HTTP-9-11.pdf
It must be interesting to graphically program an IoT board with Scratch editor. So, I decided to make a simple project to connect Scratch with PHPoC using the hardware-extension method.

2. What we need to make:
Step 1) Create a hardware extension file for Scratch.
Extension file defines hardware-specified blocks, and data format to be exchanged (Scratch HTTP extension). In this project, I made a simple hardware extension file, named PHPoC_demo_extension_en.s2e

Step 2) Write a helper app.
Users run this helper app on localhost. Helper app can be written in any language that supports socket programming. For this simple demonstration, I created a helper app using Node.js. It talks to Scratch editor via HTTP in localhost, at port 20185 ( I chose it myself, and you may change it, up to you). Then it communicates with PHPoC board via WebSocket.

Step 3) Write a corresponding script in PHPoC board.
A script is pre-uploaded to PHPoC board in order to process command/send response data in the predefined format.

3. Getting it done:

Things we need to have:
Step 1) Install Scratch 2.0 offline editor:
You can get it from this link https://scratch.mit.edu/download

Step 2) Load extension file for PHPoC to Scratch editor:
Open Scratch 2 offline editor. Shift+Left click on File menu ==>
Import experimental HTTP extension ==> Browse and select the PHPoC_demo_extension_en.s2e file that you find in the attachment.
Click image for larger version  Name:	Step0.png Views:	2 Size:	49.2 KB ID:	904

Or you just simply need to open the spider_robot_control_test.sb2 (project file) in the attachment. And voila:

Click image for larger version  Name:	Step1.png Views:	4 Size:	81.2 KB ID:	905

In More Blocks section, you can see the message: Cannot find helper app. It means Scratch cannot find the corresponding helper app for this hardware extension.
So, next step is to install and run helper app.

Step 3) Install Node.js and run helper app:
First, you need to download and install Node.js from https://nodejs.org/en/
After that, browse to Scratch Demo folder (you can download it from the attachment), and run the following commands in the command line:
npm install
This command is used to install node.js dependencies.
npm start
This command is used to start helper app.
Click image for larger version  Name:	Step2.png Views:	1 Size:	7.0 KB ID:	906

After that, the status in Scratch offline will be changed to Not connected to PHPoC device. It means the helper app is run, but it still does not connect successfully to PHPoC board.

Click image for larger version  Name:	Step3.png Views:	1 Size:	81.0 KB ID:	907

Step 4)Get PHPoC board connected:
First, upload task0.php file to PHPoC Blue. This script needs to be run in a loop, so that PHPoC board can send response data and receive commands from Scratch continuously.

Click image for larger version  Name:	Step4.png Views:	1 Size:	82.8 KB ID:	908

Then, get the PHPoC board' IP address and input to the field above. Click Green Flag button to connect. After a successful connection between the helper app and PHPoC board, the status will be changed to Okay.
Now you can play with PHPoC using Scratch, with the PHPoC-specified blocks.
Here I made a simple program to control spider robot:

Click image for larger version  Name:	Step5.png Views:	1 Size:	260.6 KB ID:	909

There are two motors on spider robot. We just need to set the power (PWM width, to be precise) and rotation direction (clockwise or counter-clockwise) of each motor to make the robot move.
Of cause, you can customize it yourself. Feel free to leave any question .

IV. Source Code
Source code includes:
  • helper_app_demo.js: Helper app implementation.
  • PHPoC_demo_extension_en.s2e : Hardware extension file for PHPoC, in JSON format
  • task0.php: This file needs to be loaded and run on PHPoC board.
  • spider_robot_control_test.sb2 : Scratch 2.0 project file for controlling spider robot
You can download the full project here:
"Scratch" with PHPoC is so amusing to me. Surely I'm gonna make some more stuff with it.
Hope you like this demo .
Attached Files