Wifi PPM (no App Needed)

4,588

34

31

I wanted to control my diy micro indoor quadrocopter with my smart phone but I couldn't find a good solution for this. I had a few ESP8266 wifi modules laying around so I decided to make my own one.

The program starts a wifi access point with a HTML 5 website to control the PPM signal. The PPM signal is generated by interrupt.

Thanks to HTML5 you can control your RC device with any smart phone without any app.

You can also connect to the website with a PC and use a joystick for controlling. At the moment this works only in Firefox.

In this inscrutable I will explain how to set up the ESP8266 and how to configure the receiver in Betaflight.

Step 1: Parts List

Let's start with the parts list. You just need a few components:

- ESP8266: Any module should work. I use the ESP 12-F module: http://www.watterott.com/de/ESP8266-ESP-12F-WiFi/W...

- a 3,3V USB to Serial converter for uploading the scetch the first time. (After the first upload you can use the OTA update). Use Something like this: https://www.banggood.com/de/RobotDyn-USB-Serial-A...

- a 3,3V voltage regulator: The ESP8266 needs 3,3V. Any voltage above 3,6V will kill the device. It can also drop about 200mA peak current. If you don´t have a strong enough 3,3V supply at your RC model you need an additional voltage regulator. I use this step down regulator with a 3,9K Ohm resistor: http://www.produktinfo.conrad.com/datenblaetter/15...

- a PC with Arduino IDE: https://www.arduino.cc/en/Main/Software

- ESP8266 support for Arduino IDE. Follow these instructions: https://learn.sparkfun.com/tutorials/esp8266-thing...

- Websocket library for Arduino: https://github.com/Links2004/arduinoWebSockets

- Maybe a 3,3V/5V level shifter if your PPM decoder doesn´t support 3,3V inputs. For most quadcopter flight controllers you don´t need this.

- The WifiPPM scetch: Download file below or https://goo.gl/Qj5Gwb

- A smart phone or a PC with a joystick and Firefox

Step 2: Set Up the Electronics and Upload the Program

The first thing to do is to set the power connections to the ESP8266. You can see the wiring in the picture. Make the following connections:

RST, EN and VCC to 3,3V

GPIO15 and GND to GND

Put a small capacitor between VCC and GND (about 100 nF)

TXD to RXD of your USB2Serial device

RXD to TXD of your USB2Serial device

Put GPIO0 to GND while powerup to enter the flash mode.

After you have installed the Arduino IDE, the ESP8266 support and the websocket library open the sketch. Hold GIO0 to GND while powering up the ESP8266 to enter the flash mode. Now you can upload the sketch.

After you have uploaded the sketch, the controller will reset. You should find a WIFI Access Point named WifiPPM. If this is OK you can power down the chip and disconnect the TXD, RXD and GPIO0 wires. In the future you can update the program over OTA. To do so connect to the Access Point and go to "192.168.1.4/update" in your web browser.

Step 3: Website

Now you can connect GPIO5 to the PPM input of your flight controller or whatever you use to decode the PPM signal.

After powering up the module you can connect to the Access Point "WifiPPM". There is no password. Open the address 192.168.4.1 in your browser.

You will see the site of the first picture. On a touch device you can control the sticks with your touch screen.

If you open the site with a PC you must use Firefox. As soon as you connect a joystick, the site will change to the one you can see at the second picture. You can control the sticks with your joystick.

In the next step I will explain how to set up Betaflight, because I use it. If you use some other controller you have to go on yourself from now on.

Step 4: Setting Up Betaflight

I use the WifiPPM controller for my quadcopter with Betaflight. I explain now how to set it up.

- Connect your flight controller to the PC

- open Betaflight

- connect to the flight controller

- go to Receiver tab

- type RTAE1234 into the channel map field

- change the "Stick Low Threshold" to 1020, the "Stick Center" to 1500 and the "Stick High Threshold" to 1980

- save the changes

- open the wifiPPM website with your mobile phone and test if the adjustment is OK

Thats it. You are done. Now you can fly with your mobile phone without any additional app.

2 People Made This Project!

Recommendations

  • Optics Contest

    Optics Contest
  • Make it Glow Contest 2018

    Make it Glow Contest 2018
  • Plastics Contest

    Plastics Contest

31 Discussions

0
None
vprathap

Question 4 weeks ago

So I was just thinking if there is any possibility to have any FPV cam transmit Video feed to the browser/ app where the mobile is mapped to a Gamepad?

2 more answers
0
None
Andi23456vprathap

Answer 4 weeks ago

Yes. That is exactly my setup. I made an android app for it. Have a look at the instructable for "Lowcost 3d Fpv Camera for Android":

https://www.instructables.com/id/Lowcost-3d-Fpv-Ca...

You can use my app with a Easycap UVC007 video grabber and a mobile phone with UVC support. Then you can watch your analog FPV signal in the app. Here is the link to the app: https://play.google.com/store/apps/details?id=com....

(Use the lite version for testing. If it's working and you like my work please buy the full version)

In the app you can connect to WifiPPM when a joypad is connected and you are logged in into the wifiPPM AccessPoint. Then you can start the video. You can adjust the video input to single camera, 3d SBS or line alternating 3d. The video output can be adjusted to Cardboard VR mode or fullscreen mode. Have a look at this video:

or this video:

I use some cheap analog FPV transmitter and receiver, the Easycap UTV007 video grabber for video input into the smartphone, an old Motorola Moto G2 as FPV display, the VR Box as 3d goggles and a PS3 controller as joypad. If you want to use a PS3/PS4 controller you will need an additional app to use it and maybe a rooted smartphone. (I can't find the app anymore in the Playstore). If you have any other Bluetooth controller it should work without rooting or any additional app.

In my setup I also have a DIY range extender for WIFIPPM working. I'm still testing it. When it's finished and I find the time I will add an instructable for it, too. Maybe I find the time to make an instructable for the complete quadcopter setup. You can see it in the picture.

I'm also working on a new project: A quadcopter with a Raspberry Pi Zero to stream the video of a raspicam directly to the WifiPPM webpage or maybe an app.

20180915_142649.jpg
0
None
vprathapAndi23456

Reply 4 weeks ago

This is cool Andi. Will try this out too & keep you posted :P

0
None
vprathap

Question 4 weeks ago

Hi Andi.

Cool Project! I tried to do follow the steps as mentioned but I get the following error attached in the image.

For the first screen shot - I replaced

ESP8266WebServer server = ESP8266WebServer(80);

with

ESP8266WebServer server (80);

but now I have the error in the second screen shot.

Could you please guide me on what am I doing wrong?

erroe.PNGerror.PNG
4 more answers
0
None
Andi23456vprathap

Answer 4 weeks ago

Hello,

your problem is that you don't have the index.html.c file in the folder of your sketch. Copy all the files of the unpacked zip file into your sketch folder. When you reopen the sketch with all the files in the right folder, you should see four files on top in Arduino IDE like in the picture.

If this doesn't work you can add additional files to your sketch with the little arrow on the top right. Click on it and choose 'new tab'. Then you have to give it the right name and you can copy the source code from the downloaded files. You can see the file names in the picture.

Thank you for the hint with the ESP8266webserver line. I change the uploaded file immediately.

wifippm_arduino_1.png
0
None
Andi23456Andi23456

Reply 4 weeks ago

I just updated the file in the link at the parts list. Download it again. It should work now.

0
None
vprathapAndi23456

Reply 4 weeks ago

Thank you for the SWIFT reply andi. Sure, will try this out and let you know. :)

0
None
vprathapvprathap

Reply 4 weeks ago

Hi Andi. Everything works flawlessly now. Thank you for an amazing Project! Keep up the good work.

0
None
exp123

Question 5 weeks ago

Hi

I am working with ESP to control a robot. I am trying to use wifippm. Can you suggest me how to decode PPM in this to motor pwm? I am using brushed dc motor.

1 more answer
0
None
Andi23456exp123

Answer 5 weeks ago

Hello. What do you wanna do? Is it a servo which you want to control with a PWM signal or is it a DC-Motor and you want to control the speed with PWM?

In the both cases it would be the best to change the program to PWM output instead of PPM output. I think there are libraries in Arduino IDE to do that. I suggest to google "esp8266 arduino pwm output". If you want to control the speed of a DC Motor with PWM you will need at least a transistor, some resistors and capacitors or some other motor driver. A servo should be controllable with the PWM output signal of the ESP8266.

If you are not able to code the PWM output yourself, you could buy a "PPM 2 PWM encoder" or a "PPM motor driver". Just google for it. But this is not a very nice solution.

0
None
NandanN4

Question 2 months ago

Sorry for the silly question but I got first picture, didn't get second one
"If you open the site with a PC you must use Firefox. As soon as you connect a joystick, the site will change to the one you can see at the second picture. You can control the sticks with your joystick."

And how to set ppm out pin for esp8266-01

I'm using Multiwii Arduino flight controller
And esp8266-01

Thanks for helping.

6 more answers
0
None
NandanN4NandanN4

Answer 2 months ago

Got how to ppm out pin
But didn't get second control picture

0
None
Andi23456NandanN4

Reply 2 months ago

Hello. Sorry for the late answer. The "second" picture should appear when the browser detects the joystick. Which version of Firefox are you using? Which operating system do you have? And which joystick are you using? I use Ubuntu Linux with Firefox 61.0.1 and Android with Firefox 61.0.2.

Maybe there is a problem with the joystick API. Is your joystick working with other browser games? Is the touch control working when you open the site with a smartphone?
0
None
NandanN4Andi23456

Reply 2 months ago

I also have same system, control is working in smartphone not in Ubuntu.
I don't play browser games

0
None
Andi23456NandanN4

Reply 2 months ago

OK. Does your joystick work in linux? You can test it with jstest-gtk.

Does your joystick work with this joystick test site: http://html5gamepad.com/

Are your joystick mappings alright? You can adjust them with jstest-gtk.

Does your browser have permission for the joystick?

0
None
NandanN4Andi23456

Reply 2 months ago

Joystick like Xbox and PS controller?

1
None
Andi23456

Tip 4 months ago on Step 4

I uploaded a new version of the sketch. A "Connection alive" signal is now implemented to detect a lost connection.

0
None
ReclusiveE

6 months ago

Will this code work for coreless motors and f3 evo brushed flight controller ?

Please help, because it is not working in my case.

1 reply
0
None
Andi23456ReclusiveE

Reply 6 months ago

Do you get a wifi connection to the ESP8266? Can you check the output of the ESP8266 at GPIO5 with an oscilloscope?
If not, can you messuare a frequency of 25Hz at GPIO4 with a multimeter?

How does your wiring look? You have to connec the PPM output(GPIO5) of the ESP8266 to RX2 of your flight controller. Set the UART2 to PPM and the receiver mode to PPM in Betaflight.