12Next
Return to list
View: 3280|Reply: 12

Changing/adding on to the webserver

[Copy link]

4

Threads

7

Posts

52

Credits

Registered member

Rank: 2

Credits
52
Post time 2021-12-11 05:03:53 | Show all posts |Read mode
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.


Reply

Use magic Report

4

Threads

5

Posts

44

Credits

Newbie

Rank: 1

Credits
44
Post time 2021-12-17 01:47:37 | Show all posts
Me too... please
Reply

Use magic Report

1

Threads

3

Posts

13

Credits

Newbie

Rank: 1

Credits
13
Post time 2021-12-23 17:00:56 | Show all posts
Me too...please more info
Reply

Use magic Report

4

Threads

7

Posts

52

Credits

Registered member

Rank: 2

Credits
52
 Author| Post time 2022-2-8 10:48:07 | Show all posts
Edited by 1639169247 at 2022-2-8 11:02 AM

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.


Reply

Use magic Report

0

Threads

2

Posts

18

Credits

Newbie

Rank: 1

Credits
18
Post time 2022-2-9 16:15:45 | Show all posts
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
Reply

Use magic Report

0

Threads

2

Posts

18

Credits

Newbie

Rank: 1

Credits
18
Post time 2022-2-10 14:34:02 | Show all posts
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.
Reply

Use magic Report

0

Threads

2

Posts

14

Credits

Newbie

Rank: 1

Credits
14
Post time 2022-3-16 04:38:26 | Show all posts
Edited by 1646062069 at 2022-3-16 05:15 AM

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!!
Reply

Use magic Report

0

Threads

53

Posts

201

Credits

Administrator

Rank: 9Rank: 9Rank: 9

Credits
201
Post time 2022-5-5 17:33:03 | Show all posts
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.
Reply

Use magic Report

4

Threads

7

Posts

52

Credits

Registered member

Rank: 2

Credits
52
 Author| Post time 2022-5-21 01:00:43 | Show all posts
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.
Reply

Use magic Report

0

Threads

2

Posts

8

Credits

Newbie

Rank: 1

Credits
8
Post time 2022-12-6 04:58:40 | Show all posts
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


Reply

Use magic Report

12Next
Return to list
You have to log in before you can reply Login | Sign Up

Points Rules