[Release] Коледна идейя HTML, jQuery, PHP

[MaGuSs]

Така, понеже нямаше какво да правя, реших да напиша едно кодче, което плейва музика като влезете в сайта, а ако не ви харесва, може да я спрете, като опцията се запазва в бисквитка.

Ще помоля, кода да не се публикува в други сайтове, без моето съгласие и да не се преписват авторските му права на други лица освен мен ^^.

И така, като за начало, да си напишем PHP то, което ще ни помогне да плейваме песничките разбъркано или по желание на администратора да се пуска само една песен.

<?php
// If true play songs from array else (false) from $songfile [BG] Ако е true да плейва песни от масива разбъркано иначе при false да плейва песен от $songfile
$choosesong = false; 
// If $choosesong is false play this song [BG] Ако $choosesong е false да плейва тази песен
$songfile = "medialink/christmas_1.mp3"; 
// --------------------
//here write your songs example: array("folder/first1song.mp3", "folder/sec2song.mp3") 
//[BG] Тука пишете вашите песни както е показано на примера.Песните ще се разбъркват при пускане на страница (рефреш)
$songsArray = array("medialink/christmas_1.mp3", "medialink/christmas_2.mp3", "medialink/christmas_3.mp3", "medialink/christmas_4.mp3", "medialink/christmas_hoho.mp3");  
// --------------------
$songs_rand = array_rand($songsArray);
?>

След това си пишем jQuery-то, което всъщност ни спира музиката и плейва като в същото време запаметява нашето желание в бисквитка. Кода се слага преди затвярящия head таг.

<script type="text/javascript" >
		// by maguss4o (Maxamuss Group / BG)
		// Моля не присвоявай авторските права на този скрипт ! ----- Please do not assign maguss4o's copyrights of the script!!
		// Имате право да редактирате скрипта и така да преписвате скрипта като ваш (Промяната само на променливи не може да се впише в това)
		// You have to edit the script so as to copy your script (changing only the variables can not fit in it) I love Google translate :D
		$(document).ready(function(){
			var maxamuss_Cookiename = "maxamusssongbg";
			var divID = "#toggle";
			var CookieSet = $.cookie(maxamuss_Cookiename);
			var bgMusic = $('#audio-bg')[0],
			playing = true;
				
			bgMusic.addEventListener('ended', function() {
				this.currentTime = 0;
				if (playing && CookieSet == 1) {
					this.play();
				}
			}, false);
			if(CookieSet == 1){
				bgMusic.play();
				$(divID).html("PAUSE");
			}else{
				$(divID).html("PLAY");
			}
			if(!CookieSet){
				bgMusic.play();
				$(divID).html("PAUSE");
				$.cookie(maxamuss_Cookiename, 1);
			}
			$(divID).click(function() {
				if (!bgMusic.paused) {
					bgMusic.pause();
					playing = false;
					$.cookie(maxamuss_Cookiename, '0');
					$(divID).html("PLAY");
				} else {
					bgMusic.play();
					playing = true;
					$.cookie(maxamuss_Cookiename, '1');
					$(divID).html("PAUSE");
				}
			});
		});
	</script>

И най-накрая идва ред на HTML тага, с който плейваме песните. В него се включва и PHP, затова е желателно горното PHP и този HTML да са в един файл (index.php)

	<!-- Аудио тагът се слага веднага след body -->
	<audio id="audio-bg">
		<source src="<?php if($choosesong === true){echo $songsArray[$songs_rand];}else{echo $songfile;} ?>"></source>
	</audio>

ЗАБЕЛЕЖКА !!!
За да работи кода, трябва да вмъкнете jQuery библиотеката и плъгина на jQuery за бисквитките jQuery Cookie Plugin в head тага !!!

<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script type="text/javascript" src="jquery.cookie.js"></script> <!-- * jQuery Cookie Plugin v1.3 -->

Ще може да изтеглите jQuery Cookie Plugin от демото или от https://github.com/carhartl/jquery-cookie/blob/master/jquery.cookie.js

DEMO: http://beta.maguss4o.tk/test/songbg/songbg.php

Browser Support:

ЗАЖЕЛЕЖКА: За да Ви работи кода във всички браузъри, трябва да добавяте песните и в .ogg формат.

 

[enduwe]

10/10 браво

 

[RaFa]

Малка идея от мен:
Вместо да пишеш арей с песните, го направи, така че да избира една произволна песен от някоя папка.

И още една:
Няма ли да е по-добре вместо да правиш проверката за $choosesong да е в HTML-ла няма ли да е по-добре проверката да е в php файла, а при HTML да сложиш само <?=$songfile?>