summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--bin/backend.php9
-rw-r--r--bin/textfiles/browseAudio.txt21
-rw-r--r--bin/textfiles/browseFolder-aud.txt36
-rw-r--r--bin/textfiles/getGlobals.txt2
-rw-r--r--bin/textfiles/streamAudio.txt2
-rw-r--r--css/istreamdev.css8
-rw-r--r--index.html20
-rw-r--r--js/istreamdev.js89
8 files changed, 122 insertions, 65 deletions
diff --git a/bin/backend.php b/bin/backend.php
index 54e0058..b2c41b3 100644
--- a/bin/backend.php
+++ b/bin/backend.php
@@ -105,9 +105,16 @@ switch ($action)
if ( $path == "/video/" ) {
$tree = file_get_contents("textfiles/browseFolder-rec.txt");
}
- else {
+ else if ( $path == "/mnt/media/Videos/" ) {
$tree = file_get_contents("textfiles/browseFolder-vid.txt");
}
+ else if ( $path == "/mnt/media/Music/" ) {
+ $tree = file_get_contents("textfiles/browseFolder-aud.txt");
+ }
+ else
+ {
+ $tree = file_get_contents("textfiles/browseFolder-rec.txt");
+ }
print $tree;
break;
diff --git a/bin/textfiles/browseAudio.txt b/bin/textfiles/browseAudio.txt
deleted file mode 100644
index 2f91c4f..0000000
--- a/bin/textfiles/browseAudio.txt
+++ /dev/null
@@ -1,21 +0,0 @@
-{
- "list":
- [
- {
- "type": "folder",
- "name": "album1",
- "path": "/mnt/music/album1"
- },
- {
- "type": "folder",
- "name": "album2",
- "path": "/mnt/music/album2"
- },
- {
- "type": "audio",
- "name": "audiofile.mp3",
- "length": "3.30",
- "path": "/mnt/music/audiofile.mp3"
- }
- ]
-}
diff --git a/bin/textfiles/browseFolder-aud.txt b/bin/textfiles/browseFolder-aud.txt
new file mode 100644
index 0000000..e2e71be
--- /dev/null
+++ b/bin/textfiles/browseFolder-aud.txt
@@ -0,0 +1,36 @@
+{
+ "list":
+ [
+ {
+ "type": "folder",
+ "name": "album1",
+ "path": "/mnt/music/album1"
+ },
+ {
+ "type": "folder",
+ "name": "album2",
+ "path": "/mnt/music/album2"
+ },
+ {
+ "type": "audio",
+ "name": "audiofile.mp3",
+ "number": "1",
+ "length": "3.30",
+ "path": "/mnt/music/audiofile.mp3"
+ },
+ {
+ "type": "audio",
+ "name": "audiofile2.mp3",
+ "number": "2",
+ "length": "2.27",
+ "path": "/mnt/music/audiofile2.mp3"
+ },
+ {
+ "type": "audio",
+ "name": "audiofile3.mp3",
+ "number": "3",
+ "length": "4.03",
+ "path": "/mnt/music/audiofile3.mp3"
+ }
+ ]
+}
diff --git a/bin/textfiles/getGlobals.txt b/bin/textfiles/getGlobals.txt
index 87a9994..d4795e4 100644
--- a/bin/textfiles/getGlobals.txt
+++ b/bin/textfiles/getGlobals.txt
@@ -1,6 +1,6 @@
{
"streamdev_server": "http://127.0.0.1:3000",
"rec_path": "/video/",
- "video_path": "/mnt/media/Video/",
+ "video_path": "/mnt/media/Videos/",
"audio_path": "/mnt/media/Music/"
}
diff --git a/bin/textfiles/streamAudio.txt b/bin/textfiles/streamAudio.txt
index 28cca73..a90d122 100644
--- a/bin/textfiles/streamAudio.txt
+++ b/bin/textfiles/streamAudio.txt
@@ -1,5 +1,5 @@
{
- playlist:
+ track:
[
{
"file": "/istreamdev/playlist/track1.mp3"
diff --git a/css/istreamdev.css b/css/istreamdev.css
index ac58b7a..aa07a18 100644
--- a/css/istreamdev.css
+++ b/css/istreamdev.css
@@ -272,7 +272,7 @@ height: 20px;
padding: 0;
}
-li.track .numberbox {
+li.track a .numberbox {
position: relative;
width: 23px;
height: 42px;
@@ -283,7 +283,7 @@ margin-right: 3px;
border-right: 1px solid #333333;
-webkit-box-shadow: rgba(255,255,255,.1) 0 1px 0;
}
-li.track .number {
+li.track a .number {
position: absolute;
color: #9c9ea0;
top: 10px;
@@ -295,7 +295,7 @@ left: 32px;
padding-left: 4px;
top: -3px;
}
-li.track div.timebox {
+li.track a div.timebox {
position: relative;
width: 30px;
height: 42px;
@@ -306,7 +306,7 @@ margin-left: 3px;
border-left: 1px solid #333333;
-webkit-box-shadow: rgba(255,255,255,.1) 0 1px 0;
}
-li.track .time {
+li.track a .time {
position: absolute;
color: #9c9ea0;
top: 13px;
diff --git a/index.html b/index.html
index 66c8fa7..e674ebd 100644
--- a/index.html
+++ b/index.html
@@ -32,8 +32,8 @@
</ul>
<ul class="rounded">
<li><span class="menutitle">FILES</span></li>
- <li class="arrow"><a id="video_but" href="#browser"><img class="menuicon" src="img/video.png" /><span class="menuname">Video</span></a></li>
- <li class="arrow"><a id="audio_but" class="cube" href="#audio"><img class="menuicon" src="img/audio.png" /><span class="menuname">Audio</span></a></li>
+ <li class="arrow"><a id="video_but" href="#"><img class="menuicon" src="img/video.png" /><span class="menuname">Video</span></a></li>
+ <li class="arrow"><a id="audio_but" href="#"><img class="menuicon" src="img/audio.png" /><span class="menuname">Audio</span></a></li>
</ul>
</div>
<!----------------------------------/ HOME SCREEN ---------------------------------->
@@ -223,22 +223,6 @@
</form>
</div>
<!---------------------------------- /TIMERS SCREEN ---------------------------------->
- <!---------------------------------- AUDIO ---------------------------------------->
- <div id="audio">
- <div class="toolbar">
- <a href="#" class="back">Home</a>
- <h1><img class="menuicon" src="img/audio.png" /> Audio</h1>
- </div>
- <ul class="rounded">
- <li class="arrow"><a class="cube" href="#audio"><span class="menuname">Album1</span></a></li>
- <li class="arrow"><a class="cube" href="#audio"><span class="menuname">Album2</span></a></li>
- <li class="track"><div class="numberbox"><span class="number">1</span></div><a class="cube" href="#startstream"><span class="tracktitle">track1.mp3</span></a><div class="timebox"><span class="time">2:35</span></div></li>
- <li class="track"><div class="numberbox"><span class="number">2</span></div><a class="cube" href="#startstream"><span class="tracktitle">track2.mp3</span></a><div class="timebox"><span class="time">1:12</span></div></li>
- <li class="track"><div class="numberbox"><span class="number">3</span></div><a class="cube" href="#startstream"><span class="tracktitle">track3.mp3</span></a><div class="timebox"><span class="time">3:25</span></div></li>
- <li class="track"><div class="numberbox"><span class="number">4</span></div><a class="cube" href="#startstream"><span class="tracktitle">track4.mp3</span></a><div class="timebox"><span class="time">4:02</span></div></li>
- </ul>
- </div>
- <!---------------------------------- /AUDIO ---------------------------------------->
</div>
</body>
</html> \ No newline at end of file
diff --git a/js/istreamdev.js b/js/istreamdev.js
index fc9247b..6e21e35 100644
--- a/js/istreamdev.js
+++ b/js/istreamdev.js
@@ -120,6 +120,14 @@ $('#video_but').tap(function(event) {
gen_browser(video_path,browser,"Videos","vid");
return false;
});
+
+$('#audio_but').tap(function(event) {
+ event.preventDefault();
+ json_start(this);
+ browser = 1;
+ gen_browser(audio_path,browser,"Audio","aud");
+ return false;
+});
// [/HOME SECTION]
// [TV SECTION]
@@ -389,11 +397,16 @@ function playvideo(session,name) {
// [BROWSER SECTION]
//buttons
-$('ul[rel="filelist"] li.arrow a').tap(function(event) {
+$('ul[rel="filelist"] li a').tap(function(event) {
event.preventDefault();
json_start(this);
var type = $(this).attr('rel');
+ if ( type == 'audio' ) {
+ var name = $(this).find('span[class="tracktitle"]').html();
+ }
+ else {
var name = $(this).find('span[class="menuname"]').html();
+ }
var path = $(this).parents('div').find('span[rel="path"]').html();
var browser = $(this).parents('div').find('span[rel="currentbrowser"]').html();
var foldertype = $(this).parents('div').find('span[rel="foldertype"]').html();
@@ -412,6 +425,15 @@ $('ul[rel="filelist"] li.arrow a').tap(function(event) {
{
gen_streamvid(name,path);
}
+ else if ( type == "rec" )
+ {
+ gen_streamrec(name,path);
+ }
+ else if ( type == "audio" )
+ {
+ var track = $(this).find('span[class="number"]').html();
+ addplayer(path,name,track);
+ }
return false;
});
@@ -429,7 +451,7 @@ $('div[rel="browser"] #home_but').tap(function(event) {
});
});
-//functions
+//Generate browser div according to type
function gen_browser(path,browser,name,foldertype) {
browser_template = '<div class="toolbar"></div>';
browser_template += '<ul rel="filelist" class="rounded"></ul>';
@@ -440,26 +462,32 @@ function gen_browser(path,browser,name,foldertype) {
browser_template += '</div>';
$('#jqt').append('<div id="browser' + browser + '" rel="browser"></div>'),
$('#browser'+browser).html(browser_template);
- if ( path == rec_path || path == video_path ) {
- toolbar = '<a href="#" class="back">Home</a>';
- if ( foldertype == 'rec' ){
+ if ( path == rec_path || path == video_path || path == audio_path ) {
+ toolbar = '<a href="#" class="back">Home</a>';
+ if ( foldertype == 'rec' ){
toolbar += '<h1><img class="menuicon" src="img/record.png" /> ' + name + '</h1>';
- }
- else {
- toolbar += '<h1><img class="menuicon" src="img/video.png" /> ' + name + '</h1>';
- }
- $('#browser' + browser + ' div[class="toolbar"]').html(toolbar);
+ }
+ else if ( foldertype == 'vid' ){
+ toolbar += '<h1><img class="menuicon" src="img/video.png" /> ' + name + '</h1>';
+ }
+ else if ( foldertype == 'aud' ){
+ toolbar += '<h1><img class="menuicon" src="img/audio.png" /> ' + name + '</h1>';
+ }
+ $('#browser' + browser + ' div[class="toolbar"]').html(toolbar);
}
else {
- toolbar = '<a href="#" class="back">Back</a>';
- toolbar += '<a href="#home" id="home_but" class="button">Home</a>';
- if ( foldertype == 'rec' ){
- toolbar += '<h1><img class="menuicon" src="img/record.png" /> ' + name + '</h1>';
- }
- else {
- toolbar += '<h1><img class="menuicon" src="img/video.png" /> ' + name + '</h1>';
- }
- $('#browser' + browser + ' div[class="toolbar"]').html(toolbar);
+ toolbar = '<a href="#" class="back">Back</a>';
+ toolbar += '<a href="#home" id="home_but" class="button">Home</a>';
+ if ( foldertype == 'rec' ){
+ toolbar += '<h1><img class="menuicon" src="img/record.png" /> ' + name + '</h1>';
+ }
+ else if ( foldertype == 'vid' ){
+ toolbar += '<h1><img class="menuicon" src="img/video.png" /> ' + name + '</h1>';
+ }
+ else if ( foldertype == 'aud' ){
+ toolbar += '<h1><img class="menuicon" src="img/audio.png" /> ' + name + '</h1>';
+ }
+ $('#browser' + browser + ' div[class="toolbar"]').html(toolbar);
}
var dataString = 'action=browseFolder&path='+path+'&browser=' + browser;
$.getJSON("bin/backend.php",
@@ -478,11 +506,34 @@ function gen_browser(path,browser,name,foldertype) {
else if ( list.type == "video" ) {
$("#browser" + browser).find('ul').append('<li class="arrow"><a href="#" rel="video"><img class="menuicon" src="img/video.png" /><span class="menuname">' + list.name + '</span></a></li>');
}
+ else if ( list.type == "audio" ) {
+ $("#browser" + browser).find('ul').append('<li class="track"><a href="" rel="audio"><div class="numberbox"><span class="number">' + list.number + '</span></div><span class="tracktitle">' + list.name + '</span><div class="timebox"><span class="time">' + list.length +'</span></div></a></li>');
+ }
});
json_complete('#browser' + browser,'cube');
});
}
+//Add audio player code when needed
+function addplayer(path,name,track) {
+ $('#div_player').remove();
+ $('#jqt').append('<div style="position:absolute; left:0; top:0" name="div_player" id="div_player">');
+ //get playlist data
+ dataString = 'action=streamAudio&path=' + path + '&file=' + name;
+ $.getJSON("bin/backend.php",
+ dataString,
+ function(data) {
+ track = data.track;
+ playercode= "<embed target='myself' src='" + escape(track[track.length-1].file) + "' width='0' height='0' autoplay='true' name='player' type='audio/mp3' loop='true' controller='false' ";
+ for ( var i=track.length-1; i>1; i-=1 ){
+ playercode += "qtnext" + i + "='<" + escape(track[i].file) + ">' ";
+ }
+ playercode+= "></embed>";
+ $('#div_player').html(playercode);
+ hide_loader();
+ $('#div_player player').play();
+ });
+}
// [/BROWSER SECTION]