oliblake
Posts: 3
Joined: Sun Jul 30, 2017 8:57 pm

Controlling sound files with html buttons

Sun Jul 30, 2017 9:02 pm

Hi, I am wanting to do a project where I have sound files on the Pi and then be able to play/pause them from buttons on a html page. Basically, I would create a simple html page and then have buttons linking to different sound files. When any of the buttons are clicked it would play the sound it is linked to out of the pi audio jack and then pause when the button is clicked again. I was wondering if this is possible and how difficult it would be to achieve. Also I would like to host the Web page on the pi and access it on a phone to play the sounds through the pi. Thank you in advance.

User avatar
topguy
Posts: 3717
Joined: Tue Oct 09, 2012 11:46 am
Location: Trondheim, Norway

Re: Controlling sound files with html buttons

Sun Aug 13, 2017 1:42 pm

Definitly doable, and there would be many different ways of doing it. Maybe too many, your experience would be useful to know to reduce the number of options.

An example:
- A pure Python based solution using "Flask" ( https://www.raspberrypi.org/learning/py ... ith-flask/ ) to create web-server/page and then use PyGame to play sounds (http://www.nerdparadise.com/programming/pygame/part3).

oliblake
Posts: 3
Joined: Sun Jul 30, 2017 8:57 pm

Re: Controlling sound files with html buttons

Tue Aug 15, 2017 7:51 pm

Thanks for the reply. My experience is pretty limited so I would like a fairly easy way to achieve what I am after. I will try the example you linked to first and see how I get on with it. Would you be able to provide any other examples please?

Thank you

User avatar
karrika
Posts: 952
Joined: Mon Oct 19, 2015 6:21 am
Location: Finland

Re: Controlling sound files with html buttons

Wed Aug 16, 2017 5:48 am

I would go for a real music player and just interact on it. There is a music player called Clementine for the Pi that can be controlled over dbus in Python. A small example:

Code: Select all

import dbus

# Clementine lives on the Session bus
session_bus = dbus.SessionBus()

# Get Clementine's player object, and then get an interface from that object,
# otherwise we'd have to type out the full interface name on every method call.
player = session_bus.get_object('org.mpris.clementine', '/Player')
iface = dbus.Interface(player, dbus_interface='org.freedesktop.MediaPlayer')

# Call a method on the interface
metadata = iface.GetMetadata()
print metadata["title"]
print metadata["artist"]
And playing the next tune

Code: Select all

iface.Next()
You might be able to send dbus commands from your Flask web server while Clementine is running. As a nice extra you can also use the Clementine from your screen at the same time. This approach is a bit more hi-tech but the result is much more satifying. You can also query the metadata of the tune being played and relay the stuff back to your phone from which you run the controls.

oliblake
Posts: 3
Joined: Sun Jul 30, 2017 8:57 pm

Re: Controlling sound files with html buttons

Thu Aug 17, 2017 8:23 pm

topguy wrote:
Sun Aug 13, 2017 1:42 pm
Definitly doable, and there would be many different ways of doing it. Maybe too many, your experience would be useful to know to reduce the number of options.

An example:
- A pure Python based solution using "Flask" ( https://www.raspberrypi.org/learning/py ... ith-flask/ ) to create web-server/page and then use PyGame to play sounds (http://www.nerdparadise.com/programming/pygame/part3).
I got it to run a script to play a sound when clicking a html button but it redirects the page to the route defined for the script and can't click another button to play another sound. I have to go back to index but then the button doesn't work. I want to have about 20 html or php buttons each linked to a script for a different sound. For instance I click button 'A' and it plays sound 'A' then I want to press button 'B' to play sound 'B' etc.

Thanks

scotty101
Posts: 2389
Joined: Fri Jun 08, 2012 6:03 pm

Re: Controlling sound files with html buttons

Fri Aug 18, 2017 8:36 am

I have a web based "TV Remote" that has multiple buttons and clicking on the buttons sends a link 'in the background' using Javascript rather than refreshing the page or calling a new page.

Have a look at the HTML/JavaScript and see if you can make use of it
https://github.com/scotty3785/pi_tv_rem ... emote.html
Electronic and Computer Engineer
Pi Interests: Home Automation, IOT, Python and Tkinter

Return to “General programming discussion”

Who is online

Users browsing this forum: No registered users and 4 guests