Switch between live streams via button JWPlayer

February 1, 2014 7:36 am Tags: , , , , No Comments 0

Here’s some code for switching between multiple live streams with jwplayer.

<!-- START OF THE PLAYER EMBEDDING TO COPY-PASTE -->
	<div class="rack" style="width: 896px;">
	<div class="rackmonitor" style="width: 896px; height: 504px; background-image: url('your-image-here.png'); position: relative">
	<div class="screen" style="width: 645px; height: 265px; position: absolute; left: 60px; top: 28px;">
	<div id="mediaplayer">Player...</div>
	<script type="text/javascript" src="jwplayer.js"></script>
	<script type="text/javascript">
		jwplayer("mediaplayer").setup({
			flashplayer: "player.swf",
			height: "640",
			width: "360",
			file: "aircam.stream",
			streamer: "rtmp://w.streampunk.tv/aircam",
			autostart: true,
			controlbar: 'over',
			mute: true 
		});
	</script>
	</div>
	</div>
	</div>
	<div class="panel" 
	style="width: 600px; 
	height: 57px; 
	background-image: url('blankPanel.png'); 
	position: relative
	">	
		<div class="button1" 
		style="width: 75px; 
		height: 20px; 
		position: absolute; 
		left: 50px; 
		top: 20px; 
		border-radius: 10px; 
		background-color: #009900; 
		color: #cccccc; 
		border: 1px solid black; 
		text-align: center;" 
		onclick="jwplayer().load({file: 'playlist-high', streamer: 'rtmp://wms.rezonline.org/redirect'})
		">
		RezOnline
		</div>
		<div class="button2" 
		style="width: 75px; 
		height: 20px; 
		position: absolute; 
		left: 150px; 
		top: 20px; border-radius: 10px; 
		background-color: #009900;
		color: #cccccc; 
		border: 1px solid black;text-align: center;" 
		onclick="jwplayer().load({file: 'commons.stream', streamer: 'rtmp://w.streampunk.tv/live'})
		">
		Commons
		</div>
		<div class="button3" 
		style="width: 75px; 
		height: 20px; 
		position: absolute; 
		left: 250px; 
		top: 20px; border-radius: 10px; 
		background-color: #009900;
		color: #cccccc; 
		border: 1px solid black;text-align: center;" 
		onclick="jwplayer().load({file: 'testloop', streamer: 'rtmp://w.streampunk.tv/live'})
		">
		StreamClass
		</div>
		<div class="button4" 
		style="width: 75px; 
		height: 20px; 
		position: absolute; 
		left: 350px; 
		top: 20px; border-radius: 10px; 
		background-color: #009900;
		color: #cccccc; 
		border: 1px solid black;text-align: center;" 
		onclick="jwplayer().load({file: 'aircam.stream', streamer: 'rtmp://w.streampunk.tv/aircam'})
		">
		AirCam
		</div>
	</div>
0