winter18designs/header.php at master · ksdt/winter18designs · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
<?php
/**
 * The header for our theme
 *
 * This is the template that displays all of the <head> section and everything up until <div id="content">
 *
 * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
 *
 * @package winter18redesign
 */

?>
<!doctype html>
<html <?php language_attributes(); ?>>
<head>
	<meta charset="<?php bloginfo( 'charset' ); ?>">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="profile" href="http://gmpg.org/xfn/11">
	<!-- Fontawesome-->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">
	<link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">

	<?php wp_head(); ?>
</head>

<body <?php body_class(); ?>>
	<!-- Border -->
	<span class="frame-line right-frame visible-lg"></span>
	<span class="frame-line bottom-frame visible-lg"></span>
	<span class="frame-line left-frame visible-lg"></span>

<header class="site-header">
	<!-- Begin Nav Bar -->
	<nav role="nav" class="nav-pos navbar navbar-default navbar-fixed-top">
  		<div class="container-fluid">

	    	<!-- Brand and toggle get grouped for better mobile display -->
	    	<div class="navbar-header">

		      	<!-- Button that shows on mobile view -->
		      	<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
			        <span class="sr-only">Toggle navigation</span>
			        <span class="icon-bar"></span>
			        <span class="icon-bar"></span>
			        <span class="icon-bar"></span>
			    </button>

		      	<!-- KSDT Branding -->
		      	<a class="navbar-brand" href="<?php echo esc_url( home_url( '/' ) ); ?>">
		      		<img src="<?php echo get_template_directory_uri();?>/img/Logos/LOGO.png" width="80" alt="KSDT">
		      	</a>
		      	<div id="player-desktop"class="player"style="float:right;">
		          <a id="play-pause-button" class="fa fa-play"style="font-size: 20px;cursor: pointer;"></a>
		          <span class="live-circle"></span>
		          <span class="listen">LIVE</span>
		          <div class="show-info">
		            <a href=""><span class="show-name"></span></a>
		            <span class="show-djs"></span>
          		  </div>
      			</div>
	    	</div>

	      <script>
        var audio = new Audio("https://ksdt.ucsd.edu/stream.mp3");

jQuery('#play-pause-button').on("click",function(){
  if(jQuery(this).hasClass('fa-play'))
   {
     jQuery(this).removeClass('fa-play');
     jQuery(this).addClass('fa-pause');
     audio.play();
   }
  else
   {
     jQuery(this).removeClass('fa-pause');
     jQuery(this).addClass('fa-play');
     audio.pause();
   }
});

audio.onended = function() {
     jQuery("#play-pause-button").removeClass('fa-pause');
     jQuery("#play-pause-button").addClass('fa-play');
};
</script>


		    <!-- Collect the nav links, forms, and other content for toggling -->
		    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
		    	<ul class="nav navbar-nav navbar-right">
		    		<!--php code to nativly get the menu items and find the current
		    			page to color the link underneath-->

					<?php $main_menu = wp_get_nav_menu_items('Main'); ?>
			        	<?php foreach ((array) $main_menu as $key => $menu_item): ?>
			        	<?php
			            $title = $menu_item->title;
			            $url = $menu_item->url;
			            ?>
		            	<li class="nav-item">
		              		<a href="<?php echo $url; ?>"><?php echo $title; ?></a>
		            	</li>
			          <?php endforeach; ?>
			          <li id="tune-in"class="nav-item">
			          	<a href="https://tunein.com/radio/KSDT-s18746/">TuneIn</a>
			          </li>
			          <li id="listen-live-li"class="nav-item">
			          	<a href="https://ksdt.persona.co/">Listen Live</a>
			          </li>
	      		</ul>
	    	</div><!-- /.navbar-collapse -->
  		</div><!-- /.container-fluid -->
	</nav>
	<!-- End nav bar -->
</header>

	<!-- BACK TO TOP -->
	<a id="top"></a>
	<div id="back-to-top">
		<img src="<?php echo get_template_directory_uri();?>/img/Home/back-to-top.png" id="topImg-home" onclick="topFunction()"></img>
	</div>

	<div id="content" class="site-content">