Welcome to Toshimote! Toshimote is a web application that I developed for use with an Ubuntu media server I have hooked up to my television. I was tired of using VNC to do something as simple as pause a video and Toshimote is the result.
If you would like to make visit my static apps page on Toshimote, head over to: /apps/toshimote
AND click here to view a hands on (non-working) demo of the site (best viewed from iPhone).
Resources
Overview
There are really two main parts to this project, (1) web applilcation and (2) server applications. All the website is doing is sending commands to the server to be executed with the TV as the display. Immediately below is a video demonstration I put together showing how this all works. It might be a good idea to give it a quick view so you have a mental image of what’s going on when I go through the sections below.
Server
The very first item that needs to be mentioned is how you redirect output to the physical monitor attached to the server, in my case, the television. The global variable DISPLAY stores what display is being used. Typically the change to DISPLAY is so that you can execute X11 programs from the server on your local machine. But this time we want to redirect a little differently.
> > export DISPLAY=":0.0" > >
I believe this value is typically consistent, but you can double check on your server by seeing what the value of $DISPLAY is.
> > echo $DISPLAY > >
The server apps are extremely simple thanks to xte. Xte is an application that reads arguments to execute key strokes and mouse movements. All I did was write a shell script for each individual command I wanted to execute and stored the script in /usr/local/bin. Here are a few examples of some scripts I use.
> > _#Ubuntu menu_ > > #!/bin/bash xte 'keydown Alt_L'; xte 'key F1'; xte 'keyup Alt_L'
> > _#Move mouse to the left_ > > #!/bin/bash touch /home/jason/flags/mousemove.flag; while [ -f /home/jason/flags/mousemove.flag ];do xte 'mousermove -2 0' done
> > _#Stop mouse movement_ > > #!/bin/bash if [ -f /home/jason/flags/mousemove.flag ];then rm -f /home/jason/flags/mousemove.flag fi
Keep in mind that this is where lots of modification would need to be done. I opened up the keyboard shortcuts application in Ubuntu and used that as my resource for writing all the scripts.
The last thing that I’d like to mention about the server is in the Apache setup. I couldn’t in a short amount of time get the web user (www-data) to either execute commands or change the DISPLAY value (I can’t remember anymore). To solve this I took a step that will make most everyone cringe. I modified /etc/apache2/envvars and changed the login to the one and only real user of the box, ‘jason’. You probably noticed that I had my flag for mouse movements hard coded to /home/jason. I know that ~ does not work but I never checked ${HOME}. As I am only developing this application for myself, I took the easy/lazy way out and rounded a few corners. As for security, I basically tossed it out the window. It doesn’t take a genius to realize that they could do some serious damage to my files with this web app, but the site is hosted locally on the server that is behind the router. And if someone were to spend the time … it is just my media server, nothing important is kept on that box.
Web App
The GUI is simple. A three column and infinite number of rows table. Oh yes I did. Tables are still alive and well in my world. Honestly this is the most perfect use of an HTML table that I’ve ever used. There really is nothing complex about the GUI.
AJAX is our friend in this app. We don’t want the remote to reload every time we click a button. Especially when we use the mouse and have to click twice (once to start the movement of the mouse and once to stop the movement). When a button on the remote is clicked, the name of the script is sent through to a PHP script that executes that command. Yes, I know, as I said above, security nightmare. But that’s really all there is to the web app side. Here are a few code snippets:
> > _runScript.php_ > > $com = $_REQUEST['com']; $run_command='export DISPLAY=":0.0";'.${com}; exec($run_command);
> > _Javascript function_ > > function doCommand(command) { if (command=="xte_mouse_left_go" || command=="xte_mouse_right_go" || command=="xte_mouse_up_go" || command=="xte_mouse_down_go") { // show the full screen banner that user clicks to stop mouse document.getElementById("banner").style.visibility="visible"; document.getElementById("controls").style.visibility="collapse"; document.getElementById("banner").innerHTML="[less than]a href=\"#\" onClick=\"doCommand('xte_mouse_stop');\">Click to stop mouse[less than]/a>" } else { // hide the full screen banner that user clicks to stop mouse and show buttons document.getElementById("banner").style.visibility="hidden"; document.getElementById("controls").style.visibility="visible"; } xmlhttp=new XMLHttpRequest(); xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("myDiv").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","runScript.php?com="+command,true); xmlhttp.send(); }
Where next?
Realistically what I plan to do with Toshimote is to just add more buttons whenever the need arises. I will zip up all my code and post it on the site here as a resource to any that want to set up something similar. But for further development towards a public easy to use release, eh…
What should happen if I were to continue this project is mainly secure it up. I would make one single script that is the middle man between the web app and the actual commands being run on the server. It would take arguments and execute the proper script based on the arguments. That way, commands that aren’t xte scripts couldn’t be executed.
I would also put more effort into getting the default www-data user up and running and/or do a little more research on how things are suppose to be run on the server from the outside world.
Those are really the two main things that come to mind right off the bat. I’m sure I’ll come up with many more things that I want the remote to be able to do while laying in bed trying to fall asleep, though. If you have anything that you’d like to see on the Toshimote, either contact me or leave a comment here.