<style>
body {background-image: url("https://i.gifer.com/DoV.gif");background-repeat: repeat;background-size: 90px;
  animation: scroll45deg 4s linear infinite;}@keyframes scroll45deg {0% {background-position: 0 0;}100% {background-position: 90px 90px;}}
</style>
<!---<style> body { background-image: url("other/images/bg/chocoomnomnom.gif"); } </style>--->
<meta charset="utf-8">
<title>Alcea</title>
<script src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    var baseUrl;
    if (window.location.protocol === "file:") {
        baseUrl = "file://" + window.location.pathname.match(/(.*)[\/\\]/)[1];
    } else {
        baseUrl = window.location.href.match(/(.*)[\/\\]/)[1];
    }
    var url = baseUrl + "/Navbar.html";
    if (url.includes("?")) {
        url = url.split("?")[0]; // Use only the part before "?"
    }
    if (url.includes("#")) {
        url = url.split("#")[0]; // Use only the part before "#"
    }
    $("#navbar").load(url);
});
</script>
<div class="formClass">
    <div id="navbar">
    </div>
</div>




<!-----Radio--->
<a target="_blank" href="http://fmstream.org/index.php?c=D" style=color:blue>Kartoffelstations</a>
<br><hr><br>
  <style>
    body {
      font-family: Arial, sans-serif;
      margin: 20px;
    }
    label {
      font-weight: bold;
    }
    input[type="text"], input[type="file"], button {
      margin-bottom: 10px;
    }
    #player {
      margin-top: 20px;
      background-color: #f5f5f5;
      padding: 20px;
      border-radius: 8px;
    }
    audio {
      width: 100%;
    }
    #trackInfo {
      margin-top: 20px;
      font-weight: bold;
    }
  </style>
</head>
<body>
<button onclick="queryURL()">[NowPlaying]</button>
<div id="response"></div>
  <br>
  <br>
[ <a href="#" onclick="document.getElementById('urlInput').value ='https://stream.antenne.de/antenne/stream/mp3'; return false;">Antenne</a> <a href="#" onclick="document.getElementById('urlInput').value = 'https://stream.bigfm.de/bw/mp3-128'; return false;">BigFM</a> <a href="#" onclick="document.getElementById('urlInput').value = 'https://liveradio.swr.de/sw890cl/swr3/play.aac'; return false;">SWR3</a>
 ] 
[Anime:  <a href="#" onclick="document.getElementById('urlInput').value = 'https://centova.listenon.in/proxy/animetracks/stream'; return false;">AnimeTracks</a>]
[Other:  <a href="#" onclick="document.getElementById('urlInput').value = 'https://stream.laut.fm/soundtrack'; return false;">Soundtracks</a>]


<a href="javascript:var spoiler = document.getElementById('pastplaying'); spoiler.open = !spoiler.open;">LastPlaying</a>


<details id="pastplaying">
  <summary style="display: none;"></summary>
  <div class="custom-summary" onclick="toggleDetails()"></div>
  <div class="dropdown-content">
    •<a target="_blank" href="https://codepen.io/ryedai1/full/ZEPMqZB" style=color:blue>AntenneBayern</a>
    •<a target="_blank" href="https://codepen.io/ryedai1/full/ZEPMqZB?baseurl=https://myonlineradio.de/bigfm/playlist?date=" style=color:blue>BigFM</a>
  </details><br>
<br>
  <input type="text" id="urlInput" value="https://stream.antenne.de/antenne/stream/mp3">
  <br>
  <button onclick="renderShoutcast()">[▷Play]</button>
  <br>
  <div id="player"></div>
  <div id="trackInfo"></div>


  <script>
    var audioElement = null;
function renderShoutcast() {
  var urlInput = document.getElementById("urlInput").value;
  var playerDiv = document.getElementById("player");
  // Clear existing player
  while (playerDiv.firstChild) {
    playerDiv.removeChild(playerDiv.firstChild);
  }
  audioElement = document.createElement("audio");
  audioElement.src = urlInput;
  audioElement.controls = true;
  playerDiv.appendChild(audioElement);
  // Add event listener for the 'canplay' event
  audioElement.addEventListener('canplay', function() {
    audioElement.play();
   var button = document.querySelector("[onclick='queryURL()']");
  button.click(); //click queryURLButton
  });
}

// Handle file upload
var fileInput = document.getElementById('fileInput');
fileInput.addEventListener('change', function(event) {
  var file = event.target.files[0];
  var reader = new FileReader();
  reader.onload = function(event) {
    var url = event.target.result;
    document.getElementById('urlInput').value = url;
    renderShoutcast();
  };
  reader.readAsDataURL(file);
});
  </script>


<!---Get Nowplaying--->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
    function queryURL() {
        var url = $('#urlInput').val();
        var requestURL = 'https://alcea-wisteria.de/PHP/0demo/2024-02-09-ShoutcaseMetadataextract/querystringextract.php?streamurl=' + url;
        fetch(requestURL)
            .then(function(response) {
                if (!response.ok) {
                    throw new Error('Network response was not ok');
                }
                return response.text();
            })
            .then(function(data) {
                $('#response').text(data);
            })
            .catch(function(error) {
                $('#response').text('Error occurred while fetching data: ' + error);
            });
    }
</script>




<!---UserSubmittedRadioStation--->
<!-------CuteRadioBG---->
<style>.tile-sectionradio {background-image: url('https://cdn4.iconfinder.com/data/icons/christmas-belle/192/radio-512.png');background-repeat: repeat;background-size: 90px;animation: scroll45deg 2s linear infinite;}@keyframes scroll45deg {0% {background-position: 0 0;}100% {background-position: 90px 90px;}}</style><div class="tile-sectionradio">
<u><h1 style="font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; font-size: 28px; color: #555; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3); letter-spacing: 2px;"><a target="_blank" href="https://alcea-wisteria.de/PHP/0demo/2024-02-05-UrlValueBasedCommentSystem/httpsalceawisderadiohtml.json" style=color:black>User</a> Submitted Radio</h1></u>
<!----SubmitCode----->
<div id="comments"></div>
<hr>
<form action="" method="POST" id="commentForm">
    <input type="text" name="name" placeholder="Station Name"><br>
     <textarea name="comment" rows="1" cols="50" placeholder="stream https:// url"></textarea>
  <input type="hidden" name="jsonFilename" value="" id="jsonFilenameInput">
  <input type="submit" value="Submit" onclick="return submit_comment()"><br>
</form>
<script>
  window.addEventListener("DOMContentLoaded", function() {
    var urlbase = "https://alcea-wisteria.de/PHP/0demo/2024-02-05-UrlValueBasedCommentSystem/";
    var url = window.location.href;
    var jsonFilename = url.replace(/[^A-Za-z0-9]/g, "") + ".json";
    var jsonUrl = urlbase + jsonFilename;
    document.getElementById("jsonFilenameInput").value = jsonFilename;
    document.getElementById("commentForm").action = urlbase + "submit_comment.php";
    fetch(jsonUrl)
      .then(response => response.json())
      .then(data => {
        if (Array.isArray(data)) {
          data.reverse();
          data.forEach(entry => {
            var comment = entry.comment;
            var name = entry.name;
            renderComment(name, comment);
          });
        } else {
          console.log("No comments found for the current URL.");
        }
      })
      .catch(error => {
        console.log("Error fetching JSON file:", error);
      });
  });
  function renderComment(name, comment) {
    var commentsElement = document.getElementById("comments");
    var commentElement = document.createElement("div");
    commentElement.innerHTML = "<strong>" + name + "</strong>: " + comment;
    commentsElement.appendChild(commentElement);
  }
  function submit_comment() {
  var nameInput = document.querySelector('input[name="name"]');
  var nameValue = nameInput.value;

  var commentInput = document.querySelector('textarea[name="comment"]');
  var commentValue = commentInput.value;

  // Check if the name field contains "<" and the comment field includes "http"
  if (nameValue.includes('<') || !commentValue.includes('http')) {
    alert('Invalid input: Please make sure the Name field does not contain "<" and the Comment field includes "http".');
    return false; // Prevent form submission
  }

  // If all validations pass, proceed with the existing logic
  commentInput.value = '<a href="#" onclick="document.getElementById(\'urlInput\').value = \'' + commentValue + '\'; return false;">' + commentValue + '</a>';
  return true; // Allow form submission
}
</script>
</div> <!----to keep bg locked till here-->



<details><summary>file</summary><input type="file" id="fileInput"></details>
<details><summary>PHPTitlefetch</summary>
<plaintext>
<?php
function getStreamMetadata() {
    if (isset($_GET['streamurl'])) {
        $streamUrl = $_GET['streamurl'];
        $needle = 'StreamTitle=';
        $ua = 'Dailymate Radio/1.0';
        $opts = ['http' => ['method' => 'GET',
        'header' => 'Icy-MetaData: 1',
        'user_agent' => $ua]
                ];
        $context = stream_context_create($opts);
        $icyMetaIntFound = false;
        $icyInterval = -1;
        $offset = 0;
        if(($headers = get_headers($streamUrl, 0, $context))) {
            foreach($headers as $h) {
                if(!(strpos(strtolower($h), 'icy-metaint:') === false)) {
                    $icyMetaIntFound = true;
                    $icyInterval = explode(':', $h)[1];
                    break;
                }
            }
        }
        if(!$icyMetaIntFound) {
            echo "icy-metaint header not exists!";
            return;
        }
        if($stream = fopen($streamUrl, 'r', false, $context)) {
            while($buffer = stream_get_contents($stream, $icyInterval, $offset)) {
                if(strpos($buffer, $needle) !== false) {
                    fclose($stream);
                    $title = explode($needle, $buffer)[1];
                    return substr($title, 1, strpos($title, ';') - 2);
                }
                $offset += $icyInterval;
            }
        }
    } else {
        // The 'streamurl' parameter is not set
    }
}
echo getStreamMetadata();
?>
