daw/page-music.php

<?php
/*
Template Name: Music
*/

get_header(); ?>

	<div class="container">
		<article id="content" class="single" role="main">
			<?php if ( have_posts() ) while ( have_posts() ) : the_post(); ?>
			<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
				<div id="music" class="entry-content">
					<div class="row">
						<div class="col-sm-12">							
							<?php class NowPlaying{
							    private $url;
							    private $noTrackPlayingMessage;
							    function __construct($user, $api_key){
							        $this->url  = 'http://ws.audioscrobbler.com/2.0/?method=user.getrecenttracks&limit=1';
							        $this->url .= '&user=' . $user . '&api_key=' . $api_key;
							        $this->noTrackPlayingMessage = 'All Quiet - Silence is Golden';
							    }
							    public function getNowPlaying(){
							        $xml = simplexml_load_file($this->url);
							        $track = $xml->recenttracks->track;
							        $nowplaying = $track->attributes()->nowplaying;
							        if($nowplaying){
							            $artist = $track->artist;
							            $songname = $track->name;
										$albumname = $track->album;
										$albumart = $track->album->image[2];
							            return '<img src="../../wp-content/themes/dw/img/eq.gif"> ' . ' ' . $artist . ' - ' . $songname;
							        }
							        else{
							            return $this->noTrackPlayingMessage;
							        }
							    }
							    public function setNoTrackPlayingMessage($messageIn){
							        $this->noTrackPlayingMessage = $messageIn;
							    }
							} 
							$nowPlaying = new NowPlaying('windhamdavid', 'e12ea1d0253898ee9a93edfe42ffdeab');
							?>

							<div class="row">
								<div class="col-sm-8 col-sm-offset-2">
									<div class="panel panel-default">
										<div class="panel-body">
											<div id="player">
												<div id="song-information">
													<div class="row">
														<div class="col-xs-6">
															<img id="radio" src="" title="radio" width="25px" style="float:left;margin-right:15px;">
															<span id="amplitude-now-playing-listeners">Listeners: <span id="listeners">00</span> - Peak: <span id="peak-listeners">00</span></span><br>
															<span id="amplitude-now-playing-bitrate">Bitrate: <span id="bitrate">00</span> Kbps 44.100 Khz</span>
														</div>
														<div class="col-xs-6">
															<span id="amplitude-now-playing-name">Current track: <span id="track">* Off Air *</span></span><br>
														</div>
													</div>
												</div>
												<input class="bar" type="range" id="amplitude-volume-slider" value="90"/>
											<div id="controls">
												<div id="amplitude-play-pause" class="amplitude-paused"></div><br>
													<span id="amplitude-current-time">0:00</span>
												</div>
										
											</div>
										</div>
										<div class="panel-footer">
											<h6 style="margin:0;"><?php echo $nowPlaying->getNowPlaying(); ?></h6>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-sm-12">
							<p>&nbsp;</p>
						</div>
					</div>
					<div class="divider"></div>
					<?php the_content(); ?>
					<div class="row">
						<div class="col-sm-12">
							<p>&nbsp;</p>
						</div>
					</div>
					<div class="row">
						<div class="col-sm-12">
							<h5 class="cm-type"><em></em></h5>
							<div class="timeline">
								<canvas id="timechart" width="900" height="400"></canvas>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-sm-2">
							<h5 class="cm-type"><em></em></h5>
						</div>
						<div class="col-sm-2">
							<h5 class="cm-type"><em></em></h5>
						</div>
						<div class="col-sm-4">
						</div>
						<div class="col-sm-4">
						</div>
					</div>
					<div class="row">
						<div class="col-md-4">
							<div class="row">
								<div class="col-sm-6">
									<ul class="list-group">
										<li class="list-group-item active">Tracks</li>
											<li class='list-group-item'>Year<span class='badge'>7151</span></li>
											<li class='list-group-item'>Month<span class='badge'>687</span></li>
											<li class='list-group-item'>Day<span class='badge'>37</span></li>
										</li>
									</ul>
									<ul class="list-group">
										<li class="list-group-item active">Albums</li>
											<li class='list-group-item'>Year<span class='badge'>160</span></li>
											<li class='list-group-item'>Month<span class='badge'>11</span></li>
										</li>
									</ul>
								</div>
								<div class="col-sm-6">		
									<div id="key">

									</div>
								</div>
							</div>
						</div>
						<div class="col-md-8">
							<div class="row">
								<div class="col-sm-6">
									<div class="music-types">
										<canvas id="typechart" width="300" height="300"></canvas>
									</div>
								</div>
								<div class="col-sm-6">
									<div class="music-typed">
										<canvas id="artchart" width="300" height="300"></canvas>
									</div>
								</div>
							</div>
						</div>
					</div>

					<div class="row">
						<div class="col-sm-12">
							<div id="music-notes">
								<p>&nbsp;</p>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-sm-12">
							<div id="music-notes">
							<p>&nbsp;</p>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-sm-12">
							<div id="linechart"></div>
						</div>
					</div>
					<div class="row">
						<div class="col-sm-12">

						</div>
					</div>
					
					
					<div class="row">
						<div class="col-sm-12">
							<h5 class="cm-type"><em>Recently Played</em></h5>
							<ul class="list-group">
								<div class="recent"></div>
							</ul>
						</div>
					</div>
					<div class="row">
						<div class="col-sm-4">
							<h5 class="cm-type"><em>Artists: 7 Days</em></h5>
							<ul class="list-group">
								<div class="wartists"></div>
							</ul>
						</div>
						<div class="col-sm-8">
							<h5 class="cm-type"><em>Tracks: 7 Days</em></h5>
							<ul class="list-group">
								<div class="wtracks"></div>
							</ul>
						</div>
					</div>
					<div class="row">
						<div class="col-sm-4">
							<h5 class="cm-type"><em>Artists: 3 Month</em></h5>
							<ul class="list-group">
								<div class="martists"></div>
							</ul>
						</div>
						<div class="col-sm-8">
							<h5 class="cm-type"><em>Tracks: 3 Month</em></h5>
							<ul class="list-group">
								<div class="mtracks"></div>
							</ul>
						</div>
					</div>
					<div class="row">
						<div class="col-sm-4">
							<h5 class="cm-type"><em>Artists: 6 Months</em></h5>
							<ul class="list-group">
								<div class="artists"></div>
							</ul>
						</div>
						<div class="col-sm-8">
							<h5 class="cm-type"><em>Tracks: 6 Months</em></h5>
							<ul class="list-group">
								<div class="tracks"></div>
							</ul>
						</div>
					</div>
					
					<h5 class="cm-type"><em>Top 200 Albums From the Last Year</em></h5>
					<div class="albums"></div>
				</div>
			</div>
			<?php endwhile; ?>
		</article>
	</div>
<?php get_footer(); ?>