Steven Smith revised this gist . Go to revision
1 file changed, 107 insertions
original-mp3list.php(file created)
| @@ -0,0 +1,107 @@ | |||
| 1 | + | <?php | |
| 2 | + | if (isset($_GET['print'])) { | |
| 3 | + | highlight_file(__FILE__); | |
| 4 | + | die(); | |
| 5 | + | } | |
| 6 | + | function load_addon($filename) { | |
| 7 | + | if (file_exists($filename)) { | |
| 8 | + | include $filename; | |
| 9 | + | } | |
| 10 | + | } | |
| 11 | + | $arr = array(); | |
| 12 | + | foreach (new RecursiveIteratorIterator(new RecursiveDirectoryIterator('.', FilesystemIterator::SKIP_DOTS)) as $item => $file) { | |
| 13 | + | $arr[] = $item; | |
| 14 | + | } | |
| 15 | + | sort($arr); | |
| 16 | + | ?> | |
| 17 | + | <html> | |
| 18 | + | <head> | |
| 19 | + | <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css" /> | |
| 20 | + | <style> | |
| 21 | + | div.filelist { | |
| 22 | + | overflow-y: scroll; | |
| 23 | + | height: 90%; | |
| 24 | + | } | |
| 25 | + | </style> | |
| 26 | + | <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> | |
| 27 | + | <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> | |
| 28 | + | <script> | |
| 29 | + | ||
| 30 | + | var audio = document.createElement('audio'); | |
| 31 | + | ||
| 32 | + | function playRandom() { | |
| 33 | + | try { | |
| 34 | + | var list = $('ul').find('li'); | |
| 35 | + | set_src($(list[Math.floor(Math.random()*list.length)]).find('a')[0].innerHTML); | |
| 36 | + | } catch (err) { | |
| 37 | + | playRandom(); | |
| 38 | + | } | |
| 39 | + | } | |
| 40 | + | ||
| 41 | + | function set_src(filename) { | |
| 42 | + | window.location.hash = filename.replace(/ /g, "%20"); | |
| 43 | + | document.title = filename.replace(/%20/g, " "); | |
| 44 | + | try { | |
| 45 | + | audio.setAttribute('src', filename); | |
| 46 | + | audio.load(); | |
| 47 | + | audio.play(); | |
| 48 | + | $('#np').html(filename.slice(0, -4)); | |
| 49 | + | return false; | |
| 50 | + | } catch(err) { | |
| 51 | + | location.reload(); | |
| 52 | + | } | |
| 53 | + | } | |
| 54 | + | ||
| 55 | + | function setVolume(volume) { | |
| 56 | + | audio.volume = volume; | |
| 57 | + | } | |
| 58 | + | ||
| 59 | + | $(window).load(function() { | |
| 60 | + | $("#volume").slider({ | |
| 61 | + | min: 0, | |
| 62 | + | max: 100, | |
| 63 | + | value: (audio.volume) * 100, | |
| 64 | + | range: "min", | |
| 65 | + | animate: true, | |
| 66 | + | slide: function(event, ui) { | |
| 67 | + | setVolume((ui.value) / 100); | |
| 68 | + | } | |
| 69 | + | }); | |
| 70 | + | audio.setAttribute('src', ''); | |
| 71 | + | audio.setAttribute('controls', 'controls'); | |
| 72 | + | audio.setAttribute('id', 'audio'); | |
| 73 | + | $('form').prepend(audio); | |
| 74 | + | audio.load(); | |
| 75 | + | audio.addEventListener("ended", function () { | |
| 76 | + | if (document.getElementById('autoplay').checked) { | |
| 77 | + | playRandom(); | |
| 78 | + | } | |
| 79 | + | }); | |
| 80 | + | if (window.location.hash != "" || window.location.hash != "#") { | |
| 81 | + | set_src(window.location.hash.substring(1).replace(/%20/g, " ")); | |
| 82 | + | } | |
| 83 | + | }); | |
| 84 | + | </script> | |
| 85 | + | </head> | |
| 86 | + | <body> | |
| 87 | + | <form onsubmit="return false;"> | |
| 88 | + | <input type="button" onclick="playRandom(); return false;" value="Random"> | |
| 89 | + | <label for="autoplay">Autoplay</label><input type="checkbox" name="autoplay" id="autoplay" checked> | |
| 90 | + | <b><span id="np"></span></b> | |
| 91 | + | </form> | |
| 92 | + | <div id="volume" style="width: 25%"></div> | |
| 93 | + | <div class="filelist"> | |
| 94 | + | <ul> | |
| 95 | + | <?php | |
| 96 | + | foreach($arr as $item) { | |
| 97 | + | if (mime_content_type($item) == "audio/mpeg") { | |
| 98 | + | $item = substr($item, 2); ?> | |
| 99 | + | <li><a href="#<?php echo str_replace(" ", "%20", htmlentities($item)); ?>" onClick='return set_src("<?php echo str_replace(""", "\"", htmlentities($item, ENT_QUOTES)); ?>");'><?php echo $item; ?></a></li> | |
| 100 | + | <?php | |
| 101 | + | } | |
| 102 | + | } | |
| 103 | + | ?> | |
| 104 | + | </ul> | |
| 105 | + | </div> | |
| 106 | + | </body> | |
| 107 | + | </html> | |
Newer
Older