Spicer Matthews » Web 2.0 http://www.spicermatthews.com Random Thoughts By Spicer Matthews Wed, 09 Jun 2010 20:00:17 +0000 en hourly 1 http://wordpress.org/?v=3.0.1 AudioBox – Real Cloud Based Musichttp://www.spicermatthews.com/audiobox-real-cloud-based-music/ http://www.spicermatthews.com/audiobox-real-cloud-based-music/#comments Sun, 16 May 2010 19:55:44 +0000 Spicer http://www.spicermatthews.com/?p=199 Grooveshark.com has sort of done it but their way of doing things is a little odd and they use way to much flash.]]> scr01 small AudioBox Real Cloud Based Music
When it comes to hardware and operating systems I am one of the biggest Apple fan boys out there. When it comes to software and control I am truly annoyed by Apple. As a side note I am an Apple share holder and I love what they do from a business stand point. Apple has held back music players for years. They released iTunes a long time ago and it blew all the music players out of the water. Back then compiled desktop based software was cool. Then they went full speed ahead with the Apple iTunes music store. This was amazing from a lets kill cds standpoint.

I have a library of music that I have gotten from all different sources; Amazon, iTunes, cd rips, and so on. I want to stuff all this music in one bloat free place and have it with me everywhere I go. If I am 100% an Apple user this place is iTunes, but I am not. I have an Android phone, a windows netbook, linux laptop, Apple desktop, Apple laptop. There is no easy way with iTunes to keep all these devices in sync when it comes to my music. Nor do I want my 13 Gig music stash living on all these devices. The service that was about to do all this was Lala.com until Apple purchased them and closed them down. Grooveshark.com has sort of done it but their way of doing things is a little odd and they use way to much flash.

Finally!!! AudioBox to the rescue!! AudioBox is a service that gives me a complete cloud-based music solution. I pay them a small fee and can upload all my music. I can play their music from any web browser. They have a mobile platform, and best of all they exposed an API that allows me to have complete control over my music collection. While I am sure the rumors that Apple is working on a cloud-based version of iTunes is true, I am 100% sure they are not going to give you complete control over your music nor are they going to make it very easy for me to use my music on non-apple devices.

Below is a little PHP script I wrote to mass up load my music to AudioBox. I am using AudioBox 100% from now on! I am sick of plugging my phone into my computer. I am sick of writing sync scripts to keep my mp3′s up-to-date on all my devices.


/*
By: Spicer Matthews
Date: 5/16/2010
*/

$email = 'user@example.org';
$pass = '**********';
$dir = '/my/music/folder';
foreach(get_filenames($dir) AS $key => $row)
{
if(preg_match('/.mp3/', strtolower($row)))
exec("curl -F media=@'$row' -u $email:$pass https://audiobox.fm/api/tracks");
}

//
// Get all file names in directory. (thanks CI - http://codeigniter.com/user_guide/helpers/file_helper.html)
//
function get_filenames($source_dir, $include_path = TRUE, $_recursion = FALSE)
{
static $_filedata = array();

if ($fp = @opendir($source_dir))
{
if ($_recursion === FALSE)
{
$_filedata = array();
$source_dir = rtrim(realpath($source_dir), DIRECTORY_SEPARATOR).DIRECTORY_SEPARATOR;
}

while (FALSE !== ($file = readdir($fp)))
{
if (@is_dir($source_dir.$file) && strncmp($file, '.', 1) !== 0)
{
get_filenames($source_dir.$file.DIRECTORY_SEPARATOR, $include_path, TRUE);
}
elseif (strncmp($file, '.', 1) !== 0)
{

$_filedata[] = ($include_path == TRUE) ? $source_dir.$file : $file;
}
}
return $_filedata;
}
}
?>

]]> http://www.spicermatthews.com/audiobox-real-cloud-based-music/feed/ 2 My Love Of Jquery’s Form Pluginhttp://www.spicermatthews.com/my-love-of-jquerys-form-plugin/ http://www.spicermatthews.com/my-love-of-jquerys-form-plugin/#comments Wed, 15 Apr 2009 22:11:10 +0000 Spicer http://blog.spicermatthews.com/?p=20 http://jquery.com (more on them in another post).]]> The type of web programing I do often has a large database back-end with which requires user input and data return. In the olden days you just created an html form and then posted some input data to some cgi (say PHP script) and the script would speak with the database and return some html causing the browser to reload on post. Now, that we are a super cool web 2.0 world we do things differently. We make our friend javascript use Ajax to do the post for us. If you are anything like me you take one look at javascript and say “no thank you”. Most people hate the syntax of javascript, the confusion of the language, or the browser compatibility issues; when I say most people I am including me. This is where our friends at Jquery come to the rescue http://jquery.com (more on them in another post).

For now I want to highlight a jquery plugin, an additional library that grows the functionality of jquery. The Form Plugin (Hosted Here) allows jquery to submit form data via Ajax either when the user hits submit using the ajaxForm() or on demand using ajaxSubmit(). Here is an example of how I used it in a recent project.

index.php -

So from the above html code you can see there is no submit button. Our goal here is to make it so when you change anyone of the input form items it will collect the value of each field and post the data to returnGraph.php. The data will be posted via Ajax so there is no page refresh. We want Ajax to change the graph and put the graph in the div with id “graph-return”. We also want some sort of spinner to spin to show the user the browser is thinking and waiting for a graph to appear. We are going to put an animated gif in the graph div that will be replaced with the graph when it is returned from returnGraph.php.

The next step is the write some javascript. You need to make sure you have the jquery and form plug in included in your code.





Here is the Javascript I use to bind to the form to make the Ajax call and to also bind to the input items to make a post on change.

// This function will deal with Chart controls.
function setupControls()
{
// Setup Date Picker
$(“#date”).datepicker({
mandatory: true,
dateFormat: “M d, yy”,
showOn: “both”,
maxDate: “1″,
buttonImage: “../images/calendar.gif”,
buttonImageOnly: true,
onSelect: function (date) {
resubmitGraph();
}
});

// Setup a generic bind to bind all input fields to get a new graph
$(“#control-form :input”).change(resubmitGraph);
}

// This function will get the value of each control and submit an ajax form request to reder new
// graph.
function resubmitGraph()
{
$(“#control-form”).ajaxSubmit({
beforeSubmit: function () {
$(“#graph-return”).html(‘<div class=”loading1″ style=”margin: 20% 0 0 45%;”></div>’);
},
success: function (response) {
$(“#graph-return”).html(response);
}
});
}

I will not cover what datepicker is but it is part of the jquery ui plugin. I will cover this in a later post. Jquery UI

The function resubmitGraph() is where all the magic happens. It does something call seralize the form data. It goes through each input form field creates a php post string. Here is an example unrelated to my example. I got it from here Here

Now in the background the ajaxSubmit() function sends the serialized form Post to returnGraph.php. Also, just before posting we clear the “graph-return” div and put an automated gif in place to let the user know something is happening. Once the script is done processing the data it will call the “success” part ajaxSubmit() and pass in the response from the post. In our case it is a graph. The animated gif is replaced with the graph. Ajax Submit complete.

From the code below you can see we bind a change action to each input item in the form. So anytime anything changes in the fields we redraw the graph.

$(”#control-form :input”).change(resubmitGraph);

]]> http://www.spicermatthews.com/my-love-of-jquerys-form-plugin/feed/ 0