Jump to content

[Starting to learn PHP and HTML] Need help using php!

321System123

By 321System123
in PHP Coding Help

Recommended Posts

321System123 Newbie

321System123

Posted
Posted

So I started learning how to code php with usercake. I then went to use different things like fileNice for directory listing and I went to make a music lister with music player running mainly (EDM) .mp3's.

I have uploaded a copy of my music.php file and I would love some help on how to develop my site further!

 

https://github.com/321System123/TheBatCave/blob/master/music.php

 

This is the part I need help developing:

<?php

  function getUploadedFiles($directory){
    $folder = opendir($directory);
    while ($file = readdir($folder)) {
    if($file !== '.' && $file !== '..')
    {
        $filename = $directory.''.$file;
        $file_array[] = array('filename' => $file);
    }
}
return $file_array;
  }

$music = getUploadedFiles('../Music/EDM');

foreach($music as $value)
{
	echo '<div class="well well-sm">';
	echo '<li class="list-group-item list-group-item-success"><div class="alert alert-success" role="alert"><a href="../Music/EDM/'.$value['filename'].'"title="Play .$value" class="sm2_button"></a> '.$value['filename'].'</div></li>';
	echo '<p><a href="../Music/EDM/'.$value['filename'].'"><button type="button" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-headphones"> </span>  Listen</button></a> ';
	echo '<a href="../Music/EDM/'.$value['filename'].'" download><button type="button" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-cloud-download"></span>  Download</button></p></br></a></p>';
	echo '<p><a class="btn btn-default" href="#" role="button">View details »</a></p>';
	echo '</div>';
	}

  ?>

I would love to figure out how to use "echo '<p><a class="btn btn-default" href="#" role="button">View details »</a></p>';" to show time of when song was added, so Time last modified ? 

Hopefully I can learn how to set individual counters instead of them being the same for all the songs :/

 

 

Here is a link to the site with everything running: http://thebatcave.x10.mx/dev/music.php

Tell me what you think ?

321System123 Newbie

321System123

Posted
  • Author
Posted

I am trying to figure out if there is a better method to scan a folder for .mp3 and being able to set individual settings. Right now all that I am doing is scanning a directory and setting links to them, I want to be able to add properties to the files like ratings. 

 

 

egeQKpS.png

All of those songs have  a score of 27 because the code I made is just echoing the tables

 

EDIT: HERE IS THE MORE UPDATED CODE I USE:

<?php include './vote/init.php' ?>
<?php
/*
UserCake Version: 2.0.2
http://usercake.com
*/

require_once("models/config.php");
require_once("models/header.php");

echo "
<body>
<div id='wrapper'>
<div id='top'><div id='logo'></div></div>
<div id='content'>
<div id='left-nav'>";
?>
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../favicon.ico">

    <title>TheBatCave</title>
<?php echo ThumbsUp::css() ?>
    <!-- Bootstrap core CSS -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
	<link href="http://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet" type="text/css">
    <!-- Custom styles for this template -->
    <link href="jumbotron.css" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="css/mp3-player-button.css" />
    <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
    <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
    <script src="/assets/js/ie-emulation-modes-warning.js"></script>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
	<script type="text/javascript" src="/js/jquery.jplayer.min.js"></script>
	<script type="text/javascript" src="/js/jquery.liveSearch.js"></script>
	<script src="/audiojs/audio.min.js"></script>
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <script src="/assets/js/ie10-viewport-bug-workaround.js"></script>
<script type="text/javascript" src="script/soundmanager2.js"></script>
<script type="text/javascript" src="script/mp3-player-button.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
<script>
var TRange = null;
var dupeRange = null;
var TestRange = null;
var win = null;


//  SELECTED BROWSER SNIFFER COMPONENTS DOCUMENTED AT
//  http://www.mozilla.org/docs/web-developer/sniffer/browser_type.html

var nom = navigator.appName.toLowerCase();
var agt = navigator.userAgent.toLowerCase();
var is_major   = parseInt(navigator.appVersion);
var is_minor   = parseFloat(navigator.appVersion);
var is_ie      = (agt.indexOf("msie") != -1);
var is_ie4up   = (is_ie && (is_major >= 4));
var is_not_moz = (agt.indexOf('netscape')!=-1)
var is_nav     = (nom.indexOf('netscape')!=-1);
var is_nav4    = (is_nav && (is_major == 4));
var is_mac     = (agt.indexOf("mac")!=-1);
var is_gecko   = (agt.indexOf('gecko') != -1);
var is_opera   = (agt.indexOf("opera") != -1);


//  GECKO REVISION

var is_rev=0
if (is_gecko) {
temp = agt.split("rv:")
is_rev = parseFloat(temp[1])
}


//  USE THE FOLLOWING VARIABLE TO CONFIGURE FRAMES TO SEARCH
//  (SELF OR CHILD FRAME)

//  If you want to search another frame, change from "self" to
//  the name of the target frame:
//  e.g., var frametosearch = 'main'

//var frametosearch = 'main';
var frametosearch = self;


function search(whichform, whichframe) {

//  TEST FOR IE5 FOR MAC (NO DOCUMENTATION)

if (is_ie4up && is_mac) return;

//  TEST FOR NAV 6 (NO DOCUMENTATION)

if (is_gecko && (is_rev <1)) return;

//  TEST FOR Opera (NO DOCUMENTATION)

if (is_opera) return;

//  INITIALIZATIONS FOR FIND-IN-PAGE SEARCHES

if(whichform.findthis.value!=null && whichform.findthis.value!='') {

       str = whichform.findthis.value;
       win = whichframe;
       var frameval=false;
       if(win!=self)
{

       frameval=true;  // this will enable Nav7 to search child frame
       win = parent.frames[whichframe];

}

    
}

else return;  //  i.e., no search string was entered

var strFound;

//  NAVIGATOR 4 SPECIFIC CODE

if(is_nav4 && (is_minor < 5)) {
   
  strFound=win.find(str); // case insensitive, forward search by default

//  There are 3 arguments available:
//  searchString: type string and it's the item to be searched
//  caseSensitive: boolean -- is search case sensitive?
//  backwards: boolean --should we also search backwards?
//  strFound=win.find(str, false, false) is the explicit
//  version of the above
//  The Mac version of Nav4 has wrapAround, but
//  cannot be specified in JS

 
        }

//  NAVIGATOR 7 and Mozilla rev 1+ SPECIFIC CODE (WILL NOT WORK WITH NAVIGATOR 6)

if (is_gecko && (is_rev >= 1)) {
   
    if(frameval!=false) win.focus(); // force search in specified child frame
    strFound=win.find(str, false, false, true, false, frameval, false);

//  The following statement enables reversion of focus 
//  back to the search box after each search event 
//  allowing the user to press the ENTER key instead
//  of clicking the search button to continue search.
//  Note: tends to be buggy in Mozilla as of 1.3.1
//  (see www.mozilla.org) so is excluded from users 
//  of that browser.

    if (is_not_moz)  whichform.findthis.focus();

//  There are 7 arguments available:
//  searchString: type string and it's the item to be searched
//  caseSensitive: boolean -- is search case sensitive?
//  backwards: boolean --should we also search backwards?
//  wrapAround: boolean -- should we wrap the search?
//  wholeWord: boolean: should we search only for whole words
//  searchInFrames: boolean -- should we search in frames?
//  showDialog: boolean -- should we show the Find Dialog?


}

 if (is_ie4up) {

  // EXPLORER-SPECIFIC CODE revised 5/21/03

  if (TRange!=null) {
	  
   TestRange=win.document.body.createTextRange();
 
	  

   if (dupeRange.inRange(TestRange)) {

   TRange.collapse(false);
   strFound=TRange.findText(str);
    if (strFound) {
        //the following line added by Mike and Susan Keenan, 7 June 2003
        win.document.body.scrollTop = win.document.body.scrollTop + TRange.offsetTop;
        TRange.select();
        }


   }
   
   else {

     TRange=win.document.body.createTextRange();
     TRange.collapse(false);
     strFound=TRange.findText(str);
     if (strFound) {
        //the following line added by Mike and Susan Keenan, 7 June 2003
        win.document.body.scrollTop = TRange.offsetTop;
        TRange.select();
        }



   }
  }
  
   if (TRange==null || strFound==0) {
   TRange=win.document.body.createTextRange();
   dupeRange = TRange.duplicate();
   strFound=TRange.findText(str);
    if (strFound) {
        //the following line added by Mike and Susan Keenan, 7 June 2003
        win.document.body.scrollTop = TRange.offsetTop;
        TRange.select();
        }

   
   }

 }

  if (!strFound) alert ("String '"+str+"' not found!") // string not found

        
}
// -->
</script>
<?php echo ThumbsUp::javascript() ?>
<script>
  audiojs.events.ready(function() {
    var as = audiojs.createAll();
  });
</script>
  </head>

  <body>
  <style>
body
{
        font-family: 'Ubuntu', serif;
background-size: 100% auto; 
background-image:url('http://i.imgur.com/1Yc4UNd.jpg');
}
#jquery-live-search {
	background: #fff;

	padding: 5px 10px;
	max-height: 400px;
	overflow: auto;

	position: absolute;
	z-index: 99;

	border: 1px solid #A9A9A9;
	border-width: 0 1px 1px 1px;

	-webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
}
</style>
      <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
      </nav>
    <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">TheBatCave</a>
        </div>
        <div class="navbar-collapse collapse">
          <form class="navbar-form navbar-right" role="form">
          </form>
        </div><!--/.navbar-collapse -->
      </div>
    </div>
    <!-- Main jumbotron for a primary marketing message or call to action -->
	<p><br><br>
<div class="alert alert-warning" role="alert">
         <span class="glyphicon glyphicon-warning-sign"></span>   <strong>Please note:</strong> There is no guarantee that the music on here will stay, So make the most of it!
      </div>
    <div class="container">
	<div id='left-nav'>
</div>
      <!-- Example row of columns -->
      <div class="row">
<ol class="breadcrumb">
  <li><a href="#">Home</a></li>
  <li><a href="#">Development</a></li>
  <li class="active">Music</li>
</ol>
	  <div class="col-md-4"></div>
        <center><div class="col-md-4">
          <div class="well">
          <h2><FONT COLOR="d63a2b">EDM</FONT></h2>
		  <h5><span class="label label-info">Electronic Dance Music</span></h5></div>
		  <br>
		  <div class="panel panel-default">
  <div class="panel-body">
  <marquee behavior="scroll" direction="left">This site is indevelopment by Dan! He shall lead us to glory!</marquee>
     <button type="button" class="btn btn-default">
      Search for a particular song
   </button>
  </div>
</div>
<br>
          <p><?php

  function getUploadedFiles($directory){
    $folder = opendir($directory);
    while ($file = readdir($folder)) {
    if($file !== '.' && $file !== '..')
    {
        $filename = $directory.''.$file;
        $file_array[] = array('filename' => $file);
    }
}
return $file_array;
  }

$music = getUploadedFiles('../Music/EDM');

foreach($music as $value)
{
	echo '<div class="well well-sm">';
	echo '<li class="list-group-item list-group-item-success"><div class="alert alert-success" role="alert"><a href="../Music/EDM/'.$value['filename'].'"title="Play .$value" class="sm2_button"></a> '.$value['filename'].'</div></li>';
	echo '<p><a href="../Music/EDM/'.$value['filename'].'"><button type="button" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-headphones"> </span>  Listen</button></a> ';
	echo '<a href="../Music/EDM/'.$value['filename'].'" download><button type="button" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-cloud-download"></span>  Download</button></p></br></a></p>';
	echo ThumbsUp::item('Song')->template('up_down');
	print("This song was added by Dan on: ");
	echo '<p><a class="btn btn-default" href="#" role="button">View details »</a></p>';
	echo '</div>';
	}

  ?>
</p>
          <p><a class="btn btn-default" href="#" role="button">View details »</a></p>
		  	  <div class="col-md-4"></div>
       </div>
      </div>
</center>
      <hr>

      <footer>
        <p>© TheBatCave <?php
echo file_exists("fs.jpg");
?></p>
      </footer>
    </div> <!-- /container -->

    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>
fastsol Regular Member

fastsol

Posted
Posted

You could use something like this to show the last modified time of the file, taken straight form the php.net

echo $value['filename'] was last modified: " . date ("F d Y H:i:s.", filemtime($value['filename']))

Depending on the actual value of $value['filename'] you may need to edit the path for the filetime() to use it properly.

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.