Compare commits
No commits in common. "dacad4db10fe1c5a0a5b4969737635d33fbf7f39" and "2aa965cc833a200d299bf63c53c3dc81f3543237" have entirely different histories.
dacad4db10
...
2aa965cc83
|
|
@ -1,4 +0,0 @@
|
||||||
__pycache__/
|
|
||||||
test.py
|
|
||||||
static/images/*
|
|
||||||
venv/
|
|
||||||
77
README.md
77
README.md
|
|
@ -1,38 +1,79 @@
|
||||||
# Flask Camera Live Stream
|
# Make you own Raspberry Pi Camera Stream
|
||||||
|
|
||||||
[Original Project](https://github.com/EbenKouao/pi-camera-stream-flask)
|
Create your own live stream from a Raspberry Pi using the Pi camera module. Build your own applications from here.
|
||||||
|
|
||||||
## Usage
|
## How it works
|
||||||
|
The Pi streams the output of the camera module over the web via Flask. Devices connected to the same network would be able to access the camera stream via
|
||||||
### Creating the virtual environment
|
|
||||||
|
|
||||||
```
|
```
|
||||||
pip install venv
|
<raspberry_pi_ip:5000>
|
||||||
python -m venv venv
|
|
||||||
```
|
```
|
||||||
|
|
||||||
### Activate the virtual environment
|
## Screenshots
|
||||||
|
|  |  |
|
||||||
|
|---|---|
|
||||||
|
| Pi Setup | Pi - Live Stream |
|
||||||
|
|
||||||
*Windows (CMD)*
|
## Preconditions
|
||||||
|
|
||||||
|
* Raspberry Pi 4, 2GB is recommended for optimal performance. However you can use a Pi 3 or older, you may see a increase in latency.
|
||||||
|
* Raspberry Pi 4 Camera Module or Pi HQ Camera Module (Newer version)
|
||||||
|
* Python 3 recommended.
|
||||||
|
|
||||||
|
## Library dependencies
|
||||||
|
Install the following dependencies to create camera stream.
|
||||||
|
|
||||||
```
|
```
|
||||||
venv\Scripts\activate.bat
|
sudo apt-get install libatlas-base-dev
|
||||||
```
|
sudo apt-get install libjasper-dev
|
||||||
|
sudo apt-get install libqtgui4
|
||||||
|
sudo apt-get install libqt4-test
|
||||||
|
sudo apt-get install libhdf5-dev
|
||||||
|
|
||||||
*Linux / Mac OS*
|
sudo pip3 install flask
|
||||||
|
sudo pip3 install numpy
|
||||||
|
sudo pip3 install opencv-contrib-python
|
||||||
|
sudo pip3 install imutils
|
||||||
|
sudo pip3 install opencv-python
|
||||||
|
|
||||||
```
|
|
||||||
source venv/bin/activate
|
|
||||||
```
|
```
|
||||||
|
|
||||||
### Installing the dependencies
|
pip3 install opencv-python
|
||||||
|
|
||||||
|
## Step 1 – Cloning Raspberry Pi Camera Stream
|
||||||
|
Open up terminal and clone the Camera Stream repo:
|
||||||
|
|
||||||
```
|
```
|
||||||
pip install -r requirements.txt
|
cd /home/pi
|
||||||
|
git clone https://github.com/EbenKouao/pi-camera-stream-flask.git
|
||||||
```
|
```
|
||||||
|
|
||||||
### Running the app (not recommended for production)
|
## Step 2 – Launch Web Stream
|
||||||
|
|
||||||
|
Note: Creating an Autostart of the main.py script is recommended to keep the stream running on bootup.
|
||||||
|
```bash cd modules
|
||||||
|
sudo python3 /home/pi/pi-camera-stream-flask/main.py
|
||||||
|
```
|
||||||
|
|
||||||
|
## Step 3 – Autostart your Pi Stream
|
||||||
|
|
||||||
|
Optional: A good idea is running your Pi Camera stream at Pi boot up. This removes the need to re-run the script every time you want to create the stream.
|
||||||
|
You can do this by going adding the boot up code the .bashrc file.
|
||||||
|
|
||||||
|
Via the Desktop GUI - right click in your /home/pi/ directory -> show hidden -> open .bashrc and add the code.
|
||||||
|
Or alternatively access via terminal:
|
||||||
|
|
||||||
```
|
```
|
||||||
python main.py
|
sudo nano /home/pi/.bashrc
|
||||||
```
|
```
|
||||||
|
|
||||||
|
Go the end of the and add the following (from above):
|
||||||
|
|
||||||
|
```
|
||||||
|
sudo python3 /home/pi/pi-camera-stream-flask/main.py
|
||||||
|
```
|
||||||
|
This would cause the following terminal command to auto-start upon Raspberry Pi boot up.
|
||||||
|
|
||||||
|
## Download Beta image of Raspberry Pi Camera Stream
|
||||||
|
Any troubles installing, try out the already compiled Raspberry Pi (Raspbian OS) Image of [Raspberry Pi Camera Stream](https://smartbuilds.io).
|
||||||
|
|
||||||
|
|
|
||||||
42
camera.py
42
camera.py
|
|
@ -1,17 +1,21 @@
|
||||||
|
#Modified by smartbuilds.io
|
||||||
|
#Date: 27.09.20
|
||||||
|
#Desc: This scrtipt script..
|
||||||
|
|
||||||
import cv2
|
import cv2
|
||||||
from datetime import datetime
|
from imutils.video.pivideostream import PiVideoStream
|
||||||
|
import imutils
|
||||||
|
import time
|
||||||
import numpy as np
|
import numpy as np
|
||||||
|
|
||||||
class VideoCamera(object):
|
class VideoCamera(object):
|
||||||
def __init__(self, flip=False, file_type=".jpg", photo_string="stream_photo"):
|
def __init__(self, flip = False):
|
||||||
self.vs = cv2.VideoCapture(0)
|
self.vs = PiVideoStream().start()
|
||||||
self.flip = flip
|
self.flip = flip
|
||||||
self.file_type = file_type
|
time.sleep(2.0)
|
||||||
self.photo_string = photo_string
|
|
||||||
self.exposure_value = self.vs.get(cv2.CAP_PROP_EXPOSURE)
|
|
||||||
|
|
||||||
def __del__(self):
|
def __del__(self):
|
||||||
self.vs.release()
|
self.vs.stop()
|
||||||
|
|
||||||
def flip_if_needed(self, frame):
|
def flip_if_needed(self, frame):
|
||||||
if self.flip:
|
if self.flip:
|
||||||
|
|
@ -19,26 +23,6 @@ class VideoCamera(object):
|
||||||
return frame
|
return frame
|
||||||
|
|
||||||
def get_frame(self):
|
def get_frame(self):
|
||||||
ret, frame = self.vs.read()
|
frame = self.flip_if_needed(self.vs.read())
|
||||||
if not ret:
|
ret, jpeg = cv2.imencode('.jpg', frame)
|
||||||
return None
|
|
||||||
|
|
||||||
frame = self.flip_if_needed(frame)
|
|
||||||
ret, jpeg = cv2.imencode(self.file_type, frame)
|
|
||||||
return jpeg.tobytes()
|
return jpeg.tobytes()
|
||||||
|
|
||||||
def take_picture(self):
|
|
||||||
ret, frame = self.vs.read()
|
|
||||||
if not ret:
|
|
||||||
return
|
|
||||||
|
|
||||||
frame = self.flip_if_needed(frame)
|
|
||||||
today_date = datetime.now().strftime("%m%d%Y-%H%M%S")
|
|
||||||
cv2.imwrite(str("static/images/" + self.photo_string + "_" + today_date + self.file_type), frame)
|
|
||||||
|
|
||||||
def set_exposure(self, exposure_value):
|
|
||||||
self.vs.set(cv2.CAP_PROP_EXPOSURE, exposure_value)
|
|
||||||
self.exposure_value = exposure_value
|
|
||||||
|
|
||||||
def get_exposure(self):
|
|
||||||
return self.exposure_value
|
|
||||||
|
|
|
||||||
50
main.py
50
main.py
|
|
@ -1,26 +1,25 @@
|
||||||
from flask import Flask, render_template, Response
|
#Modified by smartbuilds.io
|
||||||
|
#Date: 27.09.20
|
||||||
|
#Desc: This web application serves a motion JPEG stream
|
||||||
|
# main.py
|
||||||
|
# import the necessary packages
|
||||||
|
from flask import Flask, render_template, Response, request
|
||||||
from camera import VideoCamera
|
from camera import VideoCamera
|
||||||
from util import list_files_in_dir, generate_url
|
import time
|
||||||
|
import threading
|
||||||
|
import os
|
||||||
|
|
||||||
camera = VideoCamera(flip=False)
|
pi_camera = VideoCamera(flip=False) # flip pi camera if upside down.
|
||||||
|
|
||||||
|
# App Globals (do not edit)
|
||||||
app = Flask(__name__)
|
app = Flask(__name__)
|
||||||
|
|
||||||
@app.route('/')
|
@app.route('/')
|
||||||
def index():
|
def index():
|
||||||
return render_template('index.html')
|
return render_template('index.html') #you can customze index.html here
|
||||||
|
|
||||||
@app.route('/images')
|
|
||||||
def images_view():
|
|
||||||
file_directory = 'images'
|
|
||||||
url_list = list()
|
|
||||||
|
|
||||||
for file in list_files_in_dir('static/'+file_directory):
|
|
||||||
url_list.append(generate_url(file_directory, file))
|
|
||||||
|
|
||||||
return render_template('images.html', urls=url_list)
|
|
||||||
|
|
||||||
def gen(camera):
|
def gen(camera):
|
||||||
|
#get camera frame
|
||||||
while True:
|
while True:
|
||||||
frame = camera.get_frame()
|
frame = camera.get_frame()
|
||||||
yield (b'--frame\r\n'
|
yield (b'--frame\r\n'
|
||||||
|
|
@ -28,25 +27,12 @@ def gen(camera):
|
||||||
|
|
||||||
@app.route('/video_feed')
|
@app.route('/video_feed')
|
||||||
def video_feed():
|
def video_feed():
|
||||||
return Response(gen(camera),
|
return Response(gen(pi_camera),
|
||||||
mimetype='multipart/x-mixed-replace; boundary=frame')
|
mimetype='multipart/x-mixed-replace; boundary=frame')
|
||||||
|
|
||||||
@app.route('/picture')
|
|
||||||
def take_picture():
|
|
||||||
camera.take_picture()
|
|
||||||
return "None"
|
|
||||||
|
|
||||||
@app.route('/moreexposure')
|
|
||||||
def more_exposure():
|
|
||||||
exposure = camera.get_exposure()
|
|
||||||
camera.set_exposure(exposure + 1)
|
|
||||||
return "None"
|
|
||||||
|
|
||||||
@app.route('/lessexposure')
|
|
||||||
def less_exposure():
|
|
||||||
exposure = camera.get_exposure()
|
|
||||||
camera.set_exposure(exposure - 1)
|
|
||||||
return "None"
|
|
||||||
|
|
||||||
if __name__ == '__main__':
|
if __name__ == '__main__':
|
||||||
|
|
||||||
app.run(host='0.0.0.0', debug=False)
|
app.run(host='0.0.0.0', debug=False)
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
|
|
@ -1,10 +0,0 @@
|
||||||
blinker==1.6.2
|
|
||||||
click==8.1.7
|
|
||||||
colorama==0.4.6
|
|
||||||
Flask==2.3.3
|
|
||||||
itsdangerous==2.1.2
|
|
||||||
Jinja2==3.1.2
|
|
||||||
MarkupSafe==2.1.3
|
|
||||||
numpy==1.25.2
|
|
||||||
opencv-python==4.8.0.76
|
|
||||||
Werkzeug==2.3.7
|
|
||||||
|
|
@ -1,45 +0,0 @@
|
||||||
$(function() {
|
|
||||||
$('a#take-picture').on('click', function(e) {
|
|
||||||
e.preventDefault()
|
|
||||||
$.getJSON('/picture',
|
|
||||||
function(data) {
|
|
||||||
//do nothing
|
|
||||||
});
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
$(function() {
|
|
||||||
$('a#more-exposure').on('click', function(e) {
|
|
||||||
e.preventDefault()
|
|
||||||
$.getJSON('/moreexposure',
|
|
||||||
function(data) {
|
|
||||||
//do nothing
|
|
||||||
});
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
$(function() {
|
|
||||||
$('a#less-exposure').on('click', function(e) {
|
|
||||||
e.preventDefault()
|
|
||||||
$.getJSON('/lessexposure',
|
|
||||||
function(data) {
|
|
||||||
//do nothing
|
|
||||||
});
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
$(function() {
|
|
||||||
$('a#copy-video-stream-url').on('click', function(e) {
|
|
||||||
const textArea = document.createElement("textarea");
|
|
||||||
const video_stream_path = document.getElementById("bg").src;
|
|
||||||
textArea.value = video_stream_path;
|
|
||||||
document.body.appendChild(textArea);
|
|
||||||
textArea.select();
|
|
||||||
document.execCommand("copy");
|
|
||||||
document.body.removeChild(textArea);
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
@ -1,84 +0,0 @@
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
width: 100vw;
|
|
||||||
height: 100vh;
|
|
||||||
overflow: hidden;
|
|
||||||
background-color: black;
|
|
||||||
font-family: Arial, Helvetica, sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar {
|
|
||||||
overflow: hidden;
|
|
||||||
position: fixed;
|
|
||||||
bottom: 0;
|
|
||||||
width: 100%;
|
|
||||||
margin: auto;
|
|
||||||
text-align: center;
|
|
||||||
background-color: black;
|
|
||||||
opacity:0.6;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar div {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar a {
|
|
||||||
float: left;
|
|
||||||
display: block;
|
|
||||||
color: #f2f2f2;
|
|
||||||
text-align: center;
|
|
||||||
padding: 14px 16px;
|
|
||||||
text-decoration: none;
|
|
||||||
font-size: 17px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar a.active {
|
|
||||||
background-color: #4CAF50;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.main {
|
|
||||||
padding: 16px;
|
|
||||||
margin-bottom: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
i.fa {
|
|
||||||
display: inline-block;
|
|
||||||
border-radius: 60px;
|
|
||||||
box-shadow: 0px 0px 2px #888;
|
|
||||||
padding: 0.5em 0.6em;
|
|
||||||
background: blue;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
display: block;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
width: 35%
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
background-color: Transparent;
|
|
||||||
background-repeat:no-repeat;
|
|
||||||
border: none;
|
|
||||||
cursor:pointer;
|
|
||||||
overflow: hidden;
|
|
||||||
outline:none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.camera-bg {
|
|
||||||
display: block;
|
|
||||||
margin: auto;
|
|
||||||
|
|
||||||
max-height: 100vh;
|
|
||||||
max-width: 100vh;
|
|
||||||
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
background-position: center;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-size: cover;
|
|
||||||
background-attachment: fixed;
|
|
||||||
}
|
|
||||||
|
|
@ -1,13 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>Camera Live Feed - Images</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
{% for url in urls %}
|
|
||||||
<img src="{{ url }}" alt="Taken Image">
|
|
||||||
{% endfor %}
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
@ -1,62 +1,177 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<title>Camera Live Feed</title>
|
<style>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
body {
|
||||||
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
|
margin: 0;
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
font-family: Arial, Helvetica, sans-serif;
|
||||||
</head>
|
}
|
||||||
|
|
||||||
<body>
|
.navbar {
|
||||||
<div class="main">
|
overflow: hidden;
|
||||||
<img class="camera-bg" id="bg" class="center" src="{{ url_for('video_feed') }}">
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
margin: auto;
|
||||||
|
background-color: black;
|
||||||
|
opacity:0.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar a {
|
||||||
|
float: left;
|
||||||
|
display: block;
|
||||||
|
color: #f2f2f2;
|
||||||
|
text-align: center;
|
||||||
|
padding: 14px 16px;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar a:hover {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar a.active {
|
||||||
|
background-color: #4CAF50;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main {
|
||||||
|
padding: 16px;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.camera-movement{
|
||||||
|
float: none;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.lights-button{
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
i.fa {
|
||||||
|
display: inline-block;
|
||||||
|
border-radius: 60px;
|
||||||
|
box-shadow: 0px 0px 2px #888;
|
||||||
|
padding: 0.5em 0.6em;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
display: block;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
width: 35%
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
background-color: Transparent;
|
||||||
|
background-repeat:no-repeat;
|
||||||
|
border: none;
|
||||||
|
cursor:pointer;
|
||||||
|
overflow: hidden;
|
||||||
|
outline:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
//CSS
|
||||||
|
.camera-bg {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
|
||||||
|
/* Preserve aspet ratio */
|
||||||
|
min-width: 100%;
|
||||||
|
min-height: 100%;
|
||||||
|
|
||||||
|
/* Full height */
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
|
||||||
|
/* Center and scale the image nicely */
|
||||||
|
background-position: center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.top-right-logo {
|
||||||
|
position: absolute;
|
||||||
|
top: 3%;
|
||||||
|
left: 2%;
|
||||||
|
font-size: 38px;
|
||||||
|
color: white;
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
overflow: hidden;
|
||||||
|
background-color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<title>Make - PiStream</title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="main" id="newpost">
|
||||||
|
<img class="camera-bg" style="width: 100%; height:80%; background-attachment: fixed;" id="bg" class="center" src="{{ url_for('video_feed') }}">
|
||||||
|
<!--<img class="camera-bg" style="width: 100%; height:80%; background-attachment: fixed;" id="bg" class="center" src="https://www.psdbox.com/wp-content/uploads/2011/01/security-camera-photoshop-effect.jpg">-->
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="top-right-logo">
|
||||||
|
<a></a>Raspberry Pi - Camera Stream </a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="navbar">
|
|
||||||
<div>
|
<div class="navbar">
|
||||||
<a href="/images" title="Gallery">
|
|
||||||
<button>
|
<div class="ignoreCall">
|
||||||
<i class="fa fa-picture-o fa-2x" aria-hidden="true"></i>
|
<a id=decline class="but_def">
|
||||||
|
<button id="button">
|
||||||
|
<i style="background: red; color: white;" class="fa fa-times fa-2x" aria-hidden="true"></i>
|
||||||
</button>
|
</button>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
</div>
|
||||||
<a href="#" id="take-picture" title="Take a picture">
|
|
||||||
<button>
|
|
||||||
<i class="fa fa-camera fa-2x" aria-hidden="true"></i>
|
|
||||||
</button>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<a href="#" id="more-exposure" title="More exposure">
|
|
||||||
<button>
|
|
||||||
<i class="fa fa-plus fa-2x" aria-hidden="true"></i>
|
|
||||||
</button>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<a href="#" id="less-exposure" title="Less exposure">
|
|
||||||
<button>
|
|
||||||
<i class="fa fa-minus fa-2x" aria-hidden="true"></i>
|
|
||||||
</button>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
|
||||||
<a href="#" id="copy-video-stream-url" title="Copy the video stream url">
|
|
||||||
<button>
|
|
||||||
<i class="fa fa-clipboard fa-2x" aria-hidden="true"></i>
|
|
||||||
</button>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
<script type="text/javascript">
|
||||||
|
|
||||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
|
var button = document.getElementById('button');
|
||||||
<script type="text/javascript" src="{{ url_for('static', filename='script.js') }}"></script>
|
|
||||||
</body>
|
button.onclick = function() {
|
||||||
|
var div = document.getElementById('newpost');
|
||||||
|
if (div.style.display !== 'none') {
|
||||||
|
div.style.display = 'none';
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
div.style.display = 'block';
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
|
|
|
||||||
13
util.py
13
util.py
|
|
@ -1,13 +0,0 @@
|
||||||
import os
|
|
||||||
from flask import url_for
|
|
||||||
|
|
||||||
def list_files_in_dir(directory_path: str) -> list[str]:
|
|
||||||
file_list = os.listdir(directory_path)
|
|
||||||
|
|
||||||
file_list = [file for file in file_list if os.path.isfile(os.path.join(directory_path, file))]
|
|
||||||
|
|
||||||
return file_list
|
|
||||||
|
|
||||||
def generate_url(directory_path: str, file_name: str) -> str:
|
|
||||||
url = url_for('static', filename=f'{directory_path}/{file_name}')
|
|
||||||
return url
|
|
||||||
Loading…
Reference in New Issue