run Qlab cue via osc with a web page and python

you have to use Qlab but you don’t have a Streamdeck or a midi controller?

You can create a web page with custom button to open in local or with another device

with chat gpt I created buttons that allow you to send cues via web page.
install python
install flask frameworks from terminal

pip3 install Flask

Create a Python (app.py) file with this code (I recommend using visual studio code)

from flask import Flask, render_template
from pythonosc import udp_client

app = Flask(__name__)

# Indirizzo IP e porta su cui QLab sta ascoltando i messaggi OSC
QLAB_IP = "127.0.0.1"  # Modifica questo indirizzo IP se QLab è in esecuzione su un altro computer
QLAB_PORT = 53000  # Porta predefinita per la comunicazione OSC con QLab

# Crea un client OSC per inviare messaggi a QLab
client = udp_client.SimpleUDPClient(QLAB_IP, QLAB_PORT)

# Funzione per avviare il cue specificato in QLab
def start_cue(cue_number):
    address = "/cue/{0}/start".format(cue_number)  # Costruisci l'indirizzo OSC per avviare il cue specificato
    client.send_message(address, None)
    print("Cue {0} avviato in QLab.".format(cue_number))

# Pagina iniziale
@app.route('/')
def index():
    return render_template('index.html')

# Funzione chiamata quando il pulsante viene premuto
@app.route('/avvia_cue/<int:cue_number>')
def avvia_cue(cue_number):
    start_cue(cue_number)
    return "Cue {} avviato in QLab.".format(cue_number)

if __name__ == '__main__':
    app.run(debug=True)

Create a folder called templates inside the same directory as your app.py file. Within this folder, create an HTML file called index.html and write the following HTML code:


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Avvia Cue in QLab</title>
</head>
<body>
    <h1>Avvia Cue in QLab</h1>
    <button onclick="avviaCue(1)">Avvia Cue 1</button>
    <button onclick="avviaCue(2)">Avvia Cue 2</button>

    <script>
        function avviaCue(cueNumber) {
            fetch('/avvia_cue/' + cueNumber)
                .then(response => response.text())
                .then(data => alert(data));
        }
    </script>
</body>
</html>

run app.py with visual studio code

Open your browser and go to http://127.0.0.1:5000

You can, with some changes in the code (via chatgpt), open the web page from other computer, smartphone, ipad. In the same network or with a virtual network