‘;
this.div = doc.querySelectorAll(this.divSelector)[0];
this.div.appendChild(html);
if(this.div.getElementsByClassName(‘app-badge-google’).size > 0 && browser && browser.identify && browser.identify == ‘ios’) {
this.div.getElementsByClassName(‘app-badge-google’)[0].classList.add(‘cover’);
}
jQuery(‘.play-button’).first().clone().appendTo(‘.play-button-mobile’);
doc.physique.classList.add(‘has-livebar’);
doc.physique.classList.add(‘livebar-‘+this.station_type);
}
// set top
this.setHeight = operate() { // TODO variable top
var innerDocContentHeight = 80;
this.div.fashion.top = innerDocContentHeight + “px”;
}
this.removeUrlProtocol = operate(url) {
var newstr = url.substitute(‘ ‘//’);
return newstr;
};
// subscribe occasions
this.subscribeEvents = operate() {
var _this = this;
for (var i on this.configChannels) {
var channelName = this.configChannels;
var channel = this.pusher.subscribe(channelName);
for (var j on this.occasions) {
var eventName = this.occasions[j];
channel.bind(eventName, operate(information) {
_this.pusherEvent(channelName, eventName, information);
});
}
_this.channels.push(channel);
}
};
// course of actual time `cue` occasion from Pusher.com
this.pusherEvent = operate(channelName, eventName, pusherData) {
this.processTrackOrEvent(pusherData);
};
this.latestEpisode = operate() {
var episode = this.latest_episode;
var information = {
sort: ‘podcast’,
artist: ”, // episode.podcast_title,
trackName: this.truncate(episode.post_title, 71),
artwork: episode.post_thumbnail,
url: episode.url
}
this.processTrackOrEvent(information);
}
// grabs the newest monitor from the api
this.ajaxLatestTrack = operate() {
var endpoint = this.endpoint + ‘/hll_widget_livebar_cues.php’;
var information = {
‘restrict’: ‘1’
};
var _this = this;
var httpRequest = new XMLHttpRequest();
httpRequest.open(‘POST’, endpoint);
httpRequest.setRequestHeader(“Content material-type”, “software/json”);
httpRequest.ship(JSON.stringify(information));
httpRequest.onreadystatechange = operate () {
if (httpRequest.readyState == 4 && httpRequest.standing == 200) {
var json = JSON.parse(httpRequest.responseText);
_this.processTrackOrEvent(json.information.response[0]);
}
}
};
// grabs the newest occasion from the api
this.ajaxLatestEvent = operate() {
var endpoint = this.endpoint + ‘/hll_widget_livebar_events.php’;
var information = {
‘restrict’: ‘3’
};
var _this = this;
var httpRequest = new XMLHttpRequest();
httpRequest.open(‘POST’, endpoint);
httpRequest.setRequestHeader(“Content material-type”, “software/json”);
httpRequest.ship(JSON.stringify(information));
httpRequest.onreadystatechange = operate () {
if (httpRequest.readyState == 4 && httpRequest.standing == 200) {
var json = JSON.parse(httpRequest.responseText);
_this.processTrackOrEvent(json.information.response[0]);
}
}
};
// grabs the newest podcast episode from the wp-json api
this.ajaxLatestEpisode = operate() {
var endpoint=”/wp-json/hbi/v1/liveplayer/latestepisode”;
var _this = this;
var httpRequest = new XMLHttpRequest();
httpRequest.open(‘GET’, endpoint);
httpRequest.setRequestHeader(“Content material-type”, “software/json”);
httpRequest.ship();
httpRequest.onreadystatechange = operate () {
if (httpRequest.readyState == 4 && httpRequest.standing == 200) {
var episode = JSON.parse(httpRequest.responseText);
var information = {
sort: ‘podcast’,
artist: ”, // episode.podcast_title,
trackName: _this.truncate(episode.post_title, 71),
artwork: episode.post_thumbnail,
url: episode.url
}
_this.processTrackOrEvent(information);
}
}
};
// course of the monitor or occasion information and replace the HTML
this.processTrackOrEvent = operate(d) {
// debug: print information to console
// window.console.log(‘processTrackOrEvent’,d);
// workaround: ignore spots for now
var sort = d.sort;
if (sort !== ‘podcast’ && sort !== ‘tune’ && sort !== ‘present’ && sort !== ‘special-event’ && sort !== ‘visitor’ && sort !== ‘different’) {
return;
}
if(sort == ‘tune’)
else if(sort == ‘podcast’)
else {
var trackId = d.id;
var timeRange = operate() {
let start_date = second(d.start_date);
let end_date = second(d.end_date);
let default_format=”h:mma”;
let start_day_format = (default_format);
let end_day_format = (default_format);
// If begin and finish dates each fall in AM or PM, make it transient
// Instance: 10:00-11:00am vs 10:00am-11:00am
if(start_date.format(‘a’) === end_date.format(‘a’)) {
start_day_format=”h:mm”;
}
// Take away minutes if 00
if(start_date.minutes() == 0) {
start_day_format=”h”;
}
if(end_date.minutes() == 0) {
end_day_format=”ha”;
}
return start_date.format(start_day_format) + “-” + end_date.format(end_day_format);
};
var artist = timeRange();
var trackName = d.identify || ”;
var artwork = this.removeUrlProtocol(d.photograph || ”
// Begin timer
this.setEventTimer();
}
// This block retrieves artwork work as a blob so we will render it within the DOM
// … and moreover course of its colour swatches in a canvas context by way of Vibrant.js
// … with solely ONE community request.
//
//
fetchBlob(artwork, operate(arrayBuffer) {
var blob = new Blob([arrayBuffer], {sort: “picture/jpeg”});
var url = URL.createObjectURL(blob);
// Set paintings in DOM
doc.getElementsByClassName(‘album-art-img’)[0].src=url;
doc.getElementsByClassName(‘album-art-img’)[0].classList.take away(‘d-none’);
doc.getElementsByClassName(‘live-player-background’)[0].src=url;
// Use stay participant button colour if set in Customizer
if(window.livePlayerButtonColor) {
// set colour of huge and compact play buttons with customizer colour
Array.from(doc.getElementsByClassName(‘play-circle-outline-path’)).forEach(operate(component) {
component.fashion.fill = window.livePlayerButtonColor;
// show play button if hidden (avoids colour flash on load)
doc.getElementById(‘play-button-column’).classList.take away(‘invisible’);
});
return;
}
// If stay participant button colour isn’t manually set, routinely get album artwork colour from vibrant.js
var img = doc.getElementsByClassName(‘album-art-img’)[0];
img.addEventListener(‘load’, operate() {
var vibrant = new Vibrant(img);
var swatches = vibrant.swatches();
var swatch = swatches[‘LightVibrant’] || swatches[‘Vibrant’] || swatches[‘Muted’] || swatches[‘DarkMuted’];
// entice edge case the place Vibrant.js does not return a swatch
if(swatch !== undefined) {
// get hex from swatch library
var hex = swatch.getHex();
// set colour of huge and compact play buttons
Array.from(doc.getElementsByClassName(‘play-circle-outline-path’)).forEach(operate(component) {
component.fashion.fill = hex;
});
}
// show play button if hidden (avoids colour flash on load)
doc.getElementById(‘play-button-column’).classList.take away(‘invisible’);
});
});
this.div.getElementsByClassName(‘onair-artist’)[0].innerHTML = artist;
this.div.getElementsByClassName(‘onair-track’)[0].innerHTML = trackName;
// hyperlink to episode if stay participant is in podcast mode
if(sort == ‘podcast’) {
jQuery(‘.play-button a, #circles, .album-art a, .monitor a’).attr(‘href’,d.url).removeAttr(‘goal’);
jQuery(‘.onair-artist’).cover();
}
// Skip TextFit step for podcast episodes
if(this.station_type == ‘podcast’) {
return;
}
// Dynamically measurement lengthy monitor titles –
// var textFitOptions = {
// alignVert: false, // if true, textFit will align vertically utilizing css tables
// alignHoriz: false, // if true, textFit will set text-align: heart
// multiLine: false, // if true, textFit is not going to set white-space: no-wrap
// detectMultiLine: false, // disable to show off automated multi-line sensing
// minFontSize: 11, // in px
// maxFontSize: 40, // in px
// reProcess: true, // if true, textFit will re-process already-fit nodes. Set to ‘false’ for higher efficiency
// widthOnly: false, // if true, textFit will match textual content to component width, no matter textual content top
// alignVertWithFlexbox: false, // if true, textFit will use flexbox for vertical alignment
// }
if (textFit !== “undefined”) {
textFit(this.div.getElementsByClassName(‘onair-track’)[0], {
alignVert: false, // if true, textFit will align vertically utilizing css tables
alignHoriz: false, // if true, textFit will set text-align: heart
multiLine: false, // if true, textFit is not going to set white-space: no-wrap
detectMultiLine: false, // disable to show off automated multi-line sensing
minFontSize: 13, // in px
maxFontSize: 31, // in px
reProcess: true, // if true, textFit will re-process already-fit nodes. Set to ‘false’ for higher efficiency
widthOnly: false, // if true, textFit will match textual content to component width, no matter textual content top
alignVertWithFlexbox: true, // if true, textFit will use flexbox for vertical alignment
});
textFit(this.div.getElementsByClassName(‘onair-artist’)[0], {
alignVert: false, // if true, textFit will align vertically utilizing css tables
alignHoriz: false, // if true, textFit will set text-align: heart
multiLine: false, // if true, textFit is not going to set white-space: no-wrap
detectMultiLine: false, // disable to show off automated multi-line sensing
minFontSize: 11, // in px
maxFontSize: 30, // in px
reProcess: true, // if true, textFit will re-process already-fit nodes. Set to ‘false’ for higher efficiency
widthOnly: false, // if true, textFit will match textual content to component width, no matter textual content top
alignVertWithFlexbox: true, // if true, textFit will use flexbox for vertical alignment
});
}
}
// Set timer for occasion refresh
this.setEventTimer = operate() {
var _this = this;
setTimeout(operate(){
_this.ajaxLatestEvent();
}, this.eventRefreshTime);
};
// Set timer for episode refresh
this.setEpisodeTimer = operate() {
var _this = this;
setTimeout(operate(){
_this.ajaxLatestEpisode();
}, this.eventRefreshTime);
};
//
this.truncate = operate(str, n){
return (str.size > n) ? str.substr(0, n-1) + ‘…’ : str;
};
//
operate fetchBlob(uri, callback) {
var xhr = new XMLHttpRequest();
xhr.open(‘GET’, uri, true);
xhr.responseType=”arraybuffer”;
xhr.onload = operate(e) {
if (this.standing == 200) {
var blob = this.response;
if (callback) {
callback(blob);
}
}
};
xhr.ship();
};
}
// Set and intialize
var hllLiveBarWidget = new hllLiveBarWidgetObject(‘player-widget-livebar’);
hllLiveBarWidget.init();
There aren’t any listening rewards out there presently.
View extra rewards ‘;
this.div = doc.querySelectorAll(this.divSelector)[0];
this.div.appendChild(html);
this.innerWrapper = this.div.querySelectorAll(this.innerWrapperSelector)[0];
};
this.removeUrlProtocol = operate(url) {
var newstr = url.substitute(‘ ‘//’);
return newstr;
};
// grabs the newest rewards
this.ajaxLatestRewards = operate() {
var endpoint = this.endpoint + ‘/hll_widget_rewards_rewards.php’;
var information = {};
var _this = this;
var httpRequest = new XMLHttpRequest();
httpRequest.open(‘POST’, endpoint);
httpRequest.setRequestHeader(“Content material-type”, “software/json”);
httpRequest.ship(JSON.stringify(information));
httpRequest.onreadystatechange = operate () {
if (httpRequest.readyState == 4 && httpRequest.standing == 200) {
var json = JSON.parse(httpRequest.responseText);
_this.processRewards(json.information);
}
}
};
// course of the occasion reward and replace the HTML
this.processRewards = operate(d) {
var _this = this;
_this.rewards = [];
_this.featuredRewards = [];
d.forEach(operate(component, index) {
var obj = {};
obj.id = component.id;
obj.title = component.title;
obj.picture = _this.removeUrlProtocol(component.photograph);
obj.sort = component.sort;
obj.featured = component.featured;
obj.hours = Math.flooring(component.hours / 3600);
obj.hoursLabel = obj.hours == 1 ? ‘hour’ : ‘hours’;
if(obj.sort == ‘geolocation’) {
obj.sort=”app”
}
if(obj.sort === ‘smack-the-track’){
var displayName = component.smackTheTrackFields.display_name;
//Format the show identify so as to add dashes to interchange areas and particular chars with “-”
obj.sort = displayName.substitute(/(W+?)/g,’-‘);
}
// solely add if needs to be in widget
if(component.in_widgets === true) {
_this.rewards.push(obj);
}
});
if(_this.rewards.size > 0) {
// Present wrapper
this.div.querySelectorAll(‘.rewards-wrapper’)[0].classList.take away(“cover”);
this.div.querySelectorAll(‘.read_more’)[0].classList.take away(“cover”);
// Begin sliders
this.startRewardsSliders();
} else {
// Present no rewards message
this.div.querySelectorAll(‘.no-rewards-wrapper’)[0].classList.take away(“cover”);
}
};
// Set timer for rewards refresh
this.setRewardsTimer = operate() {
var _this = this;
setInterval(operate(){
_this.ajaxLatestRewards();
}, this.rewardsRefreshTime);
},
// Begin rewards sliders
this.startRewardsSliders = operate() {
var _this = this;
if(_this.eventRotateTimer) {
return;
}
// Intialize mild sliders
var sliderOptions = {
merchandise: 2,
pager: false,
loop: true,
controls: false,
enableDrag: false,
enableTouch: false
};
// Setup sliders
_this.eventRotateTimer = true;
_this.rewardsSlider = this.div.querySelectorAll(‘#lightSlider’)[0];
_this.setupSlides();
// Begin sliders
_this.rewardsSliderInstance = jQuery(_this.rewardsSlider).lightSlider(sliderOptions);
_this.rotateSlides();
},
// Slide rewards
this.setupSlides = operate() {
var _this = this;
// Examine for rewards
if(this.rewards.size 0) {
rewardElement.getElementsByClassName(‘content material’)[0].getElementsByClassName(‘data’)[0].getElementsByClassName(‘time’)[0].innerHTML = ‘Hear for ‘ + component.hours + ‘ ‘ + component.hoursLabel;
} else {
rewardElement.getElementsByClassName(‘content material’)[0].getElementsByClassName(‘data’)[0].getElementsByClassName(‘time’)[0].innerHTML = ”;
}
var featuredAnchor = this.div.getElementsByClassName(‘reward-featured-url’)[0];
featuredAnchor.setAttribute(‘href’,” + component.id + “/?utm_source=station-website&utm_medium=widget&utm_campaign=rewards”);
// reward sort badge
var typeBadge = rewardElement.getElementsByClassName(‘content material’)[0].getElementsByClassName(‘data’)[0].getElementsByClassName(‘type-badge’)[0];
var typeBadgeclassListAsArray = new Array(typeBadge.classList.size);
for (var j = 0, len = typeBadge.classList.size; j