text: // __________________
  // getHTMLMediaElement.js
  
  function getHTMLMediaElement(mediaElement, config) {
      console.log("getHTMLMediaElement: ", mediaElement, config);
      config = config || {};
  
      if (!mediaElement.nodeName || (mediaElement.nodeName.toLowerCase() != 'audio' && mediaElement.nodeName.toLowerCase() != 'video')) {
          if (!mediaElement.getVideoTracks().length) {
              return getAudioElement(mediaElement, config);
          }
  
          var mediaStream = mediaElement;
          mediaElement = document.createElement(mediaStream.getVideoTracks().length ? 'video' : 'audio');
  
          if ('srcObject' in mediaElement) {
              mediaElement.srcObject = mediaStream;
          } else {
              mediaElement[!!navigator.mozGetUserMedia ? 'mozSrcObject' : 'src'] = !!navigator.mozGetUserMedia ? mediaStream : window.webkitURL.createObjectURL(mediaStream);
          }
      }
  
      if (mediaElement.nodeName && mediaElement.nodeName.toLowerCase() == 'audio') {
          return getAudioElement(mediaElement, config);
      }
  
      mediaElement.controls = true;
  
      var buttons = config.buttons || ['mute-audio', 'mute-video', 'full-screen', 'volume-slider', 'stop'];
      buttons.has = function(element) {
          return buttons.indexOf(element) !== -1;
      };
  
      config.toggle = config.toggle || [];
      config.toggle.has = function(element) {
          return config.toggle.indexOf(element) !== -1;
      };
  
      var mediaElementContainer = document.createElement('div');
      mediaElementContainer.className = 'media-container';
  
      var mediaBox = document.createElement('div');
      mediaBox.className = 'media-box';
      mediaElementContainer.appendChild(mediaBox);
  
      if (config.title) {
          var h2 = document.createElement('h2');
          h2.innerHTML = config.title;
          h2.setAttribute('style', 'position: absolute;color:white;font-size:17px;text-shadow: 1px 1px black;padding:0;margin:0;text-align: left; margin-top: 10px; margin-left: 10px; display: block; border: 0;line-height:1.5;z-index:1;');
          mediaBox.appendChild(h2);
      }
  
      mediaBox.appendChild(mediaElement);
  
      if (!config.width) config.width = (innerWidth / 2) - 50;
  
      mediaElementContainer.style.width = config.width + 'px';
  
      if (config.height) {
          mediaBox.style.height = config.height + 'px';
      }
  
      //mediaBox.querySelector('video').style.maxHeight = innerHeight + 'px';
  
      mediaElementContainer.toggle = function(clasName) {
          if (typeof clasName != 'string') {
              for (var i = 0; i < clasName.length; i++) {
                  mediaElementContainer.toggle(clasName[i]);
              }
              return;
          }
  
          if (clasName == 'mute-audio' && muteAudio) muteAudio.onclick();
          if (clasName == 'mute-video' && muteVideo) muteVideo.onclick();
  
          if (clasName == 'record-audio' && recordAudio) recordAudio.onclick();
          if (clasName == 'record-video' && recordVideo) recordVideo.onclick();
  
          if (clasName == 'stop' && stop) stop.onclick();
  
          return this;
      };
  
      mediaElementContainer.media = mediaElement;
  
      return mediaElementContainer;
  }
  
  // __________________
  // getAudioElement.js
  
  function getAudioElement(mediaElement, config) {
      config = config || {};
  
      if (!mediaElement.nodeName || (mediaElement.nodeName.toLowerCase() != 'audio' && mediaElement.nodeName.toLowerCase() != 'video')) {
          var mediaStream = mediaElement;
          mediaElement = document.createElement('audio');
  
          if ('srcObject' in mediaElement) {
              mediaElement.mediaElement = mediaStream;
          } else {
              mediaElement[!!navigator.mozGetUserMedia ? 'mozSrcObject' : 'src'] = !!navigator.mozGetUserMedia ? mediaStream : window.webkitURL.createObjectURL(mediaStream);
          }
      }
  
      config.toggle = config.toggle || [];
      config.toggle.has = function(element) {
          return config.toggle.indexOf(element) !== -1;
      };
  
      mediaElement.controls = false;
      mediaElement.play();
  
      var mediaElementContainer = document.createElement('div');
      mediaElementContainer.className = 'media-container';
  
      var mediaControls = document.createElement('div');
      mediaControls.className = 'media-controls';
      mediaElementContainer.appendChild(mediaControls);
  
      var muteAudio = document.createElement('div');
      muteAudio.className = 'control ' + (config.toggle.has('mute-audio') ? 'unmute-audio selected' : 'mute-audio');
      mediaControls.appendChild(muteAudio);
  
      muteAudio.style['border-top-left-radius'] = '5px';
  
      muteAudio.onclick = function() {
          if (muteAudio.className.indexOf('unmute-audio') != -1) {
              muteAudio.className = muteAudio.className.replace('unmute-audio selected', 'mute-audio');
              mediaElement.muted = false;
              if (config.onUnMuted) config.onUnMuted('audio');
          } else {
              muteAudio.className = muteAudio.className.replace('mute-audio', 'unmute-audio selected');
              mediaElement.muted = true;
              if (config.onMuted) config.onMuted('audio');
          }
      };
  
      if (!config.buttons || (config.buttons && config.buttons.indexOf('record-audio') != -1)) {
          var recordAudio = document.createElement('div');
          recordAudio.className = 'control ' + (config.toggle.has('record-audio') ? 'stop-recording-audio selected' : 'record-audio');
          mediaControls.appendChild(recordAudio);
  
          recordAudio.onclick = function() {
              if (recordAudio.className.indexOf('stop-recording-audio') != -1) {
                  recordAudio.className = recordAudio.className.replace('stop-recording-audio selected', 'record-audio');
                  if (config.onRecordingStopped) config.onRecordingStopped('audio');
              } else {
                  recordAudio.className = recordAudio.className.replace('record-audio', 'stop-recording-audio selected');
                  if (config.onRecordingStarted) config.onRecordingStarted('audio');
              }
          };
      }
  
      var volumeSlider = document.createElement('div');
      volumeSlider.className = 'control volume-slider';
      volumeSlider.style.width = 'auto';
      mediaControls.appendChild(volumeSlider);
  
      var slider = document.createElement('input');
      slider.style.marginTop = '11px';
      slider.style.width = ' 200px';
  
      if (config.buttons && config.buttons.indexOf('record-audio') == -1) {
          slider.style.width = ' 241px';
      }
  
      slider.type = 'range';
      slider.min = 0;
      slider.max = 100;
      slider.value = 100;
      slider.onchange = function() {
          mediaElement.volume = '.' + slider.value.toString().substr(0, 1);
      };
      volumeSlider.appendChild(slider);
  
      var stop = document.createElement('div');
      stop.className = 'control stop';
      mediaControls.appendChild(stop);
  
      stop.onclick = function() {
          mediaElementContainer.style.opacity = 0;
          setTimeout(function() {
              if (mediaElementContainer.parentNode) {
                  mediaElementContainer.parentNode.removeChild(mediaElementContainer);
              }
          }, 800);
          if (config.onStopped) config.onStopped();
      };
  
      stop.style['border-top-right-radius'] = '5px';
      stop.style['border-bottom-right-radius'] = '5px';
  
      var mediaBox = document.createElement('div');
      mediaBox.className = 'media-box';
      mediaElementContainer.appendChild(mediaBox);
  
      var h2 = document.createElement('h2');
      h2.innerHTML = config.title || 'Audio Element';
      h2.setAttribute('style', 'position: absolute;color: rgb(160, 160, 160);font-size: 20px;text-shadow: 1px 1px rgb(255, 255, 255);padding:0;margin:0;');
      mediaBox.appendChild(h2);
  
      mediaBox.appendChild(mediaElement);
  
      mediaElementContainer.style.width = '329px';
      mediaBox.style.height = '90px';
  
      h2.style.width = mediaElementContainer.style.width;
      h2.style.height = '50px';
      h2.style.overflow = 'hidden';
  
      var times = 0;
  
      function adjustControls() {
          mediaControls.style.marginLeft = (mediaElementContainer.clientWidth - mediaControls.clientWidth - 7) + 'px';
          mediaControls.style.marginTop = (mediaElementContainer.clientHeight - mediaControls.clientHeight - 6) + 'px';
          if (times < 10) {
              times++;
              setTimeout(adjustControls, 1000);
          } else times = 0;
      }
  
      if (config.showOnMouseEnter || typeof config.showOnMouseEnter === 'undefined') {
          mediaElementContainer.onmouseenter = mediaElementContainer.onmousedown = function() {
              adjustControls();
              mediaControls.style.opacity = 1;
          };
  
          mediaElementContainer.onmouseleave = function() {
              mediaControls.style.opacity = 0;
          };
      } else {
          setTimeout(function() {
              adjustControls();
              setTimeout(function() {
                  mediaControls.style.opacity = 1;
              }, 300);
          }, 700);
      }
  
      adjustControls();
  
      mediaElementContainer.toggle = function(clasName) {
          if (typeof clasName != 'string') {
              for (var i = 0; i < clasName.length; i++) {
                  mediaElementContainer.toggle(clasName[i]);
              }
              return;
          }
  
          if (clasName == 'mute-audio' && muteAudio) muteAudio.onclick();
          if (clasName == 'record-audio' && recordAudio) recordAudio.onclick();
          if (clasName == 'stop' && stop) stop.onclick();
  
          return this;
      };
  
      mediaElementContainer.media = mediaElement;
  
      return mediaElementContainer;
  }
  