Coder Social home page Coder Social logo

aaaasmile / live-omxctrl Goto Github PK

View Code? Open in Web Editor NEW
0.0 2.0 0.0 1.61 MB

Web Music Player for the Raspberry P4 based on omxplayer, but not only.

License: MIT License

Go 4.68% Shell 0.36% PowerShell 0.04% CSS 0.23% JavaScript 93.46% Vue 1.17% HTML 0.07%
omxplayer raspberry

live-omxctrl's Introduction

live-omxctrl

Live-omxctrl is a web interface for playing music and urls on Raspberry P4. This application can play files stored on the Pi4 device and also links provided by the tube.
Simply copy an URl from the tube app and paste it into this Live Music app. Playing files and playlist from the flash card is from yesterday.

At the end it is also another simple Web UI for omxplayer, but with some small features more then usually.

Playing a chill out music from the tube controlled by the iphone is pretty easy:

alt text

Use Case

Turn on the Pi4 and turn on the HiFi connected to the Pi4 via hdmi cable. In your Iphone browser goto the Pi4 Ip Address with :5548/omx/#/ suffix and paste a tube URL. Tap the icon play url and enjoy the music. Before turning off the Pi4 device, in OS view tap the shutdown icon and wait a little before power turn off.

OS View

After destroying a couple of sd cards turning off the Pi4 using an hard power shutdown, I added a software shutdown functionality to this app.

alt text

Reboot and a Service Restart are also available. For the Service Restart the app should be configured as a service called live-omxctrl.service. The service owner should be able to run sudo commands without asking a password.

Development

This app uses omxplayer in background with a golang backend, an embedded Vue.js frontend and Websocket for updating the state.
The omxplayer is controlled using the dbus inteface.

The golang environment is set up directly on the target (https://dl.google.com/go/go1.13.12.linux-armv6l.tar.gz). In this way, the dbus and the omx-player are on Pi4. Cross compiling the dbus library was not working as expected in windows. With Visual Code and the ssh remote dev extension, the development is pretty the same as in the windows manchine.

Before starting the application with: go run main.go

the config file config.toml should be changed.

ServiceURL=<pi4-IP:portapp>
TmpInfo=<temp directory to store the url description>

The UI is developed using Vue.js and Vuetify directly on the golang backend without setting up a node.js environment.

Sound strange? It works.

The content of files with the .vue extension is copied inside the same file named with the .js extension, inside the template section.
This could be done automatically in Visual Code using the extension vuetempltojs. On Pi4 the exetnsion will not work, so the command should be called manually. For example, after changing the file playerbar.vue the playerbar.js is updated with:

igors@pi4:~/app/go/live-omxctrl $ /usr/local/bin/vuetojs.bin -vue ./static/js/vue/components/playerbar.vue 

If you don't like it, feel free to setup a separate Vue project inside a node.js environment that wil run inside a golang backend developed at the same time.

live-omxctrl's People

Contributors

aaaasmile avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.