Array with MySQL

jubba890 · May 10, 2014

Hi,

So I have an array

var playlist = new Array();

And in it I have songs as so:

playlist[0] = 'Avicii - Levels';
          playlist[1] = 'Song';
          playlist[2] = 'Song';
          playlist[3] = 'Song';
          playlist[4] = 'Song';
          playlist[5] = 'Song';
          playlist[6] = 'Song';
          playlist[7] = 'Song';
          playlist[8] = 'Song';
          playlist[9] = 'Song';
          playlist[10] = 'Song';

Now I'm not an expert at MySQL so I was wondering if there would be an easier way to do this with MySQL instead if adding playlist[number] = 'Song"; after every line. It would search the MySQL database for a column named songs and it would automatically put them into the array 'playlist'. Also code examples or a finished product would be VERY helpful!

Thanks

Barand · May 10, 2014

Something like this

<?php
$db = new mysqli(HOST,USERNAME,PASSWORD,DATABASE); // use your credentials

$sql = "SELECT songtitle FROM mytable";
$playlist = array();
$res = $db->query($sql);
while ($row = $res->fetch_assoc()) {
    $playlist[] = $row['songtitle'];
}
$songs = join('","', $playlist);
?>

<script type='text/javascript'>
var playlist = new Array("<?php echo $songs; ?>");
</script>

jubba890 · May 12, 2014

Something like this

<?php
$db = new mysqli(HOST,USERNAME,PASSWORD,DATABASE); // use your credentials

$sql = "SELECT songtitle FROM mytable";
$playlist = array();
$res = $db->query($sql);
while ($row = $res->fetch_assoc()) {
    $playlist[] = $row['songtitle'];
}
$songs = join('","', $playlist);
?>

<script type='text/javascript'>
var playlist = new Array("<?php echo $songs; ?>");
</script>

So far my code is:

<?PHP

  //### Start the session
  session_start();
  
  //### Make sure the user is logged in

//  if(!isset($_SESSION['streamit_user'])) {
//    header('Location: login.php');
//    exit;
//  }

  if($_SERVER['HTTP_HOST'] == 'localhost') {
    $settings['base_path'] = 'XXX';
  } else {
    $settings['base_path'] = 'XXX';
  }
  
?>
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <title>Web Player</title>
    <base href="<?PHP echo $settings['base_path'];?>"><!--[if IE]></base><![endif]-->
    <link href="includes/css/main_style.css?<?PHP echo microtime(true);?>" rel="stylesheet" type="text/css">
    <link href="http://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    
    <!-- Player Files -->
    <link href="includes/css/player.css?<?PHP echo microtime(true);?>" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="includes/js/jquery.jplayer.js"></script>
    <script type="text/javascript" src="includes/js/jplayer.playlist.js"></script>
    <!--[if IE 7]>
      <style>
        #jp_container_1{padding-bottom:-10px;margin-bottom:0;}
      </style>
    <![endif]-->
    <script type="text/javascript">    
      $(document).ready(function(){
	      new jPlayerPlaylist({
		        jPlayer: "#inzernet_player",
		        cssSelectorAncestor: "#jp_container_1"
	      }, [{ }], {
		        swfPath: "includes",
		        supplied: "mp3",
		        wmode: "window",
		        smoothPlayBar: true,
		        keyEnabled: true,
		        volume: 1
	      });
	
        $("#inzernet_player").bind($.jPlayer.event.ended, function() {
          playNext('loop');
        });
  
        $("#inzernet_player").jPlayer({"solution": navigator.userAgent.indexOf("Trident/5")>-1 ? "flash" : "html,flash"});
        
        if(navigator.appVersion.indexOf("MSIE 7.")!=-1){ 
          $('.frame_loader').css('margin-left', '0');
        }
      });
    </script>
  </head>
  
  <body>
  
    <div id="main_wrap">
      <div class="top_element">
        <div class="top_links top_left">
          <span><a href="#">Home</a></span>
          <span><a href="#">Latest News</a></span>
          <span><a href="#">My Account</a></span>
          <span><a href="#">Playlists</a></span>
          <span><a href="#">Upload</a></span>
        </div>
      
        <div class="top_links top_right">
          <span><a href="login.php" target="main_frame" onClick="loadPage(this);">Log In</a></span>
          <span><a href="register.php" target="main_frame">Register</a></span>
        </div>
      
        <div style="clear:both;"></div>
      </div>
       
      <div class="content_limiter" id="player_el">
        <div class="player_playlist">
          <div class="playlist_content">          
            Playlist <br><br>
            
            <div id="playlist_items"></div>
          </div>
        </div>
        <div class="frame_loader"> <img src="images/loading.gif"> </div>
        <iframe src="frame_index.php" class="main_frame" name="main_frame" id="main_frame" frameBorder="0" allowTransparency="true" onLoad="hideLoader();"></iframe>   
        
        <div style="clear:both;"></div>      
      </div>
  
      <div class="top_element" style="height: 10px;"></div>
    
      <div class="content_limiter" id="player_element">
      <!--- Player Start --->
        <div id="inzernet_player" class="jp-jplayer"></div>

        <div id="jp_container_1" class="jp-audio">
          <div class="jp-type-playlist">
            <div class="jp-gui jp-interface">
              <ul class="jp-controls">
                <li><a href="javascript:;" class="jp-previous player_button" tabindex="1" style="margin-left:10px;" onClick="playPrevious(); return false;">previous</a></li>
                <li><a href="javascript:;" class="jp-play player_button" tabindex="1" onClick="playSong(); return false;">play</a></li>
                <li><a href="javascript:;" class="jp-pause player_button" tabindex="1" onClick="pauseSong(); return false;">pause</a></li>
                <li><a href="javascript:;" class="jp-next player_button" tabindex="1" onClick="playNext('button'); return false;">next</a></li>
                <!--<li><a href="javascript:;" class="jp-stop player_button" tabindex="1">stop</a></li>-->
                <li><a href="javascript:;" class="jp-mute " tabindex="1" title="mute">mute</a></li>
                <li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
                <li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li>
              </ul>				
              
              <div class="player_right">
                  <div class="loop player_button" onClick="loop();"></div>
                </div>
					
					    <div style="float: left;">				
					      <div id="current_song" class="song_title"> No Song Selected </div>
					      
                <div class="jp-current-time"></div>
                
                <div class="jp-progress">
                  <div class="jp-seek-bar">
                    <div class="jp-play-bar"></div>
                  </div>
                </div>					
                <div class="jp-duration"></div>
					
                <div class="jp-volume-bar">
                  <div class="jp-volume-bar-value"></div>
                </div>

                <div style="clear:both;"></div>
              </div>
					    <div style="clear:both;"></div>

              <div class="jp-playlist">
                <ul>
                  <li></li>
                </ul>
              </div>
              
              <div class="jp-no-solution">
                <span>Update Required</span>
                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>.
              </div>
            </div>
            <div style="clear:both;"></div>
          </div>
		      <!--- Player End --->
        </div>
      </div>
        
      <div class="top_element" style="height: 10px;"></div>      
    </div>

    <script type="text/javascript">
      var isPaused = 0;
      var loopType = 'none';
      var lastSong = -1;
      var playlist = new Array("<?php echo $songs; ?>");

$db = new mysqli(HOST.COM,USER,PASS,StreamIT); // use your credentials
$sql = "SELECT Songs FROM Main";
$playlist = array();
$res = $db->query($sql);
while ($row = $res->fetch_assoc()) {
    $playlist[] = $row['Songs'];
}
$songs = join('","', $playlist);
?>


//      var playlist = new Array();
//          playlist[0] = 'Avicii - Levels';
//          playlist[1] = 'Flo Rida - Good Feeling';
//          playlist[2] = 'H3Ctic - Far away';
//          playlist[3] = 'Hans Zimmer - Time';
//          playlist[4] = 'Lana Del Rey - Summertime Sadness';
//          playlist[5] = 'M4sonic - Weapon';
//          playlist[6] = 'Extan - New World (feat. RomyHarmony)';
//          playlist[7] = 'Nicki Minaj - Five-O';
//          playlist[8] = 'Beautiful Sinner';
//          playlist[9] = 'Cockiness';
//          playlist[10] = 'Skrillex - Dirty Vibe';

      $(document).ready(function(){        
        $('.player_button').on({
          mouseenter: function() {
            $(this).addClass('player_button_hover');//.addClass($(this).attr('id')+'_hover');
          }, mouseleave: function() {
            $(this).removeClass('player_button_hover');//.removeClass($(this).attr('id')+'_hover');
          }
        });       
                
        $(document).bind('contextmenu', function(e){
          //return false;
        });
        
        $('.top_element span> a').each(function(index, link){
          $(this).click(function(){
            //alert('You clicked "'+$(this).text()+'".');
            return false;
          });
        });
        
        createPlaylist();
      });
      
      function hideLoader() {
        $('.frame_loader').hide();
      }
      
      function loadPage(t) {
        if($('#main_frame').attr('src') != t.href) {
          $('.frame_loader').show();
          $('#main_frame').attr('src', t.href);
        }     
      }
      
      function createPlaylist() {
        for(i=0; i<playlist.length; i++) {
          $('#playlist_items').append('<div class="playlist_item" id="playlist_item_'+i+'"> - <span onClick="playThis(\''+playlist[i]+'\');">'+playlist[i]+'</span></div>');
        }
      }
      
      function reloadThis() {
        window.location.href = window.location.href.split('#')[0];
      }
          
      function playSong() {
        isPaused = 0;
        $('#inzernet_player').jPlayer('play');
      }
          
      function pauseSong() {
        isPaused = 1;
        $('#inzernet_player').jPlayer('pause');
      }
          
      function loop() {   
        if(loopType == 'all') {
          $('.loop').removeClass('loop_single').removeClass('loop_all');
          loopType = 'none';
        } else if(loopType == 'none') {
          $('.loop').addClass('loop_single').removeClass('loop_all');
          loopType = 'single';
        } else if(loopType == 'single') {
          $('.loop').removeClass('loop_single').addClass('loop_all');
          loopType = 'all';
        }
      }
          
      function playNext(type){          
        if(lastSong < 0){ //### No song has been played, we don't know what "next" is
          return;
        }
            
        //### Check to see if we are looping a single song
        if(loopType == 'single') {
          setTimeout(function(){ playThis(playlist[lastSong]); }, 100);
          return;
        }
            
        //### Stop the player, to stop the cross over of 2 songs
        $('#inzernet_player').jPlayer('stop');
           
        //### Now we work out which song to play next
        if(lastSong >= playlist.length) {
          setTimeout(function(){ playThis(playlist[0]); }, 100);
        } else {
          if(lastSong+1 >= playlist.length) { //### Check if the next song is the start of the playlist
            if(type == 'loop') { //### Looper function is triggered
              if(loopType == 'all') { //### Check to see if looped is true
                lastSong = 0;
              } else { //### Looped isn't true, don't play first
                return;
              }
            } else { //### Button pressed so go back to the start
              lastSong = 0;
            }
          } else { //### Not the end of the playlist, play next
            lastSong+=1;
          }
          setTimeout(function(){ playThis(playlist[lastSong]); }, 100);
        }
            
        //### Show "loading" while we wait for the next song to be set
        $('#current_song').text('Loading...');
      }
          
      function playPrevious(){
        if(lastSong < 0) { //### No song has been played, we don't know what "previous" is
          return;
        }
            
        //### Stop the player, to stop the cross over of 2 songs
        $('#inzernet_player').jPlayer('stop');
           
        //### Now we work out which song to play next
        if(lastSong == 0) {
          setTimeout(function(){ playThis(playlist[(playlist.length-1)]); }, 100);
        } else {
          lastSong = (lastSong-1 < 0) ? playlist.length-1 : lastSong-=1;
          setTimeout(function(){ playThis(playlist[lastSong]); }, 100);
        }
            
        //### Show "loading" while we wait for the next song to be set
        $('#current_song').text('Loading...');
      }
          
      function playThis(songTitle){
        var musicFile = '<?PHP echo $settings['base_path'];?>media/music/'+songTitle+'.mp3';
            lastSong  = include(playlist, songTitle);
               
        $('.playlist_item').removeClass('playing');
        $('#playlist_item_'+lastSong).addClass('playing');
            
        $('#current_song').text(songTitle);
         
        $('#inzernet_player').jPlayer("setMedia", {                  
          mp3:musicFile
        });
            
        if(isPaused != 1) {
          $('#inzernet_player').jPlayer('play');
        }
      }
          
      function include(arr, obj) {
        for(var i=0; i<arr.length; i++) {
          if (arr[i] == obj) return i;
        }
      }
    </script>
    
  </body>
</html>

It just shows up blank

MDCode · May 12, 2014

Your problems (probably) start at

<script type="text/javascript">
var isPaused = 0;
var loopType = 'none';
var lastSong = -1;
var playlist = new Array("<?php echo $songs; ?>");
 
<!-- Still HTML yet you start PHP out of nowhere -->

$db = new mysqli(HOST.COM,USER,PASS,StreamIT); // use your credentials
$sql = "SELECT Songs FROM Main";
$playlist = array();
$res = $db->query($sql);
while ($row = $res->fetch_assoc()) {
$playlist[] = $row['Songs'];
}
$songs = join('","', $playlist);
?>

I stopped looking after that.

Barand · May 12, 2014

... and it might be a good idea to create the $songs variable before you try and put it in the JS array.

jubba890 · May 13, 2014

... and it might be a good idea to create the $songs variable before you try and put it in the JS array.

I originally used SocialCloud's code. which had the $song variable in it, I am not sure how to use the $song varible and where it fits into play here

jubba890 · May 13, 2014

Your problems (probably) start at

<script type="text/javascript">
var isPaused = 0;
var loopType = 'none';
var lastSong = -1;
var playlist = new Array("<?php echo $songs; ?>");
 
<!-- Still HTML yet you start PHP out of nowhere -->

$db = new mysqli(HOST.COM,USER,PASS,StreamIT); // use your credentials
$sql = "SELECT Songs FROM Main";
$playlist = array();
$res = $db->query($sql);
while ($row = $res->fetch_assoc()) {
$playlist[] = $row['Songs'];
}
$songs = join('","', $playlist);
?>

I stopped looking after that.

You were right, I accidentally deleted the <?PHP and not that I inserted it correctly, it shows - only

jubba890 · May 13, 2014

... and it might be a good idea to create the $songs variable before you try and put it in the JS array.

I fixed it by having the PHP execute before putting it in there, thank you SO much!

Sign In

Array with MySQL

Recommended Posts

jubba890

Link to comment

Share on other sites

Barand

Link to comment

Share on other sites

jubba890

Link to comment

Share on other sites

MDCode

Link to comment

Share on other sites

Barand

Link to comment

Share on other sites

jubba890

Link to comment

Share on other sites

jubba890

Link to comment

Share on other sites

jubba890

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information