			
<?php include 'app/view/header.php'; ?>

        <div id="hap-wrapper" style="height:90vh;background:black">
	    <div class="row" style="background:#111;padding-left:9px;margin-bottom:3px;padding-bottom:4px">
		<div class="col-6 mx-auto" style="margin-left:5px:;margin-top:3px">
		    <form method="post" action="">
		<!--	    <label for="producer" class="label_small">Producer</label> -->
			    <select id="producer" name="producer" onchange="this.form.submit()">
				<?php 
				foreach ($producers as $key => $value): ?>
				    <option value="<?php echo htmlspecialchars($key); ?>" <?php if ($producer == $key) echo "selected"; ?> ><?php echo htmlspecialchars($value); ?></option>
				<?php endforeach; ?>
			    </select>

		</div>
		<div class="col-6 mx-auto" style="margin-top:3px">
			<div>
			    <!-- <label for="category" class="label_small">Category</label> -->
			    <select id="category" name="category" onchange="this.form.submit()">
				<?php foreach ($categories  as $key => $value) { ?>
				    <option value="<?php echo htmlspecialchars($key); ?>" <?php if ($category == $key) echo "selected"; ?>><?php echo htmlspecialchars($value[0]); ?></option>
				<?php } ?>
			    </select>
			</div>
		    </form>
		</div>
	    </div>

       		<div class="hap-player-holder"  style="">

                <div class="hap-player-thumb-wrapper">

                    <div class="hap-player-thumb"></div>

                </div>     
             
                <div class="hap-right-cont">

                    <div class="hap-player-controls">
                        <div class="hap-prev-toggle hap-contr-btn"><i class="fas fa-step-backward hap-icon-color"></i></div>
                        <div class="hap-playback-toggle hap-contr-btn"><i class="fas fa-play hap-icon-color"></i></div>
                        <div class="hap-next-toggle hap-contr-btn"><i class="fas fa-step-forward hap-icon-color"></i></div>
                          
                        <div class="hap-volume-wrapper">  
                            <div class="hap-volume-toggle hap-contr-btn"><i class="fas fa-volume-up hap-icon-color"></i></div>
                            <div class="hap-volume-seekbar">
                                <div class="hap-volume-bg"></div>
                                <div class="hap-volume-level"></div>
                            </div>
                        </div>

                        <div class="hap-random-toggle hap-contr-btn" data-tooltip="Shuffle"><i class="fas fa-random hap-icon-color"></i></div>
                        <div class="hap-loop-toggle hap-contr-btn" data-tooltip="Loop"><i class="fas fa-sync-alt hap-icon-color"></i></div>
                    </div>

                    <div class="hap-seekbar">
                        <div class="hap-progress-bg"></div>
                        <div class="hap-load-level"></div>
                        <div class="hap-progress-level"></div>
                    </div>

                </div>
                  
            </div>
              
            <div class="hap-playlist-holder" style="">
                <div class="hap-playlist-filter-msg"><p>NOTHING FOUND!</p></div>
                <div class="hap-playlist-inner"  style="">
                    <div class="hap-playlist-content" >
                     	
			<!-- media files loop here -->
		    <?php 
		    foreach ($prog_arr_filtered as $prog) { ?>
						<!-- <div class="hap-playlist-item" data-share="http://radio-krishna.se/<?php echo $prog["id"] ?>" data-album="<?php echo $prog["prog_cat"] ?>" data-link="http://radio-krishna.se" data-artist="<?php echo $prog["producer_name"] ?>" data-type="audio" data-mp3="<?php echo "http://217.70.33.42/rk/".$prog["prog_fname"] ?>" data-share="http://radio-krishna.se?id=1"> -->
						<div class="hap-playlist-item" data-type="audio" data-mp3="<?php echo "http://217.70.33.42/rk/".$prog["prog_fname"] ?>" data-share="http://radio-krishna.se/<?php echo $prog["id"] ?>" data-album="<?php echo $prog["prog_cat"] ?>" data-link="http://radio-krishna.se" data-artist="<?php echo $prog["producer_name"] ?>"   data-thumb="public/images/<?php echo trim($prog['image']); ?>">
						    <a class="hap-playlist-non-selected" href="#" style="">
							<span class="hap-playlist-title"><?php echo $prog["producer_id"] ?> I 
							    <?php echo $prog["prog_title"] ?> | <?php echo $prog["comment"] ?> | <?php echo $prog["prod_date"] ?>
							</span>
						    </a>
						</div>
					    <?php } ?>
			<!-- media files loop here -->

                    </div>
                </div>
                
                <div class="hap-preloader"></div>

            </div>

            <div class="hap-bottom-bar">

                    <input class="hap-search-filter" type="text" value="filter...">
                    <div class="hap-sort-alpha" data-tooltip="Alphabetic sort"><i class="fas fa-sort-alpha-down hap-icon-color"></i></div>

                    <div class="hap-share-item" data-type="tumblr" data-tooltip="tumblr"><i class="fab fa-tumblr hap-icon-color"></i></div>
                    <div class="hap-share-item" data-type="twitter" data-tooltip="twitter"><i class="fab fa-twitter hap-icon-color"></i></div>
                    <div class="hap-share-item" data-type="facebook" data-tooltip="facebook"><i class="fab fa-facebook-f hap-icon-color"></i></div>
                    <div class="hap-share-item" data-type="googleplus" data-tooltip="googleplus"><i class="fab fa-google-plus-g hap-icon-color"></i></div> 
                    
                </div>

			<div class="hap-tooltip"><p></p></div>
        
        </div>  

		
	</body>
<?php include 'app/view/footer.php'; ?>
