Terminé

Make an Internet Radio Player from DIY Kit

I have an account with [url removed, login to view] for my internet stream. I need a good looking player that will work on Safari (especially the new Safari for Mac OS Sierra -- if you do not have access I can test it), Chrome, Firefox and Opera.

[url removed, login to view] has a development kit for making a player. It has many variables and quite frankly I am decent with HTML but this confused me. I would give you a logon to [url removed, login to view] and you can visit their radio player kit.

Here is what I tried with very limited success:

<div class="[url removed, login to view]"

data-autoplay="true"

data-playbutton="true"

data-volumeslider="true"

data-elapsedtime="true"

data-nowplaying="false"

data-showplayer="false"

data-volume="75"

data-image="[url removed, login to view]"

data-showartwork="false"></div>

The examples they show have a background like the .jpg I listed above and the controls on the background. Once logged into my [url removed, login to view] account, go to [url removed, login to view] and there are examples and tons of more data variables I cannot get my mind around.

Also, it asks that code be put in the header and the footer. For my index page I have already added that code. I build my webpages using Rapidweaver which has unique ways of adding code to the header and footer. I recommend you just build a blank webpage (if you need to do this on my website, I will give you FTP info and a password plus access to the cPanel if necessary. I think you could try it on any webpage.

I think someone with a good handle on the variables could finish making a web player in a couple of hours.

This is the primary code for the player:

<div class="radioplayer" data-src="[url removed, login to view]" data-autoplay="false" data-playbutton="true" data-volumeslider="true" data-elapsedtime="true" data-nowplaying="true" data-showplayer="true" data-volume="50" data-showartwork="false"></div>

This is player options:

The options passed to the referenced HTML element on the web page, these options control certain funnctionality and visibility of some elements.

data-src="[url removed, login to view]"

Your [url removed, login to view] listen stream URL, required to set up the player

data-autoplay="true|false"

Automatically start playing the stream when the page loads

data-playbutton="true|false"

Display a play and pause button on the page

data-volumeslider="true|false"

Display the volume slider on the page

data-nowplaying="true|false"

Display the current now playing information of the station

data-elapsedtime="true|false"

Display the current streaming total elapsed time on the page

data-showplayer="true|false"

Show or hide the radio player from the page, use in conjunction with displaying only certain elements.

data-volume="0-100"

Set the initial volume of the stream when the page loads, requires a number between 1 and 100.

data-showartwork="true|false"

Display just the artwork of the currently playing song (use with data-showplayer='false').

data-image="path/to/[url removed, login to view]"

Changes the square image on the player to a custom image source.

data-bg="path/to/[url removed, login to view]"

Sets a custom background image behind the player.

data-volume="0-100"

Set the initial volume of the stream when the page loads, requires a number between 1 and 100.

Methods

There is a whole section on optional methods. I would like the player to be centered on the page. I also would it to change the display of the tune as fast as it can. There seems to be methods to do this.

Compétences : HTML, JavaScript

Concernant le client :
( 15 commentaires ) Newburgh, United States

Nº du projet : #11684832

Décerné à:

rambanstola

A proposal has not yet been provided

%selectedBids___i_sum_sub_7% %project_currencyDetails_sign_sub_8% USD en 3 jours
(14 Commentaires)
3.9

4 freelances font une offre moyenne de 189 $ pour ce travail

pinaliv

5 Reasons why you should hire me for your custom website and Application Development. 1. Available 24/7 upon your request 2. Delivery on-time with 100% satisfaction 3. Always think beyond boundaries and provide user fr Plus

%bids___i_sum_sub_35% %project_currencyDetails_sign_sub_36% USD en 4 jours
(16 Commentaires)
4.6
articreations

Hi, I have read Your project description carefully. I am very interested in your project and also I am ready to start immediately. I will give you high quality and fast work. I will deliver you project time Plus

%bids___i_sum_sub_35% %project_currencyDetails_sign_sub_36% USD en 0 jours
(1 Évaluation)
1.7
priyankathorat37

I am a good web artist and will to give my hand for your work . I have experience in html5 and all JS libraries . I am a very dedicated worker so plz accept my bid . Happy freelancing!

%bids___i_sum_sub_35% %project_currencyDetails_sign_sub_36% USD en 3 jours
(0 Commentaires)
0.0