podcast module

index.js

var fs = require('fs')
require('dotenv').config()

class PodcastPlayer {
  constructor(){
    var self = this;
    this.podcast_logo = process.env.BASE_URL + require('~/podcast.png');
    this.podcast_logo = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAQAAADZc7J/AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QAAKqNIzIAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAAHdElNRQfkBgoENB7n0IC4AAAC/UlEQVRIx5WUS2xVVRSGv317K7nQwlXDs23EkggmQBOIUOZITRhh5RErKMQJpsY4NpIYZoxoQkxqIgUsyQ06wAafCY+RPIK0CD7KBAmQQBHogwChl/M5uMfbnt5TrWt0zlrr//bae629A6lmE2/QzHKmk+M6VzlFT+hjauZaT5tmP7m2MjtMEM+kky0AnOVHLnAHmM0KWlgFQDc7w4PJ1673oqpfu7QittweVX91/mTyvP3qiJsBDK70Qzvc4we+EmdscUS95PNp8uB36lAp2VYvJ/b/m60ANjus9qQB3lQjXwOrPahqZK8FC/YZqXrIaeB6I/XtifJp/ql+CgaPqNptYzna6GFVj5gBO9WrZpOADepD54E7VW2vqPB9Vd8D5/tQ3ZQMf6V+AdY4oO6NvS12uNd18V+HetfpYLdaSAL+Ul8H31LvOwsMdpWPcL8BnOWgug3cqA44NkPOU/UF8IB6AMB3E13YAfHKB8FFqs4ByABQB8h14CXgIgDvJErcDkAv0AhcA2DuGACgGCKgGngMQD4BeBaAR0AOQpEIqBkDPAKqzQO3gQYAzicA5yCO3AafIwMMjZ3BMz5Rm8FP1J8BXOC98gkM2gDgBXUXuEYtmhvfhV71I3CZkfoqgC97ysjIky4BcJ0auQzcpfYm2/ix+rsBPKr2/dMiZzijfFf61KNgxivq7iRgkUW1Faz3m1KDKmZxjt9aD25Si75Y8paHwc/ZwQ2WhiEA59LO4nHqP9gXBgDMc5k6usPWifwF3le/Nws2eLPiQbthPZj1B/WedWklrvepuhD8LPVN7AQXqpEbSDfbHTUDnldP+KQsfexp9RxY5dPKmzoesdEa8Ji62kIZUHCNegystS2pyCR/w5fhQTx3W6kal9VW8oaRcJj/NltUvVuuoPTVMgVpDMgbOWrOW6reMueokfm03EyaMwzST5YmLgHwC01k6Q+DU64A7FKH49c4cljtSs/MTEI4C9TGcxqoBc78P8CZKXj+dQtVHk9M4XGr0jP/BmrtsyXBBDijAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDIwLTA2LTEwVDA0OjUyOjMwKzAwOjAwLXK3qAAAACV0RVh0ZGF0ZTptb2RpZnkAMjAyMC0wNi0xMFQwNDo1MjozMCswMDowMFwvDxQAAAAZdEVYdFNvZnR3YXJlAHd3dy5pbmtzY2FwZS5vcmeb7jwaAAAAAElFTkSuQmCC'

    // inject css
    var css = fs.readFileSync('./style.css', { encoding: "UTF-8" }); // <-- The css reader
    var style = document.createElement('style')
    style.appendChild(document.createTextNode(css))
    document.head.appendChild(style)

    this.fetchedRSS = '';
    this.lastContentPosition = 0;

    this._generateWidget();
    this._addToWidget(this._generateMainTitle());
    this._addToWidget(this._generatePlayerTitle());
    this._addToWidget(this._generateAudioPlayer());
    this._addToWidget(this._generateSkeletonPodcastListAndItems());


    var footer = document.createElement('div')
    footer.classList.add('podcast-footer')
    this._addToWidget(footer);

    document.body.appendChild(this.widget);
    this._createToggleButton();
  }

  _buildPodcastItems(){
    var self = this;
    setTimeout(() => {

      var element = document.getElementsByClassName('skeleton__podcastlist')[0]
      element.parentNode.removeChild(element);

      fetch(process.env.RSS_URL)
        .then(response => response.text())
        .then(str => new window.DOMParser().parseFromString(str, "text/xml"))
        .then(data => {
          self.fetchedRSS = 1;
          // this._generateWidget();
          // this._addToWidget(this._generateMainTitle());
          this._addToWidget(this._generatePlayerTitle());
          var podcast_list = this._generatePodcastList();
          var podcast_items = self.podcast_items = data.documentElement.childNodes[0].getElementsByTagName('item')
          for(var i = podcast_items.length-1; i > podcast_items.length-11; i--){
            var item = self._addPodcastItem({
              title: podcast_items[i].getElementsByTagName('title')[0].textContent,
              description: podcast_items[i].getElementsByTagName('description')[0].textContent,
              link: podcast_items[i].getElementsByTagName('link')[0].innerHTML,
              image: podcast_items[i].getElementsByTagName('itunes:image')[0].getAttribute('href'),
              duration: podcast_items[i].getElementsByTagName('itunes:duration')[0].innerHTML,
              audio: podcast_items[i].getElementsByTagName('enclosure')[0].getAttribute('url'),
            });
            item.addEventListener("click", self._playItem, false);
            podcast_list.appendChild(item);
          }
          self.lastContentPosition = podcast_items.length-11;

          this._addToWidget(this._generateAudioPlayer(podcast_list.getElementsByClassName('podcast-item')[0].getAttribute('data-audio')));

          this._addToWidget(podcast_list);
          // var footer = document.createElement('div')
          // footer.classList.add('podcast-footer')
          // this._addToWidget(footer);

          // document.body.appendChild(this.widget);
          // this._createToggleButton();

          this._resizePodcastItems();    
          this._playItem(podcast_list.getElementsByClassName('podcast-item')[0])

          document.getElementsByClassName('podcast-list')[0].addEventListener('scroll', function(e) {
            var elem = document.getElementsByClassName('podcast-list')[0];
            if (elem.scrollTop >= (elem.scrollHeight - elem.offsetHeight)) {
              // Add item;
              if(self.lastContentPosition > 0){
                var skeleton_id = new Date().getTime();
                var item = self._addSkeletonItem()
                item.classList.add(skeleton_id)
                document.getElementsByClassName('podcast-list')[0].appendChild(item);
                var content_index = self.lastContentPosition;
                self.lastContentPosition -= 1;
                setTimeout( () => {
                  
                  var podcast_item = self._addPodcastItem(
                    {
                      title: self.podcast_items[content_index].getElementsByTagName('title')[0].textContent,
                      description: self.podcast_items[content_index].getElementsByTagName('description')[0].textContent,
                      link: self.podcast_items[content_index].getElementsByTagName('link')[0].innerHTML,
                      image: self.podcast_items[content_index].getElementsByTagName('itunes:image')[0].getAttribute('href'),
                      duration: self.podcast_items[content_index].getElementsByTagName('itunes:duration')[0].innerHTML,
                      audio: self.podcast_items[content_index].getElementsByTagName('enclosure')[0].getAttribute('url'),
                    }
                  );
                  podcast_item.addEventListener("click", self._playItem, false);
                  
                  document.getElementsByClassName(skeleton_id)[0].parentNode.replaceChild( podcast_item, item)                 
                }, 1000);
              }
              //console.log('scrollTop:', elem.scrollTop, 'scrollHeight:', elem.scrollHeight)
            }
          })
        })
    }, 1500)
  }

  _playItem(obj){
    var el = '';
    if(obj.target){
      if(obj.target.classList.contains('podcast-item'))
      {
        el = obj.target
      }else{
        el = obj.target.closest('.podcast-item')
      }
    }else{
      el = obj
    }
    
    document.getElementById('podcast-widget').getElementsByTagName('audio')[0].src = el.getAttribute('data-audio')
    document.getElementById('podcast-widget').getElementsByClassName('player')[0].getElementsByClassName('title')[0].innerHTML = el.getElementsByClassName('podcast-title')[0].innerHTML
    // Set the item as active
    var elems = document.querySelectorAll(".podcast-item.active");
    [].forEach.call(elems, function(el) {
        el.classList.remove("active");
    });
    el.classList.add('active')
  }

  _resizePodcastItems(){
    // resize podcast list
    var podcastwidget = document.getElementById('podcast-widget')
    var offsetHeight = 0;
    offsetHeight += podcastwidget.getElementsByClassName('title')[0].offsetHeight
    offsetHeight += podcastwidget.getElementsByClassName('player')[0].offsetHeight
    offsetHeight += podcastwidget.getElementsByTagName('audio')[0].offsetHeight
    document.getElementsByClassName('podcast-list')[0].style = 'height: ' + (window.innerHeight - offsetHeight) + 'px;'
  }

  _formatDuration(time){
    var minutes = Math.floor(time / 60);
    var seconds = time - minutes * 60;
    return this._str_pad_left(minutes,'0',2) + ':' + this._str_pad_left(seconds,'0',2);
  }

  _str_pad_left(string,pad,length) {
    return (new Array(length+1).join(pad)+string).slice(-length);
  }

  _addToWidget(el){
    this.widget.appendChild(el)
  }

  _generateAudioPlayer(src){
    var self = this;
    if(document.getElementById('podcast-widget')){
      if(document.getElementById('podcast-widget').getElementsByTagName('audio').length > 0){
        var element = document.getElementById('podcast-widget').getElementsByTagName('audio');
        element.parentNode.removeChild(element);
      }
    }
    if(self.fetchedRSS){
      var player = document.createElement('audio')
      player.id = 'player'
      player.controls = 'controls'
      // get the filename instead of using the full url
      player.src      = src
      player.type     = 'audio/mpeg';
    }else{
      var player = document.createElement('div');
      player.id = 'player';
      player.classList.add('skeleton__player', 'loading')
    }

    return player;
  }

  _setPlayerTitle(text){
    document.getElementById('podcast-widget').getElementsByClassName('player')[0].getElementsByClassName('title').innerHTML = text
  }

  _addPodcastItem(obj){
    var podcast_item = document.createElement('div');
    podcast_item.classList.add('podcast-item')
    podcast_item.setAttribute('data-audio', obj.audio)
    var podcast_thumb = document.createElement('div')
    podcast_thumb.classList.add('podcast-thumb')
    var podcast_img = document.createElement('img')
    podcast_img.src = process.env.BASE_URL + '/www.nst.com.my/' + obj.image.substring(obj.image.lastIndexOf('/')+1);
    podcast_img.setAttribute('onerror', 'this.src=\'https://assets.nst.com.my/assets/logo.png\'')
    podcast_thumb.appendChild(podcast_img);
    podcast_item.appendChild(podcast_thumb)

    var podcast_content = document.createElement('div')
    podcast_content.classList.add('podcast-content')
    var podcast_title = document.createElement('div')
    podcast_title.classList.add('podcast-title')
    podcast_title.innerHTML = obj.title;
    var podcast_detail = document.createElement('div')
    podcast_detail.classList.add('podcast-detail')
    var podcast_duration = document.createElement('div')
    podcast_duration.classList.add('podcast-duration')
    podcast_duration.innerHTML = this._formatDuration(obj.duration);
    var podcast_link = document.createElement('div')
    podcast_link.classList.add('podcast-link')
    var link = document.createElement('a')
    link.href = obj.link;
    link.innerHTML = 'Read More'
    podcast_link.appendChild(link)
    podcast_detail.appendChild(podcast_duration)
    podcast_detail.appendChild(podcast_link)
    podcast_content.appendChild(podcast_title)
    podcast_content.appendChild(podcast_detail)
    podcast_item.appendChild(podcast_content)

    return podcast_item
  }

  _addSkeletonItem(){
    var podcast_item = document.createElement('div');
    podcast_item.classList.add('podcast-item')
    var podcast_thumb = document.createElement('div')
    podcast_thumb.classList.add('podcast-thumb')
    podcast_item.appendChild(podcast_thumb)

    var podcast_content = document.createElement('div')
    podcast_content.classList.add('podcast-content')
    var podcast_title = document.createElement('div')
    podcast_title.classList.add('podcast-title', 'skeleton__title', 'loading')
    var podcast_detail = document.createElement('div')
    podcast_detail.classList.add('podcast-detail', 'skeleton__title', 'loading')
    var podcast_duration = document.createElement('div')
    podcast_duration.classList.add('podcast-duration')
    var podcast_link = document.createElement('div')
    podcast_link.classList.add('podcast-link')
    podcast_detail.appendChild(podcast_duration)
    podcast_detail.appendChild(podcast_link)
    podcast_content.appendChild(podcast_title)
    podcast_content.appendChild(podcast_detail)
    podcast_item.appendChild(podcast_content)

    return podcast_item
  }

  _generateSkeletonPodcastListAndItems(){
    var self = this
    var podcast_list = document.createElement('div');
    podcast_list.classList.add('podcast-list', 'skeleton__podcastlist', 'loading');

    for(var i = 0; i < 10; i++){
      var item = self._addSkeletonItem();
      podcast_list.appendChild(item);
    }
    //this._addToWidget(podcast_list);
    return podcast_list;
  }

  _generatePodcastList(){
    var podcast_list = document.createElement('div');
    podcast_list.classList.add('podcast-list');
    return podcast_list;
  }

  _generatePlayerTitle(){
    var self = this;
    if(self.fetchedRSS){

      var element = document.getElementById('podcast-widget').getElementsByClassName('skeleton__player')[0];
      element.parentNode.removeChild(element);

      var element = document.getElementById('podcast-widget').getElementsByClassName('player')[0];
      element.parentNode.removeChild(element);

      var player_container = document.createElement('div')
      player_container.classList.add('player')
      var player_title = document.createElement('div')
      player_title.classList.add('title');
      player_title.innerHTML = ''
      player_container.appendChild(player_title)

    }else{

      var player_container = document.createElement('div')
      player_container.classList.add('player')
      var player_title = document.createElement('div')
      player_title.classList.add('title', 'skeleton__title', 'loading');
      player_title.innerHTML = ''
      player_container.appendChild(player_title)

    }
    
    return player_container;
  }

  _generateWidget(){
    this.widget = document.createElement('div')
    this.widget.id = 'podcast-widget'
    this.widget.classList.add('podcast-hide')
  }

  _generateMainTitle(){
    var main_title = document.createElement('h2')
    main_title.classList.add('title')
    var img_logo = document.createElement('img');
    img_logo.src = this.podcast_logo;
    img_logo.alt = 'NST Podcast';
    img_logo.classList.add('mr-10')

    var main_title_text = document.createElement('span')
    main_title_text.innerHTML = 'PODCAST'

    var closebtn = document.createElement('a')
    closebtn.classList.add('podcast-closebtn')
    closebtn.innerHTML = '&times;'
    closebtn.addEventListener("click", this.togglePlayer, false);

    main_title.appendChild(img_logo)
    main_title.appendChild(main_title_text)
    main_title.appendChild(closebtn)
    return main_title;
  }

  _createToggleButton(){
    // Create toggle button
    var togglebtn = document.createElement('div')
    togglebtn.id = 'podcast-toggle';
    var togglebtn_img = document.createElement('img')
    togglebtn_img.src = this.podcast_logo;
    togglebtn.appendChild(togglebtn_img)
    togglebtn.addEventListener("click", this.togglePlayer, false);
    document.body.appendChild(togglebtn);
  }

  togglePlayer(){
    var el = document.getElementById('podcast-widget')
    var podcast_btn = document.getElementById('podcast-toggle')
    if(el.classList.contains('podcast-hide')){
      el.classList.remove('podcast-hide')
      if(!window.podcast_player.fetchedRSS){
        window.podcast_player._buildPodcastItems();
      }
    }else{
      el.classList.add('podcast-hide')
      document.getElementById('podcast-widget').getElementsByTagName('audio')[0].pause(); 
    }

    if(podcast_btn.classList.contains('hide')){
      podcast_btn.classList.remove('hide')
    }else{
      podcast_btn.classList.add('hide')
    }
  }
}


(function () {
  window.podcast_player = new PodcastPlayer();
})();

index_dist.js

parcelRequire=function(e,r,t,n){var i,o="function"==typeof parcelRequire&&parcelRequire,u="function"==typeof require&&require;function f(t,n){if(!r[t]){if(!e[t]){var i="function"==typeof parcelRequire&&parcelRequire;if(!n&&i)return i(t,!0);if(o)return o(t,!0);if(u&&"string"==typeof t)return u(t);var c=new Error("Cannot find module '"+t+"'");throw c.code="MODULE_NOT_FOUND",c}p.resolve=function(r){return e[t][1][r]||r},p.cache={};var l=r[t]=new f.Module(t);e[t][0].call(l.exports,p,l,l.exports,this)}return r[t].exports;function p(e){return f(p.resolve(e))}}f.isParcelRequire=!0,f.Module=function(e){this.id=e,this.bundle=f,this.exports={}},f.modules=e,f.cache=r,f.parent=o,f.register=function(r,t){e[r]=[function(e,r){r.exports=t},{}]};for(var c=0;c<t.length;c++)try{f(t[c])}catch(e){i||(i=e)}if(t.length){var l=f(t[t.length-1]);"object"==typeof exports&&"undefined"!=typeof module?module.exports=l:"function"==typeof define&&define.amd?define(function(){return l}):n&&(this[n]=l)}if(parcelRequire=f,i)throw i;return f}({"sC8V":[function(require,module,exports) {

},{}],"g5IB":[function(require,module,exports) {

var t,e,n=module.exports={};function r(){throw new Error("setTimeout has not been defined")}function o(){throw new Error("clearTimeout has not been defined")}function i(e){if(t===setTimeout)return setTimeout(e,0);if((t===r||!t)&&setTimeout)return t=setTimeout,setTimeout(e,0);try{return t(e,0)}catch(n){try{return t.call(null,e,0)}catch(n){return t.call(this,e,0)}}}function u(t){if(e===clearTimeout)return clearTimeout(t);if((e===o||!e)&&clearTimeout)return e=clearTimeout,clearTimeout(t);try{return e(t)}catch(n){try{return e.call(null,t)}catch(n){return e.call(this,t)}}}!function(){try{t="function"==typeof setTimeout?setTimeout:r}catch(n){t=r}try{e="function"==typeof clearTimeout?clearTimeout:o}catch(n){e=o}}();var c,s=[],l=!1,a=-1;function f(){l&&c&&(l=!1,c.length?s=c.concat(s):a=-1,s.length&&h())}function h(){if(!l){var t=i(f);l=!0;for(var e=s.length;e;){for(c=s,s=[];++a<e;)c&&c[a].run();a=-1,e=s.length}c=null,l=!1,u(t)}}function m(t,e){this.fun=t,this.array=e}function p(){}n.nextTick=function(t){var e=new Array(arguments.length-1);if(arguments.length>1)for(var n=1;n<arguments.length;n++)e[n-1]=arguments[n];s.push(new m(t,e)),1!==s.length||l||i(h)},m.prototype.run=function(){this.fun.apply(null,this.array)},n.title="browser",n.env={},n.argv=[],n.version="",n.versions={},n.on=p,n.addListener=p,n.once=p,n.off=p,n.removeListener=p,n.removeAllListeners=p,n.emit=p,n.prependListener=p,n.prependOnceListener=p,n.listeners=function(t){return[]},n.binding=function(t){throw new Error("process.binding is not supported")},n.cwd=function(){return"/"},n.chdir=function(t){throw new Error("process.chdir is not supported")},n.umask=function(){return 0};
},{}],"sNrv":[function(require,module,exports) {
var process = require("process");
var r=require("process");function t(r,t){for(var e=0,n=r.length-1;n>=0;n--){var o=r[n];"."===o?r.splice(n,1):".."===o?(r.splice(n,1),e++):e&&(r.splice(n,1),e--)}if(t)for(;e--;e)r.unshift("..");return r}function e(r){"string"!=typeof r&&(r+="");var t,e=0,n=-1,o=!0;for(t=r.length-1;t>=0;--t)if(47===r.charCodeAt(t)){if(!o){e=t+1;break}}else-1===n&&(o=!1,n=t+1);return-1===n?"":r.slice(e,n)}function n(r,t){if(r.filter)return r.filter(t);for(var e=[],n=0;n<r.length;n++)t(r[n],n,r)&&e.push(r[n]);return e}exports.resolve=function(){for(var e="",o=!1,s=arguments.length-1;s>=-1&&!o;s--){var i=s>=0?arguments[s]:r.cwd();if("string"!=typeof i)throw new TypeError("Arguments to path.resolve must be strings");i&&(e=i+"/"+e,o="/"===i.charAt(0))}return(o?"/":"")+(e=t(n(e.split("/"),function(r){return!!r}),!o).join("/"))||"."},exports.normalize=function(r){var e=exports.isAbsolute(r),s="/"===o(r,-1);return(r=t(n(r.split("/"),function(r){return!!r}),!e).join("/"))||e||(r="."),r&&s&&(r+="/"),(e?"/":"")+r},exports.isAbsolute=function(r){return"/"===r.charAt(0)},exports.join=function(){var r=Array.prototype.slice.call(arguments,0);return exports.normalize(n(r,function(r,t){if("string"!=typeof r)throw new TypeError("Arguments to path.join must be strings");return r}).join("/"))},exports.relative=function(r,t){function e(r){for(var t=0;t<r.length&&""===r[t];t++);for(var e=r.length-1;e>=0&&""===r[e];e--);return t>e?[]:r.slice(t,e-t+1)}r=exports.resolve(r).substr(1),t=exports.resolve(t).substr(1);for(var n=e(r.split("/")),o=e(t.split("/")),s=Math.min(n.length,o.length),i=s,u=0;u<s;u++)if(n[u]!==o[u]){i=u;break}var f=[];for(u=i;u<n.length;u++)f.push("..");return(f=f.concat(o.slice(i))).join("/")},exports.sep="/",exports.delimiter=":",exports.dirname=function(r){if("string"!=typeof r&&(r+=""),0===r.length)return".";for(var t=r.charCodeAt(0),e=47===t,n=-1,o=!0,s=r.length-1;s>=1;--s)if(47===(t=r.charCodeAt(s))){if(!o){n=s;break}}else o=!1;return-1===n?e?"/":".":e&&1===n?"/":r.slice(0,n)},exports.basename=function(r,t){var n=e(r);return t&&n.substr(-1*t.length)===t&&(n=n.substr(0,n.length-t.length)),n},exports.extname=function(r){"string"!=typeof r&&(r+="");for(var t=-1,e=0,n=-1,o=!0,s=0,i=r.length-1;i>=0;--i){var u=r.charCodeAt(i);if(47!==u)-1===n&&(o=!1,n=i+1),46===u?-1===t?t=i:1!==s&&(s=1):-1!==t&&(s=-1);else if(!o){e=i+1;break}}return-1===t||-1===n||0===s||1===s&&t===n-1&&t===e+1?"":r.slice(t,n)};var o="b"==="ab".substr(-1)?function(r,t,e){return r.substr(t,e)}:function(r,t,e){return t<0&&(t=r.length+t),r.substr(t,e)};
},{"process":"g5IB"}],"Ig2k":[function(require,module,exports) {
var process = require("process");
var e=require("process"),n=require("fs"),r=require("path");function t(e){console.log("[dotenv][DEBUG] ".concat(e))}var o="\n",a=/^\s*([\w.-]+)\s*=\s*(.*)?\s*$/,c=/\\n/g,i=/\n|\r|\r\n/;function l(e,n){var r=Boolean(n&&n.debug),l={};return e.toString().split(i).forEach(function(e,n){var i=e.match(a);if(null!=i){var s=i[1],u=i[2]||"",d=u.length-1,p='"'===u[0]&&'"'===u[d];"'"===u[0]&&"'"===u[d]||p?(u=u.substring(1,d),p&&(u=u.replace(c,o))):u=u.trim(),l[s]=u}else r&&t("did not match key and value when parsing line ".concat(n+1,": ").concat(e))}),l}function s(o){var a=r.resolve(e.cwd(),".env"),c="utf8",i=!1;o&&(null!=o.path&&(a=o.path),null!=o.encoding&&(c=o.encoding),null!=o.debug&&(i=!0));try{var s=l(n.readFileSync(a,{encoding:c}),{debug:i});return Object.keys(s).forEach(function(n){Object.prototype.hasOwnProperty.call(e.env,n)?i&&t('"'.concat(n,'" is already defined in `process.env` and will not be overwritten')):e.env[n]=s[n]}),{parsed:s}}catch(u){return{error:u}}}module.exports.config=s,module.exports.parse=l;
},{"fs":"sC8V","path":"sNrv","process":"g5IB"}],"pJEM":[function(require,module,exports) {
module.exports="/podcast.86d6c325.png";
},{}],"Focm":[function(require,module,exports) {
function e(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function t(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}function n(e,n,a){return n&&t(e.prototype,n),a&&t(e,a),e}var a=require("fs");require("dotenv").config();var i=function(){function t(){e(this,t);this.podcast_logo="https://podcast.mediaprimalabs.com"+require("~/podcast.png"),this.podcast_logo="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAQAAADZc7J/AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QAAKqNIzIAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAAHdElNRQfkBgoENB7n0IC4AAAC/UlEQVRIx5WUS2xVVRSGv317K7nQwlXDs23EkggmQBOIUOZITRhh5RErKMQJpsY4NpIYZoxoQkxqIgUsyQ06wAafCY+RPIK0CD7KBAmQQBHogwChl/M5uMfbnt5TrWt0zlrr//bae629A6lmE2/QzHKmk+M6VzlFT+hjauZaT5tmP7m2MjtMEM+kky0AnOVHLnAHmM0KWlgFQDc7w4PJ1673oqpfu7QittweVX91/mTyvP3qiJsBDK70Qzvc4we+EmdscUS95PNp8uB36lAp2VYvJ/b/m60ANjus9qQB3lQjXwOrPahqZK8FC/YZqXrIaeB6I/XtifJp/ql+CgaPqNptYzna6GFVj5gBO9WrZpOADepD54E7VW2vqPB9Vd8D5/tQ3ZQMf6V+AdY4oO6NvS12uNd18V+HetfpYLdaSAL+Ul8H31LvOwsMdpWPcL8BnOWgug3cqA44NkPOU/UF8IB6AMB3E13YAfHKB8FFqs4ByABQB8h14CXgIgDvJErcDkAv0AhcA2DuGACgGCKgGngMQD4BeBaAR0AOQpEIqBkDPAKqzQO3gQYAzicA5yCO3AafIwMMjZ3BMz5Rm8FP1J8BXOC98gkM2gDgBXUXuEYtmhvfhV71I3CZkfoqgC97ysjIky4BcJ0auQzcpfYm2/ix+rsBPKr2/dMiZzijfFf61KNgxivq7iRgkUW1Faz3m1KDKmZxjt9aD25Si75Y8paHwc/ZwQ2WhiEA59LO4nHqP9gXBgDMc5k6usPWifwF3le/Nws2eLPiQbthPZj1B/WedWklrvepuhD8LPVN7AQXqpEbSDfbHTUDnldP+KQsfexp9RxY5dPKmzoesdEa8Ji62kIZUHCNegystS2pyCR/w5fhQTx3W6kal9VW8oaRcJj/NltUvVuuoPTVMgVpDMgbOWrOW6reMueokfm03EyaMwzST5YmLgHwC01k6Q+DU64A7FKH49c4cljtSs/MTEI4C9TGcxqoBc78P8CZKXj+dQtVHk9M4XGr0jP/BmrtsyXBBDijAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDIwLTA2LTEwVDA0OjUyOjMwKzAwOjAwLXK3qAAAACV0RVh0ZGF0ZTptb2RpZnkAMjAyMC0wNi0xMFQwNDo1MjozMCswMDowMFwvDxQAAAAZdEVYdFNvZnR3YXJlAHd3dy5pbmtzY2FwZS5vcmeb7jwaAAAAAElFTkSuQmCC";var n=document.createElement("style");n.appendChild(document.createTextNode('#podcast-widget{\r\n    position: fixed;\r\n    width: 30%;\r\n    right: 0;\r\n    top: 0;\r\n    color: white;\r\n    font-family: Roboto,sans-serif;\r\n    transition: all .75s ease;\r\n    background-color: #fff;\r\n    z-index: 9999;\r\n    height: 100%;\r\n}\r\n\r\n#podcast-widget.podcast-hide {\r\n    height: 150px;\r\n    width: 0px;\r\n    opacity: 0;\r\n    transition: all .75s ease;\r\n}\r\n\r\n.mr-10{ margin-right: 10px; }\r\n\r\n#podcast-widget > .title img{ vertical-align: middle; }\r\n#podcast-widget > .title{\r\n    font-size: 20px;\r\n    padding-top: 17px;\r\n    padding-left: 20px;\r\n    background-color: #3d3d3d;\r\n    margin: 0;\r\n    padding-bottom: .5rem;\r\n    position: relative;\r\n}\r\n.player{\r\n    background-color: #f1f3f4;\r\n    color: #545454;\r\n    padding: 5px 20px;\r\n    height: 70px;\r\n}\r\n.player .title{\r\n    font-size: 20px\r\n}\r\n.podcast-closebtn{\r\n    position: absolute;\r\n    top: 0;\r\n    right: 20px;\r\n    font-size: 36px;\r\n    margin-top: 10px;\r\n    opacity: 0.3;\r\n    color:#818181;\r\n    transition: 0.3s;\r\n    text-decoration: none;\r\n    cursor: pointer;\r\n}\r\n.podcast-closebtn:hover{\r\n    color: #fff;\r\n}\r\n\r\n#player{ width: 100%; }\r\n.podcast-item{ \r\n    color: #000;\r\n    display: flex;\r\n\r\n }\r\n.podcast-thumb{\r\n    flex: none;\r\n    width: 100px;\r\n    height: 70px;\r\n    margin-right: 10px;\r\n}\r\n.podcast-thumb img{ max-width: 100%; max-height: 100%; height: auto; width: 100%; }\r\n.podcast-list{ overflow-y: scroll; }\r\n.podcast-list > div{ padding: 10px; }\r\n.podcast-item{ cursor: pointer; }\r\n.podcast-item:hover, .podcast-item.active{\r\n    background-color: #dae0e5\r\n}\r\n.podcast-content{ display: flex; flex-direction: column; flex: 1 }\r\n.podcast-detail{ display: flex; flex-direction: row; }\r\n.podcast-duration{ width: 50%; }\r\n.podcast-link{ text-align: right; flex: 1 }\r\n.podcast-link a{ text-decoration: none; color: #e6483c; font-weight: bold; }\r\n.podcast-title{ flex: 1 }\r\n#podcast-toggle{\r\n    position: fixed;\r\n    top: 80%;\r\n    background-color: #e6483c;\r\n    right: 0;\r\n    padding: 10px;\r\n    cursor: pointer;\r\n}\r\n#podcast-toggle:hover{\r\n    background-color: #000;\r\n}\r\n\r\n.podcast-footer{\r\n    height: 100px;\r\n    background-color: #3d3d3d;\r\n    height: 100%;\r\n    display: none;\r\n}\r\n.hide{ display: none; }\r\n\r\n@media only screen and (max-width: 480px) {\r\n    #podcast-widget{\r\n        position: fixed;\r\n        width: 100%;\r\n        right: 0;\r\n        top: 0;\r\n        color: white;\r\n        font-family: Roboto,sans-serif;\r\n        transition: all .75s ease;\r\n    } \r\n\r\n    .player .title{\r\n        font-size: 1em;\r\n    }\r\n}\r\n\r\n  \r\n/* Card title */ \r\n.skeleton__title { \r\n    padding: 8px; \r\n    font-size: 22px; \r\n    font-weight: 700; \r\n} \r\n  \r\n.skeleton__title.loading { \r\n    height: 1rem; \r\n    width: 50%; \r\n    margin: 1rem; \r\n    border-radius: 3px; \r\n}\r\n\r\n.podcast-title.skeleton__title.loading{\r\n    width: 80%;\r\n}\r\n\r\n.skeleton__player { \r\n    padding: 8px; \r\n    font-size: 22px; \r\n    font-weight: 700; \r\n} \r\n  \r\n.skeleton__player.loading { \r\n    height: 1rem; \r\n    width: 50%; \r\n    margin: 1rem; \r\n    border-radius: 3px; \r\n} \r\n\r\n.skeleton__podcastlist { \r\n    padding: 8px; \r\n    font-size: 22px; \r\n    font-weight: 700; \r\n    overflow-y: hidden;\r\n} \r\n\r\n/* The loading Class */ \r\n.loading { \r\n    position: relative; \r\n    background-color: #e2e2e2; \r\n} \r\n\r\n/* The moving element */ \r\n.loading::after { \r\n    display: block; \r\n    content: ""; \r\n    position: absolute; \r\n    width: 100%; \r\n    height: 100%; \r\n    transform: translateX(-100%); \r\n    background: -webkit-gradient(linear, left top, \r\n                right top, from(transparent),  \r\n                color-stop(rgba(255, 255, 255, 0.2)), \r\n                to(transparent)); \r\n                  \r\n    background: linear-gradient(90deg, transparent, \r\n            rgba(255, 255, 255, 0.2), transparent); \r\n\r\n    /* Adding animation */ \r\n    animation: loading 0.8s infinite; \r\n} \r\n\r\n/* Loading Animation */ \r\n@keyframes loading { \r\n    100% { \r\n        transform: translateX(100%); \r\n    } \r\n} ')),document.head.appendChild(n),this.fetchedRSS="",this.lastContentPosition=0,this._generateWidget(),this._addToWidget(this._generateMainTitle()),this._addToWidget(this._generatePlayerTitle()),this._addToWidget(this._generateAudioPlayer()),this._addToWidget(this._generateSkeletonPodcastListAndItems());var a=document.createElement("div");a.classList.add("podcast-footer"),this._addToWidget(a),document.body.appendChild(this.widget),this._createToggleButton()}return n(t,[{key:"_buildPodcastItems",value:function(){var e=this,t=this;setTimeout(function(){var n=document.getElementsByClassName("skeleton__podcastlist")[0];n.parentNode.removeChild(n),fetch("https://podcast.mediaprimalabs.com/www.nst.com.my/rss.xml").then(function(e){return e.text()}).then(function(e){return(new window.DOMParser).parseFromString(e,"text/xml")}).then(function(n){t.fetchedRSS=1,e._addToWidget(e._generatePlayerTitle());for(var a=e._generatePodcastList(),i=t.podcast_items=n.documentElement.childNodes[0].getElementsByTagName("item"),r=i.length-1;r>i.length-11;r--){var d=t._addPodcastItem({title:i[r].getElementsByTagName("title")[0].textContent,description:i[r].getElementsByTagName("description")[0].textContent,link:i[r].getElementsByTagName("link")[0].innerHTML,image:i[r].getElementsByTagName("itunes:image")[0].getAttribute("href"),duration:i[r].getElementsByTagName("itunes:duration")[0].innerHTML,audio:i[r].getElementsByTagName("enclosure")[0].getAttribute("url")});d.addEventListener("click",t._playItem,!1),a.appendChild(d)}t.lastContentPosition=i.length-11,e._addToWidget(e._generateAudioPlayer(a.getElementsByClassName("podcast-item")[0].getAttribute("data-audio"))),e._addToWidget(a),e._resizePodcastItems(),e._playItem(a.getElementsByClassName("podcast-item")[0]),document.getElementsByClassName("podcast-list")[0].addEventListener("scroll",function(e){var n=document.getElementsByClassName("podcast-list")[0];if(n.scrollTop>=n.scrollHeight-n.offsetHeight&&t.lastContentPosition>0){var a=(new Date).getTime(),i=t._addSkeletonItem();i.classList.add(a),document.getElementsByClassName("podcast-list")[0].appendChild(i);var r=t.lastContentPosition;t.lastContentPosition-=1,setTimeout(function(){var e=t._addPodcastItem({title:t.podcast_items[r].getElementsByTagName("title")[0].textContent,description:t.podcast_items[r].getElementsByTagName("description")[0].textContent,link:t.podcast_items[r].getElementsByTagName("link")[0].innerHTML,image:t.podcast_items[r].getElementsByTagName("itunes:image")[0].getAttribute("href"),duration:t.podcast_items[r].getElementsByTagName("itunes:duration")[0].innerHTML,audio:t.podcast_items[r].getElementsByTagName("enclosure")[0].getAttribute("url")});e.addEventListener("click",t._playItem,!1),document.getElementsByClassName(a)[0].parentNode.replaceChild(e,i)},1e3)}})})},1500)}},{key:"_playItem",value:function(e){var t="";t=e.target?e.target.classList.contains("podcast-item")?e.target:e.target.closest(".podcast-item"):e,document.getElementById("podcast-widget").getElementsByTagName("audio")[0].src=t.getAttribute("data-audio"),document.getElementById("podcast-widget").getElementsByClassName("player")[0].getElementsByClassName("title")[0].innerHTML=t.getElementsByClassName("podcast-title")[0].innerHTML;var n=document.querySelectorAll(".podcast-item.active");[].forEach.call(n,function(e){e.classList.remove("active")}),t.classList.add("active")}},{key:"_resizePodcastItems",value:function(){var e=document.getElementById("podcast-widget"),t=0;t+=e.getElementsByClassName("title")[0].offsetHeight,t+=e.getElementsByClassName("player")[0].offsetHeight,t+=e.getElementsByTagName("audio")[0].offsetHeight,document.getElementsByClassName("podcast-list")[0].style="height: "+(window.innerHeight-t)+"px;"}},{key:"_formatDuration",value:function(e){var t=Math.floor(e/60),n=e-60*t;return this._str_pad_left(t,"0",2)+":"+this._str_pad_left(n,"0",2)}},{key:"_str_pad_left",value:function(e,t,n){return(new Array(n+1).join(t)+e).slice(-n)}},{key:"_addToWidget",value:function(e){this.widget.appendChild(e)}},{key:"_generateAudioPlayer",value:function(e){var t;if(document.getElementById("podcast-widget")&&document.getElementById("podcast-widget").getElementsByTagName("audio").length>0){var n=document.getElementById("podcast-widget").getElementsByTagName("audio");n.parentNode.removeChild(n)}this.fetchedRSS?((t=document.createElement("audio")).id="player",t.controls="controls",t.src=e,t.type="audio/mpeg"):((t=document.createElement("div")).id="player",t.classList.add("skeleton__player","loading"));return t}},{key:"_setPlayerTitle",value:function(e){document.getElementById("podcast-widget").getElementsByClassName("player")[0].getElementsByClassName("title").innerHTML=e}},{key:"_addPodcastItem",value:function(e){var t=document.createElement("div");t.classList.add("podcast-item"),t.setAttribute("data-audio",e.audio);var n=document.createElement("div");n.classList.add("podcast-thumb");var a=document.createElement("img");a.src="https://podcast.mediaprimalabs.com/www.nst.com.my/"+e.image.substring(e.image.lastIndexOf("/")+1),a.setAttribute("onerror","this.src='https://assets.nst.com.my/assets/logo.png'"),n.appendChild(a),t.appendChild(n);var i=document.createElement("div");i.classList.add("podcast-content");var r=document.createElement("div");r.classList.add("podcast-title"),r.innerHTML=e.title;var d=document.createElement("div");d.classList.add("podcast-detail");var o=document.createElement("div");o.classList.add("podcast-duration"),o.innerHTML=this._formatDuration(e.duration);var s=document.createElement("div");s.classList.add("podcast-link");var l=document.createElement("a");return l.href=e.link,l.innerHTML="Read More",s.appendChild(l),d.appendChild(o),d.appendChild(s),i.appendChild(r),i.appendChild(d),t.appendChild(i),t}},{key:"_addSkeletonItem",value:function(){var e=document.createElement("div");e.classList.add("podcast-item");var t=document.createElement("div");t.classList.add("podcast-thumb"),e.appendChild(t);var n=document.createElement("div");n.classList.add("podcast-content");var a=document.createElement("div");a.classList.add("podcast-title","skeleton__title","loading");var i=document.createElement("div");i.classList.add("podcast-detail","skeleton__title","loading");var r=document.createElement("div");r.classList.add("podcast-duration");var d=document.createElement("div");return d.classList.add("podcast-link"),i.appendChild(r),i.appendChild(d),n.appendChild(a),n.appendChild(i),e.appendChild(n),e}},{key:"_generateSkeletonPodcastListAndItems",value:function(){var e=document.createElement("div");e.classList.add("podcast-list","skeleton__podcastlist","loading");for(var t=0;t<10;t++){var n=this._addSkeletonItem();e.appendChild(n)}return e}},{key:"_generatePodcastList",value:function(){var e=document.createElement("div");return e.classList.add("podcast-list"),e}},{key:"_generatePlayerTitle",value:function(){var e,t,n;this.fetchedRSS?((e=document.getElementById("podcast-widget").getElementsByClassName("skeleton__player")[0]).parentNode.removeChild(e),(e=document.getElementById("podcast-widget").getElementsByClassName("player")[0]).parentNode.removeChild(e),(t=document.createElement("div")).classList.add("player"),(n=document.createElement("div")).classList.add("title"),n.innerHTML="",t.appendChild(n)):((t=document.createElement("div")).classList.add("player"),(n=document.createElement("div")).classList.add("title","skeleton__title","loading"),n.innerHTML="",t.appendChild(n));return t}},{key:"_generateWidget",value:function(){this.widget=document.createElement("div"),this.widget.id="podcast-widget",this.widget.classList.add("podcast-hide")}},{key:"_generateMainTitle",value:function(){var e=document.createElement("h2");e.classList.add("title");var t=document.createElement("img");t.src=this.podcast_logo,t.alt="NST Podcast",t.classList.add("mr-10");var n=document.createElement("span");n.innerHTML="PODCAST";var a=document.createElement("a");return a.classList.add("podcast-closebtn"),a.innerHTML="&times;",a.addEventListener("click",this.togglePlayer,!1),e.appendChild(t),e.appendChild(n),e.appendChild(a),e}},{key:"_createToggleButton",value:function(){var e=document.createElement("div");e.id="podcast-toggle";var t=document.createElement("img");t.src=this.podcast_logo,e.appendChild(t),e.addEventListener("click",this.togglePlayer,!1),document.body.appendChild(e)}},{key:"togglePlayer",value:function(){var e=document.getElementById("podcast-widget"),t=document.getElementById("podcast-toggle");e.classList.contains("podcast-hide")?(e.classList.remove("podcast-hide"),window.podcast_player.fetchedRSS||window.podcast_player._buildPodcastItems()):(e.classList.add("podcast-hide"),document.getElementById("podcast-widget").getElementsByTagName("audio")[0].pause()),t.classList.contains("hide")?t.classList.remove("hide"):t.classList.add("hide")}}]),t}();window.podcast_player=new i;
},{"fs":"sC8V","dotenv":"Ig2k","~/podcast.png":"pJEM"}]},{},["Focm"], null)
//# sourceMappingURL=/index.js.map