Changing/adding on to the webserver

1639169247

I bought the Rasptank to learn Python by interacting with a machine. I'd like to modify the webserver page and add other features. There is lots of info on how the motors/servos/sensors .py work individually but not how they interact or are called from the web page.

Is there a tutorial on how to add or change the webserver page in case I'd like to add a new button to operate a new servos or motors.

I'd like to keep building onto this project and I need to learn how the webpage interacts with the .py scripts.


I think Python uses a FLASK module to run the webserver which calls an HTML TEMPLATE, but after that I'm stuck. I'd love a tutorial on how this part works.

1638410146

Me too... please

1640249582

Me too...please more info

1639169247

Well I have it going..somewhat. The webpage is called from python using flask.I put a html page called custom.html in the dist folder.
Then in the app.py I added another route/webpage:

@app.route("/custom", methods=['GET','POST'])
def custom():   if request.method=='POST: #receive a post from a html form
        bunch of custom python code here that handles the POST from a submit button on the html page
return render_template("custom.html")

which generates a new webpage at: localhost:5000/custom.html that I can do what I want with

I can now issue a list of commands into a textarea, press submit, and the code splits the lines into commands, off the tank goes following my script. I'm still working on buttons.

Anybody know how to pass a variable from javascript directly to a python function?

I thought this was a good way to practice python and html without needing to jump into learning javascript and vue just yet.

1644346181

Had a similar issue. Bought the robot for my son to learn coding. Means write new code and interact with a machine. I really like what Adeept did here, also the page that helps coding the different components.
But I think, learning also the vue.js javascript framework to add new controls becomes a larger task to begin with. As of that I wrote a simple and easy to change Web GUI for the Adeept RaspTank (should also help to get into html, javascript and style sheets).
It doesn’t have all the functions yet, but main direct controls are there. Coded it in a day, not as flexible as the original, but worked for the buttons seen on the GUI.
Once he gained first experiences and he likes it, I will ask my son to enhance it…
Following the github link:
https://github.com/silorenz/AdeeptRaspTankGUI
Hope it helps others too…
I can not give support though, sorry

1644346181

Had a similar issue. Bought the robot for my son to learn coding. Means write new code and interact with a machine. I really like what Adeept did here, also the page that helps coding the different components.
But I think, learning also the vue.js javascript framework to add new controls becomes a larger task to begin with. As of that I wrote a simple and easy to change Web GUI for the Adeept RaspTank.
It doesn’t have all the functions yet, but main direct controls are there. Coded it in a day, worked for the buttons seen on the GUI.
Once he gained first experiences and he likes it, I will ask my son to enhance it…
Following the github link:
https://github.com/silorenz/AdeeptRaspTankGUI
Hope it helps others too…
I cannot give support though.

1646062069

If you are new to Linux, you will need to be careful when doing this (you may want to make a copy of the webserver.py file elsewhere or backup your Micro SD card to another one before modifying it, just in case).  

To modify the webServer.py file (for the PiCar Pro), do the following:

1.        Open up a terminal window.
2.        Change to the directory where this resides by typing: cd adeept_picarpro/server [ENTER].
3.        Check the permissions of the files in that directory by typing: ls -l [ENTER].  
           (NOTE: This file should be set to “-rw-r--r--1 root root” which numerically equals “644” for its current permissions of read only).  
4.        Before you can change the permissions, you need to elevate to root status, by typing: sudo su [ENTER]
5.        To change it and make this file writable, type: chmod 777 webServer.py
6.        Leave the terminal window open and go modify the webserver.py file using a program such as “Geany” or “Thonny Python IDE” under the Programing apps within Raspbian.
7.        When you are done modifying the file, go back to the terminal window and change the permissions back to read only, by typing: chmod 644 webServer.py
8.        You may need to reboot for the changes to take effect.

And that is it, enjoy!!

Adeept_Devin

The web interface is written through the Vue.js framework. The code of the interface is packaged and compressed and placed in the server/dist folder.

Web source code download address: https://www.adrive.com/public/E8 ... _controller_web.rar

You can modify the source code to achieve the functions you need, package the code, and put it in the server/dist folder.

1639169247

1644346181 replied at 2022-2-10 02:34 PM
Had a similar issue. Bought the robot for my son to learn coding. Means write new code and interact  ...

I did very similar, except I used javascript to add joystick controls that determine direction and speed.

1670272813

Adeept_Devin replied at 2022-5-5 05:33 PM
The web interface is written through the Vue.js framework. The code of the interface is packaged and ...

Hi I have experimented editing the .vue files and recompiled the code creating different buttons and commands in webServer and learned a lot in the process.

Do you have a link for the Darkpaw quad robot source code, I have added a pan and tilt mount for the camera and need to create some extra buttons to control it. Also a shutdown button. I have edited webServer.py and made the P1 button shutdown the raspberry pi, but would like to do it properly.

I am very impressed with the Darkpaw hardware and software and Adeept's range of products.

Many Thanks

Steve C