ЗАДАЧА 4.1: Вмъкнете и представете няколко MP3 аудио файлове по ваш избор в HTML страница към web сайта от упражнение 1.

ИЗПЪЛНЕНИЕ:

1. Свалете няколко файла от Интернет с любимата ви музика в MP3 формат в папка, която е към web сайта от упражнение 1.
2. За да предстявим музиката от MP3 аудио файловете първо е необходимо да изберем подходящ плейър. За целта ще използваме XSPF Web музикален плейър - прост и свободнодостъпен flash плейър. Свалете папката xspf-boutell.zip от страницата на упражнение 4.
3. Разархивирайте папката с XSPF Web музикален плейър. В нея има две версии на плейъра - "extended" (за представяне на аудио от плейлист) и "slim" (за представяне само на настоящатата песен).
4. Копирайте файла xspf_player.swf от версия "Extended" в папката с вашата музика.
5. С Notepad или друг текстов редактор създайте прост плейлист файл и го съхранете с името test.xspf.

Плейлиста трябва да изглежда по следния начин. Елемента title трябва да носи името на албума, групата или певеца (възможно е и да съдържа друга заглавна информация). Елемента location съдържа името на песента със съответното разширение (също така пълния URL адрес, когато .mp3 файла не е в същата папка). А елемента annotation представя името на песента, така че потребителите да занаят коя песен слушат. Също така може да бъде поставен в плейлиста и еленета image, който задава URL адреса на изображение представяно в блок отляво на песента (в по-голям плейър).

<?xml version="1.0" encoding="UTF-8"?>
<playlist version="1" xmlns = "http://xspf.org/ns/0/">
  <title>Моите любими песни</title>
  <trackList>
    <track>
      <location>a.mp3</location>
      <image>songaimage.jpg</image>
      <title>Име на песен A</title>
    </track>
    <track>
      <location>b.mp3</location>
      <title>Име на песен B</title>
    </track>
    <track>
      <location>c.mp3</location>
      <title>Име на песен C</title>
    </track>
    <track>
      <location>d.mp3</location>
      <title>Име на песен D</title>
    </track>
  </trackList>
</playlist>


6. Добавете следния код web страницата, където искате да се визуализира аудио плеъра. В примера отдолу web страницата е в една и съща папка с плейлиста и xspf_player.swf.


<object type="application/x-shockwave-flash" width="400" height="170"
data="xspf_player.swf?playlist_url=test.xspf">
<param name="movie" value="xspf_player.swf?playlist_url=test.xspf" />
</object>


Използват се и двата атрибута data и елемента param name="movie", защото flash се вмъква по различен начин в различните браузъри.

7. Стартирайте web страницата във вашия браузър и вижте дали аудио плейъра работи.

Разширяване възможностите на плейъра:

• XSPF Web плейър не преставя музиката със зареждане на web страницата, необходимо е да се натисне бутона "Play", за да започне песента. Това е добре, защото нежеланата музика отдръпва потребителите от сайта. Но ако искате музиката да започва със стартиране страницата добавете &autoplay=1 в края на елемента data:
xspf_player.swf?playlist_url=test.xspf&autoplay=1
• Можете да повторите плейлиста или песен като поставите repeat_playlist с 1.
• Можете да ограничите броя на песните с опцията playlist_size.
• Ако имате изображение на обложка на албум и искате да го поставите за всички песни в левия блок на плейъра е необходимо да използвате параметъра main_image:


<object
type="application/x-shockwave-flash"
width="600" height="200"
data="xspf_player.swf?playlist_url=playlist.xspf&main_image=cover.jpg">
<param
name="movie"
value="xspf_player.swf?playlist_url=playlist.xspf&main_image=cover.jpg" />
</object>


В представения пример cover.jpg е изображението на обложката и се намира в същата папка с плейлиста и плейъра.