1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2<html xmlns="http://www.w3.org/1999/xhtml"> 3<head> 4<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5<meta http-equiv="X-UA-Compatible" content="IE=edge"> 6<title></title> 7<style> 8html{ 9 margin:0 0; 10 padding:0px; 11} 12body{ 13 display: block; 14 overflow: hidden; 15 background: #e8e8e8; 16} 17#jp_playlist_1{ 18 height:200px; 19 overflow:auto; 20} 21</style> 22<script type="text/javascript" src="/smb/js/tools.js"></script> 23<script type="text/javascript" src="/smb/js/jplayer/jquery.jplayer.min.js"></script> 24<script type="text/javascript" src="/smb/js/davclient_tools.js"></script> 25<link rel="stylesheet" href="/smb/css/jplayer.blue.monday.css" type="text/css"> 26<script type="text/javascript"> 27 28var m = new lang(); 29var g_storage = new myStorage(); 30var g_showAudioList = false; 31var g_jplayer_solution = "html,flash"; 32var g_jplayer_supplied = "mp3"; 33var g_audio_playlist = []; 34var g_current_index = 0; 35 36function getUrlVars(){ 37 var vars = [], hash; 38 var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); 39 for(var i = 0; i < hashes.length; i++) 40 { 41 hash = hashes[i].split('='); 42 vars.push(hash[0]); 43 vars[hash[0]] = hash[1]; 44 } 45 return vars; 46} 47 48function parseXml(xml) { 49 if (jQuery.browser.msie) { 50 var xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); 51 xmlDoc.loadXML(xml); 52 xml = xmlDoc; 53 } 54 return xml; 55} 56 57$(document).ready(function(){ 58 var loc_lan = String(window.navigator.userLanguage || window.navigator.language).toLowerCase(); 59 var lan = ( g_storage.get('lan') == undefined ) ? loc_lan : g_storage.get('lan'); 60 m.setLanguage(lan); 61 62 var generate_sharelink = getUrlVars()["s"]; 63 var this_audio = getUrlVars()["a"]; 64 var audio_list = getUrlVars()["alist"]; 65 g_current_index = getUrlVars()["index"]; 66 67 var this_audio_list = audio_list.split(","); 68 69 var client = new davlib.DavClient(); 70 client.initialize(); 71 72 $('button#cancel').text(m.getString('btn_close')); 73 $('button#playlist').text(m.getString('btn_playlist')); 74 75 var browserVer = navigator.userAgent; 76 77 if( browserVer.indexOf("Chrome") != -1 || 78 ( browserVer.indexOf("Safari") != -1 && ( isMacOS() || isWinOS() ) ) ){ 79 g_jplayer_solution = "html"; 80 g_jplayer_supplied = "mp3"; 81 } 82 else if( browserVer.indexOf("MSIE") != -1 || 83 browserVer.indexOf("Firefox") != -1 || 84 browserVer.indexOf("Opera") != -1 ){ 85 g_jplayer_solution = "flash"; 86 g_jplayer_supplied = "mp3"; 87 } 88 89 var current_query_index = 0; 90 var on_query = false; 91 92 $("#jp_title_1 li").text("Loading..."); 93 $("#playlist").css("visibility","hidden"); 94 95 showHideAudioInterface(false); 96 showHideAudioList(false); 97 98 if(generate_sharelink==1){ 99 var media_hostName = window.location.host; 100 if(media_hostName.indexOf(":")!=-1) 101 media_hostName = media_hostName.substring(0, media_hostName.indexOf(":")); 102 media_hostName = "http://" + media_hostName + ":" + g_storage.get("http_port") + "/"; 103 104 var timer = setInterval(function(){ 105 106 if(on_query==false){ 107 108 if(current_query_index<0||current_query_index>this_audio_list.length-1){ 109 clearInterval(timer); 110 initJPlayer(); 111 return; 112 } 113 114 var this_audio = this_audio_list[current_query_index]; 115 var this_file_name = this_audio.substring( this_audio.lastIndexOf("/")+1, this_audio.length ); 116 var this_url = this_audio.substring(0, this_audio.lastIndexOf('/')); 117 118 on_query = true; 119 client.GSL(this_url, this_url, this_file_name, 0, 0, function(error, content, statusstring){ 120 if(error==200){ 121 var data = parseXml(statusstring); 122 var share_link = $(data).find('sharelink').text(); 123 share_link = media_hostName + share_link; 124 125 on_query = false; 126 127 var obj = []; 128 obj['name'] = mydecodeURI(this_file_name); 129 obj['mp3'] = share_link; 130 g_audio_playlist.push(obj); 131 132 current_query_index++; 133 } 134 }); 135 } 136 }, 100); 137 } 138 else{ 139 for(var i=0; i < this_audio_list.length;i++){ 140 var this_audio = this_audio_list[i]; 141 var this_file_name = this_audio.substring( this_audio.lastIndexOf("/")+1, this_audio.length ); 142 var this_url = this_audio.substring(0, this_audio.lastIndexOf('/')); 143 144 var obj = []; 145 obj['name'] = mydecodeURI(this_file_name); 146 obj['mp3'] = this_audio; 147 g_audio_playlist.push(obj); 148 } 149 150 initJPlayer(); 151 } 152}); 153 154function initJPlayer(){ 155 var Playlist = function(instance, playlist, options) { 156 var self = this; 157 158 this.instance = instance; // String: To associate specific HTML with this playlist 159 this.playlist = playlist; // Array of Objects: The playlist 160 this.options = options; // Object: The jPlayer constructor options for this playlist 161 162 this.current = 0; 163 164 this.cssId = { 165 jPlayer: "jquery_jplayer_", 166 interface: "jp_interface_", 167 playlist: "jp_playlist_", 168 playtitle: "jp_title_" 169 }; 170 this.cssSelector = {}; 171 172 $.each(this.cssId, function(entity, id) { 173 self.cssSelector[entity] = "#" + id + self.instance; 174 }); 175 176 if(!this.options.cssSelectorAncestor) { 177 this.options.cssSelectorAncestor = this.cssSelector.interface; 178 } 179 180 $(this.cssSelector.jPlayer).jPlayer(this.options); 181 182 $(this.cssSelector.interface + " .jp-previous").click(function() { 183 self.playlistPrev(); 184 $(this).blur(); 185 return false; 186 }); 187 188 $(this.cssSelector.interface + " .jp-next").click(function() { 189 self.playlistNext(); 190 $(this).blur(); 191 return false; 192 }); 193 }; 194 195 Playlist.prototype = { 196 displayPlaylist: function() { 197 var self = this; 198 $(this.cssSelector.playlist + " ul").empty(); 199 200 for (i=0; i < this.playlist.length; i++) { 201 var filename = this.playlist[i].name; 202 var listItem = (i === this.playlist.length-1) ? "<li class='jp-playlist-last'>" : "<li>"; 203 listItem += "<a href='#' id='" + this.cssId.playlist + this.instance + "_item_" + i +"' tabindex='1'>"+ filename +"</a>"; 204 205 // Associate playlist items with their media 206 $(this.cssSelector.playlist + " ul").append(listItem); 207 208 $(this.cssSelector.playlist + "_item_" + i).data("index", i).click(function() { 209 var index = $(this).data("index"); 210 if(self.current !== index) { 211 self.playlistChange(index); 212 } 213 else { 214 $(self.cssSelector.jPlayer).jPlayer("play"); 215 } 216 $(this).blur(); 217 return false; 218 }); 219 } 220 }, 221 playlistInit: function(autoplay) { 222 if(autoplay) { 223 this.playlistChange(this.current); 224 } else { 225 this.playlistConfig(this.current); 226 } 227 }, 228 playlistConfig: function(index) { 229 $(this.cssSelector.playlist + "_item_" + this.current).removeClass("jp-playlist-current").parent().removeClass("jp-playlist-current"); 230 $(this.cssSelector.playlist + "_item_" + index).addClass("jp-playlist-current").parent().addClass("jp-playlist-current"); 231 this.current = parseInt(index); 232 233 var filename = this.playlist[this.current]['name']; 234 var full_filename = filename; 235 var ui_width = $(this.cssSelector.playtitle + " li").width(); 236 var cur_width = String(filename).width($(this.cssSelector.playtitle + " li").css('font')); 237 238 if(cur_width>ui_width){ 239 var fileext = getFileExt(filename); 240 var len = filename.length; 241 var new_name = ""; 242 var i=0; 243 for(i=0; i<len; i++){ 244 new_name+=filename[i]; 245 var test_name = new_name + "." + fileext 246 var test_width = String(test_name).width($(this.cssSelector.playtitle + " li").css('font')); 247 if(test_width>ui_width){ 248 break; 249 } 250 } 251 252 filename = filename.substring(0,i-4) + "...." + fileext; 253 } 254 //alert("play "+this.playlist[this.current].mp3); 255 $(this.cssSelector.playtitle + " li").attr("title",full_filename); 256 $(this.cssSelector.playtitle + " li").text(filename); 257 $(this.cssSelector.jPlayer).jPlayer("setMedia", this.playlist[this.current]); 258 }, 259 playlistChange: function(index) { 260 this.playlistConfig(index); 261 $(this.cssSelector.jPlayer).jPlayer("play"); 262 }, 263 playlistNext: function() { 264 var index = (this.current + 1 < this.playlist.length) ? this.current + 1 : 0; 265 this.playlistChange(index); 266 }, 267 playlistPrev: function() { 268 var index = (this.current - 1 >= 0) ? this.current - 1 : this.playlist.length - 1; 269 this.playlistChange(index); 270 } 271 }; 272 273 var audioPlaylist = new Playlist("1", g_audio_playlist, { 274 ready: function() { 275 audioPlaylist.displayPlaylist(); 276 audioPlaylist.current = g_current_index; 277 audioPlaylist.playlistInit(true); // Parameter is a boolean for autoplay. 278 279 $("#playlist").css("visibility","visible"); 280 showHideAudioInterface(true); 281 showHideAudioList(false); 282 }, 283 ended: function() { 284 audioPlaylist.playlistNext(); 285 }, 286 play: function() { 287 $(this).jPlayer("pauseOthers"); 288 }, 289 swfPath: "/smb/js/jplayer/", 290 supplied: g_jplayer_supplied, 291 solution: g_jplayer_solution, 292 wmode: "window", 293 errorAlerts: false, 294 warningAlerts: false, 295 error: function(event){ 296 var type = event.jPlayer.error.type; 297 if(type=="e_no_solution"){ 298 $(".jp-no-solution").html(m.getString("title_install_flash")); 299 $(".jp-no-solution").css("display", "block"); 300 } 301 } 302 }); 303} 304 305function doClose(e) { 306 $("#jquery_jplayer_1").jPlayer("stop"); 307 $("#jquery_jplayer_1").jPlayer("clearMedia"); 308 parent.closeJqmWindow(0); 309}; 310 311function showHideAudioInterface(bshow){ 312 if(bshow){ 313 $("#jp_interface_1").css("display","block"); 314 } 315 else{ 316 $("#jp_interface_1").css("display","none"); 317 } 318} 319 320function showHideAudioList(bshow){ 321 if(bshow){ 322 $(".jp-playlist").css("display", "block"); 323 parent.resizeJqmWindow(parent.g_modal_window_width, parent.g_modal_window_height+$(".jp-playlist").height()); 324 } 325 else{ 326 $(".jp-playlist").css("display", "none"); 327 parent.resizeJqmWindow(parent.g_modal_window_width, parent.g_modal_window_height); 328 } 329 330 g_showAudioList = bshow; 331} 332 333function doOpenPlayList(){ 334 showHideAudioList(!g_showAudioList); 335} 336 337</script> 338</head> 339<body> 340 341<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0"> 342 <tr style='height:80px'> 343 <td> 344 <div id="container"> 345 <div id="jquery_jplayer_1" class="jp-jplayer"></div> 346 <div id="jp_container_1" class="jp-audio"> 347 <div class="jp-type-playlist"> 348 <div id="jp_title_1" class="jp-title"> 349 <ul> 350 <li>Cro Magnon Man</li> 351 </ul> 352 </div> 353 <div id="jp_interface_1" class="jp-gui jp-interface"> 354 <ul class="jp-controls"> 355 <li><a href="javascript:;" class="jp-previous" tabindex="1">previous</a></li> 356 <li><a href="javascript:;" class="jp-play" tabindex="1" style="display: block; ">play</a></li> 357 <li><a href="javascript:;" class="jp-pause" tabindex="1" style="display: block; ">pause</a></li> 358 <li><a href="javascript:;" class="jp-next" tabindex="1">next</a></li> 359 <li><a href="javascript:;" class="jp-stop" tabindex="1">stop</a></li> 360 <li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li> 361 <li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li> 362 </ul> 363 <div class="jp-progress"> 364 <div class="jp-seek-bar" style="width: 100%; "> 365 <div class="jp-play-bar" style="width: 46.700506341691536%; "></div> 366 </div> 367 </div> 368 <div class="jp-volume-bar"> 369 <div class="jp-volume-bar-value" style="width: 31.979694962501526%; "></div> 370 </div> 371 <div class="jp-duration">00:00</div> 372 <div class="jp-split">/</div> 373 <div class="jp-current-time">00:00</div> 374 </div> 375 376 <div id="jp_playlist_1" class="jp-playlist"> 377 <!--<a href="javascript:;" class="jp-show-audio-list"></a>--> 378 <ul></ul> 379 </div> 380 <!-- 381 <div class="jp-no-solution" style="display: none; "> 382 <span>Update Required</span> 383 To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>. 384 </div> 385 --> 386 </div> 387 </div> 388 389 <div class="jp-no-solution" style="display: none; "> 390 <span>Update Required</span> 391 To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>. 392 </div> 393 394 </div> 395 </td> 396 </tr> 397 <tr style='height:10px'></tr> 398 <tr> 399 <td> 400 <div class="table_block_footer" style="text-align:right"> 401 <button id="playlist" class="btnStyle" onClick="doOpenPlayList();">PlayList</button> 402 <button id="cancel" class="btnStyle" onClick="doClose();">Close</button> 403 </div> 404 </td> 405 </tr> 406</table> 407 408</body> 409</html> 410